:root {--red:#ff3838; --gray:#777777; --blue:#1494a9; --white:#ffffff; --chalk:#f5f5f5; --green:#11b76b; --purple:#b12fad; --orange:#e86121; --yellow:#ffab10; --text:#555555; --dark:#0d0633; --border:#e8e8e8; --heading:#232d3b; --primary:#0044bb; --primary-light:#75a7ff; --primary-hover:#0022aa; --view:#8edb04; --click:#01cbd5; --rating:#e8ce00; --sale:#dc3545; --rent:#03a70c; --booking:#7209af; --facebook:#3b5998; --linkedin:#0e76a8; --twitter:#00acee; --primary-bshadow:0px 15px 35px 0px rgba(0, 0, 0, 0.1); --primary-tshadow:2px 3px 8px rgba(0, 0, 0, 0.1)}
.form-group {margin-bottom:30px}
.form-control {border:none; width:100%; height:280px; padding:10px 20px; border-radius:0px; color:var(--heading); background:var(--chalk); border-bottom:2px solid #eee; font-size:17.5px!important; -webkit-transition:all linear .3s; -moz-transition:all linear .3s; -ms-transition:all linear .3s; -o-transition:all linear .3s; transition:all linear .3s}
.form-control:focus {outline:none; box-shadow:none; color:var(--gray); background:var(--chalk); border-color:var(--nav-link)}
textarea.form-control {height:215px; padding:15px 20px}
.form-btn .btn {width:100%; height:50px; padding:10px 30px}
.form-label {font-size:16px; font-weight:600; color:var(--gray); margin-bottom:8px; text-transform:capitalize}
.form-control::-webkit-file-upload-button {height:45px; border:none; background:none; color:var(--placeholder)}
.form-control::-webkit-file-upload-button:focus {border:none; outline:none}
.form-control::placeholder {color:#ccc; opacity:1;}
.btn {border:none; font-size:17.5px; font-weight:500; border:2px solid; padding:14px 32px; border-radius:8px; letter-spacing:1.5px; text-transform:uppercase; text-shadow:var(--primary-tshadow); -webkit-transition:all linear .3s; -moz-transition:all linear .3s; -ms-transition:all linear .3s; -o-transition:all linear .3s; transition:all linear .3s}
.btn:focus {box-shadow:none !important}
.btn i {margin-top:-1px; margin-right:5px}
.btn-inline {color:var(--white); background:var(--btn-on)!important; border-color:var(--btn-on)!important}
.btn-inline:hover {color:var(--black); background:var(--btn-color)!important; border-color:var(--btn-color)!important}
.btn-outline {color:var(--primary); background:var(--white); border-color:var(--primary)}
.btn-outline:hover {color:var(--white); background:var(--primary); border-color:var(--primary)}
.nav {flex-wrap:nowrap; align-items:center; justify-content:center}
.nav-tabs li {width:100%}
.nav-tabs li .nav-link {width:100%; border:none; padding:16px 0px; text-align:center; font-size:17.5px; font-weight:500; color:white; letter-spacing:0.5px; background:var(--nav-link)!important; border-radius:var(--tab-radius); border-bottom:3px solid transparent; text-shadow:var(--primary-tshadow)}
.nav-tabs li .nav-link:hover {color:white!important; background:var(--nav-link-on)!important; border-color:var(--nav-link-on)!important}
.nav-tabs li .nav-link.active {color:var(--nav-link) !important; background:white !important; border-color:var(--nav-link) !important}
.tab-pane {display:none; padding:0px 50px}
.tab-pane.active {display:block}

@media (max-width: 575px) {
.nav-tabs li .nav-link {padding:10px 0px;}
.tab-pane {padding:0px 15px;}
}

@media (min-width: 576px) and (max-width:991px) {
.tab-pane {padding:0px 25px;}
}

.user-form-part {display:flex; align-items:center; justify-content:center; justify-content:space-between}
.user-form-banner {width:60%; height:100vh; background-repeat:no-repeat; background-position:center; background-size:cover; position:relative; z-index:1}
.user-form-banner::before {position:absolute; content:""; top:0px; left:0px; width:100%; height:100%; background:linear-gradient(to right, hsla(88, 50%, 60%, 0.9), hsla(88, 50%, 60%, 0.55)); z-index:-1}
.user-form-content {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center; width:600px}
.user-form-content a {margin-bottom:35px}
.user-form-content a img {width:250px; height:auto}
.user-form-content h1 {color:var(--white); font-size:45px; line-height:55px; margin-bottom:45px}
.user-form-content h1 span {display:block}
.user-form-content p {color:var(--white); font-size:24px; line-height:32px}
.user-form-category {width:40%; height:100vh; background:#fbfbfb; overflow-y:scroll; overflow-x:hidden}
.user-form-header {position:fixed; top:50px; left:50px; z-index:1}
.user-form-header a i:hover {color:var(--white); background:var(--primary)}
.user-form-category-btn .nav-tabs {margin-top:-10px!important; margin-bottom:40px}
.user-form-category-btn .nav-tabs li a {padding:20px 0!important}
.user-form-title {text-align:center; margin-bottom:45px}
.user-form-title h2 {margin-bottom:7px}
.user-form-option {display:flex; align-items:center; justify-content:center; margin-bottom:30px}
.user-form-option li {margin:0px 8px}
.user-form-option li a {width:125px; padding:5px; color:var(--white); border-radius:8px}
.user-form-option li a i {width:32px; height:32px; line-height:32px; text-align:center; border-radius:8px; font-size:12px; margin-right:8px; text-shadow:var(--primary-tshadow)}
.user-form-option li a span {font-size:14px; text-transform:capitalize; text-shadow:var(--primary-tshadow)}
.user-form-option li:nth-child(1) a {background:#4267B2}
.user-form-option li:nth-child(1) a i {background:#375797}
.user-form-option li:nth-child(2) a {background:#1DA1F2}
.user-form-option li:nth-child(2) a i {background:#1a95e2}
.user-form-option li:nth-child(3) a {background:#DB4437}
.user-form-option li:nth-child(3) a i {background:#be3a2e}
.user-form-devider {position:relative; z-index:1}
.user-form-devider::before {position:absolute; content:""; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:1px; background:#e8e8e8; z-index:-1}
.user-form-devider p {width:80px; height:80px; line-height:50px; text-align:center; border-radius:50%; background:rgb(97,97,210); border:1px solid #e8e8e8; margin:-15px auto 15px}
.user-form-devider p img {position:relative; top:7px; width:80%; height:80%}
.user-form-direction {text-align:center; margin:30px 0px 50px}
.user-form-direction p {color:#666666; font-size:18px; width:290px; margin:0 auto}
.user-form-direction p span {font-weight:500; color:var(--nav-link)}
.form-group {margin-bottom:20px; position:relative}
.form-group:focus-within .form-icon {visibility:visible; opacity:1}
.form-group:focus-within .form-alert {display:block}
.form-group .btn {width:100%; padding:10px 30px}
.form-group p:first-of-type {margin:20px 10px 20px -15px}
.form-group p.form-pass {font-size:15.8px; line-height:0.1}
.form-control {letter-spacing:1.5px; width:100%; height:45px; background:var(--white); padding:10px 55px 10px 20px; font-size:15px; -webkit-transition:all linear .3s; -moz-transition:all linear .3s; -ms-transition:all linear .3s; -o-transition:all linear .3s; transition:all linear .3s}
.form-control:focus {outline:none; box-shadow:none; color:var(--gray); background:var(--white); border-color:var(--nav-link)}
input[type=password]::-ms-reveal, input[type=password]::-ms-clear {margin-right:-40px;}
.form-alert {display:none; padding:3px 20px}
.form-forgot {font-size:15px; color:var(--gray)}
.form-forgot:hover {color:var(--primary); text-decoration:underline}
.custom-control-label {display:block; width:300%!important; font-size:15px; line-height:26px; cursor:pointer}
form.poruka .form-group {margin-top:-5px; font-size:17px;}
form.poruka .form-group input.checkbox {min-width:20px!important; max-width:20px!important}
form.poruke input.checkbox + label {width:70%!important}
.custom-control-input {appearance:none; background-color:#fafafa; border:1px solid #cacaca; box-shadow:0 1px 2px rgba(0,0,0,0.05); border-radius:3px; display:inline-block; position:relative; top:-5px}
.custom-control-input:checked ~ .custom-control-label::before {content:'\2714'; font-size:17px; position:absolute; top:4px; left:0px; color:#99a1a7}
.custom-checkbox {display:flex; flex-direction:row-reverse; justify-content:flex-end; width:300%}
.form-forgot {padding-left:20px; font-size:17px}
.form-grid {display:flex; align-items:center; justify-content:center; justify-content:space-between; background:var(--primary); border-radius:8px}
.form-grid input {width:100%; height:45px; border:none; background:transparent; padding:0px 20px}
.form-grid .btn {width:180px; height:45px; padding:14px 0px; text-align:center}
.user-form-direction p {letter-spacing:0.8px}

@media (max-width: 767px) {
.user-form-option li a {width:auto;}
.user-form-option li a i {width:60px; margin-right:0px;}
.user-form-option li a span {display:none;}
.user-form-category-btn .nav-tabs {margin-top:-10px!important; margin-bottom:40px;}
.user-form-category-btn .nav-tabs li a {padding:20px 0!important;}
}

@media (max-width: 575px) {
.user-form-banner {display:none;}
.user-form-category {width:100%;}
}

.user-form-header {display:flex; align-items:center; justify-content:center; justify-content:space-around; padding:3px; top:0px; left:0px; z-index:3; width:100%; background:var(--white); box-shadow:0px 5px 15px 0px rgba(0, 0, 0, 0.1);}
.user-form-header a:nth-child(1) {display:block;}
.user-form-header a img {width:150px;}
.user-form-header a i {width:40px; height:40px; line-height:40px; color:var(--primary); background:var(--white);}
.user-form-header a i:hover {color:var(--white); background:var(--primary);}
.user-form-category-btn {margin-top:72px;}
.user-form-direction p {width:100%;}

@media (min-width: 576px) and (max-width:767px) {
.user-form-banner {width:42%;}
.user-form-content {width:230px;}
.user-form-content a img {width:150px;}
.user-form-content h1 {font-size:20px; line-height:30px; margin-bottom:25px;}
.user-form-content p {font-size:16px;}
.user-form-category {width:58%;}
.user-form-direction p {width:260px;}
}

@media (min-width: 768px) and (max-width:991px) {
.user-form-banner {width:40%;}
.user-form-content {width:280px;}
.user-form-content a img {width:200px;}
.user-form-content h1 {font-size:28px; line-height:36px; margin-bottom:25px;}
.user-form-content p {font-size:20px; line-height:28px;}
.user-form-category {width:60%;}
}

@media (min-width: 992px) and (max-width:1199px) {
.user-form-banner {width:50%;}
.user-form-content {width:460px;}
.user-form-content a img {width:200px;}
.user-form-category {width:50%;}
}

body {overflow-y:hidden}
#back-to-top {display:none}
.header-main .top-bar-end .custom {visibility:hidden}
button.btn-prijava > i.icon-unlock:before {color:white!important}
.podatci {width:100%; height:100px; padding:20px!important; border-radius:8px; color:white; background-color:hsla(88, 50%, 60%); font-size:21px!important; text-align:center}
.podatci span {display:block; color:#555; text-align:center}