.company_name {
    float: left;
    padding: 0 0 0 30px;
    margin: 10px auto 0 auto;
    color: #ffe4fe;
    font-size: 32px;
    text-align: center;
    font-family: SairaSemiCondensedExtBold, serif;
}
.logo {
    float: left;
    margin: 0 10px 0 15px;
    padding: 10px 0 0 0;
}
.navbar {
    display: block;
    float: left;
    font-family: BarlowCondMedium, serif;
    background-color: #b906e5;
    text-align: center;
    margin: 0 auto 0 auto;
    width: 100%;
    padding: 0 0 0 0;
}
/*#index {*/
/*    margin-right: 10px;*/
/*}*/
.home_link {
    position: absolute;
    text-decoration: none;
    text-align: center;
    padding: 10px;
    margin: -18px 0 0 0;
}
.home_link:hover {
    opacity: 60%;
}
.menu_link, .menu_link_freedom {
    color: #ffffff;
    border: none;
    text-decoration: none;
    text-align: center;
    font-size: 20px;
    padding: 20px 10px 20px 10px;
}
.menu_link:hover, .menu_link_freedom:hover {
    background-color: #930fb4;
}
.flag_container {
    display: block;
    float: left;
    text-align: center;
    padding: 15px 0 20px 20px;
    margin: 0;
}
.flag_rs_button, .flag_hu_button {
    display: inline-block;
    background-image: url("../pict/flag_rs.png");
    width: 45px;
    height: 32px;
    margin: 0 0 0 10px;
    padding: 0;
    outline: none;
    text-decoration: none;
    border: 0 solid #c5c5c5;
    border-radius: 10px;
    cursor: pointer;
    box-shadow: 3px 3px 8px #505050;
}
.flag_hu_button {
    background-image: url("../pict/flag_hu.png");
}
.flag_rs_button:active, .flag_hu_button:active {
    box-shadow: 1px 1px 3px #343434;
    transform: translateY(2px);
}
.flag_rs_button:hover, .flag_hu_button:hover {
    opacity: 85%;
}
.telefon {
    text-align: left;
    font-size: 22px;
    color: #ffe7aa;
    padding: 20px;
}
.flag_link {
    border: none;
    text-decoration: none;
    padding: 0;
    margin: 0;
}
.navbar_div_100 {
    float: left;
    padding: 0 0 15px 0;
    text-align: left;
}
.container_company_and_logo {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0 0 10px 0;
}

/* Collapsible menu */
.menu-content {
    font-family: BarlowCondMedium, serif;
}
.collapsible-menu {
    display: block;
    padding: 17px 0 10px 20px;
    /*width: 90%;*/
    background-color: inherit;
    border: none;
    box-shadow: none;
}
.collapsible-menu ul {
    list-style-type: none;
    padding: 0;
}
.collapsible-menu a {
    position: relative;
    display: block;
    float: left;
    padding: 5px 20px 5px 20px;
    text-decoration: none;
}
.collapsible-menu label {
    font-family: BarlowCondMedium, serif;
    font-size: 30px;
    color: white;
    display: block;
    cursor: pointer;
    text-align: left;
    background: url("../pict/sp_vectorLogo_coloured.png") no-repeat left bottom;
    padding: 0 0 0 50px;
}
/*.label {*/
/*    padding: 0 0 0 50px;*/
/*}*/
input#menu {
     display: none;
}
input:checked +label {
    background-image: url("../pict/close.png");
}
.menu-content {
    max-height: 0;
    overflow: hidden;
    font-family: BarlowCondMedium, serif;
    /*padding: 0 0 0 60px;*/
}
/* Toggle Effect */
input:checked ~ label {
    background-image: url("../pict/close.png");
}
input:checked ~ .menu-content {
    max-height: 100%;
    width: 100%;
}
.div_container_25percent {
    margin: 0;
    padding: 0;
    width: 24%;
    display: block;
    float: left;
    /*background-color: #542c77;*/
    /*border: 2px solid #2ca8af;*/
}
.div_container_20percent {
    margin: 0;
    padding: 0;
    width: 19%;
    display: block;
    float: left;
}
.div_container_40percent {
    margin: 0;
    padding: 0;
    width: 40%;
    display: block;
    float: left;
}

/************** RESPONSIVE MODE ***************/
@media screen and (max-width:1710px) {
    .container_company_and_logo {
    width: 100%;
    margin: 0 auto 0 auto;
    text-align: center;
    padding: 0;
}
    @media screen and (max-width:1680px) {
        .menu_link, .menu_link_freedom {
            margin: 30px 0 0 10px;
        }
        .div_container_25percent, .div_container_20percent, .div_container_40percent {
            width: 100%;
        }
    }
}
@media screen and (max-width:1300px) {
    .div_container_25percent, .div_container_40percent {
        width: 100%;
    }
    .div_container_20percent {
        width: 30%;
    }
    .container_company_and_logo {
        width: 100%;
        margin: 0 auto 0 auto;
        text-align: center;
        padding: 0;
    }
    .navbar_div_100 {
        width: 100%;
    }
    .menu_link, .menu_link_freedom {
        margin: 0;
    }
}
@media screen and (max-width:1100px) {
    .menu_link, .menu_link_freedom {
        float: left;
        margin: 2px;
    }
    .div_container_20percent {
        width: 100%;
    }
}
@media screen and (max-width:670px) {
    .telefon {
        padding: 20px 0 20px 20px;
    }
    input:checked ~ .menu-content {
        width: 50%;
    }
    .collapsible-menu {
        width: 90%;
    }
    .collapsible-menu a {
        width: 100%;
        padding: 5px;
    }

}
@media screen and (max-width:400px) {
    .home_link {
        margin: -65px 0 0 -200px;
    }
    .menu_link, .menu_link_freedom {
        padding: 10px 10px 10px 15px;
    }

    .flag_container {
        margin: 0;
        padding: 10px 0 20px 30px;
    }
    .flag_rs_button {
        margin: 0;
    }
    .navbar_div_100 {
        padding: 0 0 15px 0;
    }
}
