@import url(http://fonts.googleapis.com/css?family=Open+Sans:800,600,400,300);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700);

body{
  	height: 100%;
	margin: 0px;
	color: #606060;
	font-size: 14px;
	font-family: "Open Sans", Tahoma, Helvetica, Arial;
}
.body{
	cursor: default;
  	background-color: #404040;
}

td{font-size: 14px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
p{margin: 10px 0px 20px 0px;}
div{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
input[type="text"], input[type="textbox"], input[type="password"]{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
select{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
textarea{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

img{border: 0}
hr{height: 1px; background-color: #000000; border: 0;}

h1{font-size: 34px; font-weight: normal; color: #000; margin: 0; margin-bottom: 20px;}
h2{font-size: 28px; font-weight: normal; color: #000; margin-top: 10px; margin-bottom: 20px;}
h3{font-size: 22px; margin: 10px 0px; color: #000; font-weight: normal;}
h4{font-size: 18px; margin: 6px 0px; font-weight: normal;}
h5{font-size: 16px; margin: 6px 0px; font-weight: normal;}

a, a:visited{
	color: #00b2cd;
	text-decoration: none;
	outline: none;
	font-weight: 600;
	-o-transition: .3s;
	-ms-transition: .3s;
	-moz-transition: .3s;
	-webkit-transition: .3s;
	transition: .3s;
}
a:hover{color: #231f20; text-decoration: none;}
a:focus{outline: none}
a img{vertical-align: middle;}

a.but{display:inline-block; display:-moz-inline-block; width: 230px; padding: 20px 0px; margin: 10px; background: #00b2cd url("img/butbg.png") repeat-x; font-size: 18px; color: #fff; text-align: center; font-weight: bold}
a.but:hover{background: #00b2cd url("img/butbghover.png") repeat-x;}
a.but:visited{color: #fff;}
a.but2{display:inline-block; display:-moz-inline-block; padding: 10px; margin: 10px; border: 1px solid #00b2cd; font-size: 16px; color: #606060; text-decoration: underline; text-align: center;}
a.but2:hover{background-color: #f6f6f6; color: #000; text-decoration: underline;}

a.icon, a.icon:visited{display:inline-block; display:-moz-inline-block; outline: none; margin: 0px -1px; padding: 4px; background-color: #f5f5f5; border: 1px solid #e5e5e5; text-decoration: none; font-size: 90%;}
a.icon:hover{border: 1px solid #00b2cd; text-decoration: none}
a.icon:focus{outline: none}
a.icon.highlighted{font-weight: bold; border-color: #00b2cd !important;}


form{margin: 0; padding: 0}
input[type="text"], input[type="textbox"], input[type="password"], select, textarea{
	font-family: "Open Sans", Tahoma, Helvetica, Arial;
	font-size: 14px;
	vertical-align: middle;
	padding: 6px;
	border: 1px solid #c0c0c0;
	border-radius: 2px;
	box-shadow: 0 0 3px #fff;
}
input[type="text"]:focus, input[type="textbox"]:focus, input[type="password"]:focus, select:focus, textarea:focus{
	border-color: #00b2cd;
	box-shadow: 0 0 3px #404040;
}
input.readonly, select.readonly, textarea.readonly{border: 1px solid #e0e0e0; background-color:#f0f0f0 !important; color:#303030 !important;}


/* --- TEMPLATE --- */
#outertable{background-color: #fff;}
#innertable{}

#banner{background-color: #fff;}
#banner-content{
	width: 75%; min-width: 1000px; max-width: 1500px;
	height: 100%;
	margin: auto;
	padding: 0px 15px;
	overflow: hidden;
}
#banner-content-left{float:left; width:50%; height:100%; text-align: left; padding-top: 20px;}
#banner-content-right{float:right; width:50%; height:100%; text-align: right; padding-top: 20px;}

#body-container{}
#body-innertable{
	width: 75%; min-width: 1000px; max-width: 1500px;
	background-color: #fff;
	border-radius: 15px;
	margin: 15px 0px;
}
#body-content{padding: 25px 15px 35px 15px;}
#body-content h2{background: transparent url('images/arrow_blue.png') no-repeat center left; padding-left: 30px; margin-top: 20px;}
#body-content-portal{padding: 15px 15px 30px 15px;}

#footer{background-color: #231f20;}
#footer-content{
	width: 75%; min-width: 1000px; max-width: 1500px;
	height: 180px;
	padding: 30px 15px 0px 15px;
	margin: auto;
	font-size: 90%;
	color: #808080;
	text-shadow: 1px 1px #000; filter: DropShadow(Color=#000, OffX=1, OffY=1);
	line-height: 200%;
	text-align: left;
}
#footer-content a{color: #808080;}
#footer-content a:hover{color: #fff;}
#footer-left{
	float: left;
	width: 71%;
	padding: 0px 30px 15px 0px;
}
#footer-right{
	float: left;
	width: 29%;
	padding: 0px 0px 15px 0px;
	text-align: right;
}
#footer-right h1{font-size: 260%; color: #00b2cd;}
#footer-mainlinks{margin-bottom: 20px;}
#footer-mainlinks li { display: inline-block; list-style-type: none; margin-right: 25px;}
#footer-mainlinks a{font-size: 110%; color: #fff; text-transform: uppercase;}
#footer-mainlinks a:hover{color: #00b2cd;}
#footer-mainlinks div { display: none; }


#footer-sublinks li { display: none; }
#footer-sublinks li:first-child { display: block; }
#footer-sublinks li > a { display: none; }
#footer-sublinks li a { margin-right: 10px; }

/* --- NAVIGATION BAR --- */

#nav-bar{background-color: #00b2cd; color: #000;}
#nav-bar a, #nav-bar a:visited{color: #000}
#nav-content{
	width: 75%; min-width: 1000px; max-width: 1500px;
	margin: auto;
	padding: 0px 15px;
	position: relative;
}
#nav-content-right{float: right; width: 300px; text-align: right; padding-top: 0px; font-size: 180%; color: #231f20;}
#nav-menu{
	float: left;
	position: relative;
	z-index: 1100;
	margin: 0;
	padding: 0;
}
#nav-menu li{
	float: left;
	margin: 0;
	list-style: none;
	font-size: 100%;
}
#nav-menu li a{
	display: block;
	padding: 6px 10px;
	color: #fff;
	font-size: 120%;
	font-weight: normal;
	text-align: left;
	text-transform: uppercase;
	margin-right: 5px;
	line-height: 30px;
	border-radius: 6px;
}
#nav-menu li a:hover{background-color: #231f20; color: #fff;}
#nav-menu li a:active{}
#nav-menu li a:visited{color: #fff}
#nav-menu li a.selected{background-color: #fff; color: #00b2cd}
#nav-menu li > div { display: none; }

/* --- SIDE MENU --- */

#sidebar{padding: 25px 15px 25px 15px;}
#sidemenu-box{
	padding: 15px 0px;
	background-color: #f0f0f0;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
}
#sidemenu{margin: 0; padding: 0;}
#sidemenu li{
	margin: 0;
	list-style: none;
}
#sidemenu a{
	position: relative;
	display: block;
	padding: 10px;
	color: #000;
	text-align: left;
	font-size: 120%;
	font-weight: 300;
	border-bottom: 1px solid #e0e0e0;
}
#sidemenu li:last-child{border: 0;}
#sidemenu a:hover{background-color: #231f20; color: #fff;}
#sidemenu a:active{background-color: #fff;}
#sidemenu a.selected{background-color: #fff; color: #00b2cd; font-weight: normal;}

#sidemenu li a:after {
    content: "";
    width: 0; height: 0;
    position: absolute;
    left: 94%; top: 50%;
    margin-top: -5px;
    border-color: transparent transparent transparent #000;
    border-style: solid;
    border-width: 5px;
}
#sidemenu li a:hover:after{border-left-color: #fff;}

#sidemenu li { display: none; }
#sidemenu li:first-child { display: block; }
#sidemenu li > a { display: none; }

/* --- SITE-SPECIFIC GENERAL --- */

a.button_quote img{border: 5px solid #99d332; border-radius: 5px;}
a.button_quote:hover img{border-color: #84bd1f;}

#home-top{overflow: hidden;}
#home-top h1{font-size: 200%; color: #53b7e8; margin: 10px 0px 25px 0px; font-weight: normal;}
#home-top-left{float: left; padding-right: 10px; padding-top: 10px;}
#home-top-right{float: right; padding-left: 15px; padding-top: 20px;}
#home-top-right ol{margin-left: 0; padding-left: 1.5em}
#home-top-right ol li{margin-left: 0; padding-left: 0; font-size: 110%; line-height: 200%; color: #006ca2;}
#home-top-right ol li span{color: #000;}
#home-mid{height: 137px; clear: both; padding-top: 20px; background-color: #36a1d6; overflow: hidden;}
#home-mid h1{font-size: 190%; color: #fff; font-weight: bold; line-height: 120%; text-shadow: 1px 1px #000; filter: DropShadow(Color=#000, OffX=1, OffY=1)}
#home-bot td{line-height: 200%; font-size: 110%; color: #808080;}
#home-bot h2{margin-top: 30px;}

.darkbox{
	margin: 25px 0px;
	padding: 10px 10px;
	background-color: #231f20;
	color: #fff;
	border-radius: 6px;
}

.bluebox{
	padding: 10px 10px;
	background-color: #00b2cd;
	color: #fff;
	font-size: 130%;
	font-weight: bold;
	line-height: 180%;
	border-radius: 6px;
    
}
.bluebox a{color: #fff;}
.bluebox a:hover{color: #231f20;}

#loginbox{
	color: #a4a4a4;
	text-align: right;
}

li.bullets_none{list-style: none;}
li.bullets_square{list-style: square;}

.vTop{vertical-align: top !important;}
.txtlogin{display:inline; vertical-align: middle; font-size: 11px;}
.underline{border: 0px solid #000; border-bottom-width: 1px;}
.required{color: #ff0000 !important;}
.bold{font-weight: bold !important;}

.date{font-family: 'Roboto Condensed' !important; font-size: 110%;}
.currency{font-family: 'Roboto Condensed' !important; font-size: 110%;}

.small{font-size: 80% !important}
.medium{font-size: 120% !important;}
.large{font-size: 130% !important;}
.xlarge{font-size: 150% !important;}

.blue{color: #00b2cd !important}
.bluebg{background-color: #00b2cd !important}
.black{color: #231f20 !important}
.blackbg{background-color: #231f20 !important}
.green{color: #83cd23 !important}
.greenbg{background-color: #83cd23 !important}
.lgray{color: #e4e4e4 !important}
.lgraybg{background-color: #e4e4e4 !important}
.gray{color: #a4a4a4 !important}
.graybg{background-color: #a4a4a4 !important}
.dgray{color: #808080 !important}
.dgraybg{background-color: #808080 !important}
.red{color: #aa0000 !important}
.redbg{background-color: #aa0000 !important}
.yellow{color: #ffdc73 !important}
.yellowbg{background-color: #ffdc73 !important}

/* --- colors Rick added --- */
.mgraybg{background-color: #d9d9d9 !important}

#loadimg{visibility: hidden; position: absolute; height: 100%; width: 100%; top: -100%; left: -100%;}
#loadbox{visibility: hidden; position: absolute; width: 400px; height: 100px; top: -100%; left: -100%; text-align: center; background-color: #00b2cd; color: #fff; border: 1px solid #000; font-size: 14px;}
#formbox{width: 100%;}
#newmemberform h1{font-size: 40px; font-weight: 600; color: #00b2cd; margin: 0; margin-bottom: 10px;}
#newmemberform h3{font-size: 20px; font-weight: bold; color: #000; margin-top: 0px; margin-bottom: 20px;}
#tokenbox{margin: 8px 0px; padding: 5px; background-color: #f0f0f0;}
.infobox{width: 100%; border: 1px solid #00b2cd; margin: 15px 0px; border-radius: 8px;}
.infobox p{padding: 10px; font-size: 14px; margin: 0}
.helptext{color: #707070; font-style: italic; font-size: 12px;}

div.success{display: block; margin-bottom: 10px; background-color: #d3ff73; border: 1px solid #b7e750; border-radius: 5px; color: #1d9a00;}
div.error{display: block; margin-bottom: 10px; background-color: #ffd3d6; border: 1px solid #ffafb4; border-radius: 5px; color: #e71c2f;}
div.info{display: block; margin-bottom: 10px; background-color: #d7f4ff; border: 1px solid #a3e6ff; border-radius: 5px; color: #0080b0;}
div.msg{padding: 10px; font-weight: 800; text-shadow: 1px 1px #fff; filter: DropShadow(Color=#fff, OffX=1, OffY=1);}
input.error{background-color: #ffdede !important; color: #000 !important}
textarea.error{background-color: #ffdede !important; color: #000 !important}
select.error{background-color: #ffdede !important; color: #000 !important}
input.locked{border: 1px solid #d0d0d0; background-color: #f0f0f0 !important; color: #000 !important;}


#tblLetter img{vertical-align: middle;}
.tblData td{vertical-align: middle; border-bottom: 1px solid #eeeeee;}
.tblMembership td{vertical-align: middle; font-size: 120%; color: #000;}
.tdHeader{background-color: #f6f6f6; padding: 5px; font-weight: 800; font-size: 120%; border-bottom: 0 !important}
.tdHeader a{color: #000;}
.tdHeader2{background-color: #00b2cd; color: #fff; font-size: 110%; padding: 5px;}
.tdHeader2 a, .tdHeader2 a:visited{color: #d2eef6;}
.tdHeader2 a:hover{color: #fff;}
.tdField{background-color: #f6f6f6; padding-left:5px; font-weight: 600; padding-right: 10px; text-align: centre}
.tdFieldSpan{font-size: 120%; padding: 10px; color: #000}


/* ------ BUTTONS ------ */
a.button, a.button:visited{
	display:inline-block; display:-moz-inline-block;
	padding: 8px;
	background-color: #00b2cd;
	color: #fff;
	border: 1px solid #009db5;
	border-radius: 3px;
	box-shadow: 0 0 3px #fff;
	text-decoration: none;
	outline: none;
}
a.button:hover{background-color: #00c3e0; border-color: #00b2cd; box-shadow: 0 0 3px #404040;}
a.button:active{background-color: #00b2cd; border-color: #00b2cd;}
a.button:focus{outline: none}
a.button.highlighted{font-weight: bold; border-color: #00b2cd !important;}