p {
    font-family: 'Lato', sans-serif;
    font-size: 1.12em;
    line-height: 1.3em;
    text-align: justify;
    color: rgb(102, 45, 145);
    margin-bottom: 0;
}

h1 {
    font-family: 'Lato', sans-serif;
    font-size: 1.4em;
    line-height: 1.3em;
    color: rgb(102, 45, 145);
    text-align: left;
    padding-left: 0.6em;
    margin: 0;
    text-transform: uppercase;
    font-weight: 500;
}

a {
    color: rgb(255, 255, 255);
}

a:hover {
    text-decoration: none;
    color: rgb(141, 198, 68);
}

.graphics {
    max-width: 70em;
    margin: 0 auto;
    margin-top: 5em;
background: url('../image/tlo.png') repeat;

}
.wrapper{
     overflow: auto;
}
.graphics_img_title {
    width: 9.625em;
    height: auto;
}

.graphics_wrapper {
    display: flex;
    align-items: center;

}

.text {
    padding: 1.4em 1.6em;
}

.wrapper_float_left {
    float: left;
    width: 50%;

}

.wrapper_float_right {
    float: right;
    width: 50%;
}

/*graphica_content*/
.wrapper_content {
    clear: both;
    max-width: 70em;
    margin: 0 auto;
    background: rgb(218, 213, 231) url('../image/tlo.png') repeat;
}

.title {
    color: rgb(255, 255, 255);
    background: rgb(102, 45, 145);
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    padding-left: 2.5em;
    padding-right: 2.5em;
}

.graphics_img {
    width: 5.5em;
    height: auto;
}

.graphics_offer,
.printing_offer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 2.5em;
}

.graphics_offer_range {
    display: flex;
    align-items: center;
    margin: 3em 0;
}

#advertisement {
    padding-right: 2em;
}

.graphics_offer_text {
    padding-left: 0.8em;
}

.p_graphics_offer {
    text-align: left;
}

.printing {
    max-width: 70em;
    margin: 0 auto;
   background: url('../image/tlo.png') repeat;

}

ul {
    padding-left: 1.25em;
}

.printing_list {
    font-family: 'Lato', sans-serif;
    font-size: 1.12em;
    line-height: 1.3em;

    color: rgb(102, 45, 145);
    margin-bottom: 0;
}

.printing_offer_range {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    margin: 3em 0;
}

.printing_offer_text {
    padding-top: 1em;
    max-width: 18em;
}

#graphic_link,
#printing_link {
    padding-top: 22em;
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width:992px) and (max-width:1200px) {

    .graphics,
    .printing,
    .wrapper_content {
        max-width: 60em;
    }

    h1 {
        padding-right: 0.6em;
    }

    .graphics_img_title {
        width: 8em;
    }

    .graphics_offer {
        justify-content: space-around;
    }

    .printing_offer_text {
        max-width: 14em;
    }

    #graphic_link,
    #printing_link {
        padding-top: 23em;
    }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width:768px) and (max-width:991px) {

    .wrapper_float_left,
    .wrapper_float_right {
        float: none;
        width: 100%;

    }

    .hero_picture img {
        width: 100vw;
        height: auto;
    }

    .wrapper_margin {
        max-width: 90vw;
        margin: 0 auto;
    }

    .text {
        padding: 1.4em 2em 3em 2em;
    }

    .graphics_offer {
        justify-content: space-evenly;
    }

    .wrapper_position {
        order: 2;
    }

    .printing_offer {
        flex-direction: column;
    }

    .printing_offer_range {
        flex-direction: row;
        margin: 1.5em auto;
    }

    .margin_print_top {
        margin-top: 3em;
    }

    .margin_print_bottom {
        margin-bottom: 3em;
    }

    .printing_offer_text {
        padding-left: 0.8em;
        max-width: 22em;
    }

    #graphic_link,
    #printing_link {
        padding-top: 18em;
    }

}

@media only screen and (min-width:568px) and (max-width:767px) {


    h1 {
        font-size: 1.2em;
    }

    .graphics_img_title {
        width: 8em;
        height: auto;
    }

    .graphics {
        margin-top: 2.875em;
    }

    .wrapper_float_left,
    .wrapper_float_right {
        float: none;
        width: 100%;

    }

    .hero_picture img {
        width: 100vw;
        height: auto;
    }

    .graphics_offer_range,
    .printing_offer_range {
        margin: 2em 0;
    }

    .graphics_offer,
    .printing_offer {
        flex-direction: column;
        align-items: center;
    }

    .printing_offer_range {
        flex-direction: row;
        margin: 1.5em auto;
    }

    .margin_print_top {
        margin-top: 3em;
    }

    .margin_print_bottom {
        margin-bottom: 3em;
    }

    .graphics_offer_text,
    .printing_offer_text {
        padding-left: 1em;
    }

    #graphic_link,
    #printing_link {
        padding-top: 13em;
    }


}
@media only screen and (max-width:567px) {
    h1 {
        font-size: 1.2em;
    }

    .graphics_img_title {
        width: 8em;
        height: auto;
    }

    .graphics {
        margin-top: 2.875em;
    }

    .wrapper_float_left,
    .wrapper_float_right {
        float: none;
        width: 100%;

    }

    .hero_picture img {
        width: 100vw;
        height: auto;
    }

    .graphics_offer_range,
    .printing_offer_range {
        margin: 2em 0;
    }

    .graphics_offer,
    .printing_offer {
        flex-direction: column;
        align-items: center;
    }

    .printing_offer_range {
        flex-direction: row;
        justify-content: center;
        margin: 1.5em auto;
    }

    .margin_print_top {
        margin-top: 3em;
    }

    .margin_print_bottom {
        margin-bottom: 3em;
    }

    .graphics_offer_text
    {
        padding-left: 1em;
    }

    #graphic_link,
    #printing_link {
        padding-top: 9em;
    }

    .h1_padding {
        padding-right: 1.6em;
    }
}