* {
    margin: 0;
    padding: 0;
}
body{
    background:#e7e8e9;
}
#canvas{
    width:1000px;
    margin:0 auto;
}
#red_stripe{
    top:308px;
    height:97px;
    min-width: 1000px;
    width:100%;
    position: absolute;
    background:#620101 url("../images/red_stripe.png") no-repeat center top;
    z-index:1;
}
#slider{
    height:263px;
    width:959px;
    margin:103px 0 0 21px;
    position: absolute;
    z-index:2;

}
#logo{
    position: absolute;
    width:375px;
    height:50px;
    background:url("../images/logo.png");
    margin:45px 0 0 40px;
}
nav{
    float:right;
    margin:62px 5px 0 0;
    height:41px;
    width:550px;
}
nav ul{
    float:right;
}
nav ul li{
    float:left;
}
.skew{
    height:41px;
    width:100px;
    transform: skew(-35deg);
    -ms-transform: skew(-35deg);
    -webkit-transform: skew(-35deg);
    -moz-transform: skew(-35deg);
    -o-transform: skew(-35deg);
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
    -moz-backface-visibility:hidden; 
    background:#fff url("../images/button_shadow.png") no-repeat left bottom;
}

nav ul li a{
    font-family:trebuchet ms, arial;
    font-weight: 700;
    font-size:12px;
    text-transform: uppercase;
    
}
nav ul li a:hover .skew, nav ul li.active a .skew{
    border-left:3px solid #b72126;
    margin-left:-3px;
    background: #fff;
}
nav ul li a:hover span, nav ul li.active a span{
    color:#b72126;
}
nav ul li a span{
    position: absolute;
    line-height: 44px;
    width:100px;
    text-align: center;
    color:#939598;
    z-index: 4; 
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.43s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
.longer .skew,.longer, .longer span{
    width:130px;
} 
header{
    width:1000px;
    height:366px;
    position: relative;
}
#mask{
    width:30px;
    height:41px;
    background:#e7e8e9;
    margin:0 0 0 535px;
    z-index: 6; 
    position: absolute;
}
#box_holder{
    width:960px;
    height:165px;
    margin:20px 0 0 20px;
    position: absolute;
    z-index:2;
}
.box{
    width:220px;
    height:165px;
    float:left;
    margin:0 0 0 15px;
    background:url("../images/box_shadow.png")no-repeat center 108px;
}
.box:first-child{
    margin:0 0 0 18px;
}
.box span{
    font-family: tahoma,trebuchet ms, arial;
    font-size:12px;
    color:#414042;
    font-weight:500;
    margin:10px 0 0 0;
    text-transform: uppercase;
    position: absolute;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.43s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
.box:hover{
    cursor: pointer;
}
.box:hover span{
    color:#b72126;
}
.box span:before{
    content:'';
    width:220px;
    margin:18px 0 0 0;
    position: absolute;
    border-bottom:3px solid #414042;
}
.box:hover span:before{
    border-bottom:3px solid #b72126;
}
.box .image{
    width:220px;
    height:129px;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.43s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
.box .first{
    background:url("../pictures/box1.jpg");
}
.box .first:hover{
    background:url("../pictures/box1_hover.jpg");
}
.box .second{
    background:url("../pictures/box2.jpg");
}
.box .second:hover{
    background:url("../pictures/box2_hover.jpg");
}
.box .third{
    background:url("../pictures/box3.jpg");
}
.box .third:hover{
    background:url("../pictures/box3_hover.jpg");
}
.box .fourth{
    background:url("../pictures/box4.jpg");
}
.box .fourth:hover{
    background:url("../pictures/box4_hover.jpg");
}
#content{
    width:960px;
    position: relative;
}
footer{
    width:960px;
    height:130px;
    background:#252525;
    margin:0px 0 40px 20px;
}
#o_firmie{
    position: absolute;
    margin:10px 0 0 20px;
    font-family: tahoma, trebuchet ms, arial;
    color:#989898;
}
#szybki_kontakt{
    margin:10px 20px 0 20px;
    float:right;
    text-align: right;
    font-family: tahoma, trebuchet ms, arial;
    color:#989898;
}
#o_firmie span, #szybki_kontakt span{
    font-size:13px;
    text-transform: uppercase;
}
#o_firmie p,#szybki_kontakt p{
    margin-top:10px;
    font-size:11px;
}
footer a{
    color:#989898;
}
footer a:hover{
    color:#971418;
}
#szymon{
    width:960px;
    position: absolute;
    margin-top:113px;
}
#szymon p{
    font-size:10px;
    text-align: center;
    font-family: tahoma, trebuchet ms, arial;
    color:#989898;
}
#szymon img{
    float:right;
    margin-top:2px;
    margin-left: 4px;
}
#mask_text{
    width:920px;
    height:20px;
    position: absolute;
    margin:0px 0 0 40px;
    background:#fff;
    z-index:2;
}
#text{
    z-index:2;
    background:#fff;
    width:920px;
    margin:20px 0 20px  40px;
    color:#000;
    font-family: arial, trebuchet ms, tahoma, arial;
}
#text:after{
    content:'';
    position: absolute;
    width:920px;
    height:10px;
    background:#fff;
    margin-top:-30px;
}
#text:before{
    content:'';
    position: absolute;
    width:920px;
    height:2px;
    bottom:0;
    -webkit-box-shadow: 0px 1px 16px rgba(50, 50, 50, 1);
    -moz-box-shadow:    0px 1px 16px rgba(50, 50, 50, 1);
    box-shadow:         0px 1px 16px rgba(50, 50, 50, 1);
}
#text h2{
    color:#971418;
    text-transform: uppercase;
    font-size:16px;
    font-weight: 700;
    padding: 20px 0 0 20px;
}
#text p{
    font-size:14px;
    
    margin:20px;
    padding-bottom:20px;
}
#text a{
    color:#000;
}
#text a:hover{
    color:#971418;
}
#map{
    width:450px;
    height:203px;
    border-bottom:1px solid #971418;
    float:right;
    margin:20px;
}