/* ---------------fonts----------------------- */
@font-face {
  font-family: 'Evanston';
  src: url('../styles/fonts/Evanston/EvanstonTavern-1846Medium.ttf');
}

@font-face {
  font-family: 'Prototype';
  src: url('../styles/fonts/Prototype/Prototype.ttf');
}

@font-face {
  font-family: 'Staalitches';
  src: url('../styles/fonts/Staalitches/Staatliches-Regular.ttf');
}

/* ------------------------------------------ */

*, *:before, *:after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
/* ------------------------------------------ */

body {
  width: 100%;
  max-width: 1920px;
  min-width: 1200px;
  margin: 0 auto;
  font-family: 'Arial', sans-serif;
  position: relative;
}
html, body{width: 100%; overflow-x: hidden;}
/* ------------------------------------------ */
 

a {color:inherit;text-decoration: none;}
a:hover {text-decoration: none;color:inherit;}
div,article,section,dl,dt,dd,table,tr,td,ul,ol,li,p,span,small,em,h1,h2,h3,h4,h5,h6,nav {padding:0;margin:0;}
.row {max-width: 1620px;margin: 0 auto;padding-left: 10px;padding-right: 10px;}
/*cookie*/
.cc-animate.cc-revoke.cc-bottom{font-size: 14px;padding: 5px 10px;position: fixed;display: block!important;transform: none!important;bottom: 0!important;left: 20px!important;}

/*call to action*/
.destroy-on-load, .cta {display: none;}
form .messages p {display: none;font-family: 'Montserrat', sans-serif !important;font-weight: 400 !important;letter-spacing: 0 !important;font-size: 16px !important;}
form .loading {display: none;}
form .alert {padding: 15px;margin-bottom: 20px;border: 1px solid transparent;border-radius: 4px;} 
form .alert-success {color: #3c763d;background-color: #dff0d8;border-color: #d6e9c6;}
form .alert-danger {color: #a94442;background-color: #f2dede;border-color: #ebccd1;}
.ctc-form input[type="text"],
.ctc-form textarea {font-family: 'Montserrat', sans-serif;font-size: 16px;color:#000;height:45px;display: block;width: 100%;border:1px solid #A8A8A8;padding: 5px 10px;box-sizing: border-box;margin: 0 auto 8px;
resize: none;background: #EEEEEE;}
.ctc-form ::placeholder,
.ctc-form label{font-family: 'Open Sans', sans-serif;font-size: 15px;color: #fff;line-height: 1.8;letter-spacing: .03px;text-align: left;}
.ctc-form {margin: 0 auto ;text-align: center;}
.ctc-form ::placeholder{color: #545454;}
.ctc-form textarea { height: 150px;padding-top:10px;}
.ctc-form button {display: block;border: none;margin: 20px auto 0;}
.ctc-form .recap {display: inline-block;}
.ctc-form .g-recaptcha div {margin: 0 auto 10px;}
.ctc-form .ctc-hide {display: none;}
.inner #content {     min-height: 1000px; padding: 40px 0;max-width: 800px;margin: 0 auto;}
.inner #content h1{padding-bottom: 20px;}

/*inner gallery*/
.img-responsive{width: 200px;height: 200px;-o-object-fit: cover;object-fit: cover;}
#content .gallery-container {text-align: center;}
#content .gallery { list-style-type: none;margin: 0; padding: 0;}
#content .gallery li {display: inline-block;}
#content .thumbnail {background-color: #fff;border: 1px solid #ddd;border-radius: 4px;display: block;line-height: .42857;margin-bottom: 20px;padding: 4px;transition: border 0.5s ease-in-out 0s;}
#content .thumbnail:hover {transform: scale(1.02);}
#content .page_navigation {display: inline-block;}
#content .page_link,
#content .previous_link,
#content .next_link,
#content  .first_link,
#content  .last_link, 
#content .ellipse {background-color: #fff;border: 1px solid #ddd;color:  #0275d8;display: inline-block;line-height: 1.25;margin-left: -1px;padding: 0.5rem 0.75rem;position: relative;}
#content .page_navigation > a:hover , 
.page_navigation > a.active_page {background-color: #eceeef;border-color: #ddd;color: #014c8c;text-decoration: none;}
.inner #content .gallery-container{margin-bottom: 20px}
.inPrivacyBox {max-width: 850px;margin: 0 auto;}.inPrivacyBox p {text-align: justify!important;}
#header nav a#pull {display: none;}
nav ul {margin: 0;padding: 0;list-style: none;}
nav ul li {display: inline-block;vertical-align: middle;}

/* ###########################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################
####################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################################### */
/* ------------------new codes----------------------------- */

/* ------------typhography------------------------------------ */

:root{
  scroll-behavior: smooth;
  --primary:#FEB03B;
  --primary2:#D86C00;
  --primary3:#747B8B;
}


.title, .sub-title, .es, h1, .head {text-align: initial; color: whitesmoke;font-family:'Montserrat'; font-size: clamp(0.625rem, 0.525rem + 0.5vw, 1.125rem);font-weight: 400;}
.inner #content p{color: #000;font-size: clamp(0.875rem, 0.825rem + 0.25vw, 1.125rem); text-align: center;}
.navbar{max-width: 1054px;}
a{ color: whitesmoke;margin: 0 auto;  text-transform: uppercase;font-family: 'Montserrat';font-size: clamp(1.125rem, 1.1rem + 0.125vw, 1.25rem); font-weight: 400;}
/* ----------------- */

/* -------------------wrapper------------------ */
.wrapper{ max-width: 100%; width: 100%; margin: 0 auto; background-size: cover!important;}


#header .wrapper{background: url('../images/content/images/Banner/header-banner.png') no-repeat top center; min-height: 1180px;z-index: 1;position: relative;}
#home .wrapper{background: url('../images/content/images/Banner/home-banner.jpg') no-repeat top center; min-height: 1180px;}
#offered .wrapper{background: url('../images/content/images/Banner/offered-banner.png') no-repeat top center; min-height: 1135px;}
#projects .wrapper{background: url('../images/content/images/Banner/projects-banner.jpg') no-repeat top center; min-height: 990px;}
#testimonials .wrapper{background: url('../images/content/images/Banner/testimonials-banner.png') no-repeat top center; min-height: 1080px;}
#work .wrapper{background: url('../images/content/images/Banner/work-banner.jpg') no-repeat top center; min-height: 1000px;}
#contact-section .wrapper{background: url('../images/content/images/Banner/contact-banner.png') no-repeat top center; min-height: 1120px;}
#upcoming .wrapper{background: url('../images/content/images/Banner/upcoming-banner.jpg') no-repeat top center; min-height: 900px;}

/* ---------max-width---------- */
.screen{display: flex;max-width: 1560px;margin: 0 auto;}
.screen2{display: flex;max-width: 1518px;margin: 0 auto;}
.container{width: 100%; max-width: 1920px; margin: 0 auto;}

/* -----------------inner- content----------------- */
.inner #content h1 {color: black!important; font-weight: 900!important; font-size: 60px!important; font-family: 'Prototype'; text-align: center;}
.ctc-form label{ color: #000!important;}
.inner #content .ctc-form button:hover {background-color: gray;color: whitesmoke!important;}
.inner #content .ctc-form button {background-color: #0076D3; padding: 20px!important; color: white!important;}
.inner #content .ctc-form button:hover {background-color: #012460;}
.inner #content .ctc-form button {display: block;border: none;margin: 20px auto 0;width: 100%;max-width: 230px;}

/*---------------typography-----------*/
.text-left{text-align: left;align-self: center; align-items: center; align-content: center;}
.text-right{text-align: right;align-self: center;align-items: center; align-content: center;}
.text-center{text-align: center;align-self: center;align-items: center;align-content: center;}
.align-top{align-self: baseline;}
.align-center{align-self: center;}
.align-bot{align-self: flex-end;}

/* ------flex--------- */

.flex{display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex;justify-content: space-between;-webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;-ms-flex-wrap: wrap;-o-flex-wrap: wrap;flex-wrap: wrap;} 

.space-center{justify-content: center;}
.space-between{justify-content: space-between;}
.space-around{justify-content: space-around;}
.space-evenly{justify-content: space-evenly;}
.space-initial{justify-content: initial;}
.space-end{justify-content: flex-end;}

/* ------------btn------------ */
.btn-page{display: flex;}
.btn{position: relative;overflow: hidden;display: block;margin: 0 auto;text-align: center;padding: 20px;width: 200px;font-size: 16px;font-weight: 700;background: #FF0000;color: #FFF;line-height: 1.2;-webkit-appearance: inherit;}

.btn-orange .btn{background-color: var(--primary2);     transform: skew(150deg);}

.btn-grey .btn{background-color: #747B8B;    transform: skew(150deg); margin-top: 10px;
  margin-left: -5px;}


#header .btn{ width: 280px;}
#header .btn-orange .btn{background-color: var(--primary2);}
#header .btn-grey .btn{background-color: var(--primary3);}

#header .btn-page{padding: 100px 0;}
/* ----------------------------------------- */
/*---------------- header-------------------- */
.left-content{display: flex; justify-content: space-between;position: relative;left: 90px; gap: 140px;}

#header .right-cont img{width: 100%;}

#header .left{ width: 100%;margin: 0 auto;}
.l-right-info {display: flex; justify-content: initial; gap: 10px;}

.l-right-top a{font-size: 12px; text-transform: unset; font-family: 'Lato';}

.l-right-row{padding: 15px; background-color:#D96D00 ; width: 100%; max-width:200px; transform: skew(341deg); }

.l-text{transform: skew(18deg);}

.l-right-top {width: 100%;}

.header-navbar {display: flex;    justify-content:initial;     margin-left: -50px;}

#header .navbar{display: flex; gap: 30px;    margin-right: 40px; padding-top: 10px;}
#header nav ul li.active-menu a, #header nav ul li a:hover {color: var(--primary2);}
#header .navbar li{align-self: center;}

#header .navbar a{font-size: 16px; color: #000; font-family: 'Evanston'; text-transform: uppercase;}

#header .navbar a:hover{color: var(--primary2);}

.header-content{display: flex; justify-content: space-between;  padding: 9px 10px; }

.main-flex{width: 100%; max-width: 900px;margin-left: 100px;  padding:20px 0}

.main-cont { margin-top: 15rem;}

.main-cont .title{font-size: 25px; color: var(--primary2); font-family: 'Lato'; font-weight: 200; font-style: italic;}

.main-cont .sub-title{font-size: 80px;font-family: 'Staalitches'; font-weight: 200; text-transform: uppercase;padding-left: 20px; align-self: center;}
.cont-line {display: flex;}
.line1{width: 5px;background-color: var(--primary3);border: unset;height: 215px;align-self: center; margin: 0;}

.cont-info {display: flex; gap: 10px;}

.cont-info .title{color: #fff; font-size:25px;  text-transform: capitalize; font-family: 'Lato';}

.cont-info a{font-size: 60px; font-weight: 900; font-family: 'Lato';}

.cont-info a:hover{color: var(--primary2); transition: .5s;}

.socials-col{display: flex; justify-content: flex-end;}

.logo-socials{width: 80%;}


/* ----------content------------- */
/* -------home--------- */

.home-left{flex: 0 0 50%;     margin-top: 285px;}
.home-content{justify-content: space-between; padding: 0 10px 0; margin-top: -70px;}

.hm-text-top .es,
.hm-bot .es{font-size: 18px; line-height: 1.5; font-family: 'Lato'; color: #000; font-weight: 700;}

.hm-center .sub-title{font-size: 30px; color: var(--primary2); font-family: 'Lato'; font-weight: 900; padding: 20px 0;}

.hm-bot-bot li{font-size: 18px; color: #fff; font-family: 'Lato'; font-weight: 900; line-height: 2;}

.hm-bot-bot{padding: 20px 20px 20px 60px;}

.hm-bot-bot ul li{list-style: none; background: url('../images/content/images/Content/home/dot.png')no-repeat left center;height: 54px;padding-left: 44px;padding-top: 10px;}

.hm-b .title{font-size: 18px; color: #000; text-transform: uppercase; font-family: 'lato'; letter-spacing: 2px; font-weight: 700;}

.hm-b a{ font-size: 45px; color: #000; font-family: 'Prototype'; letter-spacing: 5px;}

#home .btn-page{padding: 20px 0;}

.home-right-text .title{font-size: 100px; color: #000; text-transform: uppercase; text-align: right; font-family: 'Evanston'; font-style: italic;}

.home-right-text .sub-title{font-size: 60px; color: #737A8B; text-transform: uppercase; text-align: right; font-family: 'Staalitches';}

.span1{color: var(--primary2);}

.home-right{width: 100%;max-width: 710px;}

.home-ratings{display: flex; justify-content: space-evenly; padding: 50px 0;}


#home .btn-orange .btn{background-color: var(--primary2);}
#home .btn-grey .btn{background-color: var(--primary3);}
/* ------offered----- */

.offered-content{justify-content: flex-end; margin-right: 100px; margin-top: -240px;}

.offered-cont .title{font-size: 25px; color: var(--primary3); font-style: italic;text-transform: uppercase; text-align: end; font-family: 'Evanston';}

.offered-cont .sub-title{font-size: 55px; text-transform: uppercase; width: 100%; max-width: 600px;margin: 0 auto; font-family: 'Staalitches';}

.offered-top a{font-size: 16px; color: var(--primary2); text-transform: uppercase; text-decoration: underline; font-family: 'Staalitches';}

.offered-slide{padding: 20px 0 20px 60px;}

.offered-top{padding: 20px 0;}

.offered-row .title{font-size:13px; text-transform: uppercase; color: var(--primary3); padding: 15px 0; font-family: 'Lato';}

.offered-row .sub-title{font-size: 25px; text-transform: uppercase; font-family: 'Evanston';}

.offered-row .es{font-size: 18px; line-height: 1.5; padding: 20px 0 40px; font-family: 'Lato';}

.offered-row{width: 100%; max-width: 356px;}

.offered-col-row{display: flex; gap: 15px;}

.offered-row .btn{padding: 11px;width: 130px;font-size: 10px;}

.btn-logo{margin-top: 90px;}

.offered-containter {padding-top: 65px;}

#offered .btn-orange .btn{background-color: var(--primary2);}

/* ---------projects---------- */

.projects-top .title{font-size: 100px; color: var(--primary2); text-transform: uppercase; font-weight: 700; font-style: italic; text-align: right; font-family: 'Evanston';}

.projects-top .sub-title{font-size: 50px; text-transform: uppercase; color: var(--primary3); text-align: center; font-family: 'Staalitches';}

.projects-top .es{font-size: 18px; color: #000;width: 100%; max-width: 883px;margin:0 auto; font-weight: 700;}

.projects-top a{font-size: 16px; text-transform: uppercase; color: var(--primary2); text-decoration: underline; font-family: 'Evanston'; font-weight: 700;}

.projects-top{width: 100%; max-width:1560px; margin: 0 auto; }


.projects-gal{display: flex; gap: 5px;}

.p-slide {text-align: center; padding: 20px 0;}

.p-a{padding: 15px 0;}

.projects-pag{padding: 20px 10px;}

.logo-proj {width: 100%;}

/* -------testimonials---------- */
.testimonials-content{padding-top: 58px; justify-content: space-between; max-width: 1750px; margin-top: -190px;}

.checked {color: yellow;}

.testimonials-left{flex:0 1 895px;margin-top: 160px;}
.testimonials-right{flex: 0 1 715px;}

.testimonials-text .title{font-size: 60px; line-height: 180%; font-family: 'Lato';}

.testimonials-text .es{font-size: 18px; line-height: 180%; padding: 40px 10px; width: 100%; max-width: 717px; font-family: 'Lato';}

.span3{color: #fff;font-weight: 700;}
.span2{color: var(--primary3);font-weight: 700;}


.testimonials-info {display: flex;width: 100%;max-width: 718px;justify-content: space-between;}

.ti-l > .title{font-size: 25px; text-transform: capitalize; font-family: 'Lato'; }
.ti-l > a{font-size:60px; color: var(--primary3);font-family: 'Evanston'; line-height: 40px;}

.tr-r > .title{font-size: 25px; color: var(--primary2); text-transform: uppercase; letter-spacing: 5px; font-family: 'Lato';}

.tr-r-flex{display: flex; justify-content: space-between;}

.tr-r-text .es{font-size: 50px; text-transform: uppercase; font-family: 'Evanston';} 

.name-col > .title{ font-size: 35px; text-transform: uppercase; font-family: 'Prototype';}

.name-col > .sub-title{ font-size: 18px; text-transform: uppercase; font-family: 'Arial'; color: var(--primary2);}

.tr-name{display: flex; gap: 10px;}

.tr-bot .es{font-size: 16px;line-height: 180%; padding: 20px 0; font-family: 'Arial';}

.line2{width: 80px;margin: 0;margin-left: 30px;margin-top: 25px;height: 5px; border: unset;background: #fff;}

.stars{padding: 30px 0px 50px;}

/* -----------work--------------- */
.work-content{display: block;}

.work-top > .title{font-size: 100px; color: var(--primary2); font-style: italic; font-family: 'Evanston';}

.work-top > .sub-title{font-size: 50px; color: var(--primary3); font-family: 'Staalitches';}

.work-text > .title{font-size: 13px; color: var(--primary3); font-family: 'Lato'; padding: 30px 0 0;}

.work-text > .sub-title{font-size: 25px; color: #000; font-family: 'Evanston'; padding: 20px 0;}

.work-text > .es{font-size: 18px; color: #000; font-family: 'Lato'; line-height: 180%; width: 100%; max-width: 308px; padding: 20px 0;}

.work-gal{display: flex; justify-content: space-between; padding: 30px 10px;} 

.logo-work{width: 100%;}

/* -----------contact------------ */

.contact-left{flex: 0 1 700px;margin-top: 160px;}
.contact-right{flex: 0 1 630px; margin-top: 150px;}
.contact-content{max-width: 1640px; justify-content: space-between; margin-top: -200px;}

.contact-left .title{font-size: 20px; text-transform: uppercase; text-align: center; font-weight: 700; font-family: 'Lato';}
.contact-left .sub-title{font-size: 50px;text-align: center; text-transform: capitalize; font-family: 'Lato'; color: var(--primary3); padding: 20px 0;}

.contact-left .es{font-size: 15px; font-family: 'Lato'; font-weight: 700; text-align: center;}

#contact .ctc-form label{color: #fff!important;}

#contact .btn-page{justify-content: center; padding: 20px 0;}
#contact .btn-page .btn{background-color: red;}

.contact-right .title{font-size: 80px; text-align: right; font-family: 'Lato'; font-weight: 200;}
.contact-right .es{font-size: 18px; text-align: right;font-family: 'Lato';  line-height: 180%;}

.contact-right .btn-page .btn{background-color: red;}

.contact-right .btn-page{justify-content: center; padding: 50px 0;}


/* ----------upcoming--------- */

.upcoming-content{display: block;}

.upcoming-top .title{font-size: 100px; color: var(--primary2); text-transform: uppercase; text-align: right; font-family: 'Evanston';}
.upcoming-top .sub-title{font-size: 50px; color: var(--primary3); text-transform: uppercase; text-align: center; font-family: 'Staalitches';}

.upcoming-bot .title{font-size: 80px; color: #000; text-transform: uppercase; text-align: center; font-family: 'Evanston';} 
.upcoming-bot .es{font-size: 18px; color: #000;text-align: center; font-family: 'Lato'; width: 100%; max-width: 985px; margin: 0 auto;} 

.upcoming-info{display: flex; justify-content: center; gap: 50px;}

.upcoming-info .title{ font-size: 25px; font-weight: 200; text-transform: capitalize; font-family: 'Lato'; color: #000;}

.up-l a{font-size: 60px; color: #000; font-family: 'Evanston'; line-height: 40px;}

.upcoming-bot {padding: 40px 0 80px;}

/* -------------footer-------------------- */
#myBtn {margin: 0 auto; cursor: pointer;}
#footer .wrapper{background: url('../images/content/images/Content/footer/footer-banner.png') no-repeat top center; background-size: cover;min-height: 781px;}

.info-bot,
.cards-col,
.footer-socials-col{display: flex; gap: 10px; padding: 15px 0;}

.footer-content{padding-top: 58px; max-width: 1680px; justify-content: space-between;margin-top: -145px; }
.footer-left,
.footer-right {
  flex: 0 1 752px;
}

.info-bot a{margin-left: 0;}

.info-col{display: flex; justify-content: center;}

.footer-navbar a{color: #000; font-size: 13px; font-family: 'Prototype'; font-weight: 700;}

.footer-navbar .navbar{display: flex; justify-content: space-evenly;}

.footer-text .title{color: #000;text-align: center;font-size: 18px; font-family: 'Lato'; line-height: 150%; padding-top: 20px;}
.footer-copyrights .title{color: #000; font-family: 'Lato';}

.footer-cont-top .title{font-size: 60px; color: #747B8B; text-transform: uppercase; font-family: 'Lato'; padding: 50px 0;}

.footer-cont .sub-title{font-size: 18px; color: var(--primary2); text-transform: uppercase; font-family: 'Prototype'; padding: 0 0 25px;}

.info-col .title{font-size: 15px; text-transform: uppercase; font-family: 'Prototype'; color: var(--primary2); align-self: center;}

.info-col a{font-size: 15px; text-transform: unset; font-family: 'Lato';align-self: center;}

.info-row{padding: 10px 0;}

.footer-navbar {padding: 100px 0 30px;}
.footer-slide {padding: 0 0 50px;}




/* -------------------------contact info-------------------------- */
#contact {position: relative;padding: 2em 1em 1em;}
.row {max-width: 1620px;margin: 0 auto;padding-left: 10px;padding-right: 10px;}
#contact .ctc-form label {width: 32%;border-radius: 30px;}
#contact .ctc-form{width: 100%;max-width: 1200px;margin-top: 50px;}
#contact button.ctcBtn.btn {margin-bottom: 76px;text-transform: uppercase;border-radius: 10px;}
#contact .ctc-form input[type="text"],.ctc-form textarea{border-top-right-radius: 10px; border-bottom-left-radius: 10px;}
#footer .bot-container .es{color: whitesmoke;font-size: 15px;margin-bottom: 39px;}



/* ----copyrights--------- */
.copyrights .title {font-size: 16px;font-weight: 500;}
.copyright {background-color: #000;padding: 20px;z-index: 1;position: relative;}

/* ---company----- */
.company-logo {display: flex;justify-content: center;padding: 20px;gap: 10px;}
.company-logo .es{color: #000;text-transform: capitalize;align-self: center;}
/* ---------------------------------------------------------------------------------- */

