body {
	margin: 0;
	padding: 0;
	font-family: sans-serif;
}
.container {
	position: relative;
	overflow: hidden;
    width: 100%;
    /* height: 100vh; */
}
.container .slider {
	position: absolute;
	top: 0;
	left: 0;
	width: 500%;
	height: 100%;
	animation: animate 10s linear infinite;
}
.container .slider .slide {
	position: relative;
	width: 20%;
	height: 100%;
	float: left;
}
.container .slider .slide .caption { 
	position: absolute;
	bottom: 60px;
	right: 60px;
	left: 60px;
	padding: 30px;
	background-color: rgba(0,0,0,.5);
	box-sizing:border-box;
	transition: 0.5s;
}
.container .slider .slide .caption h2 { 
	margin: 0;
	padding: 0;
	color: #fff;
	font-size: 48px;
	transition: 0.5s;
}
.container .slider .slide .caption p { 
	margin: 0;
	padding: 0;
	color: #fff;
	font-size: 18px;
	transition: 0.5s;
}
.container .slider .slide.slide1 {
	background: url(../images/bann1.jpg);
	background-size: cover;
	background-position: center;
}
.container .slider .slide.slide2 {
	background: url(../images/baan2.jpg);
	background-size: cover;
	background-position: center;
}
.container .slider .slide.slide3 {
	background: url(../images/baan3.jpg);
	background-size: cover;
	background-position: center;
}
.container .slider .slide.slide4 {
	background: url(../images/bann4.jpg);
	background-size: cover;
	background-position: center;
}


@keyframes animate {
	0% {
		left: 0;
	}
	20% {
		left: 0;
	}
	25% {
		left: -100%;
	}
	45% {
		left: -100%;
	}
	50% {
		left: -200%;
	}
	70% {
		left: -200%;
	}
	75% {
		left: -300%;
	}
	95% {
		left: -300%;
	}
	100% {
		left: -400%;
	}
}



@media screen and (max-width: 768px) {
	.container .slider .slide .caption { 
		bottom: 20px;
		right: 20px;
		left: 20px;
		padding: 20px;
	}
	.container .slider .slide .caption h2 { 
		margin: 0 0 10px;
		font-size: 30px;
	}
	.container .slider .slide .caption p { 
		font-size: 16px;
	}
}

@media (min-width: 1200px)
{
.container {
    max-width: 100%;
}
}


.sidenav {
    height: 100%;
    width: 0;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    background-color:#111111c9;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
    
  }
  

  .sidenav1 {
    height: 100%;
    width: 400px;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #222222d1;
    overflow-x: hidden;
    transition: 0.5s;
    
  }

  .sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 30px;
    color: #ffffff;
    display: block;
    transition: 0.3s;
  }
  
  .sidenav a:hover {
    color: #f1f1f1;
  }
  
  .sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
  }
  
  @media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 40px;}
  }
  .side_nav_width{
width: 400px;
  }
  .openbtn{
      color:#ffffff;
  }

  .context-dark, .bg-gray-dark, .bg-primary {
    color: rgba(255, 255, 255, 0.8);
}

.footer-classic a, .footer-classic a:focus, .footer-classic a:active {
    color: #ffffff;
}
#footer .nav-list li {
    padding-top: 5px;
    padding-bottom: 5px;
}

#footer .nav-list li a:hover:before {
    margin-left: 0;
    opacity: 1;
    visibility: visible;
}

#footer ul, ol {
    list-style: none;
    padding: 0;
    margin: 0;
}

#footer .social-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 23px;
    font: 900 13px/1 "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
}
#footer .social-container .col {
    border: 1px solid rgba(255, 255, 255, 0.1);
}
#footer .nav-list li a:before {
    /* content: "\f14f"; */
    font: 400 21px/1 "Material Design Icons";
    color: #4d6de6;
    display: inline-block;
    vertical-align: baseline;
    margin-left: -28px;
    margin-right: 7px;
    opacity: 0;
    visibility: hidden;
    transition: .22s ease;
}
#footer .row-bot{
    margin-top: 30px;
}

h1{
    font-size:25px;
    text-align: left;
    text-transform:capitalize;
}
.service-box{
   position: relative;
   overflow: hidden;
   margin-bottom:10px;
   perspective:1000px;
   -webkit-perspective:1000px;
}
.service-icon{
   width: 100%;
   height: 220px;
   padding: 20px;
   text-align: center;
   transition: all .5s ease;
}

.service-content{
   position: absolute;
   top: 0;
   left: 0;
   z-index: 1;
   opacity: 0;
   width: 100%;
   height: 220px;
   padding: 20px;
   text-align: center;
   transition: all .5s ease;
   background-color: #474747;
   backface-visibility:hidden;
   transform-style: preserve-3d;
   -webkit-transform: translateY(110px) rotateX(-90deg);
   -moz-transform: translateY(110px) rotateX(-90deg);
   -ms-transform: translateY(110px) rotateX(-90deg);
   -o-transform: translateY(110px) rotateX(-90deg);
   transform: translateY(110px) rotateX(-90deg);
}
.service-box .service-icon .front-content{
   position: relative;
   top:80px;
   -webkit-transform: translateY(-50%);
   -moz-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   -o-transform: translateY(-50%);
   transform: translateY(-50%);
}

.service-box .service-icon .front-content i {
   font-size: 28px;
   color: #fff;
   font-weight: normal;
}

.service-box .service-icon .front-content h3 {
   font-size: 25px;
   color: #fff;
   text-align: center;
   margin-bottom: 15px;
   text-transform: uppercase;
}
.service-box .service-content h3 {
   font-size: 15px;
   font-weight: 700;
   color: #fff;
   margin-bottom:10px;
   text-transform: uppercase;
}
.service-box .service-content p {
   font-size: 13px;
   color: #b1b1b1;
   margin:0;
}
.yellow{background-color: #ffc000;}
.orange{background-color: #fc7f0c;}
.red{background-color: #e84b3a;}
.grey{background-color: #474747;}
.service-box:hover .service-icon{
   opacity: 0;
   -webkit-transform: translateY(-110px) rotateX(90deg);
   -moz-transform: translateY(-110px) rotateX(90deg);
   -ms-transform: translateY(-110px) rotateX(90deg);
   -o-transform: translateY(-110px) rotateX(90deg);
   transform: translateY(-110px) rotateX(90deg);
}
.service-box:hover .service-content {
   opacity: 1;
   -webkit-transform: rotateX(0);
   -moz-transform: rotateX(0);
   -ms-transform: rotateX(0);
   -o-transform: rotateX(0);
   transform: rotateX(0);
}
.padding{
    padding: 10px 100px 10px 100px;
    }
    #card {
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 100%;
        padding: 12px 15px;
        margin-bottom: 1.5%;
        /* border: 1px solid #ddd; */
    }
    .about_us{
        background: #bdbdbd;
        border-radius: 0.5rem;
    }
    .about_us:hover{
        background: linear-gradient(135deg,#b6b6b6 0%,#252525ad 100%);
        color: #ffffff;
    }
    .wrap {
        display: flex;
        background: #bdbdbd;
        /* border: 1px solid black; */
        padding: 1rem 1rem 1rem 1rem;
        border-radius: 0.5rem;
        box-shadow: 7px 7px 30px -5px rgba(0,0,0,0.1);
        margin-bottom: 2rem;
    }
    
    .wrap:hover {
        background: linear-gradient(135deg,#b6b6b6 0%,#1b1b1b 100%);
        color: white;
    }
    .ico-wrap {
        margin: auto;
    }
    
    .mbr-iconfont {
        font-size: 4.5rem !important;
        color: #313131;
        margin: 1rem;
        padding-right: 1rem;
    }
    .vcenter {
        margin: auto;
    }
    
    .mbr-section-title3 {
        text-align: left;
    }
    h2 {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }
    .display-5 {
        font-family: 'Source Sans Pro',sans-serif;
        font-size: 1.4rem;
    }
    .mbr-bold {
        font-weight: 700;
    }
    
     p {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        line-height: 25px;
    }
    .display-6 {
        font-family: 'Source Sans Pro',sans-serif;
        font-size: 1rem;}
        #about{
            margin-top: 80px;
            margin-bottom: 80px;
        }
        .top_bottom {
            margin-top: 30px;
            margin-bottom: 30px;
        }

        /*********************** Demo - 7 *******************/
.box7{position:relative}

.box7 img{width:70%;height:100px;}
.box7 .box-content{width:100%;position:absolute;bottom:-100%;left:0;transition:all .5s ease 0s}

.box7 .title{display:block;font-size:22px;font-weight:700;color:#fff;margin:0 0 10px}
.box7 .post{display:block;font-size:15px;font-weight:600;color:#fff;margin-bottom:10px}
.box7 .icon{margin:0}
.box7 .icon li{display:inline-block}
.box7 .icon li a{display:block;width:35px;height:35px;line-height:35px;border-radius:50%;background:#0dab76;font-size:18px;color:#fff;margin-right:10px;transition:all .5s ease 0s}
.box8 .icon li,.box8 .title{display:inline-block}
.box7 .icon li a:hover{transform:rotate(360deg)}
@media only screen and (max-width:990px){.box{margin-bottom:30px}
}


/*********************** Demo - 21 *******************/
#tabs .box21{text-align:center;position:relative}
#tabs .box21:after,.box21:before{content:"";width:2px;height:2px;border-radius:50%;background:rgba(0,0,0,.35);position:absolute;top:50%;left:50%;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}
#tabs .box21:hover:after,.box21:hover:before{-webkit-transform:scale(400);-moz-transform:scale(400);-ms-transform:scale(400);-o-transform:scale(400);transform:scale(400)}
#tabs .box21:before{-o-transition:all .5s linear .3s;-moz-transition:all .5s linear .3s;-ms-transition:all .5s linear .3s;-webkit-transition:all .5s linear .3s;transition:all .5s linear .3s}
#tabs .box21:hover:before{-moz-transition-delay:0s;-webkit-transition-delay:0s;-o-transition-delay:0s;-ms-transition-delay:0s;transition-delay:0s}
#tabs .box21:after{-o-transition:all .5s linear .6s;-moz-transition:all .5s linear .6s;-ms-transition:all .5s linear .6s;-webkit-transition:all .5s linear .6s;transition:all .5s linear .6s}
#tabs .box21:hover:after{-moz-transition-delay:.2s;-webkit-transition-delay:.2s;-o-transition-delay:.2s;-ms-transition-delay:.2s;transition-delay:.2s}
#tabs .box21 img{width:100%;height:360px;margin-bottom: 10px;}
#tabs .box21 .box-content{width:100%;height:100%;position:absolute;top:0;left:0;background:0 0;color:#fff;padding-top:25px;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-ms-transition:all .3s linear 0s;-o-transition:all .3s linear 0s;-webkit-transition:all .3s linear 0s;-moz-transition:all .3s linear 0s;transition:all .3s linear 0s;z-index:1}
#tabs .box21:hover .box-content{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-moz-transition-delay:.4s;-webkit-transition-delay:.4s;-o-transition-delay:.4s;-ms-transition-delay:.4s;transition-delay:.4s}
#tabs .box21 .title{font-size:21px;font-weight:700;text-transform:uppercase;border-bottom:1px solid #fff;padding-bottom:20px;margin-top:20px}
#tabs .box21 .description{font-size:14px;font-style:italic;padding:0 10px;margin:15px 0}
#tabs .box21 .read-more{display:block;width:120px;background:#178993;border-radius:5px;font-size:14px;color:#fff;text-transform:capitalize;padding:10px 0;margin:0 auto}
@media only screen and (max-width:990px){.box21{margin-bottom:30px}
}
@media only screen and (max-width:479px){.box21 .box-content{padding-top:0}
}
@media only screen and (max-width:359px){.box21 .title{padding-bottom:10px}
}
/*********************** Demo - 1 *******************/
.box1 img,.box1:after,.box1:before{width:100%;transition:all .3s ease 0s}
.box1 .icon,.box2,.box3,.box4,.box5 .icon li a{text-align:center}
.box10:after,.box10:before,.box1:after,.box1:before,.box2 .inner-content:after,.box3:after,.box3:before,.box4:before,.box5:after,.box5:before,.box6:after,.box7:after,.box7:before{content:""}
.box1,.box11,.box12,.box13,.box14,.box16,.box17,.box18,.box2,.box20,.box21,.box3,.box4,.box5,.box5 .icon li a,.box6,.box7,.box8{overflow:hidden}
.box1 .title,.box10 .title,.box4 .title,.box7 .title{letter-spacing:1px}
.box3 .post,.box4 .post,.box5 .post,.box7 .post{font-style:italic;}
.mt-30{margin-top:30px;margin-left: 30px;}
.mt-40{margin-top:40px;}
.mb-30{margin-bottom:30px}
.box1 .icon,.box1 .title{margin:0;position:absolute}
.img1{
    width: 100%;
    height: 500px !important;
}
#contact_form{
    background-color: #b1b1b1;
    
}


.cont_form{
    margin-left: 237px;
    margin-top: 100px;
    margin-bottom: 50px;
}

input{
    width:400px;
}

a:hover {
    color: #ffffff;
    text-decoration: none;
}

a {
    color: #ffffff;
    text-decoration: none;
}
.foot_bot{
    padding-top: 10px;
    padding-bottom: 11px;
    text-align: center;
}

.foot_bot a:hover{
color: #2cb267;
}
.menu_center{
    margin-top: 88px;
}


.logo_img{
        width: 100%;
        height: 250px;
   
}
.mg5{
    margin-top: 80px;
    margin-bottom: 80px;
}


/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
   #footer .row-bot {
    margin-top: 0px;
}
.mt-30 {
    margin-top: 30px;
    margin-left: px;
}
input {
    width: 95%;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 0px; 
     padding-left: 0px;
}
.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: 0px; 
     margin-left: 0px;
}
.sidenav a {
    padding: 8px 8px 8px 0px;
    text-decoration: none;
    font-size: 30px;
    color: #ffffff;
    display: block;
    transition: 0.3s;
}
.sidenav {
    height: 100%;
    width: 0;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #111111c9;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 0px;
}
.img1 {
    width: 100%;
    height: 400px !important;
}
.mg4{
    width:100%;
    height:400px;
}
.mg5{
    margin-top: 15px;
    margin-bottom: 15px;
}
.mg6{
    width: 100%;
    height: 300px !important;
}
.mg7{
    width: 100%;
    height: 300px !important;
}
.top_bottom {
    margin-left: 24px;
    margin-top: 30px;
    margin-bottom: 30px;
}
.cont_form {
    margin-left: 0px;
    margin-top: 100px;
    margin-bottom: 50px;
}
.container-fluid {
    width: 100%;
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
}
.nav_menu1 {
    text-align: center;
}
  }
  
  /* Small devices (portrait tablets and large phones, 600px and up) */
  @media only screen and (min-width: 600px) {
    
    .cont_form {
        margin-left: 0px;
        margin-top: 100px;
        margin-bottom: 50px;
    }
    .nav_menu1 {
        text-align: center;
    }
  }
  
  /* Medium devices (landscape tablets, 768px and up) */
  @media only screen and (min-width: 768px) {
    
    .mt-30 {
        margin-top: 30px;
        margin-left: 50px;
    }

    #tabs .box21 img {
        width: 100%;
        height: 250px;
        margin-bottom: 10px;
    }
    input {
        width: 100%;
    }
    .mt-30 .col-md-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 100%;
    }

    .cont_form {
        margin-left: 0px;
        margin-top: 100px;
        margin-bottom: 50px;
    }
    .container .slider {
    position: absolute;
    top: 0;
    left: 0;
    width: 2734px;
    height: 100%;
    animation: animate 10s linear infinite;
}
.nav_menu1 {
    text-align: center;
}
.navbar-expand-md .navbar-nav .nav-link {
    padding-right: 28px;
    padding-left: .5rem;
}
  } 
  
  /* Large devices (laptops/desktops, 992px and up) */
  @media only screen and (min-width: 992px) {
    
    .container .slider {
        position: absolute;
        top: 0;
        left: 0;
        width: 5100px ;
        height: 100%;
        animation: animate 10s linear infinite;
    }
    .container {
        max-width: 100%;
        height: 100px;
    }
    .nav_menu1 {
        margin-left: 274px;
    }
    
    .cont_form {
        margin-left: 220px;
        margin-top: 100px;
        margin-bottom: 50px;
    }    
    .mt-30 {
        margin-top: 30px;
        margin-left: 110px;
    }
    .mt-31 {
        margin-top: 30px;
        /* margin-left: 110px; */
    }
    .container .slider {
        position: absolute;
        top: 0;
        left: 0;
        width: 500%;
        height: 100%;
        animation: animate 10s linear infinite;
    }
    .nav_menu1{
        margin-left: 150px;
    }

        .navbar-expand-md .navbar-nav .nav-link {
            padding-right: 3.5rem;
            padding-left: .5rem;
        }
    
    
  } 
  
  /* Extra large devices (large laptops and desktops, 1200px and up) */
  @media only screen and (min-width: 1200px) {
    .container {
        max-width: 100%;
        height: 100px;
    }
    .cont_form {
        margin-left: 302px;
        margin-top: 100px;
        margin-bottom: 50px;
    }
    .container .slider {
        position: absolute;
        top: 0;
        left: 0;
        width: 500%;
        height: 100%;
        animation: animate 10s linear infinite;
    }
    .nav_menu1{
        margin-left: 282px;
    }
    .navbar-expand-md .navbar-nav .nav-link {
        padding-right: 3.5rem;
        padding-left: .5rem;
    }

  }

  .container {
    max-width: 100%;
    height: 270px;
}