body { font-family: 'Lato', arial, sans-serif; color: #444; font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } html, body { height: 100%; } .wrapper { min-height: 100%; margin-bottom: -296px; /* equal to footer height */ } .wrapper:after { content: ""; display: block; height: 296px; /* must be the same height as footer */ } .footer { height: 296px; /* must be the same height as footer */ } h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; font-weight: bold; } p { color: #444; font-size: 16px; } a { color: #C70700; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; } a:hover { text-decoration: none; color: #48953f; } a:focus { text-decoration: none; } .btn, a.btn { -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; font-family: 'Montserrat', sans-serif; padding: 8px 16px; } .btn .fa, a.btn .fa { color: #fff; margin-right: 5px; } a.btn-cta-primary, .btn-cta-primary { background: #C70700; border: 2px solid #C70700; color: #fff; text-transform: uppercase; } a.btn-cta-primary:hover, .btn-cta-primary:hover { background: #51a746; border: 2px solid #51a746; color: #fff; } a.btn-cta-secondary, .btn-cta-secondary { background: #fff; border: 2px solid #C70700; color: #C70700; } a.btn-cta-secondary .fa, .btn-cta-secondary .fa { margin-left: 5px; color: #C70700; } a.btn-cta-secondary:hover, .btn-cta-secondary:hover { background: #fff; border: 2px solid #51a746; color: #51a746; } a.btn-cta-secondary:hover .fa, .btn-cta-secondary:hover .fa { color: #51a746; } .form-control { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; height: 40px; border-color: #d9d9d9; } .form-control:focus { border-color: #C70700; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } blockquote { font-size: 14px; } .text-highlight { color: #2e5f28; } .tlinks{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;} #topcontrol { background: #8fcc87; color: #fff; text-align: center; display: inline-block; width: 35px; height: 35px; border: none; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; } #topcontrol:hover { background: #C70700; } #topcontrol .fa { position: relative; top: 3px; font-size: 25px; } input[type="text"], input[type="email"], input[type="password"], input[type="submit"], input[type="button"], textarea, select { appearance: none; /* for mobile safari */ -webkit-appearance: none; } ::-webkit-input-placeholder { /* WebKit browsers */ color: #ccc; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #ccc; } ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #ccc; } :-ms-input-placeholder { /* Internet Explorer 10+ */ color: #ccc; } .delayp1 { animation-delay: .1s; -moz-animation-delay: .1s; -webkit-animation-delay: .1s; -o-animation-delay: .1s; transition-delay: .1s; -webkit-transition-delay: .1s; -moz-transition-delay: .1s; -o-transition-delay: .1s; } .delayp2 { animation-delay: .2s; -moz-animation-delay: .2s; -webkit-animation-delay: .2s; -o-animation-delay: .2s; transition-delay: .2s; -webkit-transition-delay: .2s; -moz-transition-delay: .2s; -o-transition-delay: .2s; } .delayp3 { animation-delay: .3s; -moz-animation-delay: .3s; -webkit-animation-delay: .3s; -o-animation-delay: .3s; transition-delay: .3s; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; } .delayp4 { animation-delay: .4s; -moz-animation-delay: .4s; -webkit-animation-delay: .4s; -o-animation-delay: .4s; transition-delay: .4s; -webkit-transition-delay: .4s; -moz-transition-delay: .4s; -o-transition-delay: .4s; } .delayp5 { animation-delay: .5s; -moz-animation-delay: .5s; -webkit-animation-delay: .5s; -o-animation-delay: .5s; transition-delay: .5s; -webkit-transition-delay: .5s; -moz-transition-delay: .5s; -o-transition-delay: .5s; } .delayp6 { animation-delay: .6s; -moz-animation-delay: .6s; -webkit-animation-delay: .6s; -o-animation-delay: .6s; transition-delay: .6s; -webkit-transition-delay: .6s; -moz-transition-delay: .6s; -o-transition-delay: .6s; } .delayp7 { animation-delay: .7s; -moz-animation-delay: .7s; -webkit-animation-delay: .7s; -o-animation-delay: .7s; transition-delay: .7s; -webkit-transition-delay: .7s; -moz-transition-delay: .7s; -o-transition-delay: .7s; } .delayp8 { animation-delay: .8s; -moz-animation-delay: .8s; -webkit-animation-delay: .8s; -o-animation-delay: .8s; transition-delay: .8s; -webkit-transition-delay: .8s; -moz-transition-delay: .8s; -o-transition-delay: .8s; } .delayp9 { animation-delay: .9s; -moz-animation-delay: .9s; -webkit-animation-delay: .9s; -o-animation-delay: .9s; transition-delay: .9s; -webkit-transition-delay: .9s; -moz-transition-delay: .9s; -o-transition-delay: .9s; } .delay1s { animation-delay: 1s; -moz-animation-delay: 1s; -webkit-animation-delay: 1s; -o-animation-delay: 1s; transition-delay: 1s; -webkit-transition-delay: 1s; -moz-transition-delay: 1s; -o-transition-delay: 1s; } .delay2s { animation-delay: 2s; -moz-animation-delay: 2s; -webkit-animation-delay: 2s; -o-animation-delay: 2s; transition-delay: 2s; -webkit-transition-delay: 2s; -moz-transition-delay: 2s; -o-transition-delay: 2s; } /* ======= Homepage Headline Background & Slideshow ======= */ .bg-slider-wrapper { content: ""; position: absolute; width: 100%; top: 0; left: 0; height: 620px; background: #fff; } .bg-slider-wrapper .flexslider { margin: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .bg-slider-wrapper .flexslider .slide { display: block; height: 620px; } .bg-slider-wrapper .flexslider .slide.slide-1 { background: #fff url('../images/background/promo-bg.jpg') no-repeat 50% top; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-size: cover; //只支持IE9+ -webkit-background-size: cover; //webkit核心 -moz-background-size: cover; //FF核心 -o-background-size: cover; //应该是Opera核心吧,反正不是IE的,先不管它了 } .bg-slider-wrapper .flexslider .slide.slide-2 { background: #fff url('../images/background/promo-bg-2.jpg') no-repeat 50% top; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .bg-slider-wrapper .flexslider .slide.slide-3 { background: #fff url('../images/background/promo-bg-3.jpg') no-repeat 50% top; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .bg-slider-wrapper .flexslider .flex-control-nav { z-index: 20; bottom: 45px; position: relative; } .bg-slider-wrapper .flexslider .flex-control-nav li a { background: rgba(255, 255, 255, 0.3); } .bg-slider-wrapper .flexslider .flex-control-nav li a.flex-active { background: rgba(255, 255, 255, 0.8); } /* ======= Header ======= */ .header { padding: 15px 0; background: #fff; z-index: 888; -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.5); box-shadow: 0 0 4px rgba(0, 0, 0, 0.5); } .header.navbar-fixed-top { border: none; } .header.navbar-fixed-top .main-nav .navbar-collapse { padding-left: 15px; padding-right: 15px; } .header h1.logo { margin-top: 0; margin-bottom: 0; text-transform: uppercase; font-weight: bold; font-size: 28px; max-height: 50px; } .header h1.logo a { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; } .header h1.logo a:hover { color: #C70700; } .header h1.logo .logo-title { vertical-align: middle; line-height: 1.6; } .header .main-nav .navbar-toggle { margin-right: 0; background: #51a746; color: #fff !important; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .header .main-nav .navbar-toggle:focus { outline: none; } .header .main-nav .navbar-toggle:hover { background: #C70700; } .header .main-nav .navbar-toggle .icon-bar { background-color: #fff; } .header .main-nav .nav .nav-item { font-weight: normal; text-transform: uppercase; font-size: 14px; margin-right: 10px; } .header .main-nav .nav .nav-item .btn-link { background: none; color: #666 !important; font-weight: 400; text-transform: uppercase; font-family: 'Lato', arial, sans-serif !important; font-size: 14px; line-height: 20px; padding: 10px 15px; border: none; text-decoration: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .header .main-nav .nav .nav-item .btn-link:focus { outline: none; } .header .main-nav .nav .nav-item .btn-link:hover { color: #C70700 !important; } .header .main-nav .nav .nav-item.active a { color: #51a746; background: none; font-weight: bold; } .header .main-nav .nav .nav-item.nav-item-cta .btn-cta-primary { -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; padding: 6px 12px; color: #fff; font-weight: 300; font-family: 'Montserrat', sans-serif; margin-top: 2px; background: #C70700; } .header .main-nav .nav .nav-item.nav-item-cta .btn-cta-primary:hover { background: #51a746; border: 2px solid #51a746; color: #fff; } .header .main-nav .nav .nav-item a { color: #666; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; } .header .main-nav .nav .nav-item a:hover { color: #C70700; background: none; } .header .main-nav .nav .nav-item a:focus { outline: none; background: none; } .header .main-nav .nav .nav-item a:active { outline: none; background: none; } .header .main-nav .nav .nav-item.active { color: #C70700; } .header .main-nav .nav .nav-item.last { margin-right: 0; } .header .main-nav .nav .open > a { background: none; } .header .main-nav .nav .dropdown-menu { -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid #f5f5f5; border-top: 3px solid #C70700; margin: 0; text-transform: none; min-width: 180px; } .header .main-nav .nav .dropdown-menu a { border-bottom: 1px dotted #f5f5f5; padding: 8px 20px; color: #444; -webkit-opacity: 1; -moz-opacity: 1; opacity: 1; } .header .main-nav .nav .dropdown-menu a:hover { background: #fff; color: #C70700; } .header .main-nav .nav .dropdown-menu:before { content: ""; display: block; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #C70700; position: absolute; right: 30px; top: -10px; } /* ======= Footer ======= */ .footer { background: #C70700; color: #fff; padding: 2px 0; } .footer .footer-col.about .more .fa { margin-left: 5px; position: relative; top: 1px; } .footer .footer-col.links .fa { margin-right: 5px; } .footer .footer-col.links li { margin-bottom: 10px; } .footer .footer-col.contact p { color: #377130; } .footer .footer-col.contact .fa { margin-right: 10px; color: #377130; } .footer .footer-col .title { color: #2e5f28; font-weight: normal; font-size: 18px; } .footer .footer-col p { color: #fff; } .footer .footer-col a { color: #377130; } .footer .footer-col a:hover { color: #1d3b19; } .footer .bottom-bar { background: #444; /*color: #b3b3b3;*/ font-size: 14px; padding: 10px 0; margin-top: 0px; } .footer .bottom-bar .copyright { line-height: 1.6; } .footer .bottom-bar .social { margin-bottom: 0; text-align: right; } .footer .bottom-bar .social li { margin-left: 10px; float: right; text-align: right; } .footer .bottom-bar .social li a .fa { color: #b3b3b3; font-size: 20px; } .footer .bottom-bar .social li a:hover .fa { /*color: #C70700;*/ } /* ======= Signup Section ======= */ .signup { padding: 30px 0; } .signup.has-bg-color { background: #f5f5f5; } .signup .title { font-size: 28px; font-weight: bold; margin-bottom: 30px; margin-top: 0; } .signup .summary { margin-bottom: 30px; color: #999; font-size: 18px; } .signup .signup-form .form-control { font-size: 16px; color: #999; } .signup .signup-form .form-group { display: inline-block; margin-bottom: 0; vertical-align: middle; width: 380px; } /* ======= Modal ======= */ .modal.modal-video .modal-dialog { width: 760px; margin: 30px auto; } .modal.modal-video .modal-body { padding: 10px; padding-top: 0; } .modal.modal-video .modal-header { border: none; padding: 10px; } .modal.modal-video .modal-title { color: #377130; } .modal.modal-login .modal-dialog, .modal.modal-signup .modal-dialog, .modal.modal-resetpass .modal-dialog { width: 460px; margin: 30px auto; } .modal.modal-login .modal-header, .modal.modal-signup .modal-header, .modal.modal-resetpass .modal-header { border: none; padding: 15px; } .modal.modal-login .modal-header .modal-title, .modal.modal-signup .modal-header .modal-title, .modal.modal-resetpass .modal-header .modal-title { margin-top: 15px; margin-bottom: 15px; } .modal.modal-login .modal-body, .modal.modal-signup .modal-body, .modal.modal-resetpass .modal-body { padding: 30px; padding-top: 0; } .modal.modal-login .modal-body .intro, .modal.modal-signup .modal-body .intro, .modal.modal-resetpass .modal-body .intro { color: #666; margin-bottom: 30px; } .modal.modal-login .modal-footer, .modal.modal-signup .modal-footer, .modal.modal-resetpass .modal-footer { padding: 30px; background: #f5f5f5; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; -moz-border-radius-topleft: 0; border-top-right-radius: 0; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; border-top-left-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; text-align: center; } .modal.modal-login .modal-footer p, .modal.modal-signup .modal-footer p, .modal.modal-resetpass .modal-footer p { color: #666; font-size: 14px; margin-bottom: 0; } .modal.modal-login .form-group, .modal.modal-signup .form-group, .modal.modal-resetpass .form-group { position: relative; } .modal.modal-login .form-group.email:before, .modal.modal-signup .form-group.email:before, .modal.modal-resetpass .form-group.email:before { content: "\f007"; font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: absolute; left: 10px; top: 12px; color: #999; } .modal.modal-login .form-group.password:before, .modal.modal-signup .form-group.password:before, .modal.modal-resetpass .form-group.password:before { content: "\f023"; font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: absolute; left: 10px; top: 12px; color: #999; } .modal.modal-login .form-control, .modal.modal-signup .form-control, .modal.modal-resetpass .form-control { font-size: 16px; padding-left: 30px; } .modal.modal-login .social-login, .modal.modal-signup .social-login, .modal.modal-resetpass .social-login { margin-bottom: 15px; } .modal.modal-login .social-login li, .modal.modal-signup .social-login li, .modal.modal-resetpass .social-login li { margin-bottom: 10px; } .modal.modal-login .social-login li .btn, .modal.modal-signup .social-login li .btn, .modal.modal-resetpass .social-login li .btn { color: #fff; } .modal.modal-login .social-login li .btn:hover, .modal.modal-signup .social-login li .btn:hover, .modal.modal-resetpass .social-login li .btn:hover { color: #fff; } .modal.modal-login .social-login li .btn .fa, .modal.modal-signup .social-login li .btn .fa, .modal.modal-resetpass .social-login li .btn .fa { font-size: 18px; position: relative; top: 2px; margin-right: 10px; } .modal.modal-login .twitter-btn, .modal.modal-signup .twitter-btn, .modal.modal-resetpass .twitter-btn { background: #55acee; } .modal.modal-login .twitter-btn:hover, .modal.modal-signup .twitter-btn:hover, .modal.modal-resetpass .twitter-btn:hover { background: #2795e9; } .modal.modal-login .facebook-btn, .modal.modal-signup .facebook-btn, .modal.modal-resetpass .facebook-btn { background: #3b5998; } .modal.modal-login .facebook-btn:hover, .modal.modal-signup .facebook-btn:hover, .modal.modal-resetpass .facebook-btn:hover { background: #2d4373; } .modal.modal-login .google-btn, .modal.modal-signup .google-btn, .modal.modal-resetpass .google-btn { background: #dd4b39; } .modal.modal-login .google-btn:hover, .modal.modal-signup .google-btn:hover, .modal.modal-resetpass .google-btn:hover { background: #c23321; } .modal.modal-login .forgot-password, .modal.modal-signup .forgot-password, .modal.modal-resetpass .forgot-password { font-size: 13px; margin-top: 10px; } .modal.modal-login .forgot-password a, .modal.modal-signup .forgot-password a, .modal.modal-resetpass .forgot-password a { color: #999; } .modal.modal-login .forgot-password a:hover, .modal.modal-signup .forgot-password a:hover, .modal.modal-resetpass .forgot-password a:hover { text-decoration: underline; color: #C70700; } .modal.modal-login .divider, .modal.modal-signup .divider, .modal.modal-resetpass .divider { text-align: center; position: relative; margin-bottom: 30px; color: #999; text-transform: uppercase; } .modal.modal-login .divider span, .modal.modal-signup .divider span, .modal.modal-resetpass .divider span { background: #fff; display: inline-block; padding: 0 10px; position: relative; } .modal.modal-login .divider:before, .modal.modal-signup .divider:before, .modal.modal-resetpass .divider:before { content: ""; position: absolute; left: 0; top: 12px; background: #e5e5e5; height: 1px; width: 100%; } .modal.modal-login .note, .modal.modal-signup .note, .modal.modal-resetpass .note { color: #999; font-size: 13px; margin-bottom: 30px; } .modal.modal-login .btn + .note, .modal.modal-signup .btn + .note, .modal.modal-resetpass .btn + .note { margin: 15px 0; } .modal.modal-login .remember label, .modal.modal-signup .remember label, .modal.modal-resetpass .remember label { font-size: 14px; color: #666; } /* modal body padding shifting bug hack */ body.modal-open { overflow-y: scroll; padding-right: 0 !important; } /* ======= Pagination ======= */ .pagination { margin-bottom: 60px; } .pagination li a { -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; border: none; margin-right: 5px; color: #C70700; } .pagination li a:hover { color: #377130; } .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { background-color: #C70700; border: none; } .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { background-color: #d2eacf; border: none; } .pagination > li:first-child > a, .pagination > li:first-child > span, .pagination > li:last-child > a, .pagination > li:last-child > span { -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; background: none; } /* ======= Promo Section ======= */ .promo { position: relative; min-height: 620px; } .promo .intro { color: #fff; padding-top: 30px; position: relative; z-index: 10; } .promo .intro .title { color: #fff; font-size: 38px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); max-width: 920px; font-weight: bold; margin-bottom: 15px; } .promo .intro .summary { color: #fff; font-size: 22px; max-width: 1000px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); margin-bottom: 15px; } .promo .fixed-container { position: absolute; z-index: 10; bottom: 0; width: 100%; } .promo .signup { background: rgba(0, 0, 0, 0.2); padding: 30px 0; padding-bottom: 45px; color: #fff; } .promo .signup .title { font-size: 23px;font-family:'courier new'; margin-top: 0; margin-bottom: 0px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); } .promo .signup .summary { color: #fff; font-size: 16px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3); } .promo .social { background: #C70700; padding: 8px 0; -webkit-opacity: 0.8; -moz-opacity: 0.8; opacity: 0.8; color: #fff; font-size: 13px; } .promo .social .line { position: relative; /*top: -4px;*/ display: inline-block;text-align: right; margin-right: 10px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); } .promo .social .twitter-tweet { display: inline-block; position: relative; top: 2px; } .promo .social .fb-like { display: inline-block; position: relative; top: -2px; } /* ======= Press Section ======= */ .press { background: #f5f5f5; padding: 30px 0; } .press ul { margin: 0 auto; margin-bottom: 0; } .press li { vertical-align: middle; text-align: center; } .press li.last { margin-right: 0; } .press li a img { -webkit-opacity: 0.4; -moz-opacity: 0.4; opacity: 0.4; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; max-width: 190px; margin: 0 auto; } .press li a:hover img { -webkit-opacity: 1; -moz-opacity: 1; opacity: 1; } /* ======= Why Section ======= */ .why { padding: 40px 0; } .why .title { /*font-weight: bold;*/ margin-top: 0; margin-bottom: 10px; font-size: 30px; /*color: #ff0000;*/ } .why .title2 { /*font-weight: bold;*/ margin-top: 30px; margin-bottom: 10px; font-size: 30px; /*color: #ff0000;*/ } .why .intro { font-size: 18px; line-height: 2.0; /*color: #999;*/ margin-bottom: 0px; } .why .benefits { padding: 60px 0; } .why .benefits .item { margin-bottom: 60px; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; } .why .benefits .item .title { margin-bottom: 15px; font-size: 18px; color: #C70700; } .why .benefits .item .desc { color: #666; } .why .benefits .item .icon { float: left; } .why .benefits .item .icon .fa, .why .benefits .item .icon .pe-icon { font-size: 58px; color: #b3b3b3; margin-top: 5px; } .why .benefits .item .icon .pe-icon { font-size: 72px; } .why .benefits .item:hover .icon .fa, .why .benefits .item:hover .icon .pe-icon { color: #999; } .why .benefits .item.last { margin-bottom: 60px; } .why .testimonials { padding: 60px 0; } .why .testimonials .item { margin-bottom: 60px; } .why .testimonials .item.last { margin-bottom: 0; } .why .testimonials .item .quote-box { background: #f5f5f5; padding: 30px; padding-bottom: 15px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; position: relative; margin-bottom: 30px; } .why .testimonials .item .quote-box .fa { color: #9fd499; font-size: 18px; position: absolute; right: 30px; bottom: 30px; } .why .testimonials .item .quote-box:after { content: ""; display: block; width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-top: 20px solid #f5f5f5; position: absolute; bottom: -20px; margin-left: -20px; left: 50%; } .why .testimonials .item .quote { border: none; padding: 0; font-size: 16px; color: #666; margin-bottom: 15px; } .why .testimonials .item .details { font-size: 13px; } .why .testimonials .item .details .name { display: block; font-weight: normal; font-family: 'Montserrat', sans-serif; } .why .testimonials .item .details .title { display: block; color: #b3b3b3; margin-bottom: 0; font-weight: normal; font-size: 13px; } .why .testimonials .item .people .user-pic { max-width: 122px; max-height: 122px; } .why .testimonials .item .people .user-pic, .why .testimonials .item .people .user-pic *, .why .testimonials .item .people .user-pic *:before, .why .testimonials .item .people .user-pic *:after { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } /* ======= Video Section ======= */ .video { padding: 5px 0; position: relative; /*background: url('../images/background/video-bg.jpg') no-repeat center center;*/ background: url('../images/background/jiagou.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; /*min-height: 516px;*/ min-height: 1500px; color: #fff; } .video11 { padding: 5px 0; position: relative; /*background: url('../images/background/video-bg.jpg') no-repeat center center;*/ background: url('../images/background/1.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; /*min-height: 516px;*/ min-height: 1500px; color: #fff; } .video .title { color: #fff; font-size: 28px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); max-width: 720px; font-weight: bold; margin-bottom: 15px; } .video .summary { color: #fff; font-size: 18px; max-width: 360px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); margin-bottom: 15px; } .video .control { position: relative; top: -40px; } .video .control .play-trigger { color: #fff; background: none; position: relative; width: 80px; height: 80px; border: 4px solid #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; display: table; margin: 0 auto; margin-bottom: 15px; -webkit-opacity: 0.7; -moz-opacity: 0.7; opacity: 0.7; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; } .video .control .play-trigger:active, .video .control .play-trigger:focus { outline: none; } .video .control .play-trigger:hover { color: #fff; -webkit-opacity: 1; -moz-opacity: 1; opacity: 1; } .video .control .play-trigger:hover .fa { cursor: pointer; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); } .video .control .play-trigger .fa { font-size: 32px; width: 80px; display: table-cell; text-align: center; vertical-align: middle; } .video .control p { color: #fff; } /* ======= FAQ Section ======= */ .faq { padding: 20px 0; } .faq.has-bg-color { background: #f5f5f5; } .faq .title { margin-bottom: 60px; font-size: 28px; } .faq .title2 { /*font-weight: bold;*/ margin-top: 30px; margin-bottom: 10px; font-size: 30px; /*color: #ff0000;*/ } .faq .panel { background: #f0f0f0; } .faq .panel .panel-heading { padding: 15px 30px; } .faq .panel .panel-body { padding: 30px; padding-top: 0; color: #666; } .faq .panel .panel-title { font-weight: normal; color: #666; } .faq .panel .panel-title .active { color: #408337; } .faq .panel .panel-title .panel-toggle .fa { margin-right: 10px; color: #C70700; } .faq .more { margin-top: 60px; } .faq .more .title { margin-bottom: 15px; color: #999; font-size: 16px; font-weight: normal; } /* ======= faq22 Section ======= */ .faq22 { padding: 20px 0; } .faq22.has-bg-color { background: #f5f5f5; } .faq22 .title { margin-bottom: 60px; font-size: 28px; } .faq22 .title2 { /*font-weight: bold;*/ margin-top: 30px; margin-bottom: 10px; font-size: 30px; /*color: #ff0000;*/ } .faq22 .panel { background: #f0f0f0; } .faq22 .panel .panel-heading { padding: 15px 30px; } .faq22 .panel .panel-body { padding: 30px; padding-top: 0; color: #666; } .faq22 .panel .panel-title { font-weight: normal; color: #666; } .faq22 .panel .panel-title .active { color: #408337; } .faq22 .panel .panel-title .panel-toggle .fa { margin-right: 10px; color: #C70700; } .faq22 .more { margin-top: 60px; } .faq22 .more .title { margin-bottom: 15px; color: #999; font-size: 16px; font-weight: normal; } /* ======= Feature Promo Section ======= */ .features-promo { position: relative; background: #C70700 url('../images/background/tour-bg.jpg') no-repeat center bottom; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; min-height: 500px; } .features-promo .bg-mask { background: #C70700; -webkit-opacity: 0.9; -moz-opacity: 0.9; opacity: 0.9; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .features-promo .features-intro { color: #fff; padding-top: 30px; } .features-promo .features-intro .title { color: #fff; font-size: 32px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); max-width: 720px; font-weight: bold; margin-bottom: 30px; } .features-promo .features-intro .features-list { font-size: 18px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); margin-left: 0; } .features-promo .features-intro .features-list li { margin-bottom: 15px; } .features-promo .features-intro .features-list li .fa { margin-right: 10px; color: #408337; text-shadow: none; } .features-promo .features-video { padding-top: 60px; } .features { padding-top: 80px; } .features .item { padding: 60px 0; } .features .item .title { font-size: 22px; color: #C70700; margin-top: 0; } .features .item .content p { font-size: 16px; } .features .figure img { -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2); } /* ======= Price Plan Section ======= */ .price-plan { padding: 80px 0; } .price-plan .title { font-size: 28px; margin-bottom: 15px; } .price-plan .intro { font-size: 18px; line-height: 1.5; color: #999; margin-bottom: 30px; } .price-plan .item .heading { background: #444; color: #fff; font-size: 22px; padding: 10px 0; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; margin-bottom: 0; text-transform: uppercase; position: relative; } .price-plan .item .heading .label { -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; background: #C70700; color: #fff; font-size: 12px; position: absolute; padding: 5px 10px; right: 15px; top: 10px; } .price-plan .item .content { background: #f5f5f5; padding: 30px; } .price-plan .item .price-figure .currency { font-size: 24px; position: relative; top: -25px; } .price-plan .item .price-figure .number { font-family: 'Montserrat', sans-serif; font-size: 60px; } .price-plan .item .price-figure .unit { font-size: 12px; color: #bfbfbf; text-transform: uppercase; } .price-plan .item .feature-list li { padding: 10px 0; } .price-plan .item .btn { font-weight: bold; font-size: 16px; padding-left: 45px; padding-right: 45px; } .price-plan .item .btn .extra { text-transform: none; color: #2e5f28; font-weight: normal; font-size: 12px; font-family: 'Lato', arial, sans-serif; } /* ======= Blog Section ======= */ .blog { padding-top: 60px; } .blog .title { margin-bottom: 30px; margin-top: 0; font-size: 28px; } .blog .meta { font-size: 13px; color: #999; margin-bottom: 15px; } .blog .meta li { margin-right: 0; } .blog .meta .post-author:before { content: "/"; display: inline-block; padding-right: 10px; } .blog .meta .post-author a { color: #999; } .blog .meta .post-author a:hover { color: #C70700; } .blog .meta .post-comments-link { float: right; } .blog .meta .post-comments-link .fa { margin-right: 5px; } .blog-sidebar .widget { margin-bottom: 60px; } .blog-sidebar .widget .title { font-size: 22px; margin-bottom: 15px; margin-top: 0; font-weight: normal; color: #666; } .blog-sidebar .widget ul li { margin-bottom: 10px; font-size: 15px; } .blog-sidebar .widget ul li .count { color: #999; } .blog-sidebar .widget.recent-posts .date { color: #999; font-size: 12px; } .blog-sidebar .widget.social a .fa { font-size: 32px; color: #999; } .blog-sidebar .widget.social a:hover .fa { color: #C70700; } .blog-sidebar .search-blog-form .form-group { display: inline-block; margin-bottom: 0; vertical-align: middle; max-width: 168px; } .blog-sidebar .search-blog-form .form-control { height: 38px; } .blog-sidebar .search-blog-form .btn { padding: 6px 12px; } .blog-sidebar .search-blog-form .btn .fa { margin-right: 0; } .post { margin-bottom: 60px; } .post .content .post-title { font-size: 22px; } .post .content .post-title a { color: #444; } .post .content .post-title a:hover { color: #377130; } .post .content .post-entry p { color: #666; } .post .content .post-entry .read-more .fa { margin-left: 5px; position: relative; top: 1px; } .blog-entry .title { margin-bottom: 15px; } .blog-entry .meta { margin-bottom: 15px; } .blog-entry .post-thumb { margin-bottom: 30px; } .blog-entry .custom-list-style { margin-bottom: 30px; } .blog-entry .custom-list-style li { list-style: none; margin-bottom: 5px; } .blog-entry .custom-list-style li .fa { margin-right: 5px; color: #C70700; } .blog-entry p { margin-bottom: 30px; line-height: 1.5; } .blog-entry .post-nav { margin-bottom: 30px; } .blog-entry .post-nav .nav-next { float: right; } .custom-quote { border-color: #8fcc87; font-family: 'Montserrat', sans-serif; font-weight: normal; } .custom-quote p { color: #666; line-height: 1.6; } .custom-quote .fa { color: #C70700; margin-right: 10px; } .custom-quote .source { font-family: 'Lato', arial, sans-serif; } .custom-quote .source .name { color: #444; } .custom-quote .source .title { font-size: 13px; color: #999; } /* ======= Contact ======= */ .contact-main { padding-top: 80px; } .contact-main .title { margin-top: 0; margin-bottom: 30px; font-size: 28px; } .contact-main .intro { margin-bottom: 30px; color: #999; } .contact-main .item { margin-bottom: 60px; } .contact-main .item .item-inner { margin: 30px; padding: 30px 10px; background: #f5f5f5; min-height: 300px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .contact-main .item .icon { position: relative; width: 90px; height: 90px; border: 2px solid #C70700; background: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; display: table; margin: 0 auto; -webkit-transition: -webkit-transform ease-out 0.2s, background 0.3s; -moz-transition: -moz-transform ease-out 0.2s, background 0.3s; transition: transform ease-out 0.2s, background 0.3s; margin-bottom: 30px; } .contact-main .item .icon:hover { background: #C70700; color: #fff; } .contact-main .item .icon:hover .fa, .contact-main .item .icon:hover .pe-icon { color: #fff; -webkit-transform: scale(0.93); -moz-transform: scale(0.93); -ms-transform: scale(0.93); -o-transform: scale(0.93); } .contact-main .item .icon .fa, .contact-main .item .icon .pe-icon { color: #C70700; font-size: 48px; display: table-cell; text-align: center; vertical-align: middle; } .contact-main .item .details { font-size: 18px; } .contact-main .item .details .day { font-size: 13px; color: #999; } .contact-form-section { padding-bottom: 80px; } .contact-form-section .title { margin-bottom: 15px; margin-top: 0; font-size: 18px; } .contact-form-section .intro { max-width: 600px; margin: 0 auto; margin-bottom: 30px; color: #666; } .contact-form-section .form-control { font-size: 16px; color: #999; } .gmap-wrapper { position: relative; padding-bottom: 30%; height: 0; overflow: hidden; } .gmap-wrapper iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; } /* ======= 404 ======= */ .section-404 { padding-top: 80px; padding-bottom: 80px; } .section-404 .title-404 { font-size: 70px; } .section-404 .intro { font-size: 20px; font-weight: bold; } .section-404 .guide { color: #666; } .section-404 .btn-back-home { margin-top: 30px; } /* ======= Configure Style (REMOVE ON YOUR PRODUCTION SITE) ======= */ .config-wrapper { position: absolute; top: 100px; right: 0; z-index: 20; } .config-wrapper-inner { position: relative; } .config-trigger { display: block; position: absolute; left: -36px; width: 36px; height: 36px; background: #2b2b2b; color: #fff; text-align: center; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 4px; -moz-border-radius-topleft: 4px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 4px; border-top-left-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .config-trigger:hover { background: #000; } .config-trigger .fa { font-size: 22px; padding-top: 8px; display: block; color: #fff; } .config-panel { width: 190px; display: none; background: #2b2b2b; color: #fff; padding: 15px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 4px; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 4px; -moz-border-radius-topleft: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 4px; border-top-left-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .config-panel h5.device-title { margin-bottom: 5px; } .config-panel #color-options { margin-bottom: 15px; } .config-panel #color-options li a { display: block; width: 20px; height: 20px; border: 2px solid transparent; } .config-panel #color-options li a:hover { -webkit-opacity: 0.9; -moz-opacity: 0.9; opacity: 0.9; border: 2px solid rgba(255, 255, 255, 0.8); } .config-panel #color-options li.active a { border: 2px solid #fff; } .config-panel #color-options li.theme-1 a { background: #C70700; } .config-panel #color-options li.theme-2 a { background-color: #28A5A8; } .config-panel #color-options li.theme-3 a { background-color: #0e83cd; } .config-panel #color-options li.theme-4 a { background-color: #eea303; } .config-panel #color-options li.theme-5 a { background-color: #34495e; } .config-panel #color-options li.theme-6 a { background-color: #47c9af; } .config-panel #color-options li.theme-7 a { background-color: #A06081; } .config-panel #color-options li.theme-8 a { background-color: #96a94b; } .config-panel #color-options li.theme-9 a { background-color: #f06060; } .config-panel #color-options li.theme-10 a { background-color: #737F97; } .config-panel .close { position: absolute; right: 5px; top: 5px; color: #fff; } .config-panel .close .fa { color: #fff; } /* Extra small devices (phones, less than 768px) */ @media (max-width: 767px) { .wrapper { min-height: inherit; margin-bottom: 0; } .wrapper:after { content: none; } .footer { height: auto; padding-bottom: 0; } .modal.modal-video .modal-dialog, .modal.modal-login .modal-dialog, .modal.modal-signup .modal-dialog, .modal.modal-resetpass .modal-dialog { width: auto; margin-left: 10px; margin-right: 10px; } .navbar-fixed-top { position: static; } .promo .intro .title { font-size: 22px; } .promo .intro .summary { font-size: 18px; } .signup .signup-form .form-group { width: 180px; } .signup .signup-form .form-control { font-size: 13px; } .why .benefits .item .icon .fa, .why .benefits .item .icon .pe-icon { margin-bottom: 30px; } .why .benefits .item .title { text-align: center; } .why .benefits .item .content p { text-align: center; padding: 15px; } .why .testimonials .item { padding: 15px; } .press { padding-bottom: 0; } .press li { margin-bottom: 30px; } .press li a img { max-width: 120px; } .press li.xs-break { clear: left; } .video { padding: 30px 0; } .video .control { position: static; } .footer-col { margin-bottom: 60px; } .footer .bottom-bar .copyright { margin-bottom: 15px; } .footer .bottom-bar .social li { float: left; margin-left: 0; margin-right: 10px; } .features-video { margin-bottom: 30px; } .features { padding: 30px 0; } .features .item { padding: 15px 0; margin-bottom: 0; } .features .item .content { padding: 30px; } .contact-main .item { margin-bottom: 15px; } .contact-main .item.last { margin-bottom: 60px; } .contact-main .item .item-inner { min-height: inherit; } .header .main-nav .nav .dropdown-menu:before { display: none; } .header .main-nav .nav .dropdown-menu { border: none; } } /* Small devices (tablets, 768px and up) */ @media (min-width: 768px) { .wrapper { min-height: inherit; margin-bottom: 0; } .wrapper:after { content: none; } .footer { height: auto; padding-bottom: 0; } .footer .bottom-bar .social li { float: right; } .footer-col-inner { margin-bottom: 15px; } .navbar-fixed-top { position: static; } .header h1.logo { float: none !important; text-align: center; } .main-nav { float: none !important; } .main-nav .navbar-collapse { float: none; text-align: center; } .main-nav .navbar-collapse .nav { margin: 0 auto; float: none; } .navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; } .why .benefits .item .icon .fa, .why .benefits .item .icon .pe-icon { margin-bottom: 30px; } .why .benefits .item { padding: 15px; } .why .testimonials .item { padding: 15px; } .press { padding-bottom: 0; } .press li { margin-bottom: 30px; } .press li a img { max-width: 140px; } .press li.break { clear: left; } .price-plan .item .heading .label { padding: 5px; right: 10px; font-size: 11px; } .contact-main .item { margin-bottom: 15px; } .contact-main .item.last { margin-bottom: 60px; } .contact-main .item .item-inner { min-height: inherit; } .video .summary { max-width: 320px; } } /* Medium devices (desktops, 992px and up) */ @media (min-width: 992px) { .navbar-fixed-top { position: fixed; top: 0; } .main-nav { float: right !important; } .header h1.logo { float: left !important; text-align: left; } .main-nav { float: right !important; } .main-nav .navbar-collapse { float: left; text-align: left; } .main-nav .navbar-collapse .nav { margin: inherit; float: left; } .press { padding-bottom: 30px; } .press li { margin-bottom: 0; } .press li.break { clear: none; } .press li a img { max-width: 160px; } .price-plan .item .heading .label { padding: 5px 10px; right: 15px; font-size: 12px; } .contact-main .item { margin-bottom: 30px; } .contact-main .item .item-inner { min-height: 300px; } .video .summary { max-width: 360px; } /* Sticky Footer */ html, body { height: 100%; } .wrapper { min-height: 100%; margin-bottom: -296px; /* equal to footer height */ } .wrapper:after { content: ""; display: block; height: 296px; /* must be the same height as footer */ } .footer { /*height: 296px;*/ /* must be the same height as footer */ } } /* Large devices (large desktops, 1200px and up) */ 全免费一级午夜毛片