/********** Template CSS **********/
:root {  --primary: #02478a;
 --light: #F6F7F8;
 --dark: #1A2A36;
}
.fw-medium { font-weight: 500 !important; }
.fw-bold { font-weight: 700 !important; }
.fw-black { font-weight: 900 !important; }
.back-to-top { position: fixed; display: none; right: 45px; bottom: 45px; z-index: 99; display: none !important; }
/*** Spinner ***/
#spinner { opacity: 0; visibility: hidden; transition: opacity .5s ease-out, visibility 0s linear .5s; z-index: 99999; }
#spinner.show { transition: opacity .5s ease-out, visibility 0s linear 0s; visibility: visible; opacity: 1; }
/*** Button ***/
.btn { font-weight: 500; transition: .5s; }
.btn.btn-primary, .btn.btn-outline-primary:hover { color: #FFFFFF; }
.btn-square { width: 38px; height: 38px; }
.btn-sm-square { width: 32px; height: 32px; }
.btn-lg-square { width: 48px; height: 48px; }
.btn-square, .btn-sm-square, .btn-lg-square { padding: 0; display: flex; align-items: center; justify-content: center; font-weight: normal; }
/*** Navbar ***/
.navbar.sticky-top { top: -100px; transition: .5s; }
.navbar .navbar-brand, .navbar a.btn { height: 75px; }
.navbar .navbar-nav .nav-link { margin-right: 30px; padding: 25px 0; color: var(--dark); font-size: 15px; font-weight: 500; text-transform: uppercase; outline: none; }
.navbar .navbar-nav .nav-link:hover, .navbar .navbar-nav .nav-link.active { color: var(--primary); }
.navbar .dropdown-toggle::after { border: none; content: "\f107"; font-family: "Font Awesome 5 Free"; font-weight: 900; vertical-align: middle; margin-left: 8px; }
 @media (max-width: 991.98px) {
.navbar .navbar-nav .nav-link { margin-right: 0; padding: 10px 0; }
.navbar .navbar-nav { border-top: 1px solid #EEEEEE; }
}
 @media (min-width: 992px) {
.navbar .nav-item .dropdown-menu { display: block; border: none; margin-top: 0; top: 150%; opacity: 0; visibility: hidden; transition: .5s; }
.navbar .nav-item:hover .dropdown-menu { top: 100%; visibility: visible; transition: .5s; opacity: 1; }
}
/*** Header ***/
.owl-carousel-inner { position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: flex; align-items: center; background: rgba(0, 0, 0, .1); }
 @media (max-width: 768px) {
.header-carousel .owl-carousel-item { position: relative; min-height: 500px; }
.header-carousel .owl-carousel-item img { position: absolute; width: 100%; height: 100%; object-fit: cover; }
.header-carousel .owl-carousel-item p { font-size: 16px !important; }
}
.header-carousel .owl-dots { position: absolute; width: 60px; height: 100%; top: 0; right: 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.header-carousel .owl-dots .owl-dot { position: relative; width: 45px; height: 45px; margin: 5px 0; background: #FFFFFF; box-shadow: 0 0 30px rgba(255, 255, 255, .9); border-radius: 45px; transition: .5s; }
.header-carousel .owl-dots .owl-dot.active { width: 60px; height: 60px; }
.header-carousel .owl-dots .owl-dot img { position: absolute; width: 100%; height: 100%; object-fit: cover; padding: 2px; border-radius: 45px; transition: .5s; }
.page-header { background: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, .1)), url(../images/carousel-1.jpg) center center no-repeat; background-size: cover; }
.breadcrumb-item + .breadcrumb-item::before { color: #000; }


/*** About ***/
@media (min-width: 992px) {
.container.about { max-width: 100% !important; }
.about-text {  padding-right: calc(((100% - 960px) / 2) + .75rem);
}
}
 @media (min-width: 1200px) {
.about-text {  padding-right: calc(((100% - 1140px) / 2) + .75rem);
}
}
 @media (min-width: 1400px) {
.about-text {  padding-right: calc(((100% - 1320px) / 2) + .75rem);
}
}
/*** Service ***/
.service-item { box-shadow: 0 0 45px rgba(0, 0, 0, .08); }
.service-icon { position: relative; margin: -50px 0 25px 0; width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; color: var(--primary); background: #FFFFFF; border-radius: 100px; box-shadow: 0 0 45px rgba(0, 0, 0, .08); transition: .5s; }
.service-icon .img2 { display: none; }
.service-item:hover .service-icon .img2 { display: inline-block; }
.service-item:hover .service-icon .img1 { display: none; }
.service-item:hover .service-icon { color: #FFFFFF; background: var(--primary); }


/*** Feature ***/
@media (min-width: 992px) {
.container.feature { max-width: 100% !important; }
.feature-text {  padding-left: calc(((100% - 960px) / 2) + .75rem);
}
}
 @media (min-width: 1200px) {
.feature-text {  padding-left: calc(((100% - 1140px) / 2) + .75rem);
}
}
 @media (min-width: 1400px) {
.feature-text {  padding-left: calc(((100% - 1320px) / 2) + .75rem);
}
}
/*** Project Portfolio ***/
#portfolio-flters li { display: inline-block; font-weight: 500; color: var(--dark); cursor: pointer; transition: .5s; border-bottom: 2px solid transparent; }
#portfolio-flters li:hover, #portfolio-flters li.active { color: var(--primary); border-color: var(--primary); }
.portfolio-img { position: relative; }
.portfolio-img::before, .portfolio-img::after { position: absolute; content: ""; width: 0; height: 100%; top: 0; background: var(--dark); transition: .5s; z-index:1;}
.portfolio-img::before { left: 50%; }
.portfolio-img::after { right: 50%; }
.portfolio-item:hover .portfolio-img::before { width: 51%; left: 0; }
.portfolio-item:hover .portfolio-img::after { width: 51%; right: 0; }
.portfolio-btn { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; opacity: 0; z-index: 2; transition: .5s; }
.portfolio-item:hover .portfolio-btn { opacity: 1; transition-delay: .3s; }


/*** Quote ***/
@media (min-width: 992px) {
.container.quote { max-width: 100% !important; }
.quote-text {  padding-right: calc(((100% - 960px) / 2) + .75rem);
}
}
 @media (min-width: 1200px) {
.quote-text {  padding-right: calc(((100% - 1140px) / 2) + .75rem);
}
}
 @media (min-width: 1400px) {
.quote-text {  padding-right: calc(((100% - 1320px) / 2) + .75rem);
}
}
/*** Team ***/
.team-item { box-shadow: 0 0 45px rgba(0, 0, 0, .08); }
.team-item img { /* border-radius: 8px 60px 0 0;*/
}
.team-item .team-social { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; background: #FFFFFF; transition: .5s; }
/*** Testimonial ***/
.testimonial-carousel::before { position: absolute; content: ""; top: 0; left: 0; height: 100%; width: 0; background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); z-index: 1; }
.testimonial-carousel::after { position: absolute; content: ""; top: 0; right: 0; height: 100%; width: 0; background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); z-index: 1; }
 @media (min-width: 768px) {
.testimonial-carousel::before,  .testimonial-carousel::after { width: 200px; }
}
 @media (min-width: 992px) {
.testimonial-carousel::before,  .testimonial-carousel::after { width: 300px; }
}
.testimonial-carousel .owl-nav { position: absolute; width: 350px; top: 20px; left: 50%; transform: translateX(-50%); display: flex; justify-content: space-between; opacity: 0; transition: .5s; z-index: 1; }
.testimonial-carousel:hover .owl-nav { width: 300px; opacity: 1; }
.testimonial-carousel .owl-nav .owl-prev, .testimonial-carousel .owl-nav .owl-next { position: relative; color: var(--primary); font-size: 45px; transition: .5s; }
.testimonial-carousel .owl-nav .owl-prev:hover, .testimonial-carousel .owl-nav .owl-next:hover { color: var(--dark); }
.testimonial-carousel .testimonial-img img { width: 100px; height: 100px; }
.testimonial-carousel .testimonial-img .btn-square { position: absolute; bottom: -19px; left: 50%; transform: translateX(-50%); }
.testimonial-carousel .owl-item .testimonial-text { margin-bottom: 30px; box-shadow: 0 0 45px rgba(0, 0, 0, .08); transform: scale(.8); transition: .5s; }
.testimonial-carousel .owl-item.center .testimonial-text { transform: scale(1); }


/*** Contact ***/
@media (min-width: 992px) {
.container.contact { max-width: 100% !important; }
.contact-text {  padding-left: calc(((100% - 960px) / 2) + .75rem);
}
}
 @media (min-width: 1200px) {
.contact-text {  padding-left: calc(((100% - 1140px) / 2) + .75rem);
}
}
 @media (min-width: 1400px) {
.contact-text {  padding-left: calc(((100% - 1320px) / 2) + .75rem);
}
}
/*** Footer ***/
.footer .btn.btn-social { margin-right: 5px; color: #9B9B9B; border: 1px solid #9B9B9B; border-radius: 38px; transition: .3s; }
.footer .btn.btn-social:hover { color: var(--primary); border-color: var(--light); }
.footer .btn.btn-link { display: block; margin-bottom: 5px; padding: 0; text-align: left; color: #9B9B9B; font-weight: normal; text-transform: capitalize; transition: .3s; }
.footer .btn.btn-link::before { position: relative; content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 10px; }
.footer .btn.btn-link:hover { color: #FFFFFF; letter-spacing: 1px; box-shadow: none; }
.footer .copyright { padding: 25px 0; border-top: 1px solid rgba(256, 256, 256, .1); }
.footer .copyright a { color: var(--light); }
.footer .copyright a:hover { color: var(--primary); }
.dropdown-menu a { font-size: 13px; }
.portfolio-item { min-height: 396px; }
.he { height: 72px; display: none; }
 @media (max-width: 1520px) {
.aaa { display: none !important; }
}
 @media (max-width: 1360px) {
.navbar .navbar-nav .nav-link { margin-right: 15px; }
.navbar .navbar-brand { max-width: 30%; }
.navbar .navbar-brand img { max-width: 100%; }
}
 @media (max-width: 980px) {
.he { display: block; }
.portfolio-container{ height:auto !important;}
.portfolio-item { min-height: 0; position:static !important;}
.navbar .navbar-brand { max-width: 70%; }
.navbar .navbar-brand img { max-width: 100%; }
}
/*<!---->*/
.portfolio-item .img{ padding-bottom:66%; position:relative; overflow:hidden;}
.portfolio-item .img img{ display:block; width:100%; height:100%; position:absolute; top:0; right:0; bottom:0; left:0; margin:auto auto; object-fit:cover;}
