
@media (max-width: 1200px) {
    .container {
       max-width:1300px
    }
}

@media (min-width: 1300px) {
    .container {
        max-width:1400px
    }
}

.socialtextalign{text-align:right;}
.getQuote{text-align:right;}
 .social-icons::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:#9c0;
    z-index: -1;
    border-radius: 50%;
    transform: translate(100%,100%);
    transition: all .4s;
}
 .social-icons:hover::before{
    transform: translate(0);
    animation: anim .4s linear;
}
@keyframes anim{
    0%,100%{
        width: 100%;
        height: 100%;
    }
    50%{
        width: 50%;
        height: 50%;
    }
}



 .social-icons{
    width: 40px;
    height: 40px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
    border-radius: 50%;
    overflow: hidden;
	transition: background 0.2s, color 0.2s;
	font-size:15px;
}
.social-icons span:before {
    display:inline-block;
}


@keyframes spinAround {
  from {
    transform: rotate(0deg)
  }
  to {
    transform: rotate(360deg);
  }
}
.social-icons span:hover::before{
  animation: spinAround 2s linear infinite;
}
 .fb, .linkdin {
    font-size: 20px;

}


.social-icons:hover {
   /* background:#F8CB2E;
    color:#ffffff; */
}
  .icomoonMargin{
    margin-right:5px;
    margin-left:5px;
  }
  
  .custom-video {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.section-overlay {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    width: 100%;
    height: 100%;
    opacity: 0.35;
    background-color: transparent;
    background-image: linear-gradient(.49deg, rgb(242 242 242 / 65%) 0%, rgba(17, 22, 31, 0) 100%);
    transition: background .3s, border-radius .3s, opacity .3s;
}
.section-overlay {
    z-index: 2;
  /*  opacity: 0.9;*/
}
#hero {
 /*   background-image: url("../images/slider/slider-bg-1.jpg");
    background-size: cover;
    /* height: 100vh; */
    position: relative;
    display: flex;
    justify-content: center;
    align-items: end;
    height: calc(100vh - 100px);
}
.container-content{z-index:2;}
#search-form:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    font-family: 'icomoon' !important;
    content: "\e917";
    content: "\e904";
}
[data-toggle=modal], .seacrModal button i {
    position: absolute;
    top: 23px;
    left: 0;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 23px;
}

.seacrModal button {
  position: relative;
  padding: 0;
  border: none;
  background: none;
  outline: none;
  cursor: pointer;
}
[data-toggle=modal] {
 
  transition: all 0.3s ease;
}
[data-toggle=modal] i {
  font-size: 2rem;
}
[data-toggle=modal]:focus {

}

.seacrModal .modal {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.);
    visibility: hidden;
    opacity: 0;
    z-index: -1;
    transform: translateY(1rem) translateZ(0);
    transition: all 0.3s ease;
    height: 15%;
    /* max-width: 50%; */
    background: linear-gradient(180deg, #171e2a, rgba(23, 30, 42, .82));
}
.seacrModal .modal.active {
  visibility: visible;
  transform: translateY(0) translateZ(0);
  opacity: 1;
  z-index: 999;
  visibility: visible;
}
.seacrModal .modal.active .content {
  opacity: 1;
  visibility: visible;
}
.seacrModal .searchbtn {
    position: absolute;
    height: 42px;
    width: 8rem;
    top: 38px;
    right: 11rem;
    color: white;
    background: red;
    display: inline;
    width: 132px;
    background-color: #809cd0;
    white-space: nowrap;
    transition: all .3s;
    transform: skewX(-12deg);
    overflow: hidden;
	text-transform: uppercase;
}

.seacrModal .searchbtn:after {
    content: "";
    position: absolute;
    z-index: -1;
    transition: all .3s;
    width: 0;
    height: 100%;
    top: 0;
    background: #fff;
    left: 0;
}
.seacrModal .searchbtn:hover:after {
    width: 100%;
}
.seacrModal .searchbtn:hover {
   color:#9c0;
}
.seacrModal .modal [data-dismiss=modal] {
    position: absolute;
    height: 2rem;
    width: 2rem;
    top: 30px;
    right: 6rem;
}
.seacrModal .modal [data-dismiss=modal]:focus i {
  color: #0288D1;
}
.seacrModal .modal [data-dismiss=modal] i {
  font-size: 2rem;
}
.seacrModal .modal [data-dismiss=modal] span {
    display: block;
    color: rgba(255, 255, 255, 0.9);
    font-size: 30px;
    transform: translateY(1.1rem);
}
.seacrModal .modal .content {
    position: absolute;
    top: 60px;
    right: 0;
    bottom: 0;
    left: 0;
    width: 56%;
    margin: 0 auto;
    /* padding: 1rem 0; */
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease 0.3s;
}

.seacrModal .modal .content > div {
  position: absolute;
  width: 100%;
  top: 8rem;
  left: 0;
  transition: all 0.3s cubic-bezier(1, 0.1, 0, 0.9);
}



.seacrModal .modal input {
    display: block;
    width: 100%;
    background: none;
    border: 1px solid #0288D1;
    border-width: 0 0 1px 0;
    color: white;
    /* padding: 1.5rem 0; */
    font-size: 2rem;
    font-weight: 100;
    margin-right: 17px;
    padding-left: 28px;
    border-bottom: 1px solid hsla(0, 0%, 100%, .12);
    font-size: 15px;
}
.seacrModal .modal input:focus {
  outline: none;
}

.seacrModal .modal .back {
  position: absolute;
  top: 0;
  left: 0;
  height: 1.5rem;
  width: 1.5rem;
}
.seacrModal .modal .back i {
  font-size: 1.5rem;
}
.seacrModal .modal ::-moz-placeholder {
  color: rgba(255, 255, 255, 0.3);
  font-weight: 100;
  font-family: "Roboto";
}
.seacrModal .modal :-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.3);
  font-weight: 100;
  font-family: "Roboto";
}
.seacrModal .modal ::placeholder {
  color: rgba(255, 255, 255, 0.3);
  font-weight: 100;
  font-family: "Roboto";
}

.seacrModal .material-icons {
  color: white;
}
.seacrModal {
    text-align: right;
    margin-top: -13px;
}
.icomoon {
    margin-left: 20px;
    font-size: 20px;
}
.btn-main {
    text-transform: uppercase;
    color: #9c0;
    border: 2px solid #9c0;
    background-color: transparent;
    border-radius: inherit;
		height: 52px;
    padding: 0 40px;
}
.btn-main:hover {
    color: #fff;
    border-color: #8cbb00;
}

.global-button {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: .03em;
    transform: skewX(-12deg);
    transition: all .3s ease;
}
.global-button:hover{
  color:#fff;
}
.global-button:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    transition: all .3s ease;
}
.global-button:hover:before {
    width: calc(100% + 2px);
	color:#fff;
}
.global-button-content-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    transform: skewX(12deg);
    z-index: 1;
}
.global-button:before {
    left:0;
    background-color: #8cbb00;
}
.btn-transparent{
    text-transform: uppercase;
    color: #fff;
    background-color: #9c0;
	height: 52px;
    padding: 0 40px;
	  border-radius: inherit;
}
.submitBtn button,.viewboreBtn button,.show-more button,.show-less button{
border:none;
}
.getQuote .btn-transparent{
height: 41px;
}
.global-button:focus:before, .global-button:hover:before {
    width: 100%;
	color:#fff;
}
.btn-transparent:before {
    background-color: #8cbb00;
}

.bannerContent{display:flex;justify-content: space-between;align-items:center;}
.slider-heading{
    font-size: 70px;
    line-height: 1.115em;
    letter-spacing: -.03em;
    max-width: 50%;
}
.slider-content {
    font-size: 32px;
    line-height: 1.25em;
    letter-spacing: -.32px;
    max-width:50%;
}

.ex4:hover i{
  color: #ef43a1;
  -moz-transition: all 600ms cubic-bezier(0.99, 0, 0.57, 0.94);
  -o-transition: all 600ms cubic-bezier(0.99, 0, 0.57, 0.94);
  -webkit-transition: all 600ms cubic-bezier(0.99, 0, 0.57, 0.94);
  transition: all 600ms cubic-bezier(0.99, 0, 0.57, 0.94);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}



.group 			  { 
  position:relative; 
  margin-bottom:50px; 
  margin-left: 0;
  margin-top: 0;
}

.inputMaterial {
    font-size: 18px;
    padding: 10px 10px 10px 17px;
    display: block;
    width: 100%;
    border: none;
    border-bottom: 1px solid #848484;
    background: none;
    color: #000;
}

.inputMaterial:focus 		{ outline:none;}
.form-control {
    border: none;
    border-bottom: 1px solid #848484;
}
.form-control:focus {
    color: var(--bs-body-color);
    background-color:none;
    border-color:#d9d9d9;
    outline: 0;
    box-shadow:none;
}
.group  label {
   
    pointer-events: none;
    
    width: max-content;
    align-items: center;
    /* height: 50px; */
    font-size: 16px;
    font-weight: 500;
    line-height: 2em;
    letter-spacing: -.13px;
    color: #000;
    position: absolute;
    left: 20px;
    top: 0;
    transition: .23s;
}
.form-floating>label {
 
    transition: .23s;
	left: 5px;
	
}
.form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label {
    
    top: -15px;
    font-size: 12px;
    color: #000;
	
}
/* LABEL ======================================= */



/* active state */
.inputMaterial:focus ~ label, .inputMaterial:valid ~ label {
    top: -15px;
    font-size: 12px;
    color: #000;
}

/* BOTTOM BARS ================================= 

.bar 	{ position:relative; display:block; width:315px; }
.bar:before, .bar:after 	{
  content:'';
  height:2px; 
  width:0;
  bottom:1px; 
  position:absolute;
  background: #009688; 
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}
.bar:before {
  left:50%;
}
.bar:after {
  right:50%; 
}
*/
/* active state */
.inputMaterial:focus ~ .bar:before, .inputMaterial:focus ~ .bar:after {
  width:50%;
}

/* Error Text*/


.error-txt {
  position: absolute;
  font-family: arial;
  color: red;
  font-size: 14px;
  bottom: -18px;
  display: none;
}
/* Display the error message when the input is focused and invalid */
.inputMaterial:focus:invalid + .error-txt {
  display: block;
}

/*hide and show classes css*/
.hide {
  display: none;
}
.show {
  display: block;
}
.group.error::before {
    content: "";
    display: block;
    position: absolute;
    background-color: #848484;
    bottom: 0;
    width: 1px;
    height: 45px;
    transform: skewX(-12deg);
    left: 4px;
}
.form-control:focus {
   
    border-color: #848484;
  
}
.form-select,.form-control{border-radius:0;}
input[type=text]:hover,input[type=number]:hover,input[type=email]:hover, textarea:hover,select:hover {
     border-bottom: 1px solid #e64946; 
}
.hide-block {
    display: none;
}
.hide-block .seo-content, .show-block {
    background-color: #f6f8fa;
    transition: opacity .5s ease 0s;
    padding: 24px 30px;
    margin-left: 0;
    position: relative;
    /* border-bottom: 1px solid rgba(0, 0, 0, .18); */
    overflow: hidden;
    text-align: justify;
    margin-bottom: 30px;
}

.hide-block h3,h2,.show-block h3, h2{
margin:20px 0;
    font-size: 22px;

}
.dedcription-btn{
 float:right;
 margin-top:20px;
}

.googlemapbtn .mapclick {
	color: #fff;
}


/* contact us page style*/

.dedcription-btn{
 float:right;
 margin-top:20px;
}
.bgcontact-overlay {
    position: relative;
    z-index: 1;
}
.bgcontact-overlay:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
   background: linear-gradient(to bottom, #1b1a1a 0%, #1b1a1a 18%, rgba(27, 26, 26, 0) 64%, rgba(27, 26, 26, 0) 100%);
}
.pagetitle__heading {
    font-size: 75px;
    line-height: 1.1;
    margin-bottom: 20px;
    position: absolute;
    top: 50%;
    left: 40%;
    color: #fff;
    font-weight: 800;
    z-index: 9;
}
.breadcrumb-area {
    padding: 15px 0;
}
.breadcrumb {
    padding: 0;
    background-color: transparent;
}
.breadcrumb-item {
    position: relative;
    font-size: 14px;
}
.breadcrumb-item a {
    color: #616161;
}
.breadcrumb-item+.breadcrumb-item {
    padding-left: .5rem;
}
.breadcrumb-item.active {
    color: #6c757d;
}
.breadcrumb-item+.breadcrumb-item::before {
    display: inline-block;
    padding-right: .5rem;
    color: #6c757d;
    content: "/";
}
.breadcrumb-item + .breadcrumb-item::before {
   font-family: 'icomoon' !important;
    font-weight: 900;
    content: "\e907";
}
.contact-panel {
    position: relative;
    z-index: 2;
    padding: 50px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 5px 83px 0 rgba(3,43,86,0.12);
    /* background-color: var(--surface-color); */
    height: 100%;
    padding: 30px;
   
    /* box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1); */
}
.contact-panel__title {
    font-size: 24px;
    font-weight: 600;
    margin: 25px 0;
}
.contact-panel__desc {
    font-size: 15px;
    margin-bottom: 40px;
}
.info-wrap {
	background-color: var(--surface-color);
	
	padding: 30px;
	height: 100%;
}
.info-item {
	margin-bottom: 30px;
}
.info-item i {
	font-size: 20px;	
	width: 44px;
	height: 44px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50px;
	transition: all 0.3s ease-in-out;
	margin-right:5px;
}
.info-item h3 {
	padding: 0;
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 5px;
	color:#37517e;
}
.info-item p {
	padding: 0;
	margin-bottom: 0;
	font-size: 14px;
}


.swiper-button-next, .swiper-rtl .swiper-button-prev,.swiper-button-prev, .swiper-rtl .swiper-button-next {
   
    background: #9c0;
    transform: skewX(-12deg);
}

.swiper-button-next:after,
 .swiper-rtl .swiper-button-prev:after,
 .swiper-button-prev:after,
 .swiper-rtl .swiper-button-next:after  {

    color: #fff;
    font-size: 15px;
}

@media (max-width: 1533px) {
#hero {
    align-items: end;
     height: 100vh; 

}
}

@font-face {
  font-family: "bootstrap-icons";
  src: url("../fonts/bootstrap-icons.woff2") format("woff2"),
       url("../fonts/bootstrap-icons.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
