/* ---------- Grafix Photography / Aperture Dark ---------- */ html, body { margin:0; padding:0; } body { font-family:helvetica,arial,sans-serif; font-size:14px; color:#808080; line-height:20px; background:#1A1A1A url('pictures/gs_webgraphics/bodybg.jpg') center top repeat-x; } form { } form, div, table, td { margin:0; padding:0; } a { color:#66B3FF; } a:visited { color:#66B3FF; } a:hover { color:orange; } a img { border:none; outline:none; } p, ul { padding:10px 0; margin:0; } ul li { margin:0 0 0 20px; } h1 { padding:10px 0; margin:0; font-weight:normal; font-style:normal; font-size:30px; line-height:30px; color:white; } h2 { padding:10px 0; margin:10px 0 -10px 0; font-weight:normal; font-style:normal; font-size:18px; line-height:30px; color:white; } h3 { padding:10px 0; margin:10px 0 -10px 0; font-weight:bold; font-style:normal; font-size:14px; line-height:20px; color:white; } strong { font-weight:bold; } blockquote { padding:0 0 0 40px; margin:0 0 0 -40px; font-style:italic; background:url('pictures/gs_webgraphics/blockquotebg.png') top left no-repeat; -pie-background:url('pictures/gs_webgraphics/blockquotebg.png') top left no-repeat; behavior:url('pictures/gs_webgraphics/PIE.htc'); } a.Button { display:inline-block; padding:3px 10px; line-height:20px; text-decoration:none; font-weight:bold; font-size:14px; color:white; background:#404040; } a.Button { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } a.Button { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } a:visited.Button { color:white; } a:hover.Button { color:orange; } /* ------------------------------------------------------------------ Main Elements */ #Wrapper { width:960px; margin:0 auto; } #Container { } #PageHeader { position:relative; height:200px; } #MainArea { padding:0; } #MainAreaBottom { clear:both; } #MainAreaTop { } #PageContent { } body.GALLERY #flashcontent { width:980px; height:575px; margin:-10px -10px -10px -10px; } body.MONOSLIDE #flashcontent { width:960px; height:480px; } body.MONOSLIDE #flashcontent { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } body.MONOSLIDE #flashcontent { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } #MainArea img#MainImage_TheImage { } #MainArea img#MainImage_TheImage { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } #MainArea img#MainImage_TheImage { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } #MainArea #MainImage .Caption { display:none; } #MainImage table td { border:0; } .SlideshowImage .caption, .SlideshowImage .id {display:none;} /* ------------------------------------------------------------------ AD Gallery */ /* Main gallery elements */ .ad-gallery { width:960px; } .ad-gallery * { margin:0; padding:0; } .ad-gallery .ad-image-wrapper { width:100%; height:480px; padding:0 0 20px 0; position:relative; overflow:hidden; } /* Loading icon */ .ad-gallery .ad-image-wrapper .ad-loader { width:24px; height:24px; position:absolute; z-index:10; top:50%; left:50%; margin:-12px 0 0 -12px; background:black; border:10px solid black; } /* Next / Previous image buttons */ .ad-gallery .ad-image-wrapper .ad-next { display:block; width:25%; height:100%; position:absolute; right:0; top:0; cursor:pointer; z-index:100; } .ad-gallery .ad-image-wrapper .ad-prev { display:block; width:25%; height:100%; position:absolute; left:0; top:0; cursor:pointer; z-index:100; } .ad-gallery .ad-image-wrapper .ad-prev, .ad-gallery .ad-image-wrapper .ad-next { background:url(non-existing.jpg)\9 } /* Or else IE will hide it */ .ad-gallery .ad-image-wrapper .ad-next .ad-next-image { background:url('pictures/gs_webgraphics/ad_nav_next.png') center center no-repeat; width:50px; height:100px; display:none; position:absolute; top:50%; right:0; margin:-50px 0 0 0; z-index:101; } .ad-gallery .ad-image-wrapper .ad-prev .ad-prev-image { background:url('pictures/gs_webgraphics/ad_nav_prev.png') center center no-repeat; width:50px; height:100px; display:none; position:absolute; top:50%; left:0; margin:-50px 0 0 0; z-index:101; } /* Main image */ .ad-gallery .ad-image-wrapper .ad-image { position:absolute; overflow:visible; top:0; left:0; z-index:9; -moz-box-shadow:1px 4px 6px #BFBFBF; -webkit-box-shadow:1px 4px 6px #BFBFBF; box-shadow:1px 4px 6px #BFBFBF; } .ad-gallery .ad-image-wrapper .ad-image a img { } /* Meta data */ .ad-gallery .ad-image-wrapper .ad-image .ad-image-description { width:auto; height:20px; position:absolute; bottom:-25px !important; left:10px; z-index:200; color:white; text-align:center; } .ad-gallery .ad-image-wrapper .ad-image .ad-description-title { display:none; } /* Controls */ .ad-gallery .ad-controls { height:20px; display:none; } .ad-gallery .ad-info { float:left; } .ad-gallery .ad-slideshow-controls { float:right; line-height:20px; } .ad-gallery .ad-slideshow-controls .ad-slideshow-start { padding-left:5px; cursor:pointer; } .ad-gallery .ad-slideshow-controls .ad-slideshow-stop { padding-left:5px; cursor:pointer; } .ad-gallery .ad-slideshow-controls .ad-slideshow-countdown { padding-left:5px; font-size:0.9em; } .ad-gallery .ad-slideshow-running .ad-slideshow-start { cursor:default; font-style:italic; } /* Thumbnail nav */ .ad-gallery .ad-nav { width:930px; padding:0; margin:5px 0 -5px 15px; position:relative; } .ad-gallery .ad-back { display:block; width:30px; height:100%; position:absolute; top:0; left:-15px; z-index:10; cursor:pointer; background:url('pictures/gs_webgraphics/ad_thumbs_prev.png') left center no-repeat; } .ad-gallery .ad-forward { display:block; width:30px; height:100%; position:absolute; top:0; right:-15px; z-index:10; cursor:pointer; background:url('pictures/gs_webgraphics/ad_thumbs_next.png') right center no-repeat; } .ad-gallery .ad-nav .ad-thumbs { overflow:hidden; width:100%; } .ad-gallery .ad-thumbs .ad-thumb-list { float:left; width:9000px; list-style:none; } .ad-gallery .ad-thumbs li { float:left; } .ad-gallery .ad-thumbs li a { display:block; outline:0; padding:5px; } .ad-gallery .ad-thumbs li a img { display:block; padding:0px; border:0; } .ad-gallery .ad-thumbs li a.ad-active img { border:5px solid black; margin:-5px; } /* Can't do display none, since Opera won't load the images then */ .ad-preloads { position:absolute; left:-9000px; top:-9000px; } /* ------------------------------------------------------------------ Extras */ #ExtraText { width:920px; padding:0; position:absolute; top:5px; left:50%; margin:0 0 0 -460px; font-size:12px; color:white; background:#75C3CD; z-index:10; } #ExtraFooter { width:960px; padding:0; margin:10px auto; font-size:12px; color:white; } /* ------------------------------------------------------------------ Header */ /* Stripey bits */ #HeaderStripesTop { width:960px; height:50px; position:absolute; top:0; left:0; background:url('pictures/gs_webgraphics/stripes.png'); -pie-background:url('pictures/gs_webgraphics/stripes.png'); behavior:url('pictures/gs_webgraphics/PIE.htc'); } #HeaderStripesBottom { width:960px; height:10px; position:absolute; bottom:20px; left:0; background:url('pictures/gs_webgraphics/stripes.png'); -pie-background:url('pictures/gs_webgraphics/stripes.png'); behavior:url('pictures/gs_webgraphics/PIE.htc'); } /* Logo link */ #LogoLink { display:block; padding:0; position:absolute; top:50px; left:0px; margin:0; outline:none; z-index:1; } /* Main nav */ #PageHeader { position:relative; } #PageHeader .PageMenu { padding:50px 0 30px 0; } #PageHeader .PageMenu .Alignment { padding:40px 0; float:right; line-height:40px; } #PageHeader .PageMenu .MenuItem { float:left; padding:0 0 0 21px; background:url('pictures/gs_webgraphics/nav_separator.png') left center no-repeat; -pie-background:url('pictures/gs_webgraphics/nav_separator.png') left center no-repeat; behavior:url('pictures/gs_webgraphics/PIE.htc'); } #PageHeader .PageMenu .MenuItem.First { padding:0; background:none; -pie-background:none; } #PageHeader .MenuItem a { display:block; margin:0; color:#808080; text-decoration:none; font-size:12px; } #PageHeader .MenuItem a:hover { color:orange; } body.CLIENTALBUM #PageHeader .PageMenu .MenuItem.aid_CLIENTAREA a, body.CLIENTALBUM #PageHeader .PageMenu .MenuItem.aid_CLIENTAREA-LIST a, #Wrapper #PageHeader .PageMenu .MenuItem a.Selected { color:white; } /* ------------------------------------------------------------------ Footer */ #PageFooter { display:none; } #Footer { padding:25px 0 0 0; margin:0; overflow:auto; font-size:11px; line-height:30px; color:white; } #Footer a { color:inherit; text-decoration:none; } #Footer a:hover { color:orange; } #Footer .Phosys { float:right; padding:10px 0; } #Footer .Copyright { float:left; padding:10px 0; } #FooterStripesTop { clear:both; width:960px; height:10px; margin:0; background:url('pictures/gs_webgraphics/stripes.png'); -pie-background:url('pictures/gs_webgraphics/stripes.png'); behavior:url('pictures/gs_webgraphics/PIE.htc'); } #FooterStripesBottom { clear:both; width:960px; height:160px; margin:0; background:url('pictures/gs_webgraphics/stripes.png'); -pie-background:url('pictures/gs_webgraphics/stripes.png'); behavior:url('pictures/gs_webgraphics/PIE.htc'); } /* ------------------------------------------------------------------ PageContent */ /* Stripey bits */ #PageContentStripes { width:960px; height:10px; margin:20px 0 25px 0; background:url('pictures/gs_webgraphics/stripes.png'); -pie-background:url('pictures/gs_webgraphics/stripes.png'); behavior:url('pictures/gs_webgraphics/PIE.htc'); } /* Default */ #MainArea #PageContent { } #MainArea #PageContent .Content { padding:20px 0px; float:left; } #MainArea #PageContent .Content.A { width:600px; padding:0 40px 0 0; } #MainArea #PageContent .Content.B { width:280px; padding:0 0 0 40px; } #MainArea #PageContent .Content.C { display:none; } /* alt */ body.ALT #MainArea #PageContent { float:left; } body.ALT #MainArea #PageContent .Content { float:left; } body.ALT #MainArea #PageContent .Content.A { width:280px; padding:0 0 0 40px; } body.ALT #MainArea #PageContent .Content.B { display:none; } body.ALT #MainArea #PageContent .Content.C { display:none; } body.ALT #PageContentStripes { display:none; } /* ------------------------------------------------------------------ AlbumList */ #AlbumList { width:600px; padding:0 40px 0 0; float:left; } #AlbumList .Row { padding:10px 0 0 0; margin:0; clear:both; background:url('pictures/gs_webgraphics/stripes.png') top repeat-x; cursor:pointer; } #AlbumList .Row .ThumbTable { width:150px; height:150px; float:left; } #AlbumList .Row .ThumbTable .Image { } #AlbumList .Row .ThumbTable .Image { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } #AlbumList .Row .ThumbTable .Image { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } #AlbumList .Row .Title { width:430px; float:left; margin:40px 20px 0 0; font-size:18px; color:white; } #AlbumList .Row .Description { width:430px; float:left; margin:10px 20px 0 0; } #AlbumList .Row .Button { display:none; } #AlbumList .Row:hover .Title { color:orange; } /* ------------------------------------------------------------------ Login Popup */ .LoginMenu { text-align:right; background-color:#404040; color:white; padding:5px; } .LoginMenu { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } .LoginMenu { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } .LoginMenuHeading { text-align:center; margin:0 auto; font-weight:bold; } .LoginMenuHeading img { display:none; } .LoginMenuSubmit { padding:5px; text-decoration:none; cursor:pointer; text-align:center; color:white; } .LoginMenuSubmitOver { padding:5px; text-decoration:none; cursor:pointer; text-align:center; color:orange; } /* ------------------------------------------------------------------ Login form */ #AlbumLogin { display:inline; } #AlbumLogin .Row { display:inline; } #AlbumLogin .Label { display:none; } #AlbumLogin .Field { display:inline; } #AlbumLogin .Footer { display:inline; } #AlbumLogin .Row.Password { display:none; } #AlbumLogin .Row.UserID { display:none; } #AlbumLogin .Row input { padding:5px; } /* ------------------------------------------------------------------ Album Image List & Pagination */ #MainArea #ImageList { width:600px; padding:20px 40px 0 0; float:left; } #MainArea #ImageList #Images { } #MainArea #ImageList .Item { width:150px; height:170px; padding:0; float:left; text-align:center; } #MainArea #ImageList .Item table { width:150px; } #MainArea #ImageList .Item td { margin:0; padding:0; border-collapse:collapse; } #MainArea #ImageList .Item .Caption { display:block; font-size:10px; line-height:10px; color:#808080; } #MainArea #ImageList img { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } #MainArea #ImageList img { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } #MainArea #ImageList .Item .LightBox { display:inline; text-indent:-999em; } #MainArea #ImageList .Item .LightBox a { display:none; } #MainArea #ImageList .Footer { clear:both; overflow:auto; } #MainArea .Pager { clear:both; width:95%; margin:0 auto; padding:10px 0; overflow:auto; } #MainArea .Pager .Button { background:none; width:auto; margin:0; clear:none; padding:2px; } #MainArea .Pager .Next { float:right; text-decoration:underline; margin:3px 0 0 0; } #MainArea .Pager .Previous { float:left; text-decoration:underline; margin:3px 0 0 0; } /* Pagination */ .Pages { width:100px; margin:0 auto; } .Pages ul { margin:0; padding:0; } .Pages li { margin:0 0 0 10px; padding:0; } .Pages .Button { border:none; } .Pager .Button { border:none; } .Pages a { text-decoration:underline; text-align:center; } .Pages ul ul a { display:inline; text-decoration:none; text-align:center } .Pages ul li ul li a { text-align:left; white-space:nowrap; color:white; } .Pages ul { padding:0; margin:0; list-style-type:none; display:block; margin:0 auto; } .Pages li { float:left; width:auto; position:absolute; } .Pages ul ul { visibility:hidden; position:absolute; height:150px; top:-150px; left:0; width:100px; background:#404040; overflow:hidden; } * html .Pages ul ul { top:-165px; } /*\*/ html>body*.Pages ul ul {overflow:auto;} /**/ .Pages table { position:relative; top:0; left:0; border-collapse:collapse; } .Pages ul ul li, .Pages ul ul a { height:auto; line-height:1em; padding:5px 0px; width:70px; text-align:left; } .Pages ul ul li { top:0px; position:relative;} .Pages ul ul li:hover, .Pages a:hover { color:orange; } .Pages ul ul a:hover, .Pages ul ul :hover > a { color:orange; } .Pages ul li:hover ul, .Pages ul a:hover ul, .Pages ul ul a:hover {visibility:visible; overflow:auto;} .Pages ul ul ul a, .Pages ul ul ul a:visited { height:auto; line-height:1em; padding:5px 0px; width:70px; } .Pages ul ul ul a:hover { } .Pages ul li:hover ul, .Pages ul a:hover ul {visibility:visible;} .Pages ul a:hover ul ul, .Pages ul :hover ul ul { visibility:hidden; position:absolute; height:0; left:50px; top:0; } .Pages ul :hover ul :hover ul, .Pages ul a:hover ul a:hover ul { visibility:visible; } .Pages .Selected { font-weight:bold; } .Pages ul ul ul { height:220px !important; width:auto; z-index:500; padding-top:1px; } /* ------------------------------------------------------------------ Image Popup Window */ .PopupBody { } #PopupWindow .ImageControls { overflow:auto; padding:5px 2px 0 2px; } #PopupWindow .ImageControls .Button { background:transparent; border:0; font-size:12px; padding:0; color:white; } #PopupWindow .ImageControls .Button:hover { color:orange;} #PopupWindow .ImageControls .Button { -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; behavior:none; } #PopupWindow .ImageControls .Button { } #PopupWindow .ImageControls .Previous { float:left; } #PopupWindow .ImageControls .Next { float:right; } #PopupWindow .ImageFilter { margin:5px 0 -25px 0; text-align:center; } #PopupWindow .CaptionBottom { display:block; line-height:20px; text-align:center; margin:-20px 0 0 0; } #PopupWindow img#MainImage_TheImage { } #PopupWindow img#MainImage_TheImage { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } #PopupWindow img#MainImage_TheImage { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } /* ------------------------------------------------------------------ Add to basket popup */ /* The button */ #MetaData span.Button { display:inline-block; padding:3px 10px; margin:0 0 10px 0; line-height:20px; text-decoration:none; font-weight:bold; font-size:14px; color:white; background:#404040; cursor:pointer; } #MetaData span.Button { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } #MetaData span.Button { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } #MetaData span.Button:hover { color:orange; } .MetaData { float:left; text-align:left; background:#404040; padding:5px; font-size:14px; border:3px solid #404040; } .MetaData .MetaDataTitle { font-size:14px; text-align:left; line-height:25px; color:white; font-weight:bold; } .MetaData .MetaDataField { font-size:14px; color:white; line-height:25px; } .MetaData .MetaDataFieldOver { font-size:14px; cursor:pointer; line-height:25px; color:orange; } .MetaData .MetaDataHeading { font-size:14px; color:white; line-height:25px; font-weight:bold; } .MetaData .MetaDataCommand { font-size:14px; text-align:right; color:white; line-height:25px; } .MetaData .MetaDataCommandOver { font-size:14px; cursor:pointer; color:orange; text-align:right; line-height:25px; } .MetaData .MetaDataBasket { font-size:14px; color:white; line-height:25px; } .MetaData .MetaDataBasketOver { font-size:14px; color:white; line-height:25px; } /* ------------------------------------------------------------------ Shopping Cart */ #ShoppingCart { width:600px; padding:20px 40px 0 0; float:left; } #ShoppingCart .Header { color:white; font-weight:bold; } #ShoppingCart .Header .Thumbnail { display:none; } #ShoppingCart .Header .Product { display:none; } #ShoppingCart .Header .Option { float:left; text-align:left; width:350px; text-indent:-9999em; } #ShoppingCart .Header .Price { float:left; text-align:right; width:70px; } #ShoppingCart .Header .Quantity { float:left; text-align:right; width:70px; } #ShoppingCart .Header .Total { float:left; text-align:right; width:70px; } #ShoppingCart .Header .Remove { float:left; text-align:right; width:40px; } #ShoppingCart .List { overflow:auto; clear:both; } #ShoppingCart #BasketList_List { width:100%; } #ShoppingCart .Quantity input { text-align:right; width:45px; } #ShoppingCart .Row { padding:10px 0 0 0; margin:0; overflow:auto; clear:both; font-size:12px; background:url('pictures/gs_webgraphics/stripes.png') top repeat-x; -pie-background:url('pictures/gs_webgraphics/stripes.png') top repeat-x; behavior:url('pictures/gs_webgraphics/PIE.htc'); } #ShoppingCart .Row .Thumbnail table { width:150px; height:150px; } #ShoppingCart .Row .Thumbnail img { -moz-box-shadow:1px 4px 6px #080808; -webkit-box-shadow:1px 4px 6px #080808; box-shadow:1px 4px 6px #080808; } #ShoppingCart .Row .Thumbnail img { behavior:url('pictures/gs_webgraphics/PIE.htc'); position:relative; } #ShoppingCart .Row .Thumbnail { float:left; text-align:center; width:150px; } #ShoppingCart .Row .Product { display:none; } #ShoppingCart .Row .Option { float:left; text-align:left; padding:30px 0 0 0; width:200px; font-weight:bold; } #ShoppingCart .Row .Price { float:left; text-align:right; padding:30px 0 0 0; width:70px; } #ShoppingCart .Row .Quantity { float:left; text-align:right; padding:30px 0 0 0; width:70px; } #ShoppingCart .Row .Total { float:left; text-align:right; padding:30px 0 0 0; width:70px; } #ShoppingCart .Row .Remove { float:left; text-align:right; padding:30px 0 0 0; width:40px; } #ShoppingCart .Footer { padding:10px 0 0 0; background:url('pictures/gs_webgraphics/stripes.png') top repeat-x; -pie-background:url('pictures/gs_webgraphics/stripes.png') top repeat-x; behavior:url('pictures/gs_webgraphics/PIE.htc'); } #ShoppingCart .Footer .Total { margin:20px 0 0 410px; font-size:24px; width:150px; text-align:right; color:white; } #ShoppingCart .Footer .Button { float:right; margin:40px 0px 20px 20px; clear:none; } /* ------------------------------------------------------------------ Contact form */ #ContactForm { width:600px; padding:20px 40px 0 0; margin:0; float:left; } #ContactForm .Row { display:block; padding:5px 10px; overflow:hidden; } #ContactForm .Row .Label { display:block; } #ContactForm .Row .Field { } #ContactForm .Row input { width:250px; padding:5px; } #ContactForm .Row select { width:250px; padding:5px; } #ContactForm .Row textarea { width:350px; padding:5px; height:80px; } #ContactForm .Row input, #ContactForm .Row select, #ContactForm .Row textarea { padding:7px; font-size:12px; font-family:courier,mono; color:#404040; } .VAMRequiredFieldMarker { display:inline-block; width:15px; height:20px; background:url('pictures/gs_webgraphics/required.png') center center no-repeat; } .VAMRequiredFieldMarker img { display:none; } #ContactForm .Footer { clear:both; padding:15px 10px; } /* ------------------------------------------------------------------ */ // from System Meta Data