



body {
    font-family: Verdana, sans-serif;
    font-size: 20pt;
    color: #000;
}

.main_menu {
    background-color: #505b71;
}

.zaklada, .knjiznica, .udruga {margin-right: 20px; color: #fff; padding: 5px 10px; font-size: 15pt;}

.zaklada:hover, .knjiznica:hover, .udruga:hover {color: #505b71; background-color: #fff; text-decoration: none;}

.knjiznica {color: #505b71; background-color: #fff;}

.head_wrap {
    height: auto;
    padding-top: 3%;
    padding-bottom: 1%;
    background: url("../img_book/kniznica_back_img.jpg") no-repeat;
    background-size:cover;
    background-position:center center;
}

.head_wrap h1 { font-size: 4vw; color: #fff;}

.head_wrap h2 { font-size: 2vw; color: #fff; padding-top: 2%;}

.divider {width: 100%; height: 2vw;}

.img_wrap_1 {
    margin-top: 3%;
}

.img_wrap {
    margin-top: 3%;
    margin-left: 0px;
}

.img_wrap:hover, .img_wrap_1:hover { 
    text-decoration: none;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transform: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
}



.menu_img {
    width: 35%;
}

.btn_wrap {
    width: 80%;
    margin-left: 10%;
    padding-top: 1%;
    padding-bottom: 2.5%;
}

.menu_btn {
    min-height: 8vw !important;
    text-align: center;
    margin-top: 6%;
    margin-left: 6%;
    padding: 1% 1%;
    font-size: 2vw;
    color: #fff !important;
    /*background-color: #5f6f89;*/
    background-color: #505b71;
    border-radius: 10px;
    border: #fff 2px solid;
}

.space_btn { padding-top: 3%;}

/* ----- POVRATAK CSS ------*/


.back_wrap { background-color: #2a303b; padding-top: 2%; padding-bottom: 4%;}


.back_img { display: block; width: 5%; height: 5%; margin-left: 20%;}

.back_wrap p { margin-left: 1%; margin-bottom: 0px; padding-top: 0.5%; padding-bottom: 0px !important;}

.povratak_btn {
    width: 80% !important;
    height: auto;
    text-align: center;
    margin-top: 3%;
    margin-left: 10%;
    padding: 1% 1%;
    font-size: 2vw;
    color: #fff !important;
    border-radius: 10px;
    border: #fff 2px solid;
}


.povratak_btn:hover {

-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-ms-transform: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
-ms-transform: scale(1.05);
-o-transform: scale(1.05);
transform: scale(1.05);
}


/*------- END OF POVRATAK --------*/

.fond_wrap { width: 80%; margin-left: 10%; background-color: #2a303b; color: #fff; font-size: 1.2vw;}
.fond_wrap p { margin-top: 30px;}


.menu_btn:hover {

-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-ms-transform: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
-ms-transform: scale(1.05);
-o-transform: scale(1.05);
transform: scale(1.05);
}


@media screen and (max-width: 991px) {
    
    
.head_wrap h2 { font-size: 4.5vw; color: #fff; padding-top: 2%;}
   
.divider { height: 0px;}
.btn_wrap {
    width: 100%;
    margin-left: 0px;
}

.menu_img { width: 10%;}
.img_wrap, .img_wrap_1 { margin-left: 0%; border: solid 2px #5f6f89; padding-top: 10px; border-radius: 10px;}




    .menu_btn {
    min-height: 8vw !important;
    text-align: center;
    margin-top: 6%;
    margin-left: 0%;
    padding: 2.5% 1%;
    font-size: 4vw;
    color: #fff !important;
    background-color: #5f6f89;
    border-radius: 10px;
    border: #fff 2px solid;
}

.space_btn { padding-top: 3%;}


.povratak_btn { width: 92% !important; margin-left: 4%; font-size: 4.5vw;}
    
    .back_img { display: none !important;}

    
}



@media screen and (max-width: 575px) {
    
    
.head_wrap h2 { font-size: 6.5vw; color: #fff; padding-top: 2%;}
    
.btn_wrap {
    width: 100%;
    margin-left: 0px;
}

.menu_img { width: 10%;}
.img_wrap, .img_wrap_1 { margin-left: 0%; border: solid 2px #5f6f89; padding-top: 10px; border-radius: 10px;}




    .menu_btn {
    min-height: 8vw !important;
    text-align: center;
    margin-top: 6%;
    margin-left: 0%;
    padding: 2.5% 1%;
    font-size: 4vw;
    color: #fff !important;
    background-color: #5f6f89;
    border-radius: 10px;
    border: #fff 2px solid;
}

.space_btn { padding-top: 3%;}


.povratak_btn { width: 92% !important; margin-left: 4%; font-size: 6.5vw;}
    
    .back_img { display: none !important;}

    
}