/* 
Theme Name: SUM
Author: Jonathan Perl
Author URI: http://zarmi.com 
Version: 1.0 
Description: Simple theme for Standupmaths.com
*/ 

/* =============================================================================
   Initializr Styles
   ========================================================================== */
   
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; }
html { font-size: 100%; overflow-y: scroll; -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; }
svg:not(:root) {    overflow: hidden;}
figure { margin: 0; }
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
legend { border: 0; *margin-left: -7px; padding: 0; }
label { cursor: pointer; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }
table { border-collapse: collapse; border-spacing: 0; }

/* =============================================================================
   Primary styles
   Author: 
   ========================================================================== */

/* -------------------- FONTS -------------------- */


@font-face {
    font-family: 'league-gothic';
    src: url('fonts/LeagueGothic-Regular-webfont.eot');
    src: url('fonts/LeagueGothic-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/LeagueGothic-Regular-webfont.woff') format('woff'),
         url('fonts/LeagueGothic-Regular-webfont.ttf') format('truetype'),
         url('fonts/LeagueGothic-Regular-webfont.svg#LeagueGothicRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* -------------------- ELEMENT DEFAULTS -------------------- */

html, body {min-height:100%;}

body{
  font-family:  'Open Sans', Helvetica, Arial, sans-serif;
  font-size: 16px;
  color: #fff;
  background: #000 url(img/header-tile.png) scroll repeat-x 0 0;
  margin-top:8px;
}

/*footer {position:fixed; bottom:8px; left:30px;}*/

footer {
    clear: both;
    /*background: rgba(0,0,0, 1);*/
    width: 100%;
    box-sizing:border-box;
    padding:8px 40px;
}
#matt {   position:fixed; bottom:0; right:0; z-index:-1; max-width:50%; max-height:80vh; }

nav {
  font-family: 'league-gothic',  Arial, sans-serif;
}

header {/*position:fixed; left:0; top:8px; width:224px; height:100%;*/ width:25%; float:left; max-width:250px;}
body {/*padding:0 0 0 240px;*/}
nav li a { color: #7fd7f5 /*#1BBEF5 /*#FDB64F*/;text-decoration:none; font-size:1.5rem;}
#top {}
.main-container {float:left; padding:205px 45px 50px 0; box-sizing: border-box; width:74.5%;}
.main-container h2 {margin-bottom:1rem;}
.main-container h3 {margin-bottom:1rem; color:#9cc2c3;}
.main-container h3.ytc_title { padding: 10px;
    margin-bottom: 0;}
p{  line-height: 1.6; margin: 0 0 10px 0;  }
a{   color: #fdecd4; text-decoration: underline; }
#header-logo img {height:146px; width:auto; display:block; margin:45px 0 0 45px; }
#menu-main { margin:45px 0 0 45px; padding:0; }
#header-logo:hover img, #top img:hover {opacity:.8;}
iframe {margin-top:16px; border:1px solid #333;}
#youtube-stats { position:relative; top:15px; right:15px; float:right; }
#youtube-stats img {height:50px; width:auto;}
#youtube-stats a {position: absolute;
    top: -15px; left:-12px;}
#youtube-stats a:hover img {opacity:.8;}
#youtube-stats p {padding-left:65px; color:#ccc; font-size:.875rem;}
#home-features {padding-top:2rem;}
.home-feature {
  float:left;
  width:31.5%;
  margin-right:1.5%; 
  border:1px solid rgb(255, 177, 30);
  position:relative;
  text-align:center;
  padding-bottom:20px;
  min-height:225px;
  height:225px;
  display: table;
}
.home-feature h4{
  position:absolute;
  bottom:0px;
  left:0;
  right:0;
  color:#ffb850;
}

.home-feature a {vertical-align: middle; display:table-cell;}

.home-feature img {max-height:200px; width:auto; max-width:90%;}
.home-feature img:hover {opacity:.8;}
/* headings */

h1, h2, h3, h4, h5{  font-weight: normal; margin: 0; color: #7D9394; font-family: 'league-gothic',  Arial, sans-serif; }
h1{ font-size: 2em;   }
h2{ font-size: 1.6em; }
h3{ font-size: 1.4em; }
h4{ font-size: 1.4em; }
h1.title {display:none;}
h3.gce-list-event {color: #fff; font-size:1.5rem;}
/* -------------------- WIDTHS -------------------- */

h4{ font-size: 1.2em; }
h5{ font-size: 1em;   }

/* -------------------- WIDTHS -------------------- */

section.s2{  width: 460px; }
section.s3{  width: 300px;}
section.s4{  width: 220px;} 

/* -------------------- LAYOUT -------------------- */

section{   float: left; margin: 0 0 0 30px; }
.wrapper{  width: 100%; clear: both; max-width:640px;}
section:first-child{ margin-left: 0;  }

/* header */

header nav li.current_page_item a, header nav li a:hover{    color: #FDB64F;   }

/* -------------------- CLASSES -------------------- */

.left{   float: left; }
.right{   float: right; }
.clear{    clear: both; }
.center{   text-align: center; }

/* typo */

.large{  font-size: 1.4em; line-height: 1em;   }
.italic{  font-style: italic; }
.meta{   font-size: .8em; }

/* buttons - for unifying styles across button-like <a>, <button>, <input type="submit"> and <input type="reset"> */

a.btn, button, input[type=submit], input[type=reset]{ padding: 6px; color: #000; background: #fff; text-decoration: none; position: relative; margin: 0 20px 10px 0; line-height: 1.1em; display: inline-block; border: none;  }


/* icons for calendar */

.simcal-nav i:before {
  color:#fff;
}

.simcal-nav-button:disabled i:before {
  color:#333;
}



button.simcal-prev {text-align:left;}
button.simcal-next {text-align:right;}

.simcal-default-calendar-list .simcal-calendar-head {}
#body-container .simcal-default-calendar-list ul.simcal-events{padding-left:0; margin-left:0;}
.simcal-default-calendar-list dt.simcal-day-label>span {color:#A82002 !important; font-family:'league-gothic'; padding:0 !important; font-size:1.25rem; margin:0;}
 
 .simcal-calendar-list  dd {
  padding:2px 10px;
 }
 .simcal-calendar-list  dd:nth-of-type(odd) {
        background: #A82002;
}
 .simcal-calendar-list  dd:nth-of-type(even) {
    background: #2E5052;
}

.simcal-default-calendar-list dt:nth-of-type(even).simcal-day-label>span {color:#5c8b8e !important;}
.simcal-default-calendar-list dt:nth-of-type(odd).simcal-day-label>span {color:#ce2904 !important;}

/* Youtube Page */
.youtube_channel .ytc_video_container {margin-bottom:30px; border:1px solid #333;}

/* -------------------- MEDIA QUERIES -------------------- */

/* 748px  */
@media all and (min-width: 0px) and (max-width: 940px) { 

/* #header-logo, #top img {height: 216px;}
header {width:216px;}
*/
  
 #matt img{   max-width: 100%; }
  
}
 

 .video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.video-container iframe,  
.video-container object,  
.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.entry-content img, 
.entry-content iframe, 
.entry-content object, 
.entry-content embed {
        max-width: 100%;
}


/* Mobile Landscape */
@media all and (min-width: 0px) and (max-width: 748px) { 
  header nav {position:absolute; top:170px; left:26px;}
  header {width:100%;}
  #menu-main li {display:inline;}
  nav li a {padding-right:1rem;}
  #menu-main {padding:0; margin:0;}
  .main-container {float:none; padding:225px 25px 25px 25px; width:100%;}
  #header-logo img { height:120px;width:auto; margin:25px; }
  #youtube-stats {    position: relative;
    /* top: 15px; */
    right: 0;
    clear: both;
    margin: 24px;
    float: left;}
}

/* Mobile Portrait */
@media all and (min-width: 0px) and (max-width: 479px) { 
 nav li a {padding:1rem .75rem 1rem 0; font-size:1.25rem;}
 footer {position:static; clear:both; padding: 0; background:none;}
 footer > div {padding:23px; font-size:.75rem;}
 #header-logo, #top img {
    height: 156px;
}
.home-feature {
  float:none;
  width:100%; 
  margin: 0 0 15px 0;
  }

header {width:100%; max-width:100%;}
#header-logo img {
max-width: 85%;
    box-sizing: border-box;
    margin: 25px auto;
    height: auto;
    display: block;

  
}

@media all and (min-width: 0px) and (max-width: 350px) { 
  nav li a {font-size:1.125rem;}
  header nav {top:150px;}
  .main-container {padding-top:190px;}
  }

/* tall */
@media all and (min-width: 0px) and (min-height: 700px) { 
}

/* -------------------- PSEUDO -------------------- */

/* selection colours */

::-moz-selection { background: #FDB64F; color: #fff; text-shadow: none; }
::selection { background: #FDB64F; color: #fff; text-shadow: none; }


/* =============================================================================
   Non-semantic helper classes
   Please define your styles before this section.
   ========================================================================== */

.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
.hidden { display: none; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* =============================================================================
   Print styles.
   Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}
