* {padding:0; margin:0;}

img, div { behavior: url(iepngfix.htc) }

img {border: 1px solid #555;}

p {margin-bottom: 15px;}
ul {list-style: none;}
html {
background: #353b82 url(http://kbimembers.com/assets/images/bg.png) repeat-x;
font-family: Arial;
font-size: 11px;
color: #505050;
}

body { height: 100%; }
html>body { height: auto; }



#main_wrapper {
width: 980px;
margin-left: auto;
margin-right: auto;
}

div#main_wrapper {overflow:hidden; display: inline-block;} div#main_wrapper{display:block;}

#header {
height: 56px;
background: transparent url(../images/header.jpg) repeat-x;
margin-left: auto;
margin-right: auto;
margin-bottom: 40px;
}

#nav {
float: right;
margin-top: 35px;
list-style: none;
font-size: 1em;
font-weight: bolder;
color: white;
}

#nav li {float: left; margin-right: 15px; border-right: 1px solid white; padding-right: 15px; height: 15px;}
#nav a {
float: left;
display: block;
text-decoration: none;
color: white;
height: 15px;
}

.kbi {color: #ef203e;}

#logo a {
position: absolute;
display: block;
text-indent: -100em;
overflow: hidden;
background:  url(../images/logo.png) no-repeat;	
background-repeat:no-repeat;
float: left;
width: 288px;
height: 94px;
text-decoration: none;
}

#wrapper {
width: 833px;
margin-left: auto;
margin-right: auto;
background:  url(../images/wrapper.png) repeat-y;
}

#wrapper2 {
position: relative;
width: 980px;
margin-left: auto;
margin-right: auto;
background:  url(../images/wrapper.png) repeat-y;
}

#content {
min-height: 453px;
height: auto !important;
height: 453px;
background:  transparent url(../images/mainbg.jpg) no-repeat;
}

#content2 {
min-height: 453px;
height: auto !important;
height: 453px;
padding-left: 20px;
background:  transparent url(../images/mainbg2.jpg) no-repeat;
}


#content_bottom {
background: transparent url(../images/mainbg_bottom.jpg) no-repeat;
height: 17px;
}


#content_bottom2 {
background: transparent url(../images/mainbg_bottom2.jpg) no-repeat;
height: 17px;
}

#footer {
width: 833px;
height: 20px;
margin-left: auto;
margin-right: auto;
color: white;
clear: left;
}

.students {
background: transparent url(../images/arrow.png) no-repeat;
background-position: 40px 16px;
}

.kids {
background: transparent url(../images/arrow.png) no-repeat;
background-position: 25px 16px;
}

.pro {
background: transparent url(../images/arrow.png) no-repeat;
background-position: 25px 16px;
}

.finder {
background: transparent url(../images/arrow.png) no-repeat;
background-position: 25px 16px;
}

.home {
background: transparent url(../images/arrow.png) no-repeat;
background-position: 18px 16px;
}
h2 {
display: block;
padding-left: 25px;
height: 25px;
line-height: 25px;
background: url(../images/kbi.png) no-repeat;
background-position: middle left;
font-size: 1.4em;margin-bottom: 15px;
border-bottom: 3px solid #ccc;
width: 500px;
}

h3 {
display: block;
padding-bottom: 15px;
font-size: 1.3em;
}

#line {
height: 3px;
background-color: #ee2b42;
}

input, select {
font-family: Arial;
font-size: 11px;
color: #505050;

}


label,input {
	padding: 0;
	margin: 0;
	display: block;
	float: left;
	margin-bottom: 10px;
}

label { text-align: right; width: 100px; padding-right: 20px; font-weight: bolder;}
legend { font-size: 1.3em;
font-weight: bolder;
color: #FF291F;
padding: 2px 6px;
margin-bottom: 10px;}
fieldset { 
 clear: both;
  font-size: 100%;
  border-color: #ccc;
  border-width: 1px 0 0 0;
  border-style: solid none none none;
  padding: 10px;
  margin: 0 0 0 0;

}
label.radio{ text-align: left; padding-right: 2px; }
form p{ padding: 2px; margin: 0; }
form br{ clear: left; }

#column {
float: left;
top: 1px;
left: 0px;
width: 160px;
margin: 20px;
margin-right: 0px;
min-height: 400px;
border-right: 1px solid #ccc;
}

.login {
display: block;
font-size: 1.2em;
font-weight: bolder;
border-bottom: 1px solid #303569;
width: 90%;
}

.noformat {
margin:0;padding:0;width: 60px; text-align: left;
}

#main_menu {
border-top: 1px solid #303569;
padding-top: 10px;
width: 90%;
}

#main_menu ul {
list-style: none;

}

#main_menu a {
padding: 3px;
font-size: 1.2em;
font-weight: bolder;
display: block;
height: 15px;
margin-bottom: 10px;
width: 90%;
text-decoration: none;
color: #505050;
list-style: none;
}

#main_menu a:hover{
color: #ef203e;
}

.current {
background-color: #ccc;
}

.sitefx {float: right;}

#player {
border: 1px solid black;
width: 470px;
}


.black_overlay{
    display: none;
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index:1001;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
}
 
.white_content {
    display: none;
    position: absolute;
    top: 25%;
    left: 30%;
    width: 470px;
    height: 348px;
    border: 3px solid #43ae50;
    background-color: white;
    z-index:1002;
    overflow: auto;
} 

.notice {
display: block; color: red; font-weight:bolder; margin-bottom: 10px;
}

.red {
color: red;
font-weight:bolder;
}

.video_item {
padding-top: 5px;
float: left;
width: 130px;
height: 200px;
text-align: center;
margin-bottom: 10px;
margin-right: 2px;
}

.video_img {
margin-right: 10px;
}

.video_text {
clear: both;
width: 400px;
}


#gallery_list {
margin-top: 20px;
}

#gallery_list li {
margin-bottom: 10px;
}

/*-------------------------------*/
/*    CSS :: GALLERY MODULE      */
/*-------------------------------*/

#gallery {
overflow: auto;
font-size: 0.9em;
margin:0;
padding: 0;
}

#gallery img {
border: 1px solid #ccc;
}

#gallery ul {
clear: left;
padding: 0;
margin:0;
}

#gallery li { 
list-style:none!important; 
float: left;
margin: 5px;
}



/*-------------------------------*/
/*    CSS :: PAGINATE MODULE      */
/*-------------------------------*/


.paginate {
clear: left;
margin: 15px;
}

.paginate li {
list-style: none;
float: left;
}

.paginate a{
float: left;
margin-right: 2px;
border: 1px solid #999999;
padding: 3px;
color: #105cb6;
padding-left: 10px;
padding-right: 10px;
}

.paginate a:hover{
border-color: #2e6ab1;
color: #2e6ab1;
}

.paginate_current{
float: left;
margin-right: 2px;
border: 1px solid #2e6ab1;
padding: 3px;
padding-left: 10px;
padding-right: 10px;
color: white;
background-color: #192765;
}

.paginate_inactive, .paginate_title{
float: left;
margin-right: 2px;
border: 1px solid #999999;
padding: 3px;
padding-left: 10px;
padding-right: 10px;
color: #ccc;
}

.paginate_title { color :black; margin-right: 10px;}

/* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */

/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
 display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
}
.tabberlive {
 margin-top:1em;
}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav
{
 margin:0;
 padding: 3px 0;
 border-bottom: 1px solid #778;
 font: bold 12px Verdana, sans-serif;
}

ul.tabbernav li
{
 list-style: none;
 margin: 0;
 display: inline;
}

ul.tabbernav li a
{
 padding: 3px 0.5em;
 border: 1px solid #778;
 border-bottom: none;
 text-decoration: none;
 margin-right: 2px;
}

ul.tabbernav li a:link { color: #448; }
ul.tabbernav li a:visited { color: #667; }

ul.tabbernav li a:hover
{
 color: #000;
 background: #AAE;
 border-color: #227;
}

ul.tabbernav li.tabberactive a
{
 background-color: #ccc;
}

ul.tabbernav li.tabberactive a:hover
{
 color: #000;
 background: white;
 border-bottom: 1px solid white;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
 padding:5px;
 border:1px solid #aaa;
 border-top:0;

 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:200px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 /* overflow:auto; */
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
 display:none;
}
.tabberlive .tabbertab h3 {
 display:none;
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
 height:200px;
 overflow:auto;
}

#resources_header {list-style: none; height: 30px; margin-bottom: 5px;}
#resources_header li {float: left; margin-right: 5px; }
#resources_header a {display: block;text-decoration: none; color: #333;background-color: #eee; padding: 5px; border: 1px solid #ccc;}
#resources_header a:hover {background-color: #ccc;}

.resource_title {
font-weight: bolder;
font-size: 1.3em;
}