html {
    height:100%;
}

body {
    background-color:#a4b688;
    margin:0;
    border:0;
    padding:0;
    font-family:"Open Sans", sans-serif;
    color:#4c4c4c;
    background: #01df00; /* Old browsers */
    background: -moz-linear-gradient(top,  #01df00 0%, #018e00 100%) fixed; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#01df00), color-stop(100%,#018e00)) fixed; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #01df00 0%,#018e00 100%) vfixed; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #01df00 0%,#018e00 100%) fixed; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #01df00 0%,#018e00 100%) fixed; /* IE10+ */
    background: linear-gradient(to bottom,  #01df00 0%,#018e00 100%) fixed; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#01df00', endColorstr='#018e00',GradientType=0 ) fixed; /* IE6-9 */
}

::selection {
    color:#FFF;
    background:#00739b;
}

::-moz-selection {
    color:#FFF;
    background:#00739b;
}

h1 {
    font-size:30px;
    font-weight:400;
    color:#FFF;
    margin:0;
}

h2 {
    font-size:22px;
    font-weight:400;
    color:#7f5980;
    font-family: 'Merriweather', serif;
    margin-bottom:-20px;
}

.container {
    width:820px;
    height:1150px;
    background-color:#fff;
    border:solid 3px #7f5980;
    margin: 35px auto;
    padding:15px;
    position:relative;
    -webkit-box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.2);
    box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.2);
    /*
    -moz-box-shadow: 2px 2px 5px 0px #1F1F1F, inset 4px 4px 10px #ccc1a9, inset -4px -4px 10px #978c74;
    -webkit-box-shadow: 2px 2px 5px 0px #1F1F1F, inset 4px 4px 10px #ccc1a9, inset -4px -4px 10px #978c74;
    box-shadow: 2px 2px 5px 0px #1F1F1F, inset 4px 4px 10px #ccc1a9, inset -4px -4px 10px #978c74;
    */
}

.banner {
    height:150px;
    width:850px;
    background-color:#7f5980;
    top:-15px;
    left:-15px;
    position:relative;
    margin-bottom:-15px;
}

.logo {
    width:60px;
    height:109px;
    background-image:url('images/logo.png');
    top:20px;
    left:40px;
    position:relative;
    float:left;
}

.title {
    float:left;
    position:relative;
    top:35px;
    left:80px;
}

.title p{
    font-style:italic;
    font-size:18px;
    color:#FFF;
    font-weight:300;
    margin-top:4px;
    margin-left:3px;
}

.column-left {
    width:383px;
    position:absolute;
}

.yoka-image {
    width:181px;
    height:206px;
    background-image:url('images/yoka.jpg');
    float:right;
    margin-top:20px;
    margin-left:5px;
}

.column-right {
    width:383px;
    position:absolute;
    left:432px;
}

.beatrix-image {
    width:156px;
    height:206px;
    background-image:url('images/beatrix.jpg');
    float:right;
    margin-top:20px;
    margin-left:5px;
}

.footer {
    height:130px;
    width:820px;
    padding:10px 15px;
    background-color:#7f5980;
    bottom:15px;
    left:0px;
    position:absolute;
    margin-bottom:-15px;
    color:#FFF;
    font-size:14px;
    line-height:24px;
}

.footer h2 {
    font-family:"Open Sans", sans-serif;
    font-size:18px;
    color:#FFF;
    margin-top:0px;
}

.line {
    width:100%;
    height:1px;
    background-color:#fff;
    opacity:0.3;
    margin-top:25px;
    margin-bottom:4px;
}