//color & bg
@body_bg:url(../images/body_bg.gif);
@head_bg:url(../images/body_bg.gif);
@bg_dark:url(../images/head_bg.gif);
@bg_foot:url(../images/foot_bg.gif);
@page_pre:url(../images/pre.png) center center no-repeat;
@page_top:url(../images/top.png) center center no-repeat;
@page_next:url(../images/next.png) center center no-repeat;
@news_c:#847EAC;
@news_top_c:#E8E8E8;
@news_thema_c:#BCBCBC;
@news_latest_c:#EFEBEB;
@events_c:#DEB84F;
@events_top_c:#F3F2DA;
@events_thema_c:#C7BBA3;
@project_c:#80A596;
@project_title_c:#5E6860;
@project_text_c:#6D8872;
@project_main_c:#F5F8F1;
@gallery_c:#99CCCC;
@gallery_title_c:#669999;
@gallery_main_c:#DEDEDE;
@figure_c:#CC9999;
@figure_title_c:#996666;
@figure_main_c:#FBFAFA;
@figure_right_c:#EFECE9;
@about_c:#993333;
@about_main:#FCF7F7;
@text_c:#7F7F7F;
@context_c:#333;
@more_c:#807F94;
@user_c:#8ABC42;
//img
@wrap_w:852px;
@top:280px;
@col_w:282px;
@col_w2:282px*2 + 2px;
@img_w:240px;
@img_h:150px;
@img_top_w:520px;
@img_top_h:325px;
@img_thema:90px;
//line
@line_s:1px solid #999;
@line:1px dotted #888;
@line_one_bottom:1px dotted #fff;
@line_z:-1;
@nav_z:100;
.line{border-left: @line;border-right: @line;}
//shadow
@shadow:0px 3px 2px rgba(0,0,0,0.4);
@p_line:18px;
@p_height:18px;
body{
  background: @body_bg;
}
p{text-align: justify;}
.btn{
  background: #666;
  color: #fff;
  display: inline-block;
  line-height: 22px;
  height: 26px;
  padding: 0 15px;
  border: 1px solid #222;
  cursor: pointer;
  &:hover{
    background: #888;
    border-color: #444;
  }
}
.login_input{width: 120px;}
.clear{
  clear:both;
  height: 0px;
  line-height: 0px;
  width: 100%;
  font-size: 0px;
}//清浮动
.context{
    line-height: 1.8em;
    font-size: 12px;
    margin-top: 20px;
    padding-bottom: 50px;
    min-height:718px;
    h1,h2,h3,h4{font-weight: bold;}
    h1{font-size: 18px;}
    h2{font-size: 16px;}
    h3{font-size: 14px;}
    h4{font-size: 12px;}
    b,strong{font-weight: bold;}
    em,i{font-style: italic;}
    p{
    color:@context_c ;
    line-height: 20px;
    margin: 10px 0;
    }
    img{
    max-width: @col_w2 - 41px;
    *width:@col_w2 - 41px;
    margin: 0 auto;
    margin: 10px 0;
    display: block;
    overflow: hidden;
    }
    &.project{
    min-height: 86px;
    padding:10px 20px;
    }
    &.about{
    min-height: 100px;
    }
}//编辑器内容
.label{
  background: @body_bg;
  border-bottom: 1px solid #eee;
  padding:10px 0px;
  li{
    float: left;
  }
  li a{
    display: block;
    height: 16px;
    line-height: 16px;
    padding: 0 7px;
    color: @text_c;
    border-right: 1px solid @text_c;
  }
  .label01{float: left;width:220px ;}
  .label02{float: right;width: 410px;}
  select{margin-left: 10px;color: @text_c;float: left;}
}//分类标签
.jiathis_style{
  position: absolute;
  top: 175px;
  width: 280px;
}
.page{
  .col{
    height: @col_w - 60px;
    position:relative;
    a{
      display: block;
      width:@col_w;
      height: @col_w - 60px;
      &.page_first{display: none;}
      &.page_last{display: none;}
    }
    &.left a{background: @page_pre;}
    &.middle a{background: @page_top;}
    &.right a{background: @page_next;}
  }
}//分页
.ht{
  @title_h:44px;
  height: @title_h;
  width: @wrap_w - 20px;
  padding: 0 10px;
  h2{
    float: left;
    text-indent:10px;
    line-height: @title_h;
    height: @title_h;
    border-left: 6px solid #fff;
    b{font-size: 20px; color: #fff;margin-right: 3px;font-weight: bold;}
    span{font-size: 15px;color: #fff;font-weight: bold;}
  }
  p{
    float: right;
    height: @title_h -10px;
    width: 300px;
    padding-top:8px;
    span{
      color: #fff;
      display: block;
      float: right;
      text-align: right;
      line-height: 15px;
      font-size: 11px;
    }
    a{
      display: block;
      float: right;
      color: #fff;
      padding: 6px 10px;
      border: 1px solid #fff;
      font-size: 15px;
      font-weight: bold;
      margin-left: 8px;
    }
  }
  &.news{
    background-color: @news_c;
    a{background-color:saturate(lighten(@news_c,10%),10%) ;}
  }
  &.events{
    background-color: @events_c;
    a{background-color:saturate(lighten(@events_c,10%),10%) ;}
  }
  &.project{
    background-color: @project_c;
    a{background-color:saturate(lighten(@project_c,10%),10%) ;}
  }
  &.gallery{
    background-color: @gallery_c;
    p{width:600px;}
    a{background-color:saturate(lighten(@gallery_c,10%),10%) ;}
  }
  &.figure{
    background-color: @figure_c;
    a{background-color:saturate(lighten(@figure_c,10%),10%) ;}
  }
  &.about{
    background-color: @about_c;
    a{background-color:saturate(lighten(@about_c,10%),10%) ;}
  }
  &.user{
    background-color: @user_c;
    a{background-color:saturate(lighten(@user_c,10%),10%) ;}
  }
}//头标题
.lt{
  font-size: 15px;
  line-height: 30px;
  font-weight: bolder;
  height: 30px;
  color: #fff;
  text-indent: 20px;
  &.news{background: @news_c;}
  &.events{background: @events_c;}
  &.project{background: @project_title_c;}
  &.gallery{background: @gallery_title_c;margin-top: 20px;}
  &.figure{
    background: @figure_title_c;
    margin-top: 1px;
    &.grey{
      background: @figure_right_c;
      color: #333;
    }
  }
}//最新项目标题
.post_comment{
  textarea{
    height: 100px;
    resize: none;
    margin-top: 15px;
    width: @col_w2 - 42px;
  }
}//评论发布
.latest_comment{
  ol{
    li{
      padding: 10px 0;
      border-bottom:1px dashed #aaa;
      p{
        em{color: @text_c; font-style: italic;}
        b{text-decoration: underline;margin: 0 5px;}
        span{color: @text_c;}
      }
    }
  }
}//评论展示
.rt{
  margin-left: 20px;
  font-size: 14px;
  line-height: 22px;
  text-indent: 10px;
  border-left: 6px solid;
  &.news{border-color: @news_c; margin-top: 30px;}
  &.events{border-color: @events_c; margin-top: 30px;}
  &.project{
    display: block;
    border-color: @project_c;
    padding: 3px 0;
    font-size: 12px;
  }
  &.gallery{border-color: @gallery_c;margin-top: 30px;}
  &.figure{border-color: @figure_c;margin-top: 30px;}
  &.about{
    border-color: @about_c;
    margin-top: 30px;
    font-weight: bold;
    margin-left: 0px;
  }
  &.user{
    border-color: @user_c;
    font-weight: bold;
  }
}//相关项目标题
.p_nav{
  li{
    padding: 15px 0;
    border-top: @line;
    a{
      display: block;
      border-left: 6px solid;
      font-size: 14px;
      font-weight: bolder;
      line-height: 20px;
      padding-left: 8px;
      margin-left: 10px;
    }
  }
  &.project{
    .cur{background:lighten(@project_c,20%) ;}
    a{border-color: @project_c;}
  }
  &.about{
    .cur{background:lighten(@about_c,20%) ;}
    a{border-color: @about_c;}
  }
}//project菜单
.qa_title{
  &.project{
    position: relative;
    background: @project_title_c;
    height: 38px;
    b{
      font-size:18px ;
      color: #fff;
      font-weight: bold;
      position: absolute;
      right: 20px;
      top:5px;
    }
    span{
      color: #CCFFCC;
      font-size: 14px;
      position: absolute;
      right: 25px;
      top: 18px;
    }
  }
}
.qa{
  border-bottom: @line_one_bottom;
  padding: 10px 20px;
  .question{
    line-height: @p_height;
    b{font-size: 15px;margin-right: 15px;}
  }
  .answer{
    line-height: @p_height;
    margin-top: 5px;
    color:@project_text_c;
    b{font-size: 15px;margin-right: 15px;}
  }
}
.menu{
  padding: 20px;
  li{
    font-size: 14px;
    margin: 10px 0;
    height: @p_height;
    b{
      display: inline-block;
      font-weight: bold;
      color: #fff;
      font-size: 22px;
      line-height: 28px;
      background: @text_c;
      padding: 0 2px;
      line-height: @p_height;
      vertical-align: middle;
      border:1px solid #fff;
    }
  }
}
.more{
  color: @text_c;
  display: inline-block;
  padding: 2px 5px;
  font-weight: bold;
  border: @line_s;
}//更多
.more_wrap{
  padding-right: 10px;
  padding-top: 10px;
  padding-bottom:5px ;
  text-align: right;
  a{.more;}
}//更多容器
.col{
  float: left;
  width: @col_w;
  &.middle{.line}
  &.thema{
    &.events{background: @events_thema_c;min-height: 1069px;}
    &.news{background: @news_thema_c;min-height: 1021px;}
  }
  &.figure{
    background: @figure_right_c;
    min-height: 1320px;
    width: @col_w + 2px;
  }
  &.about{background: #fcfcfc;min-height: 800px;}
}//单列宽
.col2{
  width:@col_w2;
  float: left;
  &.figure{
    background: @figure_main_c;
    width: @col_w2;
    border-right: @line;
    min-height: 1324px;
  }
  &.about{
    float: right;
    width:@col_w2+2px ;
    min-height: 380px;
    border-left: @line;
    background: @about_main;
    img{width: 520px;display: block;margin: 0 auto;margin-top: 30px;}
    .about_con{
      padding: 30px 25px;
    }
  }
  &.project{
    background: @project_main_c;
    float: right;
    width:@col_w2 + 2px;
    border-left: @line;
    background: @about_main;
  }
  &.events{
    background: @events_top_c;
    width:@col_w2 + 4px;
  }
  &.news{background: @news_top_c;width:@col_w2 + 4px;}
  &.gallery{background: @gallery_main_c;width:@col_w2 + 4px;}
  &.desn{
    border-right: @line;
    width:@col_w2 - 40px;
    padding: 35px 20px;
    ul{
      margin: 10px 0;
      li{
        height: @p_height;
        line-height: @p_height;
      }
    }
    h6{
      color: @text_c;
      margin: 10px 0;
    }
    h2{
      font-size: 20px;
      line-height: 30px;
      margin-bottom: 20px;
      color: #444;
      font-weight: bold;
    }
    p{margin-top: 10px;}
    .app a{
      display: inline-block;
      background: @text_c;
      color: #fff;
      padding: 5px 20px;
      margin-right: 5px;
      border: 1px solid #000;
    }
    .jiathis{margin: 10px 0;}
    &.events{background: @events_top_c;}
    &.news{background: @news_top_c;}
    &.gallery{background: @gallery_main_c;}
  }
}//双列宽
.one{
  padding: 20px;
  border: 1px solid transparent;
  .one_hover{
    position: absolute;
    top: 0;
    left: 0;
  }
  .one_label{
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    height: 20px;
    width: 20px;
    &.news{ background: url("../images/news_label.png") no-repeat;}
    &.events{ background: url("../images/events_label.png") no-repeat;}
    &.gallery{ background: url("../images/gallery_label.png") no-repeat;}
    &.figure{ background: url("../images/figure_label.png") no-repeat;}
  }
  .one_img{
    width: @img_w;
    height:@img_h ;
    position: relative;
    border: 1px solid #555;
    text-align: center;
    overflow: hidden;
    .img_hover{
      position: absolute;
      opacity: .7;
      top:0;
      left: 0;
      width: @img_w;
      height: @img_h;
    }
    &.news{
      border: 1px solid @news_c;
      background: url("../images/news_img.png") center center no-repeat;
      .img_hover{
        background:@news_c url("../images/hover_img.png") center center no-repeat;
      }
    }
    &.events{
      border: 1px solid @events_c;
      background: url("../images/events_img.png") center center no-repeat;
      .img_hover{
        background:@events_c url("../images/hover_img.png") center center no-repeat;
      }
    }
    &.figure{
      border: 1px solid @figure_c;
      background: url("../images/figure_img.png") center center no-repeat;
      .img_hover{
        background:@figure_c url("../images/hover_img.png") center center no-repeat;
      }
    }
    &.gallery{
      border: 1px solid @gallery_c;
      background: url("../images/gallery_img.png") center center no-repeat;
      .img_hover{
        background:@gallery_c url("../images/hover_img.png") center center no-repeat;
      }
    }
    img{display: block;width: @img_w;overflow: hidden;}
  }
  h6{
    color:@text_c ;
    text-align: right;
    font-size: 10px;
    line-height: 1.5em;
    margin: 5px 0;
    font-weight: normal;
  }
  h3{
    font-size: 18px;
    white-space: nowrap;
    font-weight: 900;
    line-height: 26px;
    height: 26px;
    left: -3px;
    position: relative;
    b{color: @text_c;margin-right: 6px;font-size: 16px;}
    a{
      color: #333;
      font-size: 16px;
      line-height: 1.4em;
    }
  }
  p{
    color: @text_c;
    line-height: @p_height;
    text-indent: 2em;
    height: @p_height*3;
    overflow: hidden;
    margin-top: 10px;
    text-overflow: ellipsis;
    &.index_news{height:  @p_height*6;}
  }
  ul{
    margin: 10px 0;
    li{
      line-height: @p_height;
      height: @p_height;
      margin: 3px 0;
    }
  }
  &.index{position: relative;}
  &.top{
    padding:20px;
    border-bottom:none;
    height: @img_top_h;
    .one_con{
      width: @col_w - 10px;
      float: right;
      p{
        overflow: hidden;
      }
    }
    .one_img{
      float: left;
      width: @img_top_w;
      height: @img_top_h;
      img{width:@img_top_w ;display: block;}
    }
    &.news{
      background: @news_top_c;
      p{height: @p_height*12;}
    }
    &.events{
      background: @events_top_c;
      p{height: @p_height*7;}
    }
    &.figure{
      height: auto;
      border-bottom:@line_one_bottom;
      p{height: @p_height*3;}
    }
  }
  &.thema{
    min-height: 275px;
    padding: 20px;
    border-bottom: none;
    color: #fff;
    h3{
      border-bottom:1px solid #fff;
      padding-bottom:5px;
      font-size: 16px;
      height:25px;
      b{
        display: inline-block;
        padding: 0px 5px;
        height: 20px;
        color: #fff;
        font-weight: bold;
        border: 1px solid #fff;
      }
      .more{
        border-color: #fff;
        color: #fff;
        font-size: 12px;
        line-height: 12px;
      }
    }
    p{
      color: #fff;
    }
    .article{
      height:@p_height;
      margin: 10px 0;
      overflow:hidden;
      a{
        line-height: @p_height;
        color: #fff;
        font-weight: bold;
      }
      span{margin-right: 5px;}
    }
    .thema_top{
      .thema_top_img{
        width:@img_thema;
        height:@img_thema;
        overflow:hidden;
        float: left;
        margin-right: 6px;
        img{
          width: @img_thema;
          display: block;
        }
      }
      p{height: @p_height*5;margin-top: 0;}
    }
  }
  &.latest{
    width: @col_w - 40px;
    float: left;
    padding: 25px 20px;
  }
  &.list{
    padding: 20px;
    width: @col_w - 40px;
    float: left;
    p{height: @p_height*4;}
  }
  &.news.nopic{
    p{
      height: @p_height * 6;
    }
  }
  &.group{
    .group_con{
      float: right;
      width: @col_w - 20px;
      p{height: @p_height*5;}
    }
    .one_img{
      float: left;
    }
  }
}//标题，图片，概要组
.banner{
  position:relative;
  .banner_title{
    position: absolute;
    bottom:0px;
    width:848px ;
    color: #fff;
    background: #000000;
    opacity:0.5;
    p{
      line-height: @p_height;
      font-size: 11px;
      padding: 20px;
    }
  }
  img{display: block;}
}
.user_wrap{
  padding: 30px;
  background: lighten(@user_c,45%);
  font-size: 14px;
  .center{
    width: 500px;
    padding: 30px;
    &.search{
      width:720px;
      li{
        span{float: right;}
      }
    }
    li{
      padding: 7px 0;
      &.last{padding-left: 100px;}
      label{
        display: inline-block;
        width: 100px;
        text-align: right;
      }
      em{
        color: #999;
        margin-left: 10px;
      }
    }
  }
}
#line{
  z-index: @line_z;
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  #line_main{
    width: 848px;
    border-left: @line;
    border-right: @line;
    margin-left: 87px;
    height: 100%;
    .col{
      padding: 0;
      width: 0px;
      margin-left: @col_w;
      border-right:@line;
      height: 100%;
    }
  }
}//虚线
#head{
  background: @head_bg;
  height: 302px;
  #head_main{
    height: 290px;
    position: relative;
    margin: 0 auto;
    width: 954px;
    .head_right{
      position: absolute;
      bottom: 110px;
      right: 0;
      height:60px;
      li{
        height: 26px;
        text-align: right;
        line-height: 16px;
        margin-right:5px;
        a{
          color: #666;
          span{
            color: #666;
            vertical-align: middle;
            display: inline-block;
            width: 88px;
            text-align: left;
            margin-left: 4px;

          }
          img{
            vertical-align: middle;
            display: inline-block;
          }
        }
      }
    }
    .head_middle{
      border: none;
      text-align: center;
      display: block;
      margin: 0 auto;
      padding-top: 30px;
      height: 260px;
    }
  }
}//头
#nav{
  position: absolute;
  background: @bg_dark;
  top: 222px;
  left: 0px;
  width: 100%;
  #nav_main{
    width: 954px;
    padding: 8px 12px;
    height: 64px;
    margin: 0 auto;
    background: url("../images/nav_main.png") 0 8px no-repeat;
    li.search{
      width: 200px;
      padding-top: 8px;
      border-right: none;
      padding-left:10px;
      input#search_text{
        width: 100px;
        border: 2px solid #aaa;
      }
      input#search_submit{
        border: 2px solid #aaa;
        padding: 0 5px;
        *padding: 0;
        line-height: 18px;
        color: #aaa;
        background: #fff;
        font-weight: bold;
        &:hover{
          background: #aaa;
          color: #fff;
        }
      }
    }
    li{
      float: left;
      margin-top: 13px;
      border-right: 1px solid #ddd;
      a{
        height: 37px;
        width: 104px;
        position: relative;
        margin-left: 1px;
        display:block;
        border-bottom-color: #666;
        border-bottom: 5px solid #666;
        span{
          display: block;
          font-size: 15px;
          font-weight: bold;
          color: #666;
          letter-spacing: 1px;
          text-align: center;
          height: 36px;
          line-height: 36px;
        }
        b{
          display: none;
          font-size: 17px;
          text-align: right;
          font-family: "Helvetica Neue",Arial,"sans serif";
          font-weight: bold;
          position: absolute;
          right: 0;
          bottom: -3px;
        }
        &:hover{
          text-decoration:none ;
          &.index{
            border-bottom-color: #000;
            color: #666;
            border-bottom: 5px solid ;
            b{display: block;}
          }
          &.news{
            border-bottom-color: @news_c;
            color: @news_c;
            border-bottom: 5px solid ;
            b{display: block;}
          }
          &.events{
            border-bottom-color: @events_c;
            color: @events_c;
            border-bottom: 5px solid ;
            b{display: block;}
          }
          &.project{
            border-bottom-color:@project_c;
            color: @project_c;
            border-bottom: 5px solid ;
            b{display: block;}
          }
          &.gallery{
            border-bottom-color: @gallery_c;
            color: @gallery_c;
            border-bottom: 5px solid ;
            b{display: block;}
          }
          &.figure{
            border-bottom-color: @figure_c;
            color: @figure_c;
            border-bottom: 5px solid ;
            b{display: block;}
          }
          &.about{
            border-bottom-color: @about_c;
            color: @about_c;
            border-bottom: 5px solid ;
            b{display: block;}
          }
        }
      }
    }
  }
}//主导航
#wrap{
  position: relative;
  width: @wrap_w;
  margin: 0 auto;
  background:@body_bg ;
  .line;
}//中间容器
.holder{
  width: @wrap_w;
  height: 46px;
  .line;
  margin: 0 auto;
  .col{
    height: 46px;
  }
}
#foot{
  background:@bg_foot;
  border-top:1px solid #fff;
  #foot_main{
    .line;
    width: @wrap_w;
    margin: 0 auto;
    .col{
      height: 100px;
      padding:20px 30px;
      width: @col_w - 60px;
      &.middle{
        text-align: center;
        padding-top: 36px;
      }
      p{
        line-height: 18px;
        a{
          color: #333;
        }
      }
      h4{
        margin-bottom: 10px;
        font-weight: bold;
      }
    }
  }
}//底部
.foot_hover{

}
#copy{
  background: #000;
  color: #ddd;
  padding: 10px 0;
  text-align: center;
  p{text-align: center;}
}//版权信息
.all{
  width: 100%;
  margin: 0 auto;
}