/* COLORS
 ------------------------------------------------------*/
 

.red a {
color: #e95e4f;
}
.blue a {
color: #3e8cc0;
}
.green a {
color: #30c3a6;
}
.orange a {
color: #e88b38;
}
.purple a {
color: #9b59b6;
}
.yellow a {
color: #f2ca27;
}

li {
list-style: none;
}


 
 
/* LOCAL FONTS
 ------------------------------------------------------*/
@font-face {
font-family: 'Proxima Nova';
src: url("../fonts/proximanova-regular-webfont.woff");
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Proxima Nova';
src: url("../fonts/proximanova-regitalic-webfont.woff");
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'Proxima Nova';
src: url("../fonts/proximanova-extrabold-webfont.woff");
font-weight: 700;
font-style: normal;
}
/* GENERIC
 ------------------------------------------------------*/
* {
margin: 0;
padding: 0;
}

a, a:hover, a:active, a:focus {
outline: 0;
text-decoration: none;
}
article a:hover,
aside a:hover {
text-decoration: underline;
}

.clear {
clear: both;
line-height: 0;
}

/* HTML & BODY
 ------------------------------------------------------*/
html, body {
width: 100%;
height: 100%;
min-width: 990px;
overflow-y: hidden;
overflow-x: auto;
}

body {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: none;
/* Stop mobile text resizing */
font-family: Proxima Nova, sans-serif;
font-size: 14px;
text-align: center;
color: #000;
}

/* SPLASH PANEL
 ------------------------------------------------------*/
.splashPanel {
height: 100%;
width: 100%;
background: #ffffff;
color: #ffffff;
text-align: center;
position: absolute;
top: 0;
left: 0;
 }
.splashPanel * { 
/*
box-sizing: border-box;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out; 
*/
}

.splashPanel .innerPanel {
width: 100%;
height: 100%;
overflow: auto;
}
.splashPanel img {
height: 100%;
width: auto;
max-height: 100%;
display: inline-block;
/*margin: 30px;
padding-right: 16px;*/
}
.splashPanel div.button {
margin: 0 auto;
clear: both;
}
.splashPanel a {
border: 3px solid #000000;
color: #000000;
padding: 10px 20px;
width: auto;
font-size: 30px;
font-weight: bold;
/*margin-bottom: 20px;*/
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
transition: background .2s ease-in-out, color .2s ease-in-out;
-webkit-transition: background .2s ease-in-out, color .2s ease-in-out;
-moz-transition: background .2s ease-in-out, color .2s ease-in-out;
-o-transition: background .2s ease-in-out, color .2s ease-in-out;
}
.splashPanel a:hover {
background: #000000;
color: #ffffff;
}

.splashPanel .brand {
display: table;
height: 100%;
width: 100%;
}

.row {
display: table-row;
}
.cell {
display: table-cell;
}

.splashPanel .row,
.splashPanel .cell {
width: 100%;
vertical-align: middle;
}

.splashPanel img {
height: 480px;
width: auto;
}

.splashPanel .logo {
text-align: center;
width: 100%;
display: block;
}
.splashPanel .button {
width: 100%;
display: block;
text-align: center;
text-align: center;
vertical-align: top;
padding-top: 40px;
}

.splashPanel .button a {
width: auto;
}


@media only screen and (min-height: 1100px) {
.splashPanel img {
height: 720px;
width: auto;
}
.splashPanel .button {
padding-top: 68px;
}
}
@media only screen and (min-height: 901px) {
.splashPanel img {
height: 640px;
width: auto;
/*margin-left: 12px;*/
}
.splashPanel .button {
padding-top: 54px;
}
}
@media only screen and (max-height: 900px) {
.splashPanel img {
height: 520px;
width: auto;
/*margin-left: 10px;*/
}
.splashPanel .button {
padding-top: 48px;
}
}
@media only screen and (max-height: 768px) {
.splashPanel img {
height: 420px;
width: auto;
/*margin-left: -6px;*/
}
.splashPanel .button {
padding-top: 40px;
}
}
@media only screen and (max-height: 640px) {
.splashPanel img {
height: 380px;
width: auto;
/*margin-left: -12px;*/
}
.splashPanel .button {
padding-top: 32px;
}
}
@media only screen and (max-height: 540px) {
.splashPanel img {
height: 320px;
width: auto;
/*margin-left: -22px;*/
}
.splashPanel .button {
padding-top: 24px;
}
}







/* MAIN
 ------------------------------------------------------*/
.main {
position: relative;
width: 100%;
height: 100%;
top: 100%;
overflow: hidden;
}
.main .innerContainer {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}

.main .innerInnerContainer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


.main .innerContainer section {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;

padding-left: 80px;
padding-top: 90px;
overflow-x: auto;
overflow-y: hidden;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.innerPanel {
width: 100%;
height: 100%;
overflow-y: auto;
overflow-x: hidden;
}

/* HEADER
 ------------------------------------------------------*/
header {
position: absolute;
top: 0;
left: 0;
background: #f5f5f5;
width: 100%;
height: 85px;
border-bottom: 5px solid #000000;
z-index: 999;
min-width: 990px;
}
header .logo {
float: left;
}
header ul {
float: right;
}
header li {
display: inline-block;
float: left;
height: 85px;
line-height: 85px;
border-left: 1px solid #ccc;
}
header li a {
float: left;
display: block;
color: #000;
padding: 0 2em;
font-weight: 700;
font-size: 1.3em;
transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
}
header li span {
padding: 0 2em;
}
header li a:hover, header li a.current {
background: #000;
color: #fff;
}

@media only screen and (max-width : 1140px) {
header .logo img {
padding-top: 20px;
width: 520px;
}
}



/* NAV
 ------------------------------------------------------*/
nav {
width: 80px;
height: 100%;
position: absolute;
top: 90px;
left: 0;
z-index: 2;
background: #ddd;
}





nav li {
display: block;
width: 80px;
height: 80px;
text-align: right;
text-indent: 80px;
white-space: nowrap;
line-height: 80px;
font-size: 1.3em;
font-weight: 700;
overflow: hidden;
background: #ddd url('../img/icon-sprite.png') no-repeat 0 0;
cursor: pointer;
transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
position: relative;
color: #ffffff;
}

nav li:hover {
padding-left: 10px;
padding-right: 10px;
}








nav li.purple {
background-color: #9b59b6;
background-position: 0 0;
}
nav li.purple:hover {
/*width: 322px;*/

background-color: rgb(155,89,182);
background-color: rgba(155,89,182,.8);
}

nav li.orange {
background-color: #e88b38;
background-position: 0 -80px;
}
nav li.orange:hover {
/*width: 235px;*/

background-color: rgb(232,139,56);
background-color: rgba(232,139,56,.8);
}

nav li.blue {
background-color: #3e8cc0;
background-position: 0 -160px;
}
nav li.blue:hover {
/*width: 359px;*/

background-color: rgb(62,140,192);
background-color: rgba(62,140,192,.8);
}

nav li.red {
background-color: #e95e4f;
background-position: 0 -240px;
}
nav li.red:hover {
/*width: 341px;*/

background-color: rgb(233,94,79);
background-color: rgba(233,94,79,.8);
}

nav li.yellow {
background-color: #f2ca27;
background-position: 0 -320px;
}
nav li.yellow:hover {
/*width: 224px;*/

background-color: rgb(242,202,39);
background-color: rgba(242,202,39,.8);
}

nav li.green {
background-color: #30c3a6;
background-position: 0 -400px;
}
nav li.green:hover {
/*width: 253px;*/

background-color: rgb(48,195,166);
background-color: rgba(48,195,166,.8);
}




/* Sections */

h1, h2, h3, h4, h5, h6,
section li,
p {
margin: .8em 0 .4em 0;
}
h1 {
font-size: 48px;
font-weight: 700;
line-height: 1em;
}
h2 {
font-size: 36px;
font-weight: 700;
}
h3 {
font-size: 24px;
font-weight: 700;
}
h4 {
font-size: 21px;
font-weight: 700;
}
h5 {
font-size: 18px;
font-weight: 700;
}

p {
font-size: 18px;
line-height: 1.2em;
}

p.credits {
position: absolute;
bottom: 0;
padding: 10px 10px 10px 10px;
background: rgba(0,0,0,0.65);
color: #fff;
margin: 0;
font-size: 1em;
}

p.disclaimer {
font-family: Georgia, serif;
font-style: italic;
font-size: 1em;
line-height: 1.35em;
color: #888;
margin-top: 2.4em;
}

td {
padding: .4em .6em;
border: 2px solid #ddd;
}


tr th {
padding: .2em .4em;
border: 2px solid #ddd;
background: #e95e4f;
color: #fff;
font-weight: 700;
}

.red tr th {
background: #e95e4f;
border-color: #eaa7a0;
}
.blue tr th {
background: #3e8cc0;
border-color: #97c2df;
}
.green tr th {
background: #30c3a6;
border-color: #8fdfcf;
}
.orange tr th {
background: #e88b38;
border-color: #f0c59e;
}
.purple tr th {
background: #9b59b6;
border-color: #ceabdc;
}
.yellow tr th {
background: #f2ca27;
border-color: #f6e396;
}

aside h4 {
margin-top: 1.5em;
}

h2.biline {
margin-top: .4em;
line-height: 1.2em;
}
h2.biline span {
display: block;
}
span.answer {
font-size: .8em;
line-height: 1em;
}


aside blockquote {
position: absolute;
top: -280px;
right: 50px;
width: auto !important;
height: auto !important;
z-index: 1;
color: #fff;
/* font-weight: 700; */
/* font-size: 3em; */
background: rgba(0,0,0,0.5);
padding: 20px 25px;
width: 480px !important;
}

aside blockquote p {
font-weight: 700;
font-size: 1.8em;
line-height: .95em;
margin: .2em 0;
}


.links {
	word-wrap: break-word;
}

.links li {
margin: 0 0 .8em 0;
}

.links a {
font-weight: 700;
font-size: 1.3em;
line-height: 1em;
}

a {
word-break: break-word;
}

.quick-wins li {
font-weight: 700;
color: #aaa;
font-size: 1.3em;
margin: .4em 0;
letter-spacing: -.2px;
}

.quick-wins li:before {
content: '';
display: inline-block;
height: 12px;
width: 12px;
background: #e95e4f;
line-height: 1.6em;
margin-right: 8px;
}

.red .quick-wins li:before {
background-color: #e95e4f;
}
.blue .quick-wins li:before {
background-color: #3e8cc0;
}
.green .quick-wins li:before {
background-color: #30c3a6;
}
.orange .quick-wins li:before {
background-color: #e88b38;
}
.purple .quick-wins li:before {
background-color: #9b59b6;
}
.yellow .quick-wins li:before {
background-color: #f2ca27;
}

 
section {
background: #fff;
position: relative;
text-align: left;
}
article, aside {
box-sizing: border-box;
float: left;
}
article {
padding: 20px 40px 80px 50px;
width: 60%;

}

aside {
padding: 40px;
width: 40%;
position: relative;
}

.feature-img {
height: 420px;
overflow: hidden;
position: relative;
}

.feature-img img {
width: 100%;
height: auto;
}

.marker {
position: absolute;
top: -100px;
right: 50px;
width: auto !important;
height: auto !important;
z-index: 1;
}


/* PANEL 1
 ------------------------------------------------------*/
.panel1 {
clear: both;
left: 0;
}

/* PANEL 2
 ------------------------------------------------------*/
.panel2 {
}

/* PANEL 3
 ------------------------------------------------------*/
.panel3 {
}

/* PANEL 4
 ------------------------------------------------------*/
.panel4 {
}

/* PANEL 5
 ------------------------------------------------------*/
.panel5 {
}

/* PANEL 6
 ------------------------------------------------------*/
.panel6 {
}

/* ABOUT
 ------------------------------------------------------*/
.panelAbout {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%;
padding-top: 90px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

/* SPONSORS
 ------------------------------------------------------*/
.panelSponsors {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%;
padding-top: 90px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.panelSponsors article,
.panelSponsors aside {
width: 100%;
padding: 20px 40px 0 40px;
}

.panelSponsors aside {
padding-bottom: 80px;
width: 60%;
}

.panelAbout article img {
box-sizing: border-box;
float: left;
/*width: 19%;*/
width: 100%;
max-width: 1680px;
margin: .5%;
height: auto;
/*-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
border: 3px solid #f5f5f5;*/
}

.panelSponsors article img {
box-sizing: border-box;
float: left;
/*width: 19%;*/
width: 100%;
max-width: 1680px;
margin: .5%;
height: auto;
/*-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
border: 3px solid #f5f5f5;*/
}