body { 
    background-color: #12120D;
    color: #12120D; 
}

h1 {
    font-size: 48px;
    font-family: 'Reenie Beanie', sans-serif;
    font-size-adjust: 0.4;
    display: inline-block;
    margin-top: -5px;
}

h2 {
    margin-bottom: 0.5em;
}

p {
    margin-bottom: 0.5em;
}

a {
    color: #12120D;
}

footer {
    margin-left: 880px;
    position: absolute;
}

header {
    height: 240px;
    position: relative;
}
/* Color scheme: 12120d (Seitenhintergrund, Schrift), 5e5e44 (Nav), ebc785 alt/f0eac6 neu (Kästen), 665845, 9F8158, 733027*/

#container {
    font-size: 1.1em;
    width: 1000px;
    height: 667px;
    margin: 10px auto;

    -moz-box-shadow: 0 0 10px #5E5E44;
    -webkit-box-shadow: 0 0 10px #5E5E44;
    box-shadow: 0 0 10px #5E5E44;

    background-repeat:no-repeat;
    background-position: center;
}

.roundbox {
    margin-top: 10px;
    padding: 10px 10px;
    background: #9F8158;
    background: rgba( 159, 129, 88, 0.5);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.roundboxinner {
    padding: 10px 10px;
    background: #F0EAC6;
    background: rgba(240, 234, 198, 0.9);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

/* Box Elements ******************* */
#contact {
    margin-left:20px;
    position: absolute;
    width: auto;
}

#contact_data{
    position: relative;
}

.flag {
    position: absolute;
    right: 0px;
    top: 0px;
}

#profilepic {
    width:160px;
    margin-right: 20px;
    /*float: right;*/
    position: absolute;
    right: 0px;
}

.gecko {
    position: relative;
    top: -25px;
    float: right;
    margin-bottom: -20px;
    margin-top: -20px;
}

#main {
    width:940px;
    margin-left:20px;
}

#maincontent{
    -moz-column-count: 3;
    -moz-column-gap: 1em;
    -moz-column-rule: 1px solid #9F8158;
    -webkit-column-count: 3;
    -webkit-column-gap: 1em;
    -webkit-column-rule: 1px solid #12120D;
    column-count: 3;
    column-gap: 1em;
    column-rule: 1px solid #12120D;

    text-align: justify;
}

.preloader{
	display:block;
	margin:120px auto;
}

/* Navigation ********************************* */
nav{
    padding: 0px 0px;
}

nav ul {
  list-style:none; 
}

nav ul li {
    background-color: #665845;
    /*white-space: nowrap;*/
    border-color: #9F8158;
    border-width: 1px;
    border-style: solid;

    padding: 0.5em 0em;
    margin-right: 0.5em;

    float: left;
    display: inline-block;
    font-weight: bold;

    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

nav ul li a, nav ul li a:active, nav ul li a:visited {
  color: #F0EAC6;
  text-decoration: none;
  padding: 0.5em 0.5em;
}

nav ul li a:hover, nav ul li a:active,  nav ul li a.active {
    color: #F0EAC6;
    background-color: #733027;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px
    border-radius: 5px;
}

/* Special classes for background page*/
.invisible {
    display: none;
}

.topmargin {
    margin-top: 380px;
}

/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.clearfix:after, #container:after {
  content: "\0020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  overflow:hidden;
}
.clearfix, #container {display: block;}

/* Regular clearing
   apply to column that should drop below previous ones. */

.clear { clear:both; }