@font-face {
	font-family: 'Open Sans';
    src:url('../font/open_sans/OpenSans-Regular.eot') format('embedded-opentype'),
        url('../font/open_sans/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
		url('../font/open_sans/OpenSans-Regular.ttf') format('truetype'),
		url('../font/open_sans/OpenSans-Regular.woff') format('woff'),
		url('../font/open_sans/OpenSans-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* reset */
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 { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 tag */
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; }

/* main tag */
body { font-family: 'Open Sans'; font-size: 12px; font-weight: 300; color: #212121; background-color:#fbfbfb; }
input { font-family: 'Open Sans'; font-size: 11px; font-weight: 300; color: #212121; padding-left: 8px; }
select { font-family: 'Open Sans'; font-size: 11px; font-weight: 300; color: #212121; width: 150px; }

/* top */
.menu { position:absolute; background-color: rgba(0,0,0,.8); top:0px; width: 100%; height:auto; min-height:39px; z-index:3; border-bottom: 2px solid #b7cf00; color: #fff; padding:0;
		/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );*/
		/*filter: alpha(opacity=90);*/
		/*-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";*/
		/*
		able of percentages to hex values. E.g. for 50% white you'd use #80FFFFFF.
			100% — FF
			95% — F2
			90% — E6
			85% — D9
			80% — CC
			75% — BF
			70% — B3
			65% — A6
			60% — 99
			55% — 8C
			50% — 80
			45% — 73
			40% — 66
			35% — 59
			30% — 4D
			25% — 40
			20% — 33
			15% — 26
			10% — 1A
			5% — 0D
			0% — 00
		*/
		filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#CC000000', endColorstr='#CC000000');
		
		-moz-opacity:0.8;
		
		-webkit-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.25);
		-moz-box-shadow:    0px 2px 3px 0px rgba(0, 0, 0, 0.25);
		box-shadow:         0px 2px 3px 0px rgba(0, 0, 0, 0.25);
}
.menu .title { float:left; position:relative; ;font-size:18px; padding: 10px 15px;}

.bg-header {position: absolute; z-index:1; top:0; left:0; width: 100%; height:162px; background-image: url('img/UI-SICE-BG-HEADER-1920x162.jpg'); background-color:#e1dbc8; background-repeat: no-repeat; background-position: 100% 0%; margin:0; padding:0;}
.bg-header .title-header { float:left; top:60px; left:300px; position:relative; font-size:25px; font-weight:300;}
.bg-header .title-header strong {font-weight:700;}
.logo { float: right; position:absolute; top:0; right:0; margin:8px 15px 0 0; display:block; width:121px; height:20px;}

/* offcanvas */
.offcanvas { width: 250px; height:93%; position:absolute; background-color:#FFF; top:39px; z-index:2;
-webkit-box-shadow: 2px 0px 16px 0px rgba(50, 50, 50, 0.2);
-moz-box-shadow:    2px 0px 16px 0px rgba(50, 50, 50, 0.2);
box-shadow:         2px 0px 16px 0px rgba(50, 50, 50, 0.2);
}
.offcanvas  ul { width:100%; margin:25px 0;}
.offcanvas  ul li { float:left; width:100%; margin:0; padding:0; font-size:17px; letter-spacing:-0.5px;}
.offcanvas  ul li a { display:block; padding:15px 20px; text-decoration:none; color:#212121;}
.offcanvas  ul li a:hover { background-color:#f3f3f3;}
.offcanvas  li.active {background-color:#f3f3f3 !important;}

/* content */
.content { padding-left: 300px; width: 100%; -moz-box-sizing: border-box; box-sizing: border-box; top:180px; height:auto; z-index:4; position:relative;}
.content .tile { float:left; position:relative; width:90%; background-color: #FFF; min-height:150px; margin:15px auto;
	-webkit-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.34);
	-moz-box-shadow:    0px 3px 5px 0px rgba(50, 50, 50, 0.34);
	box-shadow:         0px 3px 5px 0px rgba(50, 50, 50, 0.34);
}
.content .tile .title { float:left; padding: 20px 0 15px 20px; width:100%; }
.content .tile .separator { float:left; border-bottom:1px solid #c9e400; height:1px; width:100%;}
.content .tile .title  h2 { float:left; font-size:15px;}
.content .tile table {margin:15px auto; width:97%; }
.content .tile table .table-separator {height:1px; background-color:#c9e400;}
.content .tile table .table-title { font-size:15px; padding-bottom:15px; font-weight:600;}
.content .tile table tr td.table-row-description, .content .tile table tr td.table-row { padding:13px 8px; vertical-align:top;}
.content .tile table tr td.table-row-description { font-size:12px; text-transform:uppercase; color:#CCC; font-weight:600; border-bottom:1px solid #CCC;}
.content .tile table tr td.table-row { line-height:16px;}
.content .tile table tr td.table-row img {float:left; margin:0 ;}
.content .tile table  p {margin:15px auto 0 auto;}

iframe {margin: 0 15px;}

/* copyright */
.copyright { float:left; position:relative; font-size:10px; color:#838383; margin: 0 0 25px 0; width:100%;}