@import url("base.css");
div.page {max-width:1000px; margin:auto; overflow:hidden;}
.rightside {float:right;}
.theme-bg {background:#000;}
.metro-pivot .headers { white-space: nowrap; height: 60px; display: block; clear: both; }
.metro-pivot .pivot-item h3, .metro-pivot .headers .header { font-size: 250%; font-weight: light;font-family: "Segoe UI Light", SUIL, Arial, sans-serif; display: inline-block; vertical-align: top; padding: 0; cursor: pointer; margin-right:44px; }
.metro-pivot .headers .header.current { }
.metro-pivot .items { position: relative; }
.metro-pivot .items .pivotItem { display: block; white-space: normal; text-align: justify; width: 100%; }
ul.metro-list { padding: 0; }
ul.metro-list li { display: block; margin: 10px 0; height: 20px; padding: 5px; overflow: hidden; border-left: solid 30px; list-style: none; }
a.metro-button { display: inline-block; padding: 2px 10px; border: solid 2px white; color: white; text-decoration: none; margin: 10px 0; }
.start-menu-item { float: left; height: 120px; width: 120px; position: relative; color: White; margin: 5px; overflow: hidden; }
.start-menu-item label { position: absolute; margin: 5px; bottom: 0; left: 0; white-space: nowrap; }
.side-menu-item { height: 20px; padding: 5px 15px; border-left: solid 30px; margin: 10px 0; }
ul.metro-conversation { padding: 0 30px; }
ul.metro-conversation li { margin: 10px 0; display: block; padding: 10px; line-height: 110%; margin-right: 20%; position: relative; }
ul.metro-conversation li.alt { margin-right: 0; margin-left: 20%; }
ul.metro-conversation li .list-diam { position: absolute; top: -15px; left: 20px; font-size: 40pt; font-family: Arial; }
ul.metro-conversation li.alt .list-diam { left: auto; right: 20px; top: auto; bottom: -10px; }
div.html { background: white; padding: 10px; margin-left: 30px; border: dotted 2px #aaa; }
ul.metro-conversation li .question { color: #444; border-bottom: dashed 1px #444; margin-bottom: 5px; padding-bottom: 10px; }
.wp-popup {display:none; margin:20px;}
.wp-popup-container {position:absolute; top:0; left:0; width:100%; display:none;}
a.wp-colored-button {display:inline-block; padding:0 15px; border:solid 4px; color:inherit !important;}
.top-banner {text-align:right; border-bottom:dotted 1px #777; margin-bottom:10px; font-size:10pt;}
.top-banner .theme-box,
.top-banner .accent-box {display:inline-block; width:15px; height:15px; margin:3px; border:solid 1px #777; cursor:pointer; vertical-align:middle; }
.top-banner .accent-box {background:#F09720;}
pre.jush {font-size:9pt; background:#F0F0FF; border:dashed 1px #aaa; padding:10px;}
pre.jush a {text-decoration:none; }
pre.jush a:hover {text-decoration:underline; }
#container
{
max-width:800px;
min-height: 500px;
margin-left:auto;
margin-right:auto;
margin-top:150px;
}
.footer {
max-width:800px;
min-height: 500px;
margin-left:auto;
margin-right:auto;
}
.metro-pivot {
min-height:350px;
margin-left:2px;
}
h2 { margin-left:20px; }
.Tile {
float: left;
margin-right: 10px;
margin-bottom: 10px;
text-align:center;
padding: 5px;
opacity:0.75;
}
.Tile img { border :0;}
.Tile:hover { opacity:1;}
.one {
width: 130px;
height: 130px;
}
.two-h {
width: 280px;
height: 130px;
}
.two-v {
width: 130px;
height: 280px;
}
.four {
width: 280px;
height: 280px;
}
.blue {
background: #00a9da;
background-image: linear-gradient(left top, #00ABDA 0%, #00BEF2 80%);
background-image: -o-linear-gradient(left top, #00ABDA 0%, #00BEF2 80%);
background-image: -moz-linear-gradient(left top, #00ABDA 0%, #00BEF2 80%);
background-image: -webkit-linear-gradient(left top, #00ABDA 0%, #00BEF2 80%);
background-image: -ms-linear-gradient(left top, #00ABDA 0%, #00BEF2 80%);
background-image: -webkit-gradient(
linear,
left top,
right bottom,
color-stop(0, #00ABDA),
color-stop(0.8, #00BEF2)
);
}
.lime {
background: #8CBE29;
background-image: linear-gradient(left top, #8CBE29 0%, #95C92C 80%);
background-image: -o-linear-gradient(left top, #8CBE29 0%, #95C92C 80%);
background-image: -moz-linear-gradient(left top, #8CBE29 0%, #95C92C 80%);
background-image: -webkit-linear-gradient(left top, #8CBE29 0%, #95C92C 80%);
background-image: -ms-linear-gradient(left top, #8CBE29 0%, #95C92C 80%);
background-image: -webkit-gradient(
linear,
left top,
right bottom,
color-stop(0, #8CBE29),
color-stop(0.8, #95C92C)
);
}
.purple {
background: #7c02d1;
}
.Tile h2 { color:white; font-size: 1.75em; margin-top:-10px; margin-left:0px;}
#sponsors {
margin-top:25px;
}
#sponsors h3 { margin-bottom:15px; }
@media screen and (max-width:800px)
{
h1 {font-size: 2em;}
h2 {font-size: 1.5em;}
h3 {font-size: 1.25em;}
.metro-pivot .pivot-item h3, .metro-pivot .headers .header { font-size: 125%; display:block; }
.metro-pivot .pivot-item h3, .metro-pivot .headers {clear:both; height: auto; }
ul,li { margin-left:0px; padding:0px;}
#container { margin:5px; }
}