@import "https://fonts.googleapis.com/css?family=Open+Sans";

html
{
	height: 100%;
	box-sizing: border-box;
}

*, *:before, *:after
{
	box-sizing: inherit;
}

body
{
	background: #000000 url(../images/op2skin_background.png);
	font-family: 'Open Sans', sans-serif;
	min-width: 960px;
	min-height: 100%;
	margin: 0;
	position: relative;
	padding-bottom: 6rem;
}

img
{
	border: 0;
}

.wrapper
{
	width: 960px;
	margin: 0 auto;
}

.clearfix:after
{
	clear: both;
	content: "";
	display: block;
	height: 1%;
	line-height: 0;
	visibility: hidden;
}

a
{
	color: #fdfdfd;
	text-decoration: none;
}

a:hover
{
	color: #ddddff;
	text-decoration: underline;
}

table
{
	color: #ccc;
}


/* Background footer */
.bgfooter
{
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 344px;
	background: url(../images/op2skin_bottom-img.png) bottom left no-repeat, url(../images/op2skin_bottom.png) bottom repeat-x;
	z-index: -1;
}

/*------------------------------ CONTENT SECTION --------------------------*/

.content_float
{
	/*background: #000000 url(../images/body_bg.png);*/
	border: 1px solid #4f4f4f;
	border-radius: 10px;
	padding: 25px 10px 0px 10px;
	
	/* Gradients */
	background: #642121;
	background: -moz-linear-gradient(top, #642121 0px, #0c0c0c 20px, #282828 21px);
	background: -webkit-linear-gradient(top, #642121 0px,#0c0c0c 20px,#282828 21px);
	background: linear-gradient(to bottom, #642121 0px,#0c0c0c 20px,#282828 21px);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#642121', endColorstr='#282828',GradientType=0 );
	
	margin-bottom: 15px;
}


/*------------------------------ UI ELEMENTS ------------------------------*/
.btn1
{
	background: url(../images/interface.png) no-repeat;
	background-position: 0 0;

	display: inline-block;

	width: 200px;
	height: 34px;
	line-height: 29px;
	padding: 0px 3px 9px;
	
	color: #fdfdfd;
	font-size: 13px;
	font-weight: bold;

	text-align: center;
	text-decoration: none;
	text-shadow: 3px 0 3px #053131;
	text-transform: uppercase;
}

.btn1:hover
{
	color: #fdfdfd;
	background-position: -222px 0;
	text-decoration: none;
}

.btn1 a
{
	text-decoration: none;
}


.btn-float
{
    display: inline-block;
	float: right;
	width: 200px;
	height: 34px;
	margin-left: 10px;
}

/*------------------------------ HEADER ------------------------------*/
#header
{
	background: #642121;
	background: -moz-linear-gradient(top, #642121 0%, #0c0c0c 100%);
	background: -webkit-linear-gradient(top, #642121 0%,#0c0c0c 100%);
	background: linear-gradient(to bottom, #642121 0%,#0c0c0c 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#642121', endColorstr='#0c0c0c',GradientType=0 );

	height: 56px;
	padding: 14px 0 0;
	text-align: right;
	
	border-bottom: 2px solid #4a4a4a;
}

/** Logo **/
#logo
{
	float: left;
	display: inline-block;
	margin-left: 10px;
}

/** Navigation **/
#navigation
{
	display: inline-block;
	height: 30px;
	list-style: none;
	margin: 0 10px;
	padding: 0;
	*width: 516px; /** Needed for IE7 **/
	font-size: 14px;
}

#navigation li
{
	float: left;
	margin: 0 30px;
}

#navigation li:first-child
{
	margin-left: 0;
}

#navigation li a
{
	color: #fdfdfd;
	line-height: 30px;
	padding: 0;
	text-decoration: none;
}

#navigation li a:hover
{
	/*color: #44b2f1;*/
	text-shadow: 1px 1px 1px #f2e38f;
}

#navigation li.selected a
{
	font-weight: bold;
	text-shadow: 1px 1px 1px #000;
	text-shadow: 0 0 0 #f00;
}

#navigation li.selected a:hover
{
	text-shadow: 0 0 0 #ff0;
}

/*------------------------------ CONTENTS ------------------------------*/
#contents
{
	margin: 0 0 0;
	padding: 56px 0 0;
}

#contents h1
{
	color: #f0f0f0;
	font: italic;
	font-size: 25px;
	font-style: italic;
	margin: 0 0 15px;
}

#contents h2
{
	color: #f0f0f0;
	font-size: 15px;
}

#contents p
{
	color: #ccc;
	font-size: 14px;
	line-height: 24px;
	margin: 0;
	padding: 0 0 30px;
	text-align: justify;
}

#contents p b
{
	display: block;
}

#contents .body
{
	width: 940px;
	margin: 0 auto;
	padding: 0 10px;
}

#contents .click-here
{
	float: right;
	display: inline-block;
	min-height: 90px;
	width: 305px;
	margin-left: 20px;
	text-align: center;
}

#contents .click-here h1
{
	color: #addcfe;
	font-style: italic;
	line-height: 36px;
	margin: 18px 0;
}


#home_header
{
	background: #000 url(../images/home_header_bg.png) no-repeat center top;
	/*font-family: Georgia, "Times New Roman", Times, serif;*/
	min-height: 200px;
	margin: -56px 0 22px;
	/** Needed for IE7 **/
	*margin: 0;
	*position: relative;
	*top: -56px;
}

#home_header .wrapper
{
	width: 940px;
	padding: 54px 10px 26px;
}

#home_header .info
{
	height: 200px;
	width: 400px;
	overflow: hidden;
}

#home_header h1
{
	color: #ffffff;
	font-size: 35px;
	font-style: italic;
	line-height: 50px;
	margin-bottom: 30px;
}

#home_header p
{
	color: #176eb0;
	font-size: 14px;
	line-height: 24px;
}

#home_header p a
{
	color: #176eb0;
}

#home_header div.highlight
{
	background: #171a1a url(../images/heading_bg.png) repeat-x left top;
	min-height: 82px;
	border-top: 2px solid #4a4a4a;
	border-bottom: 2px solid #4a4a4a;
}

#home_header div.highlight h2
{
	color: #7c7c7c;
	font-size: 30px;
	line-height: 82px;
	width: 940px;
	margin: 0 auto;
	padding: 0 10px;
	text-shadow: 3px 3px 6px #121413;
}

#home_header div.highlight h2 i
{
	font-weight: normal;
}


/** main **/
.main
{
	padding: 0 10px;
}

/** sidebar **/
#sidebar
{
	float: right;
	width: 225px;
	margin: 0 10px 0 20px;
}

#sidebar img
{
	border: 5px solid #fff;
	border-radius: 5px;
}

#sidebar ul
{
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
}

#sidebar > ul li
{
	margin: 0 0 16px;
}

#sidebar > ul li img
{
	border: 4px solid #fff;
	border-radius: 3px;
}

#sidebar > ul li a:hover
{
	filter: alpha(opacity = 80);
	opacity: 0.8;
}

#sidebar .click-here
{
	display: inline-block;
	min-height: 80px;
	width: 225px;
	margin-left: 20px;
	text-align: center;
}

#sidebar .click-here h1
{
	font-style: normal;
	font-size: 16px;
	margin-bottom: 0;
	color: #fdfdfd;
}


/*------------------------------ FOOTER ------------------------------*/
#footer
{
	/*background-color: #0c0c0c;
	border-top: 1px solid #fdfcfc;*/
	
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
}

#footer .body
{
	/*background: #0c0c0c url(../images/footer_bg.png) no-repeat center top;*/
	min-height: 50px;
	padding: 8px 0;
}

#footer h4
{
	color: #fff;
	font: normal 14px Georgia, "Times New Roman", Times, serif;
	margin: 0 0 12px;
}

#footer p
{
	color: #7890a1;
	font-size: 12px;
	line-height: 24px;
	margin: 0;
	padding: 0 0 6px;
}

#footer .footer_float
{
	background: rgba(0, 0, 0, 0.5);
	min-height: 30px;
	padding: 5px 0px 5px;
	
	border-radius: 15px;
}

/** links **/
#links
{
	float: left;
	width: 460px;
	margin: 0 10px;
}

#links > div
{
	float: left;
	width: 230px;
}

#links ul
{
	list-style: none;
	width: 300px;
	margin: 0;
	padding: 0;
}

#links ul li
{
	float: left;
	margin: 0 0 0;
	padding: 2px 10px 0;
}

#links ul li a
{
	color: #7890a1;
	font-size: 12px;
	line-height: 0;
	text-decoration: none;
}

#links ul li a:hover
{
	color: #e8eff4;
}

#footer .footnote
{
	float: right;
	display: inline-block;
	color: #fff;
	width: 460px;
}