@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&display=swap');

:root {
    --primary: #EE4743;
    --white: #fff;
    --third-color:#AA7CF2;
    --para-color:#2E2E2E;
    --secondary-color:#EE6C6E;
    --btn-shadow:#F7848494;
    --bg-color:#F7F7F7;
}
body {
    font-family: 'Montserrat', sans-serif;
}
button {outline: none !important;cursor: pointer;}
.mt-top-1{margin-top:1rem;}
.mt-top-2{margin-top:1rem;}
.top-head{background: #252B42;}
.top-head ul{margin:0; padding:0;display: flex;justify-content: flex-end;}
.top-head ul li{display:inline-block; margin:0 35px 0 0;padding: 4px 0;} 
.top-head ul li:last-child{display:inline-block; margin:0 0 0 0;}    
.top-head ul li a{font-size:13px; color:#fff; font-weight:400; text-decoration: none;}
.top-head .fa-bars{display:none;}
.top-head .fa-bars{color:#fff;}
.top-head ul.social{justify-content: space-around;}
.top-head ul.social li{margin: 0 11px 0 0;}
.toppanel {margin: 0; padding: 0; z-index: 99; position: relative; background: #ff5722;}
.sticky { position: fixed; transition: 0.5s; top: 0;left: 0; width: 100%; background: #ff9800;    /* padding-left:.75rem;padding-right:.75rem; padding:11px; */}
.navbar-fixed {top: 0;z-index: 100;position: fixed;width: 100%;}
.navbar{padding-top: 0px; padding-bottom: 4px;}
.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link{color:#fff;font-size:16px; font-weight: 500;}
.navbar-light .navbar-nav .nav-link{    color:#000000; font-size:14px; font-weight: 600;}
.navbar-nav li{padding-right: 18px;}
.navbar-nav li:last-child{padding-right: 0;}
.sidenav {height: 100%; width: 0; position: fixed; z-index: 1; top: 0; left: 0; background-color: #fff; overflow-x: hidden; padding-top: 0;transition: 0.5s;}
.sidenav a.closebtn {border-bottom: none;border-top: none;}
.sidenav .closebtn {position: absolute;top: 0;right: 25px;font-size: 36px;margin-left: 50px;}
.sidenav a {padding: 10px 13px;text-decoration: none;font-size: 14px;color: #000;display: block;transition: 0.3s;}
.sidenav a h2 {font-size: 18px;color: #1F2121;font-weight: 500;padding-left: 38px;margin-bottom: 3px;}
/*.backtop{background:url(../images/cover.png) no-repeat; background-size: cover; height:400px; position: relative;}*/
    .backtop { background: #F7F7F7; background-size: cover; height: 400px; position: relative;}
@media only screen and (min-width: 1200px) and (max-width: 3640px) {
    .container { max-width: 1170px; }
}
.backtop .btn-link{font-weight: 600; font-size: 14px;color: #fff;text-decoration: none; margin-right:50px;}
.backtop .nav-link{font-weight: 600; font-size: 14px;color: #fff;text-decoration: none; margin-right:50px;}
.backtop .btn-warning{background: #FFA62B; padding: 6px 22px;border-radius: 20px;font-weight: 600; font-size: 14px;color: #fff;text-decoration: none;}
.backtop h1{font-weight: 600; font-size: 32px;color: #ff5722; line-height: 40px;}
.backtop p{font-weight: 300; font-size: 20px;color: #0b0964; line-height: 32px; text-align: justify;}
.bg-light {background-color:transparent!important;}
.carousel{background: #F7F7F7; padding-top:0px;padding-bottom: 0px;margin-bottom: 0rem;}
/*.carousel-indicators{background-color:transparent!important;}*/
.carousel h2 { font-weight: 600; font-size: 28px; color: #4800ff; text-align: center;}
.carousel p{font-weight: 500; font-size: 20px;color: #4800ff; text-align: center;}
.carousel-caption { bottom: 3rem; z-index: 10;}
.carousel-item { height: 32rem; background:transparent}
.carousel-item > img { position: absolute; top: 0; left: 0; min-width: 100%; height: 32rem;}


.how-to-work{background: #252B42;padding:2rem 0 5rem;}
.how-to-work h4{font-weight: 800; font-size: 28px;color: #fff; text-align: center;    margin-bottom: 5rem;}
.how-to-work ul{margin:0; padding:0; display:flex;     justify-content: space-between; text-align: center;}
.how-to-work ul li{background: #FFFFFF;padding: 20px 20px 6px;width: 21%; border-radius: 16px; display: inline-block; position: relative; cursor: pointer;}
.how-to-work ul li img{display: block;    margin: 0 auto 20px;}
.how-to-work ul li::before{content:" "; position: absolute;top: 50%;right: -63px;border-bottom: 8px solid #CFCFCF;width: 63px;}
.how-to-work ul li:last-child::before{border-bottom:none;}
.how-to-work ul li strong{font-weight: 600; font-size: 18px;color: #252B42;}
.how-to-work ul li hr{margin: 0.4rem 0;}
.how-to-work ul li p{margin-top:1rem;font-weight: 400; font-size: 16px;color: #252B42; line-height:22px;}
.how-to-work ul.design-card{margin:0; padding:0; display:flex;     justify-content: center; text-align: center;}
.how-to-work ul.design-card li{background: #FFFFFF;padding: 20px 20px 6px;margin-right: 55px; border-radius: 16px; display: inline-block; position: relative;}
.how-to-work ul.design-card li img{display: block;    margin: 0 auto 20px;}
.how-to-work ul.design-card li::before{content:" "; position: absolute;top: 50%;right: -63px;border-bottom: 8px solid #CFCFCF;width: 63px;}
.how-to-work ul.design-card li:last-child::before{border-bottom:none;}
.how-to-work ul li.design-card strong{font-weight: 600; font-size: 18px;color: #252B42;}
.how-to-work ul li.design-card hr{margin: 0.4rem 0;}
.how-to-work ul li.design-card p{margin-top:1rem;font-weight: 400; font-size: 16px;color: #252B42; line-height:22px;}
.how-to-work ul.design-card li:first-child{background:transparent;margin-right: -167px;}
.how-to-work ul.design-card li::after{content:" "; position: absolute;top: -10px;left: -54px; width: 131px; height:146px;}
.how-to-work ul.design-card li:first-child::before{border-bottom:none;}
.how-to-work ul.design-card li:nth-child(2):after{background:url(none);}
.how-to-work ul.design-card li:nth-child(3):after{background:url(none);}
.how-to-work ul.design-card li:nth-child(4):after{background:url(none);}
.why-chose{padding:5rem 0 5rem;background: #F7F7F7;}
.why-chose h3{font-weight: 800; font-size: 28px;color: #252B42; text-align: center;margin-bottom: 3rem;}
.why-chose strong{font-weight: 600; font-size: 18px;color: #000;margin-bottom: 1rem;display: inline-block;}
.crub{position: relative;}
.crub img{position: relative; left:235px;}
.why-chose ul{margin:0; padding:0;}
.why-chose ul li{position: relative; list-style-type: none;padding: 5px 30px;font-weight: 500; font-size: 18px;color: #000; line-height:30px;}
.why-chose ul li::after{content:" "; position: absolute; background:url(../images/chk-icon.png) no-repeat; width:14px; height:14px;    left: 0; top:13px;}
.issue{padding:5rem 0 5rem;background: #252B42;}
.issue h4{font-weight: 800; font-size: 28px;color: #fff;margin-bottom: 3rem; text-align: center;}
.cuadro_intro_hover{
    padding: 0;
    position: relative;
    overflow: hidden;
    height: 329px;
}
.cuadro_intro_hover:hover .caption{
    opacity: 1;
    transform: translateY(-150px);
    -webkit-transform:translateY(-150px);
    -moz-transform:translateY(-150px);
    -ms-transform:translateY(-150px);
    -o-transform:translateY(-150px);
}
.cuadro_intro_hover img{
    z-index: 4;
}
.cuadro_intro_hover .caption{
    position: absolute;
    top:308px;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
    -ms-transition:all 0.3s ease-in-out;
    transition:all 0.3s ease-in-out;
    width: 100%;
}
.cuadro_intro_hover .blur{
    background-color: rgba(0,0,0,0.5);
    height: 500px;
    z-index: 5;
    position: absolute;
    width: 100%;
    top: -57px;
}
.cuadro_intro_hover .caption-text{
    z-index: 10;
    color: #fff;
    font-weight: 400; font-size:16px;
    position: absolute;
    height: 300px;
    text-align: center;
    top:-31px;
    width: 100%;
}
.cuadro_intro_hover .caption-text h3{color: #fff;font-weight: 600; font-size:17px;    margin-bottom: 2rem; }
.cuadro_intro_hover p img{width:100%;}
.benifit{position: relative; background: #F7F7F7;}
.benifit::after{content:" "; background:url(../images/Polygon-img.png) no-repeat;height:1126px;width: 100%;position: absolute;left:0;top: 0;}
.benifit h5{font-weight: 800; font-size: 28px;color: #252B42; margin-bottom: 2rem;}
.benifit ul{    margin: 0 66px; padding:0;}
.benifit ul li{list-style-type: none; position: relative;    padding: 41px 0;}
.benifit ul li::after{content:"";top:66px; left:-70px; border-bottom:3px solid #000;    width: 50px; position: absolute;}
.benifit ul li img{float:left; margin-right:15px;font-weight: 400; font-size: 18px;color: #000;line-height:32px;}
.benifit ul li:nth-child(1):after{top:70px}
.benifit ul li:nth-child(3):after{top:50px}
.benifit ul li:nth-child(4):after{top:50px}
.cuadro_intro_hover .caption-text p{padding:15px;}
.project{background: #295C7A;padding-top: 57px;margin-top: 173px;}
.project ul{    margin: -152px 0 0; padding:0; display:flex; justify-content: space-around;}
.project ul li{display: inline-block; list-style-type: none;background: #FFFFFF; width:27%; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25); margin-right:20px; padding:30px;}
.project ul li strong{display: block;font-weight: 800; font-size: 24px;color: #000; margin-top:10px;}
.project ul li p{font-weight: 500; font-size: 14px;color: #737373;margin-top: 15px; }
.project ul li:hover{background: #00A0C1; color:#fff; cursor: pointer;}
.project ul li:hover strong{color:#fff;}
.project ul li:hover p{color:#fff;}
.project ul li:hover img{filter: brightness(0) invert(1);}
.getintouch{background: #295C7A; padding-top:99px;padding-bottom: 100px}
.getintouch h6{font-weight: 700; font-size: 28px;color: #fff; text-align: center;}
.getintouch p{font-weight: 500; font-size: 14px;color: #fff; text-align: center;    margin-bottom: 7rem;}
.getintouch ul{margin:0; padding:0; display: flex; justify-content: center;}
.getintouch ul li{background: #FFFFFF;list-style-type:none; text-align:center; padding:30px; width:22%;} 
.getintouch ul li p{font-weight: 400; font-size: 16px;color: #000; margin-top: 15px;  margin-bottom: 10px;}
.getintouch ul li strong{font-weight: 600; font-size: 16px;color: #000; margin-top: 5px;margin-bottom: 10px;display:inline-block;}
.getintouch ul li button{margin: 0 auto;display: block; border:1px solid #FFA62B; background-color: transparent;font-size: 14px;color:#FFA62B;font-weight: 600; border-radius:5px;}
.getintouch ul li.add{background: #00A0C1; color:#fff;    margin:-31px 0 -31px;}
.getintouch ul li.add p{color:#fff;}
.getintouch ul li.add strong{color:#fff;}
.getintouch ul li button.white{color:#fff; border-color:#fff; margin-top:20px;}
footer{background: #252B42; padding:100px 0 60px;}
footer .foot-txt p{font-weight: 500; font-size: 14px;color: #fff;text-align:center;}
footer .foot-txt ul{margin:0; padding:0; text-align: center;}
footer .foot-txt ul li{list-style-type: none; display: inline-block;padding: 0 8px;}
footer .foot-txt hr{border-bottom:1px solid #fff;}
footer .foot-txt1 strong{font-weight: 700; font-size: 18px;color: #fff;text-align:center;margin-bottom: 15px; display: inline-block;}
footer .foot-txt1 ul{margin:0; padding:0; text-align: center;}
footer .foot-txt1 ul li{list-style-type: none; display:block;padding: 5px 0;}
footer .foot-txt1 ul li a{font-weight: 400; font-size: 16px;color: #fff; text-decoration: none;}
footer .foot-txt2 strong{font-weight: 600; font-size: 18px;color: #fff;text-align:center; margin-bottom: 15px; display: inline-block;}
footer .foot-txt2 .form-control{background: transparent; color: #fff;}
.btn-primary{background-color:#00A0C1; border-color: #00A0C1;}
.copy-txt{background:#181C2B;padding: 18px 0; text-align: center;font-weight: 600; font-size: 14px;color: #fff;}

.modal-body ul{margin:0; padding:0; display:inherit; justify-content:inherit;}
.modal-body ul li{display: inline-block; list-style-type:none;width: 50%;float: left; background: transparent;}
.modal-body ul li img{width: 100%;height: 100%;}
.modal-body ul li::before{display: none;}
.modal-body ul li::after{display: none;}
.modal-content{background: transparent;}
.modal-header{border-bottom:0;}
.modal-dialog{width:80%; max-width:inherit;}
.modal-header .btn-close{background-color:#fff; border-radius:50%;opacity:8.5;}
.btn-close{opacity:8.5;}

    /* .navbar-brand{    padding-top: 0;} */

.sticky .navbar{padding-top:0}
.sticky img{    width: 167px;}