/*******Basic settings**********/

*{
    margin: 0;
    padding: 0;
}
html {
    box-sizing: border-box;
}
 
*, *:before, *:after {
    box-sizing: inherit;
}
img{
  border: 0px;
}
a{
  text-decoration: none;
}
body{
  font-family: Arial, Helvetica, sans-serif; color: #FFFFFF;
}
#ad{
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

#banner{  
  width: 728px; 
  height: 90px;
  display: block;
  cursor: pointer;  
  overflow: hidden;
  position:absolute;
  visibility: visible;  
  border: 1px #444444 solid;
  background: #EEEEEE;
}

#banner * {
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
}

#banner.is-visible * {
  -webkit-animation-play-state: running;
          animation-play-state: running;
}

#clickTAG {
  position: absolute;
  top: 0px;
  left: 0px;
  opacity: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
  cursor:pointer;
  margin: 0;
}

.ie-fallback{
  position: absolute;
  z-index: 9999;
  top: 0;
  left: 0;
}

/*******frane one css start*********/

.main-bg{
  top: 0;
  left: 0;
  position: absolute;
}

.product-1{
  position:absolute;
  opacity: 0;

  -webkit-box-shadow: 0px 0px 45px 2.5px rgba(75,191,216,1);
     -moz-box-shadow: 0px 0px 45px 2.5px rgba(75,191,216,1);
          box-shadow: 0px 0px 45px 2.5px rgba(75,191,216,1);

  -webkit-animation: product1 2.5s ease-in-out 0.5s both;
          animation: product1 2.5s ease-in-out 0.5s both;
}

/*******frane one css end*********/

/*******frane two css start*********/

.box_shadow1{
  width: 364px;
  height: 66px;
  color: #ffffff;
  text-transform: uppercase;
  font-weight: bolder;
  background: #000000;
  display: block;
  left: 180px;
  top: 11px;
  position: absolute;

-webkit-box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);
   -moz-box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);
        box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);

  -webkit-animation: fade-out 2.5s linear 3s both;
          animation: fade-out 2.5s linear 3s both;
}

.box1_text1_left{
  width: 148px;
  float: left;
  font-size: 67px;
  margin-top: -7px;
  margin-left: 24px;
  display: block;
}

.box1_right{
  width: 180px;
  margin-right: 11px;
  float: right;
}

.box1_right_text2{
  width: 180px;
  font-size: 26px;
  text-align: left;
  margin-top: 3px;
  display: block;
}

.box1_right_text3{
  width: 180px;
  font-size: 33px;
  text-align: left;
  margin-top: -7px;
  display: block;
}

.badge{
  left: 14px;
  bottom: 11px;
  position:absolute;

  -webkit-animation: logo-out 7s linear 3.5s both;
          animation: logo-out 7s linear 3.5s both;
}

.dell_emc{
  right: 16px;
  bottom: 16px;
  position:absolute;

  -webkit-animation: logo-out 7s linear 3.5s both;
          animation: logo-out 7s linear 3.5s both;
}

/*******frane two css end*********/

/*******frane three css start*********/

.box_shadow2{
  width: 384px;
  height: 66px;
  color: #ffffff;
  text-transform: uppercase;
  font-weight: bolder;
  background: #000000;
  display: block;
  left: 170px;
  top: 11px;
  position: absolute;

-webkit-box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);
   -moz-box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);
        box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);

  -webkit-animation: fade-out 2.5s linear 5.5s both;
          animation: fade-out 2.5s linear 5.5s both;
}

.box2_text1_left{
  width: 120px;
  float: left;
  font-size: 64px;
  margin-top: -4px;
  margin-left: 35px;
  display: block;
}

.box2_right{
  width: 180px;
  margin-right: 20px;
  float: right;
}

.box2_right_text2{
  width: 180px;
  font-size: 26px;
  text-align: left;
  margin-top: 4px;
  display: block;
}

.box2_right_text3{
  width: 180px;
  font-size: 24px;
  text-align: left;
  margin-top: -2px;
  display: block;
}

/*******frane three css end*********/

/*******frane four css start*********/

.box_shadow3{
  width: 446px;
  height: 66px;
  color: #ffffff;
  text-transform: uppercase;
  font-weight: bolder;
  background: #000000;
  display: block;
  left: 140px;
  top: 11px;
  position: absolute;

-webkit-box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);
   -moz-box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);
        box-shadow: 0px 0px 78px 0px rgba(75,191,216,1);

  -webkit-animation: fade-out 2.5s linear 8s both;
          animation: fade-out 2.5s linear 8s both;
}

.box3_text1_left{
  width: 140px;
  float: left;
  font-size: 64px;
  margin-top: -4px;
  margin-left: 23px;
  display: block;
}

.box3_right{
  width: 268px;
  margin-right: 10px;
  float: right;
}

.box3_right_text2{
  width: 268px;
  font-size: 25px;
  text-align: left;
  margin-top: 4px;
  display: block;
}

.box3_right_text3{
  width: 268px;
  font-size: 31px;
  text-align: left;
  margin-top: -4px;
  display: block;
}

/*******frane four css end*********/

/*******frane five css start*********/

.title-5{
  font-size: 14px;
  line-height: 18px;
  font-weight: bolder;
  text-transform: uppercase;
  color: #FFFFFF;
  left: 13px;
  top: 15px;
  position: absolute;

  -webkit-animation: last-copy-out 10s linear 10.5s both;
          animation: last-copy-out 10s linear 10.5s both;
}

.cta{
  left: 13px;
  top: 42px;
  text-align: center;
  position: absolute;

  background: #006caa;
  background: -webkit-linear-gradient(#006caa, #0099ca); 
  background: -o-linear-gradient(#006caa, #0099ca); 
  background: -moz-linear-gradient(#006caa, #0099ca); 
  background: linear-gradient(#006caa, #0099ca); 



  -webkit-animation: last-copy-out 10s linear 11s both;
          animation: last-copy-out 10s linear 11s both;
}

.cta-text{
  font-size: 12px;
  font-weight: bolder;
  color: #ffffff;
  padding: 8px 10px 7px 9px;
  position: relative;

  -webkit-animation: last-copy-out 10s linear 11s both;
          animation: last-copy-out 10s linear 11s both;
}

.badge_last{
  left: 449px;
  bottom: 15px;
  position: absolute;

  -webkit-animation: last-copy-out 10s linear 11.5s both;
          animation: last-copy-out 10s linear 11.5s both;
}

.dell_emc_last{
  right: 16px;
  bottom: 16px;
  position:absolute;

  -webkit-animation: last-copy-out 10s linear 11.5s both;
          animation: last-copy-out 10s linear 11.5s both;
}

.badge_copy1{
  font-size: 15px;
  line-height: 18px;
  text-align: left;
  left: 164px;
  bottom: 13px;
  position: absolute;

  -webkit-animation: last-copy-out 10s linear 11.5s both;
          animation: last-copy-out 10s linear 11.5s both;
}

.badge_copy2{
  font-size: 14px;
  line-height: 15px;
  text-align: left;
  left: 502px;
  bottom: 12px;
  position: absolute;

  -webkit-animation: last-copy-out 10s linear 11.5s both;
          animation: last-copy-out 10s linear 11.5s both;
}

.badge_copy1 sup, .badge_copy2 sup{
  font-size: 8px;
  line-height: 15px;
}

/*******frane five css end*********/

/****** keyframes animation start ******/

@-webkit-keyframes product1{
   0%    { left: 274px; top: 95px; opacity: 0;}
  40%    { left: 274px; top: 12px; opacity: 1;}
  90%    { left: 274px; top: 12px; opacity: 1;}
  100%   { left: 274px; top: 12px; opacity: 0;}
}
@keyframes product1{
   0%    { left: 274px; top: 95px; opacity: 0;}
  40%    { left: 274px; top: 12px; opacity: 1;}
  90%    { left: 274px; top: 12px; opacity: 1;}
  100%   { left: 274px; top: 12px; opacity: 0;}
}

@-webkit-keyframes fade-out{
    0%{opacity: 0;}
   20%{opacity: 1;}
   80%{opacity: 1;}
  100%{opacity: 0;}
}
@keyframes fade-out{
    0%{opacity: 0;}
   20%{opacity: 1;}
   80%{opacity: 1;}
  100%{opacity: 0;}
}

@-webkit-keyframes logo-out{
    0%{opacity: 0;}
    5%{opacity: 1;}
   90%{opacity: 1;}
  100%{opacity: 0;}
}
@keyframes logo-out{
    0%{opacity: 0;}
    5%{opacity: 1;}
   90%{opacity: 1;}
  100%{opacity: 0;}
}

@-webkit-keyframes last-copy-out{
    0%{opacity: 0;}
    5%{opacity: 1;}
   95%{opacity: 1;}
  100%{opacity: 1;}
}
@keyframes last-copy-out{
    0%{opacity: 0;}
    5%{opacity: 1;}
   95%{opacity: 1;}
  100%{opacity: 1;}
}

/****** keyframes animation end *****