/* Theme Name: Youth Cycle Sport Theme URI: http://www.youthcyclesport.co.uk Description: Custom template designed for Youth Cycle Sport Version: 1.0 Author: Dan Luton Author URI: http://www.greenjersey.com */ /* 0.RESET ---------------------------------------------------------------------- */ *, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 } table { border-collapse:collapse; border-spacing:0 } fieldset, img { border:0 } address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal } ol, ul, li { list-style:none } caption, th { text-align:left } h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal } q:before, q:after { content:'';} /* 1.BODY and PAGE ---------------------------------------------------------------------- */ html {overflow-y:scroll} body {font:13px/140% 'Open Sans', sans-serif;color:#444;background:#000 url('images/main_bg.jpg') 50% 0 no-repeat fixed;font-style:italic;} /* 2.DEFAULT STYLING ---------------------------------------------------------------------- */ strong { font-weight:bold } em { font-style:italic } a img { border:none } p {margin:0 0 15px 0} img[class*="align"],img[class*="wp-image-"] {height: auto;} img.size-full {max-width:100%;width:auto;} .alert { background:red; color:white } .aligncenter { display:block; margin:0 auto } .alignleft { float:left } .alignright { float:right } img.alignleft { float:left;margin:0 15px 10px 0} img.alignright { float:right;margin:0 0 10px 15px } .wp-caption { border:1px solid #666; text-align:center; background:#ccc; padding:10px; margin:10px } .assistive-text {display:none;} .wp-post-image {margin:0 0 10px 0} blockquote {font-weight:bold;padding:0 0 0 45px;background:url('images/quote-open.png') 0 0 no-repeat;} blockquote p {padding:0 45px 0 0;background:url('images/quote-close.png') 100% 100% no-repeat;} .screen-reader-response {display:none;} .videoWrapper {position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden;} .videoWrapper iframe, .videoWrapper object, .videoWrapper embed {position:absolute;top:0;left:0;width:100%;height:100%} .button {background:#000066;color:#fff;font-weight:bold;padding:5px 18px;border-radius:4px;display:inline-block;border:0;cursor:pointer;font:13px/normal 'Open Sans', sans-serif;transition:background-color ease-in-out 0.2s} .button:hover {background:#c00;} .search-results ol {margin-left:20px} .search-results ol li {margin-bottom:20px} /* Article Elements */ article ul {margin:0 0 15px 0} article ol {margin:0 0 15px 30px;} article ul li {padding-left:32px;background:url('images/list-item.png') 12px 5px no-repeat;} article ol li {padding-left:0;list-style:decimal} table {border-spacing:0;border-collapse:collapse;color:#969696;width:100%;margin:0 0 15px 0} table td {border:2px solid #969696;padding:8px 12px} table tr:nth-child(odd) td {background:#e0e0e0} table tr:nth-child(even) td {background:#ececec} .wp-caption {width:auto;margin:0 0 15px 0;padding:0;border:0;background:#e0e0e0;color:#969696;padding:0 0 10px 0;} .wp-caption.alignright {margin:0 0 10px 15px;text-align:center} .wp-caption.alignleft {margin:0 15px 10px 0;text-align:center} article .wp-caption img {padding:5px} .wp-caption p {margin:0;padding:0 10px;text-align:center;white-space: normal} .wp-caption img {max-width:auto} article img {padding:5px;background:#e0e0e0;max-width:98%} /*article iframe {width:100%!important;height:340px!important;background:#aaa!important}*/ article .wk-slideset {margin:0 0 15px 0} article .wk-slideset ul, article .wk-slideshow ul {margin:0;} article .wk-slideset ul li, article .wk-slideshow ul li {margin:0;padding:0;background:none} article .wk-slideset img, article .wk-slideshow img {max-width:100%;width:100%;padding:0} article .wk-slideset img {width:100%!important} /* Ratings */ .article-rating span {float:left;display:block;line-height:30px;margin-right:10px;font-weight:bold;} .article-rating i {background:url('images/article_rating.png') -150px 0 no-repeat;width:30px;height:38px;overflow:hidden;display:inline-block;text-indent:-2000px;} .score-1 i.point-1, .score-2 i.point-1, .score-3 i.point-1, .score-4 i.point-1, .score-5 i.point-1 {background-position:0 0} .score-2 i.point-2, .score-3 i.point-2, .score-4 i.point-2, .score-5 i.point-2 {background-position:-30px 0} .score-3 i.point-3, .score-4 i.point-3, .score-5 i.point-3 {background-position:-60px 0} .score-4 i.point-4, .score-5 i.point-4 {background-position:-90px 0} .score-5 i.point-5 {background-position:-120px 0} /* Twitter */ .latest-tweet ul {padding:0 0 0 55px;margin:0} .latest-tweet-wrap {position:relative;background:none;height:32px;padding-top:6px;} .latest-tweet {color:#fff;background:#969696;height:30px;line-height:28px;overflow:hidden;margin:0;width:100%;white-space:nowrap} .latest-tweet a {color:#fff;text-decoration:underline} .follow-link {width:48px;height:38px;background:url('images/latest_tweet_bg.png') 0 0 no-repeat;display:block;position:absolute;top:0} .follow-link span {display:none;} .tweet-fade {position:absolute;width:60px;height:28px;right:0;top:6px;background:url('images/tweet-fade.png') 0 0 repeat-y} /* .latest-tweet ul {color:#fff;font:1em/30px 'Open Sans', sans-serif;padding:0 0 0 55px;margin:0} .latest-tweet a {color:#fff;text-decoration:underline} ul.tweet_list,ul.tweet_list li {list-style:none;margin:0;} ul.tweet_list li {display:block;line-height:normal;margin:0;float:left;} .twitter-feed a {color:#45B0E3} */ .tweet_loading {color:#fff;font:1em/30px 'Open Sans', sans-serif;padding:0 0 0 55px;margin:0} ul.tweet_list{ height: 38px; overflow: hidden; } ul.tweet_list li { height: 38px;margin:0 0 20px 0; } /* 3.HEADINGS ---------------------------------------------------------------------- */ h1, h2, h3, h4, h5, h6 { font-weight:normal;margin:0 0 2.5% 0;line-height:normal;text-transform:none} h1 {font-size:1.85em;line-height:125%;font-weight:bold;} h2 {font-size:1.6em;background:#006 url('images/header_styles.png') 100% 0 no-repeat;padding:0 0 0 10px;color:#fff;text-transform:uppercase;display:block;height:50px;line-height:50px;font-weight:800;} .style-1 {background-position:100% 0} article .style-1,article h2 {background-position:100% -300px} .style-2 {background-position:100% -50px} article .style-2 {background-position:100% -350px} .style-3 {background-position:100% -100px} article .style-3 {background-position:100% -400px} .style-4 {background-position:100% -150px} article .style-4 {background-position:100% -450px} .style-5 {background-position:100% -200px} article .style-5 {background-position:100% -500px} .style-6 {background-position:100% -250px} article .style-6 {background-position:100% -550px} h2 a {color:#fff;} h2 a:hover {color:#CC0000} h3 {font-size:1.4em;text-transform:uppercase;font-weight:bold;margin:0 0 5px 0;} h4 {font-size:1.1em;text-transform:uppercase;margin:0;font-weight:bold;} h5 {font-size:1.0em;margin:0;font-weight:bold;} /* 4.LINKS ---------------------------------------------------------------------- */ a {color:#fff;text-decoration:none;} article a {border-bottom:1px dotted #fff} a:hover {color:#555;border-color:#555} article img a,article a.popup {border:0} a.ad-block {font-size:0;line-height:0;margin:0 0 5% 0;display:block;height:100%;padding:0} a.ad-block img {max-width:100%;} /* 5.LAYOUT ---------------------------------------------------------------------- */ .clear { clear:both; display:block; height:1px; margin:-1px 0 0 0 } #wrapper {width:auto;max-width:940px;margin:0 auto;background:#e0e0e0;padding:10px 20px 20px 20px;box-shadow:0 0 20px #000;position:relative;z-index:10} .padding {padding:20px;} .background_ad {position:fixed;text-align:right;width:100%;height:100%;overflow:hidden;z-index:0;} .background_ad img {width:100%} /* Header region */ header {height:155px;position:relative;} #logo a {display:block;width:209px;height:134px;background:url('images/logo.png') 0 0 no-repeat;position:absolute;top:10px;left:-10px;transition:opacity ease-in-out 0.2s;overflow:hidden} #logo a span {display:none;visibility:hidden} #logo a:hover {opacity:0.8} .search-popup {background:#CC0000;position:absolute;right:0;top:20px;width:260px;color:#fff;display:none;z-index:10000;border:5px solid #E0E0E0;border-top:0;border-right:0} .search-popup form {padding:15px;} .search-popup a {color:#fff;} .search-popup li {padding:0;margin:0;height:auto;} .search-popup ul {padding-bottom:15px;} .search-popup ul li a {color:#fff;text-transform:uppercase;font-weight:800;font-size:1em;height:auto;line-height:120%;margin-top:auto;display:block;background:url('images/sub-menu-arrow.png') 15px 5px no-repeat;padding:3px 15px 3px 33px;} .search-popup ul li a:hover {background-color:#c00} .popular-searches {background:#000066;border-top:1px solid #e0e0e0} .popular-searches h4 {padding:15px 15px 5px 15px;font-size:1.3em} .search-popup .inputbox {font:13px/normal 'Open Sans', sans-serif;border:0;padding:0 5px;font-size:1.1em;float:left;height:30px;line-height:30px;width:180px;color:#c00} .search-popup .button {background:url('images/slide_prev-next.png') -40px 50% no-repeat;width:30px;height:30px;border:0;font-size:0;line-height:0;text-indent:-2000px;overflow:hidden;cursor:pointer} .hero {width:100%;height:100%;position:relative;display:block;overflow:hidden;top:-6px} .hero img {max-width:100%;width:100%;min-width:500px} .intro {background:#195C93;color:#fff;padding:5%} .intro h3 {font-size:2em;margin:0 0 2.5% 0} .intro p {margin:0} .loading-slide {line-height:0;font-size:0;width:100%} .slider-loader {background:url('images/slider-loader.gif') 0 0 no-repeat;width:52px;height:46px;position:absolute;top:50%;left:50%;margin:-23px 0 0 -26px;display:block;} article {background:#969696;color:#fff;padding:10px;margin:0 0 10px 0;font-size:1.05em} /* Posts */ .post-meta {background:#e0e0e0;padding:5px;color:#969696;font-weight:bold;margin:0 0 10px 0;} .post-meta a {color:#969696;border-bottom:1px dotted #969696} .post-meta a:hover {color:#555;border-color:#969696} .post-meta span {float:left;} #share {float:right!important;font-style:normal} #share a {width:auto;overflow:hidden;padding:0;margin:0} article #share iframe {width:auto!important;height:30px!important;background:none!important} /* Adverts */ header a.ad-block {max-width:728px;max-height:90px;width:auto;height:auto;overflow:hidden;position:absolute;right:0;bottom:7px;margin:0;line-height:0;font-size:0;padding:2px 2px 13px 2px;background:#969696 url('images/header_ad_bg.png') 100% 100% no-repeat} header a.ad-block img {max-width:100%} /* 5.5 GRID & COLUMNS ---------------------------------------------------------------------- */ .column {float:left;margin-bottom:3%;margin-right:3%;color:#fff} .column .column {margin-bottom:3%} .col25 {width:22.75%;min-height:250px} .col25:nth-child(4n-2) {clear:both} .col50 {width:48.5%} .col75 {width:74.5%} .col100 {width:100%;margin-right:0} .col33 {width:31.333333%} .col66 {width:65.666667%} .last {margin-right:0;} figure {line-height:0;font-size:0;position:relative;font-size:0.9em;background:#969696} .figure-overlay {position:absolute;top:0;left:0;opacity:0;-moz-transition:opacity 0.08s ease-in-out;-webkit-transition:opacity 0.08s ease-in-out;transition:opacity 0.08s ease-in-out;overflow:hidden} figure:hover .figure-overlay {opacity:1} figure figcaption {padding:4%;color:#fff;line-height:130%;} figure figcaption span {margin:2% 0;display:block;padding:0;text-indent:0} figure figcaption h4 {color:#000066;font-weight:800;text-transform:none;line-height:125%} figure:hover figcaption h4 {color:#c00!important} figure figcaption p {margin:0;font-size:1.1em} figure.thumb-size-thumbnail {} /* Sidebar Figures */ aside figure {margin-bottom:3%} aside figure:last-child {margin-bottom:0} aside figure img {max-width:100%;width:100%;max-width:96.6%;width:96.6%;margin:1.7% 1.7% 0 1.7%} aside figure h4 {font-weight:normal;color:#fff;font-size:1.5em} /* Add margin around images */ /* .column img, .col50 .col100 img {max-width:96.6%;width:96.6%;margin:1.7% 1.7% 0 1.7%} .col25 img {max-width:92.8%;width:93%;margin:3.6% 3.6% 0 3.6%} .col100 img {max-width:98.3%;width:98.3%;margin:0.85% 0.85% 0 0.85%} .column img, .col50 .col100 img.figure-overlay {margin:0;} .col25 img {margin:0;} .col100 img.figure-overlay {margin:0;} */ .figure-img-wrap {position:relative;} .figure-img-wrap img {width:100%} .column .figure-img-wrap, .col50 .col100 .figure-img-wrap {max-width:96.6%;width:96.6%;margin:1.7% 1.7% 0 1.7%} .col25 .figure-img-wrap {max-width:92.8%;width:93%;margin:3.6% 3.6% 0 3.6%} .col100 .figure-img-wrap {max-width:98.3%;width:98.3%;margin:0.85% 0.85% 0 0.85%} .col33 figcaption h4 {font-size:1.8em} .col100 figcaption h4,.col25 figcaption h4,.col50 .col100 figcaption h4,.col50 figcaption h4 {font-size:1.4em} .col25 figcaption h4 {font-weight:normal;color:#fff;font-size:1.3em;padding:0 5px 0 5px;line-height:130%} /* Main & Aside split */ /* Main area: 75.49083% */ /* Sidebar: 24.59016% */ section {width:66.11111%;float:left;padding:1% 2% 0 0;} aside {width:31.88889%;float:left;padding:0;margin:1% 0 0 0;} aside img {} .sidebar-block {margin-bottom:8%} .tweet {font-size:0.9em;line-height:120%} .tweet i {font-style:normal;font-size:0.9em;display:block;} .tweet span {} .subnavigation ul {margin-bottom:20px;} .subnavigation ul ul {margin-left:20px;margin-bottom:20px;display:none;} .subnavigation ul .current-menu-ancestor ul, .subnavigation ul .current-menu-item ul {display:block;} /* Intro Panel & Highlight */ .intro-panel,.highlight {font-weight:bold;font-size:1.1em;line-height:140%;background:#e0e0e0;color:#969696;padding:10px;margin:0 0 15px 0} .intro-panel p:last-child,.highlight p:last-child {margin:0} .intro-panel a,.highlight a,table a {color:#969696;border-color:#969696} .intro-panel a:hover,.highlight a:hover,table a:hover {color:#555;border-color:#555} /* Gallery */ ul.gallery-thumbnails {margin:0;padding:0;background:none;overflow:hidden;margin-bottom:3%} ul.gallery-thumbnails li {background:none;background:red;width:23.5%;float:left;padding:0;line-height:0;font-size:0;margin-right:2%;margin-bottom:2%} ul.gallery-thumbnails li img {max-width:92.8%;width:93%;padding:3.6%;} ul.gallery-thumbnails li.col-count-4 {margin-right:0} /* Prev & Next posts navigation */ .post-navigation {background:#000066 url('images/post-navigation-bg.png') 50% 0 repeat-y;float:left;width:100%;min-height:150px;} .next-post,.prev-post {display: table;overflow: hidden;height: 150px;width:50%;position:relative} .next-post a,.prev-post a{color:#fff;font-weight:bold;text-transform:none;font-size:1.1em;display: table-cell;vertical-align: middle;width: 92%;margin: 0 auto;text-align: center;padding:2% 4%;} .next-post {float:left;} .prev-post {float:right;} .next-post em,.prev-post em {background:url('images/slide_prev-next.png') 0 50% no-repeat;width:40px;height:49px;display:block;position:absolute;left:0;top:50%;margin-top:-25px} .prev-post em {left:100%;background-position:-40px 0;margin-left:-40px} .next-post span {padding:0 40px;display:block} .prev-post span {padding:0 40px;display:block} .next-post a:hover {background:url('images/next-post-hover.png') 100% 0 repeat-y;} .prev-post a:hover {background:url('images/prev-post-hover.png') 0 0 repeat-y;} /* Comments Template */ #respond {background:#969696;color:#fff;padding:10px;margin:20px 0 20px 0} #respond a {border-bottom:1px dotted #fff} .avatar-column {width:8%;margin-right:2%;float:left;} .avatar-column img {max-width:100%} .comment-column {float:right;margin-left:0;width:90%} #respond ol {border-bottom:1px dotted #fff;padding:0 0 10px 0;margin:0 0 20px 0} #respond li {border-top:1px dotted #fff;padding:10px 0 0 0;margin:10px 0 0 0} #respond li p:last-child {margin-bottom:0} #respond h3,#respond h4 {text-transform:none} #respond h3 {font-size:1.1em;font-weight:normal} #respond h3 em {font-size:1.4em;font-weight:bold;} #respond h4 {font-size:1.2em;margin:0 0 15px 0} #respond h5 {font-weight:normal} .commentMeta .author-name {float:left;} .commentMeta .comment-date {float:right;} .commentMeta {margin:0 0 15px 0;float:left;width:100%} .comment-body {clear:both} #respond #postcomment {text-transform:uppercase;color:#E0E0E0;font-weight:bold;margin:0 0 20px 0} #commentform label {font-size:1.1em;padding:1.5% 0 0 0;color:#E0E0E0;font-weight:bold;float:left;width:17%;margin-right:2%} #respond .inputbox,#commentbox {font:13px/140% 'Open Sans', sans-serif;padding:1%;background:#e0e0e0;border:2px solid #fff;} #respond .inputbox {width:60%} #commentbox {width:78%;margin:0 0 10px 0} #respond #submit {background:#CC0000 url('images/sub-menu-arrow.png') 10px 50% no-repeat;border:0;color:#fff;font-size:1.1em;font-weight:bold;padding:2px 10px;font-family: 'Open Sans', sans-serif;text-transform:uppercase;padding-left:22px;margin-left:19%} /* Crumbs */ .breadcrumbs {text-transform:uppercase;height:18px;line-height:18px;display:block;padding:2px 0} .breadcrumbs .home {width:17px;height:18px;display:block;float:left;background:url('images/breadcrumb-home.png') 0 0 no-repeat} .breadcrumbs .home:hover {background-position:-17px 0} .breadcrumbs .home span {display:none;} .breadcrumbs .link {background:url('images/blue-arrow.png') 0 50% no-repeat;padding-left:17px;margin-left:10px;color:#000066} .breadcrumbs .link:hover {color:#CC0000;} .breadcrumbs span {background:url('images/blue-arrow.png') 0 50% no-repeat;padding-left:17px;margin-left:10px;color:#CC0000;} .breadcrumbs a {color:#000066} .breadcrumbs a:hover {color:#CC0000} /* 6.NAVIGATION ---------------------------------------------------------------------- */ /* Main Navigation */ .responsive-menu {position:absolute;top:0;right:0;width:40px;height:40px;background:#000;display:none;} nav.main-menu a {z-index:200;position:relative} nav.main-menu {display:block;line-height:normal;width:99.5%;background:#c00;padding:0 0 0 0.5%;height:60px;line-height:68px;z-index:200000} nav.main-menu li {float:left;margin:0;padding:0;} nav.main-menu a {float:left;margin:0;padding:0 8px;text-transform:uppercase;color:#fff;font-size:1.7em;font-weight:800;height:70px;margin-top:-5px} nav.main-menu li.current_page_item a, nav.main-menu li.current-menu-item a, nav.main-menu li.current-post-ancestor a, nav.main-menu li.current-menu-parent a, nav.main-menu li.current-post-parent a {background:#000066} .top-menu {height:20px;position:absolute;right:0;padding-left:2%;font-weight:800;text-transform:uppercase;line-height:20px} .top-menu nav {} .top-menu nav li {float:left;} .top-menu nav li a {margin-left:3px;line-height:20px;color:#969696;display:block;padding:0 4px} .top-menu nav li a:hover, .top-menu nav li.current_page_item a, .top-menu nav li.current-menu-item a, .top-menu nav li.current-post-ancestor a, .top-menu nav li.current-menu-parent a, .top-menu nav li.current-post-parent a {background-color:#CC0000;color:#fff;} nav li.social-link {margin:0;padding:0} nav li.social-link a {padding:0;width:20px;height:20px;background:url('images/social_icons.png') 0 0 no-repeat;font-size:0;line-height:0;text-indent:-2000px;overflow:hidden;margin:0 0 0 5px;display:block;float:left;} .top-menu nav li.social-link a:hover {background-position:0 -20px;background-color:none;} nav li.facebook a {background-position:-20px 0} .top-menu nav li.facebook a:hover {background-position:-20px -20px} nav li.twitter a {background-position:-40px 0} .top-menu nav li.twitter a:hover {background-position:-40px -20px} nav li.search-button a {background-position:-60px 0;width:69px;} .top-menu nav li.search-button a:hover, .top-menu nav li.search-button a.active {background-position:-60px -20px} .top-menu nav li.youtube {margin-left:10px} footer nav li.social-link {float:right;margin-top:16px} footer nav li.social-link a {opacity:1;transition:opacity ease-in-out .2s;width:25px;height:25px;background:url('images/footer_social_icons.png') 0 0 no-repeat;} footer nav li.facebook a {background-position:-25px 0} footer nav li.twitter a {background-position:-50px 0} footer nav li.email a {background-position:-75px 0} footer nav li.social-link a:hover {opacity:0.6} /* Pagination */ .wp-pagenavi {text-align:center} .wp-pagenavi a,.wp-pagenavi .current {background:url('images/pagination.png') 0 0 no-repeat;width:28px;height:37px;display:block;overflow:hidden;text-indent:-2000px;font-size:0;line-height:0;display:inline-block;margin:0 1px;color:#000066} .wp-pagenavi a:hover {color:#CC0000} .wp-pagenavi .first {width:21px;} .wp-pagenavi .previouspostslink {width:21px;background-position:-21px 0} .wp-pagenavi .page {width:27px;background-position:-42px 0} .wp-pagenavi .nextpostslink {width:21px;background-position:-98px 0} .wp-pagenavi .last {width:21px;background-position:-119px 0} .wp-pagenavi .page,.wp-pagenavi .current {font-size:1em;text-indent:0;line-height:26px;text-align:center;font-weight:bold;} .wp-pagenavi .current {background-position:-70px 0;color:#CC0000} .single-post form.wpcf7-form label {font-size:0.9em} .single-post form.wpcf7-form .inputbox, .single-post form.wpcf7-form textarea {background:#fff} /* 7.SIDEBARS/COLUMNS ---------------------------------------------------------------------- */ /*aside {width:25%;background:#f1f1f1;} #aside.leftcol {float:left;} #aside.rightcol {float:right;}*/ /* 8.FOOTER ---------------------------------------------------------------------- */ footer {margin:0;color:#fff;background:#000 url('images/footer_bg.jpg') 50% 0 no-repeat;height:261px;z-index:2;position:relative} .footer-fade {height:150px;width:100%;background:url('images/footer_fade.png') 0 0 repeat-x;margin-top:-130px;z-index:2;position:relative} .fade-mask {background:#E0E0E0;width:auto;max-width:980px;margin:0 auto;height:130px} footer .padding {padding:0 20px 20px 20px;width:auto;max-width:940px;margin:0 auto;} footer nav a,footer nav span {color:#fff;text-transform:uppercase;float:left;font-weight:bold;margin-right:10px;line-height:60px} footer nav a:hover {color:#969696} .footer-ad-blocks {background:#000} .footer-ad-blocks .padding {width:auto;max-width:940px;margin:0 auto;padding-top:0} .footer-ad-blocks .column {background:#E2DFD8;height:150px;margin-bottom:0} footer .footerlogo, footer .gjlogo {width:197px;height:45px;background:url('images/ycs_logo_footer.png') 0 0 no-repeat;display:block;margin-top:15px;font-size:0;line-height:0;text-indent:-2000px;overflow:hidden;float:left;transition:opacity ease-in-out 0.2s} footer .gjlogo {width:101px;height:31px;float:right;background:url('images/gj_logo_footer.png') 0 0 no-repeat;margin-top:20px;} footer .gjlogo:hover {opacity:0.8} /* 9.FORMS ---------------------------------------------------------------------- */ .wpcf7 .inputbox,.wpcf7 .textbox,.wpcf7-quiz {width:66%;padding:1%;border:1px solid #ddd;background:#f1f1f1;font:1em/normal Helvetica,Arial,Sans-Serif;color:#777;background:#f1f1f1;transition:background-color ease-in-out .2s} .wpcf7-quiz {float:left} .wpcf7 .inputbox:focus,.wpcf7 .textbox:focus {background:#fff} .wpcf7 .col2 .inputbox {width:92%;padding:4%} .wpcf7 p {margin-bottom:35px} .wpcf7 .col {margin-bottom:0} .wpcf7-form-control-wrap {position:relative;} .wpcf7-not-valid-tip {display:none} .wpcf7 input.wpcf7-not-valid,.wpcf7 textarea.wpcf7-not-valid {border:1px solid #e00;background:#FFFAFA} .wpcf7-response-output {position:fixed;top:0;left:0;width:80%;padding:30px 10%;text-align:center;background:#197BA7;z-index:10000;line-height:130%;box-shadow:0 2px 8px rgba(0,0,0,0.5);font-weight:bold;color:#fff;} .wpcf7-validation-errors {background:#b00;} wpcf7-mail-sent-ok {} .wpcf7-display-none {display:none;} .wpcf7 .ajax-loader{margin-left:15px;top:18px;background:none;position:relative;top:8px;} .wpcf7 label {width:27.5%;padding-right:2.5%;float:left;display:block;font-weight:700} .wpcf7 .button {margin-left:30%} .wpcf7 .questions .inputbox {width:96%;margin:0} .wpcf7 .questions strong {margin:0 0 5px 0;padding:0;display:inline-block} /* 10.MEDIA QUERIES ---------------------------------------------------------------------- */ /* Slider */ /* The Nivo Slider styles */ .nivoSlider{position:relative; width:100%; height:auto; overflow:hidden;} .nivoSlider img{position:absolute; top:0px; left:0px; max-width:none} .nivo-main-image{display:block !important; position:relative !important; width:100% !important} /* If an image is wrapped in a link */ .nivoSlider a.nivo-imageLink{position:absolute; top:0px; left:0px; width:100%; height:100%; border:0; padding:0; margin:0; z-index:6; display:none; background:white; filter:alpha(opacity=0); opacity:0} /* The slices and boxes in the Slider */ .nivo-slice{display:block; position:absolute; z-index:5; height:100%; top:0} .nivo-box{display:block; position:absolute; z-index:5; overflow:hidden} .nivo-box img{display:block} /* Caption styles */ .nivo-caption{position:absolute; left:0px; top:50%;margin-top:-25px; color:#fff; width:90%; z-index:8; padding:0 0 0 10%; overflow:hidden; display:none; -webkit-box-sizing:border-box; /* Safari/Chrome,other WebKit */-moz-box-sizing:border-box; /* Firefox,other Gecko */box-sizing:border-box; /* Opera/IE 8+*/} .nivo-caption p{padding:5px; margin:0} .nivo-caption a {color:#fff;transition:color ease-in-out 0.3s} .nivo-caption a.more{display:inline !important} .nivo-html-caption{ display:none} /*.nivo-caption a {opacity:1;transition:opacity ease-in-out .2s} .nivo-caption a:hover {opacity:0.1}*/ /* Direction nav styles (e.g. Next &Prev) */ .nivo-directionNav a{position:absolute; top:50%;margin-top:-25px; z-index:9; cursor:pointer;background:url('images/slide_prev-next.png') 0 0 no-repeat;width:40px;height:50px;display:block;text-indent:-2000px;overflow:hidden;font-size:0;line-height:0;opacity:0.7} .nivo-directionNav a:hover {opacity:1} .nivo-directionNav a.nivo-prevNav{left:0px} .nivo-directionNav a.nivo-nextNav{right:0px;background-position:100% 0} /* Control nav styles (e.g. 1, 2, 3...) */ .nivo-controlNav{text-align:center;position:absolute;bottom:5%;right:10%;z-index:200} .nivo-controlNav a{cursor:pointer;background:url('images/slider_dots.png') 0 0 no-repeat;width:27px;height:27px;display:inline-block;margin-left:3px;text-indent:-2000px;overflow:hidden;font-size:0;line-height:0} .nivo-controlNav a.active{background-position:-27px 0;} .nivo-caption p.line1, .nivo-caption p.line2{font-size:2.2em;font-weight:bold;display:inline-block;background:url('images/caption_title_bg.png') 100% 0 no-repeat;text-transform:uppercase;line-height:100%;padding-right:50px;padding-left:10px} .nivo-caption p.line2 {background-position:100% -49px;padding-right:100px} .nivo-caption span.line1, .nivo-caption span.line2 {font-size:1.2em;background:url('images/caption_text_bg.png') 100% 0 no-repeat;padding:5px 60px 5px 10px;height:30px;line-height:25px} .nivo-caption i {display:block;font-style:normal;margin-top:11px;margin-bottom:12px} .nivo-caption i a {color:#fff} .nivo-caption span.line2 {background-position:100% -35px;padding-top:0} .nivo-caption a.more {background:url('images/slide_more_button.png') 100% 0 no-repeat;height:26px;line-height:26px;display:inline-block;color:#fff;text-transform:uppercase;font-size:1.2em;font-weight:bold;padding:2px 30px 2px 10px;} /* Superfish */ /*** ESSENTIAL STYLES ***/ .sf-menu li{position:relative} .sf-menu ul{position:absolute; display:none; top:100%; left:0; z-index:99;margin-top:-5px;margin-left:-4px} .sf-menu >li{float:left} .sf-menu a{display:block; position:relative} .sf-menu ul ul{top:-5px; left:100%} /*** DEMO SKIN ***/ .sf-menu{float:left;} .sf-menu ul{width:340px;background:#000066;} .sf-menu a{text-decoration:none; zoom:1; /* IE7 */color:yellow} .sf-menu ul ul li{display:block;float:none;width:100%} .sf-menu li:hover a, .sf-menu li.sfHover a{background:#000066;} nav.main-menu .sf-menu ul {padding:6px 0} nav.main-menu .sf-menu ul li {padding:0;margin:0;height:auto;width:100%} nav.main-menu .sf-menu ul.sub-menu a {font-size:1.3em;line-height:19px;margin-top:auto;padding:0;display:block;width:100%;height:auto;background:url('images/sub-menu-arrow.png') 10px 10px no-repeat;width:300px;padding:5px 10px 5px 30px} nav.main-menu .sf-menu ul.sub-menu a:hover {background-color:#c00} nav.main-menu .sf-menu ul ul {display:none!important;} h3.splash-title {color:#fff;background:#CC0000 url('images/header_styles.png') 100% 0 no-repeat;;font-size:1.6em;padding:0 0 0 10px;text-transform:uppercase;display:block;height:50px;line-height:50px;font-weight:800;margin:0 0 10px 0} h3.splash-title.style-1 {background-position:100% -600px} h3.splash-title.style-2 {background-position:100% -650px} h3.splash-title.style-3 {background-position:100% -700px} h3.splash-title.style-4 {background-position:100% -750px} .subnavigation ul {background:#000066} .subnavigation ul ul {background:#000044;margin:0;padding:5px 0} .subnavigation li {padding:6px 0;margin:0;height:auto;} .subnavigation a {color:#fff;text-transform:uppercase;font-weight:800;font-size:1.3em;height:auto;line-height:120%;margin-top:auto;display:block;background:url('images/sub-menu-arrow.png') 10px 5px no-repeat;padding:0 0 2px 28px} .subnavigation ul ul li {padding:2px 0} .subnavigation ul ul a {font-size:1.1em;background-image:none;} .subnavigation a:hover, .subnavigation .current-menu-item>a, .subnavigation .current-menu-parent>a {background-color:#CC0000} /* 10.FANCYBOX ---------------------------------------------------------------------- */ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp{padding:0; margin:0; border:0; outline:none; vertical-align:top} .fancybox-wrap{position:absolute; top:0; left:0; z-index:8020;overflow:hidden} .fancybox-skin{position:relative; background:#E0E0E0; color:#444; text-shadow:none;} .fancybox-opened{z-index:8030} .fancybox-opened .fancybox-skin{-webkit-box-shadow:0 10px 25px rgba(0,0,0,0.5); -moz-box-shadow:0 10px 25px rgba(0,0,0,0.5); box-shadow:0 10px 25px rgba(0,0,0,0.5)} .fancybox-outer, .fancybox-inner{position:relative} .fancybox-inner{overflow:hidden} .fancybox-type-iframe .fancybox-inner{-webkit-overflow-scrolling:touch} .fancybox-error{color:#444;margin:0; padding:15px; white-space:nowrap} .fancybox-image, .fancybox-iframe{display:block; width:100%; height:100%;} .fancybox-image{max-width:100%; max-height:100%} #fancybox-loading, .fancybox-close{background-image:url('images/fancybox_sprite.png')} #fancybox-loading{position:fixed; top:50%; left:50%; margin-top:-22px; margin-left:-22px; background-position:0 -108px; opacity:0.8; cursor:pointer; z-index:8060} #fancybox-loading div{width:44px; height:44px; background:url('images/ycs_loading.gif') center center no-repeat} .fancybox-close{position:absolute; top:-14px; right:-14px; width:28px; height:29px; cursor:pointer; z-index:8040;background:url('images/ycs_close.png') 0 0 no-repeat;} .fancybox-nav{position:absolute; top:0; width:40%; height:100%; cursor:pointer; text-decoration:none; background:transparent url('images/blank.gif'); -webkit-tap-highlight-color:rgba(0,0,0,0); z-index:8040} .fancybox-prev{left:0} .fancybox-next{right:0} .fancybox-nav span{position:absolute; top:50%; width:40px; height:50px; margin-top:-25px; cursor:pointer; z-index:8040; visibility:hidden;background:url('images/slide_prev-next.png') 0 0 no-repeat;} .fancybox-prev span{left:0; background-position:0 0} .fancybox-next span{right:0; background-position:100% 0} .fancybox-nav:hover span{visibility:visible} .fancybox-tmp{position:absolute; top:-99999px; left:-99999px; visibility:hidden; max-width:99999px; max-height:99999px; overflow:visible !important} .fancybox-lock{ overflow:hidden !important; width:auto} .fancybox-lock body{ overflow:hidden !important} .fancybox-lock-test{ overflow-y:hidden !important} .fancybox-overlay{position:absolute; top:0; left:0; overflow:hidden; display:none; z-index:8010; background:url('images/fancybox_overlay.png');width:99%;height:99%} .fancybox-overlay-fixed{position:fixed; bottom:0; right:0} .fancybox-lock {overflow: hidden; margin: 0 !important;} .fancybox-lock .fancybox-overlay{overflow:auto; overflow-y:scroll} .fancybox-title{visibility:hidden;position:relative; text-shadow:none; z-index:8050} .fancybox-opened .fancybox-title{visibility:visible} .fancybox-title-float-wrap{position:absolute; bottom:0; right:50%; margin-bottom:-55px; z-index:8050; text-align:center} .fancybox-title-float-wrap .child{display:inline-block; margin-right:-100%; padding:10px 15px; background:transparent; background:#195C93;color:#FFF; font-family:"bree-serif",Georgia,Serif; line-height:24px; white-space:nowrap;} .fancybox-title-outside-wrap{position:relative; margin-top:10px; color:#fff} .fancybox-title-inside-wrap{padding-top:10px} .fancybox-title-over-wrap{position:absolute; bottom:0; left:0; color:#fff; padding:10px; background:#000; background:rgba(0,0,0,.8)} @media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min--moz-device-pixel-ratio:1.5), only screen and (min-device-pixel-ratio:1.5){#fancybox-loading,.fancybox-close,.fancybox-prev span,.fancybox-next span{background-image:url('images/fancybox_sprite@2x.png'); background-size:44px 152px} #fancybox-loading div{background-image:url('images/fancybox_loading@2x.gif'); background-size:24px 24px} } /* 11.MEDIA QUERIES ---------------------------------------------------------------------- */ @media screen and (max-width:980px){ header a.ad-block {width:640px;} } @media screen and (max-width:965px){ nav.main-menu a {font-size:1.5em} h3.splash-title {font-size:1.25em;white-space:nowrap} } @media screen and (max-width:890px){ nav.main-menu a {font-size:1.3em} .col25 figcaption h4 {font-size:1.1em} .nivo-caption {top:35%} header a.ad-block {width:540px;} .col25 {min-height:230px} } @media screen and (max-width:800px){ nav.main-menu {height:auto;float:left;padding:0;margin:0 0 4px 0;} .home nav.main-menu {margin:0 0 20px 0;} nav.main-menu ul {width:100%;padding:0;} nav.main-menu li,nav.main-menu a {float:none;line-height:100%;padding:0;height:auto;margin:0;display:block;} nav.main-menu li {border-top:none;border-top:1px solid #E0E0E0} nav.main-menu a {font-size:1.1em;height:45px;line-height:45px;border-bottom:none;padding:0px 2%} nav.main-menu ul ul {position:relative;float:none;top:auto;left:auto} .sf-menu ul {width:auto;margin-left:0} nav.main-menu .sf-menu ul.sub-menu a {width:auto;font-size:1em;height:30px;line-height:30px;background-position:10px 50%} header {height:auto;min-height:auto;} #logo a{position:relative;margin:15px 0} header a.ad-block {width:auto;position:inherit;top:auto;bottom:0;height:auto;margin:0 0 5px 0;clear:both} .top-menu {top:-15px} } @media screen and (max-width:700px){ .col25 {width:48.5%;} .col25:nth-child(even) {clear:both} .col25:nth-child(odd) {margin-right:0} .style-1,.style-2,.style-3,.style-4,.style-5,.style-6 {background-image:none;} h2 {font-size:1.2em;} .nivo-caption {top:50%;left:40px;} .nivo-caption span.line1,.nivo-caption span.line2 {display:none;} .nivo-caption i {height:0;line-height:0;margin:0 0 5px 0} footer nav span {display:none} footer nav li.social-link {float:none;} footer nav li.email {clear:left;} footer nav a {line-height:normal;margin-bottom:10px} } @media screen and (max-width:630px){ aside {float:none;clear:both;width:100%;padding:20px 0 0 0} a.ad-block {text-align:center;background:#969696} section {width:100%;float:none;} .nivo-directionNav {display:none;} .nivo-caption p.line1,.nivo-caption p.line2 {font-size:1.4em;} .nivo-caption a {font-size:1em} } @media screen and (max-width:500px){ .top-menu {position:relative;} #logo a{position:relative;left:50%;margin-left:-105px;margin-top:0;top:0;} } @media screen and (max-width:420px){ .col50 {width:100%} footer {text-align:center} footer .gjlogo,footer .footerlogo {float:none;clear:left;display:block;margin:10px auto} footer .footerlogo {margin-top:20px} }