/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */



/* #Base 960 Grid
================================================== */




/* #Additional - Large Screens beyond 1280px
================================================== */
/* Note: Design for a width of 1280px */
@media (min-width:1025px) and (max-width:1366px){


}



/* #Additional - Large Screens beyond 1024px
================================================== */
/* Note: Design for a width of 1024px */
@media (min-width:769px) and (max-width:1024px){

.container													{ width: 960px; }

}



/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {

.container													{ width: 100%; }
.nav{ width:100%;}
header .logo img{ width:500px;}
.mid-white{ width:100%; padding-bottom:0px;}
.top-contact{margin-top: 0px;}
.nav-item a {padding: 12px 6px 11px 7px; margin: 0 10px;}
.nav-item a:last-child{padding-right: 0px;}
.carousel {margin-top: 10px;}
.carousel-inner > .item > img{ height:auto;}
.carousel {height:320px;}
.carousel .item{ height:320px;}
.carousel-caption h3{ font-size:26px;}
.map { height:auto;}
.map img{ width:100%;}
.contact-detail li { font-size:14px;}
.contact-detail li br{ display:none;}

/* Inner Pages */


.page-banner {margin-top: 10px; height:170px;}
.page-banner .blur-black{ height:102px;}
.page-banner .page-name{font-size: 26px; width:100%;}
.section-spacing{padding-top: 0px;}
.top-management .img-box{ margin-bottom:10px;}
.img-brd{ width:100%; margin-bottom:10px;}
.page-content a{   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */}
.product-gallery li div{ height:auto;}
}



/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */

@media only screen and (max-width: 767px) {

.container													{ width: auto;}
.mid-white{ width:100%; padding-bottom:0px;}
header { height:155px;}
header .logo img{ width:100%;}
.right-side													{ display:none;}
.contact-detail{ height:auto;}
.carousel { height:216px;     margin-top: 10px;}
.carousel .item { height:170px;}
.carousel-inner > .item > img { height:auto;}
.carousel-caption h3 { font-size:20px;     line-height: 26px;}
.carousel-indicators .active{border: 2px solid #2a2a2a;}
.alpha{padding-left: 0px;}
.beta{ padding-right:0px;}
.map { height:300px;}
.copyright{ width:100%; text-align: center;}
.fb-share{ width:100%; text-align: center;}
.social{ float:none; padding-left:0px;}

/* Inner Pages */

.page-banner {margin-top: 10px; height: 102px;}
.page-banner .blur-black{ height:102px;}
.page-banner .page-name{font-size: 26px; width:100%;}
.section-spacing{padding-top: 0px;}
.top-management .img-box{ margin-bottom:10px;}
.img-brd{ width:100%; margin-bottom:10px;}
.page-content a{   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}
.contact-detail li br{ display:none;}
}



/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */

@media only screen and (min-width: 480px) and (max-width: 767px) {

.container													{ width: 420px; margin: 0 auto; }

}

/* #Clearing
================================================== */

/* Self Clearing Goodness */
.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }