/**
 * @author Manuel Zarat
 */

@charset "utf-8";
@font-face {
    font-family: 'Sans Serif';
    font-style: normal;
    font-weight: 400;
}
html, body {
    padding:0;
    margin:0;
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
    font-size: 18px;
    background-color: lightsteelblue;
}

h1,h2,h3,.h1,.h2,.h3{
    font-family:inherit;
    font-weight:500;
    line-height:1.1;
    color:inherit
}
h1{
    font-size:36px;
    margin-top:20px;
    margin-bottom:10px;
}
h2{
    font-size:30x;
    margin-top:20px;
    margin-bottom:10px;
}
h3{
    font-size:24px;
    margin-top:10px;
    margin-bottom:10px;
}
p{
    orphans:3;
    widows:3;
    margin:0 0 10px;
}
a{
    color:#428bca;
    text-decoration:none;
}
a:hover, a:focus{
    color:#2a6496;
    text-decoration:underline
}
a:focus{
    outline:none;
    outline:5px auto -webkit-focus-ring-color;
    outline-offset:-2px
}
blockquote {
    font: 14px/22px normal helvetica, sans-serif;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 50px;
    padding-left: 15px;
    border-left: 0.5em solid #ccc;
}
pre,code {
     padding:.25em;
     overflow-x:auto;
     background:ghostwhite;
     font-family: "Courier 10 Pitch", Courier, monospace;
     font-size: 95%;
     line-height: 140%;
}
div{
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
}
.media-container {
     position: relative;
     padding-bottom: 56.25%;
     padding-top: 30px;
     height: 0;
     overflow: hidden;
}
.media-container iframe, .media-container object, .media-container embed {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

/**
 * Responive styles 
 * 
 */

/**
 * MIN 1000px
 *
 */
@media only screen and (min-width:1000px) {
    /** 
     * Main
     *
     */
    .sp-main-wrapper{
        width:1000px;
        background:white;
        margin:0px auto;
        margin-top:20px;
        margin-bottom:20px;
        box-shadow: 0 0 2px 2px silver;
    }
    .sp-main-header{
    }
    .sp-main-header-logo{
        padding:10px;
    }
    /**
     * Content
     * 
     */
    .sp-content {
         width:750px;
         float:left;
         padding:10px;
         clear:both;
    }
    .sp-content-item {
         //margin-bottom:10px;
    }
    .sp-content-item-head {
         font-size:24px;
         padding:10px;
         background:none;
    }
    .sp-content-item-head-secondary {
         padding:10px;
         color:grey;
         border-top:1px solid silver;
    }
    .sp-content-item-body {
         padding:10px;
    }
    /**
     * SIDEBAR 
     * 
     */
    .sp-sidebar{
         width:250px;
         float:right;
         padding:10px;
    }
    .sp-sidebar-item{
         margin-bottom:10px;
    }
    .sp-sidebar-item-head{
         font-size:24px;
         background:none;
         padding:10px;
    }
    .sp-sidebar-item-body{
         background:none;
    }
    .sp-sidebar-item-box-head{
        font-weight:bold;
        padding:10px;
    }
    .sp-sidebar-item-box-head-secondary {
        padding:10px;
        padding-top:0px;
        color:grey;
        border-top:1px solid silver;
    }
    .sp-sidebar-item-box-body {
        padding:10px;
        color:grey;
    }
    /**
     * Footer
     * 
     */
    .sp-footer{
        background:#f2f2f2;
        display:block;
        box-shadow: 0 0 2px 2px silver;
    }
}
/* MIN 1000px ENDE */

/* MAX 1000px */
 @media only screen and (max-width:1000px){
    /**
     * Main
     * 
     */
    .sp-main-wrapper{
        width:90%;
         background:white;
         margin:0px auto;
         margin-top:10px;
         margin-bottom:10px;
        box-shadow: 0 0 2px 2px silver;
    }
    .sp-main-header{
    }
    .sp-main-header-logo{
        padding:10px;
    }
    .sp-admin-content {
         padding:10px;
    }
    /**
     * Content
     * 
     */
    .sp-content {
         width:100%;
         float:left;
         padding:10px;
    }
    .sp-content-item {
         margin-bottom:10px;
    }
    .sp-content-item-head {
         font-size:24px;
         padding:10px;
         background:none;
    }
    .sp-content-item-head-secondary {
         font-size:16px;
         padding:10px;
         color:grey;
         background:none;
         border-top:1px solid silver;
    }
    .sp-content-item-body {
         padding:10px;
    }
    /**
     * Sidebar
     * 
     */
    .sp-sidebar{
         width:100%;
         float:left;
         padding:10px;
    }
    .sp-sidebar-item{
         border-top:0px solid silver;
         width: 50%;
         float: left;
    }
    .sp-sidebar-item-head{
         font-size:24px;
         background:none;
         padding:10px;
    }
    .sp-sidebar-item-body{
         background:none;
    }
    .sp-sidebar-item-box-head{
         font-weight:bold;
         padding:10px;
    }
    .sp-sidebar-item-box-head-secondary {
         padding:10px;
         color:none;
         border-top:1px solid silver;
    }
    .sp-sidebar-item-box-body {
         padding:10px;
         color:grey;
    }
    /**
     * Footer
     * 
     */
    .sp-footer{
        background:#f2f2f2;
        display:block;
        box-shadow: 0 0 2px 2px silver;
    }
}
/* MAX 1000px ENDE */

input[type=text] {
     width: 100%;
     padding:5px;
     -webkit-box-sizing: border-box;
    /* Safari/Chrome, other WebKit */
     -moz-box-sizing: border-box;
    /* Firefox, other Gecko */
     box-sizing: border-box;
    /* Opera/IE 8+ */
}
textarea {
     width: 100%;
     padding:5px;
     -webkit-box-sizing: border-box;
    /* Safari/Chrome, other WebKit */
     -moz-box-sizing: border-box;
    /* Firefox, other Gecko */
     box-sizing: border-box;
    /* Opera/IE 8+ */
}
input[type=submit] {
     float:right;
     padding:5px 15px;
     background:#ccc;
     border:0 none;
     cursor:pointer;
     -webkit-border-radius: 5px;
     border-radius: 5px;
}