*{margin:0; padding: 0;}
body{text-align: center; color: #fff; font-family: 'open sans';}
img{ outline: none; border: none; max-width: 100%; height: auto}

.transition{-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;}
.cs-overlay{
    background: rgba(0,0,0,0.5);
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 98;
}
.cs-popup-container{
    position: relative;
    z-index: 9999;
}
.cs-popup-wrap{
    width:auto;
    max-width: 90%;
    /*min-width: 70%;*/
    border-radius: 5px;
    border: 10px solid #fff;
    position: fixed;
    top:50%;
    left:50%;
    -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Safari */
    transform: translate(-50%, -50%);
    box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.12);
}
.cs-popup-wrap img{
    float: left;
}

.close-button{
    position: absolute;
    top: 20px;
    right: 20px;
    width: 35px;
    height: 35px;
    padding: 1px;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
    opacity: 0.1;
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    transition: all ease 0.5s;
}
.cs-popup-wrap:hover .close-button{opacity: 1}

@media screen and (max-width: 768px){
    .close-button{width: 25px; height: 25px; right: 10px; top: 10px; padding: 0}
}

@media screen and (max-width: 550px){
    .cs-popup-wrap{width: 80%; text-align: center; background: #fff}
    .cs-popup-wrap img{float: none}
}