@font-face {
font-family: 'Outfit';
src: url('/layout/font/Outfit-wght.woff2') format('truetype');
font-weight: 100 900;
font-style: normal;
font-display: swap; }

body {
padding: 0;
margin: 0;
color: #696161;
font-family: "Outfit", sans-serif;
font-weight: 300;
color: #000;
line-height: 1.75em; }

#navbar {
background-color: #25438F; }

.nav-link {
padding: 0;
font-weight: 300;
color: white; }

.nav-link:hover {
color: white;
border-bottom: 2px solid #f7e62c; }

.navbar-toggler {
color: white; }

.nav-link {
border-bottom: 2px solid #25438F; }

.navbar .nav-link.dropdown-toggle.show {
border-bottom: 2px solid #f7e62c; }

/* icons */
.icons {
margin-top: 75px !important; }

#basket {
text-decoration: none;
box-shadow: 2px 3px 5px rgba(0,0,0,0.4);
color: white;
font-size: 1.2em;
background-color: #EE7AAD; }

/* header graphic */
#hafik {
max-width: 33%; }

#images {
position: relative;
z-index: 10;
overflow: hidden;
aspect-ratio: 3/2; }

#images-bg {
height: 100%;
z-index: 3000;
position: absolute;
min-width: 100%;
background-image: url('../img/header.png');
background-repeat: no-repeat;
background-position: 50% 0%;
background-size: auto 100%; }

#images img {
position: absolute;
display:none;
top:0;
left:0;
z-index: 860;
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-fit: cover; }


#images2 img {
/*
margin: 1em auto;
max-width: 40%;
height: auto; */ }

/* footer */
#footer {
background-image: url('../img/footer.jpg');
background-repeat: no-repeat;
background-position: 0% 50;
background-size: cover; }

#footer-contact {
width: 450px;
min-height: 17em;
padding-top: 0em;
text-align: center;
background-image: url('../img/footer.png');
background-repeat: no-repeat;
background-position: 50% 0%;
background-size: 90% auto; }

#footer-contact img {
height: 1.5em; }

#footer-contact h3 {
color: #25438F; }

#footer-contact a {
color: black;
text-decoration: 1px dotted #efefef; }

/* numbers*/
#numbers,
.bg-gray {
background-color: #F6F6F6; }

#numbers-content {
display: grid;
gap: 20px;
grid-template-columns: 1fr 1fr 1fr 1fr; }

#numbers-content > div {
color: white;
font-size: 1.2em; }

#numbers-content .number {
font-size: 1.4em;
display: block;
font-weight: bold; }

#numbers-content > div:nth-child(1) {
background: url('../img/numbers-1.png') no-repeat left bottom #1e4390; }

#numbers-content > div:nth-child(1) span {
color: #FCE62E; }

#numbers-content > div:nth-child(2) {
background: url('../img/numbers-2.png') no-repeat left top #1e4390; }

#numbers-content > div:nth-child(3) {
background: url('../img/numbers-3.png') no-repeat right bottom #1e4390; }

#numbers-content > div:nth-child(3) span {
color: #EE7AAD; }

#numbers-content > div:nth-child(4) {
background: url('../img/numbers-4.png') no-repeat right top #1e4390; }

#numbers-content > div:nth-child(4) span {
color: #2AAAE2; }

/* index */
#index-triangles {
background-image: url('../img/index-triangles.png');
background-repeat: no-repeat;
background-position: 0% 50;
background-size: auto 100%; }

/* articles */
#articles {
background-color: #f6f6f6; }

.article {
color: white;
background-color: #1e4390; }

.article-img {
position: relative;
overflow: hidden;
aspect-ratio: 2/1; }

.article-img > a > img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-position: center;
object-fit: cover; }

.article-corner {
position: absolute;
top: 0px;
z-index: 500;
left: 0; }

.article-name {
overflow: hidden;
white-space: nowrap;
font-size: 1.2em; }

.article-name a {
text-decoration: none;
color: white; }

.article_detail_image {
max-width: 50%;
height: auto; }

/* products */
#products {
background-color: #f6f6f6; }

.product {
color: white;
background-color: #1e4390; }

.product-img {
position: relative;
overflow: hidden;
aspect-ratio: 2/1.5; }

.product-img > a > img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-position: center top;
object-fit: cover; }

.product-corner {
position: absolute;
top: 0px;
z-index: 500;
left: 0; }

.product-name {
overflow: hidden;
white-space: nowrap;
font-size: 1.2em; }

.product-name a {
text-decoration: none;
color: white; }

.product-description {
height: 5em; }

.product-price {
font-size: 1.2em;
font-weight: bold; }

.product-photo {
overflow: hidden;
aspect-ratio: 1/1; }

.product-photo > a > img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-position: center top;
object-fit: cover; }

.product-photos {
display: grid;
gap: 5px;
grid-template-columns: 1fr 1fr 1fr; }

.product-photos > a  {
aspect-ratio: 1/1; }

.product-photos img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-position: center top;
object-fit: cover; }

.detail-price {
color: white;
font-size: 1.4em;
background-color: #25438F; }

.detail-original {
color: white;
font-size: 1.4em;
background-color: #ccc; }

/* basket */
.table-eshop th {
color: white;
background-color: #25438F; }

.basket-photo {
width: 120px;
height: 100px;
overflow: hidden;
aspect-ratio: 2/1; }

.basket-photo img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-position: center top;
object-fit: cover; }

/* contacts */
.person {
color: white;
background-color: #1e4390; }

.person-img {
position: relative;
overflow: hidden;
aspect-ratio: 0.75/1; }

.person-img:hover img {
transition-duration: 0.5s;
scale: 1.1;
filter: brightness(0.9); }

.person-img > a > img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-position: center top;
object-fit: cover; }

.person-corner {
position: absolute;
top: 0px;
z-index: 500;
left: 0; }

.person-name {
overflow: hidden;
white-space: nowrap;
font-size: 1.2em; }

.person-name a {
text-decoration: none;
color: white; }

/* members */
.members {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 10px; }

.members img {
max-width: 90%;
height: auto; }


/* sponsors */
.sponsor img {
max-width: 80%;
height: auto; }


/* home reference */
#references {
background-color: #f6f6f6; }

.reference {
font-size: 0.9em;
color: white;
background-color: #1e4390; }

.reference-name {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-size: 1.2em; }

.reference-place {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap; }

.reference-name a {
color: white;
text-decoration: none; }

/* actions */
#actions {
background-color: #f6f6f6; }

.action {
font-size: 0.9em;
color: white;
background-color: #1e4390; }

.action-name {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-size: 1.2em; }

.action-place {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap; }

.action-name a {
color: white;
text-decoration: none; }

/* voluenteers */
.voluenteer-photo {
max-width: 30%;
overflow: hidden;
aspect-ratio: 1/1; }

.voluenteer-photo img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-position: center;
object-fit: cover; }

/* NEW */

.table-akce td:nth-child(1) {
width: 7%; }

.table-akce td:nth-child(2),
.table-akce td:nth-child(3) {
width: 10%; }

.table-akce td:nth-child(4) {
width: 40%; }

.table-akce td:nth-child(5) {
width: 15%; }

.or {
color: orange !important; }

form {
border-radius: 10px;
background-color: #efefef; }

.form-white {
background-color: #fff !important; }

/* gallery */
#gallery {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 10px; }

.gallery-data > a {
color: white;
text-overflow: ellipsis;
text-decoration: none; }

.gallery-data {
background-color: #1e4390; }

.gallery-photo {
overflow: hidden;
aspect-ratio: 1/1; }

.photo {
overflow: hidden;
flex-grow: 1;
transition-duration: 0.5s;
aspect-ratio: 1/1; }

.photo:hover,
.gallery-photo:hover {
filter: brightness(1.2); }

.photo img,
.gallery-photo img {
max-width: 100%;
max-height: 100%;
min-width: 100%;
min-height: 100%;
object-position: center;
object-fit: cover; }

#payments {
max-width: 400px;
height: auto; }

/* form */
.form-required label {
font-weight: bold; }

.label {
background-color: #efefef;
display: inline-block;
width: 200px;
white-space: nowrap;
text-overflow: ellipsis;
margin-right: 10px;
margin-bottom: 3px; }

/* partners */
.partner img {
max-width: 100%;
height: auto; }

/* social */
#social img {
max-width: 50px;
height: auto; }

#social img:hover {
filter: brightness(0.9); }

/* carousel */
#carousel-sponsors .owl-nav {
display: block !important; }

#carousel-sponsors .owl-next {
position: absolute;
top: 15%;
color: #25438F;
font-size: 5.0em;
height: 100px;
z-index: 100;
right: -10px; }

#carousel-sponsors .owl-prev {
position: absolute;
top: 15%;
color: #25438F;
font-size: 5.0em;
height: 100px;
z-index: 100;
left: -10px; }

/* bootstrap overflow */
.btn-hafik {
color: white;
background-color: #1e4390; }

.btn-hafik:hover {
color: white;
background-color: #3e73b0; }

.btn-hafik-white {
color: #1e4390;
background-color: #fff;
border: 2px solid #1e4390; }

.btn-hafik-white:hover {
border: 2px solid #3e73b0;  }

.btn-hafik-yellow {
color: white;
background-color: #FCE62E; }

.btn-hafik-yellow:hover {
color: white;
background-color: #dCc60E; }

.btn-hafik-pink {
color: white;
background-color: #EE7AAD; }

.btn-hafik-pink:hover {
color: white;
background-color: #cE5A8D; }

.btn-hafik-blue {
color: white;
background-color: #2AAAE2; }

.btn-hafik-blue:hover {
color: white;
background-color: #0A8Ac2; }

.btn,
.card,
.form-control {
  border-radius: 0;
}

.color1 {
color: #EE7AAD; }

.color2 {
color: #2AAAE2; }

.color3 {
color: #FFF; }

.color4 {
color: #FCE62E; }

.corner-1 {
background: url('../img/corner-1.png') no-repeat left top #1e4390; }

.corner-2 {
background: url('../img/corner-2.png') no-repeat left top #1e4390; }

.corner-3 {
background: url('../img/corner-3.png') no-repeat left top #1e4390; }

.corner-4 {
background: url('../img/corner-4.png') no-repeat left top #1e4390; }

.corner-r-t-1 {
background: url('../img/corner-r-t-1.png') no-repeat right top #1e4390; }

.corner-r-t-2 {
background: url('../img/corner-r-t-2.png') no-repeat right top #1e4390; }

.corner-r-t-3 {
background: url('../img/corner-r-t-3.png') no-repeat right top #1e4390; }

.corner-r-t-4 {
background: url('../img/corner-r-t-4.png') no-repeat right top #1e4390; }

.label {
display: inline-block;
margin: 0 5px 3px 0;
padding: 5px;
width: 150px;
background-color: #efefef; }

.w-20 {
max-width: 20%; }


@media only screen and (min-width: 600px) {
    #gallery {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .members {
        grid-template-columns: 1fr 1fr 1fr;
    }
}


@media only screen and (min-width: 900px) {
    #gallery {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    }
    .members {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    }

    #logos {
    width: 25%;
    text-align: center; }

    #hafik {
    max-width: 67%; }

    #graphic {
    width: 100%;
    overflow: hidden;
    align-items: center;
    display: flex; }

    #images {
    aspect-ratio: 3/1.4;
    width: 75%; }

    #images-bg {
    background-position: 0% 0%;
    background-size: auto 100%; }

    #carousel-sponsors .owl-next {
    right: -30px; }

    #carousel-sponsors .owl-prev {
    left: -30px; }
}

