/* *****************
/* Positioning */

body 		{ margin: 0px; padding: 0px;  }
.bg 		{ position: fixed; right: 0px; top: 0px; height: 100%; }
	@media only screen and (max-width: 1300px) { .bg { display: none; } }

h1.discreet	{ position: absolute; top: 10px; left: 20px; } 
h1.none		{ visibility: hidden; }

@media only screen and (max-width: 1000px)
{
#nav 		{  float: left; position: absolute; top: 100px; left: 25px; } 
#nav ul 	{ padding: 0px; margin-top: 5px;}
#nav ul li 	{  list-style: none; padding: 5px; }
#nav ul ul	{ position: relative; top: 0px; left: 50px; }
#nav ul ul li	{ display: inline; padding: 5px 0px 5px 0px;  margin-left: 10px;  }
#nav ul ul li.RMain { margin-left: -10px;  } 
}

@media only screen and (min-width: 1001px)
{
#nav 		{ position: absolute; top: 20px; right: 160px; width: 450px; }
#nav ul 	{ padding: 10px; margin-top: 5px; }
#nav ul li 	{ display: inline; list-style: none; padding: 5px 30px; }
#nav ul ul	{ display: none; position: absolute; margin-left: -65px; top: 25px;}
#nav ul li:hover ul { display: inline-block; position: absolute; }
#nav ul ul li	{ display: block; }
#nav ul ul li.RMain { margin-left: -10px;  }
}


#content	{ max-width: 50em; position: absolute; top: 17em; left: 14%; overflow: auto; }
#content h3	{ margin-top: 30px; }

#abstract	{ width: 700px; margin-bottom: 40px; }
#abstract h1	{ margin: 0px; }
#abstract p	{ width: 48%; padding: 0px; margin: 0px;}

#timeline	{ width: 100%; position: relative; margin-top: 50%; }
#timeline table	{ margin: 0px; border-collapse: collapse; border: 0px; }
#timeline th	{ text-align: center; padding: 0px; }
#timeline tr	{ border: 0px; border-spacing: 0px; }
#timeline td	{ width: 20%; padding: 10px; border-spacing: 0px; }



/* *****************
/* Style */

body 		{ background: #fff; /* #eaeae9 */; font-family: 'Tajawal', serif; font-size: 15px; letter-spacing: .02em;  line-height: 1.4; font-weight: 200; color: #333; }

h1 		{ font-family: 'Oswald', serif; font-weight: 600; font-variant: small-caps; }
h1.attentionwhore, h2 { color: filter:alpha(opacity=90); opacity: 0.9; font-size: 70px; letter-spacing: .05em; }
h1.discreet	{ font-size: 26px; letter-spacing: .1em; }
h1 a		{ text-decoration: none; color: #eb9514; }
h1 a:hover	{ color: #333; }

h4		{ font-style: italic; margin-bottom: -10px;}

address		{ font-style: normal; font-family: 'Alegreya Sans SC'; }

span.pop	{ color: #eb9514;  }

#nav		{ font-family: 'Oswald', serif; }
#nav ul 	{ font-size: 15px; text-transform: uppercase; letter-spacing: .1em; }	
#nav ul ul li.RMain { font-size: 15px; }
#nav ul ul li	{ font-size: 12px; }
#nav a		{ text-decoration: none; color: #333; }
#nav li a:hover	{ color: #eb9514; }

@media only screen and (min-width: 600px)
{#nav ul li:hover	{ border-top: 4px solid #eb9514; } }
#nav ul ul li:hover	{ border: none; }

#abstract, h2, h3	{ font-family: 'Alegreya Sans SC'; }

#content p	{ font-size: 15px; }
#content b 	{ font-weight: 600; }
#content a	{ color:  #eb9514; text-decoration: none; }

#content ul li	{ list-style-type: none; margin-top: 10px; }
#content ul li:before {	content: "\00BB \0020"; margin-left: -1.7em; }

#timeline	{ background: #eaeae9;  }
#timeline th	{ font-size: 70px; background: #fff; border: 2px solid #ddd; }
#timeline th.lil { font-size: 12px; }
#timeline td	{ border-right: 2px solid #ddd; } 
#timeline td.on { background: #fff;}