@import url("povratak.css");

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

.text_wrap, login_wrap p { font-size: 20pt; }

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

.head_wrap h1 { font-size: 5vw; color: #fff; margin-left: 3%; margin-top: 1.5%;}

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

.menu_img {
    width: 10%;
    margin-left: 10%;
}

.btn_wrap {
    padding-top: 20px;
    padding-bottom: 20px;
    background: #2a303b;
    color: #fff;
}

.btn_wrap a {
    color: #fff;
    border: 1px solid #fff;
    text-align: center;
}

.text_wrap {
    width: 80%;
    margin-top: 5%;
    margin-left: 10%;
    padding-bottom: 5%;
}

.text_wrap p { 
    margin-top: 2%; 
    color: #2a303b;
}

/* ----- FORM_WRAP CSS ------*/


.login_wrap {
    padding-top: 20px;
    padding-bottom: 20px;
    margin-bottom: 1px;
    background: #2a303b;
    color: #fff;
}

.login_wrap a {
    margin-top: 20px;
    color: #fff;
}

.form_wrap { padding: 20px 0px 20px 0px;}

form { padding-top: 40px; padding-bottom: 40px;}

.input_wrap {margin-left: 2px; padding: 0px 0px;}

.next_input {width: 23%; margin-left: 0%; margin-top: 20px;}
.next_input_2 { width: 24.15%; margin-left: 1.5%; margin-top: 20px;}

label {margin-left: 0px; padding-left: 0px;}


/*--------- REZULTATI PRETRAGE   ------------*/

.search_head_wrap { border: 2px solid #dcdfe3;}

.search_head h2 {padding-top: 10px; padding-bottom: 0px; font-size: 17pt;}

.search_headline { border: 2px solid #dcdfe3;}

.search_headline p, .search_type p { padding-top: 10px; padding-right: 5px; color: #2a303b; font-size: 20pt;}

.search_type { border: 2px solid #dcdfe3;}





@media screen and (max-width: 991px) {
    .next_input, .next_input_2 { width: 100%; margin-left: 0px;}
    
}




/* ----- PREUZMI SLUSAJ CSS ------*/


.back_wrap_2 { background-color: #2a303b; padding-top: 2%; padding-bottom: 2%; margin-bottom: 1px;}


.back_img_2 { display: block; width: 15%; height: 15%; margin-left: 5%; padding-top: 1%; padding-bottom: 1%;}

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

.btn_hold_1 { width: 18%; margin-left: 10.8%;}
.btn_hold_2 { width: 18%; margin-left: 2%;}
.btn_hold_3 { width: 18%; margin-left: 2%;}
.btn_hold_4 { width: 18%; margin-left: 2%;}

.btn_hold_1 p { margin-left: 27%; margin-bottom: 0px; padding-top: 0.5%; padding-bottom: 0px !important;}
.btn_hold_2 p { margin-left: 21%; margin-bottom: 0px; padding-top: 0.5%; padding-bottom: 0px !important;}
.btn_hold_3 p { margin-left: 17%; margin-bottom: 0px; padding-top: 0.5%; padding-bottom: 0px !important;}
.btn_hold_4 p { margin-left: 17%; margin-bottom: 0px; padding-top: 0.5%; padding-bottom: 0px !important;}

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


.povratak_btn_2: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) {
    
    .povratak_btn_2 {font-size: 4vw;}
    .back_img_2 { display: block; width: 15%; height: 15%; margin-left: 5%; padding-top: 1%; padding-bottom: 1%;}
    .btn_hold_1 { width: 35%; margin-left: 12%;}
    .btn_hold_2 { width: 35%; margin-left: 6%;}
    .btn_hold_1 p {margin-left: 25%;}
    .btn_hold_2 p {margin-left: 20%;}
    
    .btn_hold_3 { width: 35%; margin-left: 12%;}
    .btn_hold_4 { width: 35%; margin-left: 6%;}
    .btn_hold_3 p {margin-left: 18%;}
    .btn_hold_4 p {margin-left: 17%;}
}