/* 
    Document   : style
    Created on : 02.06.2015, 11:37:52
    Author     : Juri
    Description:
        Purpose of the stylesheet follows.
*/


/*Reset*/
*{font-family: Verdana, Arial, Helvetica;padding:0;margin:0;float:none;}
root { 
    display: block;
}

body {
    background-color:#D7D6D6;
    margin:0;
}
html,body{
  min-height:100%;height:100%;
}
body#start{
    height:420px;
    min-height:420px;
    padding-top:10%;
}
a,a:visited,a:focus{
    color: #fff;
    text-decoration: none;
}
a:hover{
    text-decoration: none;
}
ol,ul,li{list-style-type:none;margin-left:20px;}
ol,ul{margin-bottom:20px;}
p{padding:0;margin: 0 40px 20px 20px;text-align: justify;}
ul li,p{font-size:11px;}




div#bg-wrapper-startseite{
    background-image: url("images/schoenmann-start-bg_crushed.png");
    background-repeat: no-repeat;
    height: 420px;
    margin: 0 auto;
    width: 760px;
}
div#bg-wrapper-startseite h1,
div#bg-wrapper-contentseite div#header h1{
    color: #fff;
    font-size: 17px;
    font-weight: 100;
    margin-right: 38px;
    position: relative;
    right: 0;
    text-align: right;
    top: 91px;
}
div#bg-wrapper-startseite ol{
    color: #fff;
    margin: 25% auto;
    width: 120px;
}
div#bg-wrapper-startseite ol li{
    font-size: 13px;
    list-style-type: none;
    padding-bottom: 3px;
    padding-top: 3px;
}
div#bg-wrapper-startseite ol li:hover{
    list-style-type: square; /*Fallback*/
    list-style-image: url('images/li-square_crushed.png');
}



/*Unternehmen*/
div#bg-wrapper-contentseite{
    /*height: 570px;*/
    height: 100%;
    width: 760px;
    /*margin:15% auto;*/
    margin:0 auto;
    
    position:relative; /* braucht es für die Footer Position*/
    min-height:100%; /* normale Browser */
}
div#bg-wrapper-contentseite div#header{
    background-image: url("images/header.png");
    background-repeat: no-repeat;
    height: 120px;
    width: 760px;
}
div#bg-wrapper-contentseite div#sidebar{
    background-image: url("images/sidebar.png");
    background-repeat: no-repeat;
    /*height: 450px;*/
    height:calc(100% - 120px);
    width: 159px;
    float:left;
    background-color:#820203;
}
div#bg-wrapper-contentseite div#content{
    padding-top:40px;
    background-color: #fff;
    /*height: 410px;*/
    height:calc(100% - 160px);
    width: 601px;
    float:left;
}
div#bg-wrapper-contentseite div#sidebar ol{
    color: #fff;
    margin: 25% auto;
    width: 120px;
}
div#bg-wrapper-contentseite div#sidebar ol li{
    font-size: 13px;
    list-style-type: none;
    padding-bottom: 4px;
    padding-top: 4px;
}
div#bg-wrapper-contentseite div#sidebar ol li.active{
    font-size: 13px;
    list-style-type: none;
    padding-bottom: 3px;
    padding-top: 3px;
    list-style-type: square; /*Fallback*/
    list-style-image: url('images/li-square_crushed.png');
}
div#bg-wrapper-contentseite div#sidebar ol li:hover{
    list-style-type: square; /*Fallback*/
    list-style-image: url('images/li-square_crushed.png');
}
div#bg-wrapper-contentseite div#content ul,div#bg-wrapper-contentseite div#content ul li{
    list-style-type: disc;
}
div#bg-wrapper-contentseite div#content img.teaser-image{
    float: right;
    padding: 0px 40px 20px 20px;
}
div#bg-wrapper-contentseite div#content a{
    color:#000;
    font-weight: bold;
}
div#bg-wrapper-contentseite div#content li a,div#bg-wrapper-contentseite div#content a.normal-weight{
    font-weight:normal;
}
div#bg-wrapper-contentseite div#content li a:hover{
    text-decoration: underline;
}

@media(max-width:640px){
    ul li,p{font-size:14px;margin-right: 20px;}
    body#start{margin:0;padding:0;}
    div#bg-wrapper-startseite {
        width: 480px;
    }
    
    div#bg-wrapper-startseite h1{
        top: 146px;
        font-size: 15px;
    }
    
    
    div#bg-wrapper-startseite ol {
        margin: 177px 50px;
    }
    
    div#bg-wrapper-startseite ol li {
        font-size: 15px;
        padding-bottom: 9px;
        padding-top: 9px;
    }
    
    div#bg-wrapper-contentseite {
        width: 480px;
    }
    div#bg-wrapper-contentseite div#sidebar ol li {
        font-size: 15px;
        padding-bottom: 9px;
        padding-top: 9px;
    }
    div#bg-wrapper-contentseite div#sidebar ol li.active {
        font-size: 15px;
    }
    div#bg-wrapper-contentseite div#header h1 {
        font-size: 12px;
        margin-right: 7px;
        top: 92px;
    }
    
    div#bg-wrapper-contentseite div#content {
        width: 320px;
        padding-top: 20px;
        height: auto;
    }
    
    div#bg-wrapper-contentseite div#sidebar {
        height: auto;
    }
    div#bg-wrapper-contentseite div#content img.teaser-image {
        float: left;
        padding: 0 100px 20px 20px;
    }
    
    div#bg-wrapper-contentseite div#header {
        background-image: url("images/header-480.png");
        width: 480px;
    }
    div#bg-wrapper-startseite {
        background-image: url("images/schoenmann-start-bg-480.png");
        width: 480px;
    }
}
@media(max-width:320px){
    ul li,p{font-size:14px;margin-right: 20px;}
    body#start{margin:0;padding:0;}
    div#bg-wrapper-startseite {
        width: 320px;
    }
    
    div#bg-wrapper-startseite h1{
        top: 146px;
        font-size: 15px;
    }
    
    
    div#bg-wrapper-startseite ol {
        margin: 177px 50px;
    }
    
    div#bg-wrapper-startseite ol li {
        font-size: 14px;
        padding-bottom: 9px;
        padding-top: 9px;
    }
    
    div#bg-wrapper-contentseite {
        width: 320px;
    }
    div#bg-wrapper-contentseite div#sidebar ol li {
        font-size: 14px;
        padding-bottom: 5px;
        padding-top: 9px;
    }
    div#bg-wrapper-contentseite div#sidebar ol li.active {
        font-size: 14px;
    }
    
    div#bg-wrapper-contentseite div#header h1 {
        font-size: 12px;
        line-height: 17px;
        margin-left: 121px;
        margin-right: 0;
        top: 92px;
        width: 171px;
    }
    
    div#bg-wrapper-contentseite div#content {
        width: 320px;
        padding-top: 20px;
        height: auto;
    }
    
    div#bg-wrapper-contentseite div#sidebar {
        height: 195px;
        width: 320px;
    }
    
    div#bg-wrapper-contentseite div#sidebar ol {
        margin: 0 41px;
    }
    div#bg-wrapper-contentseite div#content img.teaser-image {
        max-width: 160px;
        padding: 0 20px 10px 120px;
        float:right;
    }
    
    div#bg-wrapper-contentseite div#header {
        background-image: url("images/header-320.png");
        width: 320px;
    }
    div#bg-wrapper-startseite {
        background-image: url("images/schoenmann-start-bg-320.png");
        width: 320px;
    }
}