Theme Name: Big Screen Symposium 2013 Author: Joe Left, Elizabeth Campbell -------------------------------------------------------------- */ /* * Skeleton V1.2 * Copyright 2011, Dave Gamache * www.getskeleton.com * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php * 6/20/2012 */ /* Table of Content ================================================== #Site Styles #Page Styles #Media Queries #Font-Face */ /* #Site Styles ================================================== */ .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; /* ie 6/7 */ } body { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; color: #111;} #contentMain, #contentMain div, #contentMain ul li { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 13px;} img, object { max-width: 100%; height:auto; /* Added by DW - to keep images in scale */ } #gallery-2 img {border:none!important;} /* DW */ #gallery-2 .gallery-item {margin-top:0!important;} /* DW */ .xdebugwrap { margin: 20px;} .xdebugwrap h4 { margin: 14px 0 -2px; font-weight: 900; font-size: 13px; color: #0A7323;} .xdebug-var-dump { margin: 4px 0px;} #header h2 { font-size: 20px; line-height: 20px;} #headWrap { margin-bottom: 10px;} .presentedby { position: absolute;} .presentedby a { display: block; text-decoration: none;} #banner #stos { bottom: 43px;left: 26px; z-index: 50;} #banner #janda { bottom: 43px; left: 165px; z-index: 50;} #banner #stos a { width: 133px; height: 60px; } #banner #janda a { width: 133px; height: 99px; } #priNav { margin-top: 38px; margin-left: 80px; margin-bottom: 0;} #priNav li { display: inline; margin-bottom: 6px;} #priNav li { font-family:'oswaldbold'; font-size: 18px; line-height: 26px; } #priNav li a { text-decoration: none; padding-right: 20px;} #priNav li.current { background: #fff10d;} #loginContextual { font-family:'oswaldbold'; font-size: 16px; line-height: 20px; margin-top: 4px;} #loginContextual a { text-decoration: none; color: #999;} .mosaicitem { position: relative; margin-bottom: 18px; min-height: 250px; height: 230px; overflow: hidden; } .mosaiccopy { position: absolute; bottom: 0px; left: 0px; background-color: #00a6b6 /* #52869c #fff10d*/; width: 100%; height: 40%; padding-top: 8px;} .mosaiccopy h3, .mosaiccopy p { margin: 2px 10px; font-size: 14px; color: #000; font-weight: 400;} .mosaiccopy h3 { font-family:'oswaldbold'; font-size: 16px; text-transform: uppercase; line-height: 19px; margin-bottom: 0;} .mosaiccopy p { font-size: 12px; font-weight: 400; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; line-height: 17px;} #socialBtns { margin-bottom: 0;} #socialBtns li { display: inline;} .pale .mosaiccopy { background-color: #ba006b /* #b5beb2 #9cdbe4*/;} .blue .mosaiccopy { background-color: #efe93c;} .yellow .mosaiccopy { background-color: #fff10d;} .black .mosaiccopy, .black .mosaiccopy h3, .black .mosaiccopy p, .black .mosaiccopy a { background-color: #00a6b6 /* #132E42 */; color: #ffffff;} .black .mosaiccopy, .black .mosaiccopy h3, .black .mosaiccopy p, .black .mosaiccopy a { color: black;} .mosaiccopy h3 a, .mosaiccopy p a { color: #000; text-decoration: none;} .pale .mosaiccopy h3 a, .pale .mosaiccopy p a { color: #ffffff;} .mosaiccopy p .date { font-size: 9px; color: #666; padding-left: 5px;} .black .mosaiccopy p .date { color: #ccc;} .testimonialtile { background-color: #ba006b /* #f89566 */; position: relative;} .fulltweet { background-color: #efe93c /* #e25b23 */; position: relative;} .mosaicitem .feattile { width: 70%; position: absolute; top: 35%; left: 50%; height: 30%; margin: -15% 0 0 -35%; } .mosaicitem .feattile p { color: #fff; font-family:'oswaldlight'; font-size: 20px; line-height: 26px; margin: 0; text-align: center;} .fulltweet .feattile p, .manualText .feattile p { color: #001; word-wrap: break-word; } .testimonialtile a, .fulltweet .feattile a, .manualText .feattile a { text-decoration: none;} .testimonialtile a:hover, .testimonialtile a:active , .fulltweet .feattile a:hover, .fulltweet .feattile p a:active, .manualText .feattile a:hover, .manualText .feattile p a:active { text-decoration: none;} .manualText {background-color: #9cdbe4; position: relative;} .testimonialtile .feattile p { /* color: #111; */} .fmerror { margin-top: -30px; display: block; margin-bottom: 16px;} hr { margin: 4px 0; border: solid #aaa; border-width: 1px 0 0;} div.rule { border-top: 1px solid #888;border-bottom: 1px solid #888; padding: 4px 0; margin: 0 10px;} #secNav { /*height: 20px;*/ padding: 12px 0; overflow: visible; /*background: #fff10d;*/ background:#efe93c; margin: 0;} #secNav:after {content: ""; display: table; clear: both;} #secNav li { display: inline; float: left; margin: 0 2px 0 0; font-family:'oswaldbold'; line-height: 20px; font-size: 14px; color: #666;} #secNav li a { text-transform: uppercase; text-decoration: none; padding: 15px 20px 15px 0; color: #768c95;} #secNav li.secNavCurrent a { color: #000;} #secNav li h1 { display: inline; float: left; margin: 0; font-family:'oswaldbold'; line-height: 24px; font-size: 14px; color: #000;} #secNav #main, #secNav #main h1 { font-size: 24px; margin-right: 40px; margin-left: 14px; color: #000;} #secNav #main a { color: #000;} #footer { background: #f0f2f4; font-size: 10px; padding: 14px 0;} #footer p { margin: 0 30px;} .contentfoot {background-color: #8093a5; margin: 0 10px 20px; height: 30px;} .contentfoot {background-color: #313133; } .contentfootlink { position: relative; } .contentfoot .contentfootlink a { font-family:'oswaldbold'; line-height: 18px; font-size: 16px; color: #fff; width: 300px; text-decoration: none; display: block; position: absolute; top: 7px; left: 0px;} .contentfoot .contentfootlink a span { position: absolute; top: 0px; right: 10px; width: 40px;} #contentMain { margin: 18px 0 10px 10px;} #contentMain h2 { background: #01a6b6; font-family:'oswaldbold'; line-height: 24px; font-size: 24px; color: #000; padding: 10px 14px; text-transform: uppercase;} #sidebar { margin-top: 18px} #sidebar .mosaicitem { margin-bottom: 20px; margin-top: 0;} #contentMain .programme { width: 100%; /*font-family:'oswaldbold'*/; font-size: 14px; color: #000; font-weight: 400;} #contentMain .programme a:link, #contentMain .programme a:visited { text-decoration: none; color: #000;} #contentMain .programme a:hover, #contentMain .programme a:active { text-decoration: none; color: #333;} #contentMain .programme tr { border-bottom: 2px solid #fff; } #contentMain .programme td { padding: 4px 10px;} #contentMain .programme .intermission { background: #fff;} #contentMain .programme .session { background: #b0dce0 /*#b5c1c9*/;} #contentMain .programme .sessionoption { background: #d6dfe0 /*#e9ebee*/;} #contentMain .programme .sessionoption-closeup, #contentMain .programme .session-closeup { background: #f7e3ee; } #contentMain .programme tr td:first-child{ width: 110px;} #contentMain h3 { width: 100%; font-family:'oswaldbold'; font-size: 16px; color: #000; font-weight: 400; text-transform: uppercase; margin: 14px 0 0; line-height: 20px;} #contentMain h3 a { text-decoration: none; color: #000;} #contentMain h4 { width: 100%; font-family:'oswaldbold'; font-size: 18px; color: #000; font-weight: normal; line-height: 22px;} #banner { overflow-x: visible; overflow: visible; position: relative; } img.banner { z-index: 1; width: 940px; max-width: none;} #banner li.first img.banner { width: 972px; } img.bssmeta { z-index: 2; position: absolute; top: 0px; left: 0px;} #banner { margin-left: 10px} #banner ul, #banner li {height: 313px; width:960px; overflow: visible; } #banner li { display: none; position: absolute; top: 0px; left: 0px; width: 940px;} #banner li.first, #banner li#image0 { display: block; width: 972px;} .linebreaker { display: block; float: none; clear: left;} #contentMain tr { border-bottom: 1px solid #000; } #contentMain tr:last-child { border-bottom: 0;} #contentMain #invoice tr, #contentMain #checkout tr { border: none;} #contentMain td { vertical-align: top;} #contentMain td img { max-width: none;} #contentMain td h3 { margin-top: 10px; padding-top: 0; line-height: 20px;} #contentMain table { margin-bottom: 10px; width: 100%;} #contentMain a.read-more { color: #888; font-size: 10px;} #contentMain ul li a.listItemName { text-decoration: none;} #contentMain ul li a.listItemName span { font-family:'oswaldbold'; font-size: 16px; color: #000; text-transform: uppercase; } #contentMain div.speakerlist { margin-bottom: 14px; border-bottom: 1px solid #000; clear: both; min-height: 118px;} #contentMain div.speakerlist .image { float: left; width: 108px; margin: 0 14px 14px 0; } #contentMain div.speakerlist .copy { display: inline-block; width: 484px; margin: 0 0 14px;} #contentMain div.speakerlist a { text-decoration: none; } #contentMain div.speakerlist span { font-family:'oswaldbold'; font-size: 16px; color: #000; text-transform: uppercase; } /* added by sean Tue 2 Apr*/ #mlsignup { } #mlsignup label { min-width: 130px; display: block; float: left; clear: left;} #mlsignup input.cb, .submit_button { float: left; margin-left: 132px; padding: 8px 10px 0 0; } #mlsignup input, #mlsignup label { margin-bottom: 30px;} #mlsignup label.cb { padding: 0px 0 0 6px; font-size: 11px; clear: none;} #mlsignup #contactsubmit { float: left; margin-left: 132px; padding: 8px 10px 0 0;} #mlsignup #occupation, #mlsignup #age { margin-top: 4px;} #mlsignup input[type="text"], #mlsignup input[type="password"] { width: 220px;} #mlsignup select { width: 290px;} #mlsignup div label { min-width: 110px; display: block; float: left; clear: left;} a.cart_button {color: #000; display: block; margin: 0 0 15px 0; background-color: #000; width:85px; padding: 1px 10px 1px 10px; font-family: Arial, Helvetica, sans-serif; color: #fff !important; text-decoration: none; font-size:11px; text-transform:uppercase; text-align: center; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;} a.cart_button:hover, a.cart_button:active {background-color: #000;} #cartview .cartinfo { margin: 10px 0; width: 600px;} .text_center { text-align: center;} img.aligncenter { margin: 20px auto; display: block;} .sponsors a { font-weight: 900; color: #90a0b0; text-decoration: none;} p.logoblock { text-align: center } #contentMain h3.formText, p.formText { margin-left: 132px; width: 360px;} p.formText { font-size: 12px;} .cbClose { margin-bottom: 10px !important;} #btContextual { font-family:'oswaldbold'; font-size: 16px; line-height: 20px; margin-top: 4px; margin-left: -8px; display: inline-block} #btContextual a { text-decoration: none; color: #999;} #btContextual { padding: 4px 8px; background: #fef110; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } #btContextual a { text-decoration: none; color: #000;} .darkgreen .mosaiccopy { background-color: #00a6b6;} #secNav #main { width: auto } /* Dartworks code */ .buy-button { border-radius:4px; background:#61C3CE; display: block; text-align: center; font-size: 1.15em; padding: 10px; margin-top: 6px; color: #fff!important; font-family: 'oswaldbold'; text-decoration: none!important; } .buy-button:hover { background:#3C92A3; } #subForm label { display:inline-block; } /* End Dartworks code */ /* body { font-family:'UniversLTW01-59UltraCn' !important;} */ /* #Page Styles ================================================== */ /* #Media Queries ================================================== */ /* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width: 959px) {} /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) { .container .mosaicitem p, .container .mosaicitem h3 { font-size: 0.9em;} .contentfoot .contentfootlink a { width: 236px; } img.banner { max-width: 100%; width: 748px;} #banner li.first img.banner { width: 776px; } img.bssmeta { max-width: 239px;} #contentMain iframe { width: 492px;} #banner ul, #banner li { height: 246px;} } /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width: 767px) { #priNavGrp1, #priNavGrp2 { display: block; float: left;} .container .mosaicitem { margin-bottom: 20px;} /*#secNav, .contentfoot { height: 50px; }*/ #secNav li { font-size: 12px;} #secNav #main { font-size: 18px; margin-right: 10px; } div.rule, .contentfoot { margin: 0;} #banner { max-width: 100%; overflow: hidden; height: 146px; margin-left: 0;} #banner li#image0 {width:100%;} img.banner { height: auto; width:100%;} img.bssmeta { max-width: 236px;margin-left: 0;} .linebreaker { display: none;} #priNavGrp1 ul { margin-left: 0;} #socialBtns { width: 140px; float: left; margin-bottom: 0;} #btContextual { margin-top: 0; margin-right: 30px; float: right;} #loginContextual { margin-top: 4px; float: right;} .buy-button {margin-top: 4px; float: right; display:inline; margin-right: 10px;} #contentMain { margin-left: 0;} #contentMain iframe { width: 420px;} #banner ul, #banner li { height: auto; margin-bottom: 0; width:100%;} #priNav { margin-top: 18px; margin-left: 0px;} } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 767px) { .container .mosaicitem { min-height: 320px;} contentfoot .contentfootlink a { width: 420px; } img.banner { /*margin-left: -297px;*/ height:auto;} } /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { .container .mosaicitem { min-height: 250px; } .contentfoot .contentfootlink a { width: 300px; } #banner { height: 100px;} img.banner { /*margin-left: -230px;*/} #contentMain iframe { width: 300px;} } /* #Font-Face ================================================== */ @font-face { font-family: 'oswaldlight'; src: url('fonts/oswald-light-webfont.woff2') format('woff2'), url('fonts/oswald-light-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'oswaldbold'; src: url('fonts/oswald-bold-webfont.woff2') format('woff2'), url('fonts/oswald-bold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } #contentMain p img.alignleft, #contentMain h4 img.alignleft { margin: 0 20px 20px 0; display: inline; float: left;}