/**********************************
** style for SD tutorial/example **
**********************************/
.assignment{
	border-bottom:1px solid black;
	border-right:1px solid black;
	margin-left:2em;
	padding:1em;
	font:15px arial,sans-serif;
	box-shadow:0 0 5px #D40000;
}
.button.tutorial{
    text-align:center;
	display: inline-block;
    background: #4891d9 url(../images/buttongrad.png) left -6px repeat-x;
    border: 2px solid #4891d9;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -o-border-radius: 8px;
    padding:0.3em;
    margin:1em 0;
    font-weight:bold;
    width:100%;
}
.button.tutorial:hover{
	box-shadow:0 0 5px 3px #888;
	cursor:pointer;
}
.tutorial_data{
	display:none;
}
.tutorial_example{
	display:none;
	 background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9sCFxAUNv4Rm7YAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAADUlEQVQI12NgYGCoBwAAhACAxkwJbwAAAABJRU5ErkJggg==") left top repeat;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow:auto;
}
#example_content{
    position: absolute;
    top: 20px;
    right: 10px;
    bottom: 20px;
    left: 10px;
    min-height: 200px;
    min-width:950px;   
    margin: 0 0.1em;
    padding: 0.5em;
    background-color: white;
    border: 2px solid black;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    overflow:hidden;


}
#example_content .example_clearer{
    clear:both;
    width:70%;
    height:2px;
    margin: 2px auto;
    border-top:2px solid black;
 
}

#example_left{
    min-width:340px;
    float:left;
    width:40%;
    height:100%;
    background-color:white;
    overflow:auto;
}
#example_right .sdtable{
    min-width:0;
}
#example_right{
    min-width:550px;
    float:right;
    width:57%;
    height:100%;
    background-color:white;
    border-left:2px solid black;
    overflow:auto;
}
}
#example_assignment{
    padding: 0.2em 2em;
    background-color:white;
    
}

#example_explain h3{
    border-bottom:2px solid black;
}
#example_explain{
    padding-left:1.5em;
    padding-right:1.5em;
}
/*#example_sd_table{
    border:1px solid red;
}*/
.assignment{
	border-bottom:1px solid black;
	border-right:1px solid black;
	margin-left:2em;
	padding:1em;
	font:15px arial,sans-serif;
	box-shadow:0 0 5px #D40000;
}
.lighted{
    background-color:#FFFF66;
    padding-top:-3px;
}
#navbuttons{
    width:250px;
    height:30px;
    padding:1em 3em;
}
#navbuttons .button{
	display: inline-block;
    background: #4891d9 url(../images/buttongrad.png) left -6px repeat-x;
    border: 2px solid #4891d9;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -o-border-radius: 8px;
    padding:0.3em;
    margin-right:20px;
    font-weight:bold;
}
#navbuttons .button.close{
    margin-right:0;
    background: #CDFECD url(../images/buttongrad_green.png) left -6px repeat-x;
    border: 2px solid #66A666;
}
#navbuttons .button:hover{
	box-shadow:0 0 5px 3px #888;
	cursor:pointer;
}
#navbuttons .button.close:hover{
	box-shadow:0 0 5px 3px #888;
	cursor:pointer;
    margin-right:0;
    background: #CDFECD url(../images/buttongrad_green.png) left -6px repeat-x;
    border: 2px solid #66A666;
}
#example_sd_table h3{
    margin: 1em 0 0 1em;
}