/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ===== Initializr Styles ==================================================
   Author: Jonathan Verrecchia - verekia.com/initializr/responsive-template
   ========================================================================== */

body {
    font: 16px/26px Helvetica, Helvetica Neue, Arial;
}

.wrapper {
    width: 90%;
    margin: 0 5%;
}

/* ===================
    ALL: Orange Theme
   =================== */

.header-container {
width:100%;
height:620px;
background-image:url(../images/headerx.jpg);
background-repeat:repeat-x;
}

.footer-container,
.main aside {

}

.footer-container {
width:100%;
height:155px;
background-image:url(../images/footerx.png);
background-repeat:repeat-x;
}

.header-container,
.footer-container,
.main aside {

}

.title {
    color: white;
}

/* ==============
    MOBILE: Menu
   ============== */

nav ul {
    margin: 0;
    padding: 0;
}

nav a {
    display: block;
    margin-bottom: 10px;
    padding: 15px 0;

    text-align: center;
    text-decoration: none;
    font-weight: bold;

    color: white;
    background: #e44d26;
}

nav a:hover,
nav a:visited {
    color: white;
}

nav a:hover {
    text-decoration: underline;
}

/* ==============
    MOBILE: Main
   ============== */

.main {
    padding: 30px 0;
}

.main article h1 {
    font-size: 2em;
}

.main aside {
    color: white;
    padding: 0px 5% 10px;
}

.footer-container footer {
    color: white;
    padding: 20px 0;
}

/* ===============
    ALL: IE Fixes
   =============== */

.ie7 .title {
    padding-top: 20px;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */















/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 480px) {

/* ====================
    INTERMEDIATE: Menu
   ==================== */

    nav a {
        float: left;
        width: 27%;
        margin: 0 1.7%;
        padding: 25px 2%;
        margin-bottom: 0;
    }

    nav li:first-child a {
        margin-left: 0;
    }

    nav li:last-child a {
        margin-right: 0;
    }

/* ========================
    INTERMEDIATE: IE Fixes
   ======================== */

    nav ul li {
        display: inline;
    }

    .oldie nav a {
        margin: 0 0.7%;
    }
}

@media only screen and (min-width: 768px) {

/* ====================
    WIDE: CSS3 Effects
   ==================== */

    .header-container,
    .main aside {

    }

/* ============
    WIDE: Menu
   ============ */

    .title {
        float: left;
    }

    nav {
        float: right;
        width: 38%;
    }

/* ============
    WIDE: Main
   ============ */

    .main article {
        float: left;
        width: 57%;
    }

    .main aside {
        float: right;
        width: 28%;
    }
}

@media only screen and (min-width: 1140px) {

/* ===============
    Maximal Width
   =============== */

    .wrapper {
        width: 1026px; /* 1140px - 10% for margins */
        margin: 0 auto;
    }
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}

#contactform {
width:980px;
height:7px;
background-color:#FFFFFF;
position:absolute;
top:0px;
z-index:1000;
font-family:"oswald";
font-size:14px;
}

#contactform img {
	margin-left:10px;
	margin-top:10px;
}

#contactfrm {
	width:450px;
	height:225px;
	float:right;
		line-height:15px;	
}

#contactfrm .title {
	font-family:"Oswald";
	font-size:20px;
	font-weight:bold;
	color:#000;
	text-transform:uppercase;
	margin-bottom:15px;
	margin-left:15px;
	margin-top:15px;
	clear:both;

}

#contactfrm input {
	width:188px;
	height:24px;
	border:1px solid #ccc9cd;
	margin:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	padding-left:15px;
	float:left;
}

#contactfrm textarea {
	width:407px;
	height:75px;
	min-width:407px;
	min-height:75px;
	max-width:407px;
	max-height:75px;
	border:1px solid #ccc9cd;
	margin:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	padding-left:15px;
}

#contactbtn {
background-image:url(../images/contactbtn.png);
background-repeat:no-repeat;
width:980px;
height:25px;
position:absolute;
bottom:-25px;
}

.contactbtn {
width:135px;
height:25px;
cursor:pointer;
margin:0 auto;
}

#logo {
background:url(../images/logo.png) no-repeat;
width:479px;
height:112px;
}

header #menu {
font-family:"Oswald";
font-size:14px;
font-weight:bold;
color:#FFF;
text-transform:uppercase;
margin-top:54px;


}

header #menu a {
text-decoration:none;
color:#FFF;
padding-left:5px;
padding-right:5px;
}

header #submenu a {
text-decoration:none;
color:#000;
padding-left:5px;
padding-right:5px;
}


footer #menu {
font-family:"Oswald";
font-size:12px;
font-weight:bold;
color:#FFF;
text-transform:uppercase;
margin-left:200px;
}


footer #menu a {
text-decoration:none;
color:#FFF;
padding-left:1px;
padding-right:1px;
}


#menu a:hover , #menu a.active {
color:#cccc00;
}

#submenu a:hover , #submenu a.active {
color:#fff;
}

#submenu {
background:url(../images/submenu.png) no-repeat;
width:298px;
height:25px;
float:right;
margin-right:250px;
margin-top:-2px;
clear:both;
font-family:"Oswald";
font-size:12px;
font-weight:bold;
color:#000;
text-transform:uppercase;
}

#bigbanner {
margin-top:32px;
}

.shadow {
background:url(../images/shadow.png) no-repeat;
width:980px;
height:47px;
margin-top:-5px;
}

#middle{
width:980px;
height:150px;
margin-top:150px;
}

.middle img:first-child {
margin-left:25px;
}

.middle {
width:980px;
height:150px;
float:left;
background-color:#333333;
z-index:50;
}

.middle img {
width:299px;
height:152px;
float:left;
margin-left:5px;
z-index:100;
margin-top:-110px;
border:1px solid #000;
cursor:pointer;
}

#icon1 {
background:url(../images/icon1.png) no-repeat;
width:27px;
height:32px;
float:left;
margin-left:30px;
margin-top:7px;
}

#icon2 {
background:url(../images/icon2.png) no-repeat;
width:27px;
height:23px;
float:left;
margin-left:275px;
margin-top:7px;
}

#icon3 {
background:url(../images/icon3.png) no-repeat;
width:200px;
height:24px;
float:left;
margin-left:280px;
margin-top:7px;
clear:right;
}

#middle .content {
width:280px;
height:50px;
float:left;
cursor:pointer;
}

#middle .content .title {
font-family:"Oswald";
font-size:20px;
color:#cccc00;
text-transform:uppercase;
}


#content .date {
	font-family:"Oswald";
	font-size:12px;
	color:#cbb22b;
	float:left;
	line-height:15px;
	margin-left:5px;
}

#middle .content .txt {
font-family:"Oswald";
font-size:12px;
color:#999999;
line-height:15px;
clear:both;
}

#bottom {
width:980px;
height:196px;
border:3px solid #000000;
border-left:none;
border-right:none;
}

#newsbox {
	width:276px;
	height:141px;
	float:left;
	margin-top:24px;
	
}

#newsbox .row {
	width:276px;
	height:75px;
	clear:both;
	cursor:pointer;
}

#newsbox .row .img {
width:66px;
height:67px;
border:1px solid #ddb809;
float:left;	
}

#newsbox .row .img img {
width:62px;
height:63px;
border:1px solid #FFF;
margin:1px;	
}

#newsbox .row .title {
	font-family:"Oswald";
	font-size:20px;
	font-weight:bold;
	color:#1f1f1f;
	margin-left:15px;
	margin-top:10px;
}

#newsbox .row .txt {
	font-family:"Oswald";
	font-size:11px;
	color:#6d6e71;
	line-height:15px;
	float:left;
	width:185px;
		margin-left:15px;
	margin-top:1px;

}

#videobox {
	width:300px;
	height:157px;
	border:1px solid #d0cdc7;
	float:left;
	margin-left:60px;
	margin-top:15px;	
}

#videobox .img {
	background:url(../images/play.png) no-repeat;
	width:112px;
	height:104px;
	position:relative;
	margin-left:100px;
	margin-top:30px;
	cursor:pointer;	
}

#videobox img {
	width:297px;
	height:153px;
	border:1px solid #ffffff;
	margin-top:-140px;
	
}

#demobox {
	font-family:"Oswald";
	font-size:12px;
	color:#6d6e71;
	line-height:15px;
	margin-left:60px;
	margin-top:35px;
}

#demobox .title {
	font-size:20px;
	color:#1f1f1f;
		margin-left:15px;
}

#demobox .txt {
	float:left;
		margin-left:15px;
		line-height:15px;
		margin-top:1px;
}

#demobox .txt a {
	font-family:"Oswald";
	font-size:12px;
	color:#6d6e71;
	
	text-decoration:none;
}

#demobox .txt a:hover {
	text-decoration:underline;
}

#proactive {
	background:url(../images/proactive.png) no-repeat;
	width:128px;
	height:38px;
	float:right;
	margin-top:50px;
	cursor:pointer;	
}

#submit {
	background:url(../images/submit.png) no-repeat;
	width:70px;
	height:25px;
	float:right;
	margin-right:20px;
	cursor:pointer;
}
.hide {
	display:none;	
}

#mainimage {
	background:url(../images/mainbg.png) no-repeat;
	width:980px;
	height:165px;
	float:left;
	margin-right:20px;
	cursor:pointer;
}

#mainimage img {
	width:642px;
	height:147px;
	margin-left:9px;
	margin-top:9px;
	float:left;

}

#mainimage #maintitle {
	font-family:"Oswald";
	font-size:20px;
	font-weight:bold;
	float:left;	
		margin-left:32px;
	margin-top:80px;
}

#content {
	width:650px;
	min-height:440px;	
	float:left;
}

#content .title {
	font-family:"Oswald";
	font-size:20px;
	font-weight:bold;
	color:#000;
	text-transform:uppercase;
	clear:both;
	margin-bottom:15px;	
}

#content .txt {
	font-family:"Oswald";
	font-size:14px;
	color:#6d6e71;
	text-align:justify;
	clear:both;
	line-height:18px;	
}


#nav {
	width:250px;
	height:250px;
	float:left;	
	margin-left:35px;
	margin-top:-40px;
	font-family:"Oswald"
	font-size:14px;
	line-height:15px;
}



#nav .row {
	width:230px;
	height:85px;
	cursor:pointer;
}

#nav .row img {
	width:120px;
	height:74px;
	float:left;
	border:1px solid #000;	
}

#nav .row .title {
	font-family:"Oswald";
	font-size:12px;
	color:#000;
	float:left;
	line-height:15px;
	margin-left:5px;
	margin-top:2px;
	text-transform:uppercase;
}

#nav .row .date {
	font-family:"Oswald";
	font-size:12px;
	color:#cbb22b;
	float:left;
	line-height:15px;
	margin-left:5px;
}

#nav .row .txt {
	font-family:"Oswald";
	font-size:12px;
	color:#666666;
	float:left;
	line-height:15px;
	width:44%;
	margin-left:5px;
}

.hr {
height:3px;
background-color:#000000;
margin-top:20px;
margin-bottom:20px;
}


/* main image box */
.mainthbbox {
	width:90px;
	height:83px;
	cursor:pointer;
	float:left;	
}

.mainthbbox2 {
	width:90px;
	height:83px;
	cursor:pointer;
	float:left;	
}

.mainthbbox2 .leftbg {
	background-image:url('../images/leftthbbox.png');
	background-repeat:no-repeat;
	width:2px;
	height:83px;
	float:left;
	clear:left;
}

.mainthbbox2 .bgx {
	background-image:url('../images/thbboxx.png');
	background-repeat:repeat-x;
	width:83px;
	height:83px;
	float:left;
}


.mainthbbox2 .bgx img {
	width:85px;
	height:81px;
	position:absolute;
	margin-top:1px;
	margin-left:-1px;
		
}

.mainthbbox2 .rightbg {
	background-image:url('../images/rightthbbox.png');
	background-repeat:no-repeat;
	width:2px;
	height:83px;
	float:left;
}
.mainthbbox .leftbg {
	background-image:url('../images/leftthbbox.png');
	background-repeat:no-repeat;
	width:2px;
	height:83px;
	float:left;
	clear:left;
}

.mainthbbox .bgx {
	background-image:url('../images/thbboxx.png');
	background-repeat:repeat-x;
	width:83px;
	height:83px;
	float:left;
}

.mainthbbox .bgx img {
	width:85px;
	height:81px;
	position:absolute;
	margin-top:1px;
	margin-left:-1px;
		
}

.mainthbbox .rightbg {
	background-image:url('../images/rightthbbox.png');
	background-repeat:no-repeat;
	width:2px;
	height:83px;
	float:left;
}

.mainthbbox:hover{
position:absolute;
background: url(../images/sprites.png) no-repeat!important;
	background-position: -5px -294px!important;
	width: 83px!important;
	height: 83px!important;
	z-index:1000;
	float:left;
	margin-left:1.5px;
}

/*
root element for the scrollable.  when scrolling occurs this
element stays still.
*/
.scrollable {
  /* required settings */
  position:relative;
  overflow:hidden;
  width: 590px;
  height:90px;
}
 
 
 .scrollable2 {
  /* required settings */
  position:relative;
  overflow:hidden;
  width: 680px!important;
  height:100px!important;
}
/*
root element for scrollable items. Must be absolutely positioned
and it should have a extremely large width to accommodate scrollable
items.  it's enough that you set width and height for the root element
and not for this element.
*/
.scrollable .items {
  /* this cannot be too large */
  width:20000em;
  position:absolute;
}


.scrollable2 .items {
  /* this cannot be too large */
  width:20000em;
  position:absolute;
}
 
/*
a single item. must be floated in horizontal scrolling.  typically,
this element is the one that *you* will style the most.
*/
.items div {
  float:left;
}

/* maintain */

.mainimgbox a {
	text-decoration:none!important;	
}

a[rel=lightbox] {
	text-decoration:none;	
}
#gal {
	width:540px!important;
	height:83px;
	margin-bottom:20px;	
}

.next{
background-image:url('../images/sprites.png');
	background-position: -151px -63px ;
	width: 11px;
	height: 17px;
	float:left;
	margin-top:30px;
	margin-left:5px;
	cursor:pointer;
}

.next:hover{
background-image:url('../images/sprites.png');
	background-position: -151px -108px ;
	width: 14px;
	height: 17px;
}

.prev{
background-image:url('../images/sprites.png');
	background-position: -115px -63px ;
	width: 11px;
	height: 17px;
	float:left;
	margin-right:5px;
	margin-top:30px;
	cursor:pointer;
}

.prev:hover{
background-image:url('../images/sprites.png');
	background-position: -119px -107px ;
	width: 11px;
	height: 17px;
}

#blackbox {
width:650px;
height:390px;
background-color:#000000;
}

/* download pdf */
.downloadpdf {
	background-image:url('../images/pdficon.png');
	background-repeat:no-repeat;
	background-position:left center;
	width:105px;
	height:50px;
	float:left;
	margin:10px;
	margin-left:55px;
	margin-right:55px;
	cursor:pointer;
}


.downloadpdf .title {
	font-family:"Oswald";
	font-size:13px;
	color:#084897;
	margin-left:45px;
	margin-top:8px;
	line-height:15px;
}

.downloadpdf .date {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#6d6e71;
	margin-left:45px;
	line-height:15px;	
}

#galpdf {
	width:680px;
	margin-bottom:60px;	
}

.line .downloadpdf {
	margin-right:80px;
	float:left;
	margin-bottom:50px;
	cursor:pointer;	
}