/* -----------------------------------------------------------------------
	Contents of this file:
	----------------------------------------------------------------------
	
	1.  Global Reset
	2.  Typography
	3.  Outer Elements
	4.  Header
	5.  Container
	6.  Login Box
	
------------------------------------------------------------------------*/


/* ---------------------------------------------------------------------*/
/* -------------------------- 1. GLOBAL RESET ------------------------- */
/* ---------------------------------------------------------------------*/



/* ---------------------------------------------------------------------*/
/* ----------------------- 2. TYPOGRAPHY STYLES ----------------------- */
/* ---------------------------------------------------------------------*/
body { font:14px/1.231 arial, helvetica, sans-serif; line-height: 1.5; color: #555555; }
h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 12px 0; font-size:100%; font-weight:bold; }
p { padding:0 0 12px 0; margin:0; }
a { color:#00093c; cursor:pointer; }
a:focus, a:hover { color:#00093c; text-decoration: none; text-decoration:underline; }
a:focus { outline: 0; }
strong { font-weight:bold; }
em, dfn { font-style:italic; }
dfn { font-weight:bold; }
sup, sub { line-height:0; }
address { margin:0 0 12px 0; font-weight: normal; font-style: normal; }
blockquote { margin:1em; }
select,input,button,textarea,button { font-family: arial, verdana, helvetica, sans-serif; }
ul, ol { margin:0 1.5em 1.5em 1.5em; }
ol li { list-style: decimal outside; }
ul li { list-style: disc outside; }
dl { margin:0 0 1.5em 0; }
dl dt { font-weight:bold; }


/* ---------------------------------------------------------------------*/
/* ----------------------------- 3. OUTER ----------------------------- */
/* ---------------------------------------------------------------------*/
#backgroundImage { background:url(/public/images/login/bg.gif); width:100%; height:100%; position:fixed; left:0; top:70px; }


/* ---------------------------------------------------------------------*/
/* ---------------------------- 4. HEADER ----------------------------- */
/* ---------------------------------------------------------------------*/
#loginHeader { margin-bottom:30px; width: 100%; height:70px; background:url(../images/login/grad.gif) repeat-x left top #030a20; -webkit-box-shadow: 0px 3px 4px -0px rgba(0, 0, 0, 0.5); box-shadow: 0px 3px 4px -0px rgba(0, 0, 0, 0.5); }


/* ---------------------------------------------------------------------*/
/* --------------------------- 5. CONTAINER --------------------------- */
/* ---------------------------------------------------------------------*/
.header { background:url(/public/images/login/gradAlt.gif) repeat-x left top #eaeaea; padding:3px; border-bottom:solid 1px #c6c6c6; }
.header .container { padding:0; }
.header h2 { padding:5px 12px; font-size:13px; font-weight:bold; color:#555555; }
.box { background:#fff; -webkit-border-radius: 3px; border-radius: 3px; border:solid 1px #c6c6c6; margin-bottom:23px; }
.box .padding { padding:12px 15px; }
.container { position:relative; z-index:2; }

#videoContainer { margin-left:0; font-size:13px; line-height:normal; }
#videoContainer .header { background:url(/public/images/login/grad.gif) repeat-x left top #030a20; }
#videoContainer .video-js { width: 100% !important; height: 100%; *height: 257px !important; }

.video { position: relative; padding-top: 0px; margin-top: -7px; padding-bottom: 19px; height: 73%; }
.video .sash { position: absolute; top: 0; right: 0; }
.video #pano { height: 100%; }
.video iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; }

#twitterContainer h2 { background:url(/public/images/login/iconTwitter.png) no-repeat 2% center; padding-left:41px; font-size:13px; }
#twitterContainer .padding { padding: 0 15px 0 15px; }
#twitterContainer ul { list-style-type:none; margin:0; padding:12px 0 0; height:151px; }
#twitterContainer ul li { list-style-type:none; margin:0; padding:0 0 10px; font-size:13px; }
#twitterContainer ul li .title { padding:0; margin:0; font-weight:normal; text-transform:uppercase; }

#blogContainer { overflow:hidden; }
#blogContainer h2 { background:url(/public/images/login/iconBlog.png) no-repeat 1% center; padding-left:41px; font-size:13px; }
#blogContainer .padding { overflow:hidden; }
#blogContainer .post { line-height:normal; font-size:13px; position:relative; }
#blogContainer .post .date { position:absolute; font-weight:bold; color:#000; font-size:9px; line-height:normal; text-transform:uppercase; right:0; top:10px; background:#fff; padding:8px 10px; }
#blogContainer .post .date span { display:block; font-size:17px; }
#blogContainer .post .title { background:#fff; }
#blogContainer .post .title a { font-weight:bold; color:#555; display:block; padding:10px 12px; min-height: 32px; }
#blogContainer .post .text { padding:0 12px; background:#fff; font-size:13px; color:#555; min-height: 212px; }
#blogContainer .post .meta { overflow:hidden; padding:10px 12px; background:#fff; border-top: 1px solid #C6C6C6; }
#blogContainer .post .meta a { color:#555; display:block; font-weight:bold; font-size:13px; }
#blogContainer .post .meta a.readMore { float:left; }
#blogContainer .post .meta a.comments { float:right; background:url(/public/images/login/iconComment.gif) no-repeat right top; padding-right:18px; }

#socailContainer { background:url(/public/images/login/gradAlt.gif) repeat-x left top #eaeaea; }
#socailContainer .padding { padding:0; }
#socailContainer ul { list-style-type:none; margin:0; padding:0; width:484px; margin:0 auto; overflow:hidden; }
#socailContainer ul li { float:left; list-style-type:none; margin:0; padding:0; }
#socailContainer ul li a { display:block; width:57px; height:57px; margin-left:25px; background:url(/public/images/login/spriteSocialBtns.png) no-repeat left top; }
#socailContainer ul li a.link1 { background-position:0 0; margin-left:0; }
#socailContainer ul li a.link2 { background-position:-84px 0; }
#socailContainer ul li a.link3 { background-position:-170px 0; }
#socailContainer ul li a.link4 { background-position:-255px 0; }
#socailContainer ul li a.link5 { background-position:-340px 0; }
#socailContainer ul li a.link6 { background-position:-427px 0; }


/* ---------------------------------------------------------------------*/
/* -------------------------- 6. LOGIN BOX ---------------------------- */
/* ---------------------------------------------------------------------*/
#loginContainer { margin-left:; }
#loginContainer h2 { background:url(/public/images/login/iconPower.png) no-repeat 2% center; padding-left:41px; font-size:13px; }
#loginContainer form { margin:0; }
#loginContainer form a { font-size:13px; font-weight:bold; color:#555555; }
#loginContainer form .formItem { }
#loginContainer form label { display:block; padding-top:4px; }
.ie8 #loginContainer form input { min-height:20px; } /* IE8 and below hack */
.ie8 #videoContainer .video-js { height:258px !important; } /* IE8 and below hack */
.ie8 #videoContainer .box { height:424px !important; } /* IE8 and below hack */
.ie7 #loginContainer form input { min-height:0; }
#loginContainer form .formSubmit { margin-top: 26px; }
#loginContainer form .formSubmit label { padding: 4px 0; }
#loginContainer form .messageError { background: #F2DEDE; border: 1px solid #EED3D7; color: #B94A48; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); padding: 4px 10px; margin-bottom: 8px; border-radius: 4px; }
#loginContainer form .formSubmit input {
	font-weight:bold;
	display: inline-block;
	*display: inline;
	padding: 4px 14px;
	margin-bottom: 0;
	*margin-left: .3em;
	line-height: 20px;
	*line-height: 20px;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid #bbbbbb;
	*border: 0;
	border-bottom-color: #a2a2a2;
	-webkit-border-radius: 4px;
	 -moz-border-radius: 4px;
		  border-radius: 4px;
	*zoom: 1;
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
		  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	color: #fff;
	text-shadow: none;
	font-size: 13px;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #8eca65;
	background-image: linear-gradient(bottom, rgb(118,166,67) 10%, rgb(142,202,101) 90%);
	background-image: -o-linear-gradient(bottom, rgb(118,166,67) 10%, rgb(142,202,101) 90%);
	background-image: -moz-linear-gradient(bottom, rgb(118,166,67) 10%, rgb(142,202,101) 90%);
	background-image: -webkit-linear-gradient(bottom, rgb(118,166,67) 10%, rgb(142,202,101) 90%);
	background-image: -ms-linear-gradient(bottom, rgb(118,166,67) 10%, rgb(142,202,101) 90%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0.1, rgb(118,166,67)),
		color-stop(0.9, rgb(142,202,101))
	)
	background-repeat: repeat-x;
	border-color: #51a351 #51a351 #387038;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff51a351', GradientType=0);
	filter: progid:dximagetransform.microsoft.gradient(enabled=false);
}
#loginContainer form .formSubmit input:hover,
#loginContainer form .formSubmit input:active,
#loginContainer form .formSubmit input.active { background-color: #76a643; }

@media (max-width: 1199px) {
	#twitterContainer .padding { padding: 0 10px; }
	#twitterContainer ul { padding-top: 5px; }
	#twitterContainer ul li { padding: 0 0 6px; }
}

@media (max-width: 1024px) {
	body { background:url(/public/images/login/bg.gif); }
	#backgroundImage { background: none !important; }
	.backstretch img { display: none !important; }
}

@media (min-width: 768px) and (max-width: 979px) {
	#twitterContainer ul { height: auto; }
}

@media (max-width: 768px) {
	#twitterContainer { clear: both; margin-left: 0; width: 100%; }
}

@media only screen and (max-width: 767px) {
	body { padding:0; }
	.container { padding-left: 20px; padding-right: 20px; width: auto !important; }
	.pull-right { float:none !important; }
	#twitterContainer ul { height: auto; }
	#socailContainer ul { width: 342px; }
	#socailContainer ul li a { margin-left:0; }
}

@media (max-width: 420px) {
	#socailContainer ul { width: auto; }
}