/* Fonts */
.bebas-neue-regular {
    font-family: "Bebas Neue", serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .poppins-thin {
    font-family: "Poppins", serif;
    font-weight: 100;
    font-style: normal;
  }
  
  .poppins-extralight {
    font-family: "Poppins", serif;
    font-weight: 200;
    font-style: normal;
  }
  
  .poppins-light {
    font-family: "Poppins", serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .poppins-regular {
    font-family: "Poppins", serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .poppins-medium {
    font-family: "Poppins", serif;
    font-weight: 500;
    font-style: normal;
  }
  
  .poppins-semibold {
    font-family: "Poppins", serif;
    font-weight: 600;
    font-style: normal;
  }
  
  .poppins-bold {
    font-family: "Poppins", serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .poppins-extrabold {
    font-family: "Poppins", serif;
    font-weight: 800;
    font-style: normal;
  }
  
  .poppins-black {
    font-family: "Poppins", serif;
    font-weight: 900;
    font-style: normal;
  }
  
  .poppins-thin-italic {
    font-family: "Poppins", serif;
    font-weight: 100;
    font-style: italic;
  }
  
  .poppins-extralight-italic {
    font-family: "Poppins", serif;
    font-weight: 200;
    font-style: italic;
  }
  
  .poppins-light-italic {
    font-family: "Poppins", serif;
    font-weight: 300;
    font-style: italic;
  }
  
  .poppins-regular-italic {
    font-family: "Poppins", serif;
    font-weight: 400;
    font-style: italic;
  }
  
  .poppins-medium-italic {
    font-family: "Poppins", serif;
    font-weight: 500;
    font-style: italic;
  }
  
  .poppins-semibold-italic {
    font-family: "Poppins", serif;
    font-weight: 600;
    font-style: italic;
  }
  
  .poppins-bold-italic {
    font-family: "Poppins", serif;
    font-weight: 700;
    font-style: italic;
  }
  
  .poppins-extrabold-italic {
    font-family: "Poppins", serif;
    font-weight: 800;
    font-style: italic;
  }
  
  .poppins-black-italic {
    font-family: "Poppins", serif;
    font-weight: 900;
    font-style: italic;
  }

/*Variables*/
:root{
    --background: #E5E3DF;
    --white: #FFFFFF;
    --lightBlue: #46A3FF;
    --hover: #e2dede;
    --footer: #444444;
    --pink: #FE71CA;
    --hoverPink: #FFA3E0;
}

/*General*/
body{
    background-color: var(--background);
    font-family: "Poppins", serif;;
}

h1, h2, h3, h4, h5, h6{
    font-family: 'Bebas Neue';
}

/*Navbar*/
.navbar{
    background-color: var(--lightBlue);
}

.navbar-collapse{
    justify-content: center;
}
 
.nav-link{
    color: var(--white);
    font-size: 1.7rem;
}

.nav-link:hover{
    color: var(--hover);
}

.navbar-brand{
   display: none;
}

/*Jumbotron*/
.jumbotron{
    height: 30rem;
    color: var(--white);
}

.logo{
    width: 15rem;
    height: auto;
}

.jumbotron h1{
    font-size: 4.5rem;
    margin-bottom: 0;
}

.jumbotron p{
    font-size: 1.5rem;
    margin-top: -0.3rem;
}

/*About Us*/
.about-us p{
    font-size: 1rem;
}

#hodnoty{
    margin-bottom: 0rem;
}

.about-us img{
    width: 100%;
    height: auto;
    margin-top: 4rem;
}

/*footer*/
footer{
    background-color: var(--footer);
}

footer img{
    width: 15rem;
    height: auto;
}

footer h3{
    margin-bottom: 0.2rem;
}

footer p{
    margin-bottom: 0rem;
}

footer a{
    text-decoration: none;
}

footer .copyright{
    margin-left: 1rem;
    font-size: 0.9rem;
}


/*Gallery*/
.galerie img{
    border-radius: 8px;
    width: 316px;
}

/*About Us Page*/
.about-us-page .card-header, .about-us-page .card-header img{
    border-radius: 50%;
    padding: 2px;
    background-color: none;
    border: none;
    z-index: 3;
}

.about-us-page .card-header img{
    width: 75%;
    height: auto;
    border: 5px solid var(--white);
}

.about-us-page .card{
    text-align: center;
    margin-top: -4rem;
    padding-top: 3.5rem;
    border: none;
    border-radius: 20px;
}

.about-us-page .card-body p{
    font-size: 1.2rem;
}

.about-us-page .card-body .card-text{
    font-size: 1rem;
}

.about-us-page .card-footer{
    margin-top: -2rem;

}

.about-us-page .card-footer button{
    background-color: var(--pink);
    color: var(--white);
    border: none;
    border-radius: 10px;
    padding: 0.5rem 2rem 0rem 2rem;
    font-size: 2.5rem;
    margin-inline: 5rem;
    z-index: 255;
}

.about-us-page .card-footer button:hover{
    background-color: var(--hoverPink);
}

/*Služby*/
.card{
    border: none;
    border-radius: 20px;
}

.sluzby .card-body img{
    border-radius: 8px;
    width: 100%;
    height: auto;
    margin-bottom: 16px;
}


.sluzby .card-footer{
    margin-top: -2rem;

}

.sluzby .card-footer button{
    background-color: var(--pink);
    color: var(--white);
    border: none;
    border-radius: 10px;
    padding: 0.3rem 2rem 0rem 2rem;
    font-size: 3rem;
    margin-inline: 5rem;
    z-index: 255;
}

.sluzby .card-footer button:hover{
    background-color: var(--hoverPink);
}

/*Recenze*/
.recenze .card{
    border: none;
    border-radius: 20px;
    background-color: rgba(255, 255, 255, 0);
}

.recenze img{
    border-radius: 50%;
    width: 16rem;
    height: auto;
}

.recenze .right-side{
    margin-left: -8rem;
    z-index: -3;
}

.recenze .card-body{
    background-color: var(--white);
    padding-left: 9.5rem;
    border-radius: 20px;
}

.recenze .card .card-text{
    font-size: 0.95rem;
}

/*Contact*/
.kontakty span h2{
    font-size: 3rem;
}

.kontakty span p{
    font-size: 2rem;
}


/*microsite*/

.microsite .card-body{
    border: none;
    border-radius: 20px;
    background-color: var(--white);
}

.microsite .card-text{
    font-size: 1.1rem;
}

.microsite img{
    border-radius: 8px;
    width: 100%;
    height: auto;
}


/*Feedback*/
form button{
    background-color: var(--pink);
    color: var(--white);
    border: none;
    border-radius: 10px;
    padding: 0.5rem 2rem 0rem 2rem;
    font-size: 2.5rem;
}


/*Responsive*/
@media (max-width: 991px){
    .navbar-brand{
        display: block;
        color: var(--white);
        font-size: 1.5rem;
        margin-bottom: 0px;
        padding: 0px;
    }

    .nav-link{
        text-align: end;
    }

    .navbar-collapse{
        border-top: 1px solid var(--white);
        margin-top: 0.5rem;
    }

    footer .col-xs-12{
        display: flex;
        justify-content: center;
    }

    footer .copyright{
        margin-top: 0.5rem;
    }

}

@media (max-width: 767px){
    .recenze img{
        width: 12rem;
    }

    .recenze .right-side{
        margin-left: -0rem;
    }

    .recenze .left-side{
        display: flex;
        justify-content: center;
    }

    .recenze .card-body{
        padding-left: 1rem;
    }
}


@media (max-width: 575px){
    .logo{
        width: 10rem;
    }

    footer p, footer h3, footer a{
        text-align: center;
    }

    footer h3{
        margin-top: 1rem;
    }
}