@import 'reset.css';


/* General
--------------------------------*/
h1 { font-size:17px; color:#0397D7; margin-bottom:15px; }
h2 { font-size:19px; color:#0397D7; margin-bottom:18px; }
h3 { font-size:18px; color:#333; font-weight:normal; margin-bottom:18px; }
h4 { color:#9C8D52; text-transform:uppercase; margin-bottom:15px;  }

p { font-size:1em;  }
p, li { line-height:1em; }
p, ul { margin-bottom:18px }

ul,li {
	margin:0;
	margin:0;
	list-style-type:none
}
ul {
	margin:0 0 15px 15px
}
li {
	background:url(http://www.dit.ie/media/styleimages/bullet-yellow.gif) no-repeat;
	padding-left:14px;
	margin-bottom:3px;
	margin-top:3px;
	background-position:0px 6px}
	
a { color:#231F20; text-decoration:underline }
a:hover { text-decoration:none }

iframe { border:0; }

h1#title { text-transform:uppercase; color:#666; }


table, td, th
{
border-collapse:collapse;
    
}

table, td, th
{
border:1px solid #0b92d1;
width: 90%;
    
}
th
{
background-color:#0b92d1;
color:white;
}


/* Fonts
--------------------------------*/
body { font-family:Arial, Helvetica, sans-serif; color:#333 }

#main { font-size:13px; }
#primary, #mobile-nav { font-size:15px }
#siteinfo { font-size:15px; }

#page-homepage h1#title { font-family:'ITCLubalinGraphW01-Demi', "Trebuchet MS", Trebuchet, Helvetica, Arial, sans-serif; font-size:24px; word-spacing:-4px;  }
h2 { font-family:'ITCLubalinGraphW01-Bd', "Trebuchet MS", Trebuchet, Helvetica, Arial, sans-serif; font-weight:normal; font-size:19px; }
.course h2 { font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold; }
.course h3 { font-family:Arial, Helvetica, sans-serif; font-size:13px; font-weight:bold; }
.course h4 { color:#666; font-weight:bold; margin-bottom:0; text-transform:none }

#banner h1, #banner h2, h3, #primary, #mobile-nav { font-family:'Proxima N W15 Reg', Arial, Helvetica, sans-serif; }
#banner h1 strong, #banner h1 em { font-family:'Proxima N W15 Bold', Arial, Helvetica, sans-serif;; font-weight:normal; }



/* Layout
--------------------------------*/

body { text-align:center; background:#fff; position:relative }
#container { max-width:960px; background-color:#fff; margin:0 auto; text-align:left; -moz-box-shadow: 0 0 4px 1px #999; -webkit-box-shadow: 0 0 4px 1px #999; box-shadow: 0 0 4px 1px #999; }

#primary { background-color:#0197d2; text-transform:uppercase }
#primary ul, #primary li { margin:0; padding:0; list-style-type:none }
#primary ul { display:block; margin-left:34px; }
#primary li { float:left; display:inline; }
#primary a { color:#fff; padding:0 10px; display:block; line-height:48px; text-decoration:none; }
#primary li.current a, #primary a:hover { background-color:#03ade0}

#mobile-nav { position:absolute; top:0; left:0; width: 250px; height:1000px; background:#0197d2; display:none; z-index:1000;	-webkit-box-shadow: inset -2px 0 10px 5px #111; -moz-box-shadow: inset -2px 0 10px 5px #111; box-shadow: inset -2px 0 10px 5px #111; }
#mobile-nav a { line-height:46px; padding-left:20px; text-transform:uppercase; color:#ffffff; text-decoration:none; display:block; background:url(/media/openday2/images/mobile_nav_arrow.gif) 220px 15px no-repeat }
#mobile-nav a:hover { color:#03ade0; background-color:#0197d2 }
#mobile-nav ul, #mobile-nav li { margin:0; padding:0; list-style-type:none }
#mobile-nav li { border-bottom:1px solid #232323; border-top:1px solid #3a3a3a; text-align:left;  }
#mobile-nav ul { border-bottom:1px solid #3a3a3a }

#primary ul.basic { margin:0; }
#primary ul.basic li { margin:0; display:inline; float:left; width:48px; }
#primary ul.basic li img { vertical-align:middle}
#primary ul.basic li a { padding:0;}
#primary ul.basic li.menu a { background-image:url(/media/openday/images/mobile_nav_menu.gif) }
/* text replacement */
#primary ul.basic li { text-indent: 100%; white-space: nowrap; overflow: hidden; }
#primary ul.basic li a { display:block; float:left; width:48px; height:48px; background-position:center center; background-repeat:no-repeat; }
.shownav #primary ul.basic li.menu a { background-image:url(/media/openday/images/mobile_nav_menu.gif) }
#primary ul.basic li.home a { background-image:url(/media/openday2013/images/cogg.png) }

.shownav #mobile-nav { display:block !important }
body.shownav #container { position:absolute; left:250px; }

#content { margin:0 0 15px; margin:0 auto; }

#banner { margin:20px 0; float:left; display:inline; }
#banner h1 strong, #banner h1 em { font-weight:bold; text-transform:uppercase; display:block; font-style:normal; font-size:26px; }
#banner h1 em { color:#A29256 }
#banner h2 { color:#012B5D; text-transform:uppercase; font-weight:normal; font-size:19px; }
#banner h3 { color:#0397D7; text-transform:uppercase; font-weight:bold; font-size:13px; margin:0; }

footer#siteinfo { background-color:#0197d2; padding:18px 0; }
#tagline { width:50%; color:#0397D7; margin:0 0 0 15px; float:left; display:inline; }
#tagline a{ width:50%; color:#fff !important; margin:0 0 0 15px; display:inline; text-decoration:none;}
footer#siteinfo ul { float:right; display:inline; }
footer#siteinfo a { color:#fff }

#main {  clear:both; margin:0 auto; }

#panels .column, #panels .column2 { width:49%; margin-left:1%; vertical-align:middle }
#panels .box { float:left; display:inline; width:32%; min-height:139px; margin-left:2%; margin-bottom:2% }

#panels .row { margin-left:0; }
#panels .box a { text-decoration:none; display:block; float:left; height:100%; width:100%;  }
#panels .box a:hover { opacity:0.75 }
#panels .box a h2, #panels .box h2 { color:#fff; }
#panels .full { overflow:hidden; width:100%; }
#panels .full img { vertical-align:middle }
#panels .box h2 { margin:35% 2px 0; text-align:center; }
#panels .alt1 { background:#0397D7;}
#panels .alt2 { background-color:#E6E5E1 }
#panels .alt2 a h2 { color:#0397D7 }
#panels .alt3 { background-color:#F37423 }
#panels .alt3 h2, #panels .alt4 h2  { text-align:left; margin-left:20px; margin-top:20px; max-width:120px; }
#panels .alt4 h2 em { display:block; font-style:normal; margin-top:10px; }
#panels .alt3 h2, #panels .alt4 h2 { font-size:17px; }
#panels h2, #panels .alt4 h2 em { font-size:15px; }
#panels .alt4, #panels .alt5 { background-color:#32CCFE }
#panels .alt5 { padding-left:2%; margin-left:0 !important; }
#panels .alt5 .inner { margin-top:25%; }
#panels .alt6 { background-color:#F37423;  }
#panels .alt6 a h2 { color:#fff; }


/* Classes
--------------------------------*/
a.highlight { color:#0397D7; font-style:italic; font-weight:bold; text-decoration:none }
a.highlight:hover { text-decoration:underline }

ul.inline, ul.inline li { margin:0; padding:0; list-style-type:none }
ul.inline li { float:left; display:inline; margin-right:30px; }

.column, .full, .location { margin-bottom:10px;  }
.column { width:100%; float:left; display:inline; }
/*.column { width:100%; display:inline; }*/
.full { width:100%; clear:left; background-color:#E6E5E1; }
.fullpage { width:100%; background-color:#fafbf5; }
.full .column { background:none }
.inner { padding:20px; }
.row { clear:left; margin-left:0; }
  
.plainbg { background-color:#fff; }
  
.location { background:#fff; }
.location .column { margin-bottom:0; }
  
.course { margin-bottom:10px;}
.course .inner { padding:5px; background-color:#E6E5E1 }
.course .photo { float:left; display:inline; min-height:80px; min-width:80px; overflow:hidden }
.course .text { max-width:240px; margin-left:90px;  }
.course .extra { display:none; }
.course .extra .text { padding-top:10px; color:#666; }
.course .extra a { color:#666; text-decoration:none }
.course .extra a:hover { text-decoration:underline }
.course .extra a.video { color:#0397D7; text-decoration:underline; font-weight:bold; font-style:italic }
.course .extra a.video:hover { text-decoration:none }
.course .extra { background-color:#fff; padding:5px; color:#666; }
.course h2 { color:#A0905D; text-transform:uppercase; margin:5px 0;  }
.course h3 { font-size:13px; color:#0397D7; font-weight:bold; margin:0; }

.course .inner { cursor:pointer }
.show .extra { display:block; }

/*http://niklausgerber.com/blog/responsive-google-or-bing-maps/*/
.responsive-iframe-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }
.responsive-iframe-container iframe, .vresponsive-iframe-container object, .vresponsive-iframe-container embed { position: absolute;top: 0; left: 0; width: 100%; height: 100%; }

ul.photos li { width:32%; margin:0; margin-left:1%; }
ul.photos li.row { margin-left:0; }




/* Page Specific Varitions
--------------------------------*/
#page-homepage h1#title { color:#0397D7; text-transform:none } 

#page-talks h4 { color:#0397D7; }

#page-visit h4 { margin-bottom:0; }

#page-discover .full a { color:#0397D7; text-decoration:none; font-weight:bold; font-style:italic  }
#page-discover .full a:hover { text-decoration:underline;  }



/* Responsive Resets
--------------------------------*/
/*Hidden by default*/
#primary ul, #primary ul.basic, #banner, #page-homepage #main, ul.photos { display:none; }


/*Mobile*/
@media screen and (max-width: 600px) {
#main, #panels { margin:0 5px 5px; }
#primary ul.basic { display:block; }
#primary { margin-bottom:0px; border-bottom:1px solid #0197d2;  }
.inner { padding:12px; }
#banner { margin-top:0 }

#page-homepage #banner { display:block; background-color:#ffffff; padding:29px; margin-top:0; }
#page-homepage #banner .photo, .nomobile { display:none !important; }
#page-homepage #banner h2 { color:#000000; }
#page-homepage #primary { margin-bottom:0; }

#panels .full { background:none; height:auto }
#panels .box { width:49%; min-height:160px; }
#panels .column { width:100%; clear:both; }
#panels .alt2 { float:right; margin-right:0; }
#panels h2 { font-size:19px; margin-top:25%; }


h1#title { margin-top:10px; }
 
}

/*Bigger than mobile*/
@media screen and (min-width: 600px) {
  #content { margin:0 15px 15px; }
  #primary { width:100%; position:relative; }
  #primary ul, #page-homepage #main, #banner, ul.photos { display:block }
  #primary ul.basic { display:none }
  #primary ul { margin-left:18px; }
  #primary a { padding:0 7px; }
  
  #banner .photo { float:left; display:inline; min-width:213px; min-height: 223px; margin-right:38px; }
  #banner .text {  float:left; display:inline; min-width:200px; max-width:312px; padding-top:40px; }
  #tagline { margin:0 0 0 34px; }
  
  #page-homepage h1#title { width:65%; text-align:left; }
  #page-homepage #main .column { width:65%; margin-left:0; }
  #page-homepage #main .inner { width:100%; padding:0; } 

}


/*Tablet*/
@media screen and (min-width: 768px) {
  #content { min-width:696px; margin:0 35px }
  #banner .photo { margin-right:78px; }

  .column { width:49%; margin-left:2%; }
  .row { margin-left:0; }

}

/*Desktop*/
@media screen and (min-width: 960px) {
 
  .column { width:49%; margin-left:2%; }
  .row { margin-left:0; }

  #primary ul { margin-left:34px; }
  #primary li { margin-right:10px; }
  #primary a { padding:0 15px; }
  
  #banner { margin-left:20px;  }
  
  #page-homepage #main .column { width:50%; margin-left:0%; }
  #page-homepage #main .inner { width:90%; padding:0; }
  #page-homepage #main .row { margin-left:0%; }
  #page-homepage h1#title { width:100%; text-align:center; }
  
  #content { width:885px; }

  .course .text { max-width:340px; margin-left:90px;  }
  
  #panels .row { margin-left:0; }
  #panels .full { height:287px; overflow:hidden; background-color:#1B1B1B; }
  #panels .alt3 h2, #panels .alt4 h2 { font-size:24px; }
  #panels h2 { font-size:19px; }
  #panels .alt4 h2 em { font-size:15px; }
  
  .location { background:url(/media/openday2013/images/row_white_plain.gif ) top center repeat-y; }
}
