/* DEFAULT STYLES */ body { background:#e8e8e8; font-size:12px; line-height:18px; min-width:1000px; min-height:20px; font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif; } * { margin: 0; outline: none; } p {padding-bottom:18px;} ul {margin-bottom:24px;} .sf-menu, .blog-post .comments {font-family: 'Marvel', /*'BebasNeueRegular', */ arial, serif;} #randomdiv {font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif;} h1, h2, h3, h4, h5, h6, .sub-navigation, #previous_link, #next_link, form#contactform input.submit-form {text-transform:uppercase; font-weight:normal; font-family: 'Marvel',/*'BebasNeueRegular', */ arial, serif;} h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { text-decoration:none; } h1 { font-size:42px; line-height:38px; margin-bottom:3px;} h2 { font-size:35px; line-height:32px; margin-bottom:2px;} h3 { font-size:27px; line-height:24px; margin-bottom:2px; } h4 { font-size:24px; line-height:22px; margin-bottom:2px;} h5 {font-size:18px; line-height:19px; margin-bottom:2px;} h6 {font-size:14px; line-height:24px; margin-bottom:2px;} iframe {border:0px; margin:0px; padding:0px; } img.noborder {border:none !important;} #bg { position: fixed; top: 0; left: 0; } .bgwidth { width: 100%; } .bgheight { height: 100%; } .center-align {text-align:center;} .left-align {text-align:left;} .right-align {text-align:right;} .alignright {float:right; margin:0 0 10px 10px;} .alignleft {float:left; margin:0 10px 10px 0;} .aligncenter { margin:4px 0 10px 0; text-align:center;} /* BODY LINK COLOUR AND MISC COLORS */ body, a, ul.sub-navigation li a {color:#515151;} /* Dark Grey Color for Links and some Headings Default: #515151 */ .content-heading h5, .content-heading h6, .side-barheading h2 {color:#515151 !important;} a:hover {color:#000;} /* Main hover link color */ .portfolio_carousel .description h5 a, .portfolio_carousel .description h5 {color:#fff !important;} #footer, #footer a {color:#fff;} /* Footer Text and Link Color Default #fff */ #footer a:hover {color:#e7e7e7;} /* Footer Link Hover Color Default #e7e7e7 */ .sf-menu a, .sf-menu a:visited { color: #fff;} /* Color for the Navigation link Default #fff */ .light-fonts, .light-fonts h1, .light-fonts a, .light-fonts h1, .navigation-menu h1 {color:#fff !important;} /* .light-fonts class Font Color Default #fff*/ .light-fonts a:hover {color:#e7e7e7;} /* .light-fonts class Link Font Color Default #e7e7e7 */ .custom-color {color:#fcc73c;} /* Custom Color Orange Used in Space Template Index Page Default #fcc73c */ /* CAROUSEL and SCROLL HEIGHTS */ .content-container .list_carousel li { height:370px;} /* Default Carousel Container Height */ .portfolio-carousel ul li {height:300px !important;} /* Portfolio Carousel Image Gallery Height */ .content-container .news_carousel li { height:356px;} /* Latest Carousel News Regular Height */ .news_carousel .scroll-pane { height:315px;} /* Latest News Carousel Scrolling Height */ /* MENU AND NAVIGATION POSITIONING AND WIDTH */ #featured { position: relative; float:right;} #left-container { float:left; width:270px; position:relative; } .navigation-menu {width:180px; z-index:16; position:relative; top:0; } .side-barheading {width:210px; z-index:5; position:absolute; right:0; top:170px; } .logo-menu {text-align:center; position:relative; top:0; z-index:15; } .bottom-box .logo-menu {margin-bottom:65px;} .top-box { position:absolute; top:0px; right:0px; } .bottom-box {position:absolute; bottom:0px; right:0px; } .hover-box {padding:6px 15px 2px 15px; } .navigation-menu h1 {font-size:17px; margin:0px; line-height:20px; font-weight: bold; } .navigation-menu h1:hover {cursor:pointer;} ul.sub-navigation {width:650px; margin:18px 0 0 0; } ul.sub-navigation li {display:inline;} ul.sub-navigation li a {margin-right:25px; font-size:18px; text-decoration:none;} /* MAIN STYLES */ #box-container {position:absolute; width:100%; top:50%;} .content-container {float:right; display:inline-block; width:650px; padding:60px 50px 0px 0px; position:relative; z-index:5;} #page-wrap { position: relative; width:980px; margin:0 auto; } #container {background:white; width:980px; margin-bottom:5px; } .featured-heading {margin:145px 180px 0 0; text-align:right; } .featured-text {width:200px; float:right; margin-right:50px;} .featured-heading2 {margin:120px 180px 0 0; text-align:right; } .content-heading {padding-left:25px; width:625px; overflow:hidden;} .latest-news-heading {float:left; position:absolute; left:0px; top:75px; z-index:25; } blockquote {font-style:italic; line-height:22px; font-size:13px; color:#626262; background:url(../images/blockquote.png) 15px 9px no-repeat; padding:5px 0 0 50px; margin-bottom:20px;} .content-container ul, .content-container ol {padding-bottom:18px;} .content-container ul.checkmark li { margin-left:0px; background:url(../images/checkmark.png) 0px 4px no-repeat; padding:0 0 2px 20px; list-style:none;} .content-container ul.arrow li { margin-left:0px; background:url(../images/sidebar-arrow.png) 0px 4px no-repeat; padding:0 0 2px 20px; list-style:none;} .content-container ul li {list-style:disc; margin-left:20px;} .content-container ol li {list-style:decimal; margin-left:23px;} a.button, a.big-button {font-family: Arial, sans-serif; display: inline-block; text-decoration: none; line-height: 1; border-radius: 4px; -moz-border-radius: 4px; padding: 10px 19px 11px 19px;} a.button {font-size:12px; font-weight:bold; color:#858585; background: #f6f6f6 url(../images/big-button-overlay.png) top left repeat-x; -moz-box-shadow: 0 1px 3px #ccc; -webkit-box-shadow: 0 1px 3px #ccc box-shadow:0 1px 3px #ccc; border-bottom: 1px solid #b8b8b8; position: relative; cursor: pointer;} a.button:hover {background-color:#fff; color:#787878;} a.big-button {font-size:14px; font-weight:bold; color:#fff; background: #434343 url(../images/big-button-overlay.png) top left repeat-x; -webkit-border-radius: 4px; -moz-box-shadow: 0 1px 4px #999; -webkit-box-shadow: 0 1px 4px #999; box-shadow:0 1px 4px #999; border-bottom: 1px solid #343434; position: relative; cursor: pointer; } a.big-button:hover {background-color:#373737; color:#fff;} table {border:1px solid #ccc; background:#ecebeb; width:100%; margin:8px 0 0 0; } table td {padding:8px; border:1px solid #d6d6d6;} table thead th {border:1px solid #ccc;} table thead {background:#dadada;} table tfoot td {padding:5px;} table thead th {padding:8px 0 8px 0;} table .t-headings {font-weight:bold; font-size:115%; background:#dadada;} table .t-footer {background:#e1e1e1; text-align:center; font-size:90%; font-style:italic;} .team-member {padding:10px 0 10px 0;} .team-member h5 {margin-bottom:3px; padding-top:5px;} .team-member img {margin-right:15px; float:left;} .divider {border-bottom:1px solid #b7b7b7; color:#9f9f9f; margin-bottom:30px; padding-bottom:10px;} /* BLOG SECTION STYLES */ .blog-post {width:585px; overflow:hidden; margin-right:15px;} .blog-post .blog-image {float:left; width:150px; margin-bottom:15px;} .blog-post .post-content {float:right; width:435px; } .post-heading {width:435px; overflow:hidden; } .blog-post .post-data {font-size:11px; float:left; } .post-data h3 {margin-bottom:5px;} .blog-post .comments {float:right; text-align:center; width:31px; height:34px; font-size:15px; } .blog-post .comments a {color:#949494; margin-top:2px; background:url(../images/blog-comments.png) 0px 0px no-repeat; display:block; width:32px; height:28px; text-decoration:none; padding-top:6px;} .blog-post .comments a:hover {color:#6a6a6a; background:url(../images/blog-comments.png) 0px -34px no-repeat;} /* CONTACT FORM STYLES */ form#contactform input, form#contactform textarea, #contact-wrapper input.error, #contact-wrapper textarea.error, #contact-wrapper div {color:#515151;} .light-fonts form#contactform input, .light-fonts form#contactform textarea, .light-fonts #contact-wrapper input.error, .light-fonts #contact-wrapper textarea.error, .light-fonts form#contactform input.submit-form {color:#fff;} .light-fonts #contact-wrapper p.success {color:#fff; margin-bottom:0px; padding-bottom:10px;} #contact-wrapper p.success {color:#00a651; margin-bottom:0px;} #contact-wrapper .error {color:#888;} .light-fonts #contact-wrapper div {color:#333;} .light-fonts form#contactform input, .light-fonts form#contactform textarea, .light-fonts form#contactform input.submit-form {/*border-color:#B7B7B7 #e3e3e3 #E8E8E8 #B7B7B7;*/} form#contactform input, form#contactform textarea, form#contactform input.submit-form {border-color:#4c4c4c;} body.contact-body {background:transparent !important; } .contact-form #social-icons {float:none; position:absolute; bottom:0px; right:0px;} .contact-details {border-right:1px solid #888; margin:25px 40px 25px 25px; font-size:13px;} .contact-details p, .contact-details a {color: #333!important; font-weight: bold;} .contact-form {margin:25px 0 25px 0; } #contact-wrapper { width:300px; overflow:hidden; display:block; font-size:13px;} #contact-wrapper div { clear:both; font-size:11px;} #contact-wrapper label { display:block; float:right; width:auto; position:relative; right:35px; top:5px; } form#contactform input, form#contactform textarea { font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif; font-size:11px; float:left; margin-bottom:15px; background:transparent; border-style:solid; border-width:1px; padding:3px; } form#contactform textarea {float:none !important; margin-bottom:9px !important;} form#contactform input { width:205px; } #contact-wrapper .error { font-style:italic; margin-bottom:2px; margin-top:2px; font-size:10px; float:left; right:0px; top:0px;} form#contactform input.submit-form {cursor:pointer; display:inline-block; font-size:12px; line-height:1; text-decoration:none !important; width:100px; padding:5px 12px 4px 12px; } form#contactform input.submit-form:hover {background:#ccc; color:#5b5b5b;} /* FOOTER STYLES */ #footer {width:980px; overflow:hidden; font-size:10px;} #social-icons {float:left; padding:3px 0px 0px 1px;} #social-icons img {margin-right:2px;} #copyright {float:right; text-align:right; padding-right:2px;} /* CAROUSEL STYLES */ .list_carousel, .portfolio_carousel, .news_carousel { margin: 0; width: 600px; } .list_carousel ul, .portfolio_carousel ul, .news_carousel ul { width: 600px; margin: 0; padding: 0; list-style: none; display: block; } .portfolio-carousel ul li { text-align:center !important; } .content-container .list_carousel li { width: 570px; padding: 0; margin:0 0 0 30px; display: block; float: left; } .news_carousel .scroll-pane { width:370px; float:none; overflow: auto; margin:0px; padding:0 8px 0 0; } .news_carousel .news-post { width:370px; padding:25px; background:#fff; color:#888; display:block; } .news_carousel .pagination {margin-top:7px;} .content-container .news_carousel li { width: 475px; padding: 0; margin:0 0 0 125px; display: block; float: left; list-style:none; } .date-stamp h1, .date-stamp h2, .date-stamp h3, .date-stamp h5, .date-stamp h4, .date-stamp h6 {} .date-stamp {} .news_carousel .news-post a {color:#515151;} .news_carousel .news-post a:hover {color:#000;} .content-container .portfolio_carousel li a { display:block; height:210px; width:135px; text-decoration:none; color:#888 !important;} .content-container .portfolio_carousel li a:hover {background:#282828;} .content-container .portfolio_carousel li a:hover img, .thumbnails a:hover img { opacity: 0.8; filter: alpha(opacity=80); -webkit-transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; transition: opacity .5s ease-in-out; } .content-container .portfolio_carousel li { width: 135px; height:210px; padding: 0; margin:0 15px 0 0; display: block; float: left; background:#222; color:#888; font-size:10px; } .content-container .portfolio_carousel .description {padding:12px;} .content-container .portfolio_carousel li h5, .content-container .portfolio_carousel li h6, .content-container .portfolio_carousel li h4 { color:#fff; } .content-container .portfolio_carousel li a {} .clearfix { float: none; clear: both; } .prev { float: left; margin-left: 10px; padding-top:5px; font-size: 18px !important; } .next { float: right; margin-right: 10px; padding-top:5px; font-size: 18px !important; } a.next.disabled, a.prev.disabled, a.next.disabled span, a.prev.disabled span { cursor:default; color:#ccc !important; } a#previous_link-arrow, a#next_link-arrow { background:url(../images/arrow-navigation.png) top left no-repeat; width:20px; text-indent:-9999px; display:block; margin-top:15px; } a#next_link-arrow {background-position: top right !important;} a#previous_link-arrow.disabled, a#next_link-arrow.disabled { opacity:0.4; filter: alpha(opacity=40); } .pagination {text-align:center; padding-top:5px; width:300px; margin:0 auto;} .pagination a { background: url(../images/orbit/bullets2.png) no-repeat top left; width: 10px; height: 10px; overflow: hidden; display:inline-block; cursor: pointer; margin-left: 5px; } .pagination a.selected { color: #222; background-position: top right; } .pagination a span { display:none; } a#next_link, a#previous_link {text-decoration:none; font-size:13px;} a#next_link span {padding-right:5px;} a#previous_link span {padding-left:5px;} /* COLUMN LAYOUTS */ .column-container {width:100%; overflow:hidden;} .col_1_1,.col_1_2,.col_2_2,.col_1_3,.col_2_3,.col_3_3,.col_1-2_3,.col_2-3_3,.col_1_4,.col_2_4,.col_3_4,.col_4_4,.col_1-2_4,.col_2-3_4,.col_3-4_4,.col_1-3_4,.col_2-4_4,.col_1_5,.col_2_5,.col_3_5,.col_4_5,.col_5_5,.col_1-2_5,.col_2-3_5,.col_3-4_5,.col_4-5_5,.col_1-3_5,.col_2-4_5,.col_3-5_5,.col_1-4_5,.col_2-5_5{float:left;display:inline;overflow:hidden;} * html .col_1_1,* html .col_1_2,* html .col_2_2,* html .col_1_3,* html .col_2_3,* html .col_3_3,* html .col_1-2_3,* html .col_2-3_3,* html .col_1_4,* html .col_2_4,* html .col_3_4,* html .col_4_4,* html .col_1-2_4,* html .col_2-3_4,* html .col_3-4_4,* html .col_1-3_4,* html .col_2-4_4,* html .col_1_5,* html .col_2_5,* html .col_3_5,* html .col_4_5,* html .col_5_5,* html .col_1-2_5,* html .col_2-3_5,* html .col_3-4_5,* html .col_4-5_5,* html .col_1-3_5,* html .col_2-4_5,* html .col_3-5_5,* html .col_1-4_5,* html .col_2-5_5{margin-left:-.04em;} .col_1_1{width:100%;} .col_1_2,.col_2_2{width:50%;} .col_1_3,.col_2_3,.col_3_3{width:33.33%;} .col_1-2_3,.col_2-3_3{width:66.66%;} .col_1_4,.col_2_4,.col_3_4,.col_4_4{width:25%;} .col_1-2_4,.col_2-3_4,.col_3-4_4{width:50%;} .col_1-3_4,.col_2-4_4{width:75%;} .col_1_5,.col_2_5,.col_3_5,.col_4_5,.col_5_5{width:20%;} .col_1-2_5,.col_2-3_5,.col_3-4_5,.col_4-5_5{width:40%;} .col_1-3_5,.col_2-4_5,.col_3-5_5{width:60%;} .col_1-4_5,.col_2-5_5{width:80%;} .content{padding:0 10px;overflow:hidden;} .col_1_2 .content,.col_1_3 .content,.col_1-2_3 .content,.col_1_4 .content,.col_1-2_4 .content,.col_1-3_4 .content,.col_1_5 .content,.col_1-2_5 .content,.col_1-3_5 .content,.col_1-4_5 .content,.col_1-2_5 .content,.col_1-3_5 .content,.col_1-4_5 .content{padding-left:0;} .col_2_2 .content,.col_3_3 .content,.col_2-3_3 .content,.col_4_4 .content,.col_3-4_4 .content,.col_2-4_4 .content,.col_5_5 .content,.col_4-5_5 .content,.col_3-5_5 .content,.col_2-5_5 .content,.col_4-5_5 .content,.col_3-5_5 .content,.col_2-5_5 .content{padding-right:0;} .clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0;} /* * CSS Styles that are needed by jScrollPane for it to operate correctly. * * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane * may not operate correctly without them. */ /* Styles specific to this particular page */ .scroll-pane { width: 600px; float:right; overflow: auto; margin-top:15px; padding:0 8px 0 0; } .list_carousel .scroll-pane, .portfolio_carousel .scroll-pane {width:570px; float:none; margin:0px; } .horizontal-only { height: auto; max-height: 200px; } .jspContainer { overflow: hidden; position: relative; } .jspPane { position: absolute; } .jspVerticalBar { position: absolute; top: 0; right: 0; width: 7px; height: 100%; background: red; } .jspHorizontalBar { position: absolute; bottom: 0; left: 0; width: 100%; height: 16px; background: red; } .jspVerticalBar *, .jspHorizontalBar * { margin: 0; padding: 0; } .jspCap { display: none; } .jspHorizontalBar .jspCap { float: left; } .jspTrack { background: #ccc; position: relative; } .jspDrag { position: relative; top: 0; left: 0; cursor: pointer; } .jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag { float: left; height: 100%; } .jspArrow { background: #50506d; text-indent: -20000px; display: block; cursor: pointer; } .jspArrow.jspDisabled { cursor: default; background: #80808d; } .jspVerticalBar .jspArrow { height: 16px; } .jspHorizontalBar .jspArrow { width: 16px; float: left; height: 100%; } .jspVerticalBar .jspArrow:focus { outline: none; } .jspCorner { background: #eeeef4; float: left; height: 100%; } /* Yuk! CSS Hack for IE6 3 pixel bug :( */ * html .jspCorner { margin: 0 -3px 0 0; } /*** DEMO SKIN ***/ /*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/ .navigation-space {line-height:5px;} .sf-vertical, .sf-vertical li { width: 165px !important; } .sf-menu li li a {margin-left:15px; } .sf-vertical {padding:38px 0 28px 0 !important; position:relative; z-index:3000;} .sf-menu { float: left; } .sf-menu a { padding: 3px 0px 3px 1px; text-decoration:none; font-size:17px; } .sf-menu li li a { padding:7px 0 4px 1px; font-size:16px; } .sf-menu .current a {padding-left:7px; /*opacity:0.7; filter:alpha(opacity=70);*/ } .sf-menu .current .sliding-element a {padding-left:0px; opacity:1; filter:alpha(opacity=100); background:none; } .sf-menu a:hover {/*opacity:0.7;filter:alpha(opacity=70); */} .sf-menu li li a:hover, .sf-menu .current .sliding-element a:hover {background-position: 0px 9px !important;} .sf-menu li li:hover, .sf-menu li li.sfHover, .sf-menu li li a:focus, .sf-menu li li a:hover, .sf-menu li li a:active { outline: 0; } /*** ESSENTIAL STYLES ***/ .sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; } .sf-menu { line-height: 1.0; } .sf-menu ul { position: absolute; top: -999em; width: 165px; /* left offset of submenus need to match (see below) */ } .sf-menu ul li { width: 100%; } .sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ } .sf-menu li { float: left; position: relative; font-weight: bold; } .sf-menu a { display: block; position: relative; } .sf-menu li:hover ul, .sf-menu li.sfHover ul { left: 0; top: 2.5em; /* match top ul list item height */ z-index: 99; } ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top: -999em; } ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left: 165px; /* match ul width */ top: 0; } ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; } ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 165px; /* match ul width */ top: 0; } /*** arrows **/ .sf-menu a.sf-with-ul { padding-right: 2.25em; min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */ } .sf-sub-indicator { position: absolute; display: block; right: 1.45em; top: 1.75em; /* IE6 only */ width: 10px; height: 10px; text-indent: -999em; overflow: hidden; background: url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */ } a > .sf-sub-indicator { /* give all except IE6 the correct values */ top: 4px; background-position: 0 -100px; /* use translucent arrow for modern browsers*/ } /* apply hovers to modern browsers */ a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator { background-position: -10px -100px; /* arrow hovers for modern browsers*/ } /* point right for anchors in subs */ .sf-menu ul .sf-sub-indicator { background-position: -10px 0; } .sf-menu ul a > .sf-sub-indicator { background-position: 0 0; } /* apply hovers to modern browsers */ .sf-menu ul a:focus > .sf-sub-indicator, .sf-menu ul a:hover > .sf-sub-indicator, .sf-menu ul a:active > .sf-sub-indicator, .sf-menu ul li:hover > a > .sf-sub-indicator, .sf-menu ul li.sfHover > a > .sf-sub-indicator { background-position: -10px 0; /* arrow hovers for modern browsers*/ } /*** shadows for all but IE6 ***/ .sf-shadow ul { background: url('../images/shadow.png') no-repeat bottom right; padding: 0 8px 9px 0; -moz-border-radius-bottomleft: 17px; -moz-border-radius-topright: 17px; -webkit-border-top-right-radius: 17px; -webkit-border-bottom-left-radius: 17px; } .sf-shadow ul.sf-shadow-off { background: transparent; } /* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */ .sf-vertical li:hover ul, .sf-vertical li.sfHover ul { left: 165px; /* match ul width */ top: 0; } /*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/ .sf-vertical, .sf-vertical li { } /* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */ .sf-vertical li:hover ul, .sf-vertical li.sfHover ul { left: 165px; /* match ul width */ top: 0; } /*** alter arrow directions ***/ .sf-vertical .sf-sub-indicator { background-position: -10px 0; } /* IE6 gets solid image only */ .sf-vertical a > .sf-sub-indicator { background-position: 0 0; } /* use translucent arrow for modern browsers*/ /* hover arrow direction for modern browsers*/ .sf-vertical a:focus > .sf-sub-indicator, .sf-vertical a:hover > .sf-sub-indicator, .sf-vertical a:active > .sf-sub-indicator, .sf-vertical li:hover > a > .sf-sub-indicator, .sf-vertical li.sfHover > a > .sf-sub-indicator { background-position: -10px 0; /* arrow hovers for modern browsers*/ } /* Generated by Font Squirrel (http://www.fontsquirrel.com) on May 27, 2011 05:06:46 PM America/New_York */ /*@font-face { font-family: 'BebasNeueRegular'; src: url('../bebas-neue/BebasNeue-webfont.eot'); src: url('../bebas-neue/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('../bebas-neue/BebasNeue-webfont.woff') format('woff'), url('../bebas-neue/BebasNeue-webfont.ttf') format('truetype'), url('../bebas-neue/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; }*/ /* CSS for jQuery Orbit Plugin 1.2.3 * www.ZURB.com/playground * Copyright 2010, ZURB * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php /* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY ================================================== */ #featured { width: 980px; background: #000 url('../images/orbit/loading.gif') no-repeat center center; overflow: hidden; } #featured div {width:980px; display:block;} #featured>img, #featured>div, #featured>a { display: none; } /* CONTAINER ================================================== */ div.orbit-wrapper { width: 1px; height: 1px; position: relative; } div.orbit { width: 1px; height: 1px; position: relative; overflow: hidden } div.orbit>img { position: absolute; top: 0; left: 0; display: none; } div.orbit>a { border: none; position: absolute; top: 0; left: 0; line-height: 0; display: none; } .orbit>div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */ /* TIMER ================================================== */ div.timer { width: 20px; height: 20px; overflow: hidden; position: absolute; bottom: 22px; right: 25px; opacity: .8; cursor: pointer; z-index: 1001; } span.rotator { display: block; width: 20px; height: 20px; position: absolute; top: 0; left: -10px; background: url(../images/orbit/rotator-black2.png) no-repeat; z-index: 3; } span.mask { display: block; width: 10px; height: 20px; position: absolute; top: 0; right: 0; z-index: 2; overflow: hidden; } span.rotator.move { left: 0 } span.mask.move { width: 20px; left: 0; background: url(../images/orbit/timer-black2.png) repeat 0 0; } span.pause { display: block; width: 20px; height: 20px; position: absolute; top: 0; left: 0; background: url(../images/orbit/pause-black2.png) no-repeat; z-index: 4; opacity: 0; } span.pause.active { background: url(../images/orbit/pause-black2.png) no-repeat 0 -20px } div.timer:hover span.pause, span.pause.active { opacity: 1 } /* CAPTIONS ================================================== */ .orbit-caption { display: none; font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; } .orbit-wrapper .orbit-caption { background: #000; background: rgba(0,0,0,.6); z-index: 1000; color: #fff; text-align: center; padding: 7px 0; font-size: 13px; position: absolute; right: 0; bottom: 0; width: 100%; } /* DIRECTIONAL NAV ================================================== */ div.slider-nav { display: block } div.slider-nav span { width: 78px; height: 100px; text-indent: -9999px; position: absolute; z-index: 1000; top: 50%; margin-top: -50px; cursor: pointer; } div.slider-nav span.right { background: url(../images/orbit/right-arrow.png); right: 0; } div.slider-nav span.left { background: url(../images/orbit/left-arrow.png); left: 0; } /* BULLET NAV ================================================== */ .orbit-bullets { position: absolute; z-index: 1000; list-style: none; bottom: -3px; left: 50%; margin-left: -38px; padding: 0; } .orbit-bullets li { float: left; margin-left: 5px; cursor: pointer; color: #999; text-indent: -9999px; background: url(../images/orbit/bullets2.png) no-repeat top left; width: 10px; height: 10px; overflow: hidden; } .orbit-bullets li.active { color: #222; background-position: top right; } .orbit-bullets li.has-thumb { background: none; width: 100px; height: 75px; } .orbit-bullets li.active.has-thumb { background-position: 0 0; border-top: 2px solid #000; }