@font-face {
    font-family: 'open_sansregular';
    src: url('opensans-regular-webfont.eot');
    src: url('opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('opensans-regular-webfont.woff') format('woff'),
         url('opensans-regular-webfont.ttf') format('truetype'),
         url('opensans-regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'open_sans_lightregular';
    src: url('opensans-light-webfont.eot');
    src: url('opensans-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('opensans-light-webfont.woff') format('woff'),
         url('opensans-light-webfont.ttf') format('truetype'),
         url('opensans-light-webfont.svg#open_sans_lightregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

html,body {
	margin: 0;
	padding: 0;
	border:0;
	font-family: "open_sansregular",sans-serif;
	color: #5f6062;
}

h2 {
	margin: 0;	
	font-family: "open_sans_lightregular",sans-serif;
	size: 13px;
	font-weight: normal;
}

h3 {
	margin: 0;
	font-family: "open_sans_lightregular",sans-serif;
	font-size: 30px;
	font-weight: normal;
	padding: 0;
	color: #5f6062;
}


p {
	margin:0;
	color: #5f6062;
	font-size: 13px;
	line-height: 22px;
}


img {

	border: 0px;
}

.constrain {
	width:950px;
	margin-left:auto;
	margin-right:auto;
	position: relative;
}	

.constrain-content {
	width:950px;
	margin-left:auto;
	margin-right:auto;
	background-image:url('/img/valve-shadow.png');
	background-repeat:no-repeat;
	background-position:right top;
	min-height: 440px;
	padding-bottom: 20px;
	position: relative;
}

/****************/
/**** !HEADER ****/
/****************/
#header {
	background: #d9e34b;
	height:100px;
	position: relative;
}

.menu-root {
	color: #5f6062;

	text-decoration: none;
	padding-left:10px;
}

#logo {
	width:550px;
	height:67px;
	background-image: url('/img/header-logo.png');	
	background-repeat: no-repeat;
	
}

#logo h2 {
	font-size: 15px;
	padding: 20px 0px 0px 140px;
}

#header-links {
	width: 	400px;
	position: relative;
	vertical-align:top;
	margin-left: 547px;

	}
	
#header-settings {
	font-size: 12px;
	padding-top: 5px;
	padding-bottom: 5px;
	width: 	320px;
	position: relative;
	text-align:right;
	margin-top:-60px;	
	margin-left: 600px;
/*	border:1px solid red; */
}

#header-settings a {
	vertical-align:top;
	text-decoration: none;
	color:#5f6062;
}

.menu-popover {
	background: white;
	border: 2px solid #a7a9aa;
	border-radius: 5px;
	width: 180px;
	padding: 3px;
	position: absolute;
	top:40px;
	left: 0px;
	z-index: 998;
}

.menu-popover a {
	margin: 0;
	display: block;
	text-decoration: none;
	color:#5f6062;
	padding: 3px 0px 3px 6px;
}

.menu-popover a:hover {
	color: white !important;
	background-color: #5f6062;

}

.arrow {
	position: absolute;
	top: 21px;
	z-index: 999;
}

.current-section {
	color: black;
	font-weight: bold;
}

/* IFU menu */
.ifu {
	text-align: left;
	width: 200px;
	left:220px;
	top:50px;
	font-size:15px;
}

.ifu-separator {
	padding-left:2px;
	font-family: 'open_sansregular', sans-serif;
	font-size: 12px;
	color:black;
}

/*******************/
/**** CONTENT ******/
/*****************/

#content {
	background: #d5e041;
	background-image: url('/img/main-gradient.png');
	background-repeat: repeat-x; 
	min-height: 450px;
	border-top:5px solid white;	
}

#white-box-smaller {
	background: white;
	border: 10px solid #132f5e;
	border-radius: 10px;	
	height: 190px;
	width:600px;
	margin-top: 85px;
	margin-left:auto;
	margin-right: 100px;
	padding: 15px;
	position: relative;	
	box-shadow: 2px 4px 10px 2px #3e3e3e;
}

.logo {
	float:left;
	padding:20px;
	}

#white-box {
	background: white;
	border: 10px solid #132f5e;
	border-radius: 10px;	
	min-height: 190px;
	width:800px;
	margin-left:auto;
	margin-right: auto;
	padding: 15px 15px 15px 15px;
	position: relative;	
	box-shadow: 2px 4px 10px 2px #3e3e3e;
}


#white-box-tabs {
	background: white;
	border: 10px solid #132f5e;
	border-radius: 10px;	
	min-height: 190px;
	width:800px;
	margin-left:auto;
	margin-right: auto;
	padding: 0px 15px 0px 15px;
	position: relative;	
	box-shadow: 2px 4px 10px 2px #3e3e3e;
}


.white-box-header {
	margin-top: 25px;
	padding-left:55px;
	padding-bottom: 10px;
}


.white-box-footer {
	height: 40px;
	width: 100%;
	border-top: 1px solid #5f6062;
	vertical-align:bottom;
	position: absolute;
	bottom: 0px;
	left:0px;
	padding-top:10px;
}

.tab-box-footer {
	display:block;
	font-size: 11px;
	padding-bottom: 7px;
	margin-left:-70px;
	width:780px;
/*	border: 1px solid red; */
	}
	
.tab-box-footer-news {
	display:block;
	font-size: 11px;
	padding-bottom: 7px;
	width:600px;
/*	border: 1px solid red; */
	}	
	
.white-box-smaller-footer {
	display:block;
	font-size: 11px;
	padding-bottom: 7px;
	margin-left:-10px;
	width:630px;
/*	border: 1px solid red; */
	}

.footer-border {
	width:830px;
	margin-left:-90px;
}

.footer-border-news {
	width:640px;

}

.footer-border-smaller {
	width:630px;
	margin-left:-15px;
}

#news {
	background: #dfe0e1;
	width: 100%;
	height:150px;
	border-top:5px solid white;
}

#news a:hover {
	color:orange;
	}
	
.newslink  {
	font-weight:bold;
	color:#002d59;
	text-decoration: none;
}


#stripe {
	background: #d8e24a;
	border-top:5px solid white;
	height: 10px;
}

#footer {
	border-top:5px solid white;	
	background: #dfe0e1;
	width: 100%;
	height:250px;
}

.headline  {
	text-decoration: none;
	color:#5f6062;
}

.headline a:hover {
	color:orange;
}

/************************************/
/* !LEADERSHIP */
/************************************/
.bio {
	display:block;
	float:left;
	width:500px;
	padding: 0px 0px 15px 10px;	
}

.bio-img {
	padding-top: 6px;
	float:left;
	}

/************************************/
/* CONTACT US */
/************************************/

#left-side {
	width:320px;
	height: 290px;
	float:left;
	border-right:1px solid #5f6062;
}

#right-side {
	width:290px;
	height: 290px;	
	float:left;
	padding-left: 10px;
	border-right:1px solid #5f6062;
}

.address {

	float:right;
}

/************************************/
/* !TAB PANES */
/* tab pane styling */
/************************************/
.panes div {
    display:none;
    padding-top: 15px;
    font-size:14px;
    width:650px;
    margin-left: auto;
    margin-right: auto;
    background-color:#fff;
}

.panes a {
	text-decoration: none;
	font-weight:bold;
	color: #002d59;
}

.panes a:hover {
	color:orange;
}


/* root element for tabs  */
ul.tabs {
    list-style:none;
    margin:0 0 0 76px!important;
    padding:0;
    height:30px;

}

/* single tab */
ul.tabs li {
    font-size:15px;
    float:left;
    text-indent:0;
    padding:0;
    margin:0 !important;
    list-style-image:none !important;
}


ul.tabs a {
    display:block;
    height: 30px;
    line-height:30px;
    width: 100px;
    text-align:center;
    text-decoration:none;
    color:#5f6062;
    padding:0px;
    margin:0px;
    position:relative;
 
}

ul.tabs a:active {
    outline:none;
    background: #132f5e;
    color:white !important;
    font-weight: bold;
    border-radius: 0px 0px 4px 4px;	
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover {

    color:#000;
}

/* active tab uses a class name "current". its highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
	background: #132f5e;
    border-radius: 0px 0px 4px 4px;	
    cursor:default !important;
    color:white !important;
    font-weight: bold;    
}

.panes .pane {
    display:none;
}

li {
	font-size: 13px;
	}

/************************************/
/* !TABLE STYLES */
/************************************/
table {
	text-align: center;
	border-collapse: collapse;
	color:#002d59;
	font-size: 16px;
	margin: 20px 0px 20px 0px;
}

td {
	padding: 4px;
	}
	
td+td {
	border-left: 1px solid #002d59;
}

tr.table-header td  {
	background-color: #002d59;
	color:white;
	font-weight:bold;
}

tr.white-row td  {
	background-color: white;
	border-top: 1px solid #002d59;
	padding: 9px;
}	

tr.green-row td {
	background-color: #d9e34b;
	border-top: 1px solid #002d59;	
	padding: 9px;
}

/************************************/
/* !BALLOON INFO STYLES */
/************************************/
#balloon-info {
	background-image:url('/img/balloon-without-text-update.png');
	background-repeat:no-repeat;
	background-position:right top;
	display:block;
	float:left;
	width: 500px;
	height:600px;

}

#tav8-balloon-info {
	background-image:url('/img/tav8_bg2.png');
	background-repeat:no-repeat;
	background-position:right top;
	display:block;
	float:left;
	width: 500px;
	height:800px;

}

.balloon-header {
	font-weight:bold;
	display: block;
	padding: 0px;
	color:#002d59;
}

.balloon-text {
	display: block;
	width: 340px;
	padding: 0px;
	}
	
/************************************/
/* !RESOURCES */
/************************************/	
.resources-thumb {
	float:left;
	width:52px;
	height:70px;
	padding:3px 5px 3px 3px;
}

.resources-thumb-border {
	float:left;
	width:52px;
	height:70px;
	padding:3px 3px 3px 3px;
	border: 1px solid #132f5e;
	margin-right:5px;
}

.resources-vid-thumb {
	float:left;
	width:75px;
	height:56px;
	padding:3px 5px 3px 3px;
}

.split {
	display:block;
	clear:both;
	width:600px;
	height: 8px;
}
/************************************/
/* !VID OVERLAY STYLES */
/************************************/
#vid-overlay {
	display:none;
	position:absolute;
	top: 100px;
	left:50%;
	margin-left: -307px;
	background-color: rgba(0,0,0,0.42);
	width:610px;
	height:338px;	
	padding:30px;
}

#vid-overlay2 {
	display:none;
	position:absolute;
	top: 100px;
	left:50%;
	margin-left: -307px;
	background-color: rgba(0,0,0,0.42);
	width:610px;
	height:338px;	
	padding:30px;
}

#close-vid {
	display: block;
	top: 0px;
	right: 0px;
	width: 15px;
	height: 15px;
	position: absolute;
	padding: 0px 10px 10px 10px;
	background:rgba(0,0,0,0.4);
	color:white;
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	vertical-align: top;
	text-decoration: none;
}

#close-vid2 {
	display: block;
	top: 0px;
	right: 0px;
	width: 15px;
	height: 15px;
	position: absolute;
	padding: 0px 10px 10px 10px;
	background:rgba(0,0,0,0.4);
	color:white;
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	vertical-align: top;
	text-decoration: none;
}

.procedure-img {
padding-right:15px;
float:left;
}


/**************
Scrollable add
	*************/
	
	

/* prev, next, prevPage and nextPage buttons */
a.browse {
    background:url(/img/hori_large.png) no-repeat;
    display:block;
    width:30px;
    height:30px;
    cursor:pointer;
    font-size:1px;
}

/* right */
a.right { background-position: 0 -30px;
	 clear:right; 
	 margin-right: 0px; 
	 z-index:99;
	margin-top:-25px;
	 margin-left: 0px;
	margin-right: 80px;
	margin-top:-28px;
	float:right;
	 }
a.right:hover { background-position:-30px -30px; }
a.right:active { background-position:-60px -30px; }


/* left */
a.left { 
	margin-top:-28px;
	margin-left:30px;
    z-index:99;}
a.left:hover  { background-position:-30px 0; }
a.left:active { background-position:-60px 0; }

/* disabled navigational button */
a.disabled {
    visibility:hidden !important;
}


/*
  root element for the scrollable.
  when scrolling occurs this element stays still.
  */
#news-box {
	margin-left:auto;
	margin-right:auto;
	background: white;
	border: 10px solid #132f5e;
	border-radius: 10px;	
	width: 800px;
	min-height: 190px;
	box-shadow: 2px 4px 10px 2px #3e3e3e;	
	}
  
.newsitem {
	width:650px;
	padding: 0px 20px 0px 20px;
	}  
.scrollable {
    /* required settings */
    position:relative;
    overflow-x:hidden;
    overflow-y:auto;
    width: 700px;
	height: 880px;
  	margin-left:auto;
	margin-right: auto;
}

.scrollable .items {
    /* this cannot be too large */
    width:20000em;
    position:absolute;
    clear:both;
}

.items div {
    float:left;
    width:700px;
}