/* Reset */
* {padding: 0; margin: 0;}
html {font-size: 62.5%; -webkit-font-smoothing: antialiased !important;}
html, body {height: 100%;}
ol, ul {list-style: none;}
img {border: none; max-width: 100%;}
aside {float: left;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

/* Clearfix */
.clear:before, .clear:after {display: table; content: '';}
.clear:after {clear: both;}

/* Main Styles */
body {background: #fefefe; color: #3f5b8b; font-family: Arial;}
.container {width:974px; margin: 0 auto; background: #eee; -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,0.6); box-shadow: 0 0 20px 0 rgba(0,0,0,0.6);}

/* Header Styles */
.header { background: url(../images/logo.jpg) center center no-repeat; width: 974px; height: 102px;}

/* Feature */

.banner {padding: 2%; }
.banner div {background: url(../images/header.jpg) center center no-repeat; border-radius: 10px; overflow: hidden; min-height: 180px; box-sizing: border-box; position: relative; color: #000;}
.banner div h2 {position: absolute; top: 20px; left: 20px; font-size: 15px !important; line-height: 24px; color: #000000; }
.banner div h3 { position: absolute; top: 93px; bottom: 0; left: 20px; font-size: 31px; line-height: 35px; color: #000000; text-transform: none; }
.banner div p { position: absolute; top: 125px; bottom: 0; left: 20px; font-size: 21px; line-height: 35px; color: #000000; text-transform: none; }

/* Gradient */

.grad {
	width: 100%; 
	height: 28px; 
	display: block;
	background: #3f3f3f; /* Old browsers */
	background: -moz-linear-gradient(top,  #3f3f3f 0%, #4f4f4f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3f3f3f), color-stop(100%,#4f4f4f)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #3f3f3f 0%,#4f4f4f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #3f3f3f 0%,#4f4f4f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #3f3f3f 0%,#4f4f4f 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #3f3f3f 0%,#4f4f4f 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f3f3f', endColorstr='#4f4f4f',GradientType=0 ); /* IE6-9 */
}

#content { top:15px; height:785px; position:relative; overflow:hidden; background-color: #C7D9DE; }
#header-text { background-color: #eeeeee; padding:0 20px 0 20px; font-family:Arial, Helvetica, sans-serif; font-size: 18px; line-height: 23px; color:#323E42; }

#titlecolumnright { position:absolute; right:0; }
#tilesColumn{ width: 1027px; display:inline-block; position:relative; }
#twitterfeed { width: 175px; height: 490px; background-image:none; margin:  20px 15px 0 0; display: inline-block; float: right; }

#tiles { clear: both; margin: 20px 0 25px 0; overflow: hidden; display:inline-block; width: 974px !important; position:relative; left: 20px; }
#tiles.tiles1 { left:0; top:0; width: 190px !important;}
#tiles.tiles2 { right:0; top:0;}
#tiles li { background-position: center center; background-repeat: no-repeat; border-radius: 12px; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); float: left; margin: 0; overflow: hidden; position: relative; margin-right:16px; margin-bottom:15px; box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3); }
#tiles li a, #tiles li a:link, #tiles li a:visited, #tiles li a:hover, #tiles li a:active, #tiles li a:focus { display: block; text-decoration: none !important; }
/*#tiles li a img { width: 240px; }*/
#tiles li a span.icon { background-position: 7px 6px; background-repeat: no-repeat; bottom: 0; cursor: pointer; left: 0; position: absolute; right: 0; top: 0; z-index: 1; }
#tiles li a .text { background-color: #ffffff; color: #1f4f82; cursor: pointer; left: 0; padding: 5px 3px 0 9px; position: absolute; top: 62%; z-index: 2; text-decoration: none !important; font-size: 15px !important; line-height: 19px !important; font-weight: bold; }
#tiles li.tileinfo a .text {min-height: 65px;}
#tiles li a .text .icon { width : 50px; height:30px; line-height: 30px; position: absolute; left: 185px; top: 7px; font-size: 12px; }
#tiles li a .text .icon.play { background: url(../images/icon1.jpg) right 0 no-repeat; width:68px; height:31px; padding-left: 22px; left: 200px; top:4px; font-weight: normal; }
#tiles li a .text .icon.eye { background: url(../images/icon3.jpg) left 0 no-repeat; width:31px; height:31px; left: 260px; top:4px; }
#tiles li a .text .icon.doc { background: url(../images/icon2.jpg) left 0 no-repeat; width:31px; height:31px; left: 260px; top:4px; }
#tiles .tileinfo a .text { top: 81%; left: 1px; width: 170px; bottom:10px; }
#tiles li a .text .normal { font-weight: normal;}



* html #tiles li a .text { height: 180px; overflow: visible; }
/*#tiles li a:hover .text { opacity: 0.9; text-decoration: underline; max-height: 55px; }*/
#tiles li a:hover .text { text-decoration: underline !important; } 
#tiles li a:hover .text strong { text-decoration: underline !important; }
#tiles li .text em, #tiles li .text strong { overflow: hidden; text-overflow: ellipsis; }
#tiles li .text em { display: block; font-size: 1.1em; font-style: normal; font-weight: normal; padding: 3% 0 1%; white-space: nowrap; }
#tiles li .text strong { background-position: 85% 0%; background-repeat: no-repeat; display: block; font-size: 12px; line-height: 17px; max-height: 115px; min-height: 55px; padding: 0 3px 0 0; }
#tiles li .text span { display: block; font-size: 17px; line-height: 1.167; width:90%; opacity: 0; }