body { margin:0; padding:0; font-size:13px; color:#666666; background-color:#CCCCCC; font-family: 'Open Sans', sans-serif; }

a { color:#006699; text-decoration:none;}

a:hover { text-decoration:underline;}


hr { border:none; height:1px; background-color:#CCCCCC; padding:0px; margin-top:10px;margin-bottom:10px;}

h1 { font-size:26px; color:#006699; padding:0; margin:0;}
h2 { font-size:14px; color:#666666;padding:0; margin:0;}



.header { background-color:white; width:100%; border-bottom:1px solid #eee;  margin-bottom:30px; }
.headerinner { width:900px; margin:0 auto;  padding-bottom:10px;padding-top:10px;}
.heading {
font-size: 26px; color: rgb(0, 102, 153); padding: 0px; margin: 0px; font-family: "Open Sans", sans-serif; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;}
.subHeading {
    font-size: 14px; color: rgb(102, 102, 102); padding: 0px; margin: 0px; font-family: "Open Sans", sans-serif; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;}
.content { 
color: rgb(102, 102, 102); font-family: "Open Sans", sans-serif; font-size: 13px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: justify; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;}
.topmostmenu { float:right; width:70px;

}

.topmenu { width:900px; margin:0 auto; background-color:#006699; border-top:5px solid #004f76;}

.pic img { border:solid 1px #e6e6e6; padding:10px; box-shadow: 0px 0px 7px 0px rgba(122, 122, 122, 0.22);
-moz-box-shadow: 0px 0px 7px 0px rgba(122, 122, 122, 0.22);
-webkit-box-shadow: 0px 0px 7px 0px rgba(122, 122, 122, 0.22); }

.main {
    width: 840px; /*margin:0 auto; background-color:white; padding:30px; box-shadow: 0px 0px 10px 2px rgba(122, 122, 122, 0.6);
-moz-box-shadow: 0px 0px 10px 2px rgba(122, 122, 122, 0.6);
-webkit-box-shadow: 0px 0px 10px 2px rgba(122, 122, 122, 0.6); margin-bottom:15px;*/
    background-color: white;
    padding: 30px;
    box-shadow: 0px 0px 10px 2px rgba(122, 122, 122, 0.6);
    -moz-box-shadow: 0px 0px 10px 2px rgba(122, 122, 122, 0.6);
    -webkit-box-shadow: 0px 0px 10px 2px rgba(122, 122, 122, 0.6);
    margin-bottom: 15px;
    height: 500px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
   
}

.info { float:inherit; width:530px; margin-left:255px; margin-top:unset;}

.leftcol { float:left; width:250px; }
.rightcol {margin-left:0px; float:right; width:580px; }


.leftmenu { margin-top:20px;}


.footer { width:100%; /*padding-top:20px; text-align:center; padding-bottom:20px;*/
           padding-top: 25px;
            text-align: center;
            padding-bottom: 20px;
            margin-top: 33px;
            /*float:right;*/
}



.mattblacktabs{
width: 100%;
overflow: hidden;

}

.mattblacktabs ul{
margin: 0;
padding: 0;
padding-left: 10px; /*offset of tabs relative to browser left edge*/

list-style-type: none;
}

.mattblacktabs li{
display: inline;
margin: 0;
}

.mattblacktabs li a{
float: left;
display: block;
text-decoration: none;
margin: 0;
padding: 15px 15px; /*padding inside each tab*/

color: white;

}

.mattblacktabs li a:visited{
color: white;
}

.mattblacktabs li a:hover, .mattblacktabs li.selected a{

}


/*left menu*/


.arrowlistmenu{
width: 230px; /*width of menu*/
}

.arrowlistmenu .headerbar{

color: #333333;

margin-bottom: 10px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 4px 0 4px 0px; /*header text is indented 10px*/
}

.arrowlistmenu ul{
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li a{
color: #006699;

display: block;
padding: 2px 0;

text-decoration: none;

border-bottom: 1px solid #ededed;
font-size: 90%;
}

.arrowlistmenu ul li a:visited{
color: #006699;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #666666;
text-decoration:underline;
}




/*split menu*/



div.css3splitmenu {
    position: relative;
    display: inline-block;
    margin-right: 28px; /* margin to make room for menu toggler (generated content) */
	 margin-top: 11px; 
    }

div.css3splitmenu > a, div.css3splitmenu > a:after { /* style main button plus split menu toggler */
    color: white;
    position: relative;
    background: #c3c3c3; /* bg color of button */
    text-decoration: none;
   
    
    display: block;
    padding: 8px;
    line-height: 1em;
    }


div.css3splitmenu > a:hover {
    background: #006598;  /* hover color for menu button */
    }

div.css3splitmenu > a:after { /* split menu toggler CSS (generated content) */
    content: "\25be"; /* down arrow HTML entity */
    position: absolute;
    left: 101%; /* the extra 1 % is so there's a bit of a gap next to menu button */
    top: 0;
    cursor: pointer;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topleft: 0;
    border-top-left-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-left-radius: 0;
    }

div.nocss3splitmenu > a:after { /* if this class is defined on a button, hide split menu toggler */
		content: '';
		display: none;
		}

div.css3splitmenu > input[type=checkbox] { /* style input control that will act as actual toggler control */
    position: absolute;
    left: 101%;
    top: 0;
    opacity: 0; /* make it invisible yet still respond to mouse events */
    width: 25px; /* width of control */
    height: 100%;
    cursor: pointer;
    }

div.css3splitmenu > ul { /* style drop menu UL */
    position: absolute;
		-moz-transform: scaleY(0) translateY(10px);
		-ms-transform: scaleY(0) translateY(10px);
		-webkit-transform: scaleY(0) translateY(10px);
		transform: scaleY(0) translateY(10px);
		-moz-transform-origin: top;
		-webkit-transform-origin: top;
		transform-origin: top;
    opacity: 0;
    background: white;
    min-width: 170px; /* minimum width of menu */
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid #e5e5e5;
    
    }

div.css3splitmenu > input[type=checkbox]:checked ~ ul { /* UL style when user clicks on input menu toggler */
		z-index: 100;
    opacity: 1;
		-moz-transform: scaleY(1) translateY(12px);
		-ms-transform: scaleY(1) translateY(12px);
		-webkit-transform: scaleY(1) translateY(12px);
		transform: scaleY(1) translateY(12px);
    -moz-transition-delay: 0; /* Set transition delay for "focus" state to 0 */
    -ms-transition-delay: 0;
    -webkit-transition-delay: 0;
    transition-delay: 0;
    }

div.css3splitmenu > ul li {
    border-bottom: 1px solid #e5e5e5; /* add border to the end of each li within UL */
    }

div.css3splitmenu > ul li a { /* style each link within drop down menu */
    display: block;
    padding: 7px 8px;
    color: black;
    text-decoration: none;
    }


div.css3splitmenu > ul li a:hover {
    background: #e5e5e5;
    }

div.css3splitmenu > ul:before { /* outer arrow of drop down menu (black) */
    content: "";
    display: block;
    position: absolute;
    top: -14px; /*should be set to -border-width x 2 */
    left: 30px;
    width: 0;
    height: 0;
    border-color: transparent transparent  #e5e5e5 transparent; /*border color should be same as div div background color*/
    border-style: solid;
    border-width: 7px;
    }

div.css3splitmenu > ul:after { /* inner arrow (white), so the two arrows overlap, forming a bordered arrow */
    content: "";
    display: block;
    position: absolute;
    top: -12px; /*should be set to -border-width x 2 */
    left: 31px;
    width: 0;
    height: 0;
    border-color: transparent transparent white transparent; /*border color should be same as div div background color*/
    border-style: solid;
    border-width: 6px;
    }