html,body{height:100%}
body{background:#000000;font: normal 62.5% Arial, sans-serif}
h1{font-size:4em}
a{color:#999;font-weight:bold;text-decoration:none}
p,li{font-size:1.1em}
li li{font-size:1em}
input,select,textarea,option,button{font:normal 1em Arial, sans-serif;color:#777}

#tt{height:100%;min-height:100%;position:relative}
#header{position:absolute;height:125px;width:100%;left:0;top:0}
	#logoTT{width:450px;height:50px;position:absolute;bottom:15px;left:35px}
	#logoTT span{background:url(../images/logoTT.png) no-repeat}
	
	#menu{text-align:center;padding:1em 0}
		#menu li{display:inline;margin-right:2em}
		#menu li a:hover{color:#f93}
		#menu li a.here{color:#f93}
	#header h1 {
        font-family: "freight-sans-pro",sans-serif;
    font-size:32px;
    font-weight:300;
        margin-top: 50px;
        margin-left: 27px;
    color:#f93;
    }
	#header .timeScroll{position:absolute;bottom:35px;right:35px; height: 85px; width: 422px;}
	#header .timeScroll span{display:block; font-size:1.1em;font-weight:bold;color:#BFBFBF}

	#header *
	{
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}
	
	
	#header .timeTB {
		border: 1px solid #999; 
		position: absolute; 
		width: 400px; 
		height: 60px; 
		bottom: 0;
		text-align: center;
		padding: 0 10px;
		
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}
	
	#header .timeTB .start{ float: left; margin: -20px 0 0 -10px;}
	#header .timeTB .end{ float: right; margin: -20px -10px 0 0;}
	#header .timeTB .mid{ margin-top: -20px;}
	
	
	#header .scrollBar {position: absolute; bottom: -13px; width:400px; z-index:1;}
	#header .scrollBar a{cursor:pointer;width:74px;height:24px;background:url( ../images/navigator.png) no-repeat;display:block}
	#header .scrollBar a span 
	{
		line-height: 24px;
		font-size: 1em;
	}
	
        .scrollBar .scrollThumbs{position:absolute;bottom:30px;left:0;}
	
#main{position:absolute;width:100%;top:125px;bottom:100px;left:0;overflow-x:hidden}
	
	#timeline{position:absolute;left:0;top:0;height:100%;width:100%;background:#4a4a4a}

		#timeline .metrics{position:absolute;left:0;top:0;width:7275px;height:100%;background:url( ../images/rulerMid.png) -125px 0}
		#timeline .metrics .ruler {position:absolute;height:10px;width:100%;overflow:hidden}
		#timeline .metrics .upper{top:0;left:0;border-top:1px solid #999;background:url( ../images/rulerUpper.png) repeat-x -125px 0}
		#timeline .metrics .lower{bottom:30px;left:0;border-bottom:1px solid #999;background:url( ../images/rulerLower.png) repeat-x -125px 0}
		#timeline .metrics .years{position:absolute;bottom:0;left:0;height:30px;width:100%;background:#000000}
		#timeline .metrics .years li{float:left;width:250px;font-weight:bold;font-size:10px;text-align:center;padding:0.3em 0 0 0;color:#ff9933;text-indent:0.5em}
		
		#ages{position:absolute;left:0;bottom:40px;width:100%;height:60px;margin:0 125px;font-weight:bold;font-size:1.1em;color:#1d1d1d;z-index:1;text-align:center;white-space:nowrap}
			/*#ages .age{display:block;position:absolute;height:24px;background:url( ../images/periodLeft.png) no-repeat left top;margin-top:3px;top:50%;}
			#ages .age span{display:block;line-height:24px;margin-left:12px;padding-right:12px;background: #777777 url( ../images/periodRight.png) no-repeat right top}
			#ages .above{top:0}*/
      #ages .age{display:block;position:absolute;height:17px;background: #777777;margin-top:3px;top:50%; padding-top: 5px;}
			/*#ages .age span{display:inline-block;line-height:24px;padding-right:12px;}*/
			#ages .above{top:0}
	
		#events {background:transparent;margin:0 125px;position:absolute;top:10px;bottom:100px;left:0;width:100%;}
		#events .thumb_hidden{ position: absolute;}
    #events .event{
		position:absolute;
		margin-left:-58px;
		z-index:1;
		padding:5px; 
		width: 240px; 
		min-height:50px; 
		}
		#events .event .image{float:left;margin-right:-55px; position: absolute;}
                #events .event .image img{position: absolute; z-index: -100;}
		#events .event .desc{margin-left:55px;display:block}
		#events .event .desc .period{font-size:11px;font-weight:bold;color:#ccc;display:block;width:150px;}
		#events .event .desc .title{font-size:14px;line-height:18pxfont-weight:bold;color:#f93;display:block}
		#events .event .desc .edit{font-size:10px;text-transform:uppercase;display:inline-block}
		#events .event .desc .edit a{color:#c00}
		
		#events .event:hover, #events .event.hover{z-index:2}
    #events .event.no-thumb{ background: none; border: none; color:white; }
    #events .event.no-thumb .title{ color:#bfbfbf; }
	#events .event.no-thumb .period{ color:#929292; }
    #events .event.thumb{ 
	border: #ff9933 1px solid;
	background-color: #212121;
	}
	
	#highlights
	{
		position: absolute;
		width: 100%;
		height: 30px;
		top: 1px;
		left: 0;
		z-index: 2;
		margin: 0 125px;
	}
	
	#highlights .ph
	{
		top: 0 !important;
		position: absolute;
	}
	
	#highlights .content
	{
		position: relative;
		height: auto;
		display: none;
		overflow: hidden;
		width: 500px;
		padding: 20px 20px 40px;
		background-color: white;
		-webkit-border-bottom-right-radius: 4px;
		-moz-border-radius-bottomright: 4px;
		border-bottom-right-radius: 4px;
	}
	
	#highlights .content h2
	{
		color: #FF9933;
		font-family: "freight-sans-pro",sans-serif;
		font-weight: normal;
		font-size: 22px;
		margin-bottom: 10px;
	}
	
	#highlights .content p
	{
		color: #888;
		line-height: 18px;
		font-size: 12px;
	}
	
	#highlights .content h2 span
	{
		float: right;
	}
	
	#highlights .tab
	{
		float: left;
		background-color: white;
		cursor: pointer;
		
		-webkit-border-bottom-right-radius: 4px;
		-webkit-border-bottom-left-radius: 4px;
		-moz-border-radius-bottomright: 4px;
		-moz-border-radius-bottomleft: 4px;
		border-bottom-right-radius: 4px;
		border-bottom-left-radius: 4px;
	}
	
	#highlights .tab h2
	{
		font-size: 12px;
		font-weight: bold;
		color: black;
		padding: 0 36px 0 10px;
		margin-right: 10px;
		
		line-height: 28px;
		
		white-space: nowrap;
		
		background: url(../images/expand.png) right center no-repeat;
	}
	
	#highlights .tab.expanded h2
	{
		background-image:url(../images/collapse.png);
	}
	
	#main .timeArrows a{display:block;position:absolute;width:35px;height:58px;z-index:666;cursor:pointer;font-size:3em;margin-top:-45px}
	#main .timeArrows .left{left:10px;top:50%}
	#main .timeArrows .right{right:10px;top:50%}
	#main .timeArrows .left span{background:url( ../images/arrowLeft.png) no-repeat}
	#main .timeArrows .right span{background:url( ../images/arrowRight.png) no-repeat}

#footer{position:absolute;height:100px;bottom:0;left:0;width:100%}
	#administrate{position:absolute;top:20px;left:50px}
	#logoCS{margin:0}
	#logoCS a{width:150px;height:80px;position:absolute;top:0;right:35px}
	#logoCS a span{background:url( ../images/logoCS.png) no-repeat}


.drawn{display:block;overflow:hidden;position:relative}
.drawn span{display:block;position:absolute;top:0;left:0;width:100%;height:100%}

.jqmInner{color:#666;padding:1em 10px}
.jqmInner:after{content:'.';display:block;clear:both;height:0;visibility:hidden}
.eventInfo .image{float:left;padding:0.25em 1.5em 0.5em 0}
.eventInfo .period{font-size:1.2em;font-weight:bold;color:#f93;display:block}
.eventInfo .title{font-size:1.6em;font-weight:bold;color:#666;display:block}
.eventInfo p{font-size:1.2em;line-height:1.4em;margin-top:1em}

* html #main{height:expression(parentNode.offsetHeight-225+'px')}
* html #events{height:expression(parentNode.offsetHeight-50+'px')}
* html #events .event{behavior:url(js/ie6Hover.htc); }
* html #timeline .metrics{padding-bottom:1px}

/*	jqModal		*/
.jqmWindow {display:none;position:fixed;top:17%;left:50%;margin-left:-300px;width:600px}
.jqmOverlay {background-color: #000}
.jqmX{display:block;height:30px;width:30px;position:absolute;right:-15px;top:-13px;text-align:center;cursor:pointer}
.jqmX span{background:url( ../images/popupClose.png) no-repeat}

* iframe.jqm {position:absolute;top:0;left:0;z-index:-1;width:expression(this.parentNode.offsetWidth+'px');height:expression(this.parentNode.offsetHeight+'px')}
* html .jqmWindow {position: absolute;top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px')}
* html .jqmClose span{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' ../images/popupClose.png', sizingMethod='crop')}

.jqmWindow h2{font-size:2.2em;font-weight:normal;color:#f93}

.jqmDark
{
	top: 30%;
	width: 500px;
	margin-left: -250px;
}

.jqmDark h2
{ 
	font-size: 3em; 
	font-family: "freight-sans-pro",sans-serif;
    text-align: center;
	margin-bottom: 15px;
}

.jqmDark p
{
	font-size: 1.6em;
    font-family: "freight-sans-pro",sans-serif;
    font-weight: 400;
    text-align: center;
	color: #fff;
}

.jqmDark div.controls
{
	display: block;
	margin-top: 24px;
	text-align: center;
	overflow: hidden;
	
}

.jqmDark div.controls button
{
	font-family: "freight-sans-pro",sans-serif;
    text-align: center;
	font-size: 1.5em;
	color: #ffffff;
	cursor: pointer;
}

.jqmDark div.controls span.field
{
	margin: auto;
	display: block;
	width: 118px;
}



#eventAdd,#eventEdit{width:500px;margin-left:-250px}
.eventAdd,.eventEdit{padding:1em 25px}
/*	/jqModal	*/

/*	roundedBox	*/
.roundedBox{position:relative;margin:11px}
.roundedBox .c{height:11px;width:100%;position:absolute;background:#fff}

.jqmDark .roundedBox .c{ height:9px; background:#000}

.roundedBox .c div{position:absolute;width:11px;height:11px}
.roundedBox .b{bottom:-11px;left:0}
.roundedBox .t{top:-11px;left:0}

.jqmDark .roundedBox .t{ border-top: 2px solid white;}
.jqmDark .roundedBox .b{ border-bottom: 2px solid white;}

.roundedBox .c .l{left:-11px;top:0}
.roundedBox .c .r{right:-11px;top:0}
.roundedBox .boxContent{padding: 0 -11px;margin:0 -11px;background:#fff;overflow:hidden}

.jqmDark .roundedBox .boxContent{padding: 11px 24px;margin:0 -11px;background:#000;overflow:hidden; border: 2px solid white; border-width: 0 2px;}

.jqmDark .roundedBox .t .r, .jqmDark .roundedBox .t .l
{
	top: -2px;
}


.roundedBox .t .r{background:url( ../images/popupCrnTR.png) no-repeat}
.roundedBox .t .l{background:url( ../images/popupCrnTL.png) no-repeat}
.roundedBox .b .r{background:url( ../images/popupCrnBR.png) no-repeat}
.roundedBox .b .l{background:url( ../images/popupCrnBL.png) no-repeat}

.jqmDark .roundedBox .t .r{background:url( ../images/popupCrnTR-d.png) no-repeat}
.jqmDark .roundedBox .t .l{background:url( ../images/popupCrnTL-d.png) no-repeat}
.jqmDark .roundedBox .b .r{background:url( ../images/popupCrnBR-d.png) no-repeat}
.jqmDark .roundedBox .b .l{background:url( ../images/popupCrnBL-d.png) no-repeat}



* html .roundedBox .boxContent{position:relative;display:inline-block}
* html .roundedBox{position:relative;display:inline-block}

* html .roundedBox .t .r{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' ../images/popupCrnTR.png', sizingMethod='crop')}
* html .roundedBox .t .l{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' ../images/popupCrnTL.png', sizingMethod='crop')}
* html .roundedBox .b .r{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' ../images/popupCrnBR.png', sizingMethod='crop')}
* html .roundedBox .b .l{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' ../images/popupCrnBL.png', sizingMethod='crop')}
/*	/roundedBox	*/

/*	buttons		*/
.button{background-color:#f93;line-height:30px;color:#fff;text-transform:uppercase;float:left;margin-right:15px}
.button a{background-color:#f93;}
.button button{background-color:#f93;line-height:30px;color:#fff;font-weight:normal;padding:0 2em;display:block;margin-right:3px}
.button button:hover{background-color:#666;}
.button button{height:30px;border:none;font-weight:bold;overflow:visible;width:auto}
.jqmWindow .button{text-transform:none;font-size:1.1em}

* html .button button{width:0}
* html .button a{display:inline-block}
*+html .button a{display:inline-block}

.button.submit{background-color:#f93;}
.button.submit:hover{background-color:#666;}
/*.button.submit a,.button.submit button{background-color:#666;}*/

.button.browse{background: url( ../images/buttonBrowseR.png) no-repeat right top;}
.button.browse a,.button.browse button{background:url( ../images/buttonBrowseL.png) no-repeat;color:#999}
/*	/butons		*/

/*	form	 	*/
.fields{padding:1em 0}
.field:after{content:'.';display:block;clear:both;height:0;visibility:hidden}

.fieldRow{position:relative}
.fieldRow label, .fieldRow .label{display:block;width:100px;margin-right:-100px;float:left;padding:10px 0}
.fieldRow .field{display:block;margin:-3px 0 0 100px;padding-bottom:10px;position:relative}
.fields .text .field,
.fields .radioBox .field{background:url( ../images/inputBgT.png) no-repeat left top}
.fields .text .input,
.fields .radioBox .input{display:block;float:left;width:300px;padding:7px 10px 10px 10px;background:url( ../images/inputBgB.png) no-repeat left bottom;margin:3px 0 0 0}
.fields .after,.fields .after .input{background:none !important}

.fields .text input,
.fields .text textarea{border:0;padding:0;width:300px;line-height:normal}

.fields .radioBox .radio{}

.fields .field .radio label{margin:0 1em 0 0;padding:0;float:none;display:inline;width:auto}
.fields .field .radio input{vertical-align:middle;width:auto !important;margin:auto !important}

.fields .text.shorter .field{background:url( ../images/inputBgTShorter.png) no-repeat left top}
.fields .text.shorter .input{width:200px;margin-right:10px;background:url( ../images/inputBgBShorter.png) no-repeat left bottom}
.fields .text.shorter input,
.fields .text.shorter textarea{width:200px;margin-right:-10px}

.fields .file .button{margin:0 0 0 0}
.fields .file .button a, .fields .file .button button{padding:0;width:85px}

* html .fields .file .button{background-position:85px top}
*+html .fields .file .button{background-position:85px top}

.fields .file .fakeInput{min-height:1.1em;width:200px;display:block;overflow-x:hidden;float:left;margin-right:-1em}
.fields .file .image{width:auto;margin-right:1em}

.fields .buttons{margin-right:-15px}

.fieldRow label.error { color: red; padding-left: .5em; vertical-align: top; width: 400px; border-bottom-color: #777777;}
.fieldRow table {  font-size: 12px; line-height: normal;margin-left:95px; }
.fieldRow table td, .fieldRow table th { padding: 3px;}
.thumb{ /*display: none;*/ float: left; cursor: pointer; position: absolute; z-index:110;}
.thumb_hidden{ display: none; float: left; cursor: pointer; position: absolute; z-index:110;}
* html .fields{zoom:1}
* html .fieldRow{zoom:1}
* html .field{zoom:1}
* html .fields .file .fakeInput{height:1.1em}

*+html .fields{zoom:1}
*+html .fieldRow{zoom:1}
*+html .field{zoom:1}
/*	/form 		*/
#periodIs_under, #periodIs_under_1 {
    border: 0;
    float: none;
    display: inline;
}
ul.radio_list li label, ul.radio_list li input{
    float: none !important;
    display: inline-block !important;
		width: auto !important;
}
/*	ruber modals	
.jqmWindow{height:66%}
.jqmWindow .roundedBox{height:100%;margin:0 11px}
.jqmWindow .roundedBox .boxContent{height:100%;width:100%}
.jqmWindow .jqmInner{position:absolute;top:10px;left:13px;bottom:10px;right:10px;padding:0;overflow:auto;overflow-x:hidden;padding-right:17px}
* html .jqmWindow .jqmInner{height:expression(this.parentNode.offsetHeight - 20 + 'px');width:expression(this.parentNode.offsetWidth - 60 + 'px');left:24px}
	/ruber modals	*/