/*--------------------------------------------------------------------- File Name: responsive.css ---------------------------------------------------------------------*/


/*--------------------------------------------------------------------- File Name: style.css ---------------------------------------------------------------------*/


/*--------------------------------------------------------------------- import Fonts ---------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css?family=Rajdhani:300,400,500,600,700');
@import url('https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Raleway:100,400,600,700,900&display=swap');

/*****---------------------------------------- 1) font-family: 'Rajdhani', sans-serif;
 2) font-family: 'Poppins', sans-serif;
 ----------------------------------------*****/


/*--------------------------------------------------------------------- import Files ---------------------------------------------------------------------*/

@import url(normalize.css);
@import url(font-awesome.min.css);
@import url(owl.carousel.min.css);
@import url(owl.carousel.css);
@import url(swiper.min.css);8
@import url(slick.css);
@import url(jquery.fancybox.min.css);
@import url(jquery-ui.css);



/*--------------------------------------------------------------------- skeleton ---------------------------------------------------------------------*/

* {
     box-sizing: border-box !important;
}

html {
     scroll-behavior: smooth;
     overflow-x:hidden !important; 
}

body {
     color: #666666;
     font-size: 14px;
     font-family: 'Poppins', sans-serif;
     line-height: 1.80857;
     font-weight: normal;
     margin: 0;
     padding: 0;
     overflow-x: hidden;
}

a {
     color: #1f1f1f;
     text-decoration: none !important;
     outline: none !important;
     -webkit-transition: all .3s ease-in-out;
     -moz-transition: all .3s ease-in-out;
     -ms-transition: all .3s ease-in-out;
     -o-transition: all .3s ease-in-out;
     transition: all .3s ease-in-out;
}

h1,
h2,
h3,
h4,
h5,
h6 {
     letter-spacing: 0;
     font-weight: normal;
     position: relative;
     padding: 0 0 10px 0;
     font-weight: normal;
     line-height: normal;
     color: #111111;
     margin: 0
}

h1 {
     font-size: 24px;
}

h2 {
     font-size: 22px;
}

h3 {
     font-size: 18px;
}

h4 {
     font-size: 16px
}

h5 {
     font-size: 14px
}

h6 {
     font-size: 13px
}

*,
*::after,
*::before {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
     color: #212121;
     text-decoration: none!important;
     opacity: 1
}

button:focus {
     outline: none;
}

ul,
li,
ol {
     margin: 0px;
     padding: 0px;
     list-style: none;
}


p {
     margin: 0px;
     font-weight: 500;
     font-size: 15px;
     line-height: 24px;
}

a {
     color: #222222;
     text-decoration: none;
     outline: none !important;
}

a,
.btn {
     text-decoration: none !important;
     outline: none !important;
     -webkit-transition: all .3s ease-in-out;
     -moz-transition: all .3s ease-in-out;
     -ms-transition: all .3s ease-in-out;
     -o-transition: all .3s ease-in-out;
     transition: all .3s ease-in-out;
}

img {
     max-width: 100%;
     height: auto;
}

 :focus {
     outline: 0;
}

.btn-custom {
     margin-top: 20px;
     background-color: transparent !important;
     border: 2px solid #ddd;
     padding: 12px 40px;
     font-size: 16px;
}

.lead {
     font-size: 18px;
     line-height: 30px;
     color: #767676;
     margin: 0;
     padding: 0;
}

.form-control:focus {
     border-color: #ffffff !important;
     box-shadow: 0 0 0 .2rem rgba(255, 255, 255, .25);
}

.navbar-form input {
     border: none !important;
}

.badge {
     font-weight: 500;
}

blockquote {
     margin: 20px 0 20px;
     padding: 30px;
}

button {
     border: 0;
     margin: 0;
     padding: 0;
     cursor: pointer;
}

.full {
     float: left;
     width: 100%;
}

.layout_padding {
     padding-top: 90px;
     padding-bottom: 90px;
}

.layout_padding_2 {
     padding-top: 75px;
     padding-bottom: 75px;
}

.light_silver {
     background: #f9f9f9;
}

.theme_bg {
     background: #38c8a8;
}

.margin_top_30 {
     margin-top: 30px !important;
}

.full {
     width: 100%;
     float: left;
     margin: 0;
     padding: 0;
}


/**-- heading section --**/


/*---------------------------- preloader area ----------------------------*/

.loader_bg {
     position: fixed;
     z-index: 9999999;
     background: #fff;
     width: 100%;
     height: 100%;

}

.loader {
     height: 100%;
     width: 100%;
     position: absolute;
     left: 0;
     top: 0;
     display: flex;
     justify-content: center;
     align-items: center;
     margin: 0;
     padding: 0;
     overflow-x: hidden;
}

.loader img {
     width: 680px;
}


.header_information {
     background-color: #00aeef;
     padding: 0 0;
     padding-top: 0px;
     padding-top: 0px;
     margin-top: 0;
     margin-right: 0;
     margin-bottom: 0;
     position: absolute;
     width: 100%;
     height: 78px;
     margin-top: -20px;
     right: 0;
     
}

.header_information::before {
     width: 84px;
     height: 78px;
     background-color: #00aeef;
     background-repeat: repeat;
     display: block;
     content: "";
     position: absolute;
     top: 0;
     left: 0px;
     background-repeat: no-repeat;

}

.sign_btn {
     padding-left: 50px;
}

.sign_btn a {
     background-color: #fff;
     display: inline-block;
     padding: 7px 35px;
     border-radius: 20px;
     color: #292e39;
     font-size: 17px;
}

.sign_btn a:hover {
     color: #fff;
     background: #000;
}

#btnScrollToTop {
     position: fixed;
     right: 10px;
     bottom: 10px;
     width: 50px;
     height: 50px;
     border-radius: 50%;
     background: #e62739;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
     color: #ffffff;
     border: none;
     outline: none;
     cursor: pointer;
     z-index: 9999;
}

#btnScrollToTop:hover{
background: #7a0813;
}


/*--------------------------------------------------------------------- top banner area ---------------------------------------------------------------------*/


/*--------------------------------------------------------------------- layout new css ---------------------------------------------------------------------*/

/***** Divider *****/

.divider-1 span { display: inline-block; width: 200px; border-bottom: 1px dotted #aaa; }


/***** Top menu *****/

.navbar { background: #444; transition: all .6s; backface-visibility: hidden; }

.navbar.navbar-no-bg { background: #fff; background: rgb(255, 255, 255); }

.navbar-dark .navbar-nav { font-size: 16px; color: #fff; text-transform: uppercase; }
.navbar-dark .navbar-nav .nav-link { color: #000;  border: 0; }

.navbar-dark .navbar-nav .nav-link:hover { color: #2dff58; }
.navbar-dark .navbar-nav .nav-link:focus { color: #2dff58; outline: 0; }

.navbar-dark .navbar-nav .active>.nav-link, 
.navbar-dark .navbar-nav .nav-link.active, 
.navbar-dark .navbar-nav .nav-link.show, 
.navbar-dark .navbar-nav .show>.nav-link {
    color: #2dff58;
}


.navbar-expand-md .navbar-nav .nav-link { padding-right: 10px; }
.navigation-logo img{
    
    width:100%;
    height:auto;
}
/*
.navbar-brand {
     width: 167px;
     height: 46px;
     background: url(../images/simplicbpr.svg) left center no-repeat;
     border: 0;
     text-indent: -99999px;
}

.navbar-brand:hover {
     transform: scale(1.2);
}*/
/***** Top content *****/

.top-content { width: 100%; padding: 0; }

.top-content .carousel-item { min-height: 400px; }
.top-content .carousel-item img {overflow: hidden;width: 100%; object-fit: cover; }

.top-content .carousel-control-prev { border-bottom: 0;}
.top-content .carousel-control-next { border-bottom: 0;}
.carousel-inner {
     position: relative;
     width: 100%;
     overflow: hidden;
 }


#insight {
     top: 55%;
     transform: translateY(-50%);
     position: absolute;
     right: 15%;
     bottom: 20px;
     left: 15%;
     z-index: 10;
     padding-top: 20px;
     color: #fff;
     text-align: center;

}
#insight h1 {
     text-align: center;
     color: #fff;
     text-transform: uppercase;
     line-height:30px;
     font-weight: 300;
     top: 10%; 
     transform: translateY(-50%);
}
.top-content .carousel-caption img {margin-left: auto;;margin-top: 0px; margin-bottom:0px;width: 50%;}
/*.top-content .carousel-caption h2 {top: -40%; transform: translateY(-140%); padding-bottom: 50px;text-align: center;font-size: 38px;font-weight: bold;color: #fff;}*/
.top-content .carousel-caption h2 {text-align: center;font-size: 28px;font-weight: bold;color: #000;}
.top-content .carousel-caption h2 em {font-style: normal;color: #2dff58;}
.top-content .carousel-caption h1 {text-align: center;left: auto;right: auto; padding-bottom: 30px; padding-left: 10px; padding-right: 10px; color: #000;font-weight: 300;text-transform: uppercase;}
.top-content .carousel-caption h3 {font-size: 28px; color: #000;text-align: left;font-weight: 300;text-transform: uppercase; }
.top-content .carousel-caption 
.carousel-caption-description { color: #fff; color: rgba(255, 255, 255, 0.8); }

.top-content .carousel-indicators li { width: 16px; height: 16px; margin-left: 5px; margin-right: 5px; border-radius: 50%; }

/*-- header area --*/

.header {
     width: 100%;
     background: #fff;
     padding: 10px 0px 10px 0px;
}

.logo img {
     font-size: 40px;
     font-weight: bold;
     text-transform: uppercase;
     color: #fff;
     line-height: 45px;
     padding-bottom: 4px;
}


/** banner section **/

.relative {
     position: absolute;
     top: 46%;
     transform: translateY(-44%);
     padding: 0;
     bottom: auto;
}

.banner_main {
     position: relative;
}

.carousel-indicators .active {
     background: #00aeef;
}

.carousel-indicators li {
     width: 20px;
     height: 20px;
     background: #000;
     border-radius: 20px;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
     display: inline;
     width: 20px;
    height: 20px;
    background: transparent no-repeat center center;
    background-size: 100% 100%;
}

.carousel-indicators {
     bottom: 50px;
}

.carousel-item img {
     width: 100%;
}



.carousel-caption span {
     color: #6dbcf1;
     font-size: 22px;
     line-height: 40px;
     font-weight: 300;
     padding-bottom: 20px;
     text-transform: uppercase;
}

.carousel-caption a {
     font-size: 16px;
     background-color: #00aeef;
     color: #fff;
     font-weight: 500;
     padding: 12px 0px;
     width: 100%;
     max-width: 190px;
     text-align: center;
     display: inline-block;
     transition: ease-in all 0.5s;
     margin-top: 10px;
     right: 40px;
     border-radius: 30px;
}

.carousel-caption a:hover {
     background-color: #000;
     color: #fff;
     transition: ease-in all 0.5s;
}

#insight a {
     background: #27ade6;
     color: #fff;
     width: 50px;
     height: 50px;
     padding: 10px 0;
     right: 10px;
     left: 10px;
     border-radius: 50%;
     border: none;
     outline: none;
     cursor: pointer;
     display: inline-block;

}

#insight a:hover {
     background-color: #000;
     color: #fff;
     transition: ease-in all 0.5s;
}

/** banner section **/

.titlpage p {
     text-align: left;
     padding-bottom: 60px;
     font-weight: 300;
     color: #fff;
}
.titlspage h2 {
     text-align: left;
     font-size: 30px;
     color: #0b0503;
     font-weight: bold;
}

.titlpage h2 {
     font-size: 25px;
     color: #000;
     line-height: 50px;
     font-weight: bold;
     padding: 0;
     text-align: left;
}
.titlepage {
     text-align: center;
     padding-bottom: 40px;
     padding-top: 20px;
}


.titlepage h2 {
     font-size: 45px;
     color: #0b0503;
     line-height: 50px;
     font-weight: bold;
     padding: 0;
}

.titlepage span {
     background: #00a8e7;
     display: block;
     height: 10px;
     width: 90px;
}

.titlepag span {
     background: #00a8e7;
     display: block;
     height: 10px;
     width: 90px;
}

.d_flex {
     display: flex; 
     align-items: center;
     flex-wrap: wrap;
}

.d_flexi {
     display: flex; 
     align-items: center;
     flex-wrap: wrap;
}

.read_more {
     font-size: 17px;
     background-color: transparent;
     color: #7a7a7a;
     padding: 8px 0px;
     width: 100%;
     max-width: 190px;
     text-align: center;
     display: inline-block;
     border-radius: 30px;
     border: #00aaea solid 3px;
     transition: ease-in all 0.5s;
     margin-bottom: 10px;
}

.read_more i {
     padding-left: 10px;
}

.read_more:hover {
     background: #00aaea;
     color: #fff !important;
     transition: ease-in all 0.5s;
}


/** about section **/

.about {

     padding: 70px 0 100px 0;
}

#services {
     padding: 10px 0;
}

.about p {
     color: black;
     font-size: 16px;
     line-height: 24px;
     font-weight: 300;
     padding: 0px 0px 20px 0px;
}

.about .titlepage {
     text-align: left;
     padding: 10;

}

.about .titlepage h1 {
     text-align: left;
     padding: 0;
     font-size: 20px;
     font-weight: 500;
}

.about .titlepage h2 {
     text-align: left;
     padding: 0;
     font-size: 38px;
     line-height: 47px;
     font-weight: bold;
}

.about .titlepagee h2 {
     text-align: center;
     padding: 0;
     font-size: 38px;
     font-weight: bold;
}

#article {
     padding: 70px 0 0px 0;
}

#article h2 {
     text-align: center;
     padding: 0;
     font-size: 26px;
     font-weight: bold;
}

#article h3 {
     text-align: center;
     padding: 0;
     font-size: 16px;
     font-weight: 300;
}

.about .titlepag h2 {
     text-align: center;
     padding: 0;
     line-height: 50px;
     font-size: 45px;
     font-weight: bold;
     padding-bottom: 10px;
}

.about .titlepagee h2 em {
     font-style: normal;
     color: #2dff58;
}
.about .titlepage p {
     color: #292e39;
     font-size: 17px;
     line-height: 35px;
     font-weight: 500;
     padding: 20px 0px 35px 0px;
}


.about_img figure {
     margin: 0;
}

.about_img figure img {
     width: 100%;
}


.about .titlepg {
     text-align: center;
     padding: 0;
}

.about .titlepg h1 {
     text-align: center;
     padding: 0;
     font-size: 20px;
     font-weight: 500;
}
.about .titlepg p {
     color: #292e39;
     font-size: 17px;
     line-height: 35px;
     font-weight: 500;
     padding: 20px 0px 35px 0px;
     text-align: center;
}

.about .titlepg span {
     background: #00a8e7;
     display: block;
     height: 10px;
     width: 150px;
     margin-left: 190px;
}

/** end about section **/


/** mobile section **/

.mobile {
     background-color: #ffffff;
     padding: 90px 0;
}

.mobile .titlepage {
     text-align: right;
     padding: 0;
}

.mobile .titlepage h2 {
     color: #fff;
     text-align: center;
}

.mobile .titlepage span {
     margin-left: 78px;
}

.mobile .titlepage p {
     color: #fff;
     font-size: 17px;
     line-height: 35px;
     font-weight: 500;
     padding: 20px 0px 35px 0px;
}


.mobile .titlepag h2 {
     color: #000000;
     text-align: Left;
     font-size: 37px;
     font-weight: bold;
}

.mobile .titlepag span {
     margin-left: 0px;
}

.mobile .titlepag p {
     color: #000;
     font-size: 17px;
     line-height: 35px;
     font-weight: 500;
     padding: 20px 0px 35px 0px;
}

.mobile_img figure {
     margin: 0;
}

.mobile_img figure img {
     width: 100%;
}

.mobile .titlepage .read_more {
     border: #fff solid 3px;
     color: #fff;
}

/*
.mobile .titlepag .read_more {
     border: #fff solid 3px;
     color: #fff;
}
*/

/** mobile section **/


/** clients section **/

.clients {
     margin-top: 40px;
     padding-top: 10px;
     
}

.clients .titlepage h2 {
     color: #202021;
     text-align: center;
     font-size: 40px;
     padding-top: 30px;
}

.clients .titlepage h1 {
     color: #202021;
     text-align: left;
}

.clients .titlepage p {
     color: #292e39;
     font-size: 17px;
     text-align: left;
     line-height: 30px;
     font-weight: 300;
     padding: 20px 0px 35px 0px;
}

.clients .titlepage span {
     margin-left: 0px;
}

.clients_box {
     text-align: center;
     background: #e2e3e3;
     padding: 50px 15px;
     border-radius: 15px;
     position: relative;
}

.clients_box p {
     font-size: 17px;
     line-height: 35px;
}

.clients_box::after {
     position: absolute;
     content: "";
     width: 42px;
     height: 67px;
     bottom: -65px;
     background: url(../images/cli_cross.png);
     background-repeat: no-repeat;
}

.jonu {
     padding-top: 10px;
     text-align: center;
}

.jonu h3 {
     padding: 0px 0px 0px 0px;
     color: #0b0503;
     font-size: 25px;
}

.jonu strong {
     display: block;
     color: #00aeef;
     font-size: 17px;
     padding-bottom: 50px;
}


/** end clients section **/


/** contact section **/

.contact {
     background: #042431;
     margin-top: 0;
     padding: 90px 0;
}

.contact .titlepage h2 {
     text-align: center;
     color: #fff;
     font-size: 38px;
}

.main_form .contactus {
     border: inherit;
     margin-bottom: 20px;
     width: 100%;
     height: 60px;
     background: transparent;
     color: #f9fcfd;
     font-size: 18px;
     font-weight: normal;
     border-bottom: #fff solid 1px;
}

.main_form .send_btn {
     font-size: 17px;
     transition: ease-in all 0.5s;
     background-color: transparent;
     text-transform: uppercase;
     font-weight: 500;
     border: #00aeef solid 3px;
     color: #f9fcfd;
     padding: 8px 0px;
     margin: 0 auto;
     max-width: 180px;
     width: 100%;
     display: block;
     border-radius: 30px;
     margin-top: 30px;
}

.main_form .send_btn:hover {
     background-color: #00aeef;
     transition: ease-in all 0.5s;
     color: #fff;
}

#request *::placeholder {
     color: #f9fcfd;
     opacity: 1;
}


/** end contact section **/


/** footer **/

.footer {
     background: #042431;
     text-align: center;
}

.border-top {
     border-top: #fff solid 1px;
     padding-top: 30px;
}


.footer h3 {
     color: #fff;
     font-weight: 500;
     font-size: 17px;
     line-height: 20px;
     text-align: left;
     padding-bottom: 20px;
}
.footer p {
     color: #8a9397;
     font-weight: 300;
     font-size: 17px;
     line-height: 20px;
     text-align: left;
}

.footer_form {
     display: block;
     align-items: Left;
     justify-content: left;
     margin-left: 15px;
}

.footer_form .enter {
     border: inherit;
     margin-bottom: 20px;
     width: 73%;
     height: 40px;
     background: transparent;
     color: #f9fcfd;
     font-size: 14px;
     font-weight: 300;
     border-bottom: #fff solid 1px;
}

.submit {
     font-size: 14px;
     transition: ease-in all 0.5s;
     background-color: transparent;
     text-transform: uppercase;
     font-weight: 500;
     border: #00aeef solid 3px;
     color: #4d636c;
     padding: 5px 0px;
     margin-top: 10px;
     margin-bottom: 5px;
     max-width: 150px;
     width: 100%;
     display: block;
     border-radius: 30px;
     justify-content: left;
}

.submit:hover {
     background-color: #00aeef;
     transition: ease-in all 0.5s;
     color: #fff;
}

ul.cont li {
     color: #8a9397;
     font-size: 17px;
     line-height: 32px;
     text-align: left;
}

ul.cont a {
     color: #8a9397;
     font-size: 17px;
     line-height: 22px;
     text-align: left;
}

ul.cont li:hover {
     color: #90bc19;

}

ul.cont li a:hover {
     color: #90bc19;

}

ul.cont p a:hover {
     color: #90bc19;

}




.copyright {
     margin-top: 90px;
     padding: 20px 0px;
     background-color: #00aeef;
}

.copyright p {
     color: #fff;
     font-size: 18px;
     font-weight: 300;
     line-height: 22px;
     text-align: center;
}

.copyright a {
     color: #fff;
}

.copyright a:hover {
     color: #000;
}


/** end footer **/


/** inner page css **/

.margin_to90 .footer {
     margin-top: 90px;
}

.ourwork {
     margin: 20px 0 30px 0;
}

.ourwork .titlepage em {
     font-style: normal;
     color: #a4c639;
}

.ourwork .titlpage span {
     margin-left: 0px;
     background: #00a8e7;
     display: block;
     height: 10px;
     width: 90px;
     margin-bottom: 10px ;

}

.our_box {
     margin-bottom: 10px;
}


.our_box figure {
     margin: 0;
}

.our_box figure img {
     width: 330px;
     height: 95px;

            
}

.our_boxx {
     margin-bottom: 10px;
     text-align: center;
}


.our_boxx figure {
     margin: 0;

}

.our_boxx figure img {
     width: 330px;
     height: 95px;
}


/* Create two unequal columns that floats next to each other */
/* Left column */
.leftcolumn {
  float: left;
  width: 36%;
}

/* mid column */
.midcolumn {
  float: left;
  width: 37%;
  padding-left: 10px;
}

/* Right column */
.rightcolumn {
  float: left;
  width: 25%;
  padding-left: 10px;
}

/* Card image */
.articleimg {
  text-align: center;
  width: 100%;
  padding: 20px;
}
.cardimg {
  width: 100%;
  padding: 5px;
}

/* Add a card effect for articles */
.card {
  padding: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  border: 1px solid #ddd; 
  border-radius: 10px; 
  box-shadow: 0 2px 20px 0px rgba(0, 0, 0, 0.1); 
  background-color: #fff; 
  
}

.card1 {
  padding: 20px;
  margin-top: 20px;
}
.card1 span {
     background: #00a8e7;
     display: block;
     height: 10px;
     width: 90px;
     padding: 0px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}


/* More Info */

.more-info {
     margin-top: 70px;

}

.more-info .articleimg img {
  width: 50%;
}

.more-info .left-image img {
     width: 75%;
     overflow: hidden;
     display: block;
     margin-left: auto;
     margin-right: auto;
}

.more-info .more-info-content {
     border: 1px solid rgb(188, 188, 188, 0.5);
     margin-bottom: 50px;
}


.more-info .right-content {
     padding: 45px 45px 45px 30px;
}


.more-info .right-content p {
     font-size: 17px;
     color: #000;
     letter-spacing: 1px;
     margin-bottom: 10px;
     display: block;
     font-weight: 300;
}

/** Social Button CSS **/

.more-info-content .share-btn {
  display: inline-block;
  color: #ffffff;
  border: none;
  padding: 0.1em 0.6em;
  outline: none;
  text-align: center;
  font-size: 0.9em;
  margin: 0 0.2em;
}

.more-info-content .share-btn:focus,
.more-info-content .share-btn:hover {
  text-decoration: none;
  opacity: 0.8;
}

.more-info-content .share-btn:active {
  color: #e2e2e2;
}

.share-btn.twitter     { background: #55acee; }
.share-btn.google-plus { background: #dd4b39; }
.share-btn.facebook    { background: #3B5998; }
.share-btn.stumbleupon { background: #EB4823; }
.share-btn.reddit      { background: #ff5700; }
.share-btn.hackernews  { background: #ff6600; }
.share-btn.linkedin    { background: #4875B4; }
.share-btn.email       { background: #444444; }



/* Dropdown Button */
.dropbtn {
  background-color: #04AA6D;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #000;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: white;
  padding: 12px 12px;
  font-size: 14px;
  text-decoration: none;
  display: block;
  font-weight:300;

}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #fff;color: black;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #000;}



/* Dropdown Content (Hidden by Default) */
.dropdown-contents {
  display: none;
  position: absolute;
  background-color: #000;
  min-width: 60px;
  box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-contents a {
  color: white;
  padding: 12px 12px;
  text-decoration: none;
  display: block;
  text-align: center;
}

/* Change color of dropdown links on hover */
.dropdown-contents a:hover {background-color: #fff;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-contents {display: block;}
/*burger menu animation */
.menu-btn *{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  display: none;

}
.menu-btn body {
  background: #272727;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}
.menu-btn {
  position: relative;
  display: none;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  cursor: pointer;
  transition: all .5s ease-in-out;
  /* border: 3px solid #fff; */
}
.menu-btn__burger {
  width: 50px;
  height: 6px;
  background: #000;
  border-radius: 5px;
  
  transition: all .5s ease-in-out;
}
.menu-btn__burger::before,
.menu-btn__burger::after {
  content: '';
  position: absolute;
  width: 50px;
  height: 6px;
  background: #000;
  border-radius: 5px;
  
  transition: all .5s ease-in-out;
}
.menu-btn__burger::before {
  transform: translateY(-16px);
}
.menu-btn__burger::after {
  transform: translateY(16px);
}
/* ANIMATION */
.menu-btn.open .menu-btn__burger {
  transform: translateX(-50px);
  background: transparent;
  box-shadow: none;
}
.menu-btn.open .menu-btn__burger::before {
  transform: rotate(45deg) translate(35px, -35px);
}
.menu-btn.open .menu-btn__burger::after {
  transform: rotate(-45deg) translate(35px, 35px);
}

/*tab burger menu animation */
.wrapper {
  margin: 15px auto;
  width: 100%;
  display: none;
  text-align: left;
}

.tabmenu-btn *{
     margin: 0;
     padding: 0;
     box-sizing: border-box;
     display: none;
   
   }
   .tabmenu-btn body {
     background: #272727;
     display: flex;
     justify-content: center;
     align-items: center;
     min-height: 100vh;
   }
   .tabmenu-btn {
     position: relative;
     display: none;
     justify-content: center;
     align-items: center;
     width: 50px;
     height: 50px;
     cursor: pointer;
     transition: all .5s ease-in-out;
     /* border: 3px solid #fff; */
   }
   .tabmenu-btn__burger {
     width: 50px;
     height: 6px;
     background: #000;
     border-radius: 5px;
     box-shadow: 0 2px 5px rgba(255,101,47,.2);
     transition: all .5s ease-in-out;
   }
   .tabmenu-btn__burger::before,
   .tabmenu-btn__burger::after {
     content: '';
     position: absolute;
     width: 50px;
     height: 6px;
     background: #000;
     border-radius: 5px;
     box-shadow: 0 2px 5px rgba(255,101,47,.2);
     transition: all .5s ease-in-out;
   }
   .tabmenu-btn__burger::before {
     transform: translateY(-16px);
   }
   .tabmenu-btn__burger::after {
     transform: translateY(16px);
   }
   /* tabmenu ANIMATION */
   .tabmenu-btn.open .tabmenu-btn__burger {
     transform: translateX(-50px);
     background: transparent;
     box-shadow: none;
   }
   .tabmenu-btn.open .tabmenu-btn__burger::before {
     transform: rotate(45deg) translate(35px, -35px);
   }
   .tabmenu-btn.open .tabmenu-btn__burger::after {
     transform: rotate(-45deg) translate(35px, 35px);
   }
/* :: Hero Slides Area CSS */
.hero-area {
  position: relative;
  z-index: 10;
  bottom: 80px;
  top: 80px;
}
.hero-area .hero-slides {
  position: relative;
  z-index: 1;
}
.hero-area .hero-slides .single-hero-slide {
  height: 100%;
  position: relative;
  z-index: 1;
}

.hero-area .hero-post-area {
  position: absolute;
  top: 60px;
  bottom: 40px;
  left: 0;
  width: 100%;
  z-index: 200;
}
.hero-area .hero-post-slide .single-slide .post-number {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 80px;
  flex: 0 0 80px;
  min-width: 80px;
}
.hero-area .hero-post-slide .single-slide .post-number p {
  width: 55px;
  height: 55px;
  border: 5px solid;
  border-color: #8d8d8d;
  margin-right: 25px;
  border-radius: 50%;
  margin-bottom: 0;
  text-align: center;
  line-height: 45px;
  font-size: 24px;
  font-family: "Ubuntu", sans-serif;
  font-weight: 700;
}
.hero-area .hero-post-slide .single-slide .post-title a {
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 700;
  color: #000;
}
.hero-area .hero-post-slide .center .single-slide .post-number p {
  border: 5px solid;
  border-top-color: #90bc19;
  border-bottom-color: #90bc19;
  border-left-color: #00aaea;
  border-right-color: #90bc19;
}
.hero-area .hero-post-slide .center .single-slide .post-title a {
  color: #00aaea;
  font-weight: 700;
}

.ctacaption a {
  font-size: 16px;
  background-color: #00aeef;
  color: #fff;
  font-weight: 500;
  padding: 12px 10px;
  width: 100%;
  max-width: 230px;
  text-align: center;
  display: inline-block;
  transition: ease-in all 0.5s;
  margin-top: 60px;
  border-radius: 30px;
}
.ctacaption a:hover {
  background-color: #000;
  color: #fff;
  transition: ease-in all 0.5s;
}

/* blog post style */
.category-area .nav-tabs {
  padding: 5px 0;
  border-bottom: 2px solid #f1f1f1;
}

.category-area .nav-tabs .title {
    font-size: 18px;
    color: #000000;
    margin-bottom: 0;
    margin-right: auto;
    font-family: "Poppins";
    font-weight: 500;
    padding-left: 30px; }

.category-area .nav-tabs .nav-link {
    padding: 0 1em;
    position: relative;
    z-index: 1; }
.category-area .nav-tabs .nav-link:hover, 
.category-area .nav-tabs .nav-link:focus {
      background-color: #00aeef;
      color: #000000;
      border: 1px solid transparent;
      font-weight: 400; }
.category-area .nav-tabs .nav-link.active {
     background-color: #00aeef;
      color: #000000;
      border: 1px solid transparent; }
.category-area .nav-tabs .nav-link.active:after {
        position: absolute;
        left: 15px;
        bottom: -13px;
        content: '';
        background-color: #00aeef;
        width: calc(100% - 30px);
        height: 1px;
        box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15); }


.single-blog-post {
  position: relative;
  z-index: 1;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  margin-bottom: 5px;
  margin-top: 20px; }
.single-blog-post .post-thumbnail {
    position: relative;
    z-index: 1; }
.single-blog-post .post-thumbnail img {
      width: 100%; }


.single-blog-post .post-content {
    padding: 20px 30px; }
.single-blog-post .post-content .headline h5 {
      font-size: 18px;
      margin-bottom: 10px; }
.single-blog-post .post-content p {
      margin-bottom: 20px; }
.single-blog-post .post-content .post-meta p {
      margin-bottom: 0;
      font-size: 12px; }
.single-blog-post .post-content .post-meta p a {
        font-size: 12px; }

.single-blog-post.post-style-2 {
    margin-bottom: 5px; }
.single-blog-post.post-style-2 .post-thumbnail {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 97px;
      flex: 0 0 97px;
      min-width: 97px;
      margin-right: 15px; }

.single-blog-post.post-style-2 .post-content {
      padding: 5px 30px 5px 5px; }
.single-blog-post.post-style-2 .post-content .headline h5 {
        font-size: 14px;
        margin-bottom: 10px; }
.single-blog-post.post-style-2:last-of-type {
      margin-bottom: 0; }
.single-blog-post.post-style-2.widget-post .post-thumbnail {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 70px;
      flex: 0 0 70px;
      min-width: 70px;
      margin-right: 15px; }
.single-blog-post.post-style-3 .post-thumbnail {
  position: relative;
  z-index: 1;
}
.single-blog-post.post-style-3 .post-thumbnail::after {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: auto;
  content: "";
  position: absolute;
}
.single-blog-post.post-style-3 .post-content {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: center;
  padding: 0;
  position: absolute;
  width: calc(100% - 30px);
  height: calc(100% - 30px);
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  z-index: 2;
}
.single-blog-post.post-style-3 .post-content .post-tag a {
  padding: 0 10px;
  display: inline-block;
  height: 20px;
  background-color: #ffffff;
  text-transform: uppercase;
  font-size: 10px;
  color: #0000ff;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0.75px;
}
.single-blog-post.post-style-3 .post-content .post-tag a:hover,
.single-blog-post.post-style-3 .post-content .post-tag a:focus {
  background-color: #0000ff;
  color: #ffffff;
}
.single-blog-post.post-style-3 .post-content .headline h5 {
  font-size: 18px;
  color: #ffffff;
}

.single-blog-post.post-style-3 .post-content .headline h5:hover {
  font-size: 20px;
}
.single-blog-post.post-style-3 .post-content .post-meta p {
  font-size: 12px;
  color: white;
  font-weight: 300;
}

.single-blog-post.post-style-3 .post-content .post-meta p:hover {
  font-size: 15px;
}
.single-blog-post.post-style-4 {
    margin-bottom: 5px; }
.single-blog-post.post-style-4 .post-thumbnail {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 200px;
      flex: 0 0 200px;
      min-width: 200px;
      margin-right: 20px; }
.single-blog-post.post-style-4 .post-content {
      padding: 5px 30px 5px 5px; }
.single-blog-post.post-style-4 .post-content h5 {
        font-size: 17px;
        margin-bottom: 10px;
        color: #389BC8;
         }
.single-blog-post.post-style-4:last-of-type {
      margin-bottom: 20px; }


.sidebar-widget-area {
  position: relative;
  z-index: 1;
  border-bottom: 2px solid #f1f1f1; }
.sidebar-widget-area .title {
    display: block;
    font-size: 18px;
    color: #000000;
    margin-bottom: 0;
    margin-right: auto;
    font-family: "Poppins";
    font-weight: 500;
    padding: 8px 0;
    border-bottom: 2px solid #f1f1f1;
    padding-left: 30px; }
.sidebar-widget-area .widget-content {
    padding: 10px 0 30px 20px; }

.sidebar-widget-area:last-of-type {
    border-bottom: none; }
      
/* blog post style */

/*Reading Time Counter*/
   .reading-time {
     display: inline-block;
     text-align: center;
     font-size:14px;
     color: black;
     font-weight: 500;
 }

/*video section*/

.mobile_img video {
  margin: 0;
  width: 100%;
  height: auto;
}
/*video section*/
.imgblock {
     position: relative;
     top: 0;
     left: 0;
   }
   .image1 {
     position: relative;
     top: 0;
     left: 0;
   }
   .image2 {
     position: absolute;
     top: 5px;
     left: 30px;

   }