/* Author: BrackWho */

/* 1920 Width for Desktops */
/* ---GENERAL------------------------------------------------*/

body {width:100%;margin:0 auto;text-align:center;font-family:'Open Sans', sans-serif;scroll-behavior:smooth;overflow-x:hidden}
.width {max-width:90%;margin:0 auto;position:relative}

/*-- HEADER STUFF --*/
#header 	{width:100%;height:70px;background:#e96428;position:fixed;top:0;border-bottom:10px solid #981f22;z-index:111}
#logo		{position:absolute;left:-15px;top:-25px;border:0}
#logo img	{width:90%;max-width:200px;height:auto !important}
#menu	{display:block;background:url(icon-menu.png) no-repeat;position:relative;top:15px;float:right;width:120px;height:40px;z-index:444}
#date	{float:left;color:white;margin:33px 0 0 44px;font:lighter .7em/1 "Open Sans",sans-serif;z-index:444}
#fade	{background:#e96428;opacity:.8;position:fixed;top:0;width:100%;height:100%;z-index:333;display:none}

#nav 			{display:none;width:100%;height:auto;position:fixed;top:0;left:0;z-index:444}
#nav ul			{list-style:none;padding:0}
#nav ul li		{text-align:left;cursor:pointer;letter-spacing:-1px;color:#fff;padding:calc(5px - -1%) 0;font:normal bold 1.2em/.8 'Open Sans', sans-serif;width:300px}
#nav ul li:hover{color:black}
.reveal			{position:fixed;left:-50%;top:0;display:none;width:100%;height:100%;background:#981f22}
#nav label		{float:left;margin:15px 0 15px 20px;text-align:left;width:100%;font:bolder normal 1.2em/.8 "Open Sans", sans-serif;color:white}
#nav ul ul		{list-style:circle inside none}
#nav ul ul li	{padding:calc(5px - -1%) 0 calc(5px - -1%) 20px;font:normal lighter 1em/1 'Open Sans', sans-serif}
#nav ul ul li a:link, #nav ul ul li a:visited {color:white;padding:0 0 0 10px;text-decoration:none}
#nav ul ul li a:hover {color:black}

#nav ul li img	{width:30px;height:30px;margin:0 9px -7px}
#close	{color:red !important}
	
#newsletter {position:relative;top:0;left:10px;height:30px}
input#newsletterinput {margin:4px 0 0 0;border:none;width:140px;height:21px;background:#fff;font-family:sans-serif;font-size:small;color:#10334C;padding:5px 10px;float:left;-webkit-appearance:none;border-radius:0}
input#newsletterbutton {margin:4px 0 0 0;border:none;border-left:1px solid #c2c2c2;width:31px;height:31px;font-size:12px;background:#f4f4f4;color:#10334C;padding:5px 0;float:left;font-weight:bold}
input#newsletterbutton:hover{background:#C51732;color:#ffffff}

/* ---SLIDESHOW--- */
#slideshow {width:90%;height:auto;margin:120px auto 40px;position:relative;overflow:hidden}
#slideshow #slidesContainer {margin:0 auto;width:100%;height:auto;overflow:hidden;position:relative}
#slideshow #slidesContainer .slide {margin:0 auto;width:100%;height:auto;z-index:1;position:relative;border:0}
#slideshow #slidesContainer .slide img {width:100% !important;height:auto !important}
.control {width:75px;height:95%;text-indent:-10000px;position:absolute;cursor:pointer;z-index:2;-webkit-transition:all 0.6s;-moz-transition:all 0.6s;-ms-transition:all 0.6s;-o-transition:all 0.6s;transition: all 0.6s}
#leftControl {top:-500px;left:4%;background:transparent url(slideshow/control_left.png) no-repeat 0 50%}
#leftControl:hover {left:5%}
#rightControl {top:-500px;right:4%;background:transparent url(slideshow/control_right.png) no-repeat 0 50%}
#rightControl:hover{right:5%}

/* --- COUNTDOWN ---*/
#countdown 	{font-size:small}
#introtext 	{padding:3px;margin:6px 0 75px;color:#11334C}
.boxes	{display:inline;padding:0 1px}
.numbers{}

/* --- FONTS ---*/
h1,h2,h3,h4,h5,h6 {font-family:'Open Sans', sans-serif;text-align:left}
h1 	{font:italic bold 3em/5 "Open Sans", Impact, Arial Black;text-shadow:-2px 0 orange, 0 2px orange, 2px 0 orange, 0 -2px orange, 4px 5px 0 red;color:#1e90ff;max-width:70%;text-decoration:none}
h1 a:hover	{color:blue}
h2,h2 a:link,h2 a:visited,h2 a:active	{color:#303030;font-size:xx-large;text-transform:uppercase;letter-spacing:-3px;text-decoration:none}
h2 a:hover {color:orange}
h3	{color:orange;font-size:x-large}
h4 	{color:orange;font-size:large;text-align:center}

table	{font-size:medium;width:80%}
table.age {text-align:center;max-width:500px;margin:20px auto;display:inline-table}
table.age td {background:#e96428;color:white;font:normal medium/1 "Open Sans", sans-serif;padding:5px}
table.age td.head {background:brown;font:bold 1.5em/1em "Opens Sans", sans-serif;letter-spacing:-1px;padding:15px}

/* -- BLOG --*/
#blogsocial {float:right;margin:0 0 0 20px}
p.date, table.date{border-left:4px solid lightblue;padding:0 0 0 10px}
#blogarchive {text-align:left;font-size:x-small;white-space:nowrap;line-height:2em}
#blogarchive h1 {font-size:2em}
#blogarchive a:link, #blogarchive a:visited, #blogarchive a:active {color:orange}
#blogarchive a:hover{color:#120e23}

.previewimage {width:300px;height:200px;overflow:hidden;margin:10px 20px 0 0}
.post h4 {font-weight:normal;color:#120e23;text-transform:uppercase;font-size:x-large}
.post a:link, .post a:visited, .post a:active	{color:orange;text-decoration:none}
.post a:hover{color:#120e23}

ul.nostyling {list-style:none;padding:0}
ul.nostyling li, ol.nostyling li, ul.styling li, ol.styling li {font:normal large/1;margin:20px 20px 0 0;text-align:left;padding:20px 0 0 40px;width:70%}
ul.smallest {list-style:none}
ul.smallest li, p.smallest{font-size:x-small;line-height:10px;margin:0 0 10px}

/* --- SPONSORS --- */
#sponsorswrap	{width:100%;padding:30px 0 60px;margin:20px auto;background:lightgray}
#sponsorswrap div	{width:29%;display:inline}
#sponsorswrap div img {padding:30px;background:white}
#sponsorswrap a	{text-decoration:none}
#sponsorswrap a img	{display:inline;background:white;margin:10px;padding:15px}

/* --- CONTENT --- */
.content	{width:100%;margin:0;padding:30px 0}
.content a:link, .content a:visited, .content a:active	{color:orange;text-decoration:none}
.content a:hover{color:#120e23}
.contentb	{background:#120e23;color:white}
.contento,.contento h2	{background:#e96428;color:white}
#boxin a img {height:auto !important}

/* THIRD PARTY --*/	
#boxfb 	{max-width:339px !important;height:475px !important;overflow:hidden;margin:0 auto 20px;position:relative;top:20px}
#boxtw	{width:100% !important;height:500px !important;overflow:hidden;margin:0 auto 20px;position:relative;top:20px}
#twitter-widget-0	{width:100% !important;height:500px!important}
#boxin	{width:100%;height:25%;overflow:hidden;margin:0 auto 25%;position:relative;top:20px}
#boxin a img {background:white;padding:2%;width:28%}
.fb_iframe_widget,.fb_iframe_widget span,.fb_iframe_widget span iframe[style] {min-width:100% !important;width:100% !important;margin:0;background:white}
iframe {background:white}

.videowrapper {position:relative;left:0;padding-bottom:56.25%;transition:all 200ms ease-out;cursor:pointer}
.videowrapper .youtube, .videowrapper iframe, .videowrapper img {position:absolute;top:0;left:0;width:100%;height:100%}
.videowrapper .play {background-size:64px 64px;position:absolute;top:0;left:0;height:100%;width:100%;opacity:.8;filter:alpha(opacity=80);transition:all 0.2s ease-out;background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAERklEQVR4nOWbTWhcVRTHb1IJVoxGtNCNdal2JYJReC6GWuO83PM/59yUS3FRFARdFlwYP1CfiojQWt36sRCUurRIdVFXIn41lAoVdRGrG1M01YpKrWjiYmaSl8ybZJL3cd+YA//NLObd3++eO8x79z5jSq5Gw+8kov0AP8vMR5l1BtBZQM4B8ks75wCdZdYZZj5qLZ4hov2Nht9Z9vhKKSIaB/gI4M4w62KeAO6Mte4lYOq20FxrlqqOibhHmeWbvNC9ZfDX1mLae391aN6limO/gwgvAPJbWeAZuSDingdwXTBw7/0IsyaA/Fkh+KqOkD+YNfHej1QKD+y7iVlOhgLvFqFfNJvNGyuBJ+KDAF8MDd0tgS8y64OlgSdJMsysL4cG7SOHkyQZLhTee7+d2R2rAVy/S+Jd7/32ouBHAP4gNNRGQyTHc/84NhqNywZp5rvjjnnvt21aABFeCQ+RLwAf2hQ8s7sv9OCLk6AHNgQvIrvbfzKCD76g/O6cu7lf/iER/aQGgy448pExZmhdegAPhR9sObFWH1gT3lp7DaA/5bkIgJhZPgsNmz02novj+KqeApj1ubwXWe4kdyeznAgNvTpE/HQmvKqOMeuFogTUVQSRno+iaLRLAJF7uIgL9O4ubgL8aWgB7S44mNX+35YpICUiAvS9sBLkq1WzT+NFffl6AuoiApi6NT37h6sWkBIRZGkQ8YtLgyji6e1mBYTqCEBPG2Naz+0BWQgtoGoRgCzEsd9hAN1X5BfnFZASUfrSAFQNsyZ1FJASUVpHiLinDJG8U2cBZYogkrcNs5waBAGdstbeU9zdqpw0gPwwSAI6VUxHyFlDpOcHUUBBIuYNs14aZAE5RVwyzPr3/0EAEY0TyfGNjBWQvwZ +CTSbehfAH29mrID8bET0+0EUkAd8WYDOmqJ3ecsG30yr9wqRfm6Y+a1BEFDEjHfHvWmY9ck6CygHvBVr8Xhtb4ZE5HZA3y8DvBNA1TjnrmXWf+sioMwZX5V/VHXMGGMMoKdDCxCRvRWBdzKzdHEO+EisilbPyopHYqp6S9UCAsz4iojI7hUDAtyXVQgIDd6KnOoaWNkbI6FaPSuZGyMArsi7MZoloB4zviI/Nhr3X95jltwTRQmoIfgisy5ai+me67OI7fE4nrqjrqfK1t0eby0FPRB6oGVlchL3rgnfrq19RKbVBdhV9IOSwJmfmJi4vi/4ThERitwyCxVAFqydshuCX5awhQ9KtmuIWd8IDZED/nXT77rvVVv6sHRKwjYi91poqP7Dr+Y6JJ1VSZIMA3wkPNy6bX+o8Bcm0sXMdwM8Fxo0A3xORPaWBp6uPXsmbxCRD0NDL0dOANhVCXy6iAjMcjbcrMt3RITKwdMVRdFo+y5yvkL4eWZ+zHt/ZVD4dEVRNGotpst+dZZZH8k86lqn2pIvT/eqrNfn2xuyqYPZ8mv7s8pfn/8Pybm4TIjanscAAAAASUVORK5CYII=") no-repeat center center}
.videowrapper .play:hover {opacity:1;filter:alpha(opacity=100)}

p	{line-height:2em;text-align:justify;margin:20px auto 60px;font-size:.9em}
p span .captionl {text-align:center}
	
.captionl, .captionr {line-height:1.6em;margin:10px auto;text-align:center;color:gray;font-size:small;width:100%}
.captionl a img, .captionr a img {width:100% !important;height:auto !important;margin:0 0 20px}
.scaptionl, .scaptionr {line-height:1.6em;margin:10px auto;text-align:center;color:gray;font-size:small;width:100%}
.scaptionl a img, .scaptionr a img {width:80% !important;height:auto !important;margin:0 0 20px}
.scaptionl {float:left;margin:10px 60px 0 0;width:200px!important}
.scaptionr {float:right;margin:10px 0 0 60px;width:200px!important}

/* --- FOOTER ---*/
ul.five		{text-align:left;list-style:none;padding:0;line-height:2}
ul.five h4	{background:white;color:#120e23;font-weight:bold;padding:2px 0 0 10px;text-transform:uppercase}
ul.five li		{font-size:10px}
ul.five li a:link,ul.five li a:visited,ul.five li a:active	{color:white;font-size:12px;text-decoration:none}
ul.five li a:hover	{color:orange}
.msponsors	{width:auto !important;margin:0 20px}

.two	{margin:1% 2%;line-height:3em}
.three	{width:31%;margin:1% .8%;line-height:3em;display:initial}

/* ---STORIES ---*/
.column {width:300px;float:left;margin:25px 45px 0 0;position:relative}
.posts iframe {position:absolute;top:0;left:0;z-index:100}
.arrows {width:18px;height:18px;position:absolute;top:132px;right:17px;border:2px solid yellow;z-index:1000}
span {margin:0;padding:0}

.previewstory {padding:30px 0;font-size:smaller;text-align:left;white-space:nowrap}
.previewstory img {float:left;margin:0 20px 0 0}
.previewstory p {font-size:x-small;line-height:0}
.vi {background:url(http://www.monumentalmarathon.com/stories/video.png) no-repeat 150px 72px}

/*--MILEMARKERS--*/
.milemarkers	{padding:0;height:550px;clear:both}
.milemarkers ul 	{padding:0;margin:0}
.milemarkers label{float:left;text-align:left;width:60px;list-style-type:none;sans-serif,Arial;font-size:15px;color:#195478;line-height:19px}
.milemarkers li 	{position:relative;left:50px;list-style-type:none;font-family:sans-serif,Arial;font-size:15px;line-height:19px;text-align:left}
.mapwrap		{display:none;float:right;width:500px;height:500px;border:1px solid #4F7C97;overflow:hidden}

/* ---MISC--- */
img	{border:0}
.clear {clear:both;height:0;margin:0;padding:0}
.extramargin {margin:0 0 20px 0}
.clearmargin {clear:both;margin:60px 0}
.indent	{margin:0 0 60px 0;text-align:left;clear:both}
.fl {float:left}
.fr {float:right}
.lft {text-align:left}
.ctr {text-align:center}
.rgt {text-align:right}
.jst {text-align:justify}
.right {float:right}
.left {float:left}
.right img			{width:100% !important;height:auto !important;margin:0 auto}
.left img, .left object{width:100% !important;height:auto !important;margin:0 auto}
.simg	{width:125px;margin:0 10px 0}

p a:link,p a:visited,p a:active{color:#5981B5;font-size:inherit;text-decoration:none}
p a:hover {opacity:.8}
hr {height:1px;border-top:1px solid #4F7C97;border-right:0;border-bottom:0;border-left:0;margin:60px 0}
ol {padding:0 0 0 25px;text-align:left}
tr {border-bottom:1px solid darkblue}
.button	{display:inline-table;background:#5981B5;color:white !important;border:1px solid black;padding:30px 40px;margin:10px 10px 10px 0;font:bold x-large/1 "Open Sans", Arial Black;text-decoration:none;letter-spacing:-1px}
.button:hover {background:red;color:white;cursor:pointer}
.bi {font-weight:900;color:black}
.controlheight {height:300px;display:inline-block}
.controlheight img {width:auto !important}
/*-- CHECK THESE FOR USE --*/
.sm {width:300px}
.lg {width:600px;margin:0 60px 0 0}
.impact {font-family:Impact;font-size:27px;color:#333333}
.blue	{color:#5981B5}

#scrollup {background: url("scroll.png") no-repeat;width:60px;height:60px;position:fixed;bottom:10px;right:10px;display:none;text-indent:-9999px}

@media (min-width:400px) {
	#date	{margin:30px 0 0 280px;font:lighter 1em/1em "Open Sans",sans-serif}
	#logo img	{width:90%;max-width:280px;height:auto !important}
	.control {width:75px;height:95%;text-indent:-10000px;position:absolute;cursor:pointer;z-index:2;-webkit-transition:all 0.6s;-moz-transition:all 0.6s;-ms-transition:all 0.6s;-o-transition:all 0.6s;transition: all 0.6s}
	#leftControl {top:0;left:4%;background:transparent url(slideshow/control_left.png) no-repeat 0 50%}
	#rightControl {top:0;right:4%;background:transparent url(slideshow/control_right.png) no-repeat 0 50%}

	.indent	{margin:0 0 60px 60px;clear:both}
	
	h4	{text-align:left}
	
	.sponsors img	{width:auto;height:60px;margin:0 10px}
}

/* Mobiles in Portrait - Most Narrow */

@media (min-width:600px) {
	
	#nav {left:13%}
	.sponsors  img	{width:auto;height:40px}
	.right img,.captionr img	{width:300px !important;margin:0 0 10px 0}
	.left img,.captionl img	{width:300px !important;margin:0 20px 10px 0}

	.videowrapper {left:0;padding-bottom:0}
	.videowrapper .youtube, .videowrapper iframe, .videowrapper img {float:left;position:relative;width:300px;height:169px;margin:5px 20px 60px 0}

	#boxin a img {padding:1%;margin:0 2% 0 0}

	.previewstory {width:48%;display:inline-block}
	.captionl {float:left;margin:10px 60px 0 0;width:400px!important}
	.captionr {float:right;margin:10px 0 0 60px;width:400px!important}
	.swidth	{width:200px!important;margin:0 60px}
	
	#newsletter {height:38px}
	.two {float:left;width:45%}
	#scrollup {bottom:20px;right:20px}

	table.age td {font:normal large/1 "Open Sans", sans-serif}
	.indent	{margin:0 0 60px 60px}
	.mapwrap	{display:block;float:right;width:425px;height:500px;border:1px solid #4F7C97;overflow:hidden}
}

@media (min-width:960px) {
	h1	{max-width:70%}
	#boxfb 	{width:35%!important;height:565px !important;margin:0 30px 0 0;float:left}
	#boxtw	{width:35%!important;height:565px !important;margin:0 30px 0 0;float:left}
	#boxin	{width:23%!important;height:500px;margin:0;float:left}
	#boxin a img {margin:0 2px 4px;padding:2% 1%;width:44%}

	.sponsors  img	{width:auto;height:60px}
	
	.three	{display:inline-table}
	
	.previewstory {font-size:large}
	#sponsorswrap div	{display:inline-block}
	
	.mapwrap		{display:block}
	
	.videowrapper .youtube, .videowrapper iframe, .videowrapper img {width:500px;height:281px}
	.milemarkers label	{font-size:15px}
	.milemarkers li 	{font-size:15px}
}

@media (min-width:1160px) {
	.width		{max-width:1160px}
	p {font:1.5em/1.5 "Open Sans", sans-serif;letter-spacing:-1px}
	ol {padding:20px 0 20px 20px;width:70%}
	ul.five		{display:table-cell;padding:0 30px 0 0}
	ul.five h4	{font-size:small;font-weight:lighter;padding:2px 10px 0 10px}
}