@charset "UTF-8";
/* CSS Document */

/* Default style, feel free to remove if not needed. */
body, body * {
  vertical-align: baseline;
  border: 0 none;
  outline: 0;
  padding: 0;
  margin: 0;
}

:focus { outline: 0; } 
::-moz-focus-inner { border: 0; }

*, *:before, *:after {
  -webkit-box-sizing: border-box; 
  -moz-box-sizing: border-box; 
  box-sizing: border-box;
}

/* Div layer for the entire banner */
#container_dc {
  position: relative;
  display: block;
  width: 728px;
  height: 90px;
  margin: 0;
  overflow: hidden;
  border: 1px solid #000;
}
#content_dc {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #04abf1;
  z-index: 400;
  overflow: hidden;
}
#background_exit_dc {
  position: absolute;
  background: transparent;
  width: 100%;
  height: 100%;
  border: none;
  z-index: 500;
  cursor: pointer;
  top: 0;
  left: 0;
}
#background {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background: url('http://a.dolimg.com/ads/creative/CepiaHappy_042014/728x90/background.jpg') no-repeat;
  background-size: cover;
  z-index: 10;
  opacity: 0;
  filter: alpha(opacity=0);
}

.sprite {
  display: block;
  position: absolute;
  background: url('http://a.dolimg.com/ads/creative/CepiaHappy_042014/728x90/sprite.png') no-repeat top left;
  z-index: 20;
}
.sprite.button {
  background-position: 0px 0px;
  width: 201px;
  height: 36px;
  top: 90px;
  right: 57px;
  z-index: 600;
  cursor: pointer;
}
.sprite.logo {
  background-position: 0px -46px;
  width: 60px;
  height: 61px;
  top: 17px;
  left: 9px;
  opacity: 0;
  filter: alpha(opacity=0);
}
.sprite.pet1 {
  background-position: 0px -117px;
  width: 95px;
  height: 79px;
  top: 5px;
  left: -95px;
}
.sprite.pet2 {
  background-position: 0px -206px;
  width: 91px;
  height: 78px;
  top: 6px;
  left: -182px;
  z-index: 30;
}
.sprite.pet3 {
  background-position: 0px -294px;
  width: 80px;
  height: 77px;
  top: 7px;
  left: -257px;
  z-index: 40;
}
.sprite.pet4 {
  background-position: 0px -381px;
  width: 101px;
  height: 75px;
  top: 12px;
  left: -320px;
  z-index: 50;
}
.sprite.text_happy {
  background-position: 0px -466px;
  width: 162px;
  height: 23px;
  top: -23px;
  right: 76px;
  opacity: 0;
  filter: alpha(opacity=0);
}
.sprite.text_pets {
  background-position: 0px -499px;
  width: 273px;
  height: 15px;
  top: 35px;
  left: 725px;
  opacity: 0;
  filter: alpha(opacity=0);
}
#btn_exit {
  display: block;
  position: absolute;
  width: 194px;
  height: 29px;
  left: 3px;
  top: 4px;
  overflow: hidden;
}
.light {
  position: absolute;
  width: 30px;
  height: 100%;
  left: -33px;
  top: 0px;
  /* Skew */
  -ms-transform: skewX(20deg) skewY(0);
  -webkit-transform: skew(20deg); 
  -moz-transform: skew(20deg); 
  -o-transform: skew(20deg);
  transform: skew(20deg);
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMC44Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjMxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjM1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjY4JSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjA3Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvcmFkaWFsR3JhZGllbnQ+CiAgPHJlY3QgeD0iLTUwIiB5PSItNTAiIHdpZHRoPSIxMDEiIGhlaWdodD0iMTAxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
  background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.35) 31%, rgba(255,255,255,0.07) 68%, rgba(255,255,255,0) 100%); /* FF3.6+ */
  background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.8)), color-stop(31%,rgba(255,255,255,0.35)), color-stop(68%,rgba(255,255,255,0.07)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
  background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.35) 31%,rgba(255,255,255,0.07) 68%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.35) 31%,rgba(255,255,255,0.07) 68%,rgba(255,255,255,0) 100%); /* Opera 12+ */
  background: -ms-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.35) 31%,rgba(255,255,255,0.07) 68%,rgba(255,255,255,0) 100%); /* IE10+ */
  background: radial-gradient(ellipse at center,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.35) 31%,rgba(255,255,255,0.07) 68%,rgba(255,255,255,0) 100%); /* W3C */
}