/*
 Theme Name:   BannerTestSite
 Theme URI:    http://www.ergebnisselive24.de/
 Description:  twenty sixteen child
 Author:       Valentin Bahchevanov
 Author URI:   http://e-2.at
 Template:     twentysixteen
 Version:      1.0.0
 License:      http://e-2.at
 License URI:  http://e-2.at
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-sixteen-child
*/

/**
 * 1.0 - Normalize
 *
 */

* {
    box-sizing: border-box;
    
}

html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    margin: 0;
    background-color:#fff;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary,
div 
iframe  {
    display: block;
    
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline;
}


.screen-reader-text {
    display: none;
}

.site-description {
    display: none;
}




#page,
#primary .entry-content,
#colophon{
    margin: 0 auto;
    width: 100%;
    display: block;
}


#masthead {
    margin-left: 10px;
    margin-right:10px;
}


#page #content {
     margin: 10px;
     text-align: justify;
}

#site-navigation {
    display: none;
    text-align: center;
    width: 100%;
}

#site-navigation ul {
    background: transparent;
    filter: inherit;
    background: #2582b5;
    background: -moz-linear-gradient(top, #166092 0%, #0a2d45 100%);
    background: -webkit-linear-gradient(top, #166092 0%,#0a2d45 100%);
    background: linear-gradient(to bottom, #166092 0%,#0a2d45 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#166092', endColorstr='#0a2d45',GradientType=0 );
    margin: 0;
    padding: 0;
}

#site-navigation ul  li {
    display: inline-block;
    list-style: none;
    padding: 0;
    position: relative;
}

#site-navigation ul  li  a{
    color: #fff;
    display: block;
    font-size: 14px;
    font-size: 0.875em;
    font-weight: 400;
    line-height: 1.2;
    padding: 17px 30px;
    text-decoration: none;
    text-transform: uppercase;
}


 
#page #primary .square {
   float: none;
   margin-bottom: 20px;
  
}

.headerbanner ,
.skyscraper ,
.square,
.billboard {
    width: 100%; 
}


.headerbanner > div,
.skyscraper > div,
.square  > div,
.billboard  > div
{
    width:100%;
    height:100%;
    margin:0;
    position: relative;
    display: block;
}




.headerbanner {
    height: 90px;
    max-width:728px;
    outline: 2px solid red;
    -moz-outline: 2px solid red;
    -webkit-outline:2px solid red;
        
}


.billboard {
    height: 250px;
    max-width: 970px;
    outline: 2px solid orange;
     -moz-outline: 2px solid orange;
    -webkit-outline:2px solid orange;
        
}


.skyscraper {
    max-width: 300px;
    height:600px;
    outline: 2px solid blue;
     -moz-outline: 2px solid blue;
    -webkit-outline:2px solid blue;
	
}

.square {
    max-width: 300px;
    height:250px;
    outline: 2px solid yellow;
     -moz-outline: 2px solid yellow;
    -webkit-outline:2px solid yellow;
}


.spacer {
    width: 100%;
    height: 30px;
    display: block; 
}



@media (min-width:1050px){

    #page {
        width:1050px;
        padding: 0 0 10px 0;
    }

    #masthead {
        margin: 0;
    }

    #page #content {
        padding: 0;
        margin: 0;
        position: relative;

    }

    #page #primary .square {
       float: right;
       margin-left: 20px;
       margin-bottom: 10px;
      
    }

    #primary,
    #secondary {
       display: inline-block;
       vertical-align: top;
    }

    
    #primary {
        width:730px;
        margin-right: 10px;
    }

    #secondary {
        width: 300px;
    }

    #site-navigation {
        display: inline-block;
        
    }

    
}