html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-style:normal;font-weight:normal;text-align:left;}
body{/*line-height:1;*/}
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
/* remember to define focus styles! */
:focus{outline:0;}
/* remember to highlight inserts somehow! */
ins{text-decoration:none;}
del{text-decoration:line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table{border-collapse:collapse;border-spacing:0;}

body{
    /*background:#f00 url(bg.png)  no-repeat top center;*/
    background:#201008 url(body.jpg)  repeat-y top center;
    text-align:center;
    font-size:75%;
    font-family:Verdana,Geneva,Arial,sans-serif;
    line-height:1.5em;
    text-align: center;
}


body.wide {
    background-image: url(body2.jpg);
}

html>body {
    font-size:12px;
}
#cleverheader, #cleverbody, #cleverfooter{
    font-size:1.1em;
    color:#546148;
    /* 	float:left; */
    /*	background-color:#fff;*/
    width:100%;
}
.cleverwrap{
    width:960px;
    margin:auto;
    text-align:left;
}
.clear{
    clear:both;
}
.access{
    display:none;
}
a{
    text-decoration:none;
}
.button, .fading_button{
    padding:7px 10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    -khtml-border-radius:10px;
    border-radius:10px;
    /* http://code.google.com/p/curved-corner/downloads/list */
    /* also see http://dillerdesign.com/experiment/DD_roundies/ */
    /*	behavior:url(border-radius.htc);*/
    color:#fff;
    background-color:#12bee9;
}
.button:hover, .fading_button{
    color:#fff;
    background-color:#f7249b;
}

.selected_button{
    display:block;
    padding:7px 10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    -khtml-border-radius:10px;
    border-radius:10px;
    /* http://code.google.com/p/curved-corner/downloads/list */
    /* also see http://dillerdesign.com/experiment/DD_roundies/ */
    /*	behavior:url(border-radius.htc);*/
    color:#fff;
    background-color:#f60;
}



#cleverheader{
    height:220px;
    background:transparent url(top.jpg)  no-repeat top center;
}

body.wide #cleverheader {
    background-image: url(top2.jpg);
}

#cleverheader .user{
    color:#fff;
    float:right;
    margin-top:1em;
}
#cleverheader .user div{
    float:left;
    margin-right:10px;
}
#cleveruser .user a.button{}



#cleverbody {
    text-align: center;
}

#cleverbody .content{
    float:right;
    width:620px;
    margin-right:10px;
    /* 	position:relative; */
    top:-70px;
    text-align: left;
}


body.wide #cleverbody .content {
    float: none;
    width: auto;
}

#cleverbody .content h2{
    font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
    font-weight:bold;
    margin:1em 0;
    font-size:3em;
    line-height:1em;
    color:#61a81c;
}
#cleverbody .content h3{
    font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
    font-weight:bold;
    margin:1em 0;
    font-size:2em;
    line-height:1.5em;
    color:#61a81c;
}
#cleverbody p{
    margin:1em 0;
}
#cleverbody cite{
    font-style:italic;
}
#cleverbody strong, #cleverbody b{
    font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
    font-style:oblique;
    font-size:2em;
    color:#f60;
    line-height: 0.9em;
}

#cleverbody ul li strong, #cleverbody ul li b{
    font-size: 1.5em;
}


#cleverbody h4 {
    font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif;
    font-style:oblique;
    font-size:2em;
    color: #8FAA10;
    line-height: 0.9em;
}


div.cleverchart cite {
    text-align: right;
    display: block;
    font-size: 0.8em;
}
div.cleverchart img.character {
    background: transparent;
    padding: 0;
    margin-bottom: -2em;
    -webkit-box-shadow: none;
    border: none;
    float: left;
    z-index: 100;
}



#cleverbody .cleverchart{
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    -khtml-border-radius:10px;
    border-radius:10px;
    text-align:center;
    padding:50px 50px;
    background-color:#333;
    margin:2em 0;
}



#cleverbody .cleverchart object{
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    -khtml-border-radius:10px;
    border-radius:10px;
    padding:50px 10px;
    background-color:#fff;
}
#cleverbody .cleverchart p{
    padding:2em 2em 0 2em;
    margin-top:0;
    color:#999;
    font-style:italic;
}





#cleverbody .navleft{
    float:left;
    width:290px;
    margin-left:10px;
}
#cleverbody .navleft ul li{
    margin:1em 0;
}
#cleverbody .navleft ul li a.button{
    display:block !important;
}





#cleverfooter{

}


table{
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    -khtml-border-radius:10px;
    border-radius:10px;
    /* http://code.google.com/p/curved-corner/downloads/list */
    /* also see http://dillerdesign.com/experiment/DD_roundies/ */
    behavior:url(border-radius.htc);
    text-align:center;
    /*  background-color:#f60; */
    margin:2em 0;
}
th, td{
    padding:10px 20px;
}
thead tr{
    color:#fff;
}
tbody tr{
    border-bottom:1px solid #333;
}

thead tr th {
    background-color:#f60;
}

tbody tr.odd td{
    background-color:#ede9e2;
}
tbody tr.even td{
    background-color:#d4ccba;
}

div#accordion table {
    margin: 0;
}

#cleverbody .content ul, #cleverbody .content ol {
    list-style-type:none;
}
#cleverbody .content li{
    background:transparent url(arrow.png) no-repeat;
    padding:0px 4px 0 30px;
    margin: 0.8em 0;
    position: relative;
    height: 1%;
}

html>body #cleverbody .content li {
    height: auto;
}

div.content a {color: #1C60A8;}
div.content a:hover {text-decoration: underline;}

#cleverbody .content div#accordion h3 {margin: 0;}

div#accordion h3 a{
    font-size: 0.7em;
    font-color: #1C60A8;
    background: transparent url(media/arrow_large_right.png) no-repeat 0px 0.7em;
    padding-left: 20px;
    display: block;
}

div#accordion h3.selected a
{
    background-image: url(media/arrow_large_down.png);
}

#cleverbody .content em {
    font-style: italic;
    color: #FF6600;
    font-size: 1.2em;
    line-height: 1.5em;
}

#cleverbody .content p em
{
    line-height: normal;
}

#cleverbody .content div.cleverchart h4 {
    color: white;
    text-align: center;
    font-size: 1.5em;
    margin-bottom: 20px;
}

div.options.bubble label {
    float: left; width: 230px; display: block; color: white;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    -khtml-border-radius:10px;
    border-radius:10px;
    /* http://code.google.com/p/curved-corner/downloads/list */
    /* also see http://dillerdesign.com/experiment/DD_roundies/ */
    /* behavior:url(border-radius.htc);*/
    background-color: #444;
    margin: 2px 5px;
    padding: 2px 10px;
}

div.options.bubble label input {
    margin-right: 5px;
}

#cleverbody div.quiz_ad {
    -moz-border-radius:.5em;
    -webkit-border-radius:.5em;
    border-radius:.5em;
    background-color: #E4100F;
    display: block;
    margin-top: 40px;
    padding: 10px;
    text-align: center;
}

#cleverbody div.quiz_ad a {
    color: white;
}

#cleverbody div.quiz_ad a strong{
    font-size: 1.2em;
    color: white;
}

#cleverbody div.quiz_ad a img {
    clear: both;
    text-align: center;
    margin: 10px auto;
}

div.multitext div.options label{
    display: block;
    clear: left;
}

div.multitext div.options input {float:left;}


div.pages {
    margin-top: 50px;
}

div.pages strong {
    float: left;
    margin: 0 5px;
    font-size: 1em !important;
    line-height: 40px;
    padding: 5px;
    font-style: normal;

}

div.pages input {
    display:block;
    float: left;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 20px;
    text-decoration: none;
    color: white;
    margin: 0px;
    -webkit-appearance: square-button;
    border: none;
    padding: 5px;
    cursor: pointer;
}

/*
div.pages:hover {
	background-color: #C80F8C;
}
*/

div.pages input.partial {
    background-color: #FF6600;
}

div.pages input.done {
    background-color:#5AC80F;
}

div.pages input.none {

}

div.pages input.selected {
    background-color: #F2ECD6;
    color: black;
    border: 1px solid #9999A1;
}

div.question_preamble
{
    margin-top: 20px;
}

a.ui-slider-handle {
    width:20px;
    height:25px;
    display:block;
    position:absolute;
    /* background:#DBDBDB url(media/handle.png) repeat-x; */
    background: #8FAA10 url(media/greenhandle.png) -7px -12px  repeat-x;
    z-index:2;
    margin-top:-.5em;
    margin-left: -10px;
}

a.ui-slider-handle:hover {
    background-position: -7px -62px;
}


body.questionnaire div.questionwrap {
    width: 299px;
    float:left;
    padding: 5px 10px;
    /*
        background:#EBEBEB url(media/softbg.gif) repeat-x;
        border-right: 1px solid #D3D3D3;
    */
}

body.questionnaire div.answerwrap {
    width: 600px;
    float: left;
}

body.questionnaire div.questionwrap span {
    clear: both;
    float: right;
    font-size: x-small;
    font-style: italic;
}

body.questionnaire label {
    text-align: left;
    line-height: 17px;
}

body.questionnaire div.bool label,
body.questionnaire div.yesno label {display: block;padding: 5px 10px;}

body.questionnaire div.bool label,
body.questionnaire div.yesno label,
body.questionnaire div.enum label
{
    float: left; width: 250px; margin: 10px 20px 0 10px;
}

body.questionnaire div.bool label,
body.questionnaire div.yesno label {
    width: 100px; margin: 10px 0 0 20px;
}

body.questionnaire label div.radio {
    background: transparent url(media/radioblue18.png) 0 -17px no-repeat;
    width: 17px;
    height:17px;
    float: left;
    margin-right: 10px;
}

body.questionnaire div.options label span {
    display: block;
    float: left;
    width: 210px;
}

body.questionnaire div.question div.range {
    margin-top: 20px;
}

body.questionnaire div.range div.radio {
    display: none;
}

body.questionnaire label.hover div.radio{
    background-position: 0px -34px;
}

body.questionnaire label.selected div.radio {

    background-position: 0 0 !important;
}

body.questionnaire div.enum label {
    display:block;
    padding:5px 10px;
}

body.questionnaire div.enum label input {
    margin:0 10px;
}

body.questionnaire div.bool label input,
body.questionnaire div.yesno label input {
    margin:1em;
}

body.questionnaire div.enum label.deselected {
    color:#39506D;
}

body.questionnaire div.range label {
    position:absolute;
    display:block;
}

/*
html > body body.questionnaire div.range label {
	margin-top:-35px;
}
*/

body.questionnaire div.range label.deselected {
    color:#A0A0A0;
    font-size:1em;
    line-height:1.2em;
}

body.questionnaire div.range label.selected {
    color:#298F9D;
    font-weight:bold;
}

body.questionnaire div.text textarea {
    background:#F3F3F3 url(media/bg-forms.png) repeat-x;
    border:1px solid #E3E3E3;
    color:#333;
    padding:5px;
    letter-spacing:.1em;
    width:100%;
    height:100px;
}

body.questionnaire div.question span.answered {
    display:block;
    height:2em;
    width: 100%;
    text-align: right;
}

body.questionnaire div.ui-slider-horizontal {
    height:1em;
    /* background:#F3F3F3 url(media/bg-forms.png) repeat-x; */

    background-color: #D6C7B7;

    cursor:pointer;
    margin-top:3em;
    border: 1px solid #A46A3A;
    position: relative;
}

body.questionnaire div.range div.options {
    width:500px;
    margin:0 auto;
    position: absolute !important;
    margin-left: 50px;
    margin-top: 10px;
}

body#student.questionnaire div.question {
    /*
        border:1px solid #E3E3E3;
        background-color:#F3F3F3;
    */
    margin:5px 0;
    text-align:center;
    /* background:#EBEBEB url(media/softbg.gif) repeat-x; */
    /*
        background-color: #FFFFFF;
        border:1px solid #D3D3D3;
    */
    /*
        border-bottom-left-radius:7px 7px;
        border-bottom-right-radius:7px 7px;
        border-top-left-radius:7px 7px;
        border-top-right-radius:7px 7px;
    */

    background-color: #EDE9E2;
    color: #546148;
    border-bottom: 1px solid #9F8A64;
    padding-bottom: 5px;
}

body#student.questionnaire div.question.answered {
    background-color: #CAF9AA;
}

div.question div.clear {
    height: 0px;
}

body.questionnaire #cleverbody div.question h4 {
    font-size:1em;
    color:#298F9D;
    font-weight:bold;
    line-height:1.2em;
    padding:5px 0;
    float:right;
    width: 280px;
    text-align: right;
    display: block;
}

/*
body.wide #cleverbody .content
{
	padding-top: 40px;
}
*/

hr {
    background: transparent url(media/crayon_hr_red.gif) repeat-x;
    height: 15px;
    width: 100%;
    border: none;
}


body.wide div.navleft
{
    display: none;
}

#scratch div {

    /* text-shadow:-1px 1px 0 #fff; */
    letter-spacing: 1px;
    width: 960px;
    margin: 0 auto;
}
#scratch div.msg {
    padding:5px 20px;
    font-size:1em;
    height: 25px;
    line-height: 1.5em;
    text-align: center;
}

#scratch div.msg strong {
    font-size: 1.2em;
    line-height: 1.5em;
}

#scratch .warning {
    border:1px solid #E4C310;
    background-color:#FBF2C5;
}

#scratch .warning strong {
    color:#AEA71C;
}

#scratch .success {
    background-color:#A4F05C;
    border: 1px solid #598521;
}

#scratch .success strong {
    color:#598521;
}

#scratch .error {
    border:1px solid #C6220E;
    background-color:#F9B0A7;
}

#scratch .error strong {
    color:#852137;
}

#scratch .notice {
    border:1px solid #205486;
}

#scratch .notice strong {
    color:#205486;
}


body.questionnaire .cleverfoot
{
    text-align: center;
}

body.questionnaire .progress
{
    text-align: center;
}


.content img {
    background-color: white;
    padding: 10px 10px 40px 10px;
    border: 1px solid grey;
    box-shadow: 10px 10px 5px #888;
    -webkit-box-shadow: 5px 5px 5px #888;
}

.content {
    font-size: 1.2em;
    line-height: 1.4em;
}

.cleverchart .options a.selectbutton
{
    float: right;
    margin-left: 10px;
    font-size: small;
    color: white;
}

img.sliderhint {
    border: none;
    background: none;
    float: right;
    box-shadow: none;
    -webkit-box-shadow: none;
    padding: 0;
    margin: 0;
    /* 	position: relative; */

}

.welcometext {
    padding: 50px;
    padding-bottom: 200px;
    padding-top: 0px;
    background: transparent url(../../uploads/images/FRONTPAGE2.png) no-repeat left bottom;
}

.welcometext p {
    text-align: center;
}

img.welcomeimage {
    top: -300px;
    position: relative;
}

body.login img.login {
    float: right;
}

form.cleverform label {
    display:block;
    color:#298F9D;
    font-weight:bold;
    font-size:1.2em;
    margin-top:1.5em;
    letter-spacing:.1em;
}


form.cleverform input[type=text],form.cleverform input[type=password] {
    background:#F3F3F3 url(media/bg-forms.png) repeat-x;
    border:1px solid #E3E3E3;
    color:#333;
    padding:5px;
    width:200px;
    letter-spacing:.1em;
}

form.cleverform textarea {
    background:#F3F3F3 url(media/bg-forms.png) repeat-x;
    border:1px solid #E3E3E3;
    color:#333;
    padding:5px;
    width:300px;
    letter-spacing:.1em;
    height:100px;
}

form.cleverform select {
    width:210px;
    height:2em;
    margin-top:5px;
}

form.cleverform input[type=submit] {
    display:block;
    margin:2em 5px;
    padding:5px;
    letter-spacing:.1em;
    font-size:1.2em;
    line-height:1.5em;
}



img.helperchar {
    background: none;
    padding: 0;
    margin: 10px;
    border: none;
    float: right;
    -webkit-box-shadow: none;
    box-shadow: none;
}

div.tablewrap {
    width: 640px;
    float: right;
    clear: none;
}

div.tablewrap table {
    width: 640px !important;
    margin: 0;
    font-size: 0.9em;
}

/*
table.userlist {
	display: block;
	float: right;
	display: inline;
	width: 400px;
}
*/


div.view_as_male,
div.view_as_female {
    text-align: center;
    width:300px;
    float: left;
    margin-left: 75px;
}

div.view_as_male a,
div.view_as_female a {
    background-image: url(media/arrow_state_grey_right.png);
    background-repeat: no-repeat;
    background-position: 95% center;
    padding-right: 40px;
    color: white;
}

div.view_as_male img,
div.view_as_female img {
    border: none;
    background: transparent;
    padding: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
}
div.resource {
    background: white;
    width: 250px;
    text-align: center;
    float: left;
    margin-left: 30px;
    font-size: smaller;
    border: 1px solid #1b60a8;
    height: 250px;
    overflow: hidden;
    padding-top: 20px;
}

div.resource img {
    border: none;
    background: transparent;
    padding: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

div.resource a {
    background-image: url(media/arrow_state_grey_right.png);
    background-repeat: no-repeat;
    background-position: right center;
    padding-right: 20px;
}
/* Localized */