/********************************************************************/
/* 
 * green: #bed91d
 * red:   #b02400
 * beige: #fdfdf3
 * grey:  #50504d
 * red-brown: #380616             
 * navy:  #1B2040                     
 
 * caribou green: #C1D300
 * caribou red:   #D0000A
 * carobou blue:  #96CDD9
 *
 * pantone black 4c:        #31261D
 * pantone neutral black C: #222223
 * pantone 7533 C:          #473729
 * pantone 581 C:           #625D20
 * pantone 480 C:           #C6A992
 *
 * PANTONE¨ Black 4 C #31261D	 
 * PANTONE¨ 4725 C    #AE8A79	 
 * PANTONE¨ 7769 C    #716135
 * PANTONE¨ 7533 C    #473729	 
 * PANTONE¨ 4975 C    #3F2021
 */
/********************************************************************/

@font-face {
	font-family: 'Underwood Champion';
	src: url('fonts/underwood_champion.eot');
}

@font-face {
	font-family: 'Underwood Champion';
	src: local('Underwood Champion Regular'),
	     local('UnderwoodChampion-Regular'),
	     url('fonts/underwood_champion.ttf') format('truetype');
}

@font-face {
	font-family: 'King668';
	src: url('fonts/king668.eot');
}
@font-face {
	font-family: 'King668';
	src: local('King668'), local('King668'), url('fonts/king668.ttf') format('truetype');
}

html {
	background-color: white;
}

body {
	margin: 0;
	padding: 0 50px;
	color: #f0f0f0;
	font-family: "american typewriter", "palatino linotype", Courier, serif;
	font-size: 11pt;
}

h1, h2, h3, h4 {
	font-weight: normal;
}

#outerbox {
	color: #222223;
	margin: 0 0 0 210px;
	padding: 0 80px 10px 30px;
	z-index: 100;
	position: absolute;
}

.mainarea {
	margin: 0;
	padding: 0 0 10px 0;
	line-height: 1.7em;
}

.maincontainer { 
}
.mainbox {
}
.clearing {
	display: none; 
}

/**
 * Mobile Safari (3.2 till 4.2 at least) renders some elements (our .background)
 * with css rules for the anchor <a> element. Weird bug.
 */
a {
	color: #f0f0f0;
	border: none;
	text-decoration: none;
}

#outerbox a {
	color: #222223;
	text-decoration: none;
	border: 1px solid transparent; 
	border-bottom: 1px dotted #625D20;
}
#outerbox a:hover {
	color: #222223;
	background-color: #bed91d;
     -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
	border-bottom: 1px dotted #625D20; 
	border: 1px solid #625D20; 
}

/********************************************************************/
/* HEADER                                                           */
/********************************************************************/

.header {
	margin: 0 0 0 -35px;
	padding: 40px 0 100px 0;
}

.green {
  font-family: "american typewriter", "palatino linotype", Courier, serif;
  color: #bed91d;
}

.logo {
	margin: 0 -5px;
}

.logo .word {
	white-space: nowrap;
}
.logo sup {
  padding-left: 5px;
  font-family: "Underwood Champion", "american typewriter", "palatino linotype", Courier, serif;
  font-size: 20pt;
  font-weight: normal;
}

.logo a {
	padding: 0;
	color: #222223;
	font-weight: normal;
	border: none;
	font-family: "Underwood Champion", "american typewriter", "palatino linotype", Courier, serif;
	font-size: 48pt;
}
#outerbox .logo>a {
	border: 3px solid transparent;
}
#outerbox .logo a:visited {
  color: #222223;
}

#outerbox .logo a:hover {
  color: #222223;
  text-decoration: none;
	background-color: #bed91d;
     -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
	border-bottom: 1px dotted #625D20; 
	border: 3px solid #625D20; 
}
#outerbox .logo a:hover .green {
  color: #666667;
}

.logo a span {
	margin: 0;
	padding: 0;
}

/********************************************************************/
/* BACKGROUND                                                       */
/********************************************************************/
.backlogo {
	display: none;
	z-index: 1;
	font-family: "Underwood Champion", "american typewriter", "palatino linotype", Courier, serif;
	font-size: 128pt;
	line-height: 1.2em; 
	overflow: visible;
	color: #f0f0f0;
/*	opacity: .1;*/
	-moz-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform-origin: rotate(90deg);
}
body>.backlogo {
	position: absolute;
	top: 385px;
	left: 110px;
	display: block;
}
.backlogo div {
	border: none!important;
	color: #f0f0f0;
}
.backlogo .green {
	font-family: "Underwood Champion", "american typewriter", "palatino linotype", Courier, serif;
	color: inherit;
}
.backlogo .one {
}
.backlogo .two {
	margin-left: 400px;
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	transform-origin: rotate(180deg);
}

/********************************************************************/
/* MENU                                                             */
/********************************************************************/

.sidebox {
	position: relative;
	margin-left: -200px;

	overflow: visible;
}
#outerbox>.sidebox {
	position: fixed;
	top: 320px;
	left: 70px;
	margin-left: 0;
}
.sidebox div a {
	border-width: 3px!important;
}

.sidebox div h2 {
	font-size: 11pt;
	font-weight: bold;
}
.sidebox a:hover:before {
	content: '</>';
	color: #bed91d;
	font-size: 11pt;
	position: absolute;
	left: -25px;
}

/********************************************************************/
/* FOOTER                                                           */
/********************************************************************/

.footer {
	margin: 0;
	padding: 50px 0 0 0;
	font-size: 8pt;
}

/********************************************************************/
/* MISC                                                             */
/********************************************************************/

.jargonbox {
}

.banner {
	margin-bottom: 100px;
}
.advert {
	margin-bottom: 100px;
}

/********************************************************************/
/* mobile navigation                                                */
/********************************************************************/
.mobile-hint {
  display: none;
}
@media only screen and (max-device-width: 480px) {
  .mobile-hint {
    display: block;
    position: fixed;
    top: 0px;
    left: 0px;
    margin: 0 0 0 .1em;
    padding: 0;
    font-size: 48pt;
  	-moz-transform: rotate(90deg);
  	-moz-transform-origin: left bottom;
  	-webkit-transform: rotate(90deg);
    -webkit-transform-origin: left bottom;
  	transform: rotate(90deg);
  	transform-origin: left bottom;
  }
  .mobile-hint a, .mobile-hint a:visited {
    color: #888!important;
  }

}