/****************************
Styly pro vyjížděci kontaktní formulář
Autor: Filip Smolík, smolik.filip@gmail.com
****************************/

#slideOut {
    position: fixed;
    width: 300px;
    height: 800px;
    top: 20%;
    right: -300px;
    /* Animation  */
    transition-property: all;
    transition-duration: .5s;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
    z-index: 1000;
}


/* Display slideOut */

.showSlideOut {
    right: 0px !important;
}


/* Tab */

.slideOutTab {
    margin-top: 50px;
    position: absolute;
    left: -40px;
    height: 200px;
    width: 40px;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    background: #FF2C2C;
    border-radius: 15px 0px 0px 15px;
    cursor: pointer;
}

.slideOutTab div {
    text-align: center;
    position: relative;
    color: white;
    right: 70px;
    top: 90px;
    background: #FF2C2C;
    width: 180px;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    writing-mode: lr-tb;
}

.slideOutTabAlert {
    margin-top: 50px;
    position: absolute;
    left: -80px;
    height: 200px;
    width: 40px;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    background: #FF2C2C;
    border-radius: 15px 0px 0px 15px;
    cursor: default;
}

.slideOutTabAlert div {
    text-align: center;
    position: relative;
    color: white;
    right: 70px;
    top: 90px;
    background: #FF2C2C;
    width: 180px;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    writing-mode: lr-tb;
}

@media only screen and (max-width: 760px) {
    #slideOut {
        top: 60px;
    }
}