* {margin:0;padding:0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
/* ============== Reset css styles ==================== */
body
{
     font:15px/26px 'Open Sans', Verdana, sans-serif;
     color:#cccccc;
     font-weight:400;
     background: #202020 url('image/background.jpg') top center repeat fixed;
}

.clearfix:after
{
     content: ".";
     display: block;
     clear: both;
     visibility: hidden;
     line-height: 0;
     height: 0;
}

.clearfix
{
     display: inline-block;
}

html[xmlns] .clearfix
{
     display: block;
}

* html .clearfix
{
     height: 1%;
}

a, 
a:hover, 
a:visited
{
     outline:none;
}

a
{
     color:#00ccff;
     text-decoration:none;
}

a:hover
{
     color:#ff3333;
     cursor: pointer;
     text-decoration:underline;
}

a.normal,
a.normal:hover,
a.normal:visited
{
     outline:none;
}

a.normal
{
     color:#00ccff;
     text-decoration:none;
}

a.normal:hover
{
     color:#ff3333;
     cursor: pointer;
}

strong
{
     font-weight:600;
}

h1
{
     font-weight:400;
     font-size:26px;
     margin-top:30px;
     line-height:30px;
     color:#202020;
}

h2
{
     font-weight:400;
     font-size:22px;
     margin-bottom:0px;
}

p
{
     margin:0 0 15px 0;
}

img
{
     max-width:100%;
}

.wrap
{
     width:1000px;
     margin:0 auto;
}

.col1
{
     width:13.333%;
     margin-left:4%;
     float:left;
}

.col2
{
     width:30.667%;
     margin-left:4%;
     float:left;
}

.col3
{
     width:48.0%;
     margin-left:4%;
     margin-top: 0px;
     float:left;
}

.col4
{
     width:61.333%;
     margin-left:4%;
     float:left;
}

.col5
{
     width:82.667%;
     margin-left:4%;
     float:left;
}

.col6
{
     width:100%;
     margin:0;
     float:none;
}

.col7
{
     width:22.0%;
     margin-left:4%;
     float:left;
}

.col8
{
     width:74.0%;
     margin-left:4%;
     float:left;
}

.first
{
     margin-left:0;
}

.page_content
{
     position: absolute;
     min-width: 100%;
     min-height: 100%;
}

/* Main styles ========================= */

header
{
     border-bottom: solid #cccccc 1px;
     background-color:#202020;
     color:#cccccc;
     position:fixed;
     top:0;
     height:80px;
     width:100%;
     z-index:100;
}

nav ul
{
     float:right;
}

nav ul li
{
     float:left;
     list-style: none;
}

nav ul li a
{
     display:block;
     text-decoration:none;
     line-height:76px;
     border-bottom:4px solid transparent;
     padding:0 20px;
     color:#cccccc;
}

nav ul li a:hover
{
     color:#cccccc;
     text-decoration:none;
     border-bottom:4px solid #00ccff;
}

#pull
{
     display: none;
     background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MjdGOUZCN0NBODM3MTFFM0EyRTRBOTU4MjcwQTQxQzAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MjdGOUZCN0RBODM3MTFFM0EyRTRBOTU4MjcwQTQxQzAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyN0Y5RkI3QUE4MzcxMUUzQTJFNEE5NTgyNzBBNDFDMCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyN0Y5RkI3QkE4MzcxMUUzQTJFNEE5NTgyNzBBNDFDMCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Po5FVesAAAA/SURBVHjaYvz//z8DNQGLiYkJVU1kYqAyGPwGsgAxIyUGnDlzZgh6maJkA0x2o8lmNNmMJhuSASO1qwCAAAMAmYsPxoMaUkIAAAAASUVORK5CYII=") no-repeat scroll 0 10px rgba(0, 0, 0, 0);
     color:#cccccc;
     z-index:110;
     position:fixed;
     top:0;
     height:40px;
     line-height:40px;
     text-transform: uppercase;
     padding-left:30px;
     cursor:pointer;
}

#pull .btn
{
     display:block;
}

section
{
     width:100%;
     padding:50px 0;
     overflow: hidden;
}

/* new start */

#home
{
     border-bottom: solid #cccccc 1px;
     background:rgba(255,255,255,0.5);
     text-align:center;
     margin-top:80px;
     padding:100px 0;
     height: 370px;
}

#submenu
{
     padding:10px;
     background-color:#202020;
     border-bottom: solid #cccccc 1px;
     text-align: center;
}

#slider,
#timer
{
     padding:10px 0 10px;
     background-color:#202020;
     border-bottom: solid #cccccc 1px;
     text-align: center;
}

slider p
{
     font-size:14px;
     font-weight:350;
}

#manufacturer
{
     padding:10px;
}

#row1,
#row3,
#gallery1,
#gallery2,
#gallery3
{
     border-bottom: solid #cccccc 1px;
     background:rgba(59,59,59,1);
}

#row2
{
     border-bottom: solid #cccccc 1px;
     background:rgba(32,32,32,0.9);
}

#row4
{
     border-bottom: solid #cccccc 1px;
     background-color:#202020;
}

#footer
{
     padding:0px 0;
     background-color:#202020;
}

.name
{
     font-size:18px;
     margin:10px 0 5px;
}

.title
{
     font-size:16px;
     margin-bottom:0;
}

/* new ende */

.description
{
     color:#333333;
     font-size:16px;
     margin-bottom:0;
}

/* Config Box ==================== */

.box1,
.box2
{
     padding: 20px;
     border: 1px dotted;
}

.box1
{
     background-color: #3b3b3b;
}

.box2
{
     background-color: #202020;
}

/* Textausrichtung =============== */

.just
{
     text-align: justify;
}

.center
{
     text-align: center;
}

.right
{
     text-align: right;
}

.small
{
     font-size:12px;
}

/* Footer ========================= */

footer
{
     color:#666;
     text-align:center;
     font-size:12px;
     margin:40px auto 10px;
}

footer a
{
     color:#666;
     text-decoration:underline;
}

footer a:hover
{
     color:#00ccff;
}

/* Input Button Start */

input[type="submit"], input[type="submit"]:hover
{

    color: #00ccff;
    border: 0px;
    font-size: 13px;
    cursor: pointer;

}

input[type="submit"]:hover
{

    color: #ff3333;

}

/* Input Button Ende */

/* Responsive styles ========================= */

@media screen and (max-width:1020px) {
    .wrap {
        width:86%;
    }
}
@media screen and (max-width:768px) {
    .col1,
    .col2,
    .col3,
    .col4,
    .col5,
    .col7 {
        width:100%;
        float:none;
        margin:0 0 20px;
    }
}
@media screen and (max-width: 680px) { 
    header {
        height:40px;
    }
    nav ul { 
        display: none; 
        height: auto; 
        text-align:left;
        width:100%;
        margin-top:40px;
    }  
    nav ul li {
        display: block;  
        float: none;  
        width: 100%; 
        padding-left:10px; 
        border-bottom:1px solid #cccccc;
        background-color:#202020;
    }
    nav ul li:hover {
        background-color:#202020;
        border-bottom:5px solid #00ccff;
    }
    nav ul li a {
        padding:10px;
        line-height:20px;
        border:none;
    }
    nav ul li.active a, 
    nav ul li a:hover {
        border:none;
        
    }
    #pull { 
        display: block;
    } 
    #home {
        margin-top:40px;
        padding:100px 0;
    }
}