/*  Support for IE versions < 9 dropped May 2010 */

@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:300);

body
{
    background: #e0e0e0;
    color: black;
    font-family: Verdana, Arial, sans-serif;
    font-size: 14px;
    height: 100%;
    margin: 0;
    padding: 0;
}


#sidebar
{
    background: url('http://img.rl.se/alogo.jpg');
    background-repeat: no-repeat;
    border-right: 2px dotted #efefef;
    font-size: 12px;
    height: 100%;
    left: 0px;
    letter-spacing: 0.25em;
    margin: 0.5em;
    padding-top: 11em;
    position: fixed;
    text-align: center;
    top: 0px;
    width: 12%;
    z-index: -1
}


#main
{
    height: 100%;
    left: 13%;
    min-width: 82%;
    padding: 0 2%;
    position: absolute;
    top: 0px;
}


#toprightmsg
{
    background-color: rgba(0,255,0,0.1);
    color: darkgreen;
    width: 25%;
    padding: 1em;
    border-radius: 1em;
    position: absolute;
    top: 1em;
    right: 1em;
    z-index: -1;
    font-size: 10px;
}

h1
{
    color: #886677;
    font-family: "Yanone Kaffeesatz", "Trebuchet MS", "Verdana", "Arial", sans-serif ;
    font-size: 36px;
    font-weight: 100;
    letter-spacing: 0.15em;
    text-align: center;
    text-shadow: 2px 2px 10px #999999;
}

h2
{
    color: #664455;
    font-family: "Yanone Kaffeesatz", "Trebuchet MS", "Verdana", "Arial", sans-serif ;
    font-size: 22px;
    font-weight: 100;
    margin-bottom: 0.15em;
    margin-top: 1.4em;
}

h3
{
    font-weight: bold;
    font-size: 13px;
    margin-bottom: 0em;
}

h4
{
    font-size: 14px;
}

hr, hr.rl
{
    border: 0;
    border-top: 1px dotted #886677;
}



/* Dessa ankartyper är till löpande text */

a
{
    border-radius: 1em;
    background-color: #efefef;
    color: #886677;
    padding: 0 0.4em;
    text-decoration: none;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.7s ease-in;
    -o-transition: all 0.5s ease-in;
}

a:hover
{
    color: #ffffff;
    background-color: #886677;
}



.linkline
{
    font-size: 11px;
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
    letter-spacing: 0.25em;
}

#sidebar a
{
    background: none;
    border-radius: 1em;
    display: block;
    font-size: 10px;
    margin: 0 0.5em 0.7em 0;
    padding: 0.2em 0.7em;
}


.linkline a
{
    border-radius: 1em;
    padding: 0.2em 0.7em;
}


#sidebar a:hover
{
    color: #ffffff;
    background-color: #886677 ;
}

#sidebar #exclam
{
    position: fixed;
    border: 0;
    bottom: 12px;
    left: 12px;
}



.unicode
{
    font-family: "Arial Unicode MS", "Microsoft Sans Serif", "Free Sans",
         "Gentium Plus", "Gentium Basic", "Gentium", "GentiumAlt", "DejaVu Sans",
         "DejaVu Serif", "Free Serif", "TITUS Cyberbit Basic",
         "Bitstream Cyberbit", "Bitstream CyberBase", "Doulos SIL",
         "Code2000", "Code2001", "Lucida Sans Unicode";
}

.yb  /* Yellow box... */
{
    background-color: #ffce00;
    border: 0.4em solid #ea0437;
    border-radius: 1em;
    color: black;
    font-size: 24px;
    padding: 0.5em 1.5em 1.5em 0.5em;
    position: absolute;
    right: 15%;
    text-align: left;
    bottom: 70%;
    width: 60%;
    z-index: 9;
    -moz-box-shadow: 10px 10px 15px #888888;
    -webkit-box-shadow: 10px 10px 15px #888888;
    -o-box-shadow: 10px 10px 15px #888888;
    -moz-transition: all 1.7s ease-in;
}

.yb>h3
{
    color: #ea0437;
    font-size: 36px;
    margin: 0;
}

.ybsymbol
{
    color: #ea0437;
    float: left;
    font-size: 96px;
    margin: 0;
    padding-right: 0.2em;
    text-align: left;
    text-shadow: 2px 2px 5px #000000;
}


.ingress
{
    color: #886677;
    font-family: "Georgia", "Times New Roman", serif ;
    font-size: 15px;
    font-style: italic;
    margin: 0 13%;
    padding: 0.5em 0 1em 0;
    text-align: justify;
}

.footer,
footer
{
    color: #999999;
    font-family: "Georgia", "Times New Roman", serif ;
    font-size: 10px;
    font-style: italic;
    padding: 2em;
    text-align: center;
    word-spacing: 0.25em;
}

.pictext
{
    color: #999999;
    font-family: "Georgia", "Times New Roman", serif ;
    font-size: 10px;
    padding: 1em;
    text-align: center;
}

.rclb    /* Rounded, centered, light-bg and bordered */
{
    background: #efefef;
    border: 1px solid #886677;
    border-radius: 1em;
    margin: 0 auto;
    padding: 1em;
    width: 100%;
}

.rtc     /* Used for the real time clock */
{
    background: #886677;
    border-radius: 3em;
    color: #efefef;
    font-family: "Yanone Kaffeesatz", Verdana, Arial;
    font-size: 48px;
    letter-spacing: 0.2em;
    margin: 0 auto 2em auto;
    padding: 0.6em;
    text-align: center;
    width: 45%;
}

span.bautartc
{
    color: #886677;
    font-family: "Yanone Kaffeesatz", Verdana, Arial;
    font-size: 300px;
    text-align: center;
    margin-top: 0.35em;
}


div.col2
{
    -moz-column-count: 2;
    -moz-column-gap: 2.5em;
    -moz-column-rule: 1px solid #cccccc;
    -webkit-column-count: 2;
    -webkit-column-gap: 2.5em;
    -webkit-column-rule: 1px solid #cccccc;
    column-count: 2;
    column-gap: 2.5em;
    column-rule: 1px solid #cccccc;
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -ms-hyphens: auto;
    -webkit-hyphens: auto;
}


div.col3
{
    -moz-column-count: 3;
    -moz-column-gap: 2em;
    -moz-column-rule: 1px solid #cccccc;
    -webkit-column-count: 3;
    -webkit-column-gap: 2em;
    -webkit-column-rule: 1px solid #cccccc;
    column-count: 3;
    column-gap: 2em;
    column-rule: 1px solid #cccccc;
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -ms-hyphens: auto;
    -webkit-hyphens: auto;
}



/***************************** Tabeller ******************************/

td
{
    padding: 0.25em;
    border: 1px solid #cccccc;
}

table.rl
{
    border-collapse: collapse;
    border-radius: 0.4em;
    color: black;
    table-layout: fixed;
    width: auto;
}

caption.rl
{
    background: #886677;
    color: #e0e0e0;
    font-family: "Yanone Kaffeesatz", "Verdana", "Arial", sans-serif ;
    font-size: 165%;
    letter-spacing: 0.10em;
    text-shadow: 2px 2px 7px #666666;
    padding: 8px 0;
    border-radius: 1em 1em 0 0 ;
}


th,
tr.header
{
    background: #886677;
    color: #e0e0e0;
    font-style: italic;
    font-weight: bold;
    vertical-align: middle;
    border: 1px solid #aaaaaa;
    padding: 0.25em;
}

tr.pyjamas
{
    background: #efefef;
    vertical-align: top;
}

td.code
{
    color: #886677;
    background: #efefef;
    font-family: "Andale Mono", "Lucida Console", "Courier New", monospace;
    white-space: pre;
    vertical-align: top;
}



/********************** Forms-kontroller ********************/

input.rl,
textarea.rl,
select.rl
{
    background-color: papayawhip;
    border-radius: 0.3em;
    color: #886677;
    padding: 0 0 0 5px;
}


pre.rl
{
    color: #886677;
    font-family: "Andale Mono", "Lucida Console", "Courier New", monospace;
}


pre.code
{
    background: #efefef;
    border: 1px solid #886677;
    color: #664455;
    font-family: "Andale Mono", "Lucida Console", "Courier New", monospace;
    margin: 1.2em;
    padding: 1em;
    text-align: left;
    border-radius: 1em;
}

ul
{
    list-style: square;
    list-style-position: outside;
    padding: 0 0 0 1.5em;
}

li
{
    margin-bottom: 0.5em;
}

.le { text-align: left   }
.ce { text-align: center }
.ri { text-align: right; }