/* =========================================================================================== */

.martop { margin-top:40px; }

/* =========================================================================================== */

.contt { padding:50px 0; overflow:hidden; background:#eee; }
.contt .content { position:relative; width:960px; margin:auto; border:0px solid #f00; }

.contt .content .sidebar { position:absolute; width:200px; overflow:auto; border:0px solid #f00; }
.contt .content .sidebar hr { display:block; margin:15px 20px 15px 0; border:none; border-top:1px dashed #ccc; }
.contt .content .sidebar li a { position:relative; display:block; padding-left:14px; font:19px/40px "微软雅黑" !important; color:#777; transition:all 0.3s ease; }
.contt .content .sidebar li a i { position:absolute; left:0; top:11px; display:block; width:4px; height:19px; background:#ddd; transition:all 0.3s ease; }
.contt .content .sidebar li a:hover { background:#e5e5e5; color:#333; }
.contt .content .sidebar li a:hover i { background:#f66; height:100%; top:0; }
.contt .content .sidebar li a.active i { background:#f66; }
.contt .content .sidebar li a span { font:12px/18px "微软雅黑"; color:#aaa; margin-left:11px; }

.contt .content .detail { width:730px; min-height:500px; padding:1px 0 0px 20px; margin-left:200px; border-left:1px solid #ddd; }
.contt .content .detail h2{ display:inline-block; padding:0 12px; margin-bottom:0px; font:18px/35px "微软雅黑"; color:#19763E; background:#53BF6B; border-left:4px solid #19763E; border-radius:5px; text-shadow:0 1px 1px rgba(255,255,255,0.4);}
.contt .content .detail p { font:16px/1.5em "微软雅黑"; color:#555; margin:1em 0; }
.contt .content .detail p a { font:16px/1.5em "微软雅黑"; color:#387DB8; margin:0 5px; }
.contt .content .detail p a:hover { border-bottom:1px solid #387DB8; }
.contt .content .detail img { max-width:100%; }
.contt .content .detail hr { border:none; border-top:1px dashed #aaa; margin:40px 0; }

.contt .content .detail .latest { position:relative; background:#fff; }
.contt .content .detail .latest .intro { position:relative; height:300px; background:#53bf6b; border:0px solid #f00; }
.contt .content .detail .latest .intro > img { position:absolute; left:3%;  top:45px; width:35%; }
.contt .content .detail .latest .intro > div { position:absolute; right:3%; top:40px; width:55%; border:0px solid #f00; }
.contt .content .detail .latest .intro > div .title { display:block; width:140px; }
.contt .content .detail .latest .intro > div p  { font:15px/1.4em "微软雅黑"; color:#3c6946; margin:1em 0; }
.contt .content .detail .latest .intro > div p a { font:14px/1.4em "微软雅黑"; color:#3c6946; }
.contt .content .detail .latest .intro > div p a:hover { color:#26472d; border-bottom:1px solid #26472d; }
.contt .content .detail .latest .intro > div .btn { position:absolute; right:0; bottom:8px; font:13px/30px "微软雅黑"; color:#3c6946; text-align:center; display:block; width:100px; background:url(../image/bg-white20.png); border-radius:8px; transition:all 0.3s ease; }
.contt .content .detail .latest .intro > div .btn:hover { background:#fff; color:#2DB245; }

.contt .content .detail .latest .functions { padding:20px; border:0px solid #ddd; }

.contt .content .detail .versions { position:relative; margin:50px 0; border:0px solid #f00; }

.contt .content .detail .logs { border:0px solid #f00; }
.contt .content .detail .logs h3 { font:600 16px/1.5em "微软雅黑"; color:#555; margin:1em 0; }
.contt .content .detail .logs h4 { font:normal 16px/1.5em "微软雅黑"; color:#555; margin:1.4em 0 0.3em; }
.contt .content .detail .logs p { font:15px/1.5em "微软雅黑"; color:#555; margin:1em 0; }
.contt .content .detail .logs ul li { font:15px/1.5em "微软雅黑"; color:#555; list-style:inside square; }

/* ================================================================================================================ */

@media (min-width:1200px){
  
  #header .wrap { width:1200px; }
  
  .contt .content{ width:1200px; }
  .contt .content .sidebar { width:250px; }
  .contt .content .sidebar li a { padding-left:20px; }
  .contt .content .sidebar li a i { width:6px }
  
  .contt .content .detail { width:900px; padding-left:50px; margin-left:250px; }
  .contt .content .detail .latest .intro > img { left:5%;  width:35%; }
  .contt .content .detail .latest .intro > div { right:5%; width:50%; }
  .contt .content .detail .latest .intro > div .title { width:170px; }
  
  .martop { margin-top:60px; }
}

/* ================================================================================================================ */

.code{ position:relative; padding:5px; margin:18px 0; overflow:hidden; background:#fff; border:1px solid #ddd; border-radius:1px;}
.code .code_contt p i{ font-style:normal; margin:0 3px;}

.code_index{ position:absolute; left:0; top:5px; width:30px; border-right:1px solid #390;}
.code_index p{ font:12px/20px "Courier New, monospace" !important; text-indent:0; text-align:center; padding:2px; margin:0 !important; }
.code_index p.mouseover{ color:#900; transition:all 0.3s ease-in-out 0s; }

.code_contt{ margin-left:30px; border:0px solid #f00;}
.code_contt p{ font:14px/16px "Courier New" !important; text-indent:0; word-break:break-all; margin:0 !important; padding:4px 8px; border:0px solid #f00; border-radius:2px; transition:all 0.4s ease-in-out 0s;}
.code_contt p.mouseover{ background-color:#f7f7f7; transition:all 0.2s ease-in-out 0s; }

.code_contt p.indent_0em{ padding-left:0;}
.code_contt p.indent_1em{ padding-left:12px;}
.code_contt p.indent_2em{ padding-left:18px;}
.code_contt p.indent_3em{ padding-left:24px;}
.code_contt p.indent_4em{ padding-left:30px;}
.code_contt p.indent_5em{ padding-left:36px;}
.code_contt p.indent_6em{ padding-left:48px;}
.code_contt p.indent_8em{ padding-left:72px;}


.code_contt span.comment{ position:absolute; color:#aaa;}
.code_contt span.comment_pos50{ position:absolute; left:50%; color:#aaa;}


.code_color .code_contt p{ color:#009 !important;}
.code_color .code_contt p i{ font-style:normal; color:#2c1715; margin:0 3px;}
.code_color .code_contt p.style  b{ color:#390;}
.code_color .code_contt p.script b{ color:#900;}
.code_color .code_contt p.form   b{ color:#f70;}
.code_color .code_contt p.anchor b{ color:#390;}
.code_color .code_contt p.image  b{ color:#909;}
.code_color .code_contt span.comment{ color:#ccc;}

.code_idx1{}
.code_idx2{}
.code_idx3{}
.code_idx4{}
.code_idx5{}
.code_idx6{}

.code_tempexmp{ width:400px;}

/* ================================================================================================================ */

table{ border-collapse:collapse; margin:20px 0; width:100%; border:3px solid #432c23;}
table tr.boldborder { border-top:2px solid #432c23; }
table tr th{ color:#432c23; font:16px/2.2em "微软雅黑"; border:1px solid #432c23; }
table tr td{ color:#432c23; font:15px/1.6em "微软雅黑"; border:1px solid #432c23; vertical-align:top; padding:4px 6px;}

/* ================================================================================================================ */



.BorderDemo .martop { margin-top:50px; }
.BorderDemo .Gallery { margin:20px 0; }

.ShadowDemo .martop { margin-top:50px; }
.ShadowDemo .Gallery { margin:20px 0; }

.CtrlDemo .martop { margin-top:50px; }
.CtrlDemo .Gallery { margin:20px 0; }

.NavDemo .martop { margin-top:50px; }
.NavDemo .Gallery { margin:20px 0; }

.EffectDemo .martop { margin-top:50px; }
.EffectDemo .Gallery { margin:20px 0; }

.SmartDetect .martop { margin-top:50px; }
.SmartDetect .Gallery { margin:20px 0; }

.Demos .martop { margin-top:50px; }
.Demos .Gallery { margin:20px 0; }
.Demos .Gallery .wordpanel p { position:absolute; left:0; bottom:0; width:100%; margin:0; padding:10px 0; text-indent:10px; color:#fff; background:rgba(0,0,0,0.3); }


.about .banner { margin-bottom:30px; }
.team .txt_center { text-align:center; padding-bottom:100px; border:0px solid #f00; }