@font-face {
    font-family: 'ArmataRegular';
    src: url('../fonts/Armata-Regular-webfont.eot');
    src: url('../fonts/Armata-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Armata-Regular-webfont.woff') format('woff'),
         url('../fonts/Armata-Regular-webfont.ttf') format('truetype'),
         url('../fonts/Armata-Regular-webfont.svg#ArmataRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuliLight';
    src: url('../fonts/Muli-Light-webfont.eot');
    src: url('../fonts/Muli-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Muli-Light-webfont.woff') format('woff'),
         url('../fonts/Muli-Light-webfont.ttf') format('truetype'),
         url('../fonts/Muli-Light-webfont.svg#MuliLight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MonospaceTypewriterRegular';
    src: url('../fonts/MonospaceTypewriter-webfont.eot');
    src: url('../fonts/MonospaceTypewriter-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MonospaceTypewriter-webfont.woff') format('woff'),
         url('../fonts/MonospaceTypewriter-webfont.ttf') format('truetype'),
         url('../fonts/MonospaceTypewriter-webfont.svg#MonospaceTypewriterRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

.keyout { padding: 2px; border: 1px solid #CCC; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;  }

h4{margin:0; padding:0;}
ul {list-style-type: none;padding: 0px; margin: 0px;}

body {
    font-family:ArmataRegular;
    height:600px;
    width:800px;
    background-color:#111;
    color:#fff;
    font-weight: bold;
    margin-left:auto;
    margin-right:auto;
}

body.studio{height:600px; width:800px; overflow: hidden;}

#banner {
    background-color:#efefef;
    color:#333;
    height:38px;
    border-bottom:1px solid #999;
    overflow:hidden;
}

#banner h1 {
    margin:0;
    padding:0;
    font-size:24px;
    line-height:38px;
    width:90px;
    float:left;
    padding-left:5px;
    font-weight:normal;
}

#banner li {
    width:175px;
    padding-left:10px;
    height:50px;
    float:left;
    color:#333;
    list-style:none;
    border-left:1px solid #999;
}

#banner h2 {
    font-size:16px;
    line-height:22px;
    margin:0;
    font-weight:bold;
}

li#ind_sec{width:120px;}

#banner #gop_sec h2 {color:#be0f00}
#banner #gop_sec h2 span.total{background-color:#be0f00; color:#fff; padding:1px 4px 0 3px;}
#banner #dem_sec h2 {color:#4eaed7}
#banner #dem_sec h2 span.total{background-color:#229acd; color:#fff; padding:1px 4px 0 3px;}
#banner #ind_sec h2 {color:#579233}
#banner #ind_sec h2 span.total{background-color:#579233; color:#fff; padding:1px 4px 0 3px;}
#banner #nc_sec h2 {color:#666}
#banner #nc_sec h2 span.total{background-color:#bbb; color:#333; padding:1px 4px 0 3px;}
#banner li p {font-size:11px; color:#666; margin-top:-3px;}
#banner li p span.need_num {color:#333;}

.district {
    line-height:20px;
    float:left;
    display:block;
    font-weight:700;
    font-family: 'Inconsolata', sans-serif;
}
.column {
    width:400px;float:left;
}
.timezone {
    float:left;
}

.timezone li {
    display:block;
    float:left;
}
.timezone ul {
    clear:left;
    padding:0;
    margin:0;
    display:block;
    float:left;
}
.timezone ul:nth-child(odd){
	background-color:#333;
}
.poll-closing-time{
    position:relative;
}
.poll-closing-time-label {
    color:#333;
    background-color:#ccc;
    font-weight:bold;
    text-align:center;
    margin:0;
    padding:0;
    width:400px;
}
.candidate {
    overflow:hidden;
    white-space:nowrap;
}
.candidate.dem {
    color:#a7d7eb;
}
.candidate.gop {
    color:#f8a199;
}
.candidate.alt {
    color:#85c65e;
}


.candidate.alt.winner{
	background-color:#579233;
	color:#fff;
}

.candidate.incumbent {
    text-transform:uppercase;
}

.candidate.gop.winner {
    background-color:#BE0F00;
    color:white;
}
.candidate.dem.winner {
    background-color:#1B7BA4;
    color:white;
}
.candidate.other.winner {
    background-color:#148B34;
    color:white;
}
li.status{
    overflow: hidden; white-space: nowrap; text-align:right;
}


/* DESKTOP ADDITION */


.module-body{
		width:780px;
		font-family: Arial,Helvetica,sans-serif;
		font-size:13px;
		font-weight: normal;
		color:#333;
		padding:10px;
		display:block;
		clear:both;
		background-color: #fff;
		/*border-top:10px #111 solid;*/
	}
	   	
	   	a#npr-logo {
	   		background:url('../img/npr_55x38.jpg') no-repeat right top;
		    display:block;
		    height:18px;
		    text-indent:-999px;
		    width:55px;
		}
	   	
	   	.module-body .header {background-color:#3333; height:50px;}
	   	
	   	.module-body .desc {border-bottom:1px #999 solid;}
	   	
		.module-body .desc h1 {
			font-family: Georgia, serif;
			font-size: 2em;
		}
		
		
		
		.module-body .key h1 {
			font-family: Georgia, serif;
			font-size:20px;
			font-weight: normal;
		}
		
		.module-body p{
			margin-bottom:10px;
			line-height:16px;
		}
		
		.module-body p.boardType{
			margin-bottom:20px;
		}
		
		.module-body ul{
			margin-bottom:10px;
		}
		
		.module-body ul li{
			line-height:16px;
			padding-bottom: 5px;
			color:#666;
		}
		
		.module-body ul li.list-header, .examples h4  {font: bold 1em Arial, Helvetica, sans-serif; text-transform: uppercase; color:#333;}
		
		li strong{font-weight: bold; color:#333}
		
		h1 a {color:#666; font-weight:normal;font-size: 11px; font-family: Arial, Helvetica, sans-serif;}
		h1 a:hover {color:#666;}
		
		ul.rows-general{
			float:left;	width:345px; border-right: 1px #999 solid; padding-right:15px;
		}
		
		ul.more-markers{position: relative;float:left; width:345px; padding-left:15px;}
		
		.examples {display:block;clear:both;}
		
		.examples p {margin-top:5px;}
		
		.example2, .example3 {border-top:1px dotted #999; padding-top:11px;}
		
		.cntrl{float:right;font-size: 11px; color:#999;}
	
		.credit{color:#999; font-size: 11px; font-style: italic; margin-top:20px; }
	
		
		p.tweetmsg {width:780px; background:#efefef; margin-top: 10px; clear: both; font: bold 18px Arial, Helvetica, sans-serif; color:#333;padding:10px;}