JSFiddle - React, Tailwind, and code Playground

HTML

<div class="modal animated flipInX" style="width: 100px; height:25px; margin-left: 0px;">
    <div class="wrapper" style="margin: 0px;">
        <div class="map" style="background-image: url(http://maps.googleapis.com/maps/api/staticmap?center=kongens+nytorv,+copenhagen&amp;zoom=16&amp;maptype=roadmap&amp;size=640x640&amp;sensor=false&amp;scale=2&amp;language=en);"></div>
    </div>
</div>

CSS

.modal {






    -webkit-border-radius: 4px;






    -moz-border-radius: 4px;






    border-radius: 4px;






    position: absolute;






    background: white;






    background: -webkit-linear-gradient(#fcfcfc, #cfcfd0);






    background: -moz-linear-gradient(#fcfcfc, #cfcfd0);






    -webkit-box-shadow: white 0px -1px 0px inset, rgba(0, 0, 0, 0.88) 0px 1px 30px;






    -moz-box-shadow: white 0px -1px 0px inset, rgba(0, 0, 0, 0.88) 0px 1px 30px;






    box-shadow: white 0px -1px 0px inset, rgba(0, 0, 0, 0.88) 0px 1px 30px;






    width: 150px;






    height: 150px;






    left: 50%;






    top: 50%;






    margin-left: -410px;






    margin-top: -195px;






}






.modal.dark {






    background: #111 url(../images/texture-grain.png) repeat;






    -webkit-box-shadow: rgba(0, 0, 0, 0.88) 0px 1px 140px;






    -moz-box-shadow: rgba(0, 0, 0, 0.88) 0px 1px 140px;






    box-shadow: rgba(0, 0, 0, 0.88) 0px 1px 140px;






    color: white;






}






.modal.blue {






    background: #4890f1 url(../images/texture-blue.png) repeat;






    -webkit-box-shadow: #244e86 0px 1px 0px, rgba(0, 0, 0, 0.88) 0px 1px 140px;






    -moz-box-shadow: #244e86 0px 1px 0px, rgba(0, 0, 0, 0.88) 0px 1px 140px;






    box-shadow: #244e86 0px 1px 0px, rgba(0, 0, 0, 0.88) 0px 1px 140px;






    color: white;






}






.modal.blue:after {






    content:'';






    position: absolute;






    width: 100%;






    height: 100%;






    top: 0px;






    left: 0px;






    background: -webkit-radial-gradient(circle, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));






    background: -moz-radial-gradient(circle, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));






    z-index: -1;






}






.modal .hide {






    position: absolute;






    display: block;






    right: 0px;






    font-size: 12px;






    top: 0px;






    cursor: pointer;






    color: #999;






  ...