/* screen styles from template version 1.0 */ /* NOTE: any * > selector rules are for standards-compliant browsers. The rule before will have a style that works in IE6. */ /* NOTE: any * html selector rules are for IE6. */ /* Table of Contents Non-displaying Elements Layout Page Specific Layout Collection Pages Product Pages Typography and Inline Elements Page Specific Typography Navigation Specific Nav Button Styling */ /* Non-displaying Elements*/ /* *************************************************************************************** */ .layout-home #branding { display:none; } #nav-main a, #nav-secondary a, #rss a { text-indent:-9999px; overflow:hidden } /* moves text inside menu anchors off screen. Remove if not using graphics for menu links. */ /* Layout */ /* *************************************************************************************** */ body { font-size:0.875em; /* makes font a specific size... must find it... */ text-align:center; background: #FFF url(../images/bg.png) repeat center top; } #container { height:auto; margin:0 auto; position:relative; text-align:left; } #branding { position: relative; width: 868px; margin: 0px auto; height: 100px; padding-top: 20px; background:no-repeat 320px 0px; } * html #branding-logo img { display:none } #branding-logo img:hover { background:url(../images/thumbprint_transparent.png) no-repeat 165px 5px } #content { clear:left; float:left; width:100%; min-height:200px; background: #FFF; padding:30px 0 60px 0; } #content div.inner-wrap { width:766px; padding-left:102px; } #footer { clear:left; float:left; width:100%; border-top: 4px solid #EC118F; margin-bottom:2em; padding-bottom:1em; } #footer:hover { border-bottom: 1px solid #EC118F; background-image:url(../images/footer-transparent_overlay.png) } * html #footer { background-color:#FFF; border-bottom: 1px solid #EC118F; } #footer div.inner-wrap { width:766px; padding-left:102px; } #footer-purse { margin: -5px 1em 1em 0; margin-left:-30px; float:left; } * html #footer-purse { display:none } #rss-subscribe { display:block; width:102px; height:19px; background: url(../images/rss.png) no-repeat left top; float:left; margin-right:10px } #rss-learn_more { display:block; width:19px; height:19px; background: url(../images/rss.png) no-repeat -108px top; } div.inner-wrap { margin: 0 auto; text-align: left; width: 868px; } .column { width:45% } .add_to_cart { width:128px; border:solid 0 white } .add_to_cart * { border:solid 0 white } /* Page Specific Layout */ /* use a class on the body to change specific parts of the layout based on portions of the website (e.g. user vs. admin) */ body.layout-home { background: #000 url(../images/menu_bg.png) repeat-x 0 -7px; } .layout-home #nav-main a { margin-right:50px; } .layout-home #btn-showroom_collections {margin-left:0} .layout-home a#btn-gallery {margin-right:0} .layout-home #container { width:870px; margin:0 auto; background-color: transparent; } .layout-home #nav-main { position:absolute; top:-7px; height: 75px; } .layout-home #content { background-color:transparent } #showroom_flash { width: 870px; position: absolute; top: 125px; left: 0px; } #garagedoor { width: 870px; height:560px; position: absolute; top: 125px; left: 0px; margin: 10px auto; list-style: none; overflow: hidden; } #door { position:absolute; margin-top: 0px; } #garagedoor{ -webkit-opacity:0.0; -moz-opacity:0.0; opacity:0.0; -webkit-transition-delay: 999s; -moz-transition-delay: 999s; -o-transition-delay: 999s; transition-delay: 999s; -webkit-transition-duration: 999s; -moz-transition-duration: 999s; -o-transition-duration: 999s; transition-duration: 999s; } *:hover #garagedoor { -webkit-opacity:1.0; -moz-opacity:1.0; opacity:1.0; -webkit-transition-delay: 1s; -moz-transition-delay: 1s; -o-transition-delay: 1s; transition-delay: 1s; -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } } #garagedoor img { width: 870px; height: 560px; display: block; float: left; } #simpleTooltip { padding: 7px 15px; border-style:solid; border-color:#ec118f; border-width:10px 0 1px; background-color:#fde7f4; text-align:center; -moz-box-shadow: 1px 1px 2px #000; -webkit-box-shadow: 1px 1px 2px #000; box-shadow: 1px 1px 2px #000; } /* Collection Pages */ /* Page should have class=layout-collection */ .layout-collection .products { margin-left: -34px; overflow : hidden; margin-bottom: 0px; } * html .layout-collection .products { margin-left:-68px; width:868px } .layout-collection .product { width: 210px; float: left; margin:0 0 34px 34px; height:220px; border: 1px solid #FDE7F4; padding: 10px; } .layout-collection .product p { font-weight: bold; color: #EC118F; text-align: center; margin-bottom: 0px; margin-top: 0.5em; } /* Product Pages */ /* Page should have class=layout-product */ .layout-product #images { float:left; width: 409px; overflow: hidden; } .layout-product #main_product_img { margin-bottom:25px; float:left; } .layout-product .thumbnails p { font-size:0.8em; margin: 0; } .layout-product .thumbnails img { margin:0 23px 23px 0; border: 1px solid #CCC; } .layout-product #product-info { float:right; width: 350px; } #dev-server_message { position:absolute; width:100%; z-index:100; left:0; bottom:0; padding:1em; text-align:left } * > #dev-server_message { position:fixed; } #dev-server_message:hover { background-color:transparent; border-top:none } .photo-gallery { margin-left: -34px; margin-bottom: 0px; list-style:none } .photo-gallery a { text-decoration:none; display:block; color:rgba(236, 17, 143, 1) } .photo-gallery a img {width:210px; height:210px;} .photo-gallery li { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; clear: right; float: left; font-size: 11px; line-height: 1.4em; margin: 0 0 34px 34px; padding: 11px; width: 210px; -moz-transition: all .4s ease-in-out; -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out;} .photo-gallery li:hover { background-color:#fde7f4; background:rgba(253, 231, 244, 1); -moz-transform: scale(1.1) rotate(-2deg); -webkit-transform: scale(1.3);} /* Typography and Inline Elements */ /* *************************************************************************************** */ div.state:target { background-color:#FDE7F4 } div.state:target h2 { color:#EC118F } div.state:hover { background-color:#EFEFEF } div.state:hover h2 { color:#EC118F } /* Page Specific Typography */ /* use a class on the to change specific typographic elements (e.g.

backgrounds) */ .layout-home h1 { display:none } /* Navigation */ /* placement of navigation */ /* *************************************************************************************** */ #nav-main { float: left; width: 100%; background:#FFFFFF url(../images/menu_bg.png) repeat-x; padding-top:7px; height:82px; overflow:hidden; } #nav-main div.inner-wrap { width:794px; width:851px; padding-left:74px; } #nav-main ul { list-style: none inside; margin: 0px; } /* used to get the "current collection" button to be over the logo */ #nav-main ul, #nav-main li, #nav-secondary ul, #nav-secondary li {/* fix IE6 and IE7 List bug */ display: inline; margin:0; } /* Specific Nav Button Styling */ /* used if buttons use images instead of text or combined with text */ #nav-main a { background-image:url(../images/menu.png); background-repeat:no-repeat; display:block; height:72px; float:left; margin-right:30px; margin-right:32px } #btn-showroom_collections { background-position:0px 0; width:191px; margin-left:15px; margin-left:43px } #btn-in_the_press { background-position:-192px 0; width:97px } #btn-about { background-position:-290px 0; width:125px } #btn-customer_service { background-position:-416px 0; width:122px; } a#btn-gallery { background-position:-539px 0; width:132px; margin-right:0; } #btn-showroom_collections:focus, #btn-showroom_collections:hover, #btn-showroom_collections:active { background-position:0 -72px; } #btn-in_the_press:focus, #btn-in_the_press:hover, #btn-in_the_press:active { background-position:-192px -72px } #btn-about:focus, #btn-about:hover, #btn-about:active { background-position:-290px -72px; } #btn-customer_service:focus, #btn-customer_service:hover, #btn-customer_service:active { background-position:-416px -72px; } #btn-gallery:focus, #btn-gallery:hover, #btn-gallery:active { background-position:-539px -72px; } #view_cart { text-indent:-9999px; display:block; float:left; overflow:hidden; width:95px; height:22px; padding:0; margin:0 0 0 5px; background-image:url(../images/menu-secondary.png); background-repeat:no-repeat; background-position:-61px 0; cursor: pointer; } #view_cart:focus, #view_cart:hover, #view_cart:active { background-position:-61px -22px } #view_cart_btn { border:none; display:block; text-indent:-9999px; height:22px; width:95px; margin:0; padding:0; } #nav-secondary { height: 25px; float: left; width: 100%; padding-top:0px; overflow:hidden; background-color:#FFF } #nav-secondary div.inner-wrap { width:334px; margin:0 auto; padding-left:538px } #nav-secondary a { margin-left:5px; height:22px; background-image:url(../images/menu-secondary.png); background-repeat:no-repeat; display:block; float:left; } #btn-home { width:56px; background-position:0 0; } #btn-facebook { width:69px; background-position:-258px 0; } #btn-coverage { width:94px; background-position:-159px 0; } #btn-home:focus, #btn-home:hover { background-position:0 -22px; } #btn-coverage:focus, #btn-coverage:hover { background-position:-159px -22px; } #btn-facebook:focus, #btn-facebook:hover, #btn-facebook:active { background-position:-258px -22px; }