.header {

    width:100%;
    height:550px;
    background-image:url('./files/elements/home_header_bg.jpg');
    background-size:contain;
    background-position:center center;
    background-repeat:no-repeat;

}

.header .logo {

    width:412px;
    height:180px;
    background-image:url('./files/elements/logo_w_box.svg');
    background-size:contain;
    background-position:left top;
    background-repeat:no-repeat;
    position:fixed;
    top:0;
    left:0;
    z-index:1000;
    transition:opacity 0.3s;

}

.header .medes_logo {
    width: 160px;
    height: 50px;
    position: absolute;
    top: 50px;
    right: 50px;
    background-color: white;
    border-radius: 8px;
    cursor: pointer;
    padding: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    border: 2px solid white;
    transition: all 0.3s;
}

@media screen and (max-width:485px) {
    .header .medes_logo {
        top: 150px;
        right:auto;
        left: 20px;
    }
}

.header .medes_logo:hover {
    border-color: rgba(241,90,44,1);
    transition: border-color 0.3s;
    box-shadow: 0 0 10px rgba(241,90,44,0.5);
}

.header .logo_holder {
    width: 120px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin-left:auto;
    margin-right: auto;
    background-image: url('https://medeserp.cz/medes_logo.svg');
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.main {

    width:100%;
    min-height:10px;
    background-image:linear-gradient(127deg, #4B98B7 9%, #283D68 100%);
    padding-top:77px;

}

.main .content {

    padding-left:68px;
    padding-right:68px;

}

.main h2 {

    padding:0;
    margin:0;
    font-size:25px;
    font-weight:800;
    color:rgba(255,255,255,1.0);
    margin-bottom:20px;

}

.main p {

    padding:0;
    margin:0;
    font-size:18px;
    font-weight:400;
    color:rgba(255,255,255,1.0);
    margin-top:37px;

}

.main .ourServices {

    width:50%;
    height:523px;
    position:relative;
    float:left;

}

.main .ourServices .service_box {

    min-height:10px;
    padding-top:34px;
    padding-left:25px;
    padding-right:25px;
    padding-bottom:34px;
    background-color:rgba(255,255,255,1.0);
    border-bottom:6px solid rgba(36,52,85,1.0);
    position:absolute;

}

.main .ourServices .service_box.box_left {

    width:381px;
    top:60px;
    left:0;
    z-index:2;
    padding-right:102px;

}

.main .ourServices .service_box.box_right {

    width:327px;
    box-shadow:0px 2px 9px rgba(0,0,0,0.17);
    z-index:3;
    top:184px;
    left:319px;

}

.main .ourServices .service_box .box_image {

    width:100%;
    height:74px;
    background-size:contain;
    background-position:top left;
    background-repeat:no-repeat;
    margin-bottom:24px;

}

.main .ourServices .service_box .box_image.computer_img {
    background-image:url('./files/elements/computer_img.svg');
}

.main .ourServices .service_box .box_image.graphics_img {
    background-image:url('./files/elements/graphics_img.svg');
}

.main .ourServices .service_box h3 {

    padding:0;
    margin:0;
    font-size:20px;
    font-weight:700;
    color:rgba(0,0,0,1.0);
    margin-bottom:7px;

}

.main .ourServices .service_box p {

    padding:0;
    margin:0;
    font-size:18px;
    font-weight:300;
    color:rgba(0,0,0,1.0);
    margin-bottom:7px;

}

.main .contact {

    width:353px;
    min-height:10px;
    float:left;

}

.main .contact h2.marginTop57 {
    margin-top:57px;
}

.main .contact a:hover {

    text-decoration:underline;

}

.main .ourClients {

    width:100%;
    min-height:10px;
    margin-top:128px;

}

.main .ourClients h2 {

    text-align:center;

}

.main .ourClients .clients_holder {

    width:100%;
    min-height:130px;
    background-color:rgba(255,255,255,1.0);
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:nowrap;

}

.main .ourClients .clients_holder .client_item {

    height:130px;
    margin-left:22px;
    margin-right:22px;
    background-size:contain;
    background-position:center center;
    background-repeat:no-repeat;

}

.main .ourClients .clients_holder .client_item.klrock {
    width:83px;
    background-image:url('./files/elements/partners/klrock.svg');
}

.main .ourClients .clients_holder .client_item.homeCapital {
    width:83px;
    background-image:url('./files/elements/partners/homeCapital.svg');
}

.main .ourClients .clients_holder .client_item.mansory {
    width: 83px;
    background-image: url('./files/elements/partners/mansory_black.svg');
}

.main .ourClients .clients_holder .client_item.fitlife {
    width:83px;
    background-image:url('./files/elements/partners/fitlife.svg');
}

.main .ourClients .clients_holder .client_item.protetikaPlzen {
    width:107px;
    background-image:url('./files/elements/partners/protetikaPlzen.svg');
}

.main .ourClients .clients_holder .client_item.prages {
    width:208px;
    background-image:url('./files/elements/partners/prages.svg');
}

.main .ourClients .clients_holder .client_item.sonte {
    width:166px;
    background-image:url('./files/elements/partners/sonte.svg');
}

.main .ourClients .clients_holder .client_item.panlux {
    width:154px;
    background-image:url('./files/elements/partners/panlux.svg');
}

.main .ourClients .clients_holder .client_item.conventia {
    width:199px;
    background-image:url('./files/elements/partners/conventia.svg');
}

@media screen and (max-width:1490px) {

    .main .contact {
        float:right;
    }

}

@media screen and (max-width:1170px) {

    .main .content {

        padding-left:20px;
        padding-right:20px;

    }

    .main h2 {

        text-align:center;

    }

    .main .ourServices {

        width:100%;
        height:auto;
        position:relative;
        float:left;

    }

    .main .ourServices .service_box {

        min-height:10px;
        padding-top:34px;
        padding-left:25px;
        padding-right:25px;
        padding-bottom:34px;
        background-color:rgba(255,255,255,1.0);
        border-bottom:6px solid rgba(36,52,85,1.0);
        position:relative;

    }

    .main .ourServices .service_box.box_left {

        width:100%;
        top:0px;
        left:0;
        z-index:2;
        padding-right:25px;
        margin-left:auto;
        margin-right:auto;

    }

    .main .ourServices .service_box.box_right {

        width:100%;
        box-shadow:0px 2px 9px rgba(0,0,0,0.17);
        z-index:3;
        top:0px;
        left:0px;
        margin-top:20px;
        margin-left:auto;
        margin-right:auto;

    }

    .main .contact {

        width:100%;
        margin-top:40px;
        margin-left:auto;
        margin-right:auto;
        float:left;

    }

    .main .contact p {
        text-align:center;
    }

}

@media screen and (max-width:900px) {

    .header .logo {

        width:412px;
        height:120px;

    }

    .main .ourClients .clients_holder {
        flex-wrap:wrap;
    }

}

@media screen and (max-width:570px) {

    .header {

        background-image:url('./files/elements/home_header_bg_mobile.jpg');

    }

    .header .logo {

        width:100%;
        height:140px;

    }

}