body, input, textarea {
    /*font-size: medium;*/
    font-family: sans-serif;
}

body {
    color: #000000;
    background-color: #d5cfc2; /* #dfd8cb; #f3ecdd; F5ECE4; #EEE5DE; C7BEB7;*/
    margin:0;
}


ul {
    list-style:circle;
}

emph {
    font-style:italic;
}

a, a.no-visted-color:visited {
    color:#233460; /*095087;*/
    text-decoration:none;
    outline:none;
}

.learnmore  #cartoon-explanation a,.learnmore  #cartoon-explanation a:visited {
    color: #4161b3;
    /*text-decoration:none;*/
    /*outline:none;*/
} 



a[name], a[name]:hover {
    color:black;
    text-decoration:none;
    outline:none;
}


a img {
    border:none;
}

a:hover {
    text-decoration:underline;
}

a.nounderline:hover{
    text-decoration:none;
}

/*
MAIN COLUMN

*/
#maincolumn {
    width: 600px;
    /*margin-left:50px;*/
    /*margin-left:25%;*/
    margin-left: 100px;
    margin-top:25px;
}

#maincolumn > .maincolumn-item {
    background-color: white;
    border: 1px;
    border-color: #999;
    border-style: solid;
    margin-top:0;
    margin-bottom: 20px;
    padding-top: 10px;
    padding-left: 25px;
    position:relative;
}

p#subtitle, p#subtitleright {
    position:absolute;
    top:112px;
    font-size:1.4em;
    margin-bottom:0;
    margin-top:0;
    padding-bottom:0;
    font-weight:lighter;
}

p#subtitleright {
    left:265px;
}


/*
Controls
====================
*/

#controls {
    height:40px;
    position:relative;
}

#controls > ul {
    list-style: none;
    padding-left:0;
    margin-top:0;
    margin-bottom:8px;
}

#controls > ul > li{
    display: inline;
    position:absolute;
}

#first-control {
    left:16px;
}

#previous-control {
    left:143px;
}

#random-control {
    left:275px;
}

#next-control {
    right:143px;
}

#last-control {
    right:16px;
}

#controls #first-control .control {
    background-image:url(/static/images/first.png);
}

#controls #previous-control .control {
    background-image:url(/static/images/previous.png);
}

#controls #next-control .control {
    background-image:url(/static/images/next.png);
}

#controls #last-control .control {
    background-image:url(/static/images/last.png);
}

#controls .control {
    display:inline-block;
    background-position:0px 0px;
    width:40px;
    height:30px;
}

#controls .control.disabled {
    background-position:-40px 0px;
}

.control-label {
    position:relative;
    font-size:1.2em;
    /*font-weight:550;*/
    top:-8px;
}

#previous-control .control-label {
    left:-10px;
}

#next-control .control-label {
    right:-10px;
}

a.control-label:hover {
    text-decoration:none;
}


textarea {
  overflow:hidden;
  width:95%;
  min-height:10em;
}

/*
Cartoon Block
==================
*/
#maincolumn > #cartoonblock {
    padding-left:25px;
    padding-top:25px;
    padding-right:25px;
    position:relative;
}

img.cartoon {
    border: 2px;
    border-style: solid;
    border-color: black;
    margin-bottom:25px;
}

span.cartoon-title {
    /*position:absolute;
    right:25px; */
    font-weight:bold;
    /*top:-50px;*/
}

.cartoon-container {
    text-align:center;
}


img.cartoon {
    margin-left:auto;
    margin-right:auto;
}

img.cartoon {
    display:block;
    max-width:550px;
    max-height:400px;
}

div.learnmore {
    min-height:2em;
    margin-top:1.5em;
}


div.learnmore > div > p.toggle-a {
    margin-top:0;
}

.collapsible > .show-when-collapsed {
    display:none;
}
.collapsible > .show-when-not-collapsed {
    display:block;
}

.collapsible.collapsed > .show-when-collapsed {
    display:block;    
}
.collapsible.collapsed > .show-when-not-collapsed {
    display:none;
}


#cartoon-explanation {
    margin-bottom: 20px;
}

/* 
Body 
=================
*/

#header a img, {
    border: none;
}


div#footer {
    font-size: smaller;
    padding-left:25px;
}


#footer ul{
    list-style:none;
    padding-left:0;
    margin-top:0;    
}

#footer ul li{
    display: inline;
    margin-right: 10px;
}



/*
============================
Colors
============================
*/

a.black {
    color:black !important;
}

.disabled-text {
    color:#8b8b8b;
}

.italic {
    font-style:italic;
}