/* * Skeleton V1.2 * Copyright 2011, Dave Gamache * www.getskeleton.com * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php * 6/20/2012 */ /* Table of Content ================================================== #Site Styles #Page Styles #Media Queries #Font-Face */ /* #Site Styles ================================================== */ html { background:#fff url(../images/bg-body.jpg) 0 0 repeat-y; } body { font-family:Arial, Helvetica, sans-serif; text-align:justify; background: none;} img { max-width: none;} #wrapper-left { margin: 10px; position: fixed;} #banner { background-color: none;} #footer { font-size: 10px; line-height: 10px; font-style:italic; padding-top: 10px; } #wrapper-right { margin: 10px 10px 10px 50px; float: right;} #logo { float:left;} #main-menu { float:left; margin-top:15px; margin-left:20px;} #main-menu a { font-family:'Conv_HelveticaLTStd-Cond',Sans-Serif; margin:0 10px; padding:5px 5px 4px; color:#000; text-decoration:none; font-size:16px;} #main-menu a:hover, #main-menu a.current-page { color:#d90000; border:1px solid #d90000; background-color: #FFF; opacity: 0.6; padding:5px 5px 4px;} h1,h2,h3,h4,h5,h6 { font-family:'Conv_US101',Sans-Serif; text-transform:uppercase; color: #666;} h1 { font-size: 100px; line-height: 100px;} h2 { font-size: 80px; line-height: 80px;} h3 { font-size: 60px; line-height: 60px;} h4 { font-size: 50px; line-height: 50px;} h5 { font-size: 40px; line-height: 40px;} h6 { font-size: 30px; line-height: 30px;} span.red { color:#d90000; } .welcome-page { margin-top: 50px; margin-bottom: 20px; } #content { width: 95%; } #content p, #content ol, #content ol li, #content ul { font-size: 14px;} #content ol { margin-left: 20px;} /*Tabs*/ .ui-tabs { border:none; background:none; padding:0;} .ui-tabs .ui-tabs-nav { border:none; background:none; padding:0;} .ui-tabs .ui-tabs-nav li { border:none; background:none; margin:0; padding:0;} .ui-tabs .ui-tabs-nav .ui-tabs-anchor { outline:none; font-family:'Conv_HelveticaLTStd-Cond',Sans-Serif; font-size:16px; font-weight: normal; color:#666; text-transform:uppercase; padding:10px 10px 5px; border-bottom: 1px solid #d90000; } .ui-tabs .ui-tabs-nav .ui-tabs-anchor:hover, .ui-tabs .ui-tabs-nav .ui-state-active .ui-tabs-anchor { color:#d90000; padding:9px 9px 5px; border: 1px solid #d90000; border-bottom: none;} .tabs-content { padding: 20px 40px 20px 10px !important; } #news { position:relative;} #news-content { position:absolute; bottom:100px; left:25px;} #news-header { font-family:'Conv_HelveticaLTStd-Cond',Sans-Serif; font-size:60px; color:#666; text-transform:uppercase; border-bottom:2px solid #d90000; width:500px;} #news-title { font-family:'Conv_HelveticaLTStd-Cond',Sans-Serif; font-size: 20px; color:#666; text-transform:uppercase; margin-top:20px;} #news-des { color:#666; font-style:italic; width:500px;} #our-operation-map, #contact-us-map { position:relative; overflow: hidden;} #our-operation-map img, #contact-us-map img { width:100%; height: auto;} #our-operation-map a.ops, #contact-us-map a.cu { position:absolute; width:30px; height:22px; display:block; z-index:1000; cursor:pointer;} #our-operation-map a.ops img, #contact-us-map a.cu img{ width:100%;} #our-operation-map img.ops, #contact-us-map img.cu { position:absolute; opacity:0; z-index:900;} #our-operation-map a.ops#jb { left:105px; top:290px;} #our-operation-map img.ops#jb { left:80px; top:240px; width:auto;} #our-operation-map a.ops#kk { left:460px; top:300px;} #our-operation-map img.ops#kk { left:435px; top:250px; width:auto;} #our-operation-map a.ops#kk { left:320px; top:215px;} #our-operation-map img.ops#kk { left:295px; top:155px; width:auto;} #our-operation-map a.ops#kl { left:65px; top:240px;} #our-operation-map img.ops#kl { left:45px; top:190px; width:auto;} #our-operation-map a.ops#ku { left:90px; top:255px;} #our-operation-map img.ops#ku { left:65px; top:205px; width:auto;} #our-operation-map a.ops#me { left:105px; top:375px;} #our-operation-map img.ops#me { left:90px; top:330px; width:auto;} #our-operation-map a.ops#me { left:70px; top:280px;} #our-operation-map img.ops#me { left:55px; top:240px; width:auto;} #our-operation-map a.ops#tr { left:100px; top:230px;} #our-operation-map img.ops#tr { left:60px; top:180px; width:auto;} /* #contact-us-map a.cu#my { left:180px; top:400px;} #contact-us-map img.cu#my { left:135px; top:250px; width:117px;} #contact-us-map a.cu#br { left:260px; top:400px;} #contact-us-map img.cu#br { left:215px; top:250px; width:117px;} #contact-us-map a.cu#sg { left:190px; top:425px;} #contact-us-map img.cu#sg { left:145px; top:450px; width:117px;} #contact-us-map a.cu#ph { left:320px; top:350px;} #contact-us-map img.cu#ph { left:280px; top:200px; width:117px;} #contact-us-map a.cu#in { left:55px; top:260px;} #contact-us-map img.cu#in { left:15px; top:110px; width:117px;} */ #right-columns { position:relative;} a.read-more { font-size:12px; color:#d90000; border:1px solid #fff; padding:4px 14px; text-decoration:none;} a.read-more:hover { border:1px solid #d90000; padding:4px 14px;} /* #Page Styles ================================================== */ /* Page - Home */ h1.welcome-note { color:#d90000; font-size:100px; line-height: 100px; } h2.welcome-note { color:#666; font-size: 80px; line-height: 80px; margin-top: 50px;} .underline-red { width:100%; margin:20px 0; border-bottom:2px solid #d90000;} /* Corporate Info */ #certs a { float: left;} #certs a img{ width: 150px; border: 5px solid #fff; margin-left: 10px; margin-bottom: 20px;} /* Page Operation*/ table.table-operation-header { font-family:'Conv_US101',Sans-Serif; font-size:20px; color:#d90000; text-transform:uppercase; margin:0; margin-top:0;} table.table-operation-header tr td { padding-top:20px; padding-bottom:20px;} table.table-operation-details { font-size:13px; color:#4a4a4a;} table.table-operation-details tr td { padding-top:10px; padding-bottom:10px;} table.table-operation-header, table.table-operation-details { width:100%; border:none; outline:none; } table.table-operation-details tr:nth-child(odd) { background-color:#f4f3f3;} td.op-state { width:15%; padding-left:10px;} td.op-tel { width:20%;} td.op-add { width:30%;} /* Contact Us*/ #contact-us-page { max-height:500px;} .contact-det { width:30%; float:left; margin-right:20px;} .contact-det:nth-last-child(1){ margin-right:0;} .contact-title { font-family:'Conv_US101',Sans-Serif; font-size:20px; color:#d90000; text-transform:uppercase; margin:0; margin-top:10px;} .contact-det p { font-size:13px; color:#4a4a4a;} /*Works*/ .works{ border:1px solid #CCC; padding:10px; margin-top:10px;} .works h6 { cursor:pointer;} .works h6 a{ margin:0; text-transform:uppercase; text-decoration:none;} .works h6 a:hover{ cursor:pointer; color:#767676;} .works.close h6 a{ color:#c1c1c1; } .works.open h6 a{ color:#767676;} .works .job-des{ text-align:left; } .works .job-des ul { margin-left: 20px;} .works.close .job-des, .works.close .apply-now{ display:none;} .apply-now { text-align:center; padding:20px 0; margin-bottom:10px;} .apply-now a { text-align:center; text-decoration:none; text-transform:uppercase; background-color:#f0f0f0; color:#bd0000; padding:10px 20px; } .apply-now a:hover { border:1px solid #bd0000;} /* #our-operation-tabs.ui-tabs .ui-tabs-panel { padding:0; border:none; background-color:#fff;} .page-note#operation { height:200px;} .operation-det { float:left; margin-right:10px; padding:10px 0; font-size:12px;} .operation-det:nth-last-child(1){ margin-right:0;} .operation-det#state { width:130px;} .operation-det#tel { width:100px;} .operation-det#add { width:250px;} .operation-det#email { width:170px;} .operation-row:nth-child(1) { background-color:#CCC;} .operation-title { font-family:'Conv_US101',Sans-Serif; font-size:20px; color:#d90000; text-transform:uppercase; margin:0; margin-top:10px;} .operation-det p { font-size:12px; color:#4a4a4a;} */ /* #Media Queries ================================================== */ @media only screen and (min-width: 1280px) { } /* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width: 959px) {} /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) {} /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width: 767px) {} /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 767px) {} /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) {} /* #Font-Face ================================================== */ /* This is the proper syntax for an @font-face file Just create a "fonts" folder at the root, copy your FontName into code below and remove comment brackets */ /* @font-face { font-family: 'FontName'; src: url('../fonts/FontName.eot'); src: url('../fonts/FontName.eot?iefix') format('eot'), url('../fonts/FontName.woff') format('woff'), url('../fonts/FontName.ttf') format('truetype'), url('../fonts/FontName.svg#webfontZam02nTh') format('svg'); font-weight: normal; font-style: normal; } */