* { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; } * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } html.touch * { text-rendering: optimizeSpeed; } *:focus { outline: none !important; } html, body { height: 100%; margin: 0; padding: 0; } html { font-size: 16px; } body { overflow-x: hidden; font-family: "Arial",sans-serif; color: #fff; font-weight: 400; font-size: 1em; line-height: 1.5; background-color: #2f9f39; } a { color: #ffc600; transition: all 0.25 ease 0s; } a:hover, a:focus { text-decoration: none; } b, strong { font-weight: 500; } .text-center { text-align: center; } .text-left { text-align: left; } .spacing { padding: 30px; } .list-unstyled { margin: 0; padding: 0; list-style: none; } .hidden { display: none !important; } .visible { display: block !important; } .pull-left { float: left !important; } .pull-right { float: right !important; } .clearfix:after { content: ""; display: table; clear: both; } .relative { position: relative; } .absolute { position: absolute; } .verticle-align { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .img-responsive { display: block; max-width: 100%; width: auto; } .img-rounded { border-radius: 50%; } .block-image { text-align: center; } .block-image .img-responsive { display: inline-block; margin-left: -15px; margin-right: -15px; } .stickers img { width: 100%; } .wrapper-page { background: url(../images/bg.jpg) no-repeat center center; width: 100%; height: 100%; } .wrapper-page video { width: 100%; } .wrapper-page .video-wp { width: 560px; } @media only screen and (max-width: 780px) { .wrapper-page { background: url(../images/bg_mobile.jpg) no-repeat center center; background-size: 100%; } .wrapper-page #poster { width: 100%; background-size: 100%; } .wrapper-page .container { width: 100%; margin-top: 1%; } .wrapper-page .stickers { width: 75px !important; height: 75px !important; margin-top: -15px; margin-left: -15px; } .wrapper-page .video-wp { width: 100%; } } @media only screen and (max-width: 420px) { .wrapper-page .container { width: 100%; margin-top: -6%; } } .container { position: absolute; left: 50%; top: 50%; bottom: auto; right: auto; z-index: 100; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); margin-top: -1.5%; } .video-wp { position: relative; width: 100%; } .videoIf-player { border: 2px solid #95f752; background-color: #95cd25; } .zoomIn { -webkit-animation: zoomIn 0.5s ease-in-out forwards; -moz-animation: zoomIn 0.5s ease-in-out forwards; animation: zoomIn 0.5s ease-in-out forwards; } .zoomIn img { -webkit-animation-delay: 0.2s; -moz-animation-delay: 0.2s; animation-delay: 0.2s; } .zoomOut { -webkit-animation: zoomOut 0.5s ease-in-out forwards; -moz-animation: zoomOut 0.5s ease-in-out forwards; animation: zoomOut 0.5s ease-in-out forwards; -webkit-animation-delay: 0.4s; -moz-animation-delay: 0.4s; animation-delay: 0.4s; } .shake { -webkit-animation: shake 0.8s ease-in-out forwards; -moz-animation: shake 0.8s ease-in-out forwards; animation: shake 0.8s ease-in-out forwards; transform-origin: right bottom; } .shake2 { -webkit-animation: shake 0.8s ease-in-out forwards; -moz-animation: shake 0.8s ease-in-out forwards; animation: shake 0.8s ease-in-out forwards; transform-origin: left bottom; } @-webkit-keyframes zoomIn { 0% { -webkit-transform: scale(0); opacity: 0; filter: alpha(opacity=0); } 90% { -webkit-transform: scale(1.05); opacity: 1; filter: alpha(opacity=100); } 100% { -webkit-transform: scale(1); opacity: 1; filter: alpha(opacity=100); } } @-moz-keyframes zoomIn { 0% { -moz-transform: scale(0); opacity: 0; filter: alpha(opacity=0); } 90% { -moz-transform: scale(1.05); opacity: 1; filter: alpha(opacity=100); } 100% { -moz-transform: scale(1); opacity: 1; filter: alpha(opacity=100); } } @keyframes zoomIn { 0% { -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); opacity: 0; filter: alpha(opacity=0); } 90% { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); opacity: 1; filter: alpha(opacity=100); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; filter: alpha(opacity=100); } } @-webkit-keyframes zoomOut { 0% { -webkit-transform: scale(1); opacity: 1; filter: alpha(opacity=100); } 10% { -webkit-transform: scale(1.05); opacity: 1; filter: alpha(opacity=100); } 100% { -webkit-transform: scale(0); opacity: 0; filter: alpha(opacity=0); } } @-moz-keyframes zoomOut { 0% { -moz-transform: scale(1); opacity: 1; filter: alpha(opacity=100); } 10% { -moz-transform: scale(1.05); opacity: 1; filter: alpha(opacity=100); } 100% { -moz-transform: scale(0); opacity: 0; filter: alpha(opacity=0); } } @keyframes zoomOut { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; filter: alpha(opacity=100); } 10% { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); opacity: 1; filter: alpha(opacity=100); } 100% { -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); opacity: 0; filter: alpha(opacity=0); } } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: rotate(5deg); } 50% { -webkit-transform: rotate(-5deg); } } @-moz-keyframes shake { 0%, 100% { -moz-transform: rotate(5deg); } 50% { -moz-transform: rotate(-5deg); } } @keyframes shake { 0%, 100% { -webkit-transform: rotate(5deg); -moz-transform: rotate(5deg); -ms-transform: rotate(5deg); -o-transform: rotate(5deg); transform: rotate(5deg); } 50% { -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); -ms-transform: rotate(-5deg); -o-transform: rotate(-5deg); transform: rotate(-5deg); } }