/*------------------------------------------------------------------
    IMPORT FILES
-------------------------------------------------------------------*/

@import url(animate.css);
@import url(magnific-popup.css);
@import url(responsiveslides.css);
@import url(timeline.css);


/*------------------------------------------------------------------
    SKELETON
-------------------------------------------------------------------*/

body {color:#666666;font-size:14px;line-height:1.80857;}

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:120% !important;
    color:#1f1f1f;
    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:12px}

h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {
    color:#212121;
    text-decoration:none!important;
    opacity:1
}

h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover {opacity:.8}

a {
    color:#1f1f1f;
    text-decoration:none;
    outline:none;
}

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;
}

.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;
}

blockquote {
    margin:20px 0 20px;
    padding:30px;
}

ul, li, ol{
	list-style:none;
	margin:0px;
	padding:0px;
}
button:focus{
	outline:none;
}

.form-control::-moz-placeholder {
    color:#ffffff;
    opacity:1;
}


/*------------------------------------------------------------------
    LOADER 
-------------------------------------------------------------------*/
#preloader {
    width:100%;
    height:100%;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:11000;
    position:fixed;
    display:block;
    display:flex;
    justify-content:center;
    align-items:center;
    background:radial-gradient(#0c81f2,#1b4170);
}
.loader {
    display:inline-flex;
    flex-wrap:wrap;
    width:80px;
    height:80px;
    -webkit-transform-style:preserve-3d;
}
.box {
    position:absolute;
    top:-20px;
    left:-15px;
    width:55px;
    height:55px;
    background-image:none;
    background-size:auto auto;
    background-image:none;
    -webkit-animation:move 1s ease-in-out infinite both;
    animation:move 2s ease-in-out infinite both;
        animation-delay:0s;
    animation-delay:0s;
    animation-delay:0s;
    background-image:url('../images/gb.png');
    background-size:100% 100%;
}
.box:nth-child(1) {-webkit-animation-delay:-1s;animation-delay:-1s;}
.box:nth-child(2) {-webkit-animation-delay:-2s;animation-delay:-2s;}
.box:nth-child(3) {-webkit-animation-delay:-3s;animation-delay:-3s;}

@-webkit-keyframes move {
  0%, 100% {
    -webkit-transform:none;
            transform:none;
  }
  12.5% {
    -webkit-transform:translate(40px, 0);
            transform:translate(40px, 0);
  }
  25% {
    -webkit-transform:translate(80px, 0);
            transform:translate(80px, 0);
  }
  37.5% {
    -webkit-transform:translate(80px, 40px);
            transform:translate(80px, 40px);
  }
  50% {
    -webkit-transform:translate(80px, 40px);
            transform:translate(80px, 40px);
  }
  62.5% {
    -webkit-transform:translate(30px, 60px);
            transform:translate(30px, 60px);
  }
  75% {
    -webkit-transform:translate(0, 80px);
            transform:translate(0, 40px);
  }
  87.5% {
    -webkit-transform:translate(0, 40px);
            transform:translate(0, 40px);
  }
}

@keyframes move {
  0%, 100% {
    -webkit-transform:none;
            transform:none;
  }
  12.5% {
    -webkit-transform:translate(40px, 0);
            transform:translate(40px, 0);
  }
  25% {
    -webkit-transform:translate(80px, 0);
            transform:translate(80px, 0);
  }
  37.5% {
    -webkit-transform:translate(80px, 40px);
            transform:translate(80px, 40px);
  }
  50% {
    -webkit-transform:translate(80px, 80px);
            transform:translate(80px, 80px);
  }
  62.5% {
    -webkit-transform:translate(40px, 80px);
            transform:translate(40px, 80px);
  }
  75% {
    -webkit-transform:translate(0, 80px);
            transform:translate(0, 80px);
  }
  87.5% {
    -webkit-transform:translate(0, 40px);
            transform:translate(0, 40px);
  }
}

#scroll-to-top {width:40px;height:40px;position:fixed;bottom:20px;right:20px;display:none;font-size:28px;border-radius:0;transition:.2s;text-align:center;line-height:35px;background:#0c81f2;color:#ffffff;font-weight:1000;border-radius:100%;}

/*------------------------------------------------------------------
    HEADER
-------------------------------------------------------------------*/
.top-header .navbar{padding:5px 0px;}
.top-header{background:#ffffff;position:relative;top:0px;left:0px;width:100%;margin:0 auto;z-index:20;}
.top-header .navbar .navbar-collapse ul li a {text-transform:capitalize;font-size:16px;padding:10px 12px;position:relative;font-weight:500;overflow:hidden;}
.top-header .navbar .navbar-collapse ul li a.active {background:#0c81f2;color:#ffffff;border-radius:0 15px;}
.top-header .navbar .navbar-collapse ul li a:hover,
.top-header .navbar .navbar-collapse ul li a:focus {background:#0c81f2;color:#ffffff;border-radius:0 15px;}
.top-header .navbar .navbar-collapse ul li {margin:2px;}

.top-header.fixed-menu{
	width:100%;
	position:fixed;
	box-shadow:0px 3px 6px 3px rgba(0, 0, 0, 0.06);
	-webkit-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-name:fadeInDown;
	animation-name:fadeInDown;
	background:#fff;
	z-index:20;
}

.navbar-toggler{
	border:2px solid #0c81f2;
	border-radius:0;
	margin:16px 15px;
	padding:10px 10px;
	-webkit-transition:all 0.2s linear;
	-moz-transition:all 0.2s linear;
	-o-transition:all 0.2s linear;
	transition:all 0.2s linear;
}
.navbar-toggler span {
    background:#0c81f2;
    display:block;
    width:22px;
    height:2px;
    margin:0 auto;
        margin-top:0px;
    margin-top:0px;
    -webkit-border-radius:1px;
    -moz-border-radius:1px;
    border-radius:1px;
    -webkit-transition:all 0.2s linear;
    -moz-transition:all 0.2s linear;
    -o-transition:all 0.2s linear;
    transition:all 0.2s linear;
}
.navbar-toggler span + span{
	margin-top:5px;
}

.navbar-toggler:hover {
    border:2px solid #0c81f2;
}

.navbar-toggler:hover span{
	background:#0c81f2;
}
.navbar-brand img {max-width:260px;}


/*------------------------------------------------------------------
    Banner
-------------------------------------------------------------------*/
.img-responsive {max-width:100%;}
.title-box{text-align:center;margin-bottom:30px;}
.title-box h2 {font-size:35px;color:#0c81f2;font-weight:500;letter-spacing:1px;padding:0;}
.title-box h2 span{color:#70c6eb;text-decoration:underline;}
.title-box p {font-size:14px;line-height:22px;margin-top:10px;color:#000000;}

/*------------------------------------------------------------------
    About
-------------------------------------------------------------------*/
.about-box{padding:0;}
.about-a1 {padding:25px 0;}
.about-main-info {vertical-align:middle;}
.about-main-info h2 {font-size:36px;color:#0c81f2;font-weight:500;vertical-align:middle;}
.about-main-info h2 img {width:45px;padding-right:10px;padding-bottom:3px;vertical-align:middle;}
.about-main-info p{color:#000;font-size:14px;line-height:24px;}
.about-main-info a {transition:.2s;padding:5px 25px;background:#0c81f2;color:#ffffff;font-size:16px;border-radius:0 15px;}
.about-main-info a:hover{color:#ffffff;}
.about-main-info div.full > img {height:430px;}
.hvr-radial-out{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px rgba(0, 0, 0, 0);position:relative;overflow:hidden;background:#e1e1e1;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:0.3s;transition-duration:0.3s;}
.hvr-radial-out::before {content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#3a4149;border-radius:100%;-webkit-transform:scale(0);transform:scale(0);-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;}
.hvr-radial-out:hover::before, .hvr-radial-out:focus::before, .hvr-radial-out:active::before {-webkit-transform:scale(2);transform:scale(2);}

/*------------------------------------------------------------------
    萌家班门店
-------------------------------------------------------------------*/
.services-box {padding:70px 0 0 0;background-color:#fff;}
.effect-service {background:#0c81f2;position:relative;height:auto;text-align:center;cursor:pointer;border:8px solid #eee;margin-bottom:30px;}
.effect-service img {position:relative;display:block;min-height:100%;max-width:100%;}
.effect-service h2{font-size:18px;color:#fff;padding:10px 0 0 0;}
.effect-service p{font-size:14px;color:#fff;line-height:20px;}

/*------------------------------------------------------------------
    萌家班产品
-------------------------------------------------------------------*/
.h2t {color:#0c81f2;font-size:16px;margin-top:20px;}
.h2t span {display:inline-block;}
.gallery-box{padding:70px 0 60px 0;}
.gallery-box ul{}
.gallery-box ul li {position:relative;width:31.33%;margin:0 1% 20px !important;padding:0px;float:left;border:none;overflow:hidden;margin-bottom:0px;}
.gallery-box ul li a{position:relative;display:inline-block;border:4px solid #ffffff;}
.gallery-box ul li a:hover{border:4px solid #0c81f2;}

/*------------------------------------------------------------------
    服务
-------------------------------------------------------------------*/
.contact-box{padding:50px 0;}
.cont-line{overflow:hidden;margin-bottom:30px;}
.icon-b {width:50px;height:50px;text-align:center;line-height:48px;font-size:30px;margin-right:15px;color:#fff;border-radius:100%;background:#0c81f2;}
.dit-right h4 {font-size:18px;color:#3a4149;font-weight:500;margin:0;padding:0;}
.dit-right p {font-size:14px;line-height:22px;margin-top:8px;}
.dit-right a {font-size:14px;color:#3a4149;font-weight:300;line-height:normal;}
.dit-right a:hover{color:#57cef8;}

/*------------------------------------------------------------------
    Subscribe
-------------------------------------------------------------------*/
.subscribe-box {padding:70px 0px;background:#0c81f2;}
.subscribe-inner{max-width:500px;width:100%;margin:0 auto;}
.subscribe-inner h2 {font-size:66px;font-weight:600;color:#ffffff;margin-bottom:10px;}
.subscribe-inner img{max-width:88%;}

/*------------------------------------------------------------------
    FOOTER
-------------------------------------------------------------------*/
.footer-box {background:#fff;padding:20px 0;text-align:center;}
.footer-box p{font-size:14px;line-height:22px;color:#666;}

p {
    margin-top:5px;
    margin-bottom:1rem;
    font-size:16px;
    font-weight:300;
    line-height:normal;
}

.text_align_center {
  text-align:center;
}

.red_bg  {
  background:#0c81f2;
}


.white_fonts p,
.white_fonts h1,
.white_fonts h2,
.white_fonts h3,
.white_fonts h4,
.white_fonts h5,
.white_fonts h6,
.white_fonts ul,
.white_fonts ul li,
.white_fonts ul li a,
.white_fonts ul i,
.white_fonts .post_info i,
.white_fonts div,
.white_fonts a.read_more {
    color:#fff !important;
}

.red_bg .about-main-info a {
    background:#fff;
    color:#0c81f2;
}

.testimonial_img {
    text-align:center;
    width:100%;
    display:flex;
    justify-content:center;
}

.mfp-figure figure .mfp-bottom-bar {
    display:none;
}

#client_slider .carousel-indicators {
    bottom:-45px;
}

#client_slider .carousel-indicators li {
    height:15px;
    width:15px;
    border-radius:100%;
    background:#999;
}

#client_slider .carousel-indicators li.active {
    background:#0c81f2;
}