
.blog_title{
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
    position: absolute;
    margin-left: 10px; 
    bottom: 65px;
    font-size: 20px;
}
.blog_title.zAwatarem{
    margin-left: 10px; 
}




#main{
    width:860px;
}

.boxes{
   margin: auto;
   width: calc(100% - 60px); 
}

#header1{
    min-height:246px;
    max-height:410px;
    top:0;
    width:100%;
    
}

#header1 .h_opacity{
    border:2px dashed #000;
    width:calc(100% - 4px);
    min-height:246px;
}


#header{
    width:100%;
    min-height:250px;
    margin:auto;
    padding:0;
    
    /*overflow: hidden;*/
    /*background: transparent url('/design/images/newLayout/blog/header.png') no-repeat;*/
}
#header div.left{
    min-width:60px;
    min-height:60px;
    margin-right:5px;
    float: left;
}
#header div.right{
    width:200px;
    height:60px;
    float: right;
    text-align:right;
}
#header div.left img{
    border: 4px solid #fff;
}
#header img{
    border:0;
    margin-top:-4px;
    top:0px;
    position:absolute;
    width:100%;
}


#header div.center{
    width:60px;
    height:60px;
    float: left;
}
#header div.center div.top{
    height:25px;
    position:absolute;
    background:#000;
    padding:5px 10px 0 10px;
    color:#fff;
}
#header div.center div.bottom{
    min-width:300px;
    position:absolute;
    margin-top:30px;
    height:25px;
    padding:5px 10px 0 10px;
}
#header div.center div.bottom a{
    color:#000;
    text-decoration:none;
}
#header div.center div.bottom div.col{
    min-width:30px;
    height:14px;
    padding:0px 10px 0 10px;
    text-align:center;
    border-right: 1px solid #000;
    float:left;
}

#header div.center div.bottom div.col_last{
    min-width:30px;
    height:14px;
    padding:0px 10px 0 10px;
    text-align:center;
    float:left;
}

#header div.center div.bottom div.col_last img{
    float:left;
    padding-top:2px;
    padding-right:10px;
}

#header div.center div.bottom div.col img{
    float:left;
    padding-top:2px;
    padding-right:10px;
}

#header_navi{

    height:0px;
    position:relative;
    margin-left:30px;
    padding-left:30px;
    margin:auto;
    top: -30px;
    width: 860px;
}

@media all and (min-width: 1680px) {
    #main, 
    #header_navi{
        width: 1685px;
    }
    
    .boxes{
       margin: auto;
       width: calc(100% - 20px); 
    }
}



/*
* response
*/
@media all and (min-width: 1370px) and (max-width: 1680px) { 
    
    #main, 
    #header_navi{
        width: 1350px;
    }
    
    .boxes{
       margin: auto;
       width: calc(100% - 20px); 
    }

}

@media all and (min-width: 1250px) and (max-width: 1369px) { 
    
    #main, 
    #header_navi{
        width: 1140px;
    }
        
    .boxes{
       margin: auto;
       width: calc(100% - 20px); 
    }
}

@media all and (min-width: 1014px) and (max-width: 1249px) { 
    
    #main, 
    #header_navi{
        width: 860px;
    }
        
    .boxes{
       margin: auto;
       width: calc(100% - 20px); 
    }
}

@media all and (max-width: 1013px) {
    
    #main, 
    #header_navi{
        width: 90%;
    }
    #header{
        /*min-height:200px !important;*/
    }
    .col_last div{
        position:static !important;
        margin-top:2px;
    }
    
    .boxes{
       margin: auto;
       width: calc(100% - 30px); 
    }
    
    #header_navi{
        margin-left:5px;
        padding-left:5px;
    }
    .blogNaviS ul li a{
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

#header_navi div.left{
    float:left;
    position: relative;
    position:absolute;
    bottom:0px;
}

#header_navi .avatarinfobox{
    position: absolute;
    bottom: 10px;
    right: 10px;
}

#header_navi .avatarinfobox img{
    border: none;
}

#header_navi div.left img{
    border:4px solid #fff;
/*    -moz-box-shadow:   0px 0px 5px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    box-shadow:         0px 0px 5px rgba(0, 0, 0, 0.5);*/
}
#header_navi div.center{
    margin-left: 188px;
}
#header_navi div.center.zAwatarem{
    margin-left: 188px;
}

@media all and (max-width: 1279px) { 
    #header_navi div.center.zAwatarem{
        margin-left: 143px; 
    }
    .avatarMax {
        max-width:135px;
    }
    
}

#header_navi div.center div.top{
    height:25px;
    line-height: 25px;
    position:absolute;
    background:#000;
    padding:2px 10px;
    color:#fff;
    /*left: 218px;*/
    bottom: 30px;
}
#header_navi div.center div.bottom{
    min-width:300px;
    position:absolute;
    /*margin-top:30px;*/
    margin-left: -4px;
    height: 22px;
    /*padding:5px 10px 0 0;*/
    bottom: 5px;
}
#header_navi div.center div.bottom a{
    color:#000;
    text-decoration:none;
}
#header_navi div.center div.bottom div.col{
    min-width:30px;
    height:14px;
    padding:0px 10px 0 15px;
    text-align:left;
    float:left;
    margin-top: 5px;
}

#header_navi div.center div.bottom div.col_last{
    min-width:30px;
    height:14px;
    padding:0px 10px 0 10px;
    text-align:center;
    float:left;
    margin-top: 3px;
}


@media all   and (max-width: 1020px) { 
    #header_navi div.center div.bottom div.col_last{
        margin-top: 5px;
    }
}

#header_navi div.center div.bottom div.col_last img{
    float:left;
    padding-top:2px;
    padding-right:10px;
    width:16px;
}

#header_navi div.center div.bottom div.col img{
    float:left;
    padding-top:2px;
    padding-right:10px;
}
 

 
.cloudNavi{
    min-width:300px;
    height:200px;
    position:absolute;
    z-index:1;
    padding:10px;
    background:#fff;
    text-align:left;
    border:1px solid #555;
    top:20px;
    cursor:auto;
    color:#000;
    
    display:none;
}

/* responsywny naglowek bloga */

    .header_blog_cover,
    #header1{
        height: 300px;
    }
    .zmien_button{
        top: 200px;
    }
    #saveit{
        top:260px;
    }

.header_blog_cover {
    width: 100%;
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid black;
}
    
@media all and (min-width: 1381px) { 
    
    .header_blog_cover,
    #header1{
    
        height: 410px;
  
    }

    .zmien_button {
        top: 310px;
    }
    #saveit{
        top:330px;
    }
}




@media all and (max-width: 800px)   { 
    .header_blog_cover,
    #header1{
        height: 250px;
    }
    .zmien_button{
        top: 150px;
    }
    #saveit{
        top:210px;
    }
}

