/* This file is used on: gallery_ajax.cfm, gallery_page.cfm, video_gallery_ajax.cfm and video_gallery_page.cfm */ /* IMAGE GALLERY */ .gallery { padding:2px 0; margin:0; } .gallery .container { border:0; width:auto; padding:15px 4px; display:block; position:relative; overflow:hidden;} .gallery .container .row { margin:0 auto; display:table; height:auto; width:100%; clear:both; } .gallery .container .image { float:left; margin:4px 9px; width:172px; height:auto; position:relative; } .gallery .container .image .imageTop { background:url(../../images/video_gallery/bg_video.png); padding:10px 15px; height:130px; width:auto; } .gallery .container .image:hover .imageTop { background:url(../../images/video_gallery/bg_video-over.png); } .gallery .container .image .imageBottom { background:url(../../images/video_gallery/bg_video.png) bottom left; padding:0 15px; height:5px; width:auto;} .gallery .container .image:hover .imageBottom { background:url(../../images/video_gallery/bg_video-over.png) bottom left; } .gallery .container .image .imageContainer { width:140px; height:105px; position:relative; cursor:pointer; } .gallery .container .image .imageContainer img { width:4px; height:4px; border:0; } .gallery .container .image .imageContainer .topRowContainer{ width:100%; height:4px; position:absolute; top:0; left:0; } .gallery .container .image .imageContainer .bottomRowContainer{ width:100%; height:4px; position:absolute; bottom:0px; left:0; } .gallery .container .image p { margin:0; padding:0; font-family:'Tahoma'; font-size:11px; line-height:13px; text-align:left; } .gallery .container .image .image_title { padding:2px 0 0 0; font-weight:bold; color:#AAA; } .gallery .container .image:hover .image_title { font-weight:bold; color:#555; } .gallery .container .paging { width:100%; height:24px; } .gallery .container .previous { float:left; padding-left:15px; } .gallery .container .next { float:right; padding-right:15px; } .gallery .container .paging div { font-weight:bold; font-size:12px; cursor:pointer; vertical-align:bottom; } .gallery .container .paging div:hover { color:#555; } .gallery .container .gallery_loading { margin:0 auto; height:172px; text-align:center; margin-top:40px; } .gallery .container .no_photos{ margin-top:100px; text-align:center } /* VIDEO GALLERY */ .videoGallery { padding:2px 0; margin:0; } .videoGallery .container { width:auto; padding:15px 4px; display:block; overflow:hidden; position:relative; } .videoGallery .container .row { margin:0 auto; display:table; height:auto; width:100%; clear:both; } .videoGallery .container .video { float:left; padding:10px 15px; margin:4px 9px; width:142px; height:160px; position:relative; background:url(../../images/video_gallery/bg_video.png); } .videoGallery .container .video:hover { background:url(../../images/video_gallery/bg_video-over.png); } .videoGallery .container .video .imageContainer { width:140px; height:105px; position:relative; cursor:pointer; } .videoGallery .container .video .imageContainer img { width:4px; height:4px; } .videoGallery .container .video .imageContainer .topRowContainer{ width:100%; height:4px; position:absolute; top:0; left:0; } .videoGallery .container .video .imageContainer .bottomRowContainer{ width:100%; height:4px; position:absolute; bottom:0px; left:0; } .videoGallery .container .video p { margin:0; padding:0; font-family:'Tahoma'; font-size:11px; line-height:13px; text-align:left; } .videoGallery .container .video .video_title { padding:2px 0 0 0; font-weight:bold; color:#555555; } .videoGallery .container .video .video_title:hover { cursor:pointer; text-decoration:underline; } .videoGallery .container .video .video_length { color:#B9B9B9; } .videoGallery .container .video .play_button { position:absolute; bottom:0; left:0px; width:170px; height:20px; cursor:pointer; background:url(../../images/video_gallery/bg_video-play-btn.png) repeat-x; border:1px solid #DADADA; } .videoGallery .container .video .play_button p { font-size:10px; color:#B2B2B2; text-align:center; vertical-align:top; padding-top:3px; } .videoGallery .container .video:hover .play_button { background:url(../../images/video_gallery/bg_video-play-btn-over.png) repeat-x; border:1px solid #555;} .videoGallery .container .video:hover .play_button p { color:#FFF;} .videoGallery .container .paging { width:100%; height:24px; } .videoGallery .container .previous { float:left; padding-left:15px; } .videoGallery .container .next { float:right; padding-right:15px; } .videoGallery .container .paging div { font-weight:bold; font-size:12px; cursor:pointer; vertical-align:bottom; } .videoGallery .container .paging div:hover { color:#555; } .videoGallery .container .gallery_loading { margin:0 auto; height:172px; text-align:center; margin-top:40px; } .videoGallery .container .no_videos{ margin-top:100px; text-align:center } /* lightview.css http://www.nickstakenburg.com/projects/lightview */ #lightview { position: absolute; top: 50%; left: 50%; height: 150px; width: 150px; margin: -75px 0 0 -75px; padding: 0; } /* The container that holds everything */ .lv_Container { position: relative; width: 100%; height: 100%; background: none; padding: 0; margin: 0; } .lv_Button { cursor: pointer; text-decoration: none; border: none; background: none; margin: 0; padding: 0; } /* The buttons on the side when you view a gallery */ .lv_Sides { position: absolute; top: 50%; left: 0; clear: both; width: 100%; padding: 0; margin: 0; } .lv_Sides * { padding: 0; margin: 0; } .lv_Sides li { list-style-type: none; position: relative; } .lv_PrevSide { float: left; } .lv_NextSide { float: right; } .lv_Sides .lv_Wrapper { width: 100%; height: 100%; cursor: pointer; } .lv_Sides .lv_Button { float: left; background: none; } /* The frames above and below the center, that hold the corners. It's recommended not to change anything here, a lot is done in javascript to build further upon this based on your settings. */ .lv_Frames { width: 100%; height: 100%; position: relative; padding: 0; margin: 0; } .lv_Frames li { list-style-type: none; margin: 0; padding: 0; } .lv_Frame { width: 100%; display: block; } .lv_Frame * { padding: 0; margin: 0; } .lv_FrameTop { position: absolute; left: 0; width: 100%; display: block; } .lv_FrameBottom { position: relative; float: left; clear: both; } .lv_Liquid { position: relative; float: left; width: 100%; overflow: hidden; clear: both; } .lv_Liquid .lv_Filler { position: absolute; height: 100%; width: 2px; top: 0; left: 50%; } .lv_Half { display: block; height: 100%; clear: both; line-height: 0px; } .lv_Half li { list-style-type: none; } .lv_Corner { float: left; position: relative; } .lv_CornerTr, .lv_CornerBr { float: right; } .lv_Fill { position: absolute; top: 0; width: 100%; height: 100%; } .lv_Half .lv_CornerWrapper { float: left; position: relative; width: 50%; height: 100%; overflow: hidden; } .lv_HalfRight .lv_CornerWrapper { float: right; } .lv_Corner { position: relative; } .lv_Corner canvas { position: relative; } .lv_HalfLeft .lv_Corner { float: left; } .lv_HalfRight .lv_Corner { position: relative; float: right; } /* To position content correctly in the center with correct rounded corner display we need a few wrappers. This is to get it right on all browsers. */ .lv_Center { position: relative; clear: both; height: 100%; overflow: hidden; background: none; padding: 0; margin: 0; } .lv_WrapUp { position: absolute; left: 0; height: 100%; width: 100%; overflow: hidden; padding: 0; margin: 0; } .lv_WrapDown { position: relative; height: 100%; width: 100%; overflow: hidden; padding: 0; margin: 0; } .lv_WrapCenter { position: relative; padding: 0; margin: 0; } /* The loading indicator */ .lv_Loading { position: absolute; top: 50%; left: 50%; } .lv_Loading .lv_Button { float: left; height: 100%; width: 100%; } .lv_MediaWrapper { position: relative; width: 100%; display: block; overflow: hidden; clear: both; padding: 0; margin: 0; } .lv_MediaWrapper img { position: relative; float: left; padding: 0; margin: 0; } /* The overlays on top of images that toggle the previous/next buttons */ .lv_PrevNext { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; margin: 0; } .lv_PrevNext * { padding: 0; margin: 0; } .lv_PrevNext .lv_Button { position: relative; height: 100%; } .lv_PrevButton { float: left; } .lv_NextButton { float: right; } /* The bar that holds title, caption, imagenumber, slideshow and closebutton */ .lv_MenuBar { clear: both; position: relative; width: 100%; float: left; font: 11px Arial, Helvetica, sans-serif; color: #808080; padding: 0; margin: 0; text-align:left; } .lv_MenuBar * { padding: 0; margin: 0; } /* When the Menubar is at the top, on (ajax/iframe/inline) content, it will also have this style. The margins are removed here for better alignment, and since it's at the top we switch the inner margins to the other side. */ .lv_MenuTop .lv_DataText div, .lv_MenuTop .lv_ImgNumber div { margin: 0; padding: 0; } #lightview .lv_MenuTop .lv_Close, #lightview .lv_MenuTop .lv_Data { margin: 0 0 6px 0; } .lv_Close, .lv_Data { margin: 6px 0 0 0; } .lv_Close { position: relative; float: right; overflow: hidden; width: 100%; height: 100%; } .lv_Data { position: relative; float: left; padding-bottom: 3px; line-height: 13px; } /* simulates padding-left inside .lv_Data */ .lv_DataText div, .lv_ImgNumber div { margin-left: 3px; } .lv_Data li { list-style-type: none; float: left; margin-top: 3px; } .lv_DataText { width: 100%; } .lv_DataText .lv_Title { font-weight: bold; margin-bottom: 2px; } .lv_DataText .lv_Caption { clear: both; } .lv_Data .lv_ImgNumber { color: #b8b8b8; margin-right: 5px; margin-top: 5px; } .lv_Data .lv_innerPrevNext, .lv_Data .lv_Slideshow { position: relative; border-left: 1px solid #efefef; padding: 0 5px; margin-top: 5px; vertical-align: middle; } .lv_Data .lv_Slideshow { padding-right: 0px; } .lv_Data .lv_innerPrevNext .lv_Button, .lv_Data .lv_Slideshow .lv_Button { /* play and stop */ float: left; background-position: center left; background-repeat: no-repeat; } /* the boxes that hold media or external content */ .lv_Media, .lv_External { position: relative; float: left; margin: 0; padding: 0; } #lightview iframe { border: 0; clear: both; padding: 0; margin: 0; background: none; } /* The container that hold buttons above the view, currently only topclose */ .lv_topButtons { position: absolute; left: 0; width: 100%; overflow: hidden; margin: 0; padding: 0; } .lv_topcloseButtonImage { cursor: pointer; } /* The error/warning/download message that will appear when a required plugin is not installed. */ #lightviewError p { padding: 0 0 10px 0; } #lightviewError div { padding: 6px; font: 11px Arial, Helvetica, sans-serif; } #lightviewError .message { background: #fcb5b5; color: #dd1f1f; margin-bottom: 3px; } #lightviewError .type { font-weight: bold; } #lightviewError .pluginspage { background: #b5fcbd; color: #21be30; } #lightviewError a, #lightviewError a:hover, #lightviewError a:visited { color: #21be30; text-decoration: none; background: none; font-weight: bold; border-bottom: 1px solid #7de689; } #lightviewError p { margin-left: 0; padding: 0; } #overlay { position: absolute; /* Opera will use fixed */ top: 0; left: 0; height: 100%; width: 100%; } * html #lightview { /* IE6 */ position: absolute; margin-top: expression( (-1 * this.offsetHeight / 2 + (document.documentElement ? document.documentElement.scrollTop : 0) + (Lightview.navbarHeight || 0)) + 'px'); margin-left: expression( -1 * this.offsetWidth / 2 + (document.documentElement ? document.documentElement.scrollLeft : 0) + 'px'); } /* Always cover 100% of the screen in IE6 */ html #overlay { position: absolute; height: expression(((window.Enumerable && window.Enumerable.max) ? [document.body.scrollHeight, document.documentElement.scrollHeight, document.body.offsetHeight, document.documentElement.clientHeight].max() : document.documentElement.scrollHeight) + 'px' ); width: expression(((window.Enumerable && window.Enumerable.max) ? [document.body.scrollWidth, document.documentElement.scrollWidth, document.body.offsetWidth, document.documentElement.clientHeight].max() : document.documentElement.scrollWidth) + 'px' ); } div.datepicker { position: absolute; text-align: center; border: 1px #C4D5E3 solid; font-family: arial; background: #FFFFFF; font-size: 10px; padding: 0px; } div.datepicker table { font-size: 10px; margin: 0px; padding: 0px; text-align: center; width: 180px; } div.datepicker table thead tr th { font-size: 12px; font-weight: bold; background: #e9eff4; border-bottom:1px solid #c4d5e3; padding: 0px; margin: 0px; } div.datepicker table tbody tr { border: 1px white solid; margin: 0px; padding: 0px; } div.datepicker table tbody tr td { border: 1px #eaeaea solid; margin: 0px; padding: 0px; text-align: center; } div.datepicker table tbody tr td:hover, div.datepicker table tbody tr td.outbound:hover, div.datepicker table tbody tr td.today:hover { border: 1px #c4d5e3 solid; background: #e9eff4; cursor: pointer; } div.datepicker table tbody tr td.wday { border: 1px #ffffff solid; background: #ffffff; cursor: text; } div.datepicker table tbody tr td.outbound { background: #e8e4e4; } div.datepicker table tbody tr td.today { border: 1px #16518e solid; background: #c4d5e3; } div.datepicker table tbody tr td.nclick, div.datepicker table tbody tr td.nclick_outbound { cursor:default; color:#aaa; } div.datepicker table tbody tr td.nclick_outbound { background:#E8E4E4; } div.datepicker table tbody tr td.nclick:hover, div.datepicker table tbody tr td.nclick_outbound:hover { border: 1px #eaeaea solid; background: #FFF; } div.datepicker table tbody tr td.nclick_outbound:hover { background:#E8E4E4; } div.datepicker table tfoot { font-size: 10px; background: #e9eff4; border-top:1px solid #c4d5e3; cursor: pointer; text-align: center; padding: 0px; } /* Starbox.css */ .starbox .stars { background: #E0E0E0; } .starbox .rated .stars { background: #E0E0E0; } .starbox .rated .hover .stars { background: #E0E0E0; } .starbox .colorbar { background:#F66C21; } .starbox .hover .colorbar { background:#F66C21; } .starbox .rated .colorbar { background:#F66C21; } .starbox .rated .hover .colorbar { background:#F66C21; } .starbox .ghost { background:#F66C21; } .starbox .indicator { font-size: 0.9em; } .starbox .dotted .stars, .starbox .dotted .hover .stars, .starbox .dotted .rated .stars, .starbox .dotted .rated .hover .stars { background: url(../images/starbox/background_dotted.gif) top left repeat-x; } .starbox .dotted .colorbar, .starbox .dotted .hover .colorbar, .starbox .dotted .rated .colorbar, .starbox .dotted .rated .hover .colorbar { background: #000000; } .starbox .dotted .ghost { background: #666666; } .starbox .pointy .colorbar { background: #ffcc1c; } .starbox .pointy .hover .colorbar { background: #ff9231; } .starbox .inverse .stars { float: right; } .starbox .inverse .indicator { clear: both; display: block; text-align: right; } /* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */ /*-------------------------------------------------- REQUIRED to hide the non-active tab content. But do not hide them in the print stylesheet! --------------------------------------------------*/ .tabberlive .tabbertabhide { display:none; } /*-------------------------------------------------- .tabber = before the tabber interface is set up .tabberlive = after the tabber interface is set up --------------------------------------------------*/ .tabber { } .tabberlive { margin-top: 0; } /*-------------------------------------------------- ul.tabbernav = the tab navigation list li.tabberactive = the active tab --------------------------------------------------*/ ul.tabbernav { float: left; width: 100%; list-style: none; margin: 0 0 10px 0; padding: 2px 0 0 0; border-bottom: 1px solid #fff; background: transparent url("../images/tab_bg.gif") repeat-x; } ul.tabbernav li { display: inline; } ul.tabbernav li a { display: block; float: left; text-decoration: none; color: #CC0000; padding: 6px 5px 5px 5px; margin: 0 0 -1px 4px; border-bottom: 1px solid #fff; } ul.tabbernav li a:hover { color: #666; background: #ecf7ff; text-decoration: none; } ul.tabbernav li.tabberactive a { padding: 4px 4px 5px 4px; color: #CC0000; position: relative; bottom: -1px; border: 1px solid #fff; border-bottom: 1px solid #fff; background: #fff; font-weight: bold; } /*-------------------------------------------------- .tabbertab = the tab content Add style only after the tabber interface is set up (.tabberlive) --------------------------------------------------*/ .tabberlive .tabbertab { padding:5px; border-top:0; /* If you don't want the tab size changing whenever a tab is changed you can set a fixed height */ /* height:200px; */ /* If you set a fix height set overflow to auto and you will get a scrollbar when necessary */ /* overflow:auto; */ } /* If desired, hide the heading since a heading is provided by the tab */ .tabberlive .tabbertab h2 { display:none; } .tabberlive .tabbertab h3 { display:none; } .tabberlive .tabbertab h4 { display:none; } /* Example of using an ID to set different styles for the tabs on the page */ .tabberlive#tab1 { } .tabberlive#tab2 { } .tabberlive#tab2 .tabbertab { height:200px; overflow:auto; } /*-- Calendar styles --*/ .cal { margin: 10px; } .cal .cal_header { width: 100%; position: relative; height: 50px; text-align: center; } .cal .cal_header strong { color: #a8161c; text-align: center; font-size: 140%; margin: 0; } .cal .cal_header a.prev { position: absolute; top: 0; left: 0; } .cal .cal_header a.next { position: absolute; top: 0; right: 0; } .cal table { width: 100%; border-collapse: collapse; border-spacing: 0; } .cal table th { background: transparent url(../images/calendar/cal_dow_bg.gif) repeat-x bottom; color: #BEBEBE; width: 14.2%; padding: 6px; border: 1px solid #BEBEBE; font-weight:bold; font: 11px Arial, Helvetica, sans-serif; } .cal table td { background: #F8F8F8; color: #56493d; padding: 6px; border: 1px solid #BEBEBE; height: 75px; vertical-align: top; } .cal table td .cal_date { float: right; display: block; color: #888; background: #fff; width: 18px; height: 18px; line-height: 18px; text-align: center; position: relative; top: -6px; right: -6px; } .cal table td.today { background: #fff; } .cal table td.today .cal_date { font-weight: bold; } .cal table td.blank { background: #efefef; } .cal table td.weekend { background: #efefef; } .cal .date-events { margin: 0 !important; } .cal .date-events li { list-style: none; } /*-- Mini Calendar styles --*/ .mini_cal { margin: 0; } .mini_cal .cal_header { width: 220px; position: relative; height: 20px; text-align: center; margin: 0 auto; } .mini_cal .cal_header strong { color: #a8161c; } .mini_cal .cal_header a.prev { position: absolute; top: 0; left: 0; } .mini_cal .cal_header a.next { position: absolute; top: 0; right: 0; } .mini_cal table { width: 220px; border: 1px solid #BEBEBE; border-collapse: collapse; margin: 5px auto; } .mini_cal table th { background: transparent url(../images/calendar/minical_heading.gif) repeat-x; color: #AAA; padding: 4px 2px; } .mini_cal table td { padding: 4px 2px; text-align: center; } .mini_cal table tr.alt { background: #EBEBEB; } /*-- Misc --*/ .cal_loading { display: block; width: 100%; height: 16px; background: transparent url(../images/calendar/indicator.gif) no-repeat 50% 50%; }