@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400&display=swap');

body{font-family: 'Roboto', sans-serif; margin:0; padding:0; font-size:16px; color:#000; line-height:30px; overflow-x: hidden;}




a{text-decoration:none; color:#333;}
a:hover{color:#333;}
a, .header, img, .btn, .btn i, .verticalbox a, :before, :after {-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-ms-transition: all .2s linear;
-o-transition: all .2s linear;
transition: all .2s linear;}


h1{font-size: calc(24px + (60 - 24) * ((100vw - 300px) / (1400 - 300))); font-weight:100;}
h2{font-size: calc(24px + (48 - 24) * ((100vw - 300px) / (1400 - 300)));  font-weight:100;}
h3{font-size: calc(16px + (30 - 16) * ((100vw - 300px) / (1400 - 300))); font-weight:300;}
.right-line{display: grid; grid-template-columns: auto minmax(20px, 1fr); align-items: center; grid-gap: 20px; width: 100%;}
.right-line:after {content: '';border-top: 1px solid #ccc;}

.lead{font-size:18px;}

/*.spacer{height:145px;}*/
.mb-n5{margin-bottom: -80px;}
.header{width:100%; position:fixed; z-index:999; padding:0; background:none;}
.header .container{padding:15px; position: relative;}
.headertop{background:#000;}
.headertop .container{padding:0; font-size:13px; text-transform:uppercase;}
.headertop a{color:#9e9e9e;}
.headertop a:hover{color:#fff;}
.headertop i{font-size:20px; vertical-align: middle;}
.headertop, .border-start {border-left: 1px solid #504e4e!important;}
.header.shrink{padding:0; margin-top: -46px; background:#262626;  -webkit-box-shadow: 1px 1px 2px 0px rgba(50, 50, 50, 0.1); -moz-box-shadow: 1px 1px 2px 0px rgba(50, 50, 50, 0.1); box-shadow: 1px 1px 2px 0px rgba(50, 50, 50, 0.1);}
.header .btn{font-size:20px;}
.logo img{max-width:230px;}
.shrink .logo img{max-width:150px;}
.searchicon{color:#fff; font-size:16px; -moz-transform: scaleX(-1); -o-transform: scaleX(-1);
-webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; border:0; margin-bottom:10px; padding:10px; border-radius:5px;}


.button-search {
	position: absolute; right:0; top:44%; color:#fff; font-size:20px; -moz-transform: scaleX(-1); -o-transform: scaleX(-1);
-webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH";
    border: 0;
    color: #fff;
    font-size: 20px;
    vertical-align: middle;
	background:none;
}



.btn{display: inline-flex; font-size:18px; text-transform: uppercase; font-weight:400; align-items: center; border-radius:0;
text-decoration:none; overflow: hidden; border: 0;}
.btn:hover{color:#000;}
.btn:focus{box-shadow:none;}

.btn:after, .btn:before{
	font-family: 'Line Awesome Free';
	content: '\f30b';
	font-size: 25px;
	font-weight: 700;
}
.btn:before{margin-left: -40px;margin-right: 10px;}
.btn:after{margin-left: 10px;}
.btn:hover:before{margin-left: 0}
.btn:hover:after{margin-right: -40px;}
.btn-link{color:#000;}
/*
.btn6{
  border:1px solid transparent; 
   -webkit-transition: all 0.4s cubic-bezier(.5, .24, 0, 1);
  transition: all 0.4s cubic-bezier(.5, .24, 0, 1);
}

.btn6::before {
  content: '';
  position: absolute;
  left: 0px;
  bottom:0px;
  z-index:-1;
  width: 0%;
  height:1px;
  background: #6098FF;
  box-shadow: inset 0px 0px 0px #6098FF;
  display: block;
  -webkit-transition: all 0.4s cubic-bezier(.5, .24, 0, 1);
  transition: all 0.4s cubic-bezier(.5, .24, 0, 1)
}

.btn6:hover::before {
  width:100%;
}

.btn6::after {
  content: '';
  position: absolute;
  right: 0px;
  top:0px;
  z-index:-1;
  width: 0%;
  height:1px;
  background: #6098FF;
  -webkit-transition: all 0.4s cubic-bezier(.5, .24, 0, 1);
  transition: all 0.4s cubic-bezier(.5, .24, 0, 1)
}
.btn6:hover::after {
  width:100%;
}
.btn6:hover{
  border-left:1px solid #6098FF;
  border-right:1px solid #6098FF;
}
*/



.access ul{margin:0; padding:0; list-style:none;}
.access li{display:inline-block;}
.access li a{font-size:16px; color:#fff; display:block; height:38px; line-height:38px; text-transform:uppercase; margin: 0 20px;}
.access li a:hover, .access li a.active{color:#ccc;}

.banner {background: url(images/homebanner.JPG)center center; position:relative; background-size: cover;}
.banner:after{position: absolute; content:''; width: 100%; height: 100%; top:0; left:0; background:#000; opacity:.5;}
.topheight{height:180px;}
.after-box{position: relative; overflow: hidden; display: grid;}




.list, .listline{margin: 0;padding: 0;list-style: none; font-size:18px;}
.list li, .listline li{margin-bottom: 10px; display: flex; column-gap:15px;}
.list li:before{font-family:'Line Awesome Free'; display:flex; content:'\f058'; font-size:25px; font-weight:700;}

.listline{line-height:70px;}
.listline li{margin-bottom:0;}
.listline li:before{position: absolute; content:''; width:60px; height:1px; background:#4e4e4e; left:0; }
.listline li:first-child:before{content:none;}
.listline li a{color:#fff; padding-left:30px;}
.listline li a:hover{padding-left:0;}
.rightbox{position:relative;}
.rightbox:after{position:absolute; content:''; right:0; top:0; width:25%; height:100%; background:#fff;}


.thumbox{position:relative;}
.verticalbox{overflow: hidden;}
.verticalbox:hover img{transform: scale(1.03);}
.verticalbox span{
    font-size: 48px;
    font-weight: 300;
    position: absolute;
    background: #fff;
    color: #000;
    right: 0;
    height: 100%;
    padding: 0 30px;
    -webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
	-webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
	    transform: rotate(180deg);
    text-align: left;
	z-index: 1;
}
.verticalbox span:after {
    content: "";
    height: 30%;
    width: 1px;
    background: #000000;
    z-index: 1;
    bottom: 0;
    left: 50%;
    display: block;
    position: absolute;
}
.verticalbox img{
    height: 600px;
    object-fit: cover;
}
.verticalbox a{text-align:center; bottom:-80px; position: absolute; width: 100%;  display: flex; background: #fff;
overflow: hidden; opacity:0; text-transform: uppercase; padding:10px; font-weight:700; align-items: center;}
.verticalbox:hover a{bottom:0; opacity:1;}


.midbanner {background: url("images/midbanner.jpg") no-repeat; background-size:cover;}

.innerbanner{width:100%; background:#333; height:170px;}

.gallery {
    height: 100%;
    padding-bottom: 100%;
    position: relative;
    display:block;
}

.gallery img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}



.testimonial .slick-slide{position:relative; padding:0 50px;}
.testimonial span{font-size:18px; display:block;}
.testimonial .slick-arrow{position: absolute; font-size:30px; border:0; background:none; cursor: pointer; top: 50%; transform: translate(0, -50%); padding:8px; z-index:9;}
.la-arrow-left{left:0;}
.la-arrow-right{right:0;}
.testimonial img{margin:15px auto;}
.videowraper {
    position: relative;
    height: 550px;
    object-fit: cover;
    width: 900px;
    z-index: 1;
    margin-bottom: -140px;
}







.footer a{display:block; font-size:16px; margin:0; color:#fff; font-weight:500;}
.footer a:hover{color:#ccc;}
.footer h4{font-weight:500; text-transform: uppercase;}
.social a {display:inline-block; margin: 0 5px 0 0; font-size:30px;}
.f-logo{max-width:165px;}
.f-menu{padding:0;}




.form-control{background:0!important; font-size:13px; padding:0 10px; height:50px; margin-bottom:5px; }
.form-control:focus{border-color: #ccc; box-shadow: none; background-color:#eaf5f1; text-transform:none;}
.error{font-size: 13px; display: block; color: #f70000; margin-top: 5px;}
textarea.form-control{height:120px; padding-top:10px; resize:none;}

.form-control::place-holder{text-transform:none;}
.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
  text-transform:none;
}

.form-control::-ms-input-placeholder { /* Microsoft Edge */
  text-transform:none;
}

.contact-bg{position:relative; background:url(images/girl-bg.jpg) center center; width:100%; background-size: cover;}
.contact-bg:after{position:absolute; content:''; width:100%; height:100%;  top:0; background:rgba(255, 255, 255, .6);}
.formbox{position:relative; background:rgba(255, 255, 255, .8); border-radius:10px 10px 0 0;}
.contacticon, .contacticon a{font-size:20px;}

/*later code modified*/
.verticalbox2.position-relative span {
    font-size: 48px;
    font-weight: 300;
    position: absolute;
    background: #fff;
    color: #000;
    right: -23px;
    height: 100%;
    /* padding: 0px 42px; */
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    text-align: left;
    z-index: 1;
}

.verticalbox2.position-relative span::after {
    content: "";
    height: 30%;
    width: 1px;
    background: #000000;
    z-index: 1;
    bottom: 0;
    left: 50%;
    display: block;
    position: absolute;
}

/*later code modified*/
@media (min-width:1600px){
	.rightbox:after{width:28%;}
}


@media (max-width:1400px){
	.container{max-width:1230px; position:relative; }
}

@media (max-width:1199.98px){
	.access li a{margin:0 10px;}
}

@media (max-width:991.98px){
	.logo img {max-width:170px;}
	.shrink .logo img{max-width:130px;}
	.access li a{font-size:14px;}
	.banner h1{font-size:30px;}
	.rightbox:after{display:none;}
	.mb-n5{margin-bottom:-60px;}
	.innerbanner{height:140px;}
}

@media (max-width:767.98px){
	.button-search {position:absolute; right:65px; top:40%;}
	.mb-n5{margin-bottom:0;}
	.access li a{font-size:14px;}
	.snav{padding: 10px; width: 40px; cursor: pointer; z-index: 998!important; background:#313948; border:0;}	
	.snav i{display:block; background:#fff; height:2px;}
	.snav i+i{margin-top:5px;}
	.snav:focus{outline: none;}
	.snav.openbtn i:nth-child(1){
	-moz-transform: rotate(45deg) translateX(5px) translateY(5px);
	-webkit-transform: rotate(45deg) translateX(5px) translateY(5px);
	-o-transform: rotate(45deg) translateX(5px) translateY(5px);
	-ms-transform: rotate(45deg) translateX(5px) translateY(5px);
	transform: rotate(45deg) translateX(5px) translateY(5px);}
	.snav.openbtn i:nth-child(2){opacity:0;}
	.snav.openbtn i:nth-child(3){
	-moz-transform: rotate(-45deg) translateX(5px) translateY(-5px);
	-webkit-transform: rotate(-45deg) translateX(5px) translateY(-5px);
	-o-transform: rotate(-45deg) translateX(5px) translateY(-5px);
	-ms-transform: rotate(-45deg) translateX(5px) translateY(-5px);
	transform: rotate(-45deg) translateX(5px) translateY(-5px);}
	.btn-lg {padding: 10px 30px; font-size:16px;}
#nav {display:none; position:absolute; background:#313948; top:0; right:0; left:0;}
.access div {display: flex;align-items: center;justify-content: center;flex-flow: column;height: 100vh;}
.access ul li {display: block;height:50px;}
.access ul li a {font-size:16px; color:#fff;}
.access ul li a img {display: inherit;margin:0 0 0 5px;}
.access li a:hover, .access li a.active {color: #ccc;}
	

	
	
	
.banner {font-size: 16px;}
.banner h1{font-size:20px;}
.videowraper {position:relative; height:inherit; width:inherit; margin:0;}
}

@media (max-width: 575.98px) {
	.rightbox:after{display:none;}
	body{font-size:13px; line-height:20px;}
	.logo img {max-width: 130px;}
	.form-control {height:40px;}
	.banner h1{font-size:16px;}
	.footer{font-size:12px;}
	.headertop{font-size:10px;}
	.header.shrink {padding: 0; margin-top:0;}
	.btn{font-size:14px;}
	.list, .listline{font-size: 14px;}
	.listline {line-height:40px;}
	.topheight {height: 150px;}
	.verticalbox span{font-size:24px;}
	.innerbanner{height:120px;}
	.formbox h4{font-size:14px}

}