/* COMMON */ * { padding: 0; margin: 0; } body { line-height: 1.5em; } object, img { display: none } a img { border: none; } .hide { display: none; } .float-left { float: left; } .float-right { float: right; } .clear { clear: both; height: 1px; overflow: hidden; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* RE-DEFINE HTML STYLES */ html { overflow-y: scroll!important; /* Enables firefox scrollbar as default */ } body { background: #FFF; color: #383838; font-family: Arial, Helvetica, sans-serif; font-size: 12px; padding: 0; margin: 0; padding-bottom: 20px; } p { margin: 8px 0; } ul { list-style-type: square; list-style-position: outside; margin: 10px 0 10px 0; padding: 0; } li { padding: 0; margin-bottom: 2px; margin-left: 20px; } ol { list-style-position: outside; margin: 10px 0 10px 8px; padding: 0; } ol li { padding: 0; margin-bottom: 2px; margin-left: 20px; } hr { /* For Internet Explorer */ height: 1px; color: #CCC; border: none; } html>body hr { /* For Opera and Gecko-based browsers */ height: 1px; background-color: #CCC; border: 0px solid #CCC; } a { cursor: pointer; } a:link, a:visited, a:active { color: #0080C5; font-weight: normal; text-decoration: none; } a:hover { color: #00AEEF; font-weight: bolder; font-size: 18px; } .left { float: left; width: 265px; min-height: 360px; height: auto!important; height: 360px; position: relative; font-size: 10px; } .right { float: right; } #about-us .left { min-height: 455px; height: auto!important; height: 455px; } /* LAYOUT */ #wrapper { background: transparent url(../../_img/band.gif) top left repeat-x; } #header { height: 120px; border-top: 1px solid #fff; border-right: 4px solid #fff; border-left: 4px solid #fff; border-bottom: 1px solid #fff; width: 890px; background-color: transparent; background-image: url(../header.gif); background-repeat: no-repeat; background-position: left top; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; } #structure { width: 890px; padding: 0; font-size: 10px; height: 350px; margin-top: 20px; margin-right: auto; margin-bottom: 20px; margin-left: auto; } #logo { display: block; width: 134px; height: 30px; color: #fff; margin: 45px 0 0 30px; outline: 0; text-indent: -9999px; text-decoration: none; background: transparent url(../../_img/logo.gif) 0 0 no-repeat; } #logo:hover { background: transparent url(../../_img/logo.gif) 0 -40px no-repeat; } .left-col { min-height: 370px; height: 250px!important; height: 370px; width: 890px; line-height: 1.3em; float: none; background-color: #DADCC4; background-image: url(front.jpg); background-repeat: no-repeat; background-position: left top; } .corner { background: transparent url(../../_img/leftcol-bottom.gif) bottom left no-repeat; min-height: 370px; height: auto!important; height: 370px; } .padding { padding: 0 20px 15px 20px; } .left-col p { width: 250px; } #products .left-col p, #notfound .left-col p { width: 550px; } #folio .left-col { min-height: 400px; height: auto!important; height: 400px; } #folio .corner { background: transparent url(../../_img/leftcol-bottom.gif) bottom left no-repeat; min-height: 400px; height: auto!important; height: 400px; } #products .left-col, #notfound .left-col { min-height: 120px; height: auto!important; height: 120px; width: 600px; margin-bottom: 20px; margin-right: 20px; float: left; } #products .corner, #notfound .corner { background: transparent url(../../_img/leftcol-bottom.gif) bottom left no-repeat; min-height: 120px; height: auto!important; height: 120px; } #products .last { margin-bottom: 0 !important; } .product-item { width: 890px; position: relative; } .product-item img { width: 115px; height: 115px; float: left; margin-right: 8px; background: #DADCC4; border: 1px solid #DADCC4; margin-top: 20px; } .product-item hr { position: absolute; top: 0; right: 0; width: 300px; color: #dadcc4; height: 1px; border: none; border-top: 1px solid #dadcc4; border-collapse: collapse; } .product-item .corner img { padding: 0 0 0 25px; vertical-align: middles; height: 33px; width: 25px; background: transparent; border: none; float: right; margin-left: 8px; margin-top: 0; } #flash-movie, #folio-movie, #flash-movie2 { width: 280px; height: 350px; margin: 10px 30px 0 10px; float: left; position: relative; overflow: visible; background-image: url(../../../www.viewmasterglass.com.au/images/Frameless%202.jpg); display: block; } #flash-movie div, #folio-movie div, #flash-movie2 div { background: transparent url(../../_img/mask.png); top: 5px; left: 5px; font-size: 10px; position: absolute; width: 250px; padding: 5px 10px; } a.contact { display: block; width: 170px; height: 70px; border: 1px none #000; background: transparent url(../../_img/button.jpg) top left no-repeat; text-decoration: none; text-indent: -9999px; outline: 0; float: right; margin: 10px 0; } a.contact:hover { background: transparent url(../../_img/button.jpg) bottom left no-repeat; } #copyright { position: absolute; font-size: 14px; color: #666666; left: 627px; top: 515px; width: 146px; bottom: 6029430px; height: -225532183px; } /* SHOW AND TELL */ #show { font-size: 10px; color: #E4E4E3; margin: 0 auto; width: 890px; background-repeat: no-repeat; } #show a:link, #show a:visited, #show a:active { color: #666666; font-weight: normal; font-size: 14px; } #show a:hover { color: #00AEEF; font-weight: normal; } #show p { text-align: right; margin: 0; } #legal-link { float: left; color: #231F20; } #show #legal-link a { color: #231F20; } #show #legal-link a:hover { color: #BEB6A7; text-decoration: underline; } #show a.st { text-decoration: none; } p.top { text-align: right; margin: 10px 0 0 0; font-size: 10px; }/* HEADINGS */ h1 { font-size: 10px; color: #000000; font-weight: normal; line-height: 18px; padding: 11px 0; display: block; width: 890px; margin: 0 auto; text-align: right; color: #0080C5; } h2, h2.products { padding: 15px 0 10px 0; width: 250px; margin-bottom: 25px; font-size: 24px; line-height: 24px; height: 35px; } h2 { border-bottom: 1px solid #F4F3E8; } #index h2.products, #folio h2.products, #about-us h2.products { border: none; padding: 15px 0 0 35px; line-height: 24px; height: 35px; margin-bottom: 7px; } h2 .dif { color: #0080C5; } #products h2, #notfound h2 { width: 550px; } #products h3 { padding: 15px 0 0 0; margin-bottom: 10px; font-size: 16px; height: 25px; width: 550px; border-bottom: 1px solid #F4F3E8; } h4 { font-size: 12px; color: #000; margin: 15px 0 5px 0; } .sIFR-flash { visibility: visible !important; margin: 0; padding: 0; } .sIFR-unloading .sIFR-flash { visibility: hidden !important; } .sIFR-replaced, .sIFR-ignore { visibility: visible !important; } .sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; } .sIFR-replaced div.sIFR-fixfocus { margin: 0pt; padding: 0pt; overflow: auto; letter-spacing: 0px; float: none; } .sIFR-dummy { width: 0px; height: 0px; margin-left: 42px; z-index: 0; }/* NAVIGATION */ /* START MAIN NAV */ #nav { width: 890px; margin: 0 auto; height: 40px; background-color: transparent; background-image: url(../../../www.viewmasterglass.com.au/_img/nav.gif); background-repeat: no-repeat; background-position: left top; } #nav ul { margin: 0; padding: 0; list-style: none; height: 40px; } #nav ul li { margin: 0; padding: 0; float: left; background: transparent url(../../_img/divider.gif) top right no-repeat; } #nav ul li a { display: block; line-height: 18px; padding: 11px 0; text-align: center; outline: 0; text-decoration: none; text-indent: -9999px; } #nav-li-1 { width: 93px; } #nav-li-2 { width: 118px; } #nav-li-3 { width: 119px; } #nav-li-4 { width: 90px; } #nav-li-5 { width: 131px; } #nav-li-1 a { width: 90px; background: transparent url(../../_img/nav.gif) 0 0 no-repeat;} #nav-li-2 a { width: 115px; background: transparent url(../../_img/nav.gif) -98px 0 no-repeat;} #nav-li-3 a { width: 116px; background: transparent url(../../_img/nav.gif) -211px 0 no-repeat;} #nav-li-4 a { width: 87px; background: transparent url(../../_img/nav.gif) -334px 0 no-repeat;} #nav-li-5 a { width: 128px; background: transparent url(../../_img/nav.gif) -418px 0 no-repeat;} #nav-li-1 a:hover, #nav-li-1 a.active { width: 90px; background: transparent url(../../_img/nav.gif) 0 -40px; no-repeat;} #nav-li-2 a:hover, #nav-li-2 a.active { width: 115px; background: transparent url(../../_img/nav.gif) -98px -40px; no-repeat;} #nav-li-3 a:hover, #nav-li-3 a.active { width: 116px; background: transparent url(../../_img/nav.gif) -211px -40px; no-repeat;} #nav-li-4 a:hover, #nav-li-4 a.active { width: 87px; background: transparent url(../../_img/nav.gif) -334px -40px; no-repeat;} #nav-li-5 a:hover, #nav-li-5 a.active { width: 128px; background: transparent url(../../_img/nav.gif) -418px -40px; no-repeat;} /* END MAIN NAV */ /* OUR PRODUCTS / PROJECTS */ #our-products, #our-projects { float: left; width: 290px; min-height: 370px; height: auto!important; height: 370px; } #our-products ul, #our-projects ul { padding: 0; margin: 0; list-style: none; } #our-projects ul { padding-top: 6px; } #our-products ul li { padding: 0; margin: 0; border-bottom: 1px solid #DADCC4; } #our-projects ul li { padding: 4px 0 4px 35px; font-size: 12px; border-bottom: 1px solid #DADCC4; margin: 0; } #our-products ul#img { border: 1px none #000; width: 250px; margin: 0 auto; padding-top: 20px; } #our-products ul#img li { float: left; border: none; padding: 10px 15px; } #our-products ul#img li a { opacity: 0.99; display: block; } #our-products ul#img li a:hover { opacity: 0.7; } #our-products ul#list li a { display: block; padding: 10px 0 10px 35px; line-height: 15px; color: #666667; font-size: 12px; text-decoration: none; background: transparent url(../../_img/arrow.gif) 260px 11px no-repeat; outline: 0; } #our-products ul#list li a:hover { color: #000; background: transparent url(../../_img/arrow.gif) 260px -24px no-repeat; } ul#list li div.element { border-top: 1px solid #dddddd; padding-bottom: 10px; } ul#list li div.element p { color: #666; font-size: 10px; padding-left: 35px; margin-bottom: 0; } /* END PRODUCTS /PROJECTS */ /* FORMS */ #contact-us .left-col { width:550px; } #contact-us .left-col h2 { width: 490px; } #contact-us #form h2 { border-bottom: none; margin-bottom: 0; } #contact-us .contact-holder { padding: 0 10px 0 30px; min-height:370px; height:auto !important; height: 370px; } div.error { border: 1px solid #cc0000; padding: 15px; background: #f4f3e8; margin-bottom: 15px; } div.error h3 { margin: 0 0 8px 0; font-size: 12px; font-weight: normal; } div.error ul { margin: 8px 0 0 0; font-size: 11px; line-height: 15px; } .required { color: #017fc2; } .vcard h3.fn { font-weight: bold; margin: 0 0 13px 0; font-size: 12px; height: 25px; } #contact-us .left-col dl { margin: 10px 0; } #contact-us .left-col dl.large { margin: 10px 0; line-height: 16px; } #contact-us .left-col dl dt { float: left; width: 20px; font-weight: bold; color: #017fc2; } #contact-us .left-col dl.large dt { width: 45px; } #contact-us .left-col a { color: #000; } #form { float: left; width: 300px; padding-left: 35px; } #form form { margin: 0; padding: 0; } #form form p { font-size: 11px; } #form fieldset { margin: 0; padding: 0; border: none; font-size: 11px; padding: 5px 0; } #form dl dt { float: left; width: 70px; min-height: 22px; height: auto !important; height: 22px; } #form dl dd { min-height: 22px; height: auto !important; height: 22px; } #form dl dt.ta { float: none; margin-top: 5px; width: auto; } #form dl dd.service { margin-left: 70px; margin-bottom: 10px; } #form input.fieldset { border: 1px solid #999; width: 220px; padding: 1px 2px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; background: #fff !important; } #form dl.inputs input:focus, #form dl.inputs input.focus { border: 1px solid #017fc2; background: #fefefe !important; } #form textarea { border: 1px solid #999; width: 290px; height: 100px; padding: 1px 2px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; background: #fff !important; } #form textarea:focus, #form textarea.focus { border: 1px solid #017fc2 !important; background: #fefefe; } #form input.fieldset.error, #form textarea.error { border: 1px solid #cc0000; } button { background: #017fc2; border: none; text-transform: lowercase; color: #FFF; cursor: pointer; font-size: 12px; line-height: 10px; padding: 5px 10px; font-family: Arial, Helvetica, sans-serif; margin: 5px 0 0 225px; width: 70px; } button:hover, button.hover { background: #40a0d4; } input.checkbox:focus, input.checkbox.focus { border: none; outline: none; }