/*!
 * SIMPLE & FLAT - Agency Bootstrap Theme
 *
 * Copyright 2013 
 * Licensed under the Apache License v2.0
 * http://www.apache.org/licenses/LICENSE-2.0
 * Created by: Carlos Alvarez
 * URL: http://www.basicoh.com
 * Designed and built based on Twitter Bootstrap.
 */

/********** MAIN CONFIGURATION **********/
body{position:relative;background-color:#e8e8e8;font-family:'微软雅黑','Open Sans Condensed',arial,helvetica,sans-serif;font-size:14px;color:#000;padding-top: 60px;}
h2,h3,h4,h5,h6{font-family:'Open Sans Condensed',sans-serif;color:#666;}
.pure{
    height:300px;
}
.debuz-color{
    color:#00b0f0;
}
.backgdfix {background:url(../img/banner.jpg) no-repeat center top;position:fixed;width:100%;
    min-height: 450px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1
}
h1 {
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight:500;
    font-size:60px;
    margin-bottom:25px;
}

h2 {
    font-weight:400;
    margin-bottom:15px;
}
h3{margin-bottom:1px}
h5{text-align:center}
p{
    margin-bottom:20px;
    font-size:14px;
}
a{text-decoration:none}
a:hover{text-decoration:none}
h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{margin-left:12px;font-size:15px;font-style:italic;color:#000;line-height:5px;letter-spacing:0}


/********** BOOTSTRAP MODIFICATIONS **********/
/* Navbar Tweaks */
.navbar-inverse .navbar-inner {
    /*background-color: #00b0f0;*/
    background-repeat: repeat-x;
    border-color: transparent;
    background-image: none;
}

.navbar-inverse .brand,
.navbar-inverse .nav > li > a {
    color: #fff;
    text-shadow: none;
    text-transform:uppercase;
    font-weight:500;
}

.navbar-inverse .brand:hover,
.navbar-inverse .nav > li > a:hover,
.navbar-inverse .brand:focus,
.navbar-inverse .nav > li > a:focus {
    color: #ffffff;
}

.navbar-inverse .brand {
    color: #fff;
}

.navbar-inverse .navbar-text {
    color: #999999;
}

.navbar-inverse .nav > li > a:focus,
.navbar-inverse .nav > li > a:hover {
    color: #ffffff;
    background-color: transparent;
}

.navbar-inverse .nav .active > a,
.navbar-inverse .nav .active > a:hover,
.navbar-inverse .nav .active > a:focus {
    color: #fff;
    background-color: transparent;
}

.navbar-inverse .navbar-link {
    color: #999999;
}

.navbar-inverse .navbar-link:hover,
.navbar-inverse .navbar-link:focus {
    color: #ffffff;
}

.navbar-fixed-top .navbar-inner,
.navbar-static-top .navbar-inner {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;

}
.navbar-inner {border:none;}
.navbar .nav > .active > a,
.navbar .nav > .active > a:hover,
.navbar .nav > .active > a:focus {
    color: #999;
    text-decoration: none;
    background-color: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    /*background-color: #63CEF5!important;*/
    border-radius:0!important;
    /*color: #22609d;*/
}
.navbar-inverse .nav-collapse .nav > li > a:hover {
    /*background-color: #63CEF5!important;*/
    border-radius:0!important;
}

/* HR Tweak */
hr {
    margin: 20px 0;
    border: 0;
    border-top: 1px dashed #eeeeee;
    border-bottom: 1px dashed #bfbfbf;
}


/********** HEADER WRAP **********/
#headerwrap {
    width: 100%;
    min-height: 450px;
    margin-top: -100px;
    padding-top:160px;
    text-align:center;
    position:relative;
    overflow:hidden;
}

#headerwrap h1 {
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight:400;
    font-size:70px;
    color:#fff;
    margin-bottom:25px;
}

.header-wrap {background:#191919 url(../img/sonos_banner2.jpg) no-repeat center top;height:570px;
    text-align:center;
    position:relative;
    margin-top:-20px;
}
.header-wrap {}
.t-h2 {text-align: left;margin-left:5px;border-left: 10px #00b0f0 solid;padding-left: 10px;font-size:24px;}
.trophy-wrap .span2 {width:200px;}
/********** WELCOME WRAP **********/
#welcomewrap {
    width: 100%;
    padding-bottom:15px;
    padding-top:15px;
    background:#fafafa;
    color:#424242;
}

#welcomewrap .container {
    padding:0px;
}

#welcomewrap h2 {}

.mod-box {padding:10px;background-color:#f1f1f1;margin-bottom:10px;}
.notice {}
.notice h4 {font-weight:bold;color:#911c1c;}
.notice li {}
.notice ol>li {margin-bottom:10px;}
.notice ol>li>ul {margin-top:5px;}
.notice ul>li {margin-bottom:5px;}
.mod-logo {padding:20px 20px 10px;}
.mod-logo img {padding-bottom:30px;border-bottom: 1px solid #ddd;}
.mod-box-left {}
/********** SERVICE WRAP **********/
#bbsSection {background:#fff;}
#bbsWrap {
    display:block;
    background: #fff;padding-bottom:30px;
}

#bbsWrap h2 {}
h2.topic_title {font-size: 16px;line-height: 150%;font-weight: normal;margin:0;}
.topic:hover {background: #f6f6f6;}
a.startbbs:link, a.startbbs:visited, a.startbbs:active {color: #778087;}
.topic .topic-meta {font-size: 12px;margin-top: 5px;}
.badge-info {background-color: #AAB0C6;color: white;}
.badge-info a {color: white;}
a.node:link, a.node:visited, a.node:active {
    background-color: #F5F5F5;
    color: #999999;
    display: inline-block;
    font-size: 12px;
    line-height: 10px;
    padding: 4px 4px 3px;
    text-decoration: none;
}
.text-muted {margin:0 5px;color:#444;}
#topics_index {box-shadow:0 0 1px #aaa;}
#bbsWrap .box .cell,#bbsWrap .box .box-header {padding: 10px;border-bottom: 1px solid #F0F0F0;}
#bbsWrap .medium_avatar {border-radius: 3px;width:48px;height:48px;}
#bbsWrap .item_title {padding-left: 58px;}
#getmore {text-align:center;line-height:36px;width:100%;display:block;background-color:#eee;}
.profile_link {margin-left:5px;}
.movie-wrap {margin:0 10px;}

#sonos_about,#sonos_products {background-color:#e8e8e8;}
#sonos_about .box-ctt {padding:10px;}
/********** SERVICE WRAP **********/
#servicewrap {
    display:block;
    text-align:center;
}

#servicewrap h2 {
    text-align:left;
    margin-left:5px;
    border-left:10px #00b0f0 solid;
    padding-left:3px;
}

#servicewrap p {
    text-align:left;
}

/********** EXAMPLE SECTION **********/
#example {
    width:100%;
    background:#fff;
    display:block;
    text-align:center;
    margin-bottom:0px;
    border-top:1px gray solid;
}

/********** ABOUT WRAP **********/
#aboutwrap {
    display:block;
    text-align:center;
}

#aboutwrap h2 {}

#aboutwrap h3 {
    font-family: 'Open Sans Condensed', sans serif;
    font-weight:400;
    font-size:30px;
    color:#00b0f0;
}

#aboutwrap h4 {
}

#aboutwrap p {
    text-align:left;
}

/********** PROJECT WRAP **********/
#projectwrap {
    width: 100%;
    background: url(../img/game-company.png) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;;
    min-height: 800px;
    text-align:center;
}

#projectwrap .boxcolor{
    margin-top:300px;
    clear: both;
    opacity: 1;
    background: #00b0f0;

}

#projectwrap h1 {
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight:500;
    font-size:60px;
    color:#fff;
    padding:20px;
}

/********** PROJECT WRAP 2 **********/
#projectwrap_2 h2 {
    text-align:left;
    margin-left:5px;
    border-left:10px #00b0f0 solid;
    padding-left:3px;
}

#projectwrap_2 h3 {
    font-family: 'Open Sans Condensed', sans serif;
    font-weight:400;
    font-size:30px;
    color:#00b0f0;
    text-align:center;
}

/********** PRICE WRAP **********/
#pricewrap {
    text-align:center;
    display:block;
}

#pricewrap h2 {
    padding:20px;
}

/********** FOOTER WRAP **********/
#footerwrap {
    width: 100%;
    background: #232121;
    padding-bottom: 45px;display:none;
}

#footerwrap h2 {color:#fff;}
#footerwrap h2 .more {font-size:14px;}
#footerwrap p {
    font-family: 'Open Sans Condensed', sans serif;
    font-size:14px;
    line-height:22px;
    color:#8a8888;
    margin-bottom:10px;
    margin:5px;

}

/********** MAP SECTION **********/
#map {
    display:block;
    width:100%;
    margin:0px;
}

/********** MASKS **********/
/* Services Hover */
.mask {
    display:block;
    padding:10px;
    line-height:20px;
}

.mask:hover {
    background-color:#fff;
}

/* Project Image Hover */
.mask2 img {
    margin: 0 auto;
    max-width: 100%;
    display: block;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    opacity: 0.8;
    box-shadow: 1px 1px 10px rgba(0,0,0,0.2);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.mask2 img:hover{
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=99)";
    filter: alpha(opacity=99);
    opacity: 1;
}


/********** FOUNDERS ABOUT DESIGN **********/
.about_item{
    margin:0px 9px 19px 8.33px;
    border-radius:5px;
    min-height:100px;
}


.about_item img{
    border:0px;
    width:100%;
    height:auto;
    border-radius:5px;
}

.about_item p{
    color:#8a8a8a;
    font-size:16px;
    text-align:left;
    margin:5px;
    padding:0px 0px 20px 0px;
}
.notice .about_item {overflow:hidden;}
.notice .box-ctt {padding:10px;}

/********** PROJECTS ITEMS **********/
.project_item{
    margin:0px 9px 19px 8.33px;
    background-color:#fff;
    min-height:100px;
}

.project_item_center{
    width:100%;
    position:relative;
    z-index:1;
}

.project_item_center img{
    border:0px;
    width:100%;
    height:auto;
    border-bottom:1px solid #4b4646;
}

.project_item h3 {
    padding:10px;
}

/********** CLIENTS LIST **********/
.clients {
    text-align:center;
    padding:20px;
}

.clients img{
    padding-bottom:20px;
}

/********** PRICING TABLES **********/
.pricing-table-wrapper {
    margin: 10px 0;
    text-align: center;
}

.pricing-table {
    display:inline-block;
}

.pricing-column {
    list-style:none;
    position:relative;

    -webkit-transition:0.3s;
    -moz-transition:0.3s;
    transition:0.3s;
}

.pricing-column:hover {
    -webkit-box-shadow:0 0 20px 0 rgba(0,0,0,0.4);
    -moz-box-shadow:0 0 20px 0 rgba(0,0,0,0.4);
    box-shadow:0 0 20px 0 rgba(0,0,0,0.4);
    z-index:1;
}

.pricing-column:hover > .pricing-title {
    border-top: 3px solid rgba(236,96,47,0.9);
}

.pricing-column:hover > .pricing-button {
    background-color: #d7d7d7;
}

.pricing-column li {
    white-space:nowrap;
    text-align:center;
    padding:12px;
    background:rgba(0,0,0,0.01);
    border-bottom:1px dotted rgba(0,0,0,0.1);
}

.pricing-column li:nth-child(even) {
    background:#e3e3e3;
}

.pricing-column li.pricing-title {
    font-weight:600;
    border-top: 3px solid rgba(0,0,0,0.6);
    font-size:20px;
}

.pricing-column li.pricing-price {
    color:#ec602f;
    font-size: 200%;
    line-height: 120%;
}

.pricing-column li.pricing-price span {
    font-size:45%;
    line-height:120%;
}

.pricing-column .pricing-button .button {
    margin:0 !important;
    font-size: 18px;
}
.footer {
    margin: 0;
    padding-bottom: 10px;background-color:#fff;
}
.about-links {
    height: 31px;
    line-height: 31px;
    background-color: #333;
    text-align: center;
    color: #5d5d5d;
    font-size: 12px;
}
.about-links a {
    margin: 0 10px;
    color: #fff;
}
.footer-copy {
    text-align: center;
    padding: 20px 0;
    color: #999;
    font-size: 10px;
}
.footer-copy a {
    color: #999;
}
.footer-logo {
    display: inline-block;
    background:url(../img/footer_logo.png) no-repeat;
    width: 52px;
    height: 42px;
    margin: 0 10px;
    text-indent: -9999px;
    overflow: hidden;
    vertical-align: text-bottom;
}

/********** MEDIA QUIERIES **********/

/*
*  浮动框
*  by见天
*  13.04.16
*/
.zzlgn-btn {float:right;cursor:pointer;}
#lgnModal .modal-header {padding:5px 15px;}
#lgnModal .modal-header h3 {margin-top:0;}
.float-box {padding:25px 30px;}
.float-login-box {}
.float-box h4 {text-align:center;font-size:16px;padding:12px 0 18px;border-bottom:1px solid #ddd;margin-top:0;}
.float-box .login-info,
.float-box .control-label,
.float-box .form-horizontal {font-size:12px;}
.float-box .login-info {margin:0 23px 5px;color:#666;}
.float-box .form-horizontal {border-bottom:1px dashed #ddd;padding:0 23px;margin-bottom:12px;}
.float-box .form-horizontal .control-label {width:64px;text-align:left;letter-spacing:0.3em;color:#999;}
.float-box .form-horizontal .controls {margin-left:70px;}
.float-box .help-inline a {color:#999;}
.float-box .form-horizontal .control-group input[type="text"],
.float-box .form-horizontal .control-group input[type="password"] {border-radius:0;width:236px;border-left:1px solid #a6a6a6;border-top:1px solid #a6a6a6;box-shadow:inset 1px 1px 1px #efefef;height:16px;line-height:16px;}
.float-box .control-group {margin-bottom:15px;}
.float-box .control-pwd {margin-bottom:5px;}
.ctl-auto-ipt {color:#999;margin-bottom:5px;}
.ctl-auto-ipt input {border-color:#999;}
.lgn-btn {width:120px;height:32px;background:url(http://www.huxiu.com/static/img/btn_bg.png?data=20130902) no-repeat 0 -252px;position:relative;top:-1px;font-size:12px;color:#fff;text-shadow:0 0 1px #eee;box-shadow:none;border:none;}
.lgn-btn:hover,.lgn-btn:focus {background:url(http://www.huxiu.com/static/img/btn_bg.png?data=20130902) no-repeat 0 -252px;color:#fff;}
.lgn-reg-btn {width:120px;height:32px;line-height:32px;font-size:12px;background:url(http://www.huxiu.com/static/img/btn_bg.png?data=20130902) no-repeat 0 -294px;display:inline-block;text-align:center;color:#fff!important;text-shadow:0 0 1px #eee;margin-left:5px;}
.lgn-btn:hover,
.lgn-reg-btn:hover {color:#fff;}
.login-kj {text-align:center;padding:6px 0;}
.login-kj a {display:inline-block;width:171px;height:38px;line-height:38px;background:url(http://www.huxiu.com/static/img/btn_bg.png?data=20130902) no-repeat -91px -168px;text-indent:-9999px;margin:0 8px;}
.login-kj .qq-lgn {background-position:-91px -210px;}

.img-wrap,.trophy-wrap .about_item {position:relative;}
.trophy-wrap .about_item {cursor:pointer;}
#boxModal .active {background-image:url(../img/favorite_active.png)}
#boxModal .active .btn-wrap {}
.share-wrap {position:absolute;top:10px;right:10px;background:rgba(102,102,102,0.6) url(../img/favorite.png) no-repeat 8px 5px;padding:5px 10px 5px 35px;color:#fff;box-shadow:0 0 1px #666;background-size:18px 18px;cursor:pointer;border-radius:3px;}
.share-wrap .btn-wrap {position:absolute;bottom:-35px;left:50%;margin-left:-50px;width:100px;background:#f60;color:#fff;text-shadow:none;box-sizing:border-box;}
.trophy-wrap .num-wrap {text-align:center;display:block;line-height:24px;color:#666;}
.share-wrap em  {font-style:normal;color:#f90;margin:0 2px;}
.trophy-wrap .num-wrap em {font-style:normal;color:#f60;margin:0 2px;}


.shop-menu {width:100%;text-align:center;line-height:20px;margin-top:-10px;}
.shop-menu p {margin-bottom:5px;}
.shop-menu a {color:#08c;}
.article-wrap em {font-style:normal;font-style: normal;font-size: 12px;color: #999;margin: 0 10px;}
.article-box {box-sizing:border-box;margin-bottom:15px;}
.article-box .a-img {width:220px;height:146px;float:left;}
.article-box .a-img img {width:220px;height:146px;}
.article-box .article-box-ctt {margin-left:230px;}
.article-box h4 {margin:0 0 5px;max-height:40px;overflow:hidden;}
.article-box .box-other {margin-bottom:5px;}
.article-box .article-summary {height:80px;overflow:hidden;}
.article-list-wrap {position:relative;}
.article-list {margin:0;overflow:hidden;}
.article-list2 {position:relative;}

@media (max-width: 979px) {
    #headerwrap {
        margin-top: -60px;
        padding-top:160px;
        min-height: 300px;
    }
    .header-wrap {height:200px;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    .navbar-inverse .nav-collapse .nav > li > a, .navbar-inverse .nav-collapse .dropdown-menu a {color:#eee!important;}
    .modal {width:300px;}
    #showBox .modal-body {min-height:200px;max-height:220px;}
    .float-box {padding:5px;}
    .float-box .form-horizontal {padding:0 15px;}
    .float-box .login-info {margin:0 15px 5px;}
    .float-box .form-horizontal .control-label {float:none;}
    .float-box .form-horizontal .controls {margin-left:0;}
    .float-box .control-group {margin-bottom:0;}
    .form-horizontal input {width:auto;}
    .lgn-btn,.lgn-reg-btn {width:100px;border-radius:5px;}
    .float-box .form-horizontal {padding-bottom:10px;}
    .camp-box-ctt {margin:0;}
    .trophy-wrap .span2 {
        width: auto;
    }
    .article-list {margin-bottom:10px;}
    .article-wrap .art-btn {top:20px;}
    .article-box .a-img {width:100px;height:67px;float:left;}
    .article-box .a-img img {width:100px;height:67px;}
    .article-box .article-box-ctt {margin-left:110px;font-size:12px;}
    .article-box h4 {font-size:14px;}
    .article-box .article-summary {display:none;}
}

