/*STYLE COMO-HACEMOS*/


video {
    width: 100%;
}

.hacemos-container {
    width: 100%;
    background-color: #FAFAFA;
}
/* OS SECTION TITULO */

.os_title_section{
    padding: 85px 0;
    text-align: center;
    margin-top: 14px;
    height: 170px;
    font-family: "Aeonik-Light";
}

.os_title{
    font-size: 3.7vw;
    color: #343434;
    letter-spacing: 0.2em;
}

.os_title span{
    color: #cdae7d;
}

.os_line_left, .os_line_right{
    background-color: #CDAE7D;
    border: 1px solid #CDAE7D;
    width: 10%;
    position: absolute;
}

.os_line_left{
    float: left;
    left: 5%;
    top: 20rem;
}

.os_line_right{
    float: right;
    right: 5%;
    top: 20rem;

}

@media only screen and (max-width: 600px) {
    .os_title_section{
        padding: 60px 0;
        margin-top: 5px;
        height: 230px;
    }

    .os_title{
        font-size: 40px;
        padding: 0px 60px;
    }

    .os_line_right{
    float: right;
    right: 5%;
    top: 250px;
    }

    .os_line_left{
    float: left;
    left: 5%;
    top: 250px;
    }

    .button_pdf {
        width: 100%;
    }

}


/* HORRIBLE! */

.hacemos-principal {
    text-align: center;
    height: 534px;
    display: grid;
    grid-gap: 0px;
    grid-template-columns: 100%;
    grid-template-rows: 30% 40% 30%;
}

.titulo {
    font-family: "Aeonik-Light";
    font-size: 5.2vw;
    line-height: 100%;
    letter-spacing: 8px;
    color: #343434;
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 2;
    grid-row-end: 2;
    z-index: 0;
}

.titulo span {
    font-family: 'Aeonik-Light';
    letter-spacing: 8px;
    color: #cdae7d;
    font-size: 5.2vw;
}

.hoja {
    grid-column-start: 1;
    grid-row-start: 3;
    grid-row-end: 3;
    z-index: 100;
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.video {
    margin-top: 5%;
    width: 90%;
    margin: auto;
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: 15% 45% 20% 20%;
    margin-bottom: -150px;
}

.margen_forzado {
    width: 100%;
    height: 100px;
    background-color: transparent;
}

.num-video__1 {
    padding-left: 5%;
    font-family: 'Aeonik-Regular';
    font-size: 16px;
    margin-bottom: 10px;
}

.num-video__2 {
    padding-right: 5%;
    font-family: 'Aeonik-Regular';
    font-size: 16px;
    margin-bottom: 10px;
    text-align: right;

}

.num-video {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 1;
    grid-row-end: 2;
    z-index: 0;
    padding-top: 1%;
}



.num-video-v2 {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 1;
    grid-row-end: 2;
    z-index: 0;
    padding-top: 1%;
    display: flex;
    justify-content: flex-end;
}

.num-video p {
    font-family: 'Aeonik-Regular';
    font-size: 16px;
}

.num-video-v2 p {
    font-family: 'Aeonik-Regular';
    font-size: 16px;
}

.video-video {
    height: 700px;
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 2;
    grid-row-end: -2;
    z-index: 0;
}

.info-video {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 3;
    grid-row-end: 5;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60%;
    margin: auto;
    padding: 50px 0px;
}

.info-video ul {
    margin: auto;
    width: 100%;
    padding: 3%;
    background-color: #F5F5F5;
}

.tit-video {
    margin-top: 5%;
    font-family: 'Aeonik-Bold';
    font-size: 16px;
    letter-spacing: 0em;
}

.txt-video {
    margin-top: 3%;
    font-family: 'Aeonik-Regular';
    font-size: 0.938vw;
    letter-spacing: 0em;
}

.img_mobile-video {
    display: none;
    font-family: 'Aeonik-Bold';
    font-size: $font-5-size;
}

.button_pdf {
    width: auto;
    height: auto;
    padding: 2%;
    border-radius: 50px 50px 50px 50px;
    background-color: #f5f5f5;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    border-width: 1px;
}

.button_pdf:hover {
    background-color: #cdae7d;
    color: #fff;
}

.button_pdf a {
    color: #000;
    display: inline-block;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    margin: 0;
}

.button_pdf a:hover {
    text-decoration: none
}
/* SECTION REVIEW */

.container__review__titulo {
    width: 100%;
    text-align: center;
}

.review {
    position: relative;
    background-color: #fff;
    padding-bottom: 200px;
    padding-top: 60px;
    margin-top: 0px;
}

.review_titulo {
    font-family: 'Aeonik-Light';
    color: #343434;
    font-size: 5.2vw;
    text-align: center;
    margin-bottom: 80px;
    letter-spacing: 20px;
}

.hoja_review {
    position: absolute;
    top: -42px;
    left: 0;
}

.hoja_review img {
    width: 300px;
    height: 300px;
}

.review__container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    grid-gap: 70px;
}

.review__item {
    background-color: #fafafa;
    height: 600px;
    text-align: center;
    box-shadow: 20px 25px 20px rgba(81, 81, 81, 0.05);
    border-radius: 38px;
}

.review__item_logo {
    margin-top: 50px;
    margin-bottom: 15px;
}

.review__item__title {
    color: #d7d7d7;
    font-size: 1.042vw;
    width: 100%;
    margin-top: 15px;
}

.review__item__linea {
    border: 1px solid #D7D7D7;
    background-color: #D7D7D7;
    transform: rotate(-90deg);
    width: 50.5px;
    margin: 35px auto;
}

.review__item__comen {
    color: #343434;
    font-size: 1.502vw;
    width: 80%;
    margin: auto;
    font-weight: 700;
    font-family: Aeonik-Light,Arial;
    line-height: normal;
}
}

.review__item__linea__proyect {
    font-size: 1.042vw;
    color: #d7d7d7;
    width: 100%;
    margin-bottom: 40px;
}

.review__item__name {
    color: #343434;
    font-size: 0.8vw;
    font-family: Aeonik-Light,Arial;
}


#review_item_2 {
    /*transform: scale(1.2);*/
}
/*CaseStudy - OCT*/

.CaseStudy {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.tit_main-CaseStudy {
    width: 100%;
    margin: 10% 10%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.tit_main-CaseStudy p {
    font-family: 'Aeonik-Light';
    font-size: 5.2vw;
    line-height: 100%;
    text-align: center;
    letter-spacing: 0.2em;
    color: #343434;
}

.box-1 {
    margin-top: 5%;
    width: 90%;
    display: grid;
    grid-template-columns: 44% 54%;
    grid-template-rows: auto;
    grid-gap: 1%;
}

.img-CaseStudy-b1 {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
}

.img-CaseStudy-b1 img {
    width: 100%;
}

.info-CaseStudy-b1 {
    grid-column-start: 2;
    grid-column-end: -1;
    grid-row-start: 1;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.info-CaseStudy-b1 ul {
    width: 90%;
}

.box-2 {
    margin-top: 5%;
    width: 90%;
    display: grid;
    grid-template-columns: 54% 44%;
    grid-template-rows: auto;
    grid-gap: 1%;
}

.img-CaseStudy-b2 {
    grid-column-start: 2;
    grid-column-end: -1;
    grid-row-start: 1;
}

.img-CaseStudy-b2 img {
    width: 100%;
}

.info-CaseStudy-b2 {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.info-CaseStudy-b2 ul {
    width: 90%;
    text-align: right;
}

.num-CaseStudy {
    font-family: "Aeonik-Regular";
    font-size: 16px;
    letter-spacing: 0em;
    color: #D7D7D7;
}

.tit-CaseStudy {
    font-family: "Aeonik-Regular";
    font-size: 2.08vw;
    letter-spacing: 0.15em;
    color: #CDAE7D;
    line-height: 105%;
}

.txt-CaseStudy {
    margin-top: 3%;
    font-family: "Aeonik-Light";
    font-size: $font-6-size;
    line-height: 30px;
    letter-spacing: 0.15em;
}

.cont-CTA-CaseStudy {
    width: 100%;
    padding-top: 5%;
    z-index: 999;
    position: relative;
}

.cont-CTA-CaseStudy-b2 {
    width: 100%;
    padding-top: 5%;
    display: flex;
    justify-content: flex-end;
}

.casos__button {
    border: 1px solid #CDAE7D;
    box-sizing: border-box;
    border-radius: 88px;
    background-color: #CDAE7D;
    width: 440px;
    margin: auto;
    margin-top: 100px;
    margin-bottom: 100px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Aeonik-Regular';
    color: #fff;
    text-decoration-color: #fff;
}

.casos__button:hover {
    text-decoration: none;
}

.casos__button span {
    font-family: 'Aeonik-Regular';
    color: #fff;
    text-decoration-color: #fff;
    font-size: 1.8vw;
}
/* Para 900px */

@media only screen and (max-width: 900px) and (min-width: 600px) {
.titulo {
    font-family: "Aeonik-Light";
    font-size: 55px;
    line-height: 100%;
    letter-spacing: 8px;
    color: #343434;
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 2;
    grid-row-end: 2;
    z-index: 0;
}
.titulo span {
    font-family: "Aeonik-Light";
    letter-spacing: 8px;
    color: #CDAE7D;
    font-size: 55px;
}
/* CaseStudy */
.box-1 {
    margin-top: 5%;
    width: 90%;
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
    grid-gap: 1%;
}
.img-CaseStudy-b1 {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 2;
}
.info-CaseStudy-b1 {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 2;
    grid-row-end: -1;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3%;
}
.box-2 {
    margin-top: 5%;
    width: 90%;
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
    grid-gap: 1%;
}
.img-CaseStudy-b2 {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 2;
}
.info-CaseStudy-b2 {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 2;
    grid-row-end: -1;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3%;
}
.info-CaseStudy-b2 ul {
    width: 90%;
    text-align: left;
}
.cont-CTA-CaseStudy-b2 {
    width: 100%;
    padding-top: 5%;
    display: flex;
    justify-content: flex-start;
}
.txt-CaseStudy {
    margin-top: 3%;
    font-family: "Aeonik-Light";
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 0.15em;
}
/* SECTION VIDEOS */
.info-video ul {
    margin: auto;
    width: 75%;
    padding: 3%;
    background-color: #F5F5F5;
}
.info-video ul li img {
     display: none;
 }
.img_mobile-video {
    display: block;
    font-family: 'Aeonik-Bold';
    font-size: 30px;
}
.review__item__comen {
    font-size: 25px;
}
video {
    height: 102%;
    width: 102%;
}
}

/*mobile*/
@media only screen and (max-width: 600px) and (min-width: 200px) {
.video-video img{
    margin: auto;
}
#review_item_2{
    transform: scale(1);
}
.num-video__1 {
    font-size: 2.042vw;
}
.num-video__2 {
    font-size: 2.042vw;
    text-align: right;
}
.video {
    grid-template-rows: 1% 45% 20% 20%;
}
/**/
.titulo {
    margin-top: -10%;
    font-size: 40px;
}
.titulo span {
    font-family: "Aeonik-Light";
    letter-spacing: 8px;
    color: #CDAE7D;
    font-size: 40px;
}
.hoja img {
    width: 120px;
}

.line_der_tittle {
    position: absolute;
    border: 1px solid #CDAE7D;
    width: 8%;
    top: 265px;
    right: 10%;
    background-color: #CDAE7D;
}

.line_izq_tittle {
    position: absolute;
    border: 1px solid #CDAE7D;
    width: 8%;
    top: 265px;
    left: 10%;
    height: 0;
    background-color: #CDAE7D;
}
.container__review__titulo {
    width: 100%;
    text-align: center;
    margin-bottom: 25px;
}
.review_titulo {
    font-family: "Aeonik-Light";
    color: #343434;
    text-align: center;
    margin-bottom: 200px;
    font-size: 40px;
    letter-spacing: 7px;
}
.review__item__linea__proyect {
    font-size: 3.042vw;
    margin-bottom: 0;
}
.review__item__name {
    font-size: 2.325vw;
}
/* CaseStudy */
.box-1 {
    margin-top: 5%;
    width: 90%;
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
    grid-gap: 1%;
}
.img-CaseStudy-b1 {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 2;
}
.info-CaseStudy-b1 {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 2;
    grid-row-end: -1;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3%;
    margin-bottom: 9%;
}
.box-2 {
    margin-top: 5%;
    width: 90%;
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
    grid-gap: 1%;
}
.img-CaseStudy-b2 {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 2;
}
.info-CaseStudy-b2 {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 2;
    grid-row-end: -1;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3%;
    margin-bottom: 9%;
}
.info-CaseStudy-b2 ul {
    width: 90%;
    text-align: left;
}
.cont-CTA-CaseStudy-b2 {
    width: 100%;
    padding-top: 5%;
    display: flex;
    justify-content: flex-start;
}
.txt-CaseStudy {
    font-family: "Aeonik-Light";
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.15em;
    padding-bottom: 3%;
}
.tit-CaseStudy {
    font-family: "Aeonik-Regular";
    font-size: 25px;
    letter-spacing: 0.2em;
    padding-bottom: 3%;
}
.num-CaseStudy {
    font-family: "Aeonik-Regular";
    font-size: 12px;
    letter-spacing: 0em;
    color: #D7D7D7;
    padding-bottom: 7%;
}
.tit-CaseStudy p {
    font-family: 'Aeonik-Light';
    font-size: 40px;
    line-height: 100%;
    text-align: center;
    letter-spacing: 0.2em;
    color: #343434;
}
.tit_main-CaseStudy {
    width: 100%;
    margin: 20% 20%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.tit_main-CaseStudy p {
    font-family: 'Aeonik-Light';
    font-size: 40px;
    line-height: 100%;
    text-align: center;
    letter-spacing: 0.2em;
    color: #343434;
}
/* SECTION VIDEOS */
.info-video {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 3;
    grid-row-end: -1;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 75%;
    margin: auto;
}
.info-video ul {
    margin: auto;
    width: 100%;
    padding: 5%;
}
.info-video ul li img {
    display: none;
}
.video-video {
    height: 300px;
}
.img_mobile-video {
    display: block;
    font-family: 'Aeonik-Bold';
    font-size: 30px;
}
.img_mobile-video {
    display: block;
    font-family: "Aeonik-Bold";
    font-size: 20px;
}
.tit-video {
    margin-top: 5%;
    font-family: "Aeonik-Bold";
    font-size: 14px;
    letter-spacing: 0em;
}
.txt-video {
    margin-top: 3%;
    font-family: "Aeonik-Regular";
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0em;
}
/*Reviews*/
.review {
    margin-top: 10%;
    padding-bottom: 40px;
}
.review_titulo {
    font-family: "Aeonik-Light";
    color: #343434;
    font-size: 40px;
    text-align: center;
    margin-bottom: 0;
    letter-spacing: 7px;
}
.review__container {
    display: grid;
    grid-template-columns: 100%;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    grid-gap: 70px;
}
.review__item {
    /*margin-top: 25%;*/
    background-color: #FAFAFA;
    height: 630px;
    text-align: center;
    box-shadow: 20px 25px 20px rgba(81, 81, 81, 0.05);
    border-radius: 38px;
}
.hoja_review img {
    width: 35%;
    margin-top: 40%;
    height: auto;
}
.review__item__comen {
    font-size: 25px;
}
video {
    height: 102%;
    width: 102%;
}

.num-video__1, .num-video__2{
    font-size: 4.042vw !important;
}

.review__item__title, .review__item__linea__proyect, .review__item__name{
    font-size: 5.042vw !important;
}

.casos__button {
    width: 89%;
}

.casos__button span {
    font-size: 4.8vw;
}

}

@media only screen and (min-width: 960px) and (max-width: 1600px) {
.titulo,
.titulo span {
    letter-spacing: 0.23em;
}
.img-video img {
    width: 9.333vw;
}
.hoja img {
    width: 11vw;
}
.hoja_review img {
    width: 290px;
}
.hacemos-principal {
    grid-template-rows: 35% 43% 18%;
}
.txt-CaseStudy {
    font-size: 1.5vw;
    letter-spacing: 0.24em;
}
.tit_main-CaseStudy {
    margin-bottom: 5%;
}
.box-1 {
    margin-top: 7%;
    width: 95%;
    grid-template-columns: 45% 53%;
}
.box-2 {
    margin-top: 9%;
    width: 95%;
    grid-template-columns: 53% 45%;
}
.review__item__title
__2 {
    font-size: 0.7vw;
    color: #D7D7D7;
}
.review__item__comen {
    font-size: 1.502vw;
    width: 76%;
    font-weight: 700;
    font-family: Aeonik-Light,Arial;
    line-height: normal;
}
.review__item__linea__proyect {
    margin-bottom: 10px;
    font-size: 1.042vw;
    color: #919191;
    width: 100%;
}
.review__item {
    height: 520px;
}
.review__item_logo {
    margin-top: 30px;
}
.review__item_logo img {
    height: 50px;
}
.review__item_logo__2 img {
    height: 20px;
}
.review__item__linea {
    width: 22.5px;
}
.info-video ul {
    padding-bottom: 13%;
}

.line_der_tittle {
    position: absolute;
    border: 1px solid #CDAE7D;
    width: 8%;
    top: 445px;
    right: 10%;
    background-color: #CDAE7D;
}

.line_izq_tittle {
    position: absolute;
    border: 1px solid #CDAE7D;
    width: 8%;
    top: 445px;
    left: 10%;
    height: 0;
    background-color: #CDAE7D;
}
}

    .modal.show .modal-dialog {
    margin: auto !important;
}
.modal-header .close {
    padding: 1rem 1rem;
    margin: -1rem 0rem -1rem auto !important;
}
#close {
    color: #fff !important;
    display: inline-block;
    font-size: 45px !important;
    font-weight: 900 !important;
    line-height: normal;
    margin: 0;
}
#close_2 {
    color: #fff !important;
    display: inline-block;
    font-size: 45px !important;
    font-weight: 900 !important;
    line-height: normal;
    margin: 0;
}
.modal-content {
    background-color: #000 !important;
}

@media (min-width: 576px) {
.modal-dialog {
    max-width: 65%;
    margin: 1.75rem auto;
}
}
.modal-header .close {
    padding: 1rem 1rem;
    margin: -1rem 0rem -1rem auto !important;
}

.video-video img{
    margin:auto;
}

@media only screen and (min-width: 1820px) and (max-width: 2560px)  {
    .video-video img{
        margin:auto;
    }

    .info-video ul{
    padding: 18% 10%;
}

.txt-video{
    font-size: 1.38vw;
}
.tit-video{
    font-size: 2.042vw;
}
}

@media only screen and (min-width: 600px) and (max-width: 960px) {
    
    .txt-video{
    font-size: 1.4vw;
}
.tit-video {
    font-size: 1.9vw;
}
    .video-video img{
    }

    .box-1, .box-2 {
    margin-left: -7%;
    margin: auto;
}
    .video {
    margin: auto;
}

.img-CaseStudy-b1 img{
    width: 98%;
}

.review__container{ 
    width: 90%;
    margin-left: 1%;
}
    .num-video__2{
    padding-right: 8%;
    }
    .num-video__1{
    padding-left: 8%;
    }

    .info-video {
    grid-column-start: 1;
    grid-column-end: -1;
    grid-row-start: 2;
    grid-row-end: -1;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60%;
    margin: auto;
    margin-top: 44%;
}
.info-video{
        width: 90%;
        margin: auto;
        margin-top: 41%;
    }
    .info-CaseStudy-b1,  .info-CaseStudy-b2{
    margin-bottom: 7%;
}
 .review {
    margin-top: 10%;
}
.review_titulo {
    font-family: "Aeonik-Light";
    color: #343434;
    font-size: 40px;
    text-align: center;
    margin-bottom: 0;
    letter-spacing: 7px;
}
.review__container {
    display: grid;
    grid-template-columns: 100%;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    grid-gap: 70px;
}
.review__item {
    margin-top: 25%;
    background-color: #FAFAFA;
    height: 600px;
    text-align: center;
    box-shadow: 20px 25px 20px rgba(81, 81, 81, 0.05);
    border-radius: 38px;
}
.hoja_review img {
    width: 35%;
    margin-top: 40%;
    height: auto;
}
.review__item__comen {
    font-size: 25px;
}
.review__item__linea__proyect{
    font-size: 2.042vw;
    color: #D7D7D7;
    width: 100%;
    margin-bottom: 40px;
}

.review__item__name {
    color: #343434;
    font-size: 1.625vw;
}

.button_pdf {
    width: auto;
    height: auto;
    padding: 2%;
    border-radius: 50px 50px 50px 50px;
    background-color: #f5f5f5;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.button_pdf a {
    color: #000;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    margin: 0;
}

}
button {
    border: 0;
    border-radius: 0;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

button {
    background: transparent;
    cursor: pointer;
}

button::-moz-focus-inner {
    border: 0;
}