/* Table of Content
==================================================
	#Font-Face
	#Site Styles
	#Media Queries */

/* #Font-Face
================================================== */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');
@import url('../fonts/icon/style.css');

/* #Site Styles
================================================== */

/* ### general ### */
html,
body { font-family: 'Montserrat', sans-serif; font-size: 25px; font-weight: 300; line-height: 1.6; color: #5d5d5d; }
body { background-color: #5d5d5d; }
input,
select,
textarea { font-family: 'Montserrat', sans-serif; font-size: 16px; color: #5d5d5d; }
img { display: block; max-width: 100%; height: auto; border: 0; }
:focus { outline: none; }
a { /*display: inline-block;*/ transition: all 0.3s ease-in-out; }
:root { scroll-behavior: unset; }
h1,
h2,
h3,
h4,
h5,
h6 { font-weight: 600; line-height: 1.1; color: #5d5d5d; }
h1 { font-size: 50px; color: #ff4600; }
h2 { font-size: 50px; color: #ff4600; }
h3 { font-size: 35px; }
h4 { font-size: 30px; }
h5 { font-size: 25px; }
h6 { font-size: 20px; }
.btn { padding: 24px 34px 24px 40px; display: inline-flex; align-items: center; font-size: 25px; font-weight: 600; border-radius: 20px; background: #ff4e00; }
.btn i { margin-left: 22px; font-size: 39px; }
.btn:focus { box-shadow: none; }
.btn-primary { border-color: #5d5d5d; background-color: #5d5d5d; }
.btn-primary:hover { border-color: #ff4e00; background-color: #ff4e00; }
.btn-outline-primary { color: #fff; border: solid 1px #fff; }
.btn-outline-primary:hover { color: #fff; border: solid 1px #fff; background-color: #5d5d5d; }

/* ### global classes ### */
.clear { visibility: hidden; clear: both; height: 0; line-height: 0; }
.container { max-width: 1641px; }

/* ### wrapper ### */
#wrapper { position: relative; display: block; width: 100%; min-height: 100%; overflow: hidden; }

/* ### main container ### */
#mainCntr { width: 100%; }

/* ### header container ### */
#headerCntr { margin-bottom: 60px; position: relative; width: 100%; }

/* ### header box ### */
.headerBox { padding-top: 60px; padding-bottom: 68px; width: 100%; }
.headerBox .logo { margin-left: -7px; width: 794px; }
.headerBox .logo img { max-width: 100%; }
.headerBox .call-btn { font-size: 30px; font-weight: 600; color: #fff; }
.headerBox .call-btn i { margin-right: 11px; display: inline-block; transition: all 0.3s ease-in-out; }
.headerBox .call-btn:hover i { color: #ff4600; }

/* ### menu box ### */
.menuBox { width: 100%; }
.menuBox ul { margin: 0; padding: 0; display: flex; flex-wrap: wrap; list-style: none; }
.menuBox ul > li { margin-right: 44px; }
.menuBox ul > li > a { font-size: 25px; font-weight: 600; text-transform: uppercase; text-decoration: none; color: #fff; }
.menuBox ul > li > a:hover { color: #ff4600; }
.menuBox ul > li:last-child { margin-right: 0; }
.menuBox ul > li.active a { color: #ff4600; }

/* ### mobileMenu ### */
.mobileMenu { position: absolute; top: 22px; right: 8px; z-index: 15; display: none; float: left; width: 55px; height: 55px; transition: 0.2s ease-in-out; cursor: pointer; overflow: hidden; }
.mobileMenu span { position: absolute; top: 50%; right: 20%; left: 20%; display: block; height: 4px; text-indent: -9999px; border-radius: 5px; background: #fff; transition: 0.2s; }
.mobileMenu span:before,
.mobileMenu span:after { position: absolute; left: 0; display: block; width: 100%; height: 4px; border-radius: 5px; background-color: #fff; transition-duration: 0.2s, 0.2s; content: ''; }
.mobileMenu span:before { top: -10px; }
.mobileMenu span:after { bottom: -10px; }
.mm-opened #headerCntr .mobileMenu span { background: none; }
.mm-opened #headerCntr .mobileMenu.is-active span:before,
.mm-opened #headerCntr .mobileMenu.is-active span:after { transition-delay: 0s, 0.2s; }
.mm-opened #headerCntr .mobileMenu span:before { top: 0; transform: rotate(45deg); }
.mm-opened #headerCntr .mobileMenu span:after { bottom: 0; transform: rotate(-45deg); }

/* ### content container ### */
#contentCntr { width: 100%; background: #fff; }

/* ### hero box ### */
.heroBox { margin-bottom: 165px; position: relative; width: 100%; }
.heroBox h1 { margin-bottom: 15px; line-height: 1.2; letter-spacing: -0.5px; }
.heroBox h1 span { display: block; }
.heroBox .content { padding-top: 84px; width: 90%; }
.heroBox .content p { margin-bottom: 35px; letter-spacing: -0.4px; }
.heroBox .image { margin-top: 50px; margin-left: -68px; width: calc(100% + 220px); height: 610px; border-radius: 305px 0 0 310px; overflow: hidden; }
.heroBox .image img { width: 100%; min-height: 100%; object-fit: cover; }
.heroBox .logo { position: absolute; top: 0; left: 0; opacity: 0.3; height: 100%; max-height: 600px; }

/* ### info box ### */
.infoBox { margin-bottom: 83px; width: 100%; }
.infoBox h2 { margin-bottom: 112px; }
.infoBox h4 { margin-bottom: 40px; line-height: 1.3; }
.infoBox i { font-size: 120px; color: ##5d5d5d; }

/* ### portfolio box ### */
.portfolioBox { padding-top: 91px; padding-bottom: 104px; width: 100%; border-top-left-radius: 385px; border-bottom-right-radius: 385px; background-color: #f6f6f6; }
.portfolioBox h2 { margin-bottom: 63px; text-align: end; }
.portfolioBox .block { margin-bottom: 93px; }

/* ### card-portfolio ### */
.card-portfolio { width: 100%; }
.card-portfolio h3 { margin-bottom: 0; text-shadow: 9px 20px 49px rgba(38, 35, 32, 0.9); }
.card-portfolio .image { width: 100%; height: 590px; border-radius: 20px; overflow: hidden; box-shadow: 22px 0 27px rgba(38, 35, 32, 0.1); mix-blend-mode: multiply; }
.card-portfolio .image img { width: 100%; height: 100%; object-fit: cover; transition: all 0.3s ease-in-out; }
.card-portfolio .title { padding: 48px 49px; position: absolute; bottom: 0; left: 0; }
.card-portfolio:hover .image img { transform: scale(1.05); }

/* ### footer container ### */
#footerCntr { overflow: hidden; width: 100%; }

/* ### footer box ### */
.footerBox { padding-top: 65px; width: 100%; }
.footerBox h5 { margin-bottom: 5px; font-weight: 300; }
.footerBox .block { padding-bottom: 43px; border-bottom: solid 1px #a9a9a9; }
.footerBox .title { margin-bottom: 27px; font-size: 50px; font-weight: 600; color: #fff; }
.footerBox .info { width: 100%; }
.footerBox .info address { margin-bottom: 0; }
.footerBox .info ul { margin: 0 0 0 -54px; list-style: none; }
.footerBox .info ul > li { display: flex; align-items: center; font-weight: 300; }
.footerBox .info ul > li > i { margin-right: 14px; }
.footerBox .info ul > li > a { font-weight: 300; text-decoration: none; color: #fff; }
.footerBox .info ul > li > a:hover { text-decoration: underline; color: #ff4e00; }
.footerBox .info ul > li > .icon-phone-volume { transform: rotate(-40deg); }

/* ### copy box ### */
.copyrightBox { padding-top: 36px; padding-bottom: 36px; width: 100%; }
.copyrightBox ul { margin: 0; list-style: none; }
.copyrightBox ul > li { position: relative; }
.copyrightBox ul > li:after { margin: 0 20px; display: inline-block; width: 1px; height: 25px; vertical-align: middle; background-color: #fff; content: ''; }
.copyrightBox ul > li > a { font-weight: 300; text-decoration: none; color: #fff; }
.copyrightBox ul > li > a:hover { text-decoration: underline; color: #ff4e00; }
.copyrightBox ul > li:last-child:after { display: none; }
.copyrightBox p { margin: 0; }
.copyrightBox p a { color: #fff; }
.copyrightBox p a:hover { text-decoration: none; color: #ff4e00; }

/* #Media Queries
================================================== */

@media only screen and (max-width: 1650px) {
	.menuBox ul > li { margin-right: 34px; }
	.menuBox ul > li > a { font-size: 25px; }
	.footerBox .info ul { margin: 0; }
}

@media only screen and (max-width: 1399px) {
	h3 { font-size: 30px; }
	.headerBox { padding-top: 40px; padding-bottom: 40px; }
	.headerBox .logo { max-width: 600px; }
	.menuBox ul > li { margin-right: 23px; }
	.menuBox ul > li > a { font-size: 22px; }
	.heroBox .content { width: 100%; }
	.heroBox .image { margin-left: 0; }
	.portfolioBox { border-top-left-radius: 200px; border-bottom-right-radius: 200px; }
	.card-portfolio .title { padding: 45px 20px; }
}

@media only screen and (max-width: 1199px) {
	.headerBox { padding-top: 25px; padding-bottom: 25px; }
	.headerBox .logo { width: 520px; }
	.headerBox .call-btn { font-size: 25px; }
	.menuBox ul > li { margin-right: 19px; }
	.menuBox ul > li > a { font-size: 18px; }
	.copyrightBox ul > li:after { margin: 0 12px; }
	.copyrightBox ul > li > a { font-size: 22px; }
	.copyrightBox p { font-size: 22px; }
}

@media only screen and (max-width: 991px) {
	html,
	body { font-size: 22px; }
	h1 { font-size: 45px; }
	h2 { font-size: 42px; }
	h3 { font-size: 30px; }
	h4 { font-size: 24px; }
	#headerCntr { margin-bottom: 15px; }
	.headerBox { padding-top: 15px; padding-bottom: 15px; }
	.headerBox .logo { width: 400px; }
	.headerBox .call-btn { margin-right: 50px; font-size: 0; }
	.headerBox .call-btn i { font-size: 27px; }
	.menuBox { display: none; }
	.menuBox ul { display: block; }
	.menuBox ul > li > a { color: #000; }
	.mobileMenu { display: block; }
	.heroBox { margin-bottom: 70px; }
	.heroBox .content { padding-top: 50px; }
	.heroBox .content p { letter-spacing: 0; }
	.heroBox .image { height: 400px; }
	.infoBox h2 { margin-bottom: 50px; }
	.infoBox i { font-size: 80px; }
	.portfolioBox { padding-top: 60px; padding-bottom: 60px; border-top-left-radius: 90px; border-bottom-right-radius: 90px; }
	.portfolioBox .block { margin-bottom: 25px; }
	.card-portfolio .title { padding: 35px 20px; }
	.footerBox { padding-top: 50px; }
	.footerBox h5 { font-size: 22px; }
	.footerBox .block { padding-bottom: 30px; }
	.footerBox .title { font-size: 45px; line-height: 1; }
	.footerBox address { font-size: 22px; }
	.footerBox .info ul > li > a { font-size: 22px; }
	.copyrightBox { padding-top: 25px; padding-bottom: 25px; }
	.copyrightBox ul { justify-content: center; width: 100%; }
	.copyrightBox ul > li { margin-bottom: 10px; }
	.btn { padding: 15px 34px; font-size: 20px; }
	.btn i { font-size: 35px; }
}

@media only screen and (max-width: 767px) {
	h1 { font-size: 40px; }
	h2 { font-size: 35px; }
	.infoBox { margin-bottom: 40px; }
	.portfolioBox h2 { margin-bottom: 35px; text-align: start; }
	.card-portfolio .image { height: auto; }
	.heroBox .image { object-fit: cover; height: 400px; width: 100%; }
}

@media only screen and (max-width: 574px) {
	.headerBox .logo { width: 240px; }
	.mobileMenu { top: 7px; right: 0; }
	.footerBox address { font-size: 20px; }
	.footerBox .info ul > li > a { font-size: 20px; }
	.copyrightBox ul > li { margin-bottom: 5px; }
	.heroBox .image { object-fit: cover; height: 230px; width: 100%; }
	.heroBox .image img.favicon { display: none; }
	.heroBox .logo { display: none; }
	img.top-logo { max-width: 200px; fit-content}
}

.gallery-item { margin-bottom: 50px; }
.gallery-item img { width: 100%; max-width: 100%; border-radius: 30px; box-shadow: 22px 0 27px rgba(38, 35, 32, 0.1); mix-blend-mode: multiply; aspect-ratio: 4/3; object-fit: cover; }
.portfolioBox { padding: 100px 0; }

.infoBox .item a { text-decoration: none; color: #5d5d5d; }
.infoBox .item a:hover h4, .infoBox .item a:hover { color: #ff4e00; }
#footerCntr { color: #fff; }

.heroBox a, .infoBox a { color: #ff4e00; }
.heroBox a.btn { color: #fff; }

.small { padding-top: 20px; font-size: 0.5rem; }