/* Vertical Accordions */

#vertical_container { margin:0px 0px 0px 35px;}

.accordion_toggle {
display: block;
height: 25px;
width: 500px;
background: url(images/accordion_toggle.gif) no-repeat top right #88b4e1;
padding: 0 10px 0 10px;
line-height: 25px;
font-weight: bold;
text-decoration: none;
outline: none;
font-size: 12px;
color: #fff;
border-bottom: 1px solid #d4e4f5;
cursor: pointer;
margin: 0 0 0 0;
}

.accordion_toggle_active {
background: url(images/accordion_toggle_active.gif) no-repeat top right #d4e4f5;
color: #333;
border-bottom: 1px solid #d4e4f5;
}

.accordion_content {
width:520px;
background-color:none;
color: #333;
overflow: hidden;
}

.accordion_content h2 {
margin: 15px 0 5px 10px;
font-size:14px;
color: #88b4e1;
}

.accordion_content p { margin:10px 15px;}

.vertical_accordion_toggle {
text-align:left;
display: block;
height: 25px;
width: 480px;
background: url(images/accordion_toggle.gif) no-repeat top right #88b4e1;
padding: 0 10px 0 10px;
line-height: 25px;
font-weight: bold;
text-decoration: none;
outline: none;
font-size: 11px;
color: #fff;
border-bottom: 1px solid #d4e4f5;
cursor: pointer;
margin: 0 0 0 0;
}

.vertical_accordion_toggle_active {
background: url(images/accordion_toggle_active.gif) no-repeat top right #d4e4f5;
color: #333;
border-bottom: 1px solid #d4e4f5;
}

.vertical_accordion_content {
background-color: none;
color: #444444;
overflow: hidden;
}

.vertical_accordion_content h2 {
margin: 15px 0 5px 10px;
color: #0099FF;
}

.vertical_accordion_content p {
text-align:left;

}

/*
Horizontal Accordion
*/

.horizontal_accordion_toggle {
/* REQUIRED */
float: left;	/* This make sure it stays horizontal */
/* REQUIRED */
display: block;
height: 200px;
width: 25px;
background: url(images/h_accordion_toggle_active.gif) no-repeat top left #88b4e1;
color: #ffffff;
text-decoration: none;
outline: none;
border-right: 1px solid #fff;
cursor: pointer;
margin: 0 0 0 0;
}

.horizontal_accordion_toggle_active {
background: url(images/h_accordion_toggle.gif) no-repeat top left #d4e4f5;
border-right: 1px solid #88b4e1;
}

.horizontal_accordion_content {
/* REQUIRED */
height:200px;	/* We need to define a height for the accordion as it stretches the width */
float: left;	/* This make sure it stays horizontal */
/* REQUIRED */
overflow:hidden;
background-color:#fff;
color: #333;
}

.horizontal_accordion_content p {
}


/* Container styling*/
#horizontal_container {
margin: 20px 0px 20px 10px;
width:500px;   
height:200px;    
}

#vertical_nested_container {
margin: 8px 0px 20px 0px;
text-align:center;
}
