@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&display=swap');
:root {
    --black-color: #000;
}
html, body {overscroll-behavior: contain;}
body {
    font-family: "Open Sans", sans-serif; 
    background:#fefefe;
    font-weight: 400
}
#logo img {max-width: 270px}
.bld {font-weight: 600;}
.slideshow-container {
    padding:0;background-color:#174f98;width: 100%;height: 400px;
    background-image: url(../img/back-3.jpg);
    background-position: bottom right;
    background-size: cover;
}

.h1, h1 { font-size: 2.6rem;margin-bottom: 2.3rem;color: #1454ad;font-weight: 400;text-transform: uppercase;}
.h2, h2 { font-size: 2.3rem;margin-bottom: 1.4rem;color: #1454ad;font-weight: 400;}
.h3, h3 { font-size: 1.4rem;margin-bottom: 1.2rem;font-weight: 600; line-height: 1.7rem}
.h4, h4 { font-size: 1.3rem;margin-bottom: 0.7rem }

.container {
    max-width: 1100px;
}
.container-full {padding: 0 6rem}
.container-slogan {width:100%;text-align: center;position:absolute;z-index:1001;margin:110px auto 0 auto}
.container-slogan h1 {text-transform: none !important;color:#b6dcff;font-weight: 600;text-shadow: 2px 2px 3px #111}
.container-slogan h2 {text-transform: none !important;color:#fff;font-weight: 600;margin-top: 1.1rem;font-size:3.7rem;text-shadow: 2px 2px 3px #111}

p {font-size: 1.2rem;color:#222;line-height:1.9rem}

#header {position:absolute;top:20px;left:0;background:transparent !important;width:100%;z-index:1001;}
.header-color {background:#111 !important;transition: ease-in 400ms;}
.header-color-article {background:#222 !important}
#header a {color:#666;text-decoration: none;}
#header a.link {color:#aaa;text-decoration: none;font-size: 1.3rem;margin-right: 10px;}
#header a:hover, #header a.link:hover {color:#ffba33}
#header .lang-icon {border:1px solid #5e483a;margin-right: 0}
#header .fb-icon {margin-top:25px;margin-right: 5px}
a.ml-1 {margin-left:3rem !important}

.header {background-color:#fff}
b, strong {color:#303030;font-weight:600 !important}

.article-line {height:2px;border:0;background:#d6d6d6;width:15rem;margin:0.6rem auto 2rem auto}
.mb-5 {margin-bottom: 2.5rem !important;}

h1 strong {font-weight: normal}
a {color: var(--black-color);}
a:hover {color: #111}

.novsat-2-img {
    float:right;
    margin-left: 2rem;
    margin-bottom: 1rem;
}

#about {margin-top:3.5vw}
#servis {margin:3.5rem 0 3rem 0;background-color: #e0e0e0;padding:3.5rem 0}
#contact {margin:1.5rem 0 3rem 0;background-color: #e0e0e0;padding:3.2rem 0}
#galery {padding:0 0 2.6rem 0}

ul li {list-style-type: square}
.ul-correction {margin-left:0.9rem}
.photos-mt-4 {margin-top:1.6rem}

.text-danger {color:#cc2525 !important}

.container-fluid {
    padding-right: 1px;
    padding-left: 1px;
}
.flex-menu {
    display: flex;
    justify-content: space-between;
}

ul#navbar li {list-style-type: none;display: inline-block;}
#navbar .nav-link {
    font-size: 1.15rem;
    color:#fefefe;
    padding-right: 1.8rem;
    padding-left: 0;
    text-shadow: 2px 2px 2px #111
}
#navbar .nav-link:hover {
    color:#b5d3b9;
    transition: ease-in 200ms;
}
.bg-light {background-image: linear-gradient(to top, #ccc 0%, #f6f6f6 50%)}

footer {background: #1a1a1a;padding: 1.4rem 0 1.2rem 0;margin-top:0;color:#888;font-size: 0.85rem;}
footer p, footer div {color:#aaa;font-size: 1rem;line-height: 1.7rem;text-align: center;}
footer p strong, footer p b {color:#888}

.font-weight-bold {font-weight: 700;}

.input-group {max-width:140px !important;margin-bottom:1.2rem}
.grey {background:#eee}
.text-grey {color:#777}
.text-grey-small {color:#777;font-size:0.7rem;position:relative;left:8px;top:-1px}

.form-control-max-width {max-width:250px !important}

.nav-tabs .nav-link.active {
	background: linear-gradient(to top, #ffffff 0%, #cbebff 80%, #a1dbff 100%);
}

label {margin-bottom:.25rem;margin-left:.1rem}
label span {color:#b10;font-size:1.5rem;position:absolute;margin:-4px 0 0 5px} 
.form-max-width {max-width:590px}
form h5 {margin-bottom:15px}

hr {
	background: #8f8f8f;
	color: #8f8f8f;
	height: 1px;
	border: 0;
}
.article-img-left {max-width:440px;margin-right: 2.6rem;margin-bottom:2rem;margin-top: 0.3rem;}
.article-img-right {max-width:360px;margin-left: 1.6rem;}
.text-big {font-size:1.1rem;color:#655}
dl, ol, ul {
    margin-top: 0;
    margin-bottom: 0;
}
ul li {font-size:1.2rem;margin-bottom: 0.7rem;}

.imagefotogalerie {
    width:18.8%;height:164px;overflow:hidden;margin:0 10px 10px 0;text-align:center
}

.imagefotogalerie img { 
    object-fit: cover;
    width:100%;
    height:164px
}

.input-max-length {max-width:24rem}
.textarea-max-height {max-height:6.5rem}
.mobile-show {display: none}
label b {font-size: 1.2rem;color:#cc2525}
.error {font-size: 1.0rem;color:#cc2525}
.form-label {margin-bottom: 0;margin-top: 0.5rem;font-size: 1.1rem;color:#555}

.btn-primary, .btn:hover, .btn-secondary {
    color: #fff;
    font-size: larger;
    border-radius: 0;
    text-transform: uppercase;
    font-weight: 400;
    padding: 0.7rem 1.1rem !important;
    background-color: #333;
    border-color: #555;
}
.btn-secondary {
    color: #999;
    font-size: larger;
    font-weight: bold;
    background-color: #eee;
    border-color: #ddd;
}
.btn:hover {
    color: #111;
    background-color: #fff;
    border-color: #333;
    transition: ease-in-out 0.5s;
}
.form-control:focus {
    color: #212529;
    background-color: #fff;
    border-color: #999;
    outline: 0;
    box-shadow: 0 0 0 0;
}

.btn-primary-small, .btn-primary-small:hover {
    color: #fff;
    font-size: 0.95rem;
    border-radius: 0;
    text-transform: uppercase;
    font-weight: 400;
    padding: 0.5rem 1rem !important;
    background-color: #333;
    border-color: #555;
}
.btn-primary-small-grey, .btn-primary-small-grey:hover {
    color: #111;
    font-size: 0.95rem;
    border-radius: 0;
    text-transform: uppercase;
    font-weight: 400;
    padding: 0.5rem 1rem !important;
    background-color: #eee;
    border-color: #555;
}
.btn-primary-small:hover {
    background-color: #eee;
    border-color: #555;
    color: #111;
}
.btn-primary-small-grey:hover {
    background-color: #fff;
    border-color: #aaa;
    color: #000;
}

/* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 1990; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    background-image: linear-gradient(to right, #1e2020 0%, #272727 80%);
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 20px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}
.sidenav li {list-style-type: none;}
.sidenav a {color: #dedede;text-decoration: none;}
.sidenav a:hover {
color: #fff;
}

.sidenav a.link {color:#aaa;text-decoration: none;font-size: 1.3rem;margin-right: 12px;}
.sidenav a:hover, .sidenav a.link:hover {color:var(--black-color)}

.sidenav .closebtn, .sidenav .closebtn:hover {
    position: absolute;
    top: -2px;
    right: 10px;
    font-size: 38px;
    color:rgb(241, 252, 255);
    margin-left: 50px;
    text-decoration: none;
}

button.navbar-toggler {
    position: absolute;
    right: 10px;
    top: -100px;
} 

svg.header-svg {
    width: 19px;
    position: relative;
    top: -1px;
    left: -3px;
    fill: #636e66;
}

.flex-menu-1 {
    margin-top: 1vh
}

@media (max-width: 1650px) {
    .flex-menu-1 {
        margin-top: 0.7vh
    }
}
@media (max-width: 1480px) {
    .flex-menu-1 {
        margin-top: 0.1vh
    }
}
@media (max-width: 1280px) {
    .flex-menu-1 {
        margin-top: -0.6vh
    }
    #logo img {
        top: -10px;
    }    
}

@media (max-width: 1020px) {
    #logo img {position:absolute;z-index: 1001;width:190px;top:15px;left:10px}
    .mobile-hidden {display:none}
    .mobile-show {display: block}
    ul.menu-mobile li .nav-link {font-size: 1.0rem;padding-top:0.2rem}
    ul.menu-mobile li .nav-link:hover {color:#fff}
	button.navbar-toggler {
        color:#fff;
        border: 1px solid #444;
        border-radius:3px;
        position: absolute;
        font-weight: 800;
        font-size: 1.1rem;
        background: #222;
        right: 10px;
        opacity: 0.9;
        top: 9px;
        padding: 9px 14px 8px 16px;
        z-index: 1900
    }     
    .lang-icon {border:1px solid #222;margin-top:0;margin-right:0.6rem}
	p {font-size: 1.05rem;color:#333;line-height:1.6rem}
    .h1, h1 { font-size: 1.9rem;margin: 0.5rem 0 0.5rem 0}
    .h2, h2 { font-size: 1.5rem;margin: 0.5rem 0 0.8rem 0}
    .h3, h3 { font-size: 1.25rem}
    .h4, h4 { font-size: 1.1rem}
	.container {
    	width: 100%;
    	max-width: none;
  	}
    .mt-5 {margin-top: 1.5rem !important}
  	#txt-uvod p {padding-right:0}
    .container-article.pt-5 {padding-top: 1.4rem !important;}
    .mb-5 {margin-bottom: 1.6rem !important;}
    .article-img-right, .article-img-left {max-width:99%;margin-right: 0;margin-bottom: 0.9rem; margin-top: 0.2rem;}
    .text-big {
        font-size: 0.85rem;
    }
    .container-slogan {width:100%;text-align: center;position:absolute;z-index:1001;margin:120px auto 0 auto}
    .container-slogan h1 {text-transform: none !important;color:#fff;font-weight: normal;}
    .container-slogan h2 {text-transform: none !important;color:#fff;margin-top: 1.0rem;font-size:2.7rem}
    ul {
        padding-left:1.7rem !important;
    }
    ul li {
        font-size: 1.05rem;
        margin-bottom: 0.6rem;
    }
    .margin-bottom-custom-1 {margin-bottom: 0}
    .padding-left-custom-1 {padding-left: 1.0rem}
}

@media (max-width: 576px) {
    ul.menu-mobile li .nav-link {font-size: 1.1rem;padding-top:0.5rem}
    .container-slogan h1 {
        font-size: 1.4rem;
    }
    .container-slogan h2 {font-size: 1.7rem}
    .slideshow-container {
        padding:0;background-color:#174f98;width: 100%;height: 200px;
        background-image: url(../img/back-3.jpg);
        background-position: bottom right;
        background-size: cover;
    }
    .container-slogan {
        margin: 75px auto 0 auto;
    }    
    .photos-mt-4 {margin-top:0}  
    #galery div a img {padding-bottom:8px}
    footer p, footer div {font-size: 0.9rem}
    #servis {
        padding: 1.5rem 0;
    }
}