
*{
margin:0;
box-sizing: border-box;
}
:before,:after{
box-sizing: border-box;
}
.container{
max-width: 1200px;
margin:auto;
}
.row{
display: flex;
flex-wrap: wrap;
}
.v-center{
align-items: center;
}
ul{
list-style: none;
margin:0;
padding:0;
}
a{
text-decoration: none;
}
/* header */
.header{
display: block;
width: 100%;
position: fixed;
z-index: 99;
    padding: 10px 15px;

}
.header .item-left{
flex:0 0 17%;
}
.header .logo a{
font-size: 30px;
color:#000000;
font-weight: 700;
text-decoration: none;
}
.header .item-center{
flex:0 0 73%;
    text-align: right;
}
.header .item-right{
flex:0 0 8%;
display: flex;
justify-content: flex-end;
}
.header .item-right a{ 
text-decoration: none;
font-size: 16px;
color:#555555;
display: inline-block;
margin-left: 10px;
transition: color 0.3s ease;
}
.header .menu > ul > li{
display: inline-block;
line-height: 50px;
margin-left: 25px;
}
.header .menu > ul > li > a{
font-size: 15px;
font-weight: 300;
color:#000000;
position: relative;
text-transform: capitalize;
transition: color 0.3s ease;
    font-family: 'Graphik';
}
.header .menu > ul > li .sub-menu{
position: absolute;
z-index: 500;
background-color:#ffffff;
box-shadow: -2px 2px 70px -25px rgba(0,0,0,0.3); 
padding: 20px 30px;
transition: all 0.5s ease;
margin-top:25px;
opacity:0;
visibility: hidden;
text-align: left;
}
@media(min-width: 992px){

.header .menu > ul > li.menu-item-has-children .sub-menu .menu-item-has-children .sub-menu {
margin-top: 0;
visibility: hidden;
opacity: 0;
}

.header .menu > ul > li.menu-item-has-children .sub-menu .menu-item-has-children:hover .sub-menu {
margin-top: 0;
visibility: visible;
opacity: 1;
}
.header .menu > ul > li.menu-item-has-children:hover .sub-menu{
margin-top: 0;
visibility: visible;
opacity: 1;
}
}
.header .menu > ul > li .sub-menu > ul > li{
line-height: 1;
}
.header .menu > ul > li .sub-menu > ul > li > a{
display: inline-block;
padding: 10px 0;
font-size: 15px;
color: #555555;
transition: color 0.3s ease;
text-decoration: none;
text-transform: capitalize;
}
.header .menu > ul > li .single-column-menu{
min-width: 280px;
max-width: 350px;
}
.header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li{
line-height: 1;
display: block; 
text-align: left;
}
.header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li > a {
padding:10px 0;
display: inline-block;
font-size: 15px;
color:#555555;
transition: color 0.3s ease;
text-align: left;
}
.header .menu > ul > li .sub-menu.mega-menu{ 
left: 50%;
transform: translateX(-50%); 
}
.header .menu > ul > li .sub-menu.mega-menu-column-4{
max-width: 1100px;
width: 100%;   
display: flex;
flex-wrap: wrap;
padding:20px 15px;
}
.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item{
flex:0 0 25%;
padding:0 15px;
}
.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item .title{
font-size: 16px;
color:#D10322;
font-weight: 500;
line-height: 1;
padding:10px 0;
text-align: left;
}
.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item.text-center .title{
text-align: center;
}
.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item img{
max-width: 100%;
width: 100%;
vertical-align: middle;
margin-top: 10px;
height: 300px;
object-fit: contain;
}
.header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li > a:hover,
.header .menu > ul > li .sub-menu > ul > li > a:hover,
.header .item-right a:hover,
.header .menu > ul > li:hover > a{
color:#D10322;
}
/* banner section */
.banner-section{
background-image: url('../img/banner.jpg');
background-size: cover;
background-position: center;
height: 700px;
width: 100%;
display: block;
}
.mobile-menu-head,
.mobile-menu-trigger{
display: none;
}
/*responsive*/
@media(max-width: 991px){
   .header .menu > ul > li .sub-menu > ul > li > a {        display: block;
        line-height: 20px;
        padding: 10px 15px 10px 15px;
        display: block;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        font-size: 14px;
        font-weight: 300;
        color: #000000;
        position: relative;
        text-transform: capitalize;
        transition: color 0.3s ease;  }
.menu-item-has-children li a i {position: absolute; height: 50px;width: 50px; top: 0;right: 0;text-align: center;
line-height: 50px; transform: rotate(-90deg);}
.header .item-center{
order:3;
flex:0 0 100%;
}
.header .item-left,
.header .item-right{
flex: 0 0 50%;
padding: 0;
}
.v-center{
justify-content: space-between;
display: flex;
        flex-wrap: nowrap
}
.header .mobile-menu-trigger{
display: flex;
height: 30px;
width: 30px;
margin-left: 15px;
cursor: pointer;
align-items: center;
justify-content: center;
}
.header .mobile-menu-trigger span{
display: block;
height: 2px;
background-color: #333333;
width: 24px;
position: relative;
}
.header .mobile-menu-trigger span:before,
.header .mobile-menu-trigger span:after{
content: '';
position: absolute;
left:0;
width: 100%;
height: 100%;
background-color: #333333;
}
.header .mobile-menu-trigger span:before{
top:-6px;
}
.header .mobile-menu-trigger span:after{
top:6px;
}
.header .item-right{
align-items: center;
}
.header .menu{
position: fixed;
width: 320px;
background-color:#ffffff;
left:0;
top:0;
height: 100vh;
overflow: hidden;
transform: translate(-100%);
transition: all 0.5s ease;
z-index: 1099;
}
.header .menu.active{
transform: translate(0%);  
}
.header .menu > ul > li{
line-height: 1;
margin:0;
display: block;
        text-align: left;
}
.header .menu > ul > li > a{
line-height: 50px;
height: 50px;
padding:0 50px 0 15px;
display: block;
border-bottom: 1px solid rgba(0,0,0,0.1);
}
.header .menu > ul > li > a i{
position: absolute;
height: 50px;
width: 50px;
top:0;
right: 0;
text-align: center;
line-height: 50px;
transform: rotate(-90deg);
}
.header .menu .mobile-menu-head{
display: flex;
height: 50px;
border-bottom: 1px solid rgba(0,0,0,0.1);
justify-content: space-between;
align-items: center;
position: relative;
z-index: 501;
position: sticky;
background-color: #ffffff;
top:0;
}
.header .menu .mobile-menu-head .go-back{
height: 50px;
width: 50px;
border-right: 1px solid rgba(0,0,0,0.1);
cursor: pointer;
line-height: 50px;
text-align: center;
color:#000000;
font-size: 16px;
display: none;
}
.header .menu .mobile-menu-head.active .go-back{
display: block;
}
.header .menu .mobile-menu-head .current-menu-title{
font-size: 15px;
font-weight: 500;
color:#000000;
}
.header .menu .mobile-menu-head .mobile-menu-close{
height: 50px;
width: 50px;
border-left: 1px solid rgba(0,0,0,0.1);
cursor: pointer;
line-height: 50px;
text-align: center;
color:#000000; 
font-size: 25px;
}
.header .menu .menu-main{
height: 100%;
overflow-x: hidden;
overflow-y: auto;
}
.header .menu > ul > li .sub-menu.mega-menu,
.header .menu > ul > li .sub-menu{
visibility: visible;
opacity: 1;
position: absolute;
box-shadow: none;
margin:0;
padding:15px;
top:0;
left:0;
width: 100%;
height: 100%;
padding-top: 65px;
max-width: none;
min-width: auto;
display: none;
transform: translateX(0%);
overflow-y: auto;
}
.header .menu > ul > li .sub-menu.active{
display: block;
}
@keyframes slideLeft{
0%{
opacity:0;
transform: translateX(100%);
}
100%{
opacity:1;
transform: translateX(0%); 
}
}
@keyframes slideRight{
0%{
opacity:1;
transform: translateX(0%);
}
100%{
opacity:0;
transform: translateX(100%); 
}
}
.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item img{
margin-top:0;
}
.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item.text-center .title{
margin-bottom: 20px;
}
.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item.text-center:last-child .title{
margin-bottom:0px;
}
.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item{
flex: 0 0 100%;
padding: 0px;
}
.header .menu > ul > li .sub-menu > ul > li > a,
.header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li > a{
display: block;
}
.header .menu > ul > li .sub-menu.mega-menu > .list-item > ul {
margin-bottom: 15px;
}
.menu-overlay{
position: fixed;
background-color: rgba(0,0,0,0.5);
left:0;
top:0;
width: 100%;
height: 100vh;
z-index: 1098;
visibility: hidden;
opacity:0;
transition: all 0.5s ease;
}
.menu-overlay.active{
visibility: visible;
opacity:1; 
}
}








@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.3/animate.min.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css');

.Advance-Slider{float:left;width:100%;overflow:hidden;}
.Advance-Slider button.slick-arrow{position:absolute;z-index:2;top:0;bottom:0;height:50px;width:50px;background:#fff;z-index:99999;border:none;margin:auto;font-size:0;text-align:center;outline:none;cursor:pointer;}
.Advance-Slider .img-fill{position:relative;height:100%;}
.Advance-Slider .img-fill img{height:100%;width:100%;object-fit:cover;animation:myMove 10s linear infinite;}
.Advance-Slider .item{height:100vh;overflow:hidden;outline:none;}
.Advance-Slider button.slick-next.slick-arrow{right:0;left:auto;}
.Advance-Slider button.slick-arrow:before{content:"\f104";top:0;left:0;margin:auto;font-family:fontawesome;font-size:18px;}
.Advance-Slider button.slick-next.slick-arrow:before { transform:  scaleX(-1); display:  block;}
.Advance-Slider .img-fill:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:#151515;opacity:0.5;}

.Advance-Slider ul.slick-dots{position:absolute;bottom:20px;left:0;width:100%;margin:0;padding:0;text-align:center;}
.Advance-Slider ul.slick-dots li{display:inline-block;height:auto;padding:0 5px;line-height:0px;}
.Advance-Slider ul.slick-dots li button{height:15px;width:15px;border-radius:100%;background:#fff;border:none;font-size:0px;padding:0px;opacity:0.5;outline:none;transition:all 0.3s ease;cursor:pointer;}
.Advance-Slider ul.slick-dots li.slick-active button{opacity:1;}
.Advance-Slider button.slick-arrow{perspective:360px;}
.Advance-Slider button.slick-arrow .thumb{position:absolute;height:100px;width:150px;left:100%;top:-28px;transform-origin:0% 0%;transform:rotate3d(1,0,0,90deg);}
.Advance-Slider button.slick-arrow .thumb img{height:100%;width:100%;}
.Advance-Slider button.slick-next{}
.Advance-Slider button.slick-next .thumb{left:auto;right:100%;}
.Advance-Slider button.slick-prev.hover-out .thumb,.Advance-Slider button.slick-prev .thumb{animation:out-left 300ms ease 0ms 1 forwards;}
.Advance-Slider button.slick-prev.hover-in .thumb{animation:in-left 300ms ease 0ms 1 forwards;}
.Advance-Slider button.slick-next.hover-out .thumb,.Advance-Slider button.slick-next .thumb{animation:out-right 300ms ease 0ms 1 forwards;transform-origin:100% 50%;}
.Advance-Slider button.slick-next.hover-in .thumb{animation:in-right 300ms ease 0ms 1 forwards;}

.Advance-Slider button.slick-prev:hover{transform:translateX(-100%);}
.Advance-Slider button.slick-prev{transition:all 0.3s ease;}
.Advance-Slider button.slick-next:hover{transform:translateX(100%);}
.Advance-Slider button.slick-next{transition:all 0.3s ease;}
.Advance-Slider ul.slick-dots li button img{height:0;width:20px;top:0;object-fit:cover;transition:height 0.2s ease 0.2s,width 0.2s ease 0s;position:relative;left:-50%;}
.Advance-Slider ul.slick-dots li button a{position:absolute;height:90px;bottom:calc(100%);width:0;display:flex;align-items:flex-end;justify-content:center;transition:all 0.2s ease 0.2s;padding-bottom:10px;}
.Advance-Slider ul.slick-dots li button{position:relative;display:flex;justify-content:center;}
.Advance-Slider ul.slick-dots li button:hover a img{}
.Advance-Slider ul.slick-dots li button:hover img{height:80px;width:140px;transition:height 0.2s ease,width 0.2s ease 0.2s;}
.Advance-Slider ul.slick-dots li button:hover a{width:140px;transition:all 0.3s ease 0s;}
.Advance-Slider ul.slick-dots li button:hover{opacity:1;}
.Advance-Slider ul.slick-dots li button:before{content:'';bottom:calc(100% + -10px);left:7px;border:solid transparent;content:" ";height:0;width:0px;position:absolute;pointer-events:none;border-color:rgba(255,255,255,0);border-top-color:#fff;border-width:10px;margin-left:-10px;opacity:0;transition:0.3s ease 350ms;}
.Advance-Slider ul.slick-dots li button:hover:before{opacity:1;transition:0.3s ease 0s;}
.Advance-Slider  .item.slick-active{animation:Slick-FastSwipeIn 1s both;}

.Advance-Slider .item .contain-wrapper{position:absolute;left:0;top:0;z-index:1;height:100%;width:100%;display:flex;align-items:center;justify-content:center;text-align:center;}
.Advance-Slider .item .contain-wrapper .dots-contain{display:none;}
.Advance-Slider .item h3{margin:0px;color:#fff;font-size:84px;font-weight:300;text-transform:capitalize;}
.Advance-Slider .item{color:#fff;font-family:'Roboto',sans-serif;}
.Advance-Slider .item  h5{font-size:32px;font-weight:300;padding:10px 0 0;margin:0;text-transform:capitalize;}
.Advance-Slider .item .contain-wrapper .info{max-width:1200px;}
.Advance-Slider .item h5 span{color:#00BCD4;}
.Advance-Slider .item h3 span{color:#00BCD4;}
.Advance-Slider .item h3{animation:fadeOutRight 1s both;}
.Advance-Slider .item.slick-active h3{animation:fadeInDown 1s both 1s;}
.Advance-Slider .item  h5{animation:fadeOutLeft 1s both;}
.Advance-Slider .item.slick-active  h5{animation:fadeInLeft 1s both 1.5s;}


@keyframes myMove{
  from{transform:scale(1.0,1.0);transform-origin:50% 50%;}
  to{transform:scale(1.8,1.9);transform-origin:50% 0%;}
}
@keyframes Slick-FastSwipeIn{
  0%{transform:rotate3d(0,1,0,150deg) scale(0)  perspective(400px);}
  100%{transform:rotate3d(0,1,0,0deg) scale(1) perspective(400px);}
}

@keyframes in-left{
  from{-webkit-transform:rotate3d(0,1,0,90deg);transform:rotate3d(0,1,0,90deg);}
  to{-webkit-transform:rotate3d(0,0,0,0deg);transform:rotate3d(0,0,0,0deg);}
}
@keyframes out-left{
  from{-webkit-transform:rotate3d(0,0,0,0deg);transform:rotate3d(0,0,0,0deg);}
  to{-webkit-transform:rotate3d(0,1,0,86deg);transform:rotate3d(0,1,0,86deg);}
}
@keyframes in-right{
  from{-webkit-transform:rotate3d(0,-1,0,90deg);transform:rotate3d(0,-1,0,90deg);}
  to{-webkit-transform:rotate3d(0,0,0,0deg);transform:rotate3d(0,0,0,0deg);}
}
@keyframes out-right{
  from{-webkit-transform:rotate3d(0,0,0,0deg);transform:rotate3d(0,0,0,0deg);}
  to{-webkit-transform:rotate3d(0,-1,0,86deg);transform:rotate3d(0,-1,0,86deg);}
}






