.navbar-light {
    border-bottom: 1px solid rgba(256, 256, 256, .2);
}
body {
    background-color: black;
}
.container { width:100%;}
.navbar-toggler {background-color: #fba504;}

#komunikujete {
    padding: 3rem 3rem;
    
}


#prvnivideo {width:75%; padding:0;padding-top:50px;}
#cloudconnect01 {width: 75%;}
@media screen and (max-width: 768px) {
    #prvnivideo {
        width:100%;
        padding-top:0;
    }    
    #cloudconnect01 {width: 100%;}
}

#CoJeCloudConnect .container {
    padding: 6rem 3rem;
    padding-right: 7rem;
    padding-left: 7rem;
}
#CoJeCloudConnect p {
    text-align: justify;
}


#komunikujete {padding-top:0;}
@media screen and (max-width: 768px) {
    #CoJeCloudConnect .container {
        padding: 0;
        padding-right: 0;
        padding-left: 0;
    }  
    #CoJeCloudConnect h3 {text-align: center;}
    #komunikujete {padding-top:3rem;}
}

#bezpecnost p {text-align: justify;}

b, strong {
    font-weight: 500;
}

a {
    color: var(--primary);
}
a:hover {
    color: #d90089;
}


@media screen and (max-width: 400px) {
    
    #jazyky_change {
        display: block;
        margin-left:0 !important;
        margin-top:0.5rem;
    }
}

.klient_odpoved_obrazek img {
    padding:40px;
}

.klient_odpoved_obrazek {
    display:flex;
    gap:20px;
}
.klient_odpoved_obrazek > div:first-of-type {
    width:65%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@media screen and (max-width: 768px) {
    .klient_odpoved_obrazek { flex-direction: column;}
    .klient_odpoved_obrazek > div:first-of-type { width:100%;}
    .klient_odpoved_obrazek img {
        padding:10px;
    }
}


.service-item {
    justify-content: center;
    height: 100%;
}

@media screen and (min-width: 990px) {
    .vlastnosti {
        height:250px;
    }
}

.navbar-light .navbar-nav .nav-link {
    margin-right: 0;
}

.zkratka {
    cursor:pointer;
    position:relative;
}
.zkratka .zkratkatext {
    border-bottom: 1px dotted;
}

.zkratka .zkratkalink {
    position: absolute;
    padding: 10px;
    background-color: rgb(238, 238, 238);
    border-radius: 20px;
    white-space:nowrap;
    
    pointer-events: none;
    opacity: 0;
    transition: 0.2s;
}

@media screen and (max-width: 720px) {
    .zkratka .zkratkalink {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -100%);
    }
}

@media screen and (min-width: 721px) {
    .zkratka .zkratkalink {
        bottom: 18px;
        left: -100%;
    }

    .zkratkatext:hover + .zkratkalink, .zkratkalink:hover {
        pointer-events: all;
        opacity: 1;
        transition:0.2s;
    }
}