.tp-charsplit{
    font-family: montserrat,sans-serif;
    font-weight: lighter;
}

h2, .h2 {
    font-family: montserrat,sans-serif;
    font-weight: lighter;
    letter-spacing: 0.2em;
}

.font-index1{
    /* font-family: montserrat,sans-serif !important; */
    font-weight: lighter !important;
    /* font-size: 24px !important; */
    margin-top: 5%;
    /* background-color: #998b7780 !important; */
}

.border-index1{
    border-top: 5px solid #998b77;
    width: 30%;
 
}

.bg-index1:hover, .bg-index1:focus {
    background-color: #998b77 !important; 
    
}

.font-index1 > span{
    font-weight: lighter !important;
    font-size: 24px !important;
}

.text-index1{
    color: #ffffff;
    font-size: 20px;
    font-weight: lighter;
}

.text-index2{
    font-size: medium !important;
    font-weight: lighter !important;
}

.text-index3 {
    color: #ffffff;
    font-size: revert;
    font-weight: lighter;
}

.text-index4{
    font-size: small;
    letter-spacing: .2em;
    font-weight: 100;
}

.text-index5{
    font-size: larger;
    font-weight: 100;
}

.text-index6{
    font-weight: 100;
    font-size: medium;
    margin: 0;
    margin-right: -.32em;
    text-transform: uppercase;
    line-height: 1.2;
    letter-spacing: .32em;
}


.text-primary-index1 {
    color: #e61c1c;
}

.text-primary-index2 {
    color: #000000;
}

.color-white{
    color: white;
}

.brand-panel-index1 {
    position: absolute;
    z-index: 4;
    left: 0;
    top: 0;
    width: 39.6vmin;
    height: auto;
    padding: 4.8vmin 2em;
    background-color: #7575753d;
    text-align: center;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.footer {
    text-align: center;
    margin: 0;
    font-size: 12px;
    background: #c5ac8ea3;
}

.font-medium{
    font-size: medium;
}

.clients-list .client {
    display: inline-block;
    vertical-align: bottom;
    padding: 3.8em 1.95em 0;
    margin: 0;
}

.clients-list .client img {
    opacity: 0.8;
}

.width50{
    width: 100%;
}

.bg-index1{
    background: #625b51;
}

.bg-index2{
    background: #272727;
}

.bg-index3{
    background: #272727c2;
}


.mb1{
    margin-bottom: 1%;
}

.mb2{
    margin-bottom: 10px;
}

.mt2{
    margin-top: 2%;
}

.mb5{
    margin-bottom: 5%;
}

.ml2{
    margin-left: 2em !important; 
}

.ml0{
    margin-left: 0em !important; 
}

.slider-index1{
    z-index: 5; 
    min-width: 1100px; 
    max-width: 1100px; 
    white-space: nowrap;
    font-size: 50px; 
    line-height: 80px; 
    font-weight: lighter; 
    color: rgba(255, 255, 255, 1.00);
    text-transform:uppercase;
    letter-spacing:16px;
    text-align:right;
}

    .slider-index2{
        z-index: 6; 
        white-space: nowrap;
        font-size: 18px; 
        line-height: 30px;
        font-weight: lighter;
        color: rgba(255, 255, 255, 1.00);       
        text-align:right;
    }

    .navbar-desctop-menu li a:hover, .navbar-desctop-menu .active>a {
        color: #ffffff;
    }

    .navbar-desctop-menu>li>a {
        color: #ffffff;
        font-size: 20px;
        font-weight: lighter;
    }

    .bg-about {
        background: url(../img/about3.png) 50% 0 no-repeat;
        background-size: cover;
    }

    .fontxxlarge{
        font-size: xx-large;
    }

    .project figure:after {
        opacity: 0.3;
    }

    .project-details-info {
        background-color: #00000080;
        padding: 4.8em 3.1em;
        color: #fff;
    }

    .height-content{
        height: fit-content;
    }

    .pointer {
        cursor: pointer;
    }

    .img-logo-index1{
        height: 60px;       
    }

    .img-logo-index2 {
        height: 200px;
        background: white;
    }

    .img-logo-index3 {
        height: 150px;
        padding: 1%;
        background: #404040;
    }
    

    .patb2{
        padding-top: 2%;
        padding-bottom: 1%;
    } 


    .img-index2{
        height: 250px;
        object-fit: cover;
    }

    .img-index3{
        height: 700px;
        object-fit: cover;
    }


    .project-details-title:before {
        border-top: 0px solid #ededed;
    }

    .navbar-desctop.affix {
        background-color: #96969673;
    }

    .footer {
        background: #96969673;
    }

    .img-center-index1{
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 70%;
    }

    .center-index2{
        display: block;
        margin-left: auto;
        margin-right: auto;       
    }
   

    .text-center{
        text-align: center;
    }
    
    #center{
        text-align: center !important;
    }

    .navbar-desctop-menu {
        letter-spacing: 0em;
        font-size: .70em;
    }

   
    .project-details-title {
        position: relative;
        font-family: unset;
        font-weight: lighter;
        font-size: larger;
        line-height: 1.5;
        text-transform: uppercase;
        color: #fff;
        margin: 0 0 .7em;
        text-align: inherit;
    }

    .project-details-title2 {
        position: relative;
        font-size: larger;
        line-height: 2;
        text-transform: uppercase;
        color: #fff;
        margin: 0 0 .7em;
        text-align: center;
        font-family: oswald,sans-serif;
    }


    .page-lines .line {
        position: absolute;
        left: 0;
        width: 1px;
        height: 50000px;
        background: none;
    }

    .vertical-panel-title {       
        margin-bottom: 250px;
    }

    .color-index1{
        color: #c5a47e !important; 
    }


    .vertical-panel, .vertical-panel-content {
        height: 500px;
    }

    .manu-index1:hover {
        background: #292929;
    }


    h3, .h3 {
        font-family: unset;
    }

    .project-title {
        font-family: unset;
        font-weight: 100;
        color: #c5a47e;
        font-size: larger;
    }

    .lh_2{
        line-height: 2;
    }

    .contact-info {
        background: none;
    }

    .mt10{
        margin-top: 10%;
    }

    .logo
    {
        /* position: absolute;
        top: 20%;
        left: 20%;
        width: 400px;
        height: 300px; */
        background-size: 100%;
        transform: perspective(1000px) rotate(0deg) skew(0deg) translate(10%,-10%);
        box-shadow: -80px 80px 80px rgb(1 1 1 / 80%);
    }

    .logo:before{
        content: ' ';
        position: absolute;
        top: 13px;
        left: -25px;
        width: 25px;
        height: 100%;
        background: #262626;
        transform: rotate(0deg) skewY(-45deg);
    }

        .logo:after
        {
        content: ' ';
        position: absolute;
        bottom: -25px;
        left: -13px;
        width: 100%;
        height: 25px;
        background: #262626;
        transform: rotate(0deg) skewX(-45deg);
        }

    .height100{
        height: 100%;
        z-index: 0;
    }

    .logo_3d{
        transform: perspective(0px) rotateY(1deg);
        border-radius: 1rem;
        box-shadow: rgb(58 58 58) 5px 6px 0px 0px;
        transition: transform 1s ease 0s;
    }

    .logo_3d:hover {
        transform: perspective(3000px) rotateY(20deg);
    }

    .owl-index1{
        background: #272727;
        color: #c5a47e;
        padding: 2%;
        border-radius: 1rem;
    }

    .title-index1{
        font-weight: 100;
        font-size: small;
        text-transform: uppercase;
        letter-spacing: 0.2em;
        margin-top: 2%;
        margin-left: auto;
        width: 80%;
    }


    .project figure:after {
        background-color: unset;
    }

  .height20{
    height: 20px;
  }

  .height60{
    height: 60px;
  }

  .height-index1{
    height: 500px;
    overflow: auto;
  }

  .height-index2{
    height: 500px;
  }

  .opacity-9{
    opacity: 0.6;
  }


  .opacity-9:hover {
    opacity: 1;
}



@media (max-width: 767px) {
    .vertical-panel, .vertical-panel-content {
        height: 700px;
    }

    .text-center-mo{
        text-align: center !important;
    }

    .height-index1 {
        height: 290px;
    }

    .footer-index-mo{
        margin-top: 1% !important;
        margin-bottom: -5%;
    }

    .ma-to-un-mo{
        margin-top: unset;
    }

    .ma-to-5-mo{
        margin-top: 5%;
    }

    .fontxxlarge {
        font-size: x-large;
    }

    .height-index2 {
        object-fit: contain;
        height: 300px;
    }

    .img-logo-index3 {
        object-fit: contain;
    }


}