@charset "utf-8";

/*---------- */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, p {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	direction:ltr;
	text-align:  left;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a {
	color: #f6ca61;
	text-decoration: underline;
}
a:hover {
	color:#fff;
	text-decoration:underline;
}

.clear{ clear:both}
.fl { float:left;}
.fr { float:right;}
/* Basic Styles
---------- */
html{
	height:100%;
	border:none;
}
body {
	background: #e3e3e3;
	font-family: Verdana, Arial, serif;
	color: #FFFFFF;
	-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust: 100%;
	position:relative;
	font-size:100%;
	text-align:left;
	padding-top:1px;
}
/* Typography
---------- */
h1 {
	font-size:20px;
	color:#fff;
}
h1.center {
	text-align:center;
}
h1.lbox-center {
	text-align:center;
    padding-right:13px;
}

/* Site 
---------- */
.wrapper {
	width:100%;
	float:left;
}

/* Login Box */			
#LBox {
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	margin: 5% auto;
	padding: 40px 26px;
	opacity:0.9;
	filter:alpha(opacity=70); /* For IE8 and earlier */
	overflow:hidden;
}
.LBoxMessage {
	margin:40px 0px;
	line-height:18px;
	color:#fff;
}

.header h2{
	font-size:22px;
	width:300px;
	padding:45px 0px 0px 120px;
}
.header .quicklink{
	float:right;
	margin-top:-18px;
	padding-right:30px;

}
/* Backgrounds */
.black {
	background: #16A085;
}
.lboxwidth {
	width: 280px;
}

#page_footer {
    background: none repeat scroll 0 0 transparent;
    border-top:none !important;
    bottom: 0;
    position: absolute;
    text-align: center;
    width: 100%;
}

#footer{
	/* margin: 5 40% 0px; */
	margin: 5 30% 0 auto;
	width: 40%;
	text-align:center;
	font-size:13px;
	padding-bottom:10px;
	line-height:18px;
	color:#fff;
}

.copyright{
	font-size:11px;
	/* margin:4% 0 0px 0; */
	color: #717171;
	text-align:  center;
}

.logo {
	/* margin: 20 0 0 30px; */
	margin: 0 auto 0 auto;
	padding-right:13px;
	width:128px;
	height:128px;
	background:url(/public/share/custom_apm/images/logoF5_128.png) no-repeat;
}
/* 
---------- */

.container {
	position: relative;
	margin: 0 auto;
	padding: 0px;
}
.container .columns {
	/* float: left; */
	display: inline;
	width: 100%;
	color:#fff;
}
.container .rightcol {
	width: 100%;
	/* border-style:solid; */
	/* border-left:1px solid #fff; */
}

.contentContainer{
	margin:0px 10px;
	
}
.iconBox{
  	 text-align:center;

	 margin:30px;
	 display:inline-table;
	 width:150px;
	 height:100px;
}
.iconBox img{
	margin-bottom:10px;
}
.subFont{ font-size:14px; color:#818181;}

/* #Form Styles
---------- */
form {
	padding: 0 0 0 0px;
	width:100%;
}
input {
	font-family:"aller_lightregular", Arial, sans-serif;
	font-size: 14px;
	outline: none;
}
input, input[type=password] {
	color: #787878 !important;
	padding-left: 10px !important;
	/* revisit
	width: 211px !important;
	*/
	width: 100% !important;
	margin-top:20px !important;
	height: 30px !important;
	line-height:30px !important;
	font-style:italic !important;
	border: 1px solid #7fadd2 !important;
	border-radius: 2px !important;
	text-align: center;
}

input:hover, input[type=password]:hover {
	border: 1px solid #555555;
}
input:focus, input[type=password]:focus {
	border: 1px solid #555555;
}
input[type=submit] {
	margin-top:20px !important;
	font-size: 16px !important;
	font-style:normal !important;
	width: 100% !important;
	height: 30px !important;
	color: #fff !important;
	background-color: #177969 !important;
	border-radius: 2px !important;
	border:none !important;
	float:  right;
	padding-left:0px !important;
}

/* 
---------- */
.hidden {
	display: none;
}

/* #Tables take over
---------- */

table#main_table, table#credentials_table, table#interaction_table {
	/* width: 100% !important; */
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	border-collapse: collapse;
	empty-cells: show;
	height: 2px;
	background-color: #16A085 !important;
	color:#fff!important;
}

/* revisit - clean up */
table#interaction_table td{
	color:#fff!important;
	text-align: center;
}
/* #DIV take over
---------- */
div#sessionDIV {
	color: #fff;
}

div.header > table#page_header {
	background-image: none;
	background-repeat: no-repeat;
	background-color: inherit;
}


/* #Tablet (Portrait)
---------- */

    /* Note: Design for a width of 768px */

    @media only screen and (max-width: 767px)and (orientation : portrait)  {
			/* Login Box */			
			.lboxwidth {
				width: 360px;
			}
			.LBoxMessage{
				display:none;
			}

			h1{ 
				margin-bottom:20px;
			}
			.container > .columns > h1 {
				font-size:18px;
				margin-left:auto;
				margin-right:auto;
				text-align: center;
			}
			.container .columns {
				width:100%;		
				margin-left:auto;
				margin-right:auto;		
			}
			.container .rightcol {
				border-style:none;
				/*padding-top:20px !important;*/
			}
			form {
				padding:0px;
				width:100%;
			}
			/*input[type=name], input[type=password] {
				width:100%;
			}*/
			#footer {
				width: 360px;
			}
			.logo {
				margin: 0 0 0 0px;
    			width:128px;
    			height:128px;
    			background:url(/public/share/custom_apm/images/logoF5_128.png) no-repeat;
			}
		
	}
/* #Mobile (Landscape)
---------- */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
    	/* Login Box */
		.lboxwidth {
			width:60% !important;
		}
		#footer {
			width: 360px !important;
		}
		.container > .columns > h1 {
			font-size:18px;
			margin-left:auto;
			margin-right:auto;
			text-align: center;
		}
		#page_footer {
		    position: relative;
		}
	}
/*  #Mobile (Portrait)
---------- */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
			h1{ 
				margin-bottom:20px;
			}
			.header h2{
				padding:38px 0px 0px 85px;
				width:210px !important;
				font-size:18px;
			}

			/* Login Box */
			#LBox {
				padding:40px;
			}
			/* Login Box */			
			.LBoxMessage{
				display:none;
			}
			.lboxwidth {
				width:218px;
			}
			.container > .columns > h1 {
				font-size:18px;
				text-align: center;
			}
			.container .columns {
				width: 100%;
				margin-left:auto;
				margin-right:auto;
			}
			.container .rightcol {
				border-style:none;
				/*padding-top:20px !important;*/
				margin-left:auto;
				margin-right:auto;	
			}
			#page_footer {
			    position: relative;
			}
			/* Revisit
			table#main_table, table#credentials_table, table#interaction_table {
				width: 170px !important;
			}
			table#main_table form {
				width: 170px !important;
			}
			*/
			form {
				padding:0px;
				width:100%;
			}
			/*input[type=name], input[type=password] {
				width:100%;
			}*/
			.logo {
				margin-left:auto;
				margin-right:auto;
    			width:128px;
    			height:128px;
    			background:url(/public/share/custom_apm/images/logoF5_128.png) no-repeat;
			}
			#footer {
				width: 80%;
				margin-right: 15%;
			}
			.active {
				display: block;
				
			}	
			.iconBox{ margin:20px auto;}

	}
	
/* #Clearing
---------- */

    /* Self Clearing Goodness */
.container:after {
	content: "\0020";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div.inspectionHostDIVBig {visibility: visible;position: absolute;top: 15%;left: 15%;width: 60%;padding: 5%;background: rgb(0, 0, 0);opacity: 0.9;filter: alpha(opacity=90);z-index: 5;height: 50%;overflow-y: auto;font-size: 90%;}
div.inspectionHostDIVBig a.option {
margin-right: 14px;
}


