html, body { -webkit-text-size-adjust: none; margin: 0; padding: 0; font-family: 'Open Sans', Arial, sans-serif; font-size: 18px; font-weight: 400; }
img { border: none; }
#tier1, #tier2, #tier3, #tier4, #tier5, #stier, #tier6, #tiererror { width: 100%; clear: both; float: left; }
.inside { width: 100%; max-width: 960px; float: left; position: relative; left: 50%; margin-left: -480px; padding: 50px 0; }
.alt { background: #415e80; color: #ffffff; }
.inside h3 { text-align: center; font-size: 30px; font-weight: 700; margin: 0; padding: 0 0 30px 0; }
.small { font-size: 14px; }
.hide { display: none; }

#tier1 { background: #171717 url('images/disc-golf-scorecard-background.jpg') center center no-repeat; background-size: cover; color: #ffffff; }
#headertext { float: left; color: #ffffff; text-align: center; width: 60%; }
#headerimage {float: left; width: 35%; margin: 0 0 0 5%; text-align: center; }
#headerimage img { width: 100%; }
#tier1 h1 { font-size: 49px; line-height: 46px; font-weight: 700; padding: 0; margin: 50px 0 15px 0; }
#tier1 h2 { font-size: 27px; font-weight: 400; padding: 0; margin: 0 0 55px 0; }
#tier1 h3 { font-size: 24px; font-weight: 400; padding: 0; margin: 0 0 90px 0; }

#tiererror { background: #FF2D2A; color: #ffffff; }
#tiererror h2 { color: #ffffff; }
#tiererror a:link, #tiererror a:visited, #tiererror a:hover, #tiererror a:active { color: #ffffff; }
#tier2 { text-align: center; }
#tier2 p { width: 70%; margin: 0 auto; }
#tier4 p { margin: 0 0 30px 0; }
#tier2 img { width: 100%; max-width: 269px; margin: 20px 0 0 0; }
#tier2 #tabs { margin: 30px 0 0 0; }
#tier2 #tabs div { display: inline-block; line-height: 0;}
#tier2 #tabs a:link span.tab, #tier2 #tabs a:active span.tab, #tier2 #tabs a:visited span.tab { text-decoration: none; display: inline-block; padding: 20px 30px; border: 2px solid #cccccc; border-radius: 4px; margin: 0 10px; color: #cccccc; }
#tier2 #tabs a:hover span.tab { background: #ff2d2a; border: 2px solid #ff2d2a; color: #ffffff; }
#tier2 #tabs a.selected span.tab { background: #ff2d2a; border: 2px solid #ff2d2a; color: #ffffff; }
.arrowdown { display: inline-block; width: 18px; height: 9px; margin: 0; padding: 0; }
#tier2 #tabs a.selected .arrowdown { background: #ffffff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAJCAYAAAA/33wPAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NDkxMSwgMjAxMy8xMC8yOS0xMTo0NzoxNiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkE0NTlDNDc5QTJERjExRTNCMDE1ODQ3MDNDRjhEMDgxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkE0NTlDNDdBQTJERjExRTNCMDE1ODQ3MDNDRjhEMDgxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTQ1OUM0NzdBMkRGMTFFM0IwMTU4NDcwM0NGOEQwODEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTQ1OUM0NzhBMkRGMTFFM0IwMTU4NDcwM0NGOEQwODEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7pUp27AAAAvklEQVR42mL8r6u1k4GBwRWIGRnIB4uYGC5ddQcyplNgyCqgGUlMYOalq9lAsoMMQ9YB9cYA6b+M////hwkyMuhpzwDSaUQashVoSBCQ/gXWjGQQCDADDVsHpP0IGLILaAhIzU+4K9AMAgEuoGH7gLQ5DkMOAA3xBtLfkAWxGQQCokDDDgBpLTTxo9DI+YquAZdBICADNOw4mIaAU0BD3ID0R2yKGc+cOYMvLHSNE+NqQerOzl+UgssQEAAIMAA9qz3YXyR4hAAAAABJRU5ErkJggg==') center center no-repeat; }


#tier2 .inside h3, #tier4 .inside h3 { padding: 0; }

#scrollcontainer { width: 100%; height: auto; overflow-x: auto; -webkit-overflow-scrolling: touch;}
#scrollholder {  white-space:nowrap; width: 200%; }
#scrollholder .col { width: 16%; padding: 0; }
#tier3 img { width: 100%; max-width: 300px; margin: 0 auto; }
#stier {background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 50%, #415e80 50%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,#ffffff), color-stop(50%,#415e80)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 50%,#415e80 50%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 50%,#415e80 50%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 50%,#415e80 50%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 50%,#415e80 50%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#415e80',GradientType=0 ); /* IE6-9 */
}
#stier .inside { padding: 0; }

.inside ul { margin-left: 5%; padding-left: 0; }
.inside ul li { margin-bottom: 10px; }
a:link.outlinebtn, a:visited.outlinebtn { display: inline-block; padding: 12px 30px; border: 2px solid #ffffff; color: #ffffff; border-radius: 4px; text-decoration: none; font-size: 25px; }
a:hover.outlinebtn, a:active.outlinebtn { background: #ff2d2a; border: 2px solid #ff2d2a; }

.col { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; float: left; width: 32%; padding: 0 2%; text-align: center; }
.circle { display: block; width: 46px; height: 46px; line-height: 46px; color: #ffffff; border-radius: 50%; margin: 30px auto; }
.red { background: #ff2d2a; }
.blue { background: #3289de; }
.green {background: #539e2b; }

.twitter { display: block; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 332px; height: 332px; border-radius: 50%; padding: 7%; text-align: center; }
.twitter h3 { color: #ffffff; }
a:link.twitter, a:visited.twitter, a:active.twitter { color: #ffffff; text-decoration: none; }
a:hover.twitter { background: #363636; }

@media (max-width: 960px) {
.inside {  width: 90%; padding: 50px 5%; position: relative; left: 50%; margin-left: -50%;}
#tier1 h1 { font-size: 39px; line-height: 46px; font-weight: 700; padding: 0; margin: 20px 0 0 0; }
#tier1 h2 { font-size: 22px; font-weight: 400; padding: 0; margin: 0 0 25px 0; }
#tier1 h3 { font-size: 19px; font-weight: 400; padding: 0; margin: 0 0 50px 0; }
a:link.outlinebtn, a:visited.outlinebtn, a:active.outlinebtn { font-size: 18px; padding: 6px 15px;}
}

@media (max-width: 568px) {
html, body { font-size: 15px; line-height: 1.5em;}
.inside {  width: 90%; padding: 30px 5%; }
#stier .inside {  width: 90%; padding: 0 5%; }
.inside h3 { font-size: 22px; margin: 0 0 15px 0;}
.small { font-size: 12px; }
#headertext { width: 100%; }
#headerimage { width: 70%; clear: both; margin: 30px 15% 0 15%; }
#headerimage img { width: 80%; margin: 0 autp; }
#tier1 h1 { font-size: 36px; line-height: 46px; font-weight: 700; padding: 0; margin: 10px 0 0 0; }
#tier1 h2 { font-size: 18px; font-weight: 400; padding: 0; margin: 0 0 25px 0; }
#tier1 h3 { font-size: 19px; font-weight: 400; padding: 0; margin: 0 0 50px 0; }

#tier2 p { width: 90%; padding: 0 5%; margin: 0 auto; }
#tier2 img { margin: 10px 0 0 0; }
#tier2 #tabs a:link span.tab, #tier2 #tabs a:active span.tab, #tier2 #tabs a:visited span.tab { padding: 15px 15px; margin: 0 2px; border: 1px solid #cccccc; }
#tier2 #tabs a:hover span.tab { border: 1px solid #ff2d2a; }
#tier2 #tabs a.selected span.tab { border: 1px solid #ff2d2a; }

#scrollholder { width: 500%; }
#scrollholder .col { width: 16.5%; padding: 0; }
#tier3 img { width: 80%; margin: 0 auto; }
#tier3 h3 { padding: 0 0 15px 0; }

a:link.outlinebtn, a:visited.outlinebtn, a:active.outlinebtn { font-size: 18px; padding: 6px 15px;}

.col { width: 100%; }
.circle { margin: 5px auto; }

.circleone, .circletwo, .circlethree { color: #ffffff; width: 270px; height: 270px; border-radius: 50%; padding: 6%; margin: 0 auto; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin-bottom: 15px; margin-top: 15px;}
.circleone {background: #ff2d2a;}
.circletwo {background: #3289de; }
.circlethree {background: #539e2b;}
.circleone .circle, .circletwo .circle, .circlethree .circle { font-size: 30px; font-weight: 700; }

.twitter { width: 270px; height: 270px; border-radius: 50%;  padding: 10% 7% 0 7%; margin: 0 auto; }
.twitter h3 { margin: 0;  padding: 0 0 10px 0; line-height: 1.4em;}
.twitter img { width: 60px; }
}

@media print {
/* your print styles go here */

}