/*
�з���ƣ������ʶ�Ʒ�ƴ��⼯�����޹�˾
�绰:8610-51653028,�ͷ�:0-13581815533
http://www.randdo.com
Version: 1.0
*/

/* --- PRE-LOADER --------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@import url(http://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700);
@import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);
html, body{ width: 100%; height: 100%;}
body{font-family:"Microsoft Yahei", "Wenquanyi Micro Hei", sans-serif; background-color:#444444;}


/* --- RANDDO STYLES --------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.coverb {font-size: 9vw;line-height: 9vw;font-weight: 900;letter-spacing:-3px;color: #23b8bc;}

.ins {font-size: 0.8vw;line-height: 1.2vw; font-weight: 400;letter-spacing:0.6px;color: #222222;}
.inb {font-size: 1.5vw;line-height: 2.4vw; font-weight: 500;letter-spacing:1px;color:  #222222;}

h1      {font-size: 1.5vw;line-height: 2.1vw; font-weight: 400;letter-spacing:1px;color: #EEEEEE;}
.tops   {font-size: 1.2vw;line-height: 2.6vw; font-weight: 300;letter-spacing:1px;color: #EEEEEE;}
.topb   {font-size: 4.5vw;line-height: 7vw; font-weight: 900;letter-spacing:0px;color:  #23b8bc;}

.titles {font-size: 16px;line-height: 21px;font-weight: 400;letter-spacing:1px;color: #23b8bc;}
.titleb {font-size: 46px;line-height: 66px;font-weight: 600;letter-spacing:1px;color: #23b8bc;}
.titlem {font-size: 28px;line-height: 28px;font-weight: 400;letter-spacing:3px;color: #23b8bc;}

.cases   {font-size: 13px;line-height: 26px;font-weight: 400;letter-spacing:1px;color: #BBBBBB;}
.casem   {font-size: 16px;line-height: 36px;font-weight: 500;letter-spacing:1px;color: #EEEEEE;}

.tels   {font-size: 14px;line-height: 26px;font-weight: 400;letter-spacing:1px;color: #EEEEEE;}
.telb   {font-size: 42px;line-height: 60px;font-weight: 600;letter-spacing:0px;color: #23b8bc;}
.telm   {font-size: 21px;line-height: 38px;font-weight: 600;letter-spacing:1px;color: #23b8bc;}
.case-title{font-size: 38px;line-height: 45px;font-weight: 600;letter-spacing:1px;color: #23b8bc;}
.add    {font-size: 14px;line-height: 24px;font-weight: 400;letter-spacing:1px;color: #777777;}

.newss  {font-size: 13px;line-height: 24px;font-weight: 400;letter-spacing:1px;color: #555555;}
.newsm  {font-size: 18px;line-height: 32px;font-weight: 500;letter-spacing:1px;color: #555555;}

h2      {font-size: 28px;line-height: 46px;font-weight: 400;letter-spacing:1px;color: #EEEEEE;}
h3      {font-size: 16px;line-height: 35px;font-weight: 400;letter-spacing:1px;color: #999999;}
h4      {font-size: 14px;line-height: 32px;font-weight: 500;letter-spacing:1px;color: #999999;}

h5      {font-size: 30px;line-height: 45px;font-weight: 400;letter-spacing:1px;color: #EEEEEE;}
h6      {font-size: 16px;line-height: 30px;font-weight: 400;letter-spacing:1px;color: #999999;}

h9      {font-size: 12px;line-height: 24px;font-weight: 400;letter-spacing:1px;color:#FFFFFF;}
h8      {font-size: 18px;line-height: 34px;font-weight: 500;letter-spacing:1px;color: #FFFFFF;}
h7      {font-size: 12px;line-height: 21px;font-weight: 400;letter-spacing:1px;color:#777777;}

a{color:#EEEEEE;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;transition:all .2s ease-in-out;} a:hover,a:focus{text-decoration:none;color:rgba(0,198,215, 1);}

/* --- DEFAULT --------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
.black{color:#222222;}.gray{color:#999999;}.org{color:#23b8bc;}.white{color:#FFFFFF;}
.text-center{text-align:center;} .align-middle{margin:0 auto;} .sans-border{border-radius:0;} .sans-shadow{box-shadow:none;}.text-bottom{vertical-align:bottom;}
.orgbg{background:#23b8bc;}

.logo img{height:22px;}
.menu{margin:7px 30px 0px 45px;} .menutext{font-size:14px;line-height:14px;font-weight:400; letter-spacing:1.5px; color:#23b8bc;}
.mac img{width:60%;}
.addlogo img{height:148px;}
.tel-section{width:100%; padding:160px 30px 150px 30px; text-align:center; background:#2F3336 url(../images/tel_bg.jpg) 50% 0 repeat-y fixed; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.contact-container{background:#111111; padding:70px 0px 60px 0px; text-align:center;}

.row{margin-right:-30px; margin-left:-30px}
.row1{margin-right:-20px; margin-left:-20px}
.block{width:100%; padding:40px 0px 40px 0px; margin:0px;}
hr{width:100%; margin:0px; border-top:solid 1px #756139;}

.title-container{width:100%; padding:120px 0px 110px 0px; margin:0px; position:relative; text-align:center;}
.head-photo{margin:-140px 10px 20px 10px; padding:0px; position:relative;}
.photo{margin:0px 10px 20px 10px;}
.photo-full{margin:0px; text-align:center;}
.text-bg{background:#111111; padding:2px 30px 20px 30px; margin:0px; text-align:left;}

.about_bg    {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/about_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.portfolio_bg{width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/portfolio_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.case_bg     {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/case_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.union_bg    {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/union_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.join_bg     {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/join_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.contact_bg  {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/contact_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}

.trt_bg      {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/trt_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.huimai_bg   {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/huimai_bg_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.wanda_bg    {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/wanda_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.hujun_bg    {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/hujun_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.hsl_bg      {width:100%; padding:160px 30px 190px 30px; text-align:center; background:#333333 url(../images/hsl_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}

/* INDEX ------------ */

.carousel,.item,.active{height:98%;}
.carousel-inner{height:100%;}
.fill{width:100%; height:100%; background-position:center; -webkit-background-size:cover; -moz-background-size:cover; background-size:cover; -o-background-size:cover;}
.carousel-caption{background:rgba(0,0,0,0.5); padding:38px 30px 38px 30px; margin:0px 0px 0px -15px; text-shadow:none; bottom:5%;}
.carousel-control.right{background:none; z-index:100;}

.case-member figcaption{padding:30% 30px 30px 30px; color:transparent; background-color:transparent; text-align:center; position:absolute; z-index:996; bottom:0; left:0; width:100%; height:0; overflow:hidden;visibility:hidden;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.case-member figure:hover figcaption{width:100%; height:100%; visibility:visible; background:rgba(255,170,0,0.9);}

/* ABOUT ------------ */

.text-full{background:#23b8bc; width:100%; padding:45px 56px 40px 58px; margin-top:-20px; text-align:left;}
.counter-section{width:100%; padding:200px 30px 200px 30px; text-align:center; background:#2F3336 url(../images/portfolio_bg.jpg) 50% 0 repeat-y fixed; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.counter-section strong{display:block; font-weight:100; font-size:68px; line-height:68px; color:#00C6D7;}

/* CASE ------------ */

.title-container-case{width:100%; padding:70px 0px 25px 0px; margin:0px; position:relative; text-align:center;}
.text-case{padding:12px 0px 10px 0px; margin:0px; text-align:left;}
.text-case-bg{background:#111111; padding:8px 35px 20px 35px; margin:0px 10px 0px 10px;}
.text-case-full{padding:50px 35px 80px 35px; margin:0px 10px 0px 10px; text-align:center;}


/* PORTFOLIO ------------ */
.portfolio-member figcaption{padding:30px;color:transparent; background-color:transparent; position:absolute; z-index:996; bottom:0; left:0; width:100%; height:0; overflow:hidden;visibility:hidden;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.portfolio-member figure:hover figcaption{width:100%; height:100%; visibility:visible; background:rgba(0,0,0,0.6);}
.e-container{width:100%; padding:0px 20px 60px 20px; margin:0px; position:relative; text-align:center;}

/* NEWS ------------ */

.news-text{background:#111111; padding:20px 25px 26px 25px; margin:0px; text-align:left;}


/* CONTACT ------------ */




/* --- RANDD0-NAV --------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* BUTTON ------------ */
.button_container{position:relative;margin-top:9px; height:18px; width:20px;cursor:pointer; z-index:999; -webkit-transition:opacity .25s ease; transition:opacity .25s ease;}
.button_container.active .top{-webkit-transform:translateY(6px) translateX(0) rotate(45deg);-ms-transform:translateY(6px) translateX(0) rotate(45deg);transform:translateY(6px) translateX(0) rotate(45deg);background:#EEEEEE;}
.button_container.active .middle{opacity:0;background:#FFFFFF;}
.button_container.active .bottom{-webkit-transform:translateY(-6px) translateX(0) rotate(-45deg);-ms-transform:translateY(-6px) translateX(0) rotate(-45deg);transform:translateY(-6px) translateX(0) rotate(-45deg);background:#EEEEEE;}
.button_container span{background:#23b8bc; transition:all .2s ease-in-out;border:none; height:3px; width:100%;position:absolute;top:0; left:0;-webkit-transition:all .35s ease;transition:all .35s ease; cursor:pointer;}
.button_container span:nth-of-type(2){top:6px;}.button_container span:nth-of-type(3){top:12px;}
/* PAGE ------------ */
.overlay{position:fixed;display:block; background:rgba(0,0,0,1); top:0; border:0; left:0; z-index:100; width:100%; height:0%;opacity:0; visibility:hidden; -webkit-transition:opacity .35s, visibility .35s, height .35s;transition:opacity .35s, visibility .35s, height .35s;overflow:auto;}
.overlay.open{opacity:1;visibility:visible;height:100%;}
.overlay.open li{-webkit-animation:fadeInRight .5s ease forwards;animation:fadeInRight .5s ease forwards;-webkit-animation-delay:.35s;animation-delay:.35s;}
.overlay.open li:nth-of-type(1) {-webkit-animation-delay:.40s;animation-delay:.40s;}
.overlay.open li:nth-of-type(2n){-webkit-animation-delay: .50s;animation-delay:.50s;}
/* TEXT ------------ */
.overlay nav{position:relative; padding:25px; height:80%;top:10%; font-size:2.1vw; line-height:1.2em; letter-spacing:1px; font-weight:300; color:#888888; text-transform:none; text-align:center;}
.overlay ul{list-style:none; padding:0; margin: 0 auto; display:inline-block; position:relative; height:100%;}
.overlay ul li{display:block; height:15%; height:calc(100% / 8); min-height:65px; position:relative; opacity:0;}
.overlay ul li a{display:block; position:relative; color:#888888; text-decoration:none; overflow:hidden;}
.overlay ul li a:hover{color:#FFFFFF; outline:none;}
.overlay ul li a:focus:after,
.overlay ul li a:active:after{width:50%;}

/* === PC: Media Queries ========================================================================================================================================== */
@media(min-width:1024px){
.navbar-custom{padding:21px 30px 0px 30px; border-bottom:0px; letter-spacing:1px; background:0 0; -webkit-transition:background .5s ease-in-out, padding .5s ease-in-out; -moz-transition: background .5s ease-in-out, padding .5s ease-in-out;transition: background .5s ease-in-out, padding .5s ease-in-out;}
.navbar-custom.top-nav-collapse{padding:9px 30px 12px 30px; background:#333333; -webkit-transition:background .5s ease-in-out, padding .5s ease-in-out;-moz-transition:background .5s ease-in-out, padding .5s ease-in-out;transition: background .5s ease-in-out, padding .5s ease-in-out; -webkit-box-shadow: 0 0 0px 0px rgba(0,0,0,.3);box-shadow: 0 0 0px 0px rgba(0,0,0,.3);}
.navbar-header{padding:5px 0px 0px 0px;}}


/* === IPAD-W: Media Queries  ========================================================================================================================================== */

@media(max-width:1200px){

.coverb{font-size: 9.5vw;line-height: 9.2vw;font-weight: 900;letter-spacing:-1px;color: #23b8bc;}

.ins {font-size: 1.2vw;line-height: 1.2vw; font-weight: 400;letter-spacing:0px;color: #222222;}
.inb {font-size: 2.1vw;line-height: 3.2vw; font-weight: 400;letter-spacing:0px;color:  #222222;}

h1      {font-size: 2.4vw;line-height: 2vw; font-weight: 400;letter-spacing:0px;color: #EEEEEE;}
.tops {font-size: 2.1vw;line-height: 4.2vw; font-weight: 300;letter-spacing:0px;color: #EEEEEE;}
.topb {font-size: 7vw;line-height: 10vw; font-weight: 900;letter-spacing:0px;color:  #23b8bc;}

.titles{font-size: 14px;line-height: 28px;font-weight: 400;letter-spacing:1px;color:#23b8bc;}
.titleb{font-size: 28px;line-height: 38px;font-weight: 600;letter-spacing:1px;color:#23b8bc;}
.titlem{font-size: 21px;line-height: 36px;font-weight: 500;letter-spacing:1px;color: #23b8bc;}

.tels  {font-size: 12px;line-height: 18 px;font-weight: 400;letter-spacing:0px;color: #CCCCCC;}
.telb  {font-size: 28px;line-height: 40px;font-weight: 600;letter-spacing:0px;color: #23b8bc;}
.telm  {font-size: 16px;line-height: 21px;font-weight: 600;letter-spacing:0px;color: #CCCCCC;}

.cases   {font-size: 10px;line-height: 18px;font-weight: 400;letter-spacing:0px;color: #BBBBBB;}
.casem   {font-size: 12px;line-height: 21px;font-weight: 500;letter-spacing:0px;color: #EEEEEE;}

.add    {font-size: 12px;line-height: 21px;font-weight: 400;letter-spacing:0.5px;color: #888888;}

.newss  {font-size: 12px;line-height: 22px;font-weight: 400;letter-spacing:0px;color: #555555;}
.newsm  {font-size: 16px;line-height: 28px;font-weight: 500;letter-spacing:0px;color: #555555;}

.case-title{font-size: 24px;line-height: 18px;font-weight: 600;letter-spacing:0px;color: #23b8bc;}

h2      {font-size: 18px;line-height: 30px;font-weight: 500;letter-spacing:0px;color: #EEEEEE;}
h3      {font-size: 13px;line-height: 28px;font-weight: 400;letter-spacing:0px;color: #999999;}
h4      {font-size: 12px;line-height: 26px;font-weight: 400;letter-spacing:0px;color: #888888;}

h5      {font-size: 20px;line-height: 32px;font-weight: 400;letter-spacing:0px;color: #EEEEEE;}
h6      {font-size: 12px;line-height: 24px;font-weight: 400;letter-spacing:0px;color: #999999;}

h9      {font-size: 12px;line-height: 24px;font-weight: 400;letter-spacing:0px;color:#FFFFFF;}
h8      {font-size: 16px;line-height: 28px;font-weight: 500;letter-spacing:0px;color: #FFFFFF;}
h7      {font-size: 11px;line-height: 21px;font-weight: 400;letter-spacing:0px;color:#888888;}

/* --- DEFAULT --------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
.black{color:#222222;}.gray{color:#999999;}.org{color:#23b8bc;}.white{color:#FFFFFF;}

.logo img{height:16px;}
.menu{margin:1px 20px 0px 30px;} .menutext{font-size:13px;line-height:14px;font-weight:400; letter-spacing:1px; color:#23b8bc;}
.mac img{width:55%;}
.addlogo img{height:118px;}
.tel-section{width:100%; padding:100px 20px 100px 20px; text-align:center; background:#2F3336 url(../images/tel_bg.jpg) 50% 0 no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.contact-container{background:#131517; padding: 70px 0px 60px 0px;text-align:center;}

.row{margin-right:0px; margin-left:0px}
.row1{margin-right:5px; margin-left:5px}
.block{width:100%; padding:0px; margin:60px;}

.title-container{width:100%; padding:85px 0px 80px 0px; margin:0px; position:relative; text-align: center;}
.head-photo{margin:-80px 5px 10px 5px; position:relative;}
.photo{margin:0px 5px 10px 5px;}
.photo-full{margin:0px;}
.text-bg{background:#111111; padding:5px 18px 20px 18px; margin:0px; text-align:left;}

.text-full{background:#23b8bc; width:100%; padding:20px 45px 35px 45px; margin:-40px 0px 0px 0px; position:relative;}
.counter-section{width:100%; padding:120px 30px 140px 30px; text-align:center; background:#2F3336 url(../images/tel_bg.jpg) 50% 0 no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.counter-section strong{display:block; font-weight:100; font-size:48px; line-height:68px; color:#00C6D7;}
.carousel-caption{background:rgba(0,0,0,0.5); padding:22px 18px 22px 18px; margin:0px 0px 0px -15px; text-shadow:none; bottom:8%;}

.case-member figcaption{padding:22% 30px 30px 30px; color:transparent; background-color:transparent; text-align:center; position:absolute; z-index:996; bottom:0; left:0; width:100%; height:0; overflow:hidden;visibility:hidden;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.text-case-bg{background:#111111; padding:8px 35px 20px 35px; margin:0px 5px 0px 5px;}
.text-case-full{padding:50px 35px 80px 35px; margin:0px 10px 0px 10px; text-align:center;}

.portfolio-member figcaption{padding:20px;color:transparent; background-color:transparent; position:absolute; z-index:996; bottom:0; left:0; width:100%; height:0; overflow:hidden;visibility:hidden;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.e-container{width:100%; padding:0px 20px 60px 20px; margin:0px; position:relative; text-align:center;}


.button_container{position:relative;margin-top:4px; height:16px; width:16px;cursor:pointer; z-index:999; -webkit-transition:opacity .25s ease; transition:opacity .25s ease;}
.button_container.active .top{-webkit-transform:translateY(5px) translateX(0) rotate(45deg);-ms-transform:translateY(5px) translateX(0) rotate(45deg);transform:translateY(5px) translateX(0) rotate(45deg);background:#B0C3C7;}
.button_container.active .middle{opacity:0;background:#B0C3C7;}
.button_container.active .bottom{-webkit-transform:translateY(-5px) translateX(0) rotate(-45deg);-ms-transform:translateY(-5px) translateX(0) rotate(-45deg);transform:translateY(-5px) translateX(0) rotate(-45deg);background:#B0C3C7;}
.button_container span{background:#23b8bc; transition:all .2s ease-in-out;border:none; height:2px; width:100%;position:absolute;top:0; left:0;-webkit-transition:all .35s ease;transition:all .35s ease; cursor:pointer;}
.button_container span:nth-of-type(2){top:5px;}.button_container span:nth-of-type(3){top:10px;}
.overlay nav{position:relative; padding:15px; height:80%;top:12%; font-size:2em; letter-spacing:0px; line-height:1em; font-weight:300; color:#7D878D; text-transform:none; text-align:center;}
.overlay ul li{display:block; height:15%; height:calc(100% / 8); min-height:25px; position:relative; opacity:0;}

.navbar-custom{padding:20px 20px 2px 20px; border-bottom:0px; letter-spacing:1px; background:0 0; -webkit-transition:background .5s ease-in-out, padding .5s ease-in-out; -moz-transition: background .5s ease-in-out, padding .5s ease-in-out;transition: background .5s ease-in-out, padding .5s ease-in-out;}
.navbar-custom.top-nav-collapse{padding:10px 18px 8px 20px; background:#242729; -webkit-transition:background .5s ease-in-out, padding .5s ease-in-out;-moz-transition:background .5s ease-in-out, padding .5s ease-in-out;transition: background .5s ease-in-out, padding .5s ease-in-out; -webkit-box-shadow: 0 0 0px 0px rgba(0,0,0,.3);box-shadow: 0 0 0px 0px rgba(0,0,0,.3);}
.navbar-header{padding:0px 0px 0px 0px;}}



/* === IPAD-H: Media Queries  ========================================================================================================================================== */

@media(max-width:992px){

.coverb{font-size: 16vw;line-height: 15vw;font-weight: 900;letter-spacing:-1px;color: #23b8bc;}
h1      {font-size: 2.8vw;line-height: 2.1vw; font-weight: 400;letter-spacing:0px;color: #EEEEEE;}
.tops {font-size: 2.4vw;line-height: 4.8vw; font-weight: 300;letter-spacing:0px;color: #EEEEEE;}
h2      {font-size: 17px;line-height: 28px;font-weight: 500;letter-spacing:0px;color: #EEEEEE;}
h3      {font-size: 12px;line-height: 28px;font-weight: 400;letter-spacing:0px;color: #999999;}
h5      {font-size: 18px;line-height: 28px;font-weight: 400;letter-spacing:0px;color: #EEEEEE;}
.case-title{font-size: 21px;line-height: 16px;font-weight: 600;letter-spacing:0px;color: #23b8bc;}
.titles{font-size: 12px;line-height: 28px;font-weight: 400;letter-spacing:1px;color:#23b8bc;}
.titleb{font-size: 24px;line-height: 34px;font-weight: 600;letter-spacing:1px;color:#23b8bc;}
.titlem{font-size: 16px;line-height: 32px;font-weight: 500;letter-spacing:1px;color: #23b8bc;}

/* --- DEFAULT --------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
.black{color:#222222;}.gray{color:#999999;}.org{color:#23b8bc;}.white{color:#FFFFFF;}

.logo img{height:16px;}
.menu{margin:1px 20px 0px 30px;} .menutext{font-size:13px;line-height:14px;font-weight:400; letter-spacing:1px; color:#23b8bc;}
.mac img{width:75%;}
.addlogo img{height:118px;}
.tel-section{width:100%; padding:100px 20px 100px 20px; text-align:center; background:#2F3336 url(../images/tel_bg.jpg) 50% 0 no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.contact-container{background:#131517; padding: 70px 0px 60px 0px;text-align:center;}

.row{margin-right:0px; margin-left:0px}
.row1{margin-right:5px; margin-left:5px}
.block{width:100%; padding:0px; margin:60px;}

.title-container{width:100%; padding:85px 0px 80px 0px; margin:0px; position:relative; text-align: center;}
.head-photo{margin:-80px 5px 10px 5px;}
.photo{margin:0px 5px 10px 5px;}
.photo-full{margin:0px;}
.text-bg{background:#111111; padding:1px 20px 10px 20px; margin:0px; text-align:left;}

.text-full{background:#23b8bc; width:100%; padding:15px 25px 15px 25px; margin:-50px 0px 0px 0px; position:relative;}
.counter-section{width:100%; padding:200px 30px 200px 30px; text-align:center; background:#2F3336 url(../images/tel_bg.jpg) 50% 0 no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.counter-section strong{display:block; font-weight:100; font-size:48px; line-height:68px; color:#00C6D7;}
.carousel-caption{background:rgba(0,0,0,0.5); padding:22px 18px 22px 18px; margin:0px 0px 0px -15px; text-shadow:none; bottom:8%;}

.case-member figcaption{padding:16% 30px 30px 30px; color:transparent; background-color:transparent; text-align:center; position:absolute; z-index:996; bottom:0; left:0; width:100%; height:0; overflow:hidden;visibility:hidden;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.text-case-bg{background:#111111; padding:1px 21px 10px 21px; margin:0px 5px 0px 5px;}
.text-case-full{padding:50px 35px 80px 35px; margin:0px 10px 0px 10px; text-align:center;}

.portfolio-member figcaption{padding:20px;color:transparent; background-color:transparent; position:absolute; z-index:996; bottom:0; left:0; width:100%; height:0; overflow:hidden;visibility:hidden;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.e-container{width:100%; padding:0px 20px 60px 20px; margin:0px; position:relative; text-align:center;}


.button_container{position:relative;margin-top:4px; height:16px; width:16px;cursor:pointer; z-index:999; -webkit-transition:opacity .25s ease; transition:opacity .25s ease;}
.button_container.active .top{-webkit-transform:translateY(5px) translateX(0) rotate(45deg);-ms-transform:translateY(5px) translateX(0) rotate(45deg);transform:translateY(5px) translateX(0) rotate(45deg);background:#B0C3C7;}
.button_container.active .middle{opacity:0;background:#B0C3C7;}
.button_container.active .bottom{-webkit-transform:translateY(-5px) translateX(0) rotate(-45deg);-ms-transform:translateY(-5px) translateX(0) rotate(-45deg);transform:translateY(-5px) translateX(0) rotate(-45deg);background:#B0C3C7;}
.button_container span{background:#23b8bc; transition:all .2s ease-in-out;border:none; height:2px; width:100%;position:absolute;top:0; left:0;-webkit-transition:all .35s ease;transition:all .35s ease; cursor:pointer;}
.button_container span:nth-of-type(2){top:5px;}.button_container span:nth-of-type(3){top:10px;}
.overlay nav{position:relative; padding:15px; height:80%;top:12%; font-size:2.4em; letter-spacing:0px; line-height:1em; font-weight:300; color:#7D878D; text-transform:none; text-align:center;}
.overlay ul li{display:block; height:15%; height:calc(100% / 8); min-height:25px; position:relative; opacity:0;}

.navbar-custom{padding:20px 20px 2px 20px; border-bottom:0px; letter-spacing:1px; background:0 0; -webkit-transition:background .5s ease-in-out, padding .5s ease-in-out; -moz-transition: background .5s ease-in-out, padding .5s ease-in-out;transition: background .5s ease-in-out, padding .5s ease-in-out;}
.navbar-custom.top-nav-collapse{padding:10px 18px 8px 20px; background:#242729; -webkit-transition:background .5s ease-in-out, padding .5s ease-in-out;-moz-transition:background .5s ease-in-out, padding .5s ease-in-out;transition: background .5s ease-in-out, padding .5s ease-in-out; -webkit-box-shadow: 0 0 0px 0px rgba(0,0,0,.3);box-shadow: 0 0 0px 0px rgba(0,0,0,.3);}
.navbar-header{padding:0px 0px 0px 0px;}}


/* === PHONE: Media Queries ========================================================================================================================================== */

@media(max-width:767px){

.coverb{font-size: 16vw;line-height: 16vw;font-weight: 900;letter-spacing:-1px;color: #23b8bc;}

.ins {font-size: 2.8vw;line-height: 4.6vw; font-weight: 400;letter-spacing:0.6px;color: #222222;}
.inb {font-size: 3.8vw;line-height: 6.5vw; font-weight: 500;letter-spacing:0px;color:  #222222;}

h1      {font-size: 3.6vw;line-height: 2.6vw; font-weight: 400;letter-spacing:0px;color: #EEEEEE;}
.tops {font-size: 3.2vw;line-height: 6vw; font-weight: 400;letter-spacing:0px;color: #EEEEEE;}
.topb {font-size: 8.5vw;line-height: 12vw; font-weight: 600;letter-spacing:0px;color:  #23b8bc;}

.titles{font-size: 12px;line-height: 28px;font-weight: 400;letter-spacing:1px;color:#23b8bc;}
.titleb{font-size: 24px;line-height: 24px;font-weight: 600;letter-spacing:1px;color:#23b8bc;}
.titlem{font-size: 16px;line-height: 35px;font-weight: 500;letter-spacing:1px;color: #23b8bc;}

.tels  {font-size: 12px;line-height: 26px;font-weight: 300;letter-spacing:0px;color: #EEEEEE;}
.telb  {font-size: 28px;line-height: 40px;font-weight: 600;letter-spacing:0px;color: #23b8bc;}
.telm  {font-size: 16px;line-height: 20px;font-weight: 500;letter-spacing:0px;color: #23b8bc;}

.cases   {font-size: 11px;line-height: 18px;font-weight: 400;letter-spacing:0px;color: #BBBBBB;}
.casem   {font-size: 12px;line-height: 26px;font-weight: 500;letter-spacing:0px;color: #EEEEEE;}

.add    {font-size: 12px;line-height: 21px;font-weight: 400;letter-spacing:0.5px;color: #888888;}

.newss  {font-size: 11px;line-height: 21px;font-weight: 400;letter-spacing:0px;color: #555555;}
.newsm  {font-size: 14px;line-height: 24px;font-weight: 500;letter-spacing:0px;color: #555555;}

.case-title{font-size: 21px;line-height: 18px;font-weight: 600;letter-spacing:0px;color: #23b8bc;}

h2      {font-size: 16px;line-height: 28px;font-weight: 500;letter-spacing:0px;color: #EEEEEE;}
h3      {font-size: 12px;line-height: 28px;font-weight: 400;letter-spacing:0px;color: #999999;}
h4      {font-size: 12px;line-height: 28px;font-weight: 400;letter-spacing:0px;color: #888888;}

h5      {font-size: 20px;line-height: 32px;font-weight: 400;letter-spacing:0px;color: #EEEEEE;}
h6      {font-size: 12px;line-height: 24px;font-weight: 400;letter-spacing:0px;color: #999999;}

h9      {font-size: 12px;line-height: 24px;font-weight: 400;letter-spacing:0px;color:#FFFFFF;}
h8      {font-size: 16px;line-height: 28px;font-weight: 500;letter-spacing:0px;color: #FFFFFF;}
h7      {font-size: 11px;line-height: 21px;font-weight: 400;letter-spacing:0px;color:#888888;}

/* --- DEFAULT --------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
.black{color:#222222;}.gray{color:#999999;}.org{color:#23b8bc;}.white{color:#FFFFFF;}

.logo img{height:16px;}
.menu{margin:2px 20px 0px 35px;} .menutext{font-size:14px;line-height:14px;font-weight:400; letter-spacing:1.5px; color:#23b8bc;}
.mac img{width:95%;}
.addlogo img{height:118px;}
.tel-section{width:100%; padding:120px 15px 120px 15px; text-align:center; background:#2F3336 url(../images/tel_bg.jpg) 50% 0 no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.contact-container{background:#111111; padding:70px 0px 50px 0px; text-align:center;}

.row{margin-right:0px; margin-left:0px}
.row1{margin-right:0px; margin-left:0px}
.block{width:100%; padding:0px; margin:0px;}

.title-container{width:100%; padding:155px 15px 155px 15px; margin:0px; position:relative; text-align:center;}
.head-photo{margin:-1px 0px 0px 0px;}
.photo{margin:-1px 0px 0px 0px;}
.photo-full{margin:0px;}
.text-bg{background:#111111; padding:5px 18px 20px 18px; margin:0px; text-align:left;}

.text-full{background:#23b8bc; width:100%; padding:10px 35px 30px 35px; margin:0px; position:relative; text-align:left;}
.counter-section{width:100%; padding:60px 15px 60px 15px; text-align:center; background:#2F3336 url(../images/tel_bg.jpg) 50% 0 no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.counter-section strong{display:block; font-weight:100; font-size:38px; line-height:68px; color:#23b8bc;}
.carousel-caption{padding:30px 15px 30px 15px; margin:0px 0px 0px -15px; text-shadow:none; bottom:5%;}

.case-member figcaption{padding:28% 30px 30px 30px; color:transparent; background-color:transparent; text-align:center; position:absolute; z-index:996; bottom:0; left:0; width:100%; height:0; overflow:hidden;visibility:hidden;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.case-member figure:hover figcaption{width:100%; height:100%; visibility:visible; background:rgba(255,170,0,0.9);}
.text-case-bg{background:#111111; padding:1px 25px 10px 25px; margin:0px 10px 10px 10px;}
.text-case-full{padding:80px 20px 80px 20px; margin:0px 10px 0px 10px; text-align:center;}
.text-case{padding:12px 18px 20px 18px; margin:0px; text-align:left;}


.portfolio-member figcaption{padding:20px;color:transparent; background-color:transparent; position:absolute; z-index:996; bottom:0; left:0; width:100%; height:0; overflow:hidden;visibility:hidden;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.e-container{width:100%; padding:12px 20px 30px 20px; margin:0px; position:relative; text-align:center;}


.about_bg    {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/about_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.portfolio_bg{width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/portfolio_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.case_bg     {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/case_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.union_bg    {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/union_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.join_bg     {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/join_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.contact_bg  {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/contact_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}

.trt_bg      {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/trt_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.huimai_bg   {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/huimai_bg_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.wanda_bg    {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/wanda_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.hujun_bg    {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/hujun_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}
.hsl_bg      {width:100%; padding:40% 15px 20% 15px; text-align:center; background:#333333 url(../images/hsl_bg.jpg) 50% 0 repeat-y; no-repeat scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;}


.button_container{position:relative;margin-top:4px; height:16px; width:16px;cursor:pointer; z-index:999; -webkit-transition:opacity .25s ease; transition:opacity .25s ease;}
.button_container.active .top{-webkit-transform:translateY(5px) translateX(0) rotate(45deg);-ms-transform:translateY(5px) translateX(0) rotate(45deg);transform:translateY(5px) translateX(0) rotate(45deg);background:#B0C3C7;}
.button_container.active .middle{opacity:0;background:#B0C3C7;}
.button_container.active .bottom{-webkit-transform:translateY(-5px) translateX(0) rotate(-45deg);-ms-transform:translateY(-5px) translateX(0) rotate(-45deg);transform:translateY(-5px) translateX(0) rotate(-45deg);background:#B0C3C7;}
.button_container span{background:#EEEEEE; transition:all .2s ease-in-out;border:none; height:2px; width:100%;position:absolute;top:0; left:0;-webkit-transition:all .35s ease;transition:all .35s ease; cursor:pointer;}
.button_container span:nth-of-type(2){top:5px;}.button_container span:nth-of-type(3){top:10px;}
.overlay nav{position:relative; padding:15px; height:80%;top:8%; font-size:1.6em; letter-spacing:0px; line-height:1em; font-weight:300; color:#7D878D; text-transform:none; text-align:center;}
.overlay ul li{display:block; height:15%; height:calc(100% / 8); min-height:25px; position:relative; opacity:0;}


.navbar-custom{padding:16px 16px 0px 16px; border-bottom:0px; letter-spacing: 1px;background:0 0; -webkit-transition:background .5s ease-in-out, padding .5s ease-in-out; -moz-transition: background .5s ease-in-out, padding .5s ease-in-out;transition: background .5s ease-in-out, padding .5s ease-in-out;}
.navbar-custom.top-nav-collapse{padding:9px 16px 10px 16px; background:#242729; -webkit-transition:background .5s ease-in-out, padding .5s ease-in-out;-moz-transition:background .5s ease-in-out, padding .5s ease-in-out;transition: background .5s ease-in-out, padding .5s ease-in-out; -webkit-box-shadow: 0 0 0px 0px rgba(0,0,0,.3);box-shadow: 0 0 0px 0px rgba(0,0,0,.3);}
.navbar-header{padding:0px 0px 0px 0px;}}