/*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ CSS File name : fozimage.css ------------------------------------------*/ /*------------------------------ Author : Ian Foster ------------------------------------------*/ /*------------------------------ Version : 1.0 ------------------------------------------*/ /*------------------------------ Date : October 2006 ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------- Lightbox CSS -----------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ #lightbox{ position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;} #lightbox img{ width: auto; height: auto;} #lightbox a img{ border: none; } #outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; } #imageContainer{ padding: 10px; } #loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } #hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } #imageContainer>#hoverNav{ left: 0;} #hoverNav a{ outline: none;} #prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; } #prevLink { left: 0; float: left;} #nextLink { right: 0; float: right;} #prevLink:hover, #prevLink:visited:hover { background: url(../FozimageLBox/prevlabel.gif) left 15% no-repeat; } #nextLink:hover, #nextLink:visited:hover { background: url(../FozimageLBox/nextlabel.gif) right 15% no-repeat; } #imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100% ; } #imageData{ padding:0 10px; color: #666; } #imageData #imageDetails{ width: 70%; float: left; text-align: left; } #imageData #caption{ font-weight: bold; } #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; } #imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; outline: none;} #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; } /*---------------------------------------------------------------------------------------------------------*/ /*----------------------------- End lightbox CSS ---------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------- PrettyPhoto CSS -----------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------ This you can edit. ------------------------------------------------------------------------- */ /* ---------------------------------- Default Theme ----------------------------------- */ div.pp_default .pp_top, div.pp_default .pp_top .pp_middle, div.pp_default .pp_top .pp_left, div.pp_default .pp_top .pp_right, div.pp_default .pp_bottom, div.pp_default .pp_bottom .pp_left, div.pp_default .pp_bottom .pp_middle, div.pp_default .pp_bottom .pp_right { height: 13px; } div.pp_default .pp_top .pp_left { background: url(../images/prettyPhoto/default/sprite.png) -78px -93px no-repeat; } /* Top left corner */ div.pp_default .pp_top .pp_middle { background: url(../images/prettyPhoto/default/sprite_x.png) top left repeat-x; } /* Top pattern/color */ div.pp_default .pp_top .pp_right { background: url(../images/prettyPhoto/default/sprite.png) -112px -93px no-repeat; } /* Top right corner */ div.pp_default .pp_content .ppt { color: #f8f8f8; } div.pp_default .pp_content_container .pp_left { background: url(../images/prettyPhoto/default/sprite_y.png) -7px 0 repeat-y; padding-left: 13px; } div.pp_default .pp_content_container .pp_right { background: url(../images/prettyPhoto/default/sprite_y.png) top right repeat-y; padding-right: 13px; } div.pp_default .pp_content { background-color: #fff; } /* Content background */ div.pp_default .pp_next:hover { background: url(../images/prettyPhoto/default/sprite_next.png) center right no-repeat; cursor: pointer; } /* Next button */ div.pp_default .pp_previous:hover { background: url(../images/prettyPhoto/default/sprite_prev.png) center left no-repeat; cursor: pointer; } /* Previous button */ div.pp_default .pp_expand { background: url(../images/prettyPhoto/default/sprite.png) 0 -29px no-repeat; cursor: pointer; width: 28px; height: 28px; } /* Expand button */ div.pp_default .pp_expand:hover { background: url(../images/prettyPhoto/default/sprite.png) 0 -56px no-repeat; cursor: pointer; } /* Expand button hover */ div.pp_default .pp_contract { background: url(../images/prettyPhoto/default/sprite.png) 0 -84px no-repeat; cursor: pointer; width: 28px; height: 28px; } /* Contract button */ div.pp_default .pp_contract:hover { background: url(../images/prettyPhoto/default/sprite.png) 0 -113px no-repeat; cursor: pointer; } /* Contract button hover */ div.pp_default .pp_close { width: 30px; height: 30px; background: url(../images/prettyPhoto/default/sprite.png) 2px 1px no-repeat; cursor: pointer; } /* Close button */ div.pp_default #pp_full_res .pp_inline { color: #000; } div.pp_default .pp_gallery ul li a { background: url(../images/prettyPhoto/default/default_thumb.png) center center #f8f8f8; border:1px solid #aaa; } div.pp_default .pp_gallery ul li a:hover, div.pp_default .pp_gallery ul li.selected a { border-color: #fff; } div.pp_default .pp_social { margin-top: 7px; } div.pp_default .pp_gallery a.pp_arrow_previous, div.pp_default .pp_gallery a.pp_arrow_next { position: static; left: auto; } div.pp_default .pp_nav .pp_play, div.pp_default .pp_nav .pp_pause { background: url(../images/prettyPhoto/default/sprite.png) -51px 1px no-repeat; height:30px; width:30px; } div.pp_default .pp_nav .pp_pause { background-position: -51px -29px; } div.pp_default .pp_details { position: relative; } div.pp_default a.pp_arrow_previous, div.pp_default a.pp_arrow_next { background: url(../images/prettyPhoto/default/sprite.png) -31px -3px no-repeat; height: 20px; margin: 4px 0 0 0; width: 20px; } div.pp_default a.pp_arrow_next { left: 52px; background-position: -82px -3px; } /* The next arrow in the bottom nav */ div.pp_default .pp_content_container .pp_details { margin-top: 5px; } div.pp_default .pp_nav { clear: none; height: 30px; width: 110px; position: relative; } div.pp_default .pp_nav .currentTextHolder{ font-family: Georgia; font-style: italic; color:#999; font-size: 11px; left: 75px; line-height: 25px; margin: 0; padding: 0 0 0 10px; position: absolute; top: 2px; } div.pp_default .pp_close:hover, div.pp_default .pp_nav .pp_play:hover, div.pp_default .pp_nav .pp_pause:hover, div.pp_default .pp_arrow_next:hover, div.pp_default .pp_arrow_previous:hover { opacity:0.7; } div.pp_default .pp_description{ font-size: 11px; font-weight: bold; line-height: 14px; margin: 5px 50px 5px 0; } div.pp_default .pp_bottom .pp_left { background: url(../images/prettyPhoto/default/sprite.png) -78px -127px no-repeat; } /* Bottom left corner */ div.pp_default .pp_bottom .pp_middle { background: url(../images/prettyPhoto/default/sprite_x.png) bottom left repeat-x; } /* Bottom pattern/color */ div.pp_default .pp_bottom .pp_right { background: url(../images/prettyPhoto/default/sprite.png) -112px -127px no-repeat; } /* Bottom right corner */ div.pp_default .pp_loaderIcon { background: url(../images/prettyPhoto/default/loader.gif) center center no-repeat; } /* Loader icon */ /* ---------------------------------- Light Rounded Theme ----------------------------------- */ div.light_rounded .pp_top .pp_left { background: url(../images/prettyPhoto/light_rounded/sprite.png) -88px -53px no-repeat; } /* Top left corner */ div.light_rounded .pp_top .pp_middle { background: #fff; } /* Top pattern/color */ div.light_rounded .pp_top .pp_right { background: url(../images/prettyPhoto/light_rounded/sprite.png) -110px -53px no-repeat; } /* Top right corner */ div.light_rounded .pp_content .ppt { color: #000; } div.light_rounded .pp_content_container .pp_left, div.light_rounded .pp_content_container .pp_right { background: #fff; } div.light_rounded .pp_content { background-color: #fff; } /* Content background */ div.light_rounded .pp_next:hover { background: url(../images/prettyPhoto/light_rounded/btnNext.png) center right no-repeat; cursor: pointer; } /* Next button */ div.light_rounded .pp_previous:hover { background: url(../images/prettyPhoto/light_rounded/btnPrevious.png) center left no-repeat; cursor: pointer; } /* Previous button */ div.light_rounded .pp_expand { background: url(../images/prettyPhoto/light_rounded/sprite.png) -31px -26px no-repeat; cursor: pointer; } /* Expand button */ div.light_rounded .pp_expand:hover { background: url(../images/prettyPhoto/light_rounded/sprite.png) -31px -47px no-repeat; cursor: pointer; } /* Expand button hover */ div.light_rounded .pp_contract { background: url(../images/prettyPhoto/light_rounded/sprite.png) 0 -26px no-repeat; cursor: pointer; } /* Contract button */ div.light_rounded .pp_contract:hover { background: url(../images/prettyPhoto/light_rounded/sprite.png) 0 -47px no-repeat; cursor: pointer; } /* Contract button hover */ div.light_rounded .pp_close { width: 75px; height: 22px; background: url(../images/prettyPhoto/light_rounded/sprite.png) -1px -1px no-repeat; cursor: pointer; } /* Close button */ div.light_rounded .pp_details { position: relative; } div.light_rounded .pp_description { margin-right: 85px; } div.light_rounded #pp_full_res .pp_inline { color: #000; } div.light_rounded .pp_gallery a.pp_arrow_previous, div.light_rounded .pp_gallery a.pp_arrow_next { margin-top: 12px !important; } div.light_rounded .pp_nav .pp_play { background: url(../images/prettyPhoto/light_rounded/sprite.png) -1px -100px no-repeat; height: 15px; width: 14px; } div.light_rounded .pp_nav .pp_pause { background: url(../images/prettyPhoto/light_rounded/sprite.png) -24px -100px no-repeat; height: 15px; width: 14px; } div.light_rounded .pp_arrow_previous { background: url(../images/prettyPhoto/light_rounded/sprite.png) 0 -71px no-repeat; } /* The previous arrow in the bottom nav */ div.light_rounded .pp_arrow_previous.disabled { background-position: 0 -87px; cursor: default; } div.light_rounded .pp_arrow_next { background: url(../images/prettyPhoto/light_rounded/sprite.png) -22px -71px no-repeat; } /* The next arrow in the bottom nav */ div.light_rounded .pp_arrow_next.disabled { background-position: -22px -87px; cursor: default; } div.light_rounded .pp_bottom .pp_left { background: url(../images/prettyPhoto/light_rounded/sprite.png) -88px -80px no-repeat; } /* Bottom left corner */ div.light_rounded .pp_bottom .pp_middle { background: #fff; } /* Bottom pattern/color */ div.light_rounded .pp_bottom .pp_right { background: url(../images/prettyPhoto/light_rounded/sprite.png) -110px -80px no-repeat; } /* Bottom right corner */ div.light_rounded .pp_loaderIcon { background: url(../images/prettyPhoto/light_rounded/loader.gif) center center no-repeat; } /* Loader icon */ /* ---------------------------------- Dark Rounded Theme ----------------------------------- */ div.dark_rounded .pp_top .pp_left { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -88px -53px no-repeat; } /* Top left corner */ div.dark_rounded .pp_top .pp_middle { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat; } /* Top pattern/color */ div.dark_rounded .pp_top .pp_right { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -110px -53px no-repeat; } /* Top right corner */ div.dark_rounded .pp_content_container .pp_left { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat-y; } /* Left Content background */ div.dark_rounded .pp_content_container .pp_right { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top right repeat-y; } /* Right Content background */ div.dark_rounded .pp_content { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat; } /* Content background */ div.dark_rounded .pp_next:hover { background: url(../images/prettyPhoto/dark_rounded/btnNext.png) center right no-repeat; cursor: pointer; } /* Next button */ div.dark_rounded .pp_previous:hover { background: url(../images/prettyPhoto/dark_rounded/btnPrevious.png) center left no-repeat; cursor: pointer; } /* Previous button */ div.dark_rounded .pp_expand { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -31px -26px no-repeat; cursor: pointer; } /* Expand button */ div.dark_rounded .pp_expand:hover { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -31px -47px no-repeat; cursor: pointer; } /* Expand button hover */ div.dark_rounded .pp_contract { background: url(../images/prettyPhoto/dark_rounded/sprite.png) 0 -26px no-repeat; cursor: pointer; } /* Contract button */ div.dark_rounded .pp_contract:hover { background: url(../images/prettyPhoto/dark_rounded/sprite.png) 0 -47px no-repeat; cursor: pointer; } /* Contract button hover */ div.dark_rounded .pp_close { width: 75px; height: 22px; background: url(../images/prettyPhoto/dark_rounded/sprite.png) -1px -1px no-repeat; cursor: pointer; } /* Close button */ div.dark_rounded .pp_details { position: relative; } div.dark_rounded .pp_description { margin-right: 85px; } div.dark_rounded .currentTextHolder { color: #c4c4c4; } div.dark_rounded .pp_description { color: #fff; } div.dark_rounded #pp_full_res .pp_inline { color: #fff; } div.dark_rounded .pp_gallery a.pp_arrow_previous, div.dark_rounded .pp_gallery a.pp_arrow_next { margin-top: 12px !important; } div.dark_rounded .pp_nav .pp_play { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -1px -100px no-repeat; height: 15px; width: 14px; } div.dark_rounded .pp_nav .pp_pause { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -24px -100px no-repeat; height: 15px; width: 14px; } div.dark_rounded .pp_arrow_previous { background: url(../images/prettyPhoto/dark_rounded/sprite.png) 0 -71px no-repeat; } /* The previous arrow in the bottom nav */ div.dark_rounded .pp_arrow_previous.disabled { background-position: 0 -87px; cursor: default; } div.dark_rounded .pp_arrow_next { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -22px -71px no-repeat; } /* The next arrow in the bottom nav */ div.dark_rounded .pp_arrow_next.disabled { background-position: -22px -87px; cursor: default; } div.dark_rounded .pp_bottom .pp_left { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -88px -80px no-repeat; } /* Bottom left corner */ div.dark_rounded .pp_bottom .pp_middle { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat; } /* Bottom pattern/color */ div.dark_rounded .pp_bottom .pp_right { background: url(../images/prettyPhoto/dark_rounded/sprite.png) -110px -80px no-repeat; } /* Bottom right corner */ div.dark_rounded .pp_loaderIcon { background: url(../images/prettyPhoto/dark_rounded/loader.gif) center center no-repeat; } /* Loader icon */ /* ---------------------------------- Dark Square Theme ----------------------------------- */ div.dark_square .pp_left , div.dark_square .pp_middle, div.dark_square .pp_right, div.dark_square .pp_content { background: #000; } div.dark_square .currentTextHolder { color: #c4c4c4; } div.dark_square .pp_description { color: #fff; } div.dark_square .pp_loaderIcon { background: url(../images/prettyPhoto/dark_square/loader.gif) center center no-repeat; } /* Loader icon */ div.dark_square .pp_expand { background: url(../images/prettyPhoto/dark_square/sprite.png) -31px -26px no-repeat; cursor: pointer; } /* Expand button */ div.dark_square .pp_expand:hover { background: url(../images/prettyPhoto/dark_square/sprite.png) -31px -47px no-repeat; cursor: pointer; } /* Expand button hover */ div.dark_square .pp_contract { background: url(../images/prettyPhoto/dark_square/sprite.png) 0 -26px no-repeat; cursor: pointer; } /* Contract button */ div.dark_square .pp_contract:hover { background: url(../images/prettyPhoto/dark_square/sprite.png) 0 -47px no-repeat; cursor: pointer; } /* Contract button hover */ div.dark_square .pp_close { width: 75px; height: 22px; background: url(../images/prettyPhoto/dark_square/sprite.png) -1px -1px no-repeat; cursor: pointer; } /* Close button */ div.dark_square .pp_details { position: relative; } div.dark_square .pp_description { margin: 0 85px 0 0; } div.dark_square #pp_full_res .pp_inline { color: #fff; } div.dark_square .pp_gallery a.pp_arrow_previous, div.dark_square .pp_gallery a.pp_arrow_next { margin-top: 12px !important; } div.dark_square .pp_nav { clear: none; } div.dark_square .pp_nav .pp_play { background: url(../images/prettyPhoto/dark_square/sprite.png) -1px -100px no-repeat; height: 15px; width: 14px; } div.dark_square .pp_nav .pp_pause { background: url(../images/prettyPhoto/dark_square/sprite.png) -24px -100px no-repeat; height: 15px; width: 14px; } div.dark_square .pp_arrow_previous { background: url(../images/prettyPhoto/dark_square/sprite.png) 0 -71px no-repeat; } /* The previous arrow in the bottom nav */ div.dark_square .pp_arrow_previous.disabled { background-position: 0 -87px; cursor: default; } div.dark_square .pp_arrow_next { background: url(../images/prettyPhoto/dark_square/sprite.png) -22px -71px no-repeat; } /* The next arrow in the bottom nav */ div.dark_square .pp_arrow_next.disabled { background-position: -22px -87px; cursor: default; } div.dark_square .pp_next:hover { background: url(../images/prettyPhoto/dark_square/btnNext.png) center right no-repeat; cursor: pointer; } /* Next button */ div.dark_square .pp_previous:hover { background: url(../images/prettyPhoto/dark_square/btnPrevious.png) center left no-repeat; cursor: pointer; } /* Previous button */ /* ---------------------------------- Light Square Theme ----------------------------------- */ div.light_square .pp_left , div.light_square .pp_middle, div.light_square .pp_right, div.light_square .pp_content { background: #fff; } div.light_square .pp_content .ppt { color: #000; } div.light_square .pp_expand { background: url(../images/prettyPhoto/light_square/sprite.png) -31px -26px no-repeat; cursor: pointer; } /* Expand button */ div.light_square .pp_expand:hover { background: url(../images/prettyPhoto/light_square/sprite.png) -31px -47px no-repeat; cursor: pointer; } /* Expand button hover */ div.light_square .pp_contract { background: url(../images/prettyPhoto/light_square/sprite.png) 0 -26px no-repeat; cursor: pointer; } /* Contract button */ div.light_square .pp_contract:hover { background: url(../images/prettyPhoto/light_square/sprite.png) 0 -47px no-repeat; cursor: pointer; } /* Contract button hover */ div.light_square .pp_close { width: 75px; height: 22px; background: url(../images/prettyPhoto/light_square/sprite.png) -1px -1px no-repeat; cursor: pointer; } /* Close button */ div.light_square .pp_details { position: relative; } div.light_square .pp_description { margin-right: 85px; } div.light_square #pp_full_res .pp_inline { color: #000; } div.light_square .pp_gallery a.pp_arrow_previous, div.light_square .pp_gallery a.pp_arrow_next { margin-top: 12px !important; } div.light_square .pp_nav .pp_play { background: url(../images/prettyPhoto/light_square/sprite.png) -1px -100px no-repeat; height: 15px; width: 14px; } div.light_square .pp_nav .pp_pause { background: url(../images/prettyPhoto/light_square/sprite.png) -24px -100px no-repeat; height: 15px; width: 14px; } div.light_square .pp_arrow_previous { background: url(../images/prettyPhoto/light_square/sprite.png) 0 -71px no-repeat; } /* The previous arrow in the bottom nav */ div.light_square .pp_arrow_previous.disabled { background-position: 0 -87px; cursor: default; } div.light_square .pp_arrow_next { background: url(../images/prettyPhoto/light_square/sprite.png) -22px -71px no-repeat; } /* The next arrow in the bottom nav */ div.light_square .pp_arrow_next.disabled { background-position: -22px -87px; cursor: default; } div.light_square .pp_next:hover { background: url(../images/prettyPhoto/light_square/btnNext.png) center right no-repeat; cursor: pointer; } /* Next button */ div.light_square .pp_previous:hover { background: url(../images/prettyPhoto/light_square/btnPrevious.png) center left no-repeat; cursor: pointer; } /* Previous button */ div.light_square .pp_loaderIcon { background: url(../images/prettyPhoto/light_rounded/loader.gif) center center no-repeat; } /* Loader icon */ /* ---------------------------------- Facebook style Theme ----------------------------------- */ div.facebook .pp_top .pp_left { background: url(../images/prettyPhoto/facebook/sprite.png) -88px -53px no-repeat; } /* Top left corner */ div.facebook .pp_top .pp_middle { background: url(../images/prettyPhoto/facebook/contentPatternTop.png) top left repeat-x; } /* Top pattern/color */ div.facebook .pp_top .pp_right { background: url(../images/prettyPhoto/facebook/sprite.png) -110px -53px no-repeat; } /* Top right corner */ div.facebook .pp_content .ppt { color: #000; } div.facebook .pp_content_container .pp_left { background: url(../images/prettyPhoto/facebook/contentPatternLeft.png) top left repeat-y; } /* Content background */ div.facebook .pp_content_container .pp_right { background: url(../images/prettyPhoto/facebook/contentPatternRight.png) top right repeat-y; } /* Content background */ div.facebook .pp_content { background: #fff; } /* Content background */ div.facebook .pp_expand { background: url(../images/prettyPhoto/facebook/sprite.png) -31px -26px no-repeat; cursor: pointer; } /* Expand button */ div.facebook .pp_expand:hover { background: url(../images/prettyPhoto/facebook/sprite.png) -31px -47px no-repeat; cursor: pointer; } /* Expand button hover */ div.facebook .pp_contract { background: url(../images/prettyPhoto/facebook/sprite.png) 0 -26px no-repeat; cursor: pointer; } /* Contract button */ div.facebook .pp_contract:hover { background: url(../images/prettyPhoto/facebook/sprite.png) 0 -47px no-repeat; cursor: pointer; } /* Contract button hover */ div.facebook .pp_close { width: 22px; height: 22px; background: url(../images/prettyPhoto/facebook/sprite.png) -1px -1px no-repeat; cursor: pointer; } /* Close button */ div.facebook .pp_details { position: relative; } div.facebook .pp_description { margin: 0 37px 0 0; } div.facebook #pp_full_res .pp_inline { color: #000; } div.facebook .pp_loaderIcon { background: url(../images/prettyPhoto/facebook/loader.gif) center center no-repeat; } /* Loader icon */ div.facebook .pp_arrow_previous { background: url(../images/prettyPhoto/facebook/sprite.png) 0 -71px no-repeat; height: 22px; margin-top: 0; width: 22px; } /* The previous arrow in the bottom nav */ div.facebook .pp_arrow_previous.disabled { background-position: 0 -96px; cursor: default; } div.facebook .pp_arrow_next { background: url(../images/prettyPhoto/facebook/sprite.png) -32px -71px no-repeat; height: 22px; margin-top: 0; width: 22px; } /* The next arrow in the bottom nav */ div.facebook .pp_arrow_next.disabled { background-position: -32px -96px; cursor: default; } div.facebook .pp_nav { margin-top: 0; } div.facebook .pp_nav p { font-size: 15px; padding: 0 3px 0 4px; } div.facebook .pp_nav .pp_play { background: url(../images/prettyPhoto/facebook/sprite.png) -1px -123px no-repeat; height: 22px; width: 22px; } div.facebook .pp_nav .pp_pause { background: url(../images/prettyPhoto/facebook/sprite.png) -32px -123px no-repeat; height: 22px; width: 22px; } div.facebook .pp_next:hover { background: url(../images/prettyPhoto/facebook/btnNext.png) center right no-repeat; cursor: pointer; } /* Next button */ div.facebook .pp_previous:hover { background: url(../images/prettyPhoto/facebook/btnPrevious.png) center left no-repeat; cursor: pointer; } /* Previous button */ div.facebook .pp_bottom .pp_left { background: url(../images/prettyPhoto/facebook/sprite.png) -88px -80px no-repeat; } /* Bottom left corner */ div.facebook .pp_bottom .pp_middle { background: url(../images/prettyPhoto/facebook/contentPatternBottom.png) top left repeat-x; } /* Bottom pattern/color */ div.facebook .pp_bottom .pp_right { background: url(../images/prettyPhoto/facebook/sprite.png) -110px -80px no-repeat; } /* Bottom right corner */ /* ------------------------------------------------------------------------ DO NOT CHANGE ------------------------------------------------------------------------- */ div.pp_pic_holder a:focus { outline:none; } div.pp_overlay { background: #000; display: none; left: 0; position: absolute; top: 0; width: 100%; z-index: 9500; } div.pp_pic_holder { display: none; position: absolute; width: 100px; z-index: 10000; } .pp_top { height: 20px; position: relative; } * html .pp_top { padding: 0 20px; } .pp_top .pp_left { height: 20px; left: 0; position: absolute; width: 20px; } .pp_top .pp_middle { height: 20px; left: 20px; position: absolute; right: 20px; } * html .pp_top .pp_middle { left: 0; position: static; } .pp_top .pp_right { height: 20px; left: auto; position: absolute; right: 0; top: 0; width: 20px; } .pp_content { height: 40px; min-width: 40px; } * html .pp_content { width: 40px; } .pp_fade { display: none; } .pp_content_container { position: relative; text-align: left; width: 100%; } .pp_content_container .pp_left { padding-left: 20px; } .pp_content_container .pp_right { padding-right: 20px; } .pp_content_container .pp_details { float: left; margin: 10px 0 2px 0; } .pp_description { display: none; margin: 0; } .pp_social { float: left; margin: 0; } .pp_social .facebook { float: left; margin-left: 5px; width: 55px; overflow: hidden; } .pp_social .twitter { float: left; } .pp_nav { clear: right; float: left; margin: 3px 10px 0 0; } .pp_nav p { float: left; margin: 2px 4px; white-space: nowrap; } .pp_nav .pp_play, .pp_nav .pp_pause { float: left; margin-right: 4px; text-indent: -10000px; } a.pp_arrow_previous, a.pp_arrow_next { display: block; float: left; height: 15px; margin-top: 3px; overflow: hidden; text-indent: -10000px; width: 14px; } .pp_hoverContainer { position: absolute; top: 0; width: 100%; z-index: 2000; } .pp_gallery { display: none; left: 50%; margin-top: -50px; position: absolute; z-index: 10000; } .pp_gallery div { float: left; overflow: hidden; position: relative; } .pp_gallery ul { float: left; height: 35px; margin: 0 0 0 5px; padding: 0; position: relative; white-space: nowrap; } .pp_gallery ul a { border: 1px #000 solid; border: 1px rgba(0,0,0,0.5) solid; display: block; float: left; height: 33px; overflow: hidden; } .pp_gallery ul a:hover, .pp_gallery li.selected a { border-color: #fff; } .pp_gallery ul a img { border: 0; } .pp_gallery li { display: block; float: left; margin: 0 5px 0 0; padding: 0; } .pp_gallery li.default a { background: url(../images/prettyPhoto/facebook/default_thumbnail.gif) 0 0 no-repeat; display: block; height: 33px; width: 50px; } .pp_gallery li.default a img { display: none; } .pp_gallery .pp_arrow_previous, .pp_gallery .pp_arrow_next { margin-top: 7px !important; } a.pp_next { background: url(../images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat; display: block; float: right; height: 100%; text-indent: -10000px; width: 49%; } a.pp_previous { background: url(../images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat; display: block; float: left; height: 100%; text-indent: -10000px; width: 49%; } a.pp_expand, a.pp_contract { cursor: pointer; display: none; height: 20px; position: absolute; right: 30px; text-indent: -10000px; top: 10px; width: 20px; z-index: 20000; } a.pp_close { position: absolute; right: 0; top: 0; display: block; line-height:22px; text-indent: -10000px; } .pp_bottom { height: 20px; position: relative; } * html .pp_bottom { padding: 0 20px; } .pp_bottom .pp_left { height: 20px; left: 0; position: absolute; width: 20px; } .pp_bottom .pp_middle { height: 20px; left: 20px; position: absolute; right: 20px; } * html .pp_bottom .pp_middle { left: 0; position: static; } .pp_bottom .pp_right { height: 20px; left: auto; position: absolute; right: 0; top: 0; width: 20px; } .pp_loaderIcon { display: block; height: 24px; left: 50%; margin: -12px 0 0 -12px; position: absolute; top: 50%; width: 24px; } #pp_full_res { line-height: 1 !important; } #pp_full_res .pp_inline { text-align: left; } #pp_full_res .pp_inline p { margin: 0 0 15px 0; } div.ppt { color: #fff; display: none; font-size: 17px; margin: 0 0 5px 15px; z-index: 9999; } /*---------------------------------------------------------------------------------------------------------*/ /*----------------------------- End PrettyPhoto CSS ---------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------------------------*/ /*----------------------------- Step Carousel Viewer CSS- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com) ----*/ /*----------------------------- Visit http://www.dynamicDrive.com for hundreds of DHTML scripts -----------------------------*/ /*----------------------------- This notice must stay intact for legal use --------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------------------------*/ .stepcarousel{ position: relative; /*leave this value alone*/ border: 5px solid #C8AD87; overflow: scroll; /*leave this value alone*/ width: 620px; /*Width of Carousel Viewer itself*/ height: 470px; /*Height should enough to fit largest content's height*/ } .stepcarousel .belt{ position: absolute; /*leave this value alone*/ /*left: 0; top: 0; */ } .stepcarousel .panel{ float: left; /*leave this value alone*/ overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/ margin: 10px; /*margin around each panel*/ width: 600px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */ } div#mygallery a { color: #C8AD87; } div#mygallery a:hover { color: #411; background: #D29B4E; } /*---------------------------------------------------------------------------------------------------------*/ /*----------------------------- End Carousel Viewer CSS ---------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ CSS : foztags ------------------------------------------*/ /*------------------------------ Author : Ian Foster ------------------------------------------*/ /*------------------------------ Version : 1.0 ------------------------------------------*/ /*------------------------------ Date : August 2008 ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ tag cloud ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ div#FLtagcloud { background-color: #000000; text-align: center; font-family: 'Verdana'; } /*------------------------------ tag number --------------------------------------------------------*/ .fltagnum10 { font-size: 10px; color: #FFFFFF; text-decoration: none; } /*------------------------------ tag frequencies --------------------------------------------------------*/ .fltag10 { font-size: 10px; color: #FF66FF; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag11 { font-size: 11px; color: #FF66FF; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag12 { font-size: 12px; color: #FF66FF; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag13 { font-size: 13px; color: #99CCFF; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag14 { font-size: 14px; color: #99CCFF; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag15 { font-size: 15px; color: #99CCFF; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag16 { font-size: 16px; color: #039faf; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag17 { font-size: 17px; color: #039faf; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag18 { font-size: 18px; color: #039faf; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag19 { font-size: 19px; color: #de2159; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag20 { font-size: 20px; color: #de2159; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag21 { font-size: 21px; color: #de2159; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag22 { font-size: 22px; color: #87a800; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag23 { font-size: 23px; color: #87a800; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag24 { font-size: 24px; color: #87a800; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag25 { font-size: 25px; color: #ff7600; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag26 { font-size: 26px; color: #ff7600; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag27 { font-size: 27px; color: #ff7600; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag28 { font-size: 28px; color: #CCCCCC; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag29 { font-size: 29px; color: #CCCCCC; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag30 { font-size: 30px; color: #CCCCCC; text-decoration: none; padding-left: 10px; padding-right: 10px; } .flta31 { font-size: 31px; color: #FFFF66; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag32 { font-size: 32px; color: #FFFF66; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag33 { font-size: 33px; color: #FFFF66; text-decoration: none; padding-left: 10px; padding-right: 10px; } .flta34 { font-size: 34px; color: #660033; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag35 { font-size: 35px; color: #660033; text-decoration: none; padding-left: 10px; padding-right: 10px; } .fltag36 { font-size: 36px; color: #660033; text-decoration: none; padding-left: 10px; padding-right: 10px; } /*---------------------------------------------------------------------------------------------------------*/ /*----------------------------- End foztags ---------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ CSS : fozoutube ------------------------------------------*/ /*------------------------------ Author : Ian Foster ------------------------------------------*/ /*------------------------------ Version : 1.0 ------------------------------------------*/ /*------------------------------ Date : Sept 2011 ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ embed you tube videos ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ .fozyoutube { margin-top: 10px; } .fozyoutube img { width: 690px; height: 418px; } .fozyoutube { padding-left: 50px; } .fozyoutube a { color: #C8AD87; } .foz-ac a { color: #C8AD87; } /*---------------------------------------------------------------------------------------------------------*/ /*----------------------------- End fozyoutube ---------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ CSS : fozmenu ------------------------------------------*/ /*------------------------------ Author : Ian Foster ------------------------------------------*/ /*------------------------------ Version : 1.0 ------------------------------------------*/ /*------------------------------ Date : July 2010 ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ new horizontal menu ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ #foz_menu_items{ margin-top:35px; } .foz_menu_tabs{ width: 100%; overflow: hidden; border-bottom: 1px solid black; /*bottom horizontal line that runs beneath tabs*/ } .foz_menu_tabs ul{ margin: 0; padding: 0; padding-left: 10px; /*offset of tabs relative to browser left edge*/ font: bold 12px Verdana; list-style-type: none; } .foz_menu_tabs li{ display: inline; margin-top: 0; } .foz_menu_tabs li a{ text-decoration: none; margin: 0; padding: 7px 8px; /*padding inside each tab*/ border-right: 1px solid white; /*right divider between tabs*/ color: white; background: #414141; /*background of tabs (default state)*/ } .foz_menu_tabs li a:visited{ color: white; } li a:hover, .foz_menu_tabs li.selected a{ color: #411; background: #D29B4E; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */ } .foz_menu_tabs a:hover span { display: block; position: absolute; left: 150px; width: 300px; top: 115px; padding: 5px; margin: 0px; z-index: 100; color: #D29B4E; background: black; font: 14px Verdana bold; text-align: left; } .foz_menu_tabs span { display:none; } /*---------------------------------------------------------------------------------------------------------*/ /*----------------------------- End fozmenu ---------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ CSS : fozmenu_h ------------------------------------------*/ /*------------------------------ Author : Ian Foster ------------------------------------------*/ /*------------------------------ Version : 1.0 ------------------------------------------*/ /*------------------------------ Date : Jan 20140 ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ home page horizontal menu ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ #foz_menu_h_items{ margin-top:5px; } .foz_menu_h_tabs{ width: 100%; overflow: hidden; border-bottom: 1px solid black; /*bottom horizontal line that runs beneath tabs*/ } .foz_menu_h_tabs ul{ margin: 0; padding: 0; padding-left: 10px; /*offset of tabs relative to browser left edge*/ font: bold 12px Verdana; list-style-type: none; } .foz_menu_h_tabs li{ display: inline; margin-top: 0; } .foz_menu_h_tabs li a{ text-decoration: none; margin: 0; padding: 7px 8px; /*padding inside each tab*/ border-right: 1px solid white; /*right divider between tabs*/ color: white; background: #414141; /*background of tabs (default state)*/ } .foz_menu_h_tabs li a:visited{ color: white; } li a:hover, .foz_menu_h_tabs li.selected a{ color: #411; background: #D29B4E; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */ } .foz_menu_h_tabs a:hover span { display: block; position: absolute; left: 180px; width: 300px; top: 170px; padding: 5px; margin: 0px; z-index: 100; color: #D29B4E; background: black; font: 14px Verdana bold; text-align: left; } .foz_menu_h_tabs span { display:none; } /*---------------------------------------------------------------------------------------------------------*/ /*----------------------------- End fozmenu_h ---------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ CSS : foz_fozlogs ------------------------------------------*/ /*------------------------------ Author : Ian Foster ------------------------------------------*/ /*------------------------------ Version : 1.0 ------------------------------------------*/ /*------------------------------ Date : July 2010 ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ new horizontal menu ------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ #foz_fozlogs_items{ margin-top:10px; } .foz_fozlogs_tabs{ width: 100%; overflow: hidden; border-bottom: 1px solid black; /*bottom horizontal line that runs beneath tabs*/ } .foz_fozlogs_tabs ul{ margin: 0; padding: 0; padding-left: 10px; /*offset of tabs relative to browser left edge*/ font: bold 12px Verdana; list-style-type: none; } .foz_fozlogs_tabs li{ display: inline; margin: 0; } .foz_fozlogs_tabs li a{ text-decoration: none; margin: 0; padding: 7px 8px; /*padding inside each tab*/ border-right: 1px solid white; /*right divider between tabs*/ color: white; background: #414141; /*background of tabs (default state)*/ } .foz_fozlogs_tabs li a:visited{ color: white; } li a:hover, .foz_fozlogs_tabs li.selected a{ color: #411; background: #D29B4E; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */ } .foz_fozlogs_tabs a:hover span { display: block; position: absolute; left: 150px; width: 800px; top: 115px; padding: 5px; margin: 0px; z-index: 100; color: #D29B4E; background: black; font: 14px Verdana bold; text-align: left; } .foz_fozlogs_tabs span { display:none; } /*---------------------------------------------------------------------------------------------------------*/ /*----------------------------- End fozmenu ---------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------------------------------------*/ /*------------------------------ tables ------------------------------------------------------------------*/ td { font-family: "Verdana", Times, serif; } th { font-family: "Verdana", Times, serif; } /* ----------------------------- table styles ----------------------------------------------------------*/ .tabstyle2 { font-family: "Verdana", Times, serif; font-size: 18px; color: #ECE9D8; font-weight: bold; } .tabstyle3 { font-family: "Verdana", Times, serif; font-size: 12px; color: #ECE9D8; font-weight: bold; } .tabblank { border-right: 0px black; border-left: 0px; border-top: 0px; border-bottom: 0px; } /*------------------------------ text styles ----------------------------------------------------------*/ .style2 { font-family: "Verdana", Times, serif; font-size: 18px; color: #ECE9D8; font-weight: bold; } .style2c { font-family: "Verdana", Times, serif; font-size: 18px; color: #ECE9D8; font-weight: bold; text-align: center; } .style3 { font-family: Verdana; font-size: 1em; } .style4 { font-family: "Verdana", Times, serif; font-size: 14px; color: #ECE9D8; font-weight: bold; } .style4c { font-family: "Verdana", Times, serif; font-size: 14px; color: #ECE9D8; font-weight: bold; text-align: center; } .style5 { font-family: "Verdana", Times, serif; font-size: 16px; color: #C8AD87; font-weight: bold; } .style6 { color: #FFFFFF; font-weight: bold; } .style7 { font-family: "Verdana", Times, serif; font-size: 16px; color: #D29B4E; font-weight: bold; } .style7c { font-family: "Verdana", Times, serif; font-size: 16px; color: #D29B4E; font-weight: bold; text-align: center; } .style7-pad { font-family: "Verdana", Times, serif; font-size: 16px; color: #D29B4E; font-weight: bold; padding-left: 15px; padding-right: 15px; } .style8 { font-family: "Verdana", Times, serif; font-size: 16px; color: #ECE9D8; font-weight: bold; } .style8c { font-family: "Verdana", Times, serif; font-size: 16px; color: #ECE9D8; font-weight: bold; text-align: center; } .style9 { font-family: "Verdana", Times, serif; font-size: 14px; color: #D29B4E; font-weight: bold; } .style10 { font-family: "Verdana", Times, serif; font-size: 11px; color: #ECE9D8; font-weight: bold; } .style11 { font-family: "Verdana", Times, serif; font-size: 20px; color: #D29B4E; font-weight: bold; } .style11c { font-family: "Verdana", Times, serif; font-size: 20px; color: #D29B4E; font-weight: bold; text-align: center; } .style12 { font-family: "Verdana", Times, serif; font-size: 18px; color: #D29B4E; font-weight: bold; } .style12c { font-family: "Verdana", Times, serif; font-size: 16px; color: #D29B4E; font-weight: bold; text-align: center; } .style14 { font-family: "Verdana", Times, serif; font-size: 12px; color: #ECE9D8; font-weight: bold; } /*------------------------------ text clear and float ------------------------------------------------------*/ .p-clear-left { clear: left; } .p-clear-right { clear: right; } .p-float-left { float: left; } .p-float-right { float: right; } .p-clear-left-menu { clear:left; margin: 3px; } /*------------------------------ Images classes ------------------------------------------*/ /*------------------------------ for A38 project pages ------------------------------------------*/ .A38-float-left { float: left; width: 250px; height: 178px; padding: 10px; margin: 10px; } .A38-float-right { float: right; width: 250px; height: 178px; padding: 10px; margin: 10px; } .A38-clear-left { clear: left; width: 250px; height: 178px; padding: 10px; margin: 10px; } .A38-clear-right { clear: right; width: 250px; height: 178px; padding: 10px; margin: 10px; } .A38-float-left-portrait { float: left; width: 119px; height: 178px; padding: 10px; margin: 10px; } .A38-float-right-portrait { float: right; width: 119px; height: 178px; padding: 10px; margin: 10px; } .A38-clear-left-portrait { clear: left; width: 119px; height: 178px; padding: 10px; margin: 10px; } .A38-clear-right-portrait { clear: right; width: 119px; height: 178px; padding: 10px; margin: 10px; } /* ----------------------- for Fozlogs --------------------------------------*/ .FL-float-left { float: left; width: 250px; height: 167px; padding: 10px; margin: 10px; } .FL-float-right { float: right; width: 250px; height: 167px; padding: 10px; margin: 10px; } .FL-clear-left { clear: left; width: 250px; height: 167px; padding: 10px; margin: 10px; } .FL-clear-left-600 { clear: left; width: 600px; height: 400px; padding: 10px; margin: 10px; } .FL-clear-left-A { clear: left; width: 400px; height: 267px; padding: 10px; margin: 10px; } .FL-clear-right { clear: right; width: 250px; height: 167px; padding: 10px; margin: 10px; } .FL-float-left-portrait { float: left; width: 111px; height: 167px; padding: 10px; margin: 10px; } .FL-float-right-portrait { float: right; width: 111x; height: 167px; padding: 10px; margin: 10px; } .FL-clear-left-portrait { clear: left; width: 111px; height: 167px; padding: 10px; margin: 10px; } .FL-clear-left-portrait-A { clear: left; width: 178px; height: 267px; padding: 10px; margin: 10px; } .FL-clear-left-portrait-400 { clear: left; width: 400px; height: 600px; padding: 10px; margin: 10px; } .FL-clear-right-portrait { clear: right; width: 111px; height: 167px; padding: 10px; margin: 10px; } .FL-clear-left-square-600 { clear: left; width: 600px; height: 600px; padding: 10px; margin: 10px; } .FL-float-left-portrait-G { float: left; width: 267px; height: 400px; padding: 10px; margin: 10px; } .FL-float-left-pano { float: left; width: 250px; height: 100px; padding: 10px; margin: 10px; } .FL-float-right-pano { float: right; width: 250px; height: 100px; padding: 10px; margin: 10px; } .FL-float-left-square { float: left; width: 200px; height: 200px; padding: 10px; margin: 10px; } .FL-float-right-square { float: right; width: 200px; height: 200px; padding: 10px; margin: 10px; } /* ----------------------- for Explore --------------------------------------*/ .EX-float-left { float: left; width: 125px; height: 89px; padding: 10px; margin: 10px; border : 0px; } .EX-float-left-portrait { float: left; width: 56px; height: 84px; padding: 10px; margin: 10px; border : 0px; } .EX-float-left-G { float: left; width: 600px; height: 400px; padding: 10px; margin: 10px; border : 0px; } .EX-float-left-portrait-G { float: left; width: 267px; height: 400px; padding: 10px; margin: 10px; border : 0px; } /* ----------------------- Borders --------------------------------------*/ .white-border { border-color: #FFF } /*------------------------------ about page ------------------------------------------------------------*/ div#ex-feedback { padding-left: 25px; padding-top: 100px; } div#ex-feedback a { color: #C8AD87; } div#ex-feedback a:hover { color: #411; background: #D29B4E; } /* ----------------------- for Landscape and Portrait Viewer --------------------------------------*/ .Viewer-float-left { float: left; width: 600px; height: 400px; padding: 10px; margin: 10px; } .Viewer-float-left-portrait { float: left; width: 267px; height: 400px; padding: 10px; margin: 10px; } .Viewer-float-left-pano { float: left; width: 800px; height: 450px; padding: 10px; margin: 10px; } .Viewer-float-800-c { width: 800px; height: 533px; padding: 10px; margin: 10px; } .Viewer-float-pano-c { width: 800px; height: 450px; padding: 10px; margin: 10px; } .Viewer-center-pano { width: 800px; height: 450px; padding: 10px; margin: 10px; } .Viewer-float-pano-350-c { width: 800px; height: 350px; padding: 10px; margin: 10px; } .Viewer-float-pano-200-c { width: 800px; height: 200px; padding: 10px; margin: 10px; } /*--------------------- Thumbnail Image classes ------------------------------------------------------------*/ .Thumb-Image-P { width: 56px; height: 84px } .Thumb-Image-L { width: 125px; height: 84px } /*--------------------- Ian's Image ------------------------------------------------------------*/ img#FI-ian { width: 180px; height: 270px; padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } /*------------------------------ Paddings -------------------------------------------------------------*/ .pad-1px { padding-top: 1px; padding-bottom: 1px; padding-left: 1px; padding-right: 1px; } .pad-10px { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } /*------------------------------ Margins -------------------------------------------------------------*/ .margin-1px { margin-top: 1px; margin-bottom: 1px; margin-left: 1px; margin-right: 1px; } .margin-10px { margin-top: 10px; margin-bottom: 10px; margin-left: 10px; margin-right: 10px; } /*------------------------------ One off items ------------------------------------------------------------*/ body { background-color: #000000; font-family: "Verdana", Times, serif; } /* height: 133px; */ img#navbackground { width: 100%; height: 133px; hspace: 0; vspace: 0; } img#MastHeadPicture { width: 950px; height: 100px; } /*---------------------------------- make a box number to chnage thumb lists ----------------------------------*/ .boxnumber { font-family: "Verdana", Times, serif; font-size: 12px; color: #ECE9D8; font-weight: bold; padding-top: 1px; padding-bottom: 1px; padding-left: 1px; padding-right: 1px; } .boxnumber a { display: block; color: #D29B4E; } .boxnumber a { border-right: none; } /*------------------------------ splash page - main logo ------------------------------------------------------------*/ /* position:absolute; width:250px; height:150px;z-index:5; left: 198px; top: 127px; align:center; */ div#HP-logo p { align: center; } div#HP-logo img { width: 887px; height: 322px; align:center; } /*------------------------------ FI Logo ------------------------------------------------------------*/ /* width:349px; height:105px; */ /* left: 15px; top: 17px; */ /*background-image:url(../Page-items/G-W gradient - 100x141.jpg); background-repeat: no-repeat; */ div#FILogo { position:absolute; left: 15px; top: 17px; width: 30%; height: 30%; align: left; } /* width: 350px; height: 127px; */ div#FILogo img { width: 100%; height: 100%; align: left; } /*------------------------------ FIRight ------------------------------------------------------------*/ /* a block used to fix the header */ div#FIHeader { width: 100%; height: 80px; background-image: url(Page-items/G-W gradient 100% 1260x80.jpg); background-color: #ECE9D8; } /*------------------------------ FIRight ------------------------------------------------------------*/ /* a block used to fix the right hand margin */ div#FIRight { float: right; width: 100px; height: 200px; background: green; } /*------------------------------ FI Logo ------------------------------------------------------------*/ /* a block used to fix the bottom of the frame */ div#FIFooter { clear: both; background: orange; color: #ECE9D8; font: 12px Verdana; text-align: left; } /*------------------------------ lHome page image loading -----------------------------------------------------*/ /* width 631px height:202px position:absolute;left: 333px; top: 209px; z-index:5; */ div#imgloading { margin-left: 200px; margin-right: 25px; } /* width 800 height 500 or 600x375 or 500x333*/ div#imgloading img { width: 800px; height: 500px; } /*-------------------------------Home Page - Main Picture ----------------------------------------------------*/ /* width: 600px; height: 400px; */ img#Home_Picture_1 { width: 600px; height: 400px; margin-top: 7px; border: 0px; } /*-------------------------------Tag cloud search - Main Picture ----------------------------------------------------*/ /* width: 600px; height: 400px; */ img#Tag_Picture_1 { width: 600px; height: 400px; margin-top: 7px; border: 0px; } /*------------------------------ navigation link box--------------------------------------------------------*/ /* width 166px; height: 410px; position: absolute; top: 209px; left: 67px; margin-left:25px; clear: left; border-right: 5px solid #C8AD87;*/ div#Links { position: absolute; top: 150px; left: 10px; float: left; width:142px; font: 12px Verdana; z-index: 100; } div#Links a { display: block; text-align: center; font: bold 1em Verdana; padding: 2px 2px; margin: 1px 1px; border-width: 0; text-decoration: none; color: #FFC; background: #444; } div#Links a:hover { color: #411; background: #D29B4E; border-right: 5px double white; border-left: 5px double white; } div#Links a span { display: none; } /* width: 500px; top:138px;*/ div#Links a:hover span { display: block; position: absolute; left: 8px; width: 500px; top: -30px; padding: 5px; margin: 0px; z-index: 100; color: #D29B4E; background: black; font: 12px Verdana bold; text-align: left; } /*---------------------------- Gallery Block -----------------------------------------------------------*/ div#Galleryblock { padding-left: 30px; } div#Galleryblock a { color: #C8AD87; } /*------------------------------ Gallery Thumbs ------------------------------------------------------------*/ div#GalleryThumbs a { padding: 2px 2px; margin: 1px 1px; border-width: 0; } div#GalleryThumbs img { border: 0; } /* take away the border flash ftb "border-right: 5px double #D29B4E;" as this looks OTT!? */ div#GalleryThumbs a:hover { text-decoration: none; } div#GalleryThumbs a:link { text-decoration: none; } div#GalleryThumbs a span { display: none; } /* disable this function as it does not look very good div#GalleryThumbs a:hover span { display: block; position: absolute; left: 850px; width: 150px; top: 130px; border-bottom-style:none; padding: 5px; margin: 0px; z-index: 100; color: #D29B4E; background: black; font-family: "Verdana", Times, serif; font: 14px bold; text-align: left; } */ /*-------------------------- landscape viewer ---------------------------------------------------*/ div#landscapeviewer a { color: #C8AD87; } /*-------------------------- portrait viewer ---------------------------------------------------*/ div#portraitviewer a { color: #C8AD87; } /*------------------------------ latest fozlogs ------------------------------------------------------------*/ div#latestfozlog { padding-left: 10px; } div#latestfozlog a { color: #C8AD87; } div#latestfozlog a:hover { color: #411; background: #D29B4E; } div#latestfozlog-l { padding-left: 10px; } div#latestfozlog-l a { color: #C8AD87; } div#latestfozlog-l a:hover { color: #411; background: #D29B4E; } div#latestfozlog-r { padding-left: 10px; } div#latestfozlog-r a { color: #C8AD87; } div#latestfozlog-r a:hover { color: #411; background: #D29B4E; } /*------------------------------ about page ------------------------------------------------------------*/ /* position:absolute; width:845px; height:468px; zindex:101; left: 327px; top: 209px; */ div#abouttext { padding-left: 50px; } div#abouttext a { color: #C8AD87; } /* div#abouttext a:hover { color: #411; background: #D29B4E; } div#abouttext a span { display: none; } div#abouttext a:hover span { display: block; position: absolute; left: 11px; width: 500px; top: 120px; padding: 5px; margin: 0px; z-index: 100; color: #D29B4E; background: black; font: 12px Verdana bold; text-align: left; } */ /*------------------------------ Project List ------------------------------------------------------------*/ div#projectlist { padding-left: 30px; margin-top: 5px; padding-top: 10px; } div#projectlist a { display: block; text-align: left; font: bold 1em Verdana; padding: 2px 2px; margin: 1px 1px; border-width: 0; text-decoration: none; color: #FFC; background: #444; } div#projectlist a:hover { color: #411; background: #D29B4E; border-right: 5px double white; border-left: 5px double white; } /*------------------------------ feedback page ------------------------------------------------------------*/ div#feedbacktext { position:absolute; width:846px; height:135px; z-index:5; left: 328px; top: 209px; } div#feedbacktext a { color: #C8AD87; } div#feedbacktext a:hover { color: #411; background: #D29B4E; } div#feedbacktext a span { display: none; } div#feedbacktext a:hover span { display: block; position: absolute; top: 500px; left: 0; width: 750px; padding: 5px; margin: 10px; z-index: 100; color: #FFF; background: black; font: 20px Verdana; text-align: left; } /*------------------------------ news page ------------------------------------------------------------*/ /* position:absolute; width:845px; height:468px; zindex:101; left: 327px; top: 209px; */ div#newstext { padding-left: 75px; padding-right: 75px; } div#newstext a { color: #C8AD87; } /* div#newstext a:hover { color: #411; background: #D29B4E; } div#newstext a span { display: none; } div#newstext a:hover span { display: block; position: absolute; top: 500px; left: 0; width: 750px; padding: 5px; margin: 10px; z-index: 100; color: #FFF; background: black; font: 20px Verdana; text-align: left; } */ /*------------------------------ subject index page ------------------------------------------------------------*/ div#subjecttext { position:absolute; width:846px; height:135px; z-index:5; left: 328px; top: 209px; } /*------------------------------ Image of the Day -----------------------------------------------------------------*/ div#Iotd a { display: block; text-align: center; font: bold 1em Verdana; padding: 2px 2px; margin: 1px 1px; border-width: 0; text-decoration: none; color: #FFC; background: #444; } div#Iotd a:hover { color: #411; background: #D29B4E; border-right: 5px double white; border-left: 5px double white; } /*------------------------------ Fozlog - Month navigation -----------------------------------------------------------------*/ div#FLMonth a { display:block; text-align: left; padding: 2px 2px; margin: 1px 1px; border-width: 0; text-decoration: none; color: #FFC; background: #444; } div#FLMonth a:hover { color: #411; background: #D29B4E; border-right: 5px double white; border-left: 5px double white; } div#FLMonth1 a { text-align: left; font: bold 1em Verdana; padding: 2px 2px; margin: 1px 1px; border-width: 0; text-decoration: none; color: #FFC; background: #444; } div#FLMonth1 a:hover { color: #411; background: #D29B4E; border-right: 5px double white; border-left: 5px double white; } /*------------------------------ purchase page ------------------------------------------------------------*/ div#purchasetext { position:absolute; width:873px; height:135px; z-index:5; left: 328px; top: 209px; } div#purchasetext a { color: #C8AD87; } div#purchasetext a:hover { color: #411; background: #D29B4E; } div#purchasetext a span { display: none; } div#purchasetext a:hover span { display: block; position: absolute; top: 500px; left: 0; width: 750px; padding: 5px; margin: 10px; z-index: 100; color: #FFF; background: black; font: 20px Verdana; text-align: left; } /*------------------------------ links page ------------------------------------------------------------*/ div#linkstext { position:absolute; width:594px; height:135px; z-index:5; left: 328px; top: 209px; } div#linkstext a { color: #C8AD87; } div#linkstext a:hover { color: #411; background: #D29B4E; } div#linkstext a span { display: none; } div#linkstext a:hover span { display: block; position: absolute; top: 500px; left: 0; width: 750px; padding: 5px; margin: 10px; z-index: 100; color: #FFF; background: black; font: 20px Verdana; text-align: left; } /*----------------------------- A38 project navigation table ---------------------------------------------*/ table#A38table { width:180px; border:1; cellpadding:2; cellspacing:2; border-right: 5px double #D29B4E; border-left: 5px double #D29B4E; border-top: 5px double #D29B4E; border-bottom: 5px double #D29B4E; } /* ------------ Thumbnail Nav Styles ----------------------- */ div#FI-G-Thumb a { font: bold 12px Verdana; padding: 3px 3px; margin: 1px 1px; border-width: 0; text-decoration: none; color: #FFC; background: #444; } div#FI-G-Thumb a:hover { color: #411; background: #D29B4E; /* border-right: 2px double white; border-left: 2px double white; */ } /*---------------------------------------------------------------------------------------------------------*/