body{background:#252525;position: relative;text-align:center;font-family: 'Open Sans', sans-serif;margin:0px;    display: inline-block;width: 100%;height: 100%;overflow:hidden;}

*{ -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;font-weight: 400;-webkit-font-smoothing: antialiased !important;}

.orange_gradient{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fe4c30+0,dd2905+100 */background: #fe4c30; /* Old browsers */background: -moz-linear-gradient(top,  #fe4c30 0%, #dd2905 100%); /* FF3.6-15 */background: -webkit-linear-gradient(top,  #fe4c30 0%,#dd2905 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to bottom,  #fe4c30 0%,#dd2905 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fe4c30', endColorstr='#dd2905',GradientType=0 ); /* IE6-9 */}

.bg_notification{background-image:url('../imagesfo/layout/landingpage_access_bg.png');position: absolute;top: 0px;left: 0px;width: 1796px;height: 100%; animation: slide 60s linear infinite;}
.bg_notification.loop_img{left: 1796px;}


/* BOX NOTIFICATION */
.wrapper_notification{width:350px;max-width:90%;display:inline-block;margin:0px auto;position: relative;top:48%;opacity:0;-webkit-animation: fade_top 1s alternate forwards;animation: fade_top 1s alternate forwards;}
.wrapper_notification .logo{margin-bottom:25px;}
.wrapper_notification .wrapper{width:100%;border-bottom: black!important;display: inline-block;background:white;border-radius:10px;overflow: hidden;border:1px solid #212121;-webkit-box-shadow: 0 20px 100px 0 rgba(0,0,0,1);box-shadow: 0 20px 100px 0 rgba(0,0,0,1);}
.wrapper_notification .wrapper .image {width:100%;display:inline-block;height:200px;}
.wrapper_notification .wrapper .image img{max-height: 70%;top:50%;position:relative;transform:translateY(-50%);-moz-transform:translateY(-50%);-webkit-transform:translateY(-50%);-o-transform:translateY(-50%);}
.wrapper_notification .wrapper .title {font-size:28px;color:#f9472a;font-weight:700;font-style:italic;margin-bottom:25px;padding:0px 10px;} 
.wrapper_notification .wrapper .description {padding: 0px 50px;margin-bottom:40px;font-size:18px;color:#999;}
.wrapper_notification .wrapper .button{padding:24px 0px;color:white;font-size:16px;width:100%;display:inline-block;}
.wrapper_notification .wrapper .button span{font-weight:800;}
.wrapper_notification .wrapper a.button{font-weight:800;text-decoration:none;text-transform:uppercase;letter-spacing: 1px;}
.wrapper_notification .wrapper a.button i{font-size: 14px;margin-right: 3px;}
.wrapper_notification .wrapper a.button:hover{cursor:pointer;opacity:0.9;} 
.wrapper_notification .by{color:white;font-size:14px;margin-top:20px;}
.wrapper_notification .by span{font-weight:800;}

@-webkit-keyframes fade_top{
  from {transform:translateY(-100%);-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);opacity: 0}
  to {transform:translateY(-50%);-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);opacity: 1}
}
@keyframes fade_top{
  from {transform:translateY(-100%);-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);opacity: 0}
  to {transform:translateY(-50%);-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);opacity: 1}
}

@keyframes slide{
  0%{
    transform: translate3d(0, 0, 0);
  }
  100%{
    transform: translate3d(-1796px, 0, 0);
  }
}