:root
{
    --os-primary: #45BB90;
    --os-primary-light: #8fd6bc;
    --os-primary-rgb: 69, 187, 144;
    --os-primary-hover: #297056;
    --os-secondary: #3857A7;
    --os-secondary-light:#879aca;
    --os-secondary-rgb: 38,87,167;
    --os-secondary-hover: #213464;

    --os-body-color: #0c101b;
    --os-body-bg: #fff;

    --os-body-color-rgb: 48, 78, 109;
    --os-body-bg-rgb: 255, 255, 255;

    --os-border-radius: 0.375rem;

    --os-odsek-x: 2rem;
    --os-odsek-y: 1rem;

}

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body
{
    margin:0;
    background-color: var(--os-body-bg);
    color: var(--os-body-color);
    font-family: Montserrat, Arial, Helvetica, sans-serif;
    min-height: 100vh;

    display:flex;
    flex-direction: column;
    
    font-size: 1.125rem;
}

.center {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}


main{flex:1 1 auto;}

button{transition: background-color 0.25s ease-in-out, color 0.25s ease-in-out, border 0.25s ease-in-out;}
a{transition: color 0.25s ease-in-out;}

h1{text-align:center; padding-top: 3rem; padding-bottom: 1.5rem; font-weight: bold; font-size: 2.25rem;}

h2 {padding-bottom: 0.25rem; text-align:center; margin-bottom:1.5rem; font-weight: bold;}

h3{padding-bottom: 0.5rem; padding-top:0.5rem; font-weight: bold;}


p .fw-bold, p b, p strong{color:var(--os-body-color);}

.os-content{padding-top:1rem; padding-bottom: 1rem;}

.os-mezera-velka{padding:10rem;}
.os-mezera{padding:5rem;}
.os-mezera-mala{padding:2.5rem;}

@media screen and (max-width: 576px){
    .os-mezera-velka{padding:8rem;}
    .os-mezera{padding:4rem;}
    .os-mezera-mala{padding:2rem;}
}

.os-img-logo{max-width: 100%; height: 64px;}
.os-img-logo-header{max-width: 100%; width: 992px; height: auto;}

.os-navbar
{
    display:grid;
    grid-template-columns: 1fr 4fr auto;
    grid-template-areas: "logo nav ham";
    justify-content: space-between;
    padding: var(--os-odsek-y) var(--os-odsek-x);
    gap: 1rem;
}


.os-logo-wrap{grid-area: logo;}

.os-nav-ul-wrap{grid-area: nav;}
.os-nav-ul{ display:flex; height:100%; font-size: 1.25rem; justify-content: end; align-items: center;}

.os-nav-ul>.os-nav-link{color: var(--os-body-bg); text-decoration: none;}
.os-nav-ul>.os-nav-link:hover{color: var(--os-primary-light);}


.os-hamburger{grid-area: ham; display:flex; align-items: center; justify-content: end;}
.os-nav-toggler{background-color: transparent; border: 1px solid var(--os-primary); color: var(--os-primary); border-radius: var(--os-border-radius); cursor:pointer;}
.os-nav-toggler:hover{background-color: var(--os-primary-hover); color:var(--os-primary);}

@media screen and (max-width: 1600px)
{
    .os-navbar
    {grid-template-columns: 1fr 4fr 0fr;}
    .os-nav-ul{font-size: 1.125rem;}
}

@media screen and (max-width: 1400px)
{
    .os-navbar
    {grid-template-columns: 1fr 4fr 0fr;}
    
    .os-nav-ul{font-size: 1rem;}
}

@media screen and (max-width: 1200px)
{
    .os-navbar
    {
        display:grid;
        grid-template-columns: 1fr max-content;
        grid-template-areas: "logo ham"
                                "nav nav";
        justify-content: space-between;
        padding: var(--os-odsek-y) var(--os-odsek-x);
    }
    .os-nav-ul{margin-top:0rem; flex-direction: column; font-size: 1.375rem; text-align:center;}   
}


.os-footer{display:flex; justify-content:center; padding: calc(var(--os-odsek-y)*2) var(--os-odsek-x);}
.os-footer .os-img-logo{height: 48px;}

.os-img-fluid{max-width: 100%; max-height: 100%; width: 100%; height: auto; border-radius: var(--os-border-radius);}

.os-ul {list-style: "-  ";}


.os-row-gal
{display:flex; flex-wrap:wrap; justify-content: center; }

.os-row-gal .os-col-gal
{
    min-width: 320px;
    flex: 1 1 auto;
    width: 100%;
    max-width: 40%;
}

.os-btn-primary
{
  --bs-btn-color: var(--os-body-color);
  --bs-btn-bg: var(--os-primary);
  --bs-btn-border-color: var(--os-primary);
  --bs-btn-hover-color: var(--os-body-bg);
  --bs-btn-hover-bg: var(--os-primary-hover);
  --bs-btn-hover-border-color: var(--os-primary-hover);
  --bs-btn-focus-shadow-rgb: var(--os-primary-rgb);
  --bs-btn-active-color: var(--os-body-color);
  --bs-btn-active-bg: var(--os-primary-hover);
  --bs-btn-active-border-color: var(--os-primary-hover);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(var(--os-primary-rgb), 0.125);
  --bs-btn-disabled-color: var(--os-body-bg);
  --bs-btn-disabled-bg: var(--os-body-color);
  --bs-btn-disabled-border-color: var(--os-body-color);
}

.os-btn-primary:hover
{
    color: var(--bs-btn-hover-color);
    background-color: var(--bs-btn-hover-bg);
    border-color: var(--bs-btn-hover-border-color);
}

.os-btn-primary:disabled
{
    opacity: 0.5;
}

.os-carousel .carousel-control-prev{left:1px;}
.os-carousel .carousel-control-next{right:1px;}

.carousel-control-next, .carousel-control-prev
{
    opacity:0.34;
}

.carousel-control-next:hover, .carousel-control-prev:hover
{
    opacity: 0.67;
}

.carousel-control-prev-icon, .carousel-control-next-icon
{
    width: 3rem;
    height: 3rem;
    background-size: 50% 50%;
    border-radius: 50%;
    background-color: var(--os-body-bg);
    padding: 2rem;
}

@media screen and (max-width: 576px) {
    .carousel-control-prev-icon, .carousel-control-next-icon
    {
        width: 2rem;
        height: 2rem;
        padding: 1.5rem;
    }

}

.carousel-indicators [data-bs-target]
{
    border: 2px solid var(--os-body-color);
    padding: 0.25rem;
    border-radius: var(--bs-border-radius);
}


.os-required::after
{
    content:"*";
    margin-left:0.25rem;
    color:var(--bs-danger);
}


.os-bg-primary{background-color:var(--os-primary);}
.os-bg-secondary{background-color:var(--os-secondary);}
.os-bg-text{background-color:var(--os-body-color);}
.os-bg-body-bg{background-color:var(--os-body-bg);}

.os-text-primary{color: var(--os-primary);}
.os-text-secondary{color: var(--os-secondary);}
.os-text-text{color:var(--os-body-color);}
.os-text-body-bg{color:var(--os-body-bg);}

.os-img-max-mensi{max-width: 480px !important;}

@media screen and (min-width: 1201px) {

.os-nav-oddeleni>*:not(:last-child){ border-right: 2px solid; margin-right: 1rem; padding-right: 1rem;}

.os-nav-oddeleni.os-bg-primary>*:not(:last-child){ border-color: var(--os-body-bg);}
.os-nav-oddeleni.os-bg-text>*:not(:last-child){ border-color: var(--os-primary);}

}

.os-plechovky{border-bottom: 5px solid var(--os-primary);}

.os-sipkasipka
{
  border-top: 5px solid;
  border-right: 5px solid;
  border-bottom: 0rem;
  border-left: 0rem;
  padding: 10px;
  transform: translate(-50%) rotate(45deg);
}
.os-sipkasipka:first-child
{
    transform: rotate(45deg);
}

.os-kontakt-btn-wrap{display:flex; align-items: center; justify-content:center; font-size: 1.25rem;}
.os-kontakt-btn-wrap .os-btn-clear{text-decoration: none; opacity: 1; transition: opacity 0.2s ease-in-out; position:relative;}
.os-kontakt-ikona{border: 0.75rem solid var(--os-secondary); border-radius: 50%; color: var(--os-secondary); width: 5rem; height: 5rem; display:flex; align-items: center; justify-content: center; position:absolute; background-color: var(--os-body-bg);}
.os-kontakt-text{background: linear-gradient(90deg, var(--os-secondary) 5rem, var(--os-primary) 100%); padding: 1rem; color:var(--os-body-bg); height: 5rem; border: 0.5rem solid var(--os-body-bg); border-left: 0rem; border-radius: 5rem; padding-left: 5rem;}
.os-kontakt-btn-wrap .os-btn-clear:hover{text-decoration: none; opacity:0.75;}


.os-btn-clear{border: 0px solid; background-color: transparent;}