.phone-movil {
    z-index: 25;
}

a {
    cursor: pointer;
}
.designThinkWrap {
    background: #000;
}
.topHeaderWrap {
    background: url('/assets/images/innovacion/innovacion-header.jpg') no-repeat center; background-size: cover;
    height: 800px;
}
.topHeaderWrap {
    position: relative;
}
.layerBlack {
    position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.89) url('/assets/images/innovacion/pattern.png') repeat;
}
.texto{
    max-width: 600px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: #fff; z-index: 20;
}
.texto h2, .texto p {
    width: 50%; float: left;
}
.texto p {
    font-size: 22px; line-height: 150%;
}
.texto h2 {
    text-align: right; padding-right: 20px; text-transform: uppercase; font-size: 70px; line-height: 110%;
}
.texto h2 span{
    color: #ff7800;
}
.degBlack {
    background-image: linear-gradient(to top, #000 0%, rgba(0, 0, 0, 0.58) 60%, rgba(0, 0, 0, 0) 100%); position: absolute;
    bottom: 0; height: 60%; z-index: 10; width: 100%;
}

/*PREGUNTAS*/
.questionWrap {
    display: table; width: 70%; margin: 0 auto; position: relative; top: -70px; z-index: 21;
}
.questionWrap img, .questionsTxt  {
    display: inline-block; vertical-align: middle; width: 49%;
}
.questionWrap img {
    max-width: 540px;
}
.questionsTxt {
     padding-left: 50px; font-size: 18px;
}
.questionsTxt ul span{
    color: #ff7800; display: block; margin-top: 20px;
}
.questionsTxt ul li {
    color: #fff; padding-bottom: 7px; font-weight: 100;
}

/*USER CENTERED*/
.userCenterWrap {
    width: 70%; margin: 0 auto 90px;
}
.titleBig {
    position: relative;
}
.txtBack h2{
    font-size: 150px; text-transform: uppercase; color: rgba(255, 255, 255, 0.04);
}
.txtBack {
    position: absolute; left: 50%; transform: translateX(-50%); letter-spacing: 20px;
}
.txtFront {
    position: relative; z-index: 1; text-align: center; padding: 50px 0;
}
.txtFront h2{
    color: #ff7800; text-transform: uppercase; font-size: 70px; line-height: 90%;
}
.txtFront h3 {
    font-size: 20px; font-family: 'Lato', sans-serif; color: #fff;
}
.userCenterWrap p {
    text-align: center; max-width: 740px; width: 90%; color: #fff; font-weight: 100; margin: 0 auto; font-size: 18px; line-height: 150%;
}

/*TCUX*/
.tcuxWrap{
    width: 100%; background: #2c2c2c;
}
.tcuxLeft, .tcuxRight {
    width: 49%; display: inline-block; vertical-align: middle;
}
.tcuxLeft {
    background: url('/assets/images/innovacion/innovacion-03.jpg') no-repeat center; background-size: cover;
    height: 640px; position: relative;
}
.tcuxLeft h4 {
    text-align: right; padding-right: 30px; text-transform: uppercase; color: #fff; font-size: 45px;
    position: absolute; right: 30px; max-width: 300px; top: 80px;
}
.tcuxRight {
    padding: 20px 50px 0;
}
.tcuxRight h5 {
    font-size: 24px; color: #ff7800; font-weight: 100; width: 100%;
    max-width: 550px; margin-bottom: 30px;
}
.tcuxRight p{
    font-size: 18px; color: #fff; font-weight: 100; line-height: 150%; margin-bottom: 25px;
}
.txucConoce span {
    color:  #ff7800; font-size: 16px; font-weight: 100; display: block; margin-bottom: 30px;
}
.tcuxRight .icon {
    display: inline-block; width: 32%;
}
.icon-bg {
    background-size: contain; height: 50px; width: 50px; background-repeat: no-repeat; position: absolute;
}
.icon-01 {
    background-image: url('/assets/images/innovacion/icon-01.png')
}
.icon-02 {
    background-image: url('/assets/images/innovacion/icon-02.png')
}
.icon-03 {
    background-image: url('/assets/images/innovacion/icon-03.png')
}
.icon {
    cursor: pointer;
}
.icon strong {
    font-family: 'Fjalla One', sans-serif; font-size: 18px; color: #fff; font-weight: 100; margin: 15px 0 0 20px; display: inline-block;
    position: relative; cursor: pointer;

}
.icon strong::before {
    -webkit-transition: 0.3s ease-out;  -moz-transition: 0.3s ease-out;-ms-transition: 0.3s ease-out;-o-transition: 0.3s ease-out; transition: 0.3s ease-out;
    content: ''; background: rgba(255, 120, 0, 0);   width: 40%; height: 5px; position: absolute; bottom: -5px; cursor: pointer;
}
.icon strong:hover::before{
     background: #ff7800; left: 0;
}

.desEbookRect {
    border-top: 1px solid #ff7800; padding:10px 0 0; margin-top: 30px;
}
.desEbookRect h6 {
    color: #fff; font-weight: 100; font-size: 11px;
}
.desEbookRect p {
    font-size: 11px!important; font-style: italic; font-weight: 100; color: rgba(255, 255, 255, 0.31);
}
.desEbookRect:hover h6{
    color: #ff7800; text-decoration: underline;
}



/*FORMULARIO*/
.formInnovacionWrap {
    background: #fff; padding: 90px 0;
}
.formInnovacionCont {
    width: 90%; max-width: 1200px; margin: 0 auto;
}
.formRight, .formLeft {
    display: inline-block; vertical-align: top;
}
.formRight {
    width: 65%;
}
.formLeft {
    width: 34%;
}
.formInnovacionWrap h2 {
    font-size: 60px; color: #ff7800; text-transform: uppercase; max-width: 400px; position: relative;
}
.formInnovacionWrap h2::before {
    content: ''; background: #ff7800; height: 5px; width: 80px; position: absolute; bottom: 0;
}
.formLeft p {
    margin: 20px 0 0;
}

.formInnovacionWrap input[type=text],
.formInnovacionWrap input[type=number],
.formInnovacionWrap input[type=email],
.formInnovacionWrap textarea {
    border: 1px solid #ccc;
    width: 100%;
    height: 50px;
    padding: 0 10px;
    font-size: 14px;
    appearance: none;
    -webkit-appearance: none;
    background: #fff;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    margin: 0;
}
.formInnovacionWrap input[type=submit] {
    -webkit-appearance: none;
    background: #fff;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    border: none;
    color: #ff7800;
    font-size: 30px;
    text-transform: uppercase;
    font-family: 'Fjalla One', sans-serif;
    margin: 5px 0 0;
}
.formInnovacionWrap textarea {
    height: auto; padding: 10px;
}
.field {
    display: table; width: 100%; height: auto; padding-bottom: 10px;
}
.fLeft {
    float: left; width: 50%; padding-right: 5px;
}
.fRight {
    float: left; width: 50%; padding-left: 5px;
}


@media screen and (max-width: 1500px){
    .topHeaderWrap {height: 600px;}
    .texto h2 {font-size: 60px;}
    .texto p {font-size: 18px;}
    .questionsTxt {font-size: 16px;}
    .txtFront h2 {font-size: 60px;}
    .tcuxRight h5 {font-size: 20px}
    .tcuxRight p {font-size: 16px;}
}
@media screen and (max-width: 900px){
    .texto {text-align: center;}
    .texto h2 {text-align: center;}
    .texto h2, .texto p {float: none;width: 100%;}
    .formLeft, .formRight {width: 100%; }
    .formInnovacionWrap h2 {font-size: 40px; max-width: 100%;}
    .formLeft p {margin: 20px 0;}
}
@media screen and (max-width: 800px){
    .texto {width: 80%;}
    .topHeaderWrap {height: 500px;}
    .tcuxLeft, .tcuxRight {width: 100%;}
    .tcuxLeft {height: 300px;}
    .tcuxRight {padding: 30px;}
    .questionWrap {width: 85%;}
    .questionWrap img, .questionsTxt {width: 100%;}
    .questionsTxt {padding-left:0; padding-top: 30px;}
    .txtBack {letter-spacing: 0;}
    .userCenterWrap {width: 90%;}
    .userCenterWrap p {font-size: 16px;}
}
@media screen and (max-width: 500px){
    .tcuxRight .icon {width: 100%}
    .icon-01, .icon-02, .icon-03 {background-image: none;}
    .txucConoce span {margin-bottom: 10px;}
    .formInnovacionWrap {padding: 60px 0;}
    .formInnovacionWrap h2 {font-size: 25px;}
    .texto h2 {font-size: 40px;}
    .tcuxLeft h4 {font-size: 35px; right: 0; top: 20px}
    .txtFront h2 {font-size: 40px;}
    .fLeft, .fRight {width: 100%;}
    .fLeft, .fRight {width: 100%; padding: 0;}
    .field {padding: 0;}
    .formInnovacionCont input[type=text],
    .formInnovacionCont input[type=number],
    .formInnovacionCont input[type=email],
    .formInnovacionCont textarea { margin-bottom: 10px;}
}