body {
    background-image: url('./imgBg/vrst.jpeg');
    background-repeat: no-repeat;
    background-attachment: fixed;
}

#headerC, #headerI, #headerO {
    text-align: center;
    height: 125px;
    border: 2px solid silver;
    background-color:#858585;
    font-size: 30px;
    line-height: 125px;
    cursor: pointer;
    font-family: Lucida Console;
    transition: 0.3s;
}

#headerP {
    border: 2px solid silver;
    height: 200px;
    text-align: center;
    color: white;
    font-weight: bold;
    font-size: 50px;
    line-height: 200px;
    text-shadow: 2px 2px 4px #000000;
    overflow: hidden;
    transition: 0.3s;
}

#headerP span {
    z-index: 100000000;
    position: absolute;
    left: 45%;
}

#headerP:hover img {
    transition: 0.3s;
    transform: scale(1.1);
}

#headerP img {
    transition: 0.3s;
}

.disp {
    display: none
}

.contShow {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    padding: 10px;
    grid-gap: 30px;    
}

.containerI {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 10px;
    grid-gap: 30px;
}

#headerC:hover, #headerI:hover, #headerO:hover {
    box-shadow: 5px 5px 5px #aaaaaa;
    transition: 0.3s;
}

#containerBottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 10px;
    grid-gap: 30px;
}

#containerBottom strong {
    font-size: 17px;
}

#partners, #contacts {
    border: 2px solid silver;
    text-align: center;
    transition: 0.3s;
}

#partners:hover, #contacts:hover {
    transform: scale(1.03);
    box-shadow: 5px 5px 5px #aaaaaa;
    transition: 0.3s;
    background-color: #efefef;
}

#firstC, #secondC, #thirdC, #fourthC, #fifthC, #sixthC, #seventhC, #eightC,#firstI, #secondI, #thirdI, #fourthI, #fifthI, #sixthI, #seventhI, #eightI, #ninthI, #firstO, #secondO, #thirdO {
    border: 1px solid silver;
    border-radius: 25%;
    padding: 20px;
    font-size: 30px;
    text-align: center;
    height: 250px;
    line-height: 50px;
    background-position: center;
    background-repeat: no-repeat;
    font-family: Courier New;
    transition: 0.3s;
}

#firstC {
    background-image: url('./img/img_zaklad.jpg');
}

#secondC {
    background-image: url('./img/img_interier.jpg');
}

#thirdC {
    background-image: url('./img/img_strecha.jpg');
}

#thirdI {
    background-image: url('./img/img_parkovisko.jpg');
}

#eightI {
    background-image: url('./img/img_freza.jpg');
}

#firstO {
    background-image: url('./img/img_stromy.jpg');
}

#firstC:hover, #secondC:hover, #thirdC:hover, #fourthC:hover, #fifthC:hover, #sixthC:hover, #seventhC:hover, #eightC:hover, #firstI:hover, #secondI:hover, #thirdI:hover, #fourthI:hover, #fifthI:hover, #sixthI:hover, #seventhI:hover, #eightI:hover, #ninthI:hover, #firstO:hover, #secondO:hover, #thirdO:hover {
    transform: scale(1.07);
    transition: 0.3s;
}

#containerC p, #containerI p, #containerO p {
    background-color: rgba(255, 255, 255, 0.6)
}

li {
    font-family: 'Raleway', sans-serif;
}

#containerC li {
    background-color: #fafafa;
    border-radius: 0 0.5rem 0.5rem 0.5rem;
    box-shadow: 0.25rem 0.25rem 0.6rem rgba(0,0,0,0.05), 0 0.5rem 1.125rem rgba(75,0,0,0.05);
    margin-top: 1rem;
    min-height: 3rem;
    padding: 1rem 1rem 1rem 3rem;
    position: relative;
    width: 150px;
    transition: 0.3s;
}

#containerC li:hover {
    transform: scale(1.1);
    transition: 0.3s;
}

#containerC ol {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    padding: 10px;
    grid-gap: 50px;
    margin-left: 30%; 
}

#containerI li {
    background-color: #fafafa;
    border-radius: 0 0.5rem 0.5rem 0.5rem;
    box-shadow: 0.25rem 0.25rem 0.6rem rgba(0,0,0,0.05), 0 0.5rem 1.125rem rgba(75,0,0,0.05);
    margin-top: 1rem;
    min-height: 3rem;
    padding: 1rem 1rem 1rem 3rem;
    position: relative;
    width: 150px;
    transition: 0.3s;
}

#containerI li:hover {
    transform: scale(1.1);
    transition: 0.3s;
}

#containerI ol {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 10px;
    grid-gap: 50px;
    margin-left: 42%; 
}

#containerO li {
    background-color: #fafafa;
    border-radius: 0 0.5rem 0.5rem 0.5rem;
    box-shadow: 0.25rem 0.25rem 0.6rem rgba(0,0,0,0.05), 0 0.5rem 1.125rem rgba(75,0,0,0.05);
    margin-top: 1rem;
    min-height: 3rem;
    padding: 1rem 1rem 1rem 3rem;
    position: relative;
    width: 150px;
    transition: 0.3s;
}

#containerO li:hover {
    transform: scale(1.1);
    transition: 0.3s;
}

#containerO ol {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 10px;
    grid-gap: 50px;
    margin-left: 42%; 
}