@keyframes fadeInRight {
  from {opacity:0;transform:translateX(300px);}
  to {opacity:1;}
}
@keyframes fadeInTop {
  from {opacity:0;transform:translateY(-300px);}
  to {opacity:1;}
}
@keyframes fadeInBottom {
  from {opacity:0;transform:translateY(300px);}
  to {opacity:1;}
}
@keyframes fill {
  0% {width:0%;}
  100% {width:100%;}
}

.wonderads_close {position:absolute;right:0px;top:10px;width:12px;height:12px;opacity:0.6;z-index:100001;}
.wonderads_close:hover {opacity:1;}
.wonderads_close:before, .wonderads_close:after {position:absolute;left:0;content:' ';height:12px;width:2px;background-color:#333;}
.wonderads_close:before {transform:rotate(45deg);}
.wonderads_close:after {transform:rotate(-45deg);}
.wonderads_container {z-index:2147483638;overflow:hidden;	position:relative;cursor:pointer;}
.progress {height:5px;width:100%;}
.progress .in {animation:fill 15s linear 1;height:100%;background-color:#94ed7b;}
#wonderads_wads_box {position:fixed;top:50%;max-width:55%;right:5px;background-color:#fff;animation:fadeInTop 1s ease-in-out;border-radius:3px;box-shadow:rgba(99,99,99,.2) 0px 2px 8px 0px;border:1px solid #3636363d;border-right:none;transform:translateY(-50%);}
#wonderads_wads_box .wonderads_image{height:125px;overflow:hidden;}
#wonderads_wads_box .wonderads_body{margin:5px;min-height:50px;}
#wonderads_wads_box .wonderads_title A{font-size:14px;color:#001689;font-weight:bold;}
#wonderads_wads_box .wonderads_description{font-size:12px;color:#363636;}
#wonderads_wads_box .wonderads_close {position:absolute;top:-20px;right:0px;width:25px;height:20px;opacity:1;z-index:100001;background-color:#f3f3f3;border-radius:3px 3px 0 0;border:1px solid #d7d7d7e0;}
#wonderads_wads_box .wonderads_close::before, #wonderads_wads_box .wonderads_close::after {position:absolute;left:11px;content:' ';height:14px;width:2px;background-color:#555;top:5px;}

@media only screen and (min-width:768px) {
  #wonderads_wads_box {max-width:300px;top:45vh;right:0px;animation:fadeInBottom 1s ease-in-out;}
}