@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700;900&family=Nunito:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
caption, tbody, tfoot, thead, 
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
*, * focus {
	outline: none!important;
	margin: 0;
	padding: 0;
}

*,
*:before,
*:after{
box-sizing: border-box;
}


html {overflow: hidden;width: 100%;}

body {
	height: 100%;
	position: fixed;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}



.fix-body{
	position:fixed;
	left:0;
	top:0;
	z-index:1000;
	width:100%!important;
	height:100vh!important;
	overflow:hidden!important;
}

.h1, .h2, .h4, .h5, h1, h2, h4, h5{    
    font-family: 'Merriweather', serif !important;
    font-weight: 700 !important;
}

.main-font{}
.alt-font{}
.leater-space {letter-spacing: 1px;}
.color-black {color: #384141;}
.color-blue {color: #21c2c2;}

/* ===================================
    General
====================================== */

/* overlay */
.bg-overlay{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

/* opacity */
.opacity-full{opacity: 1;}
.opacity-1{opacity: .1;}
.opacity-2{opacity: .2;}
.opacity-3{opacity: .3;}
.opacity-4{opacity: .4;}
.opacity-5{opacity: .5;}
.opacity-6{opacity: .6;}
.opacity-7{opacity: .7;}
.opacity-8{opacity: .8;}
.opacity-9{opacity: .9;}

.bg-black{background: #000000}

body{
    font-family: 'Nunito', sans-serif;!important;
	font-weight:400!important;
	line-height: 30px!important;
	font-size: 16px!important;
	color: #222!important;
	text-decoration: none;
	height:100vh;
	background-color:#fff;
}



a:active, a:hover, a {
    text-decoration: none;
}

.full-screen {height: 100vh;}

.portrait-msg{
    display:none;
    width:100%;
    height:100vh;
    line-height:100vh;
    position:fixed;
    z-index:1000;
    left:0;
    top:0;
    background-color:#00296b;
    color:#fff;
    font-weight:700;
    text-align:center;
}
.portrait-msg i{
    color:#f0bc30;
}
@media screen and (max-height: 414px) {
.portrait-msg{
    display:block;
}
}



.slider-social{
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left:4px;
    z-index: 13;
}

.slider-social a{
    display: block;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 30px;
    border-radius: 50px;
    color: #ffffff;
    font-size: 16px;
    margin: 9px;
    border: 1px solid transparent;
    -webkit-transition: background-color .2s ease-in-out;
    -moz-transition: background-color .2s ease-in-out;
    -ms-transition: background-color .2s ease-in-out;
    -o-transition: background-color .2s ease-in-out;
    transition: background-color .2s ease-in-out;
}

.slider-social a:hover{
    background-color:#ffffff;
}

.slider-social .animated-wrap a:hover{
    background-color: transparent;
    color: #ffffff;
}

header{
	position:fixed;
	z-index:10;
	width:100%;
	height:auto;
}
.logo{    
}
.logo img{
	width:auto;
	height:auto;
}
.login {
	width:125px;
	height:50px;
    position: absolute;
    text-align:right;
    right:-15px;
    top: .3rem;
    padding:0;
    line-height: 1;
    text-align: center;
    font-weight:600;
    font-size: .9rem;
    color:rgba(0,0,0,.8);
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -o-transition: all .5s ease;
}
.login img {
	height:50px;
}
.login:hover {
	right:-10px;
}
@media screen and (max-width: 768px) {
.logo img{
	width:auto;
	height:60px;
}

}



.social-icons-simple{
    margin-bottom: 0;
    margin-left: -10px;
    padding: 0;
}

.social-icons-simple li{
    display: inline-block;
}

.social-icons-simple li a {
    display: block;
    font-size: 16px;
    color: #FFFFFF;
    height: 38px;
    line-height: 38px;
    border: 1px solid transparent;
    text-align: center;
    width: 38px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    position: relative;
    z-index: 1;
    overflow: hidden;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.social-icons-simple li a:hover{
    color: #FFFFFF;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}


#demos{
	width:100%;
	height:100vh;
}

.owl-carousel .owl-stage-outer {
    position: relative;
    -webkit-transform: translate3d(0,0,0);
}
#demos .owl-carousel {
    margin: 0;
	background-color:#f1f1f1;
	height:100vh;
	position:relative;
}
#demos .owl-carousel .owl-item {
	overflow:hidden;
}
#demos .owl-carousel .item {
	width:100%;
	height:100vh;
	color:#fff;	
}
#demos .owl-carousel .item img{
	display:none;
}
#demos .owl-carousel .item h4 {
    color: #fff;
    font-weight: 400;
    margin-top: 0rem;
}
#demos .owl-carousel .owl-nav{
	position:absolute;
	z-index:100;
	left:0;
	bottom:100px;
	width:100%;
	text-align:center;
	display:none;
}
#demos .owl-carousel .owl-dots{
    position:relative;
	width:80%;
	margin:0 auto;
	z-index:100;
	bottom:80px;
	text-align:center;
	display:table;
}
#demos .owl-carousel .owl-dots:after{
    content: "";
	width:100%;
	height:8px;
	background-color:rgba(255,255,255,.5);
	text-align:center;
    position: absolute;
    bottom: -5px;
	left:0;
	border-radius:4px;
}
.owl-dots .owl-dot {
  display:table-cell!important;  
}
.owl-dots .owl-dot button {
  background: none;
  border: none;
  padding: 0;
  color: rgba(255,255,255,1);
  font-size: 14px;
  line-height:40px;
  font-weight: 800;
  cursor: pointer;
  position:relative;
  text-shadow:1px 1px 3px rgba(0,0,0,.3);
}
.owl-dots .owl-dot button:after{
    content: "";
	width:12px;
	height:8px;
	background-color:#fff;
	text-align:center;
    position: absolute;
	z-index:1;
    bottom: -5px;
	left:50%;
	margin-left:-6px;
	border-radius:4px;
}
.owl-dots .owl-dot.active button:after{
	background-color:#f0bc30;
}
.owl-dots .owl-dot.active button {
  color: #f0bc30;
}
.owl-theme .owl-dots .owl-dot span {
    width: 20px!important;
    height: 20px!important;
    margin: 5px 7px;
    background: transparent!important;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 10px!important;
	border:solid 2px #fff!important;
}
.owl-theme .owl-dots .owl-dot.active span {
	width: 40px!important;
    background: #fff!important;
}


@media (max-width: 992px) {
#demos .owl-carousel .owl-dots{
    width:90%;
	bottom:80px;
}
.owl-dots .owl-dot button {
  color: #fff;
  font-size: 12px;
  font-weight: 600;
}
}

@media (max-width: 768px) {
#demos .owl-carousel .owl-dots{
    position:fixed;
	width:100%;
	margin:0 auto;
	z-index:1000;
	bottom:30px!important;
	text-align:center;
	display:table;
}
.owl-dots .owl-dot button {
  color: #fff;
  font-size: 8px;
}
}
@media (max-width: 600px) {
#demos .owl-carousel .owl-dots:after{
    background-color:rgba(255,255,255,0);	
}
.owl-dots .owl-dot {
  display:inline-block!important;
  margin:0 10px;
}
.owl-dots .owl-dot button {
  color: rgba(0,0,0,0)!important;
  font-size: 1px;
}
}

/* ===================================
    Services Section
====================================== */

.main-slider{
}
.bg-slider1{
	background: url(../images/slider1.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position:right bottom;
}
.sl1-text {
	width:52rem;
	height:52rem;
	border-radius:100%;
	background-color:#00296b;
	position: absolute;
	top:-10rem;
    left:-13rem;
    box-shadow: 0px 0px 15px rgba(0,0,0,.5);
	opacity:0;
}
.sl1-thumb {
	width:40rem;
	height:40rem;
	border-radius:100%;
	background-color:#f0bc30;
	position: absolute;
	z-index:0;
 	top:1rem;
    left:2rem;
	opacity:0;
}
.sl2-text {
	width:52rem;
	height:52rem;
	border-radius:100%;
	background-color:#00296b;
	position: absolute;	
	top:-10rem;
	right:-13rem;
    box-shadow: 0px 0px 15px rgba(0,0,0,.5);
	opacity:0;
}
.sl2-thumb {
	width:40rem;
	height:40rem;
	border-radius:100%;
	background-color:#f0bc30;
	position: absolute;
	z-index:0;
	top:1rem;	
    right:2rem;
	opacity:0;
}
.owl-item.active h1 {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInDown;
  animation-delay: 1.5s;
  opacity:1;
}
.owl-item.active h3 {
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInDown;
  animation-delay: .5s;
  opacity:1;
}
.owl-item.active h5 {
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: .5s;
  opacity:1;
}
.owl-item.active h6 {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: 1.5s;
  opacity:1;
}
.owl-item.active ul {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: 1s;
  opacity:1;
}
.owl-item.active form{
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: 1s;
  opacity:1;
}
.owl-item.active .sl1-text {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInLeft;
  animation-delay: 0.2s;
  opacity:1;
}
.owl-item.active .sl1-thumb {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInLeft;
  animation-delay: 0.2s;
  opacity:1;
}
.owl-item.active .sl2-text {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInRight;
  animation-delay: 0.2s;
  opacity:1;
}
.owl-item.active .sl2-thumb {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: fadeInRight;
  animation-delay: 0.2s;
  opacity:1;
}

section .container {
}
@media (min-width: 1280px) {
  .container {
    max-width: 1220px!important;
  }
}

h1{
	color:#fff !important;
	font-size:3rem!important;
    line-height: 1.3!important;
	opacity:0;
}
h3{
	color:#f0bc30 !important;
	font-size:1.8rem!important;
    line-height: 1.1!important;
	font-family: 'Nunito', sans-serif;!important;
    font-weight: 800!important;
	opacity:0;
}
h5{
	color:#f0bc30 !important;
	font-size:1.2rem!important;
    line-height: 1.2!important;
	font-family: 'Nunito', sans-serif;!important;
    font-weight: 700!important;
	opacity:0;
}
h5 a{
	color:#fff !important;
}
h6{
	font-size:1.2rem!important;
	line-height: 1.2!important;
	color:#fff !important;
	font-family: 'Nunito', sans-serif;!important;
    margin: 1rem 0!important;
	opacity:0;
}
.owl-carousel form{
	opacity:0;
}
.owl-carousel ul{
	margin:0 0 0 25px!important;
	position:relative;
	list-style:none;
	opacity:0;
}
.owl-carousel ul li{
	position:relative;
	padding-left:15px;
	
}
.owl-carousel ul li:before {
    content: "\f00c";
    font-family: 'Font Awesome 5 Free'!important;
    font-style: normal;
    font-weight: bold;
    text-decoration: inherit;
    color: #f0bc30 ;
    font-size: 16px;	
	width:28px;
	text-align:center;
    position: absolute;
    top: 0px;
    left: -20px;
}




.bg-slider2 {
	background: url(../images/slider2.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}
.bg-slider3 {
	background: url(../images/slider3.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}
.bg-slider4 {
	background: url(../images/slider4.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}

.bg-slider5 {
	background: url(../images/slider5.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}
.bg-slider6 {
	background: url(../images/slider6.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}
.bg-slider7 {
	background: url(../images/slider7.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}
.bg-slider8 {
	background: url(../images/slider8.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}

@media screen and (max-width: 1024px) {
section .container {
	
}
.sl1-text {
	width:46rem;
	height:46rem;
	top:-10rem;
    box-shadow: 0px 0px 15px rgba(0,0,0,.5);
}
.sl1-thumb {
	width:32rem;
	height:32rem;
	top:1rem;
}
.sl2-text {
	width:46rem;
	height:46rem;
	top:-10rem;
     box-shadow: 0px 0px 15px rgba(0,0,0,.5);
}
.sl2-thumb {
	width:32rem;
	height:32rem;
	top:1rem;
}
}



@media screen and (max-width: 992px) {
.bg-slider1, .bg-slider2, .bg-slider3, .bg-slider4, .bg-slider5, .bg-slider6, .bg-slider7, .bg-slider8 {
	/*background-image:none;*/
	background-color:#00296b;
}
.sl1-text {
	width:100%!important;
	height:100vh;
	border-radius:0;
	background-color:#00296b;
	position: fixed;
	left:0;
	top:0;
	opacity:1;
    box-shadow: 0px 0px 15px rgba(0,0,0,0);
}
.sl1-thumb {
	display:none;
}
.sl2-text {
	width:100%!important;
	height:100vh;
	border-radius:0;
	background-color:#00296b;
	position: absolute;
	top:0;
	right:0;
	opacity:1;
    box-shadow: 0px 0px 15px rgba(0,0,0,0);
}
.sl2-thumb {
	display:none;
}
.owl-item.active .sl1-text {
  -webkit-animation-duration: 0s;
  animation-duration: 0s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: none;
  animation-delay: 0s;
  opacity:1;

}
.owl-item.active .sl1-thumb {
  -webkit-animation-duration: 0s;
  animation-duration: 0s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: none;
  animation-delay: 0s;
}
.owl-item.active .sl2-text {
  -webkit-animation-duration: 0s;
  animation-duration: 0s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: none;
  animation-delay: 0s;
  opacity:1;
}
.owl-item.active .sl2-thumb {
  -webkit-animation-duration: 0s;
  animation-duration: 0s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-name: none;
  animation-delay: 0s;
}
.owl-item.active h1, .owl-item.active h3, .owl-item.active h6, .owl-item.active ul,  .owl-item.active form {
  -webkit-animation-duration: 0s;
  animation-duration: 0s;
  animation-delay: 0s;
}

#demos .owl-carousel .item img{
	width:80%;
	height:auto;
	display:block;
	margin:0 auto;
	position:absolute;
	z-index:1;
	left:10%;
	bottom:0;
}

section {
    position: relative;
    color: #fff;
    height:100%!important;
}
h1{
	font-size:2rem!important;        
}
h3{
	font-size:1.2rem!important;        
}
h6{
	font-size:1rem!important;        
	color:#fff !important;
    margin: 1rem 0!important;
}
}

@media screen and (max-width: 580px) {
#demos .owl-carousel .item img{
	width:90%;
	height:auto;
	display:block;
	margin:0 auto;
	position:absolute;
	z-index:1;
	left:5%;
}
}

@media screen and (max-height: 800px) {
#demos .owl-carousel .item img{
	width:90%;
	height:auto;
	left:5%;
	bottom:50px;
}
}

@media screen and (max-height: 640px) {
#demos .owl-carousel .item img{
	width:70%;
	height:auto;
	left:15%;
	bottom:20px;
}
}



@media screen and (max-width: 480px) {
.container{
    padding: 0 30px !important;        
}
h1{
	font-size:2rem;
}
h3{
	font-size:1.2rem;
}
h6{
	font-size:1rem;
	color:#fff !important;
    margin: 1rem 0;
}
}



::-webkit-input-placeholder { /* Chrome */
  color: #495057;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #495057;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #495057;
  opacity: 1;
}
:-moz-placeholder { /* Firefox 4 - 18 */
  color: #666;
  opacity: 1;
}
input[type="text"], input[type="tel"], input[type="email"] {
	background-color: rgba(255,255,255,1);
	font-size: .9rem;
	border:solid 1px #ddd;
	color: #495057;
	padding: 0 1rem;
	height:44px;
	width: 100%;
	border-radius:22px;
	margin:0 0 20px 0!important;
}

.btn1 {
    background-color: #f0bc30;
    padding: 0 2rem;
    font-size: 1.5rem;
    font-weight:700 !important;
    line-height: 60px;
    color: rgba(0,0,0,.9)!important;
    display: inline-block;
    border-radius: 30px;
    border: 0;
    outline: 0;
    text-decoration:none!important;
    text-align:center!important;
}


@media screen and (max-width: 992px) {
.btn1 {
    font-size: 1.2rem;
    line-height: 40px;
    border-radius: 20px;
}
}


.f-user:before {
    content: "\f232";
    font-family: 'Font Awesome 5 Free'!important;
    font-style: normal;
    font-weight: 900;
    text-decoration: inherit;
    color: #1d9eb6;
    font-size: 18px;
	width:28px;
	text-align:center;
    position: absolute;
    bottom: 20px;
    left: 20px;
}

.demobutton {
	background-color: #f0bc30;
	font-size: 14px;
	border:solid 1px #ddd;
	color: #000;
	padding: 0 1rem;
	height:44px;
	width: 100%;
	border-radius:22px;
	margin:0 0 20px 0!important;
}