
/* homepage container for all contents */
.homepage-container {width:98%; margin:0 auto; font-size:0.98em}


/*  reset again */
h2,h3,h4,h5,h6,p, div, table, embed, iframe, ul, ol {margin:0; padding:0}
frameborder {border:none}
a:focus {border:3px}
#page-title {}
 

/* layouts */
.home-floor {margin-bottom:50px; clear:both; position:relative}
.w100 {width:100%}
.w90 {width:90%}
.w80 {width:80%}
.w70 {width:70%}
.w60 {width:60%}
.w50 {width:49%}
.w40 {width:40%}
.w33 {width:33.33%}
.w30 {width:30%}
.w25 {width:25%}
.w20 {width:20%}
.w10 {width:10%}

.homepage-content {margin:0 auto}
.homepage-inner {width:100%; margin:0 auto}


.home-floor-inner {margin:0 auto; }

.home-box {float:left; }
.home-box-inner {width:93%; margin:0 auto; position:relative; border:1px solid #ddd; border-radius:5px}
.home-box-inner h2.home-title, .home-box-inner h2.title  {padding:7px 0; text-align:center;background:#eee}
.home-box-text {width:95%; margin:0 auto; padding-bottom:25px !important; overflow:hidden; }
.home-box-text ul {clear:both !important}
.home-box-text iframe, .home-box-text img, .home-box-text object, .home-box-text embed {max-width:100%}
.home-box-text h2, .home-box-text p {width:93%; }
.home-box-text h2 {word-wrap: break-word;}

.homepage-banner-box-inner {width:80%}
.homepage-text-box {text-align:left; padding-bottom:30px}
.homepage-text-box h2 {word-wrap: break-word;}
.homepage-text-box h2, .homepage-text-box p {width:93%; }

.jumbotron {width:100%; margin:0 auto; margin-bottom:30px}
.home-cta {border:3px solid #ddd}
 
.cta-link {position:absolute; top:14px !important; right:20px}


/* home tags 
======================= */
.home-tags {position:relative; text-align:left; margin:0 auto; clear:both}
.home-tags li {float:left;  list-style:none;}      
.home-tags li h2 {background:none; }
.product-tags .app-list-up-date {display:none}
 
 
/* 20% width, 5 columns */
.tags20 li {width:20%; }
.tags20 li img {width:90%; height:auto}
.tags20 li iframe {width:90%; height:65% !important}

/* 23% width, 35 columns */
.tags30 li {width:33%; }
.tags30 li img {width:90%; height:auto}
.tags20 li iframe {width:90%; height:85%}

/* 25% width, 4 columns */
.tags25 li {width:24.8%;  }
.tags25 li img {width:90%; height:auto}
.tags25 li iframe {width:90%; height:85%}

/* 50% width, 2 columns */
.tags50 li {width:50%;  }
.tags50 li img {width:90%; height:auto}
.tags20 li iframe {width:90%; height:85%}

/* 100% width, 1 columns */
.tags100 li {width:100%; text-align:left; }
.tags100 li img {width:100%; height:auto}
.tags100 li iframe {width:100%; height:85%}


/* floor layouts 
======================= */

/* floor-one about us */
.floor-one {}
.floor-one .home-box-inner {min-height:200px; max-height:280px; overflow:hidden}
.floor-one h2 {padding:4px; text-align:left; margin:0 0 10px 0}
.floor-one p {text-align:left; }


/* floor-two slogan cta */
.floor-two {}
.floor-two .home-box-inner {width:98.3%; padding:7px 0; margin:0 auto; background:#efefef }
.floor-two h2 {width:75% !important; padding:15px; font-size:1.6em}
.home-cta a {position:absolute; right:30px; top:50%; margin-top:-20px}
.home-cta a, .home-cta a:visited {color:#fff !important}


/* floor-three tabs-taba angel */
.floor-three {}
.floor-three .home-floor-inner {width:97.7%; margin:0 auto }
.floor-three .tabContainer-taba {width:100%}
.floor-three .tabContent-taba {width:97%; padding:15px 0; margin:0 auto}

/* floor-four 70:30 tabs-tabb about and video */
.floor-four {}
.floor-four h2 {padding:4px; text-align:left; margin:0 0 10px 0}
.floor-four .home-floor-inner {width:100%}
.floor-four .home-box-inner {width:98%; margin:0 auto; border:1px solid #ddd}
.floor-four .w70 .home-box-text {width:97%; display:block;padding-bottom:30px}
.floor-four .w30 .home-box-inner {width:93%}
.floor-four .tabContainer-tabb {min-height:227px; width:97.3%; padding-top:7px; border:1px solid #ddd}             
.floor-four .tabContent-tabb {padding:10px; width:98%;  margin: 0 auto}
.floor-four .homepage-text-box {width:100%; } 
.floor-four iframe {height:210px}   
/* .floor-four .product-tags p {display:none}  */
        
    
/* floor-five 30:70 tabs-tabc about and video */
.floor-five {}
.floor-five h2 {padding:4px; text-align:left; margin:0 0 10px 0}
.floor-five .home-floor-inner {width:100%}
.floor-five .home-box-inner {width:97%; margin:0 auto; border:1px solid #ddd}
.floor-five .w70 .home-box-text {overflow:hidden; padding-bottom:30px}
.floor-five .w30 .home-box-inner {width:92%}
.floor-five .tabContainer-tabc {width:100%; border:none; border-top:1px solid #ddd}
.floor-five .tabContent-tabc {padding:15px}    
.floor-five iframe {height:210px}       
.tabContainer-tabc img {height:96px}
                                                   
/* floor-six 50:50 tabs-tabd about and video */
.floor-six {}
.floor-six .home-floor-inner {width:98.8%;}
.floor-six .west-box .home-box-inner {height:270px; overflow:hidden} 
.floor-six h2 {padding:4px; text-align:left; margin:0 0 10px 0}     
.floor-six .home-box-inner {width:99%; margin:0 auto; border:1px solid #ddd}
.floor-six .home-box-text {width:99%; padding-bottom:10px}
.floor-six .home-box-text iframe {width:98%; padding-left:5px; height:245px} 
.floor-six .tabContainer-tabd {min-height:238px; width:99%; border:1px solid #ddd}
.floor-six .tabContent-tabd {width:97%; padding:15px }  
.floor-six .east-box {float:right}           

/* floor-seven 30:30:30 tabs about and video */
.floor-seven {}
.floor-seven .w30 {width:33.3%}
.floor-seven h2 {padding:4px; text-align:left; margin:0 0 10px 0}
.floor-seven .home-floor-inner {width:100%;}
.floor-seven .home-box-inner {width:97%; margin:0 auto; border:1px solid #ddd; min-height:270px}
.floor-seven .home-box-text {overflow:hidden; padding-bottom:5px}
.floor-seven iframe {height:215px} 
.floor-seven .home-box-inner {}
.floor-seven .product-tags li {}
                                         
/* floor-eight 25:50:25 tabs about and video */
.floor-eight {}
.floor-eight .w30 {width:33.3%}
.floor-eight h2 {padding:4px; text-align:left;margin:0 0 10px 0}
.floor-eight .home-floor-inner {width:100%;}
.floor-eight .home-box-inner {width:95%; margin:0 auto; border:1px solid #ddd; min-height:370px; height:auto !important; height:370px}
.floor-eight .home-box-text {width:90%; overflow:hidden; padding-bottom:5px}      
.floor-eight iframe {height:210px}

#f8-social {padding-left:16px}
#f8-social li {list-style: disc; padding:5px 0;  border-bottom:1px solid #ddd}
#f8-social li:last-of-type {border-bottom:none}
#f8-social li p, .floor-eight .product-tags li h2, .floor-eight .product-tags li p {display:none}
#f8-social li h2 {font-weight:normal; font-size:100%; margin:0; padding:0; text-align:left; background:none} 


/* END ======================= */



/* accordion, 4 accordions can be used, accordion-one, two, three, four
======================= */
.accordion-one-toggle, .accordion-two-toggle, .accordion-three-toggle, .accordion-four-toggle {cursor: pointer;background:#eee}
.accordion-one-content, .accordion-two-content, .accordion-three-content, .accordion-four-content{display: none; width:90%; margin:0 auto; padding-bottom:10px}
.accordion-one-content.default-content,.accordion-two-content.default-content, .accordion-three-content.default-content .accordion-four-content.default-content {display: block; width:90%; margin:0 auto; padding-bottom:10px}
 
#accordion-one h3 {margin:10px 0; }
.accordion-one-content, .accordion-one-content.default-content {border-bottom:1px solid #ddd; margin-bottom:10px; padding-bottom:5px} 
.accordion-one-content {display: none; width:100%; margin:0 auto; padding-bottom:10px}
.accordion-one-content.default-content {display: block; width:100%; margin:0 auto; padding-bottom:10px}


/* tabs http://www.qualitytuts.com/simple-jquery-tabs-css-jquery/ 
4 tabs can be used, taba, tabb, tabc, tabd
======================= */                                                                               
ul.tabs-taba, ul.tabs-tabb, ul.tabs-tabc, ul.tabs-tabd {float:left; background:transparent !important; list-style:none;  width:98.8%;margin:0 !important;padding:0;}
ul.tabs-taba li, ul.tabs-tabb li, ul.tabs-tabc li, ul.tabs-tabd li{float:left; margin:0 8px 0 0;padding: 0;  height:35px; line-height:35px;border:1px solid #ccc; background:#eee;text-shadow:none; overflow:hidden;position:relative; -webkit-border-top-left-radius:4px;-webkit-border-top-right-radius:4px;-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;border-top-left-radius:4px;border-top-right-radius:4px}
ul.tabs-taba li a, ul.tabs-tabb li a, ul.tabs-tabc li a, ul.tabs-tabd li a {padding-left: 8px; padding-right:8px; text-decoration:none;height:35px; line-height:35px; color:#000;display:block; outline:none;-webkit-border-top-left-radius:4px;-webkit-border-top-right-radius:4px;-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;border-top-left-radius:4px;border-top-right-radius:4px}
ul.tabs-taba li a:hover, ul.tabs-tabb li a:hover, ul.tabs-tabc li a:hover,  ul.tabs-tabd li a:hover {background:#fff !important}

ul.tabs-taba, ul.tabs-tabb, ul.tabs-tabc, ul.tabs-tabd {background:#eee}
ul.tabs-taba li, ul.tabs-tabb li, ul.tabs-tabc li, ul.tabs-tabd li{float:left; height:35px; line-height:35px; padding:0 8px; overflow:hidden;position:relative;}
ul.tabs-taba li a, ul.tabs-tabb li a, ul.tabs-tabc li a, ul.tabs-tabd li a{text-decoration:none;height:35px; line-height:35px; color:#000;display:block; outline:none;}
ul.tabs-taba li a:hover, ul.tabs-tabb li a:hover, ul.tabs-tabc li a:hover, ul.tabs-tabd li a:hover {background:transparent; display:block}

ul.tabs-taba li.active, ul.tabs-taba li:hover, ul.tabs-tabb li.active, ul.tabs-tabb li:hover,
ul.tabs-tabc li.active, ul.tabs-tabc li:hover, ul.tabs-tabd li.active, ul.tabs-tabd li:hover
{background:#fff !important; border-bottom:2px solid #fff; display:block}

.tabContainer-taba, .tabContainer-tabb, .tabContainer-tabc, .tabContainer-tabd {font-size:0.85em; min-height:150px; margin-top:-1px; border:1px solid #ccc; overflow:hidden;clear:both;float:left;width:100%;background:#fff;-webkit-border-radius:4px;-webkit-border-top-left-radius:0;-moz-border-radius:4px;-moz-border-radius-topleft:0;border-radius:4px;border-top-left-radius:0;}
.tabContent-taba, .tabContent-tabb, .tabContent-tabc, .tabContent-tabd {padding:0} 
.tabContainer-taba, .tabContainer-tabb, .tabContainer-tabc, .tabContainer-tabd {margin-bottom:5px}
.tabContent-taba, .tabContent-tabb, .tabContent-tabc, .tabContent-tabd {padding:10px; }
/*
.tabContent-taba li, .tabContent-tabb li, .tabContent-tabc li, .tabContent-tabd li {border-bottom:1px solid #ddd; display:block; clear:both; min-height:58px}
.tabContent-taba li:last-child, .tabContent-tabb li:last-child, .tabContent-tabc li:last-child, .tabContent-tabd li:last-child {border-bottom:none}
*/


/* remove all space in latest h3,p, span in the homepage */
.home-tags h3, .home-tags p {padding:0; margin:0; margin-bottom:4px}
.home-tags h3, .home-tags p, .home-tags span {}
.home-tags span {color:#333; font-style:italic; padding:6px 0; display:block}

/* homepage-south title only lists */
.south-title-only img, .south-title-only p {display:none}
.south-title-only h2 {font-size:1.0em; border-bottom:1px solid #ddd; padding:5px 0; font-weight:normal}
.south-title-only li:last-of-type {border-bottom:none !important}

/* floor-eight */
.homepage-container .floor-eight p, .homepage-container .floor-eight span {display:none} 
.homepage-container .floor-eight h3 {font-weight:normal; margin:0; padding:0; font-size:0.97em}     
.homepage-container .floor-eight li {border-bottom:1px solid #ddd; padding:5px 0; }
.homepage-container .floor-eight .center-box li {border-bottom:none}


/* home latest contents */
.home-tags .app-list-image-box img {height:90px !important}
.home-tags h3, .home-tags p {width:95%}
.home-tags span {width:1px; height:1px; position:absolute; top:-3px; overflow:hidden}