﻿

.mrozhlas {
    position: fixed;
    bottom: 20px;
    right: 750px;
    display: block;
    overflow: hidden;
    z-index: 301;
    border-radius: 20px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3);
    background-color: white
}

    .mrozhlas.mrozhlas-hidden {
        display: none
    }

    .mrozhlas .mrozhlas-teaser {
        display: block;
        width: 140px;
        padding: 20px;
        text-decoration: none;
        color: black;
        background-color: white;
        transition: background 0.8s;
        font-size: 12px
    }

        .mrozhlas .mrozhlas-teaser:hover {
            background-color: #e1e1e1
        }

        .mrozhlas .mrozhlas-teaser .mrozhlas-first {
            margin-bottom: 5px
        }

            .mrozhlas .mrozhlas-teaser .mrozhlas-first .mrozhlas-icon {
                display: inline-block;
                width: 32px;
                height: 32px;
                margin-right: 10px;
                background-position: center;
                background-repeat: no-repeat;
                background-size: contain;
                background-image: url(/img/mrozhlas-icon.svg)
            }

            .mrozhlas .mrozhlas-teaser .mrozhlas-first .mrozhlas-header {
                display: inline-block;
                font-size: 15px
            }

    .mrozhlas .mrozhlas-full {
        display: block;
        width: 250px;
        padding: 20px;
        color: black;
        background-color: white;
        transition: background 0.8s;
        font-size: 14px
    }

        .mrozhlas .mrozhlas-full .mrozhlas-first {
            margin-bottom: 5px
        }

            .mrozhlas .mrozhlas-full .mrozhlas-first .mrozhlas-close {
                display: block;
                text-align: right
            }

                .mrozhlas .mrozhlas-full .mrozhlas-first .mrozhlas-close a {
                    padding: 5px 0px 5px 10px;
                    font-size: 18px;
                    font-weight: bold;
                    text-decoration: none
                }

            .mrozhlas .mrozhlas-full .mrozhlas-first .mrozhlas-header {
                display: block;
                width: 100%;
                height: 40px;
                margin-right: 10px;
                background-position: center;
                background-repeat: no-repeat;
                background-size: contain;
                background-image: url(/img/mrozhlas-text.svg)
            }

        .mrozhlas .mrozhlas-full .mrozhlas-second {
            margin-bottom: 5px;
            font-style: italic;
            text-align: center
        }

        .mrozhlas .mrozhlas-full .mrozhlas-third {
            width: 100%;
            height: 120px;
            background-position: center;
            background-repeat: no-repeat;
            background-size: contain;
            background-image: url(/img/mrozhlas-banner.png)
        }

        .mrozhlas .mrozhlas-full .mrozhlas-fourth a {
            display: block;
            padding: 10px;
            padding-left: 20px;
            margin: 10px 0px 10px 0px;
            border-radius: 5px;
            text-decoration: none;
            text-align: center
        }

            .mrozhlas .mrozhlas-full .mrozhlas-fourth a.mrozhlas-mobile-button {
                background-color: #179E1E;
                background-image: url(/img/mrozhlas-mobile-icon.svg);
                background-repeat: no-repeat;
                background-position: 10px center;
                color: white
            }

            .mrozhlas .mrozhlas-full .mrozhlas-fourth a.mrozhlas-dashboard-button {
                background-color: #0D4EA0;
                background-image: url(/img/mrozhlas-dashboard-icon.svg);
                background-repeat: no-repeat;
                background-position: 10px center;
                color: white
            }

            .mrozhlas .mrozhlas-full .mrozhlas-fourth a.mrozhlas-download-button {
                background-color: #d69a00;
                background-image: url(/img/mrozhlas-download-icon.svg);
                background-repeat: no-repeat;
                background-position: 10px center;
                color: white
            }

    .mrozhlas.mrozhlas-open > .mrozhlas-teaser {
        display: none
    }

    .mrozhlas.mrozhlas-open > .mrozhlas-full {
        display: block
    }

    .mrozhlas.mrozhlas-close > .mrozhlas-teaser {
        display: block
    }

    .mrozhlas.mrozhlas-close > .mrozhlas-full {
        display: none
    }

@media screen and (max-width:2000px) {
    .mrozhlas {
        right: 80px
    }
}

@media screen and (max-width:1600px) {
    .mrozhlas {
        right: 80px
    }
}

@media screen and (max-width:1023px) {
    .mrozhlas {
        bottom: 2px;
        right: 50px
    }
}

@media screen and (max-width:767px) {
    .mrozhlas {
        display:none!important;
        right: 20px
    }
}





