*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0 auto; padding: 0; } html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { background-color: white !important; font-family: 'SVN-Gotham'!important; color: #393d3f; font-size: 16px; font-weight: 400; line-height: 20px; position: relative; } article, aside, details, figcaption, figure, footer, header, main, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } button, input, optgroup, select, textarea { margin: 0; font: inherit; color: inherit; border: none; } select { background: url('../images/select.png') right 10px center no-repeat; outline: none; overflow: hidden; text-indent: 0.01px; text-overflow: ''; display: inline-block; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; cursor: pointer; } select::-ms-expand { display: none; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; } input, textarea, select { outline: none; } *::-webkit-input-placeholder { color: inherit; } *:-moz-placeholder { color: inherit; opacity: 1; } *::-moz-placeholder { color: inherit; opacity: 1; } *:-ms-input-placeholder { color: inherit; } ul, ol { margin: 7px; padding-left: 15px; width: auto; } img { border: 0; font-size: 0; line-height: 0; max-width: 100%; } a { color: #2fb6cc; text-decoration: none; } a:hover, a:focus { color: #074a91; } a[href^=tel], a[href^=mail] { color: inherit; text-decoration: none; } a img { text-decoration: none; } strong, b { font-weight: bold; } h1, h2, h3, h4, h5 { font-weight: bold; } h1 { font-size: 40px; line-height: 48px;font-weight: 600!important; } h2 { font-size: 28px; line-height: 34px; font-weight: 600!important; } h3 { font-size: 16px; line-height: 22px; font-weight: 600!important; } h4 { font-size: 14px; line-height: 20px; font-weight: 600 !important} h5 { font-size: 12px; line-height: 18px; font-weight: 600 } p {color: #202020} .f-space05 { margin-top: 5px; } .f-space10 { margin-top: 10px; } .f-space15 { margin-top: 15px; } .f-space20 { margin-top: 20px; } .f-space25 { margin-top: 25px; } .f-space30 { margin-top: 30px; } .f-space40 { margin-top: 40px; } .f-space50 { margin-top: 50px; } #wrapper { width: 100%; position: relative; overflow: hidden; } .clear { clear: both; } .box-wp { max-width: 1170px; position: relative; } .box-main { max-width: 1170px; position: relative; } .box-wp:before, .box-wp:after, .box-main:before, .box-main:after, .clearfix:before, .clearfix:after { display: table; content: " "; } .box-wp:after, .box-main:after, .clearfix:after { clear: both; } a:hover{ text-decoration: none !important; } .img { width: 100%; text-align: left; position: relative; line-height: 0; overflow: hidden; float: left;} .img * { line-height: 0; display: inline-block; } .title { position: relative; } .box-title { font-size: 16px; line-height: 22px; margin: 20px 0; text-transform: uppercase; } .box-title a { color: inherit; display: inline-block; padding-bottom: 10px; position: relative; } .box-title a .title-1 { color: #0caec7; } .box-title a .title-2 { color: #054890; } .box-title .title >a::after { content: " "; border-bottom: 3px solid #1bb3ca; width: 15%; position: absolute; right: 0; bottom: 0; left: -15px; z-index: 0; } .no-js #loader { display: none; } .js #loader { display: block; position: absolute; left: 100px; top: 0; } .se-pre-con { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url(../images/Preloader_2.gif) center no-repeat #fff; } .header { position: relative; top: 0; z-index: 99999; } .header-top { padding: 0; background-color:#990000; } .header-top .contact a { color: #FFFFFF; margin-right: 20px; } .header-top .contact a img { margin-right: 10px; } .header-top .search { float: right;display: inline-block; position: relative; padding-top: 6%;} .header-top .search input[type="text"] { background-color: #72bc7100; color: #f2eded; font-size: 15px; opacity: 0.5; } .header-top .search input[type="submit"] { background: url(/images/search.svg) no-repeat center center; height: 14px; padding: 0px 8px; font-size: 0px; position: absolute; top: 4px; right: 5px; } .header-left { padding-top: 2%; float: left; width: 15%; position: relative; padding-bottom: 2%; } .header-left .logo .img { width: 65% !important; text-align: left; } .header-right { float: left; padding-top: 2%; padding-bottom: 2%; height: 67px; width: 55%; margin-top: 1%; } .header ul { margin: 0; padding: 0; list-style: none; } /*.header .logo { width: 70%;*/ /* float: left; padding: 5px 12px 15px 0px; }*/ .header .logo a { display: inline-block; } .header .language { position: absolute; top: 0; right: 0; } .language ul li { color: #9c9fa0; display: table-cell; vertical-align: middle; padding: 0 5px; line-height: 0; } .navbar { width: 100%; text-align: center; } .navbar.fixed { height: 60px; background: #3e4195; position: fixed; top: 0; right: 0; left: 0; z-index: 8; padding-left: 6%; padding-right: 6%; border-bottom: 1px solid; } .navigation, .navigation ul, .navigation ul li, .navigation ul li a { list-style: none; line-height: 0; display: block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0 auto; } .navigation:after, .navigation > ul:after { content: ""; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .navbar .navigation > ul > li { display: table-cell; vertical-align: middle;position: relative } .fixed .navigation > ul > li { padding: 0px 0; } .navbar .navigation > ul > li > a { color: white; display: block; font-size: 14px; font-weight: 300; line-height: 52px; text-align: center; text-transform: uppercase; white-space: nowrap; position: relative; margin-right: 45px; } .fixed .navigation > ul > li > a { margin-right: 72px; } .navbar.fixed .navigation > ul > li:after{ left: -35px; } .fixed .navigation > ul > li:last-child > a { margin-right: 0px; } .navigation > ul > li:hover > a, .navigation > ul > li:focus > a, .navigation > ul > li > a:hover, .navigation > ul > li > a:focus { text-decoration:none;color: #FFFFFF; font-weight: 700; } .navigation > ul > li.active > a { color: #FFFFFF; font-weight: 700; } /*.navigation > ul > li.active > a:after,*/ /* .navigation > ul > li:hover > a:after {*/ /* content: '';*/ /* border-bottom: 2px solid #051948;*/ /* width: 40%;*/ /* position: absolute;*/ /* top: 69%;*/ /* left: 17%;*/ /* margin-top: 15px;*/ /* }*/ .navigation > ul > li > a i { font-size: 20px; } .navigation ul ul { position: absolute; left: -9999px; top: 40px; width: 240px; z-index: 999; padding-top: 15px; opacity: 0; text-align: left; -webkit-transition: top 0.2s ease, opacity 0.2s ease-in; -moz-transition: top 0.2s ease, opacity 0.2s ease-in; -ms-transition: top 0.2s ease, opacity 0.2s ease-in; -o-transition: top 0.2s ease, opacity 0.2s ease-in; transition: top 0.2s ease, opacity 0.2s ease-in; } .navigation > ul > li > ul::after { content: ""; position: absolute; width: 0; height: 0; border: 8px solid transparent; border-bottom-color: #e8e8e8; top: -1px; left: 35px; } .navigation ul ul ul::after { content: ""; position: absolute; width: 0; height: 0; border: 7px solid transparent; border-right-color: #e8e8e8; top: 12px; left: -8px; } .navbar .navigation > ul > li:hover > ul { top: 93px; left: 0px; opacity: 1; } .fixed .navigation > ul > li:hover > ul { top: 53px; } .navigation ul ul ul { padding-top: 0; padding-left: 6px; } .navigation ul ul > li:hover > ul { left: 100%; top: 0; opacity: 1; } .navigation ul ul li a { background-color: #ffffff; border-top: 1px solid #e8e8e8; color: #363636; font-size: 15px; font-weight: 300; text-decoration: none; padding: 0 10px 0 30px; line-height: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .navigation ul ul li a::before { font: normal normal normal 10px/1 FontAwesome; content: "\f101"; position: absolute; top: 14px; left: 15px; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .navigation ul ul li:hover > a, .navigation ul ul li > a:hover, .navigation ul ul li > a:focus { color: #2fb6cc; } .navigation ul ul li.active > a { color: #2fb6cc; } .navigation ul ul li:hover > a::before, .navigation ul ul li > a:hover:before, .navigation ul ul li > a:focus:before { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } .navigation ul ul li.active > a::before { color: #2fb6cc; } .stock { background-color: #2fb6cc; color: #ffffff; padding: 12px; text-align: center; } .stock p { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .stock label + label { margin-left: 15px; } .box-slider, .box-banner { max-width: 100%; overflow: hidden; position: relative; } .box-slider .video { position: absolute; right: 120px; bottom: 15px; max-width: 220px; overflow: hidden; } .box-slider .video img { border-top-left-radius: 40px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-top-right-radius: 5px; -moz-border-radius-bottomright: 40px; -webkit-border-bottom-right-radius: 40px; border-bottom-right-radius: 40px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px; border: 2px solid #ffffff; } .box-slider .video .background { position: absolute; width: 100%; height: 100%; top: 0; z-index: 3; transition: all 0.6s ease; } .box-slider .video .background { background: url('../images/play.png')center center no-repeat; } .box-slider .video:hover .background { background: url('../images/view-play.png')center center no-repeat; } .breadcrumb { background-color: #ffffff; border-bottom: 1px solid #e8ebec; overflow-y: auto; margin: 0; padding: 10px 12px; } .breadcrumb:after { content: ""; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .breadcrumb a { display: table-cell; font-size: 13px; font-weight: 400; line-height: 28px; padding: 0 10px 0 0; position: relative; white-space: nowrap; } .breadcrumb .fa { font-size: 1.4em; } .breadcrumb a + a { padding-left: 15px; } .breadcrumb a:last-child { color: inherit; } .breadcrumb a:hover, .breadcrumb a:focus { text-decoration: underline; } .breadcrumb a.error { color: #ff7b79 !important; } .breadcrumb a:before { content: ""; border-top: 5px solid transparent; border-left: 5px solid #cfd2d3; border-bottom: 5px solid transparent; width: 0; height: 0; position: absolute; left: 100%; top: 8px; font-size: 1.4em; font-weight: 300; } .breadcrumb a:last-child::before { display: none; } .container { position: relative; } .content { background-color: #ffffff; padding: 30px 12px; } .content-left { float: left; width: 22%; } .content-right { float: right; width: 72%; } .box-post { padding: 0px 12px 30px 12px; background: url(../images/background_project.png) no-repeat center center; background-color: #fff; } .list-post { margin: 0 -20px; } .item-post { float: left; width: 33.33336%; padding: 20px 20px 0 20px; margin-bottom: 30px; background-color: #fff; } .item-post .col-post { box-shadow: 2px 2px 15px #888888; } .item-post .box { background-color: #ffffff; text-align: center; padding: 20px 20px 0px 20px; -webkit-transition: all 2s ease; transition: all 2s ease; } .item-post .box .img-pro { position: relative; } .item-post .box .box-img .box_img_hover { position: absolute; top: 0px; left: 0px; box-sizing: content-box; background: url("../images/img_hover.png") no-repeat center center; } .item-post .box:hover .box-img .box_img_hover { top: -4px; left: 0px; width: 100%; height: 100%; background-position: 50% 50%; background-size: contain; } .item-post .description { padding: 0 20px 10px 20px; } .item-post .description h3 { margin: 20px 0; height: 44px; } .item-post .description .text { height: 60px; overflow: hidden; margin-top: -22px; } .item-post .description a { color: #5a5a5a; } .item-post .description a:hover, .item-post .description a:focus { color: #054890; } .item-post .description .more { border-top: 1px dotted #e8ebec; font-size: 12px; margin-top: 8px; padding-top: 5px; text-align: right; } .item-post .description .more > a:hover, .item-post .description .more > a:focus { text-decoration: underline; } .p-hot { background-color: #2fb6cc; border-radius: 5px 0 0 5px; color: #ffffff; display: inline-block; font-size: 12px; font-weight: 500; text-transform: uppercase; margin-right: 12px; padding: 5px 5px 3px; line-height: 1; position: relative; } .p-hot::after { content: ""; position: absolute; width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 8px solid #2fb6cc; top: 0; left: 100%; } .wp-list { margin: -15px -15px 0; } .item-post2 { float: left; width: 33.33336%; padding: 15px; } .item-post2 .box { background-color: #ffffff; } .item-post2 .description { border: 1px solid #e8ebec; padding: 5px 12px 12px; } .item-post2 .description h3 { margin: 10px 0; height: 44px; } .item-post2 .description .text { height: 60px; overflow: hidden; } .item-post2 .description a { color: inherit; } .item-post2 .description a:hover, .item-post2 .description a:focus { color: #2fb6cc; } .item-post2 .description .more { border-top: 1px dotted #e8ebec; font-size: 12px; margin-top: 8px; padding-top: 5px; text-align: right; } .item-post2 .description .more > a:hover, .item-post2 .description .more > a:focus { text-decoration: underline; } .item-vs { border-bottom: 1px solid #e8ebec; padding: 30px 0; } .item-vs:first-child { padding-top: 0; } .item-vs .img { float: left; width: 35%; } .item-vs .description { float: right; width: 62%; } .item-vs .time { border-bottom: 1px dotted #e8ebec; margin: 5px 0 10px; padding-bottom: 5px; } .item-vs .more { margin-top: 10px; text-align: right; } .item-vs .more > a:hover, .item-vs .more > a:focus { text-decoration: underline; } .item-vs:after { content: ""; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .item-vs .p-hot { background-color: #f73922; } .item-vs .p-hot:after { border-left-color: #f73922; } .title-vs { position: relative; padding-bottom: 20px; } .title-vs:after { content: " "; border-bottom: 5px solid #2fb6cc; position: absolute; bottom: 0; left: 0; width: 50px; } .menu-left ul { margin: 0; padding: 0; list-style: none; } .menu-left ul li > a { border-bottom: 1px solid #e8ebec; color: inherit; display: block; padding: 15px 20px 15px 12px; text-transform: uppercase; position: relative; } .menu-left ul li > a:hover, .menu-left ul li > a:focus, .menu-left ul li.active > a { background-color: #2fb6cc; color: #ffffff; } .menu-left ul li > a::after { content: "\f105"; font: normal normal normal 14px/1 FontAwesome; position: absolute; top: 50%; right: 10px; margin-top: -7px; } .menu-left ul ul { padding-left: 20px; border-bottom: 1px solid #e8ebec; } .menu-left ul ul li > a { border-bottom: 1px solid #e8ebec; font-size: 13px; padding: 10px 20px 10px 12px; } .menu-left ul ul li:last-child > a { border-bottom: none; } .partners { padding: 20px 12px 30px; } .list-partner { max-width: 1170px; margin-left: 1px; } .list-partner ul { margin: 0; padding: 0; list-style: none; } .time, .time-views {float: left; color: #9c9fa0; font-size: 14px; width: 100%; } .time-views label + label { margin-left: 10px; } .wrap-detail { font-size: 15px; line-height: 23px; text-align: justify; position: relative; } .detail-wp { overflow-x: hidden; overflow-y: hidden; } .detail-wp h1, .detail-wp h2, .detail-wp h3, .detail-wp h4, .detail-wp h5, .detail-wp p, .detail-wp table, .detail-wp ul, .detail-wp ol { margin-bottom: 10px; } .wrap-detail .social-like { margin: 20px 0 0; position: relative; z-index: 1; line-height: 20px !important; } .wrap-detail .social-like .item-social { float: left; margin: 0 10px 0 0; position: relative; } .wrap-detail .social-like .item-social ._2pi8 { padding: 0 !important; } .others { margin-top: 20px; } .others .title-other { border-bottom: 1px solid #074a91; color: #074a91; padding-bottom: 5px; text-transform: uppercase; } ul.list-other { margin: 20px 0 10px; padding: 0; width: auto; list-style: none; } ul.list-other li { font-size: 16px; line-height: 20px; text-transform: capitalize; margin-bottom: 12px; padding-left: 27px; position: relative; } ul.list-other li::before { content: ""; color: #ec1c24; font: normal normal normal 16px/1 FontAwesome; position: absolute; top: 89%; left: 0; margin-top: -11px; background: #ffffff; width: 10px; height: 10px; border-radius: 50%; border: 2px solid; } ul.list-other li a { color: black; } ul.list-other li:hover, ul.list-other li:focus, ul.list-other li a:hover, ul.list-other li a:focus { text-decoration: underline; } .updating { padding: 30px 0 50px; text-align: center; } .updating h3 { font-weight: 400; } .social-share { position: absolute; top: -25px; right: 0; z-index: 7; height: 0; text-align: center; } .social-share input[type="checkbox"] { display: none; } .social-share .checkbox:checked ~ .social { opacity: 1; -webkit-transform: scale(1) translateY(-67px); -moz-transform: scale(1) translateY(-67px); -o-transform: scale(1) translateY(-65px); transform: scale(1) translateY(-67px); -webkit-transition: .5s; -moz-transition: .5s; -o-transition: .5s; transition: .5s; } .social-share .label { background-color: rgba(47, 182, 204, 0.8); border-radius: 50%; color: #ffffff; font-size: 17px; cursor: pointer; margin: 0; width: 30px; height: 30px; line-height: 30px; } .social-share .checkbox:checked + .label { background-color: #cfcfcf; color: #ffaa05; } .social-share .social { transform-origin: 50% 0%; -webkit-transform: scale(0) translateY(-167px); -moz-transform: scale(0) translateY(-167px); -o-transform: scale(0) translateY(-167px); transform: scale(0) translateY(-167px); opacity: 0; } .social-share ul { color: #ffffff; width: 90px; height: 30px; margin: auto; padding: 0; list-style: none; position: relative; left: 0; right: 0; } .social-share ul li { display: block; font-size: 15px; cursor: pointer; width: 30px; line-height: 30px; margin: 0; padding: 0; text-align: center; float: left; } .social-share ul li:hover { color: rgba(0, 0, 0, .5); } .social-share ul:after { content: ''; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #33bce9; display: block; position: absolute; top: 100%; left: 0; right: 0; height: 0; width: 0; } .social-share li[class*="facebook"] { background-color: #37528d; } .social-share li[class*="twitter"] { background-color: #33bce9; } .social-share li[class*="google-plus"] { background-color: #dc2310; } .footer { background:white; color: #051948; font-weight: 300; clear: both; } .footer .information { padding: 20px 12px 20px 12px; background-size: cover; } .footer .information .box-info { display: table; width: 100%; } .footer .information .col-1 { display: table-cell; width: 21%; vertical-align: middle; text-align: center; } .footer .information .col-2 { display: table-cell; width: 58%; line-height: 28px; padding-right: 20px; padding-top: 22px; } .footer .information .col-1 .img { text-align: left; } .newsletter { position: relative; margin-top: 15%; } .newsletter input[type=text] { color: #97101f; background-color: rgba(255, 255, 255, 0.33); width: 100%; font-size: 16px; padding: 0 85px 0 12px; line-height: 44px; height: 45px; border: 2px solid #97101F; } .newsletter button[type=submit] { outline: none; background-color: rgb(151, 16, 31); color: #ffffff; font-size: 0px; font-weight: 500; text-transform: uppercase; line-height: 43px; height: 45px; padding: 0 3px 0 10px; position: absolute; top: 0; right: 0; background: url(/images/nextft.svg) no-repeat center center rgb(151, 16, 31); width: 25%; border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .footer .social { margin: -5px auto 0; padding: 0; list-style: none; margin-bottom: 20px; } .footer .social li { display: inline-block; } .footer .social li > a { display: block; font-size: 16px; width: 40px; height: 40px; line-height: 40px; text-align: center; position: relative; } .footer .social li > a::before, .footer .social li > a::after { content: ''; border-radius: 100%; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .footer .social li > a::before { border: 1px solid transparent; } .footer .social li > a::after { border: 0 solid transparent; } .footer .social li > a:hover::before { border-top-color: #ffffff; border-right-color: #ffffff; border-bottom-color: #ffffff; -webkit-transition: border-top-color 0.15s linear, border-right-color 0.15s linear 0.1s, border-bottom-color 0.15s linear 0.2s; transition: border-top-color 0.15s linear, border-right-color 0.15s linear 0.1s, border-bottom-color 0.15s linear 0.2s; } .footer .social li > a::after { border: 0 solid transparent; } .footer .social li > a:hover::after { border-top: 1px solid #ffffff; border-left-width: 1px; border-right-width: 1px; -webkit-transform: rotate(270deg); transform: rotate(270deg); -webkit-transition: border-left-width 0s linear 0.35s, -webkit-transform 0.4s linear 0s; transition: border-left-width 0s linear 0.35s, -webkit-transform 0.4s linear 0s; transition: transform 0.4s linear 0s, border-left-width 0s linear 0.35s; transition: transform 0.4s linear 0s, border-left-width 0s linear 0.35s, -webkit-transform 0.4s linear 0s; } .footer .social li i { font-size: 20px; } .footer .copyright { padding-top: 1%; font-weight: 500; } .footer .copyright .text { float: left;position: relative; padding: 8px 0; text-align: left; color: #000000c4; font-size: 14px; font-weight: 400; padding-left: 0px; } .footer .copyright .danaweb { float: right; font-size: 14px; margin-top: 0.5%; } .footer .copyright .danaweb p{ color: #000000c4; font-weight: 400; text-transform: capitalize; white-space: nowrap; } .danaweb img { width: 30%; padding-bottom: 2%; } #_loading { display: none; position: fixed; z-index: 9999; } .form-sm { padding: 5px; width: 50%; float: left; } .form-bg { padding: 5px; } .frm .form-item { position: relative; padding: 7px; } .frm .form-item input, .frm .form-item select, .frm .form-item textarea { background-color: #f9f9f9; border: 1px solid #cecfce; padding: 6px 10px 6px 35px; width: 100%; font-size: 13px; line-height: 20px; } .frm .form-item textarea { resize: none; } .frm .form-item i { left: 7px; top: 7px; position: absolute; height: 34px; width: 40px; color: #b8b8b8; text-align: center; line-height: 34px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; pointer-events: none; } .frm .form-item input:hover ~ i, .frm .form-item select:hover ~ i, .frm .form-item textarea:hover ~ i { color: #b52024; } .frm .form-item input:focus ~ i, .frm .form-item select:focus ~ i, .frm .form-item textarea:focus ~ i { color: #f26a1d; } .frm .form-item input[type=submit] { background: #05468E url('../images/btn-send.png') center no-repeat; border: none; width: 100%; padding: 6px 0; display: inline-block; color: #ffffff; font-size: 15px; font-weight: 600; max-width: 150px; text-transform: uppercase; } .frm .form-item input[type=submit]:hover, .frm .form-item input[type=submit]:focus { background-color: #d12529; } .frm .form-item input.btn-dm:hover, .frm .form-item input.btn-dm:focus { background-color: #ffaa05; } .frm .form-item .show-error { color: #f70626; font-size: 0.9em; font-weight: lighter; white-space: nowrap; } .frm .frm-button { text-align: center; } .form-item.it-error input, .form-item.it-error select, .form-item.it-error textarea { border: 1px solid #ff6e69; } .header .language ul li .phone { display: none; } @media screen and (max-width:1200px) { .navigation ul { width: 100%; } .navbar .navigation > ul > li > a { margin-right: 0; } .navigation > ul > li > a { padding: 0 15px; } .navigation > ul > li.has-sub > a::after { right: 5px; } .box-slider .caption { top: 100px; } .tool { bottom: 20px; } .tool ul > li > a.img { max-width: 80px; margin-bottom: 10px; } .tool ul > li > a { font-size: 14px; line-height: 20px; max-width: 90px; } } @media screen and (max-width:1050px) { .header-left { width: 14%; } .header-right { width: 86%; margin-right: 0 !important; } .navigation > ul > li > a { padding: 0 10px; } .story_wp .box_wp .box_text_tg1 { left: -47.8% !important; } .story_wp .box_wp .box_text_tg2 { right: -36.6% !important; } .story_wp .item-title { padding-left: 31px !important; } .story_wp .box_wp .box_text_tg .text_line { width: 60% !important; } .header .header-top .contact { padding-left: 20px !important; } .box-news { padding-left: 20px !important; padding-right: 20px !important; } .page-contact { padding: 0 15px !important; } .tooltip:hover:after { left: -114px !important; width: 445px !important; } .box-newsest { padding-left: 40px !important; } .navigation ul ul { width: 165px !important; } .navbar .navigation > ul > li > a { font-size: 15px !important; } .navbar .navigation > ul > li:hover > ul { left: -8px !important; } .navigation ul ul li a { padding: 0 10px 0 25px !important; font-size: 13px; } .table1_in { margin-top: 130px !important; } .content2_in { margin-top: -195px !important; } .content1_mes { padding: 20px !important; top: 80px !important; right: 10px !important; } .content2_mes { bottom: 123px !important; right: 9px !important; } } @media screen and (max-width:960px) { #wrapper { margin-top: 150px; } .header { background-color: #ffffff; position: fixed; top: 0; right: 0; left: 0; z-index: 999; } .header .logo { padding: 6px 12px; } .header .logo .img { float: left; width: auto; line-height: 0; } .header .logo .img img { max-height: 40px; } .header .language { top: 3px; right: 55px; } .navbar, .stock { display: none; } .content-left { display: none; } .content-right { width: 100%; padding-right: 10px !important; } .list-partner ul > li { padding: 20px 10px; } .footer .sub-link { display: none; } .header .header-top { padding: 25px 0; } .header .logo { top: 0; } .header .header-top .contact { display: none; } .header .language { top: -3px; } #hamburger { top: 4px !important; } .header .language ul li .phone { display: block; } .box-news { padding-left: 20px; padding-right: 20px; } .box-slider .video { right: 40px; } .content1_mes { padding: 25px !important; top: 60px !important; right: 30px !important; } .content2_mes { bottom: 98px !important; } } @media screen and (max-width:840px) { .content2_mes { bottom: 122px !important; } } @media screen and (max-width:768px) { .story_wp .box_wp .box_text_tg { left: 37% !important; } .story_wp .box_wp .box_text_tg2 { right: -61.5% !important; } .story_wp .box_wp .box_text_tg1 { left: -80.2% !important; } .story_wp .item-title { padding-left: 10px !important; } .td1_in { padding: 0 20px 0 35px !important; } .content2_in { margin-top: -167px !important; } .content1_mes { padding: 20px !important; top: 80px !important; right: 10px !important; } } @media screen and (max-width:767px) { h1 { font-size: 30px; line-height: 38px; } h2 { font-size: 22px; line-height: 28px; } .box-slider .caption { top: 220px; } .box-title { margin: 0; } .footer .information .col-1, .footer .information .col-2 { display: block; width: 100%; } .footer .information .col-2 { margin: 30px 0; line-height: 24px; text-align: center; } .footer .social { margin-top: 5px; } .footer .copyright .text, .footer .copyright .danaweb { width: 100%; text-align: center; } .footer .information .col-1 .img { text-align: center; margin-top: 20px; } .list-post { margin: 20px 0 !important; } .tool { padding: 60px 0 0px 0 !important; } .tool ul > li { width: 50%; float: left; margin-bottom: 40px; } } @media screen and (max-width:736px) { .box-newsest { padding-left: 0px !important; } .content2_in { margin-top: -190px !important; } .content2_mes { bottom: 146px !important; } .content1_mes { right: 5px !important; } } @media screen and (max-width:680px) { .item-post, .item-post1, .item-post2 { width: 100% !important; max-width: 500px; float: none !important; } .box_text_tg2 .tooltip:hover:after { left: -40px !important; } .box_text_tg1 .tooltip:hover:after { left: -300px !important; } .box-slider .video { max-width: 170px; } .box-slider .video .background, .box-slider .video:hover .background { background-size: 25%; } } @media screen and (max-width:667px) { .table1_in { margin-top: 180px !important; } .content2_in { margin-top: -191px !important; } .content2_mes { bottom: 145px !important; } .content1_mes { padding: 15px !important; top: 44px !important; right: 7px !important; max-width: 195px !important; } } @media screen and (max-width:640px) { .content1_mes { padding: 15px !important; top: 100px !important; max-width: 180px !important; } .content2 { right: 24px !important; padding: 25px !important; bottom: 144px !important; } .content3 { padding-left: 20px !important; } } @media screen and (max-width:568px) { .table1_in { margin-top: 240px !important; } .content2_in { margin-top: -220px !important; } } @media screen and (max-width:480px) { .language ul li { padding: 0 2px; } .item-vs .img, .item-vs .description { width: 100%; } .item-vs .img { margin-bottom: 10px; } .form-sm { width: 100%; } .header-top .contact a span { display: none !important; } } @media screen and (max-width:440px) { .box-slider .video { max-width: 96px; border-top-left-radius: 20px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-top-right-radius: 5px; -moz-border-radius-bottomright: 20px; -webkit-border-bottom-right-radius: 20px; border-bottom-right-radius: 20px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px; } } @media screen and (max-width:420px) { .table1_in { margin-top: 210px !important; } .td1_in { padding: 35px 20px 0px 19px !important; } .content1_in { padding: 15px !important; width: 60% !important; top: 140px !important; } .content2_in { margin-top: -255px !important; } } @media screen and (max-width:414px) { .header-top .contact a img { margin-right: -15px; } .tooltip:hover:after { left: -46px !important; width: 182px !important; } .content1_mes { max-width: 150px !important; top: 135px !important; padding: 10px !important; } .content2_mes { right: 100px !important; padding: 9px !important; bottom: 169px !important; max-width: 210px !important; } .content4_mes { margin-right: 35px !important; } .content5_mes { width: 55% !important; } .span1_mes { font-size: 15px !important; } .span2_mes { font-size: 10px !important; display: inherit; } } @media screen and (max-width:375px) { .header-top .search input { display: none !important; } .tooltip:hover:after { width: 181px !important; } .breadcrumb { display: none; } .table1_in { margin-top: 250px !important; } .td1_in { padding: 5px 20px 0px 19px !important; } .content2_in { margin-top: -382px !important; } .content1_mes { max-width: 160px; top: 276px !important; right: 15px !important } .content2_mes { bottom: 192px !important; right: 73px !important; padding: 5px !important; } .span1_mes { font-size: 10px !important; } .span2_mes { font-size: 6px !important; display: inherit; } .content5_mes { width: 45% !important; } } @media screen and (max-width:360px) { .table1_in { margin-top: 260px !important; } .content2_in { margin-top: -316px !important; } .content2_mes { bottom: 191px !important; right: 164px !important; } .content1_mes { top: 275px !important; } } @media screen and (max-width:320px) { .table1_in { margin-top: 340px !important; } .content2_in { margin-top: -502px !important; } } .page-navigation { font-size: 14px; clear: both; text-align: left; cursor: default; font-weight: 400; padding: 10px 0; } .pagination { margin: 0; padding: 0; display: inline-block; } .pagination > li { list-style: none; float: left; display: inline-block; padding: 3px; } .pagination > li > a, .pagination > li > span { background-color: #dfdfdf; border-radius: 50%; color: inherit; position: relative; float: left; padding: 0; margin-top: 2px; width: 36px; line-height: 36px; text-align: center; text-decoration: none; } .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { background-color: #074a91; color: #ffffff; } .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { background-color: #2fb6cc; color: #ffffff; z-index: 2; cursor: not-allowed; width: 40px; line-height: 40px; margin-top: 0; } .pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus { color: #777; cursor: not-allowed; background-color: #fff; } .pagination-lg > li > a, .pagination-lg > li > span { padding: 10px 16px; font-size: 18px; } .pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span { border-top-left-radius: 6px; border-bottom-left-radius: 6px; } .pagination-lg > li:last-child > a, .pagination-lg > li:last-child > span { border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .pagination-sm > li > a, .pagination-sm > li > span { padding: 5px 10px; font-size: 12px; } .pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .pager { padding-left: 0; margin: 20px 0; text-align: center; list-style: none; } .pager li { display: inline; } .pager li > a, .pager li > span { display: inline-block; padding: 5px 14px; background-color: #fff; border: 1px solid #ddd; border-radius: 15px; } .pager li > a:hover, .pager li > a:focus { text-decoration: none; background-color: #eee; } .pager .next > a, .pager .next > span { float: right; } .pager .previous > a, .pager .previous > span { float: left; } .pager .disabled > a, .pager .disabled > a:hover, .pager .disabled > a:focus, .pager .disabled > span { color: #777; cursor: not-allowed; background-color: #fff; } #go-top { background: url('../images/go-top.png') center top no-repeat; position: fixed; z-index: 91; height: 40px; width: 40px; right: 30px; bottom: -50px; cursor: pointer; } #go-top:hover { background-position: center -40px; } .error404 { text-align: center; font-size: 1.15em; padding: 30px 0 50px; } .error404 i { margin-top: 40px; font-size: 10em; } .error404 p:last-child { color: #ff7b79; } .windows8 { position: relative; width: 80px; height: 80px; } .windows8 .wBall { position: absolute; width: 76px; height: 76px; opacity: 0; -moz-transform: rotate(225deg); -moz-animation: orbit 4.95s infinite; -webkit-transform: rotate(225deg); -webkit-animation: orbit 4.95s infinite; -ms-transform: rotate(225deg); -ms-animation: orbit 4.95s infinite; -o-transform: rotate(225deg); -o-animation: orbit 4.95s infinite; transform: rotate(225deg); animation: orbit 4.95s infinite; } .windows8 .wBall .wInnerBall { background-color: #1d92af; position: absolute; width: 10px; height: 10px; left: 0; top: 0; -moz-border-radius: 10px; -webkit-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; } .windows8 #wBall_1 { -moz-animation-delay: 1.08s; -webkit-animation-delay: 1.08s; -ms-animation-delay: 1.08s; -o-animation-delay: 1.08s; animation-delay: 1.08s; } .windows8 #wBall_2 { -moz-animation-delay: 0.22s; -webkit-animation-delay: 0.22s; -ms-animation-delay: 0.22s; -o-animation-delay: 0.22s; animation-delay: 0.22s; } .windows8 #wBall_3 { -moz-animation-delay: 0.43s; -webkit-animation-delay: 0.43s; -ms-animation-delay: 0.43s; -o-animation-delay: 0.43s; animation-delay: 0.43s; } .windows8 #wBall_4 { -moz-animation-delay: 0.65s; -webkit-animation-delay: 0.65s; -ms-animation-delay: 0.65s; -o-animation-delay: 0.65s; animation-delay: 0.65s; } .windows8 #wBall_5 { -moz-animation-delay: 0.86s; -webkit-animation-delay: 0.86s; -ms-animation-delay: 0.86s; -o-animation-delay: 0.86s; animation-delay: 0.86s; } @-moz-keyframes orbit { 0% { opacity: 1; z-index: 99; -moz-transform: rotate(180deg); -moz-animation-timing-function: ease-out; } 7% { opacity: 1; -moz-transform: rotate(300deg); -moz-animation-timing-function: linear; -moz-origin: 0%; } 30% { opacity: 1; -moz-transform: rotate(410deg); -moz-animation-timing-function: ease-in-out; -moz-origin: 7%; } 39% { opacity: 1; -moz-transform: rotate(645deg); -moz-animation-timing-function: linear; -moz-origin: 30%; } 70% { opacity: 1; -moz-transform: rotate(770deg); -moz-animation-timing-function: ease-out; -moz-origin: 39%; } 75% { opacity: 1; -moz-transform: rotate(900deg); -moz-animation-timing-function: ease-out; -moz-origin: 70%; } 76% { opacity: 0; -moz-transform: rotate(900deg); } 100% { opacity: 0; -moz-transform: rotate(900deg); } } @-webkit-keyframes orbit { 0% { opacity: 1; z-index: 99; -webkit-transform: rotate(180deg); -webkit-animation-timing-function: ease-out; } 7% { opacity: 1; -webkit-transform: rotate(300deg); -webkit-animation-timing-function: linear; -webkit-origin: 0%; } 30% { opacity: 1; -webkit-transform: rotate(410deg); -webkit-animation-timing-function: ease-in-out; -webkit-origin: 7%; } 39% { opacity: 1; -webkit-transform: rotate(645deg); -webkit-animation-timing-function: linear; -webkit-origin: 30%; } 70% { opacity: 1; -webkit-transform: rotate(770deg); -webkit-animation-timing-function: ease-out; -webkit-origin: 39%; } 75% { opacity: 1; -webkit-transform: rotate(900deg); -webkit-animation-timing-function: ease-out; -webkit-origin: 70%; } 76% { opacity: 0; -webkit-transform: rotate(900deg); } 100% { opacity: 0; -webkit-transform: rotate(900deg); } } @-ms-keyframes orbit { 0% { opacity: 1; z-index: 99; -ms-transform: rotate(180deg); -ms-animation-timing-function: ease-out; } 7% { opacity: 1; -ms-transform: rotate(300deg); -ms-animation-timing-function: linear; -ms-origin: 0%; } 30% { opacity: 1; -ms-transform: rotate(410deg); -ms-animation-timing-function: ease-in-out; -ms-origin: 7%; } 39% { opacity: 1; -ms-transform: rotate(645deg); -ms-animation-timing-function: linear; -ms-origin: 30%; } 70% { opacity: 1; -ms-transform: rotate(770deg); -ms-animation-timing-function: ease-out; -ms-origin: 39%; } 75% { opacity: 1; -ms-transform: rotate(900deg); -ms-animation-timing-function: ease-out; -ms-origin: 70%; } 76% { opacity: 0; -ms-transform: rotate(900deg); } 100% { opacity: 0; -ms-transform: rotate(900deg); } } @-o-keyframes orbit { 0% { opacity: 1; z-index: 99; -o-transform: rotate(180deg); -o-animation-timing-function: ease-out; } 7% { opacity: 1; -o-transform: rotate(300deg); -o-animation-timing-function: linear; -o-origin: 0%; } 30% { opacity: 1; -o-transform: rotate(410deg); -o-animation-timing-function: ease-in-out; -o-origin: 7%; } 39% { opacity: 1; -o-transform: rotate(645deg); -o-animation-timing-function: linear; -o-origin: 30%; } 70% { opacity: 1; -o-transform: rotate(770deg); -o-animation-timing-function: ease-out; -o-origin: 39%; } 75% { opacity: 1; -o-transform: rotate(900deg); -o-animation-timing-function: ease-out; -o-origin: 70%; } 76% { opacity: 0; -o-transform: rotate(900deg); } 100% { opacity: 0; -o-transform: rotate(900deg); } } @keyframes orbit { 0% { opacity: 1; z-index: 99; transform: rotate(180deg); animation-timing-function: ease-out; } 7% { opacity: 1; transform: rotate(300deg); animation-timing-function: linear; origin: 0%; } 30% { opacity: 1; transform: rotate(410deg); animation-timing-function: ease-in-out; origin: 7%; } 39% { opacity: 1; transform: rotate(645deg); animation-timing-function: linear; origin: 30%; } 70% { opacity: 1; transform: rotate(770deg); animation-timing-function: ease-out; origin: 39%; } 75% { opacity: 1; transform: rotate(900deg); animation-timing-function: ease-out; origin: 70%; } 76% { opacity: 0; transform: rotate(900deg); } 100% { opacity: 0; transform: rotate(900deg); } } .box-news { padding: 30px 12px 0px 12px; } .box-newsest { max-width: 1000px !important; } .list-post { margin: 0 -20px; } .item-post1 .box { background-color: #ffffff; } .item-post1 .description { padding: 15px; } .item-post1 .description h3 { margin: 10px 0; } .item-post1 .description .text { height: 60px; overflow: hidden; } .item-post1 .description a { color: inherit; } .item-post1 .description a:hover, .item-post1 .description a:focus { color: #2fb6cc; } .item-post1 .description .view-more { border-top: 1px dotted #e8ebec; font-size: 12px; margin-top: 8px; padding-top: 5px; } .item-post1 .description .view { float: left; } .item-post1 .description .more { text-align: right; } .item-post1 .description .more > a:hover, .item-post1 .description .more > a:focus { text-decoration: underline; } .wp-list { margin: -15px -15px 0; } .item-post2 { float: left; width: 33.33336%; padding: 15px; } .item-post2 .box { background-color: #ffffff; } .item-post2 .description { border: 1px solid #e8ebec; padding: 5px 12px 12px; } .item-post2 .description h3 { margin: 10px 0; height: 44px; } .item-post2 .description .text { height: 60px; overflow: hidden; } .item-post2 .description a { color: inherit; } .item-post2 .description a:hover, .item-post2 .description a:focus { color: #2fb6cc; } .item-post2 .description .more { border-top: 1px dotted #e8ebec; font-size: 12px; margin-top: 8px; padding-top: 5px; text-align: right; } .item-post2 .description .more > a:hover, .item-post2 .description .more > a:focus { text-decoration: underline; } .item-vs { border-bottom: 1px solid #e8ebec; padding: 30px 0; } .item-vs:first-child { padding-top: 0; } .item-vs .img { float: left; width: 35%; } .item-vs .description { float: right; width: 62%; } .item-vs .time { border-bottom: 1px dotted #e8ebec; margin: 5px 0 10px; padding-bottom: 5px; } .item-vs .more { margin-top: 10px; text-align: right; } .item-vs .more > a:hover, .item-vs .more > a:focus { text-decoration: underline; } .item-vs:after { content: ""; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .item-vs .p-hot { background-color: #f73922; } .item-vs .p-hot:after { border-left-color: #f73922; } .gr-box { background: url(../images/background_news.png) no-repeat; background-position: 5px 177px; background-color: #fff; } .list-news .text { margin-top: 10px; margin-bottom: 5px; height: 65px; overflow: hidden; } .list_news_02 .noimg-news { margin-bottom: 11px; } .tooltip { display: inline; position: relative; } .tooltip:hover:before { border: solid; border-color: #4272A8 transparent; border-width: 6px 6px 0 6px; bottom: 20px; content: ""; left: 50%; position: absolute; z-index: 99; } .tooltip:hover:after { background: #4272A8; border-radius: 5px; bottom: 26px; color: #fff; content: attr(title); left: 20%; padding: 5px 15px; position: absolute; z-index: 98; width: 500px; font-size: 12px; } .fancybox-enabled{overflow:hidden}.fancybox-enabled body{overflow:visible;height:100%}.fancybox-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999999999;-webkit-backface-visibility:hidden;backface-visibility:hidden}.fancybox-container~.fancybox-container{z-index:99992}.fancybox-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:#0f0f11;opacity:0;transition-timing-function:cubic-bezier(.55,.06,.68,.19);-webkit-backface-visibility:hidden;backface-visibility:hidden}.fancybox-container--ready .fancybox-bg{opacity:.87;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-controls{position:absolute;top:0;left:0;right:0;text-align:center;opacity:0;z-index:99994;transition:opacity .2s;pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;direction:ltr}.fancybox-show-controls .fancybox-controls{opacity:1}.fancybox-infobar{display:none}.fancybox-show-infobar .fancybox-infobar{display:inline-block;pointer-events:all}.fancybox-infobar__body{display:inline-block;width:70px;line-height:44px;font-size:13px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;text-align:center;color:#ddd;background-color:rgba(30,30,30,.7);pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:subpixel-antialiased}.fancybox-buttons{position:absolute;top:0;right:0;display:none;pointer-events:all}.fancybox-show-buttons .fancybox-buttons{display:block}.fancybox-slider-wrap{overflow:hidden;direction:ltr}.fancybox-slider,.fancybox-slider-wrap{position:absolute;top:0;left:0;bottom:0;right:0;padding:0;margin:0;z-index:99993;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-tap-highlight-color:transparent}.fancybox-slide{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;overflow:auto;outline:none;white-space:normal;box-sizing:border-box;text-align:center;z-index:99994;-webkit-overflow-scrolling:touch}.fancybox-slide:before{content:"";height:100%;width:0}.fancybox-slide:before,.fancybox-slide>*{display:inline-block;vertical-align:middle}.fancybox-slide>*{position:relative;padding:24px;margin:44px 0;border-width:0;text-align:left;background-color:#fff;overflow:auto;box-sizing:border-box}.fancybox-slide--image{overflow:hidden}.fancybox-slide--image:before{display:none}.fancybox-content{display:inline-block;position:relative;margin:44px auto;padding:0;border:0;width:80%;height:calc(100% - 88px);vertical-align:middle;line-height:normal;text-align:left;white-space:normal;outline:none;font-size:16px;font-family:Arial,sans-serif;box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-overflow-scrolling:touch}.fancybox-iframe{display:block;margin:0;padding:0;border:0;width:100%;height:100%;background:#fff}.fancybox-slide--video .fancybox-content,.fancybox-slide--video .fancybox-iframe{background:transparent}.fancybox-placeholder{z-index:99995;background:transparent;cursor:default;overflow:visible;-webkit-transform-origin:top left;transform-origin:top left;background-size:100% 100%;background-repeat:no-repeat;-webkit-backface-visibility:hidden;backface-visibility:hidden}.fancybox-image,.fancybox-placeholder,.fancybox-spaceball{position:absolute;top:0;left:0;margin:0;padding:0;border:0}.fancybox-image,.fancybox-spaceball{width:100%;height:100%;max-width:none;max-height:none;background:transparent;background-size:100% 100%}.fancybox-controls--canzoomOut .fancybox-placeholder{cursor:zoom-out}.fancybox-controls--canzoomIn .fancybox-placeholder{cursor:zoom-in}.fancybox-controls--canGrab .fancybox-placeholder{cursor:-webkit-grab;cursor:grab}.fancybox-controls--isGrabbing .fancybox-placeholder{cursor:-webkit-grabbing;cursor:grabbing}.fancybox-spaceball{z-index:1}.fancybox-tmp{position:absolute;top:-9999px;left:-9999px;visibility:hidden}.fancybox-error{position:absolute;margin:0;padding:40px;top:50%;left:50%;width:380px;max-width:100%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background:#fff;cursor:default}.fancybox-error p{margin:0;padding:0;color:#444;font:16px/20px Helvetica Neue,Helvetica,Arial,sans-serif}.fancybox-close-small{position:absolute;top:0;right:0;width:44px;height:44px;padding:0;margin:0;border:0;border-radius:0;outline:none;background:transparent;z-index:10;cursor:pointer}.fancybox-close-small:after{content:"×";position:absolute;top:5px;right:5px;width:30px;height:30px;font:20px/30px Arial,Helvetica Neue,Helvetica,sans-serif;color:#888;font-weight:300;text-align:center;border-radius:50%;border-width:0;background:#fff;transition:background .2s;box-sizing:border-box;z-index:2}.fancybox-close-small:focus:after{outline:1px dotted #888}.fancybox-slide--video .fancybox-close-small{top:-36px;right:-36px;background:transparent}.fancybox-close-small:hover:after{color:#555;background:#eee}.fancybox-caption-wrap{position:absolute;bottom:0;left:0;right:0;padding:60px 30px 0;z-index:99998;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.1) 20%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.6) 80%,rgba(0,0,0,.8));opacity:0;transition:opacity .2s;pointer-events:none}.fancybox-show-caption .fancybox-caption-wrap{opacity:1}.fancybox-caption{padding:30px 0;border-top:1px solid hsla(0,0%,100%,.4);font-size:14px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:#fff;line-height:20px;-webkit-text-size-adjust:none}.fancybox-caption a,.fancybox-caption button{pointer-events:all}.fancybox-caption a{color:#fff;text-decoration:underline}.fancybox-button{display:inline-block;position:relative;width:44px;height:44px;line-height:44px;margin:0;padding:0;border:0;border-radius:0;cursor:pointer;background:transparent;color:#fff;box-sizing:border-box;vertical-align:top;outline:none}.fancybox-button--disabled{cursor:default;pointer-events:none}.fancybox-button,.fancybox-infobar__body{background:rgba(30,30,30,.6)}.fancybox-button:hover{background:rgba(0,0,0,.8)}.fancybox-button:after,.fancybox-button:before{content:"";pointer-events:none;position:absolute;border-color:#fff;background-color:currentColor;color:currentColor;opacity:.9;box-sizing:border-box;display:inline-block}.fancybox-button--disabled:after,.fancybox-button--disabled:before{opacity:.5}.fancybox-button--left:after{left:20px;-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.fancybox-button--left:after,.fancybox-button--right:after{top:18px;width:6px;height:6px;background:transparent;border-top:2px solid currentColor;border-right:2px solid currentColor}.fancybox-button--right:after{right:20px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.fancybox-button--left{border-bottom-left-radius:5px}.fancybox-button--right{border-bottom-right-radius:5px}.fancybox-button--close{float:right}.fancybox-button--close:after,.fancybox-button--close:before{content:"";display:inline-block;position:absolute;height:2px;width:16px;top:calc(50% - 1px);left:calc(50% - 8px)}.fancybox-button--close:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.fancybox-button--close:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.fancybox-loading{border:6px solid hsla(0,0%,39%,.4);border-top:6px solid hsla(0,0%,100%,.6);border-radius:100%;height:50px;width:50px;-webkit-animation:a .8s infinite linear;animation:a .8s infinite linear;background:transparent;position:absolute;top:50%;left:50%;margin-top:-25px;margin-left:-25px;z-index:99999}@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@media (max-width:800px){.fancybox-controls{text-align:left}.fancybox-button--left,.fancybox-button--right,.fancybox-buttons button:not(.fancybox-button--close){display:none!important}.fancybox-caption{padding:20px 0;margin:0}}.fancybox-button--fullscreen:before{width:15px;height:11px;left:15px;top:16px;border:2px solid;background:none}.fancybox-button--play:before{top:16px;left:18px;width:0;height:0;border-top:6px inset transparent;border-bottom:6px inset transparent;border-left:10px solid;border-radius:1px;background:transparent}.fancybox-button--pause:before{top:16px;left:18px;width:7px;height:11px;border-style:solid;border-width:0 2px;background:transparent}.fancybox-button--thumbs span{font-size:23px}.fancybox-button--thumbs:before{top:20px;left:21px;width:3px;height:3px;box-shadow:0 -4px 0,-4px -4px 0,4px -4px 0,inset 0 0 0 32px,-4px 0 0,4px 0 0,0 4px 0,-4px 4px 0,4px 4px 0}.fancybox-container--thumbs .fancybox-caption-wrap,.fancybox-container--thumbs .fancybox-controls,.fancybox-container--thumbs .fancybox-slider-wrap{right:220px}.fancybox-thumbs{position:absolute;top:0;right:0;bottom:0;left:auto;width:220px;margin:0;padding:5px 5px 0 0;background:#fff;z-index:99993;word-break:normal;-webkit-overflow-scrolling:touch;-webkit-tap-highlight-color:transparent;box-sizing:border-box}.fancybox-thumbs>ul{list-style:none;position:absolute;position:relative;width:100%;height:100%;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;font-size:0}.fancybox-thumbs>ul>li{float:left;overflow:hidden;max-width:50%;padding:0;margin:0;width:105px;height:75px;position:relative;cursor:pointer;outline:none;border:5px solid #fff;border-top-width:0;border-right-width:0;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box}li.fancybox-thumbs-loading{background:rgba(0,0,0,.1)}.fancybox-thumbs>ul>li>img{position:absolute;top:0;left:0;min-width:100%;min-height:100%;max-width:none;max-height:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-thumbs>ul>li:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:2px;border:4px solid #4ea7f9;z-index:99991;opacity:0;transition:all .2s cubic-bezier(.25,.46,.45,.94)}.fancybox-thumbs>ul>li.fancybox-thumbs-active:before{opacity:1}@media (max-width:800px){.fancybox-thumbs{display:none!important}.fancybox-container--thumbs .fancybox-caption-wrap,.fancybox-container--thumbs .fancybox-controls,.fancybox-container--thumbs .fancybox-slider-wrap{right:0}}@charset "UTF-8"; .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes bounce { 0%, 20%, 53%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } 40%, 43% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); } } @keyframes bounce { 0%, 20%, 53%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } 40%, 43% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes pulse { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes rubberBand { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } @keyframes shake { 0%, 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } 100% { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } @keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } 100% { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes tada { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } 100% { -webkit-transform: none; transform: none; } } @keyframes wobble { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } 100% { -webkit-transform: none; transform: none; } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes bounceInDown { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } 100% { -webkit-transform: none; transform: none; } } @keyframes bounceInDown { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } 100% { -webkit-transform: none; transform: none; } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes bounceInUp { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 100% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } } @keyframes bounceOut { 20% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 100% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes fadeOutDown { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes fadeOutDownBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes fadeOutLeft { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes fadeOutRight { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes fadeOutRightBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes fadeOutUp { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes fadeOutUpBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95, .95, .95); transform: perspective(400px) scale3d(.95, .95, .95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95, .95, .95); transform: perspective(400px) scale3d(.95, .95, .95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-animation-duration: .75s; animation-duration: .75s; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } 100% { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } 100% { -webkit-transform: none; transform: none; opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { 0% { opacity: 1; } 100% { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { opacity: 1; } 100% { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } 100% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateIn { 0% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } 100% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } 100% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } @keyframes rotateOut { 0% { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } 100% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } 100% { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } 100% { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes rollIn { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } @keyframes rollOut { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } @keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { 0% { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 100% { opacity: 0; } } @keyframes zoomOut { 0% { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 100% { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } @-webkit-keyframes slideInDown { 0% { -webkit-transform: translateY(-100%); transform: translateY(-100%); visibility: visible; } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInDown { 0% { -webkit-transform: translateY(-100%); transform: translateY(-100%); visibility: visible; } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { -webkit-transform: translateX(-100%); transform: translateX(-100%); visibility: visible; } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInLeft { 0% { -webkit-transform: translateX(-100%); transform: translateX(-100%); visibility: visible; } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { -webkit-transform: translateX(100%); transform: translateX(100%); visibility: visible; } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInRight { 0% { -webkit-transform: translateX(100%); transform: translateX(100%); visibility: visible; } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideInUp { 0% { -webkit-transform: translateY(100%); transform: translateY(100%); visibility: visible; } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInUp { 0% { -webkit-transform: translateY(100%); transform: translateY(100%); visibility: visible; } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { visibility: hidden; -webkit-transform: translateY(100%); transform: translateY(100%); } } @keyframes slideOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { visibility: hidden; -webkit-transform: translateY(100%); transform: translateY(100%); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { visibility: hidden; -webkit-transform: translateX(-100%); transform: translateX(-100%); } } @keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { visibility: hidden; -webkit-transform: translateX(-100%); transform: translateX(-100%); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { visibility: hidden; -webkit-transform: translateX(100%); transform: translateX(100%); } } @keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { visibility: hidden; -webkit-transform: translateX(100%); transform: translateX(100%); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { visibility: hidden; -webkit-transform: translateY(-100%); transform: translateY(-100%); } } @keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { visibility: hidden; -webkit-transform: translateY(-100%); transform: translateY(-100%); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } @-webkit-keyframes moveFromLeft { from { -webkit-transform: translateX(-100%); } to { -webkit-transform: translateX(0%); } } @-moz-keyframes moveFromLeft { from { -moz-transform: translateX(-100%); } to { -moz-transform: translateX(0%); } } @-ms-keyframes moveFromLeft { from { -ms-transform: translateX(-100%); } to { -ms-transform: translateX(0%); } } @-webkit-keyframes moveFromRight { from { -webkit-transform: translateX(100%); } to { -webkit-transform: translateX(0%); } } @-moz-keyframes moveFromRight { from { -moz-transform: translateX(100%); } to { -moz-transform: translateX(0%); } } @-ms-keyframes moveFromRight { from { -ms-transform: translateX(100%); } to { -ms-transform: translateX(0%); } } @-webkit-keyframes moveFromBottom { from { -webkit-transform: translateY(100%); } to { -webkit-transform: translateY(0%); } } @-moz-keyframes moveFromBottom { from { -moz-transform: translateY(100%); } to { -moz-transform: translateY(0%); } } @-ms-keyframes moveFromBottom { from { -ms-transform: translateY(100%); } to { -ms-transform: translateY(0%); } }.zzBoxes, .zzBoxes * { -moz-box-sizing: content-box; box-sizing: content-box; margin: 0; padding: 0; } .zzBoxes_overlay { background: none no-repeat center center #111111; position: fixed; z-index: 999999; width: 100%; height: 100%; left: 0; top: 0; opacity: 0.8; } .zzBoxes_inner { background-color: #ffffff; color: #454545; position: fixed; z-index: 999999; font-size: 1.2em; font-weight: 300; line-height: 1.6em; text-align: justify; max-width: 500px; min-width: 200px; top: 50%; left: 50%; margin-left: -150px; margin-top: -100px; -webkit-transition: margin .3s; transition: margin .3s; } .zzBoxes.alert .zzBoxes_title { color: #ffaa05; } .zzBoxes.confirm .zzBoxes_title { color: #ffaa05; } .zzBoxes.prompt .zzBoxes_inner { max-width: 400px !important; } .zzBoxes.prompt .zzBoxes_title { color: #ffaa05; } .zzBoxes_title { font-size: 1.4em; line-height: 1.5em; } .zzBoxes_content { padding: 20px 15px; margin: 0; } .zzBoxes_mess { overflow: auto; white-space: pre-line; } .zzBoxes_content img { max-width: 100%; } .zzBoxes_input { padding: 7px; margin: 10px 0 0; width: 100%; border: 1px solid #dddddd; -webkit-transition: all .3s; transition: all .3s; -moz-box-sizing: border-box; box-sizing: border-box; } .zzBoxes_input:focus { border-color: #3da749; box-shadow: 0 0 3px 1px #3da749; outline: 0 none; } .zzBoxes_button { background-color: #f4f4f4; text-align: right; position: absolute; left: 0; bottom: 0; right: 0; } .zzBoxes_button > div { background-color: #666666; color: #ffffff; display: inline-block; min-width: 80px; margin: 10px 0 10px 10px; font-weight: 400; padding: 7px 15px; line-height: 1em; text-align: center; text-transform: uppercase; -webkit-transition: background .3s; transition: background .3s; } .zzBoxes_button > div:first-child { margin-left: 0; } div.zzBoxes_cancel { background-color: #eb0900; } .zzBoxes_close { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJZJREFUeNpi/P//PwMpgAlKywHxMSD2wKImCogPA7EEmAeyAYhP/oeAb0DsARUD4XAg/gOV2wV2DVTCA6oYWVMIkuLPQGyDrAGbJgzF6BrQNWEoBmEmNA/yADEbEp8ZKoYAODwIMvknlP0TOSBgiqOwuNkDTZM3soZjONzsjaRpC7IGCSDei+5BJE0gxUIgPiOpSQMgwAB/QVTYXhJ/ggAAAABJRU5ErkJggg==) no-repeat center center #eb0900; position: absolute; width: 30px; height: 20px; right: 2px; top: 2px; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s; transition: all .3s; } .zzBoxes_inner:hover .zzBoxes_close { opacity: 1; } .zzBoxes_button > div:hover, .zzBoxes_close:hover { background-color: #666666; cursor: pointer; } #_loading{ display: block; position: fixed; z-index: 9999999; } .windows8 { position: relative; width: 80px; height:80px; } .windows8 .wBall { position: absolute; width: 76px; height: 76px; opacity: 0; -moz-transform: rotate(225deg); -moz-animation: orbit 4.95s infinite; -webkit-transform: rotate(225deg); -webkit-animation: orbit 4.95s infinite; -ms-transform: rotate(225deg); -ms-animation: orbit 4.95s infinite; -o-transform: rotate(225deg); -o-animation: orbit 4.95s infinite; transform: rotate(225deg); animation: orbit 4.95s infinite; } .windows8 .wBall .wInnerBall{ background-color: #f7941e; position: absolute; width: 10px; height: 10px; left: 0; top: 0; -moz-border-radius: 10px; -webkit-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; } .windows8 #wBall_1 { -moz-animation-delay: 1.08s; -webkit-animation-delay: 1.08s; -ms-animation-delay: 1.08s; -o-animation-delay: 1.08s; animation-delay: 1.08s; } .windows8 #wBall_2 { -moz-animation-delay: 0.22s; -webkit-animation-delay: 0.22s; -ms-animation-delay: 0.22s; -o-animation-delay: 0.22s; animation-delay: 0.22s; } .windows8 #wBall_3 { -moz-animation-delay: 0.43s; -webkit-animation-delay: 0.43s; -ms-animation-delay: 0.43s; -o-animation-delay: 0.43s; animation-delay: 0.43s; } .windows8 #wBall_4 { -moz-animation-delay: 0.65s; -webkit-animation-delay: 0.65s; -ms-animation-delay: 0.65s; -o-animation-delay: 0.65s; animation-delay: 0.65s; } .windows8 #wBall_5 { -moz-animation-delay: 0.86s; -webkit-animation-delay: 0.86s; -ms-animation-delay: 0.86s; -o-animation-delay: 0.86s; animation-delay: 0.86s; } @-moz-keyframes orbit { 0% { opacity: 1; z-index:99; -moz-transform: rotate(180deg); -moz-animation-timing-function: ease-out; } 7% { opacity: 1; -moz-transform: rotate(300deg); -moz-animation-timing-function: linear; -moz-origin:0%; } 30% { opacity: 1; -moz-transform:rotate(410deg); -moz-animation-timing-function: ease-in-out; -moz-origin:7%; } 39% { opacity: 1; -moz-transform: rotate(645deg); -moz-animation-timing-function: linear; -moz-origin:30%; } 70% { opacity: 1; -moz-transform: rotate(770deg); -moz-animation-timing-function: ease-out; -moz-origin:39%; } 75% { opacity: 1; -moz-transform: rotate(900deg); -moz-animation-timing-function: ease-out; -moz-origin:70%; } 76% { opacity: 0; -moz-transform:rotate(900deg); } 100% { opacity: 0; -moz-transform: rotate(900deg); } } @-webkit-keyframes orbit { 0% { opacity: 1; z-index:99; -webkit-transform: rotate(180deg); -webkit-animation-timing-function: ease-out; } 7% { opacity: 1; -webkit-transform: rotate(300deg); -webkit-animation-timing-function: linear; -webkit-origin:0%; } 30% { opacity: 1; -webkit-transform:rotate(410deg); -webkit-animation-timing-function: ease-in-out; -webkit-origin:7%; } 39% { opacity: 1; -webkit-transform: rotate(645deg); -webkit-animation-timing-function: linear; -webkit-origin:30%; } 70% { opacity: 1; -webkit-transform: rotate(770deg); -webkit-animation-timing-function: ease-out; -webkit-origin:39%; } 75% { opacity: 1; -webkit-transform: rotate(900deg); -webkit-animation-timing-function: ease-out; -webkit-origin:70%; } 76% { opacity: 0; -webkit-transform:rotate(900deg); } 100% { opacity: 0; -webkit-transform: rotate(900deg); } } @-ms-keyframes orbit { 0% { opacity: 1; z-index:99; -ms-transform: rotate(180deg); -ms-animation-timing-function: ease-out; } 7% { opacity: 1; -ms-transform: rotate(300deg); -ms-animation-timing-function: linear; -ms-origin:0%; } 30% { opacity: 1; -ms-transform:rotate(410deg); -ms-animation-timing-function: ease-in-out; -ms-origin:7%; } 39% { opacity: 1; -ms-transform: rotate(645deg); -ms-animation-timing-function: linear; -ms-origin:30%; } 70% { opacity: 1; -ms-transform: rotate(770deg); -ms-animation-timing-function: ease-out; -ms-origin:39%; } 75% { opacity: 1; -ms-transform: rotate(900deg); -ms-animation-timing-function: ease-out; -ms-origin:70%; } 76% { opacity: 0; -ms-transform:rotate(900deg); } 100% { opacity: 0; -ms-transform: rotate(900deg); } } @-o-keyframes orbit { 0% { opacity: 1; z-index:99; -o-transform: rotate(180deg); -o-animation-timing-function: ease-out; } 7% { opacity: 1; -o-transform: rotate(300deg); -o-animation-timing-function: linear; -o-origin:0%; } 30% { opacity: 1; -o-transform:rotate(410deg); -o-animation-timing-function: ease-in-out; -o-origin:7%; } 39% { opacity: 1; -o-transform: rotate(645deg); -o-animation-timing-function: linear; -o-origin:30%; } 70% { opacity: 1; -o-transform: rotate(770deg); -o-animation-timing-function: ease-out; -o-origin:39%; } 75% { opacity: 1; -o-transform: rotate(900deg); -o-animation-timing-function: ease-out; -o-origin:70%; } 76% { opacity: 0; -o-transform:rotate(900deg); } 100% { opacity: 0; -o-transform: rotate(900deg); } } @keyframes orbit { 0% { opacity: 1; z-index:99; transform: rotate(180deg); animation-timing-function: ease-out; } 7% { opacity: 1; transform: rotate(300deg); animation-timing-function: linear; origin:0%; } 30% { opacity: 1; transform:rotate(410deg); animation-timing-function: ease-in-out; origin:7%; } 39% { opacity: 1; transform: rotate(645deg); animation-timing-function: linear; origin:30%; } 70% { opacity: 1; transform: rotate(770deg); animation-timing-function: ease-out; origin:39%; } 75% { opacity: 1; transform: rotate(900deg); animation-timing-function: ease-out; origin:70%; } 76% { opacity: 0; transform:rotate(900deg); } 100% { opacity: 0; transform: rotate(900deg); } } @-webkit-keyframes shakeit { 0% { -webkit-transform: rotate(0deg) translate(2px, 1px); } 10% { -webkit-transform: rotate(1deg) translate(1px, 2px); } 20% { -webkit-transform: rotate(-1deg) translate(3px, 0px) ; } 30% { -webkit-transform: rotate(0deg) translate(0px, -2px); } 40% { -webkit-transform: rotate(-1deg) translate(-1px, 1px); } 50% { -webkit-transform: rotate(1deg) translate(1px, -2px); } 60% { -webkit-transform: rotate(0deg) translate(3px, -1px); } 70% { -webkit-transform: rotate(1deg) translate(-2px, -1px); } 80% { -webkit-transform: rotate(-1deg) translate(1px, 1px); } 90% { -webkit-transform: rotate(0deg) translate(-2px, -2px); } 100% { -webkit-transform: rotate(1deg) translate(-1px, 2px); } } @keyframes shakeit { 0% { transform: rotate(0deg) translate(2px, 1px); } 10% { transform: rotate(1deg) translate(1px, 2px); } 20% { transform: rotate(-1deg) translate(3px, 0px) ; } 30% { transform: rotate(0deg) translate(0px, -2px); } 40% { transform: rotate(-1deg) translate(-1px, 1px); } 50% { transform: rotate(1deg) translate(1px, -2px); } 60% { transform: rotate(0deg) translate(3px, -1px); } 70% { transform: rotate(1deg) translate(-2px, -1px); } 80% { transform: rotate(-1deg) translate(1px, 1px); } 90% { transform: rotate(0deg) translate(-2px, -2px); } 100% { transform: rotate(1deg) translate(-1px, 2px); } }@font-face { font-family: 'Segoe UI'; src: url('/fonts/SVN-Segoe UI.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Segoe UI Bold'; src: url('/fonts/SVN-Segoe UI Bold.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamBlackItalic.woff2') format('woff2'), url('/fonts/SVN-GothamBlackItalic.woff') format('woff'); font-weight: 900; font-style: italic; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamItalic.woff2') format('woff2'), url('/fonts/SVN-GothamItalic.woff') format('woff'); font-weight: 500; font-style: italic; font-display: swap; } @font-face { font-family: 'SVN-Gotham Book'; src: url('/fonts/SVN-GothamBook.woff2') format('woff2'), url('/fonts/SVN-GothamBook.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamBlack.woff2') format('woff2'), url('/fonts/SVN-GothamBlack.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamBold.woff2') format('woff2'), url('/fonts/SVN-GothamBold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamLight.woff2') format('woff2'), url('/fonts/SVN-GothamLight.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham Book'; src: url('/fonts/SVN-GothamBookItalic.woff2') format('woff2'), url('/fonts/SVN-GothamBookItalic.woff') format('woff'); font-weight: normal; font-style: italic; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamBold.woff2') format('woff2'), url('/fonts/SVN-GothamBold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamLightItalic.woff2') format('woff2'), url('/fonts/SVN-GothamLightItalic.woff') format('woff'); font-weight: 300; font-style: italic; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamBoldItalic.woff2') format('woff2'), url('/fonts/SVN-GothamBoldItalic.woff') format('woff'); font-weight: bold; font-style: italic; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamThinItalic.woff2') format('woff2'), url('/fonts/SVN-GothamThinItalic.woff') format('woff'); font-weight: 100; font-style: italic; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamLight.woff2') format('woff2'), url('/fonts/SVN-GothamLight.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham XLight'; src: url('/fonts/SVN-GothamXLight.woff2') format('woff2'), url('/fonts/SVN-GothamXLight.woff') format('woff'); font-weight: 200; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham XLight'; src: url('/fonts/SVN-GothamXLightItalic.woff2') format('woff2'), url('/fonts/SVN-GothamXLightItalic.woff') format('woff'); font-weight: 200; font-style: italic; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-Gotham.woff2') format('woff2'), url('/fonts/SVN-Gotham.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham Ultra'; src: url('/fonts/SVN-GothamUltraItalic.woff2') format('woff2'), url('/fonts/SVN-GothamUltraItalic.woff') format('woff'); font-weight: 900; font-style: italic; font-display: swap; } @font-face { font-family: 'SVN-Gotham Ultra'; src: url('/fonts/SVN-GothamUltra.woff2') format('woff2'), url('/fonts/SVN-GothamUltra.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'SVN-Gotham'; src: url('/fonts/SVN-GothamThin.woff2') format('woff2'), url('/fonts/SVN-GothamThin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; } .lefthdtren { width: 30%; float: left; } .righthdtren { width: 70%; float: right; text-align: right; margin-top: 15px; } .righthdtren > .dt, .righthdtren > .lang { margin-top: 7px; } .logo { display: inline-block; padding: 10px 0; } .textlogo { display: inline-block; } .textlogo h3 { font-size: 18px; color: #CC9933; text-transform: uppercase; letter-spacing: 2px; } .textlogo p { color: #A8528A; font-size: 13px; text-transform: capitalize; letter-spacing: 2px; } .dt { display: inline-block; } .lang { display: inline-block; margin-left: 20px; } .lang a { margin-left: 20px; } a.phone.icon_hd span { font-size: 20px; font-weight: 600; } a.phone.icon_hd span:hover { color: #f04f37; } a.phone.icon_hd img { margin-top: -12px; width: 25px; margin-right: 10px; background-size: contain; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid transparent; -webkit-animation: alo-circle-img-anim 1s infinite ease-in-out; -moz-animation: alo-circle-img-anim 1s infinite ease-in-out; -ms-animation: alo-circle-img-anim 1s infinite ease-in-out; -o-animation: alo-circle-img-anim 1s infinite ease-in-out; animation: alo-circle-img-anim 1s infinite ease-in-out; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; } .dt:hover img { background-size: contain; border: 2px solid transparent; -webkit-animation: alo-circle-img-anim 1s infinite ease-in-out; -moz-animation: alo-circle-img-anim 1s infinite ease-in-out; -ms-animation: alo-circle-img-anim 1s infinite ease-in-out; -o-animation: alo-circle-img-anim 1s infinite ease-in-out; animation: alo-circle-img-anim 1s infinite ease-in-out; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; } @-moz-keyframes alo-circle-anim { 0% { transform: rotate(0) scale(.5) skew(1deg); opacity: .1 } 30% { transform: rotate(0) scale(.7) skew(1deg); opacity: .5 } 100% { transform: rotate(0) scale(1) skew(1deg); opacity: .1 } } @-webkit-keyframes alo-circle-anim { 0% { transform: rotate(0) scale(.5) skew(1deg); opacity: .1 } 30% { transform: rotate(0) scale(.7) skew(1deg); opacity: .5 } 100% { transform: rotate(0) scale(1) skew(1deg); opacity: .1 } } @-o-keyframes alo-circle-anim { 0% { transform: rotate(0) scale(.5) skew(1deg); opacity: .1 } 30% { transform: rotate(0) scale(.7) skew(1deg); opacity: .5 } 100% { transform: rotate(0) scale(1) skew(1deg); opacity: .1 } } @keyframes alo-circle-anim { 0% { transform: rotate(0) scale(.5) skew(1deg); opacity: .1 } 30% { transform: rotate(0) scale(.7) skew(1deg); opacity: .5 } 100% { transform: rotate(0) scale(1) skew(1deg); opacity: .1 } } @-moz-keyframes alo-circle-fill-anim { 0% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } 50% { transform: rotate(0) scale(1) skew(1deg); opacity: .2 } 100% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } } @-webkit-keyframes alo-circle-fill-anim { 0% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } 50% { transform: rotate(0) scale(1) skew(1deg); opacity: .2 } 100% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } } @-o-keyframes alo-circle-fill-anim { 0% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } 50% { transform: rotate(0) scale(1) skew(1deg); opacity: .2 } 100% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } } @keyframes alo-circle-fill-anim { 0% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } 50% { transform: rotate(0) scale(1) skew(1deg); opacity: .2 } 100% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } } @-moz-keyframes alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) } 10% { transform: rotate(-25deg) scale(1) skew(1deg) } 20% { transform: rotate(25deg) scale(1) skew(1deg) } 30% { transform: rotate(-25deg) scale(1) skew(1deg) } 40% { transform: rotate(25deg) scale(1) skew(1deg) } 50% { transform: rotate(0) scale(1) skew(1deg) } 100% { transform: rotate(0) scale(1) skew(1deg) } } @-webkit-keyframes alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) } 10% { transform: rotate(-25deg) scale(1) skew(1deg) } 20% { transform: rotate(25deg) scale(1) skew(1deg) } 30% { transform: rotate(-25deg) scale(1) skew(1deg) } 40% { transform: rotate(25deg) scale(1) skew(1deg) } 50% { transform: rotate(0) scale(1) skew(1deg) } 100% { transform: rotate(0) scale(1) skew(1deg) } } @-o-keyframes alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) } 10% { transform: rotate(-25deg) scale(1) skew(1deg) } 20% { transform: rotate(25deg) scale(1) skew(1deg) } 30% { transform: rotate(-25deg) scale(1) skew(1deg) } 40% { transform: rotate(25deg) scale(1) skew(1deg) } 50% { transform: rotate(0) scale(1) skew(1deg) } 100% { transform: rotate(0) scale(1) skew(1deg) } } @keyframes alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) } 10% { transform: rotate(-25deg) scale(1) skew(1deg) } 20% { transform: rotate(25deg) scale(1) skew(1deg) } 30% { transform: rotate(-25deg) scale(1) skew(1deg) } 40% { transform: rotate(25deg) scale(1) skew(1deg) } 50% { transform: rotate(0) scale(1) skew(1deg) } 100% { transform: rotate(0) scale(1) skew(1deg) } } .hd_a { background: #3e4195; position: relative; } .lang img { margin-top: -5px; } .navigation.container { padding-left: 15px; margin-left: 0; padding-right: 15px; margin-right: 0; } .navigation ul { width: 100%; } .navbar .navigation > ul > li:last-child:after, .navbar .navigation > ul > li:first-child:after{ content: normal; } input#search { background: #ffffff00; color: #ffffff7d; text-align: right; padding-right: 20px; width: 80%; text-transform: uppercase; } button#smsearch { background: #f0f8ff00; } .fixed .navigation > ul > li.box_search { display: none; } .left_sl { width: 50%; float: left; } .slide-hd { background: #FFFFFF; } .text_sll { float: right; width: 50%; padding-left: 50px; padding-top: 20px; } .text_sl h3 { margin-top: 0; font-size: 28px; color: #032E54; text-transform: capitalize; font-family: 'Segoe UI Bold'; min-height: 60px; } .text_sl p { margin-bottom: 30px; line-height: 1.5; margin-top: 20px; height: 135px; } a.sl_link { font-style: normal; font-weight: normal; font-size: 16px; line-height: 21px; color: #032E54; font-family: 'SVN-Gotham'; display: inline-flex; grid-gap: 10px; } a.sl_link:hover{ font-weight: 600; } div#slide-slide .owl-dots { margin-top: 30px; } .swiper-container { width: 100%; height: 100%; } .swiper-slide { text-align: center; font-size: 18px; } .page1 span.swiper-pagination-bullet.swiper-pagination-bullet-active { outline: none; color: #BB8211; } .page1 .swiper-pagination-bullet { width: 20px; height: 20px; text-align: center; line-height: 20px; font-size: 14px; color:#000; opacity: 1; background: rgba(0, 0, 0, 0); position: relative; outline: none; } .page1 .swiper-container-horizontal>.swiper-pagination-bullets,.page1 .swiper-pagination-custom, .swiper-pagination-fraction { position: relative; margin-top: 30px; width: 100%; } .page1 .swiper-pagination-bullet:after { width: 1px; height: 50%; content: ""; position: absolute; background: #00000075; top: 6px; left: -6px; } .page1 .swiper-pagination-bullet:first-child:after{ content: none; } span.swiper-pagination-bullet { margin-right: 10px; } .hinhp1 { width: 50%; float: left; } .textp1 { float: right; width: 50%; } .textp1 h4 a { font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 24px; line-height: 33px; color: #032E54; min-height: 99px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; margin-bottom: 40px; padding-right: 5px; } .textp1 p { font-size: 14px; } .textp1 { text-align: left; } .textp1 h4 { margin-top: 0px; } .textp1 a { font-size: 14px; color: #032E54; text-transform: capitalize; } .textp1 a img { margin-left: 10px; } .page1{ padding-top: 50px; padding-bottom: 50px; } .page2 { background: rgba(60, 132, 194, 0.1); padding-top: 30px; padding-bottom: 50px; } .page3{ padding-top: 30px; padding-bottom: 50px; } .tieudep2 h4 { color: #012269; font-size: 26px; text-align: center; margin-bottom: 35px; font-family: 'Segoe UI Bold'; text-transform: uppercase; } .textdap2 h4 a { font-family: 'Segoe UI Bold'; font-size: 16px; color: #012269; } .textdap2 a { color: #000000; text-transform: capitalize; } .textdap2 a img { margin-left: 10px; } .col_da h4 { margin-top: 20px; } .page3 { padding-bottom: 40px; padding-top: 50px; } .leftp3 { line-height: 25px; width: 50%; float: left; font-size: 16px; font-weight: 600; } .rightp3 { margin-top: 10px; width: 50%; float: right; text-align: right; } .rightp3 a { background: #BB8211; padding: 10px 40px 10px 40px; border-radius: 10px; color: white; margin-left: 20px; } ul.list-inline.headlienhe li { width: 44%; } .headlienhe li:hover img, .headface li:hover img { -webkit-animation: rotateIn 0.5s ease-in; -moz-animation: rotateIn 0.5s ease-in; -o-animation: rotateIn 0.5s ease-in; -ms-animation: rotateIn 0.5s ease-in; animation: rotateIn 0.5s ease-in; cursor: pointer; } .headlienhe li a span { margin-left: 2%; color: #ffffff; font-size: 14px; } .iconchiase img { width: 22.44px; color: #ffffff; } .ftlogo { width: 20%; float: left; } .ftlogo img { width: 67px; } .ndungft { } .ndungfooder{ width: 100%; } .gioithieu h4{ margin-left: 2% ; float: left; font: var(--unnamed-font-style-normal) normal 600 18px/24px var(--unnamed-font-family-segoe-ui); color: var(--unnamed-color-bb8211); text-align: left; font: normal normal 600 18px/24px Segoe UI; letter-spacing: 0px; color: #BB8211; opacity: 1; } .sanpham h4{ margin-left: 11%; float: left; font: var(--unnamed-font-style-normal) normal 600 18px/24px var(--unnamed-font-family-segoe-ui); color: var(--unnamed-color-bb8211); text-align: left; font: normal normal 600 18px/24px Segoe UI; letter-spacing: 0px; color: #BB8211; opacity: 1; } .morong h4{ margin-right: 4%; font: var(--unnamed-font-style-normal) normal 600 18px/24px var(--unnamed-font-family-segoe-ui); color: var(--unnamed-color-bb8211); text-align: left; font: normal normal 600 18px/24px Segoe UI; letter-spacing: 0px; color: #BB8211; opacity: 1; float: right; } .thongtin-fooder{ max-width: 100%; background: #3e4195; } .img-fooder{ position: absolute; opacity: 0.05; } .ft { width: 18%; float: right; } a.text_lienhe { color: #ffffff; display: flex; margin-top: 16px; text-transform: capitalize; } .thongtinh h4 { margin-bottom: 20px; font: var(--unnamed-font-style-normal) normal 600 18px/24px var(--unnamed-font-family-segoe-ui); color: var(--unnamed-color-bb8211); text-align: left; font: normal normal 600 18px/24px Segoe UI; letter-spacing: 0px; color: #BB8211; text-transform: uppercase; opacity: 1; } .thongtinh p { font-size: 15px; margin-top: 25px; color: #FFFFFF; } .thongtinh p span { font-weight: 600; color: #FFFFFF; } h4.title_ft { margin-bottom: 20px; text-transform: capitalize; } .gachnga { } .noidungf{ width: 100%; background: #3e4195; position: relative; } .logo-fooderright{ padding-right: 0px; float: right; } .logo-fooderright img{ width: 102px; } .logo-fooderright1{ float: right; margin-right: 40px; } .logo-fooderright1 img{ width: 150px; } .left_sl img, .col_da a img, .img_tt img, .img_vanhoakm img { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .leftp1gt { text-align: justify; width: 100%; float: left; padding-right: 0px; margin-top: 20px; } .rightp1gt { width: 60%; float: right; position: relative; } .rightp1gt:before { content: ""; position: absolute; width: 350px; height: 85%; background: #F5F5F5; top: 75px; z-index: -2; left: 220px; } .rightp1gt:after { content: ""; position: absolute; width: 108px; height: 108px; background: #084173; top: 195px; z-index: -1; left: 342px; } .rightp1gt:after { content: ""; position: absolute; width: 98px; height: 98px; background: #084173; top: 205px; z-index: -1; left: 342px; } .leftp1gt h4 { font-size: 20px; line-height: 25px; margin-bottom: 30px; } .leftimg { width: 50%; float: left; } .rightimg { width: 50%; float: right; padding-left: 10px; margin-top: 314px; } .p1gt { padding-bottom: 50px; padding-top: 50px; } .img1 { width: 80%; float: right; margin-top: 10px; position: relative; } .img1:before{ content: ""; width: 62px; height: 62px; position: absolute; bottom: -70px; right: 0; background: #084173; z-index: -1; } .p2gt { background: #F5F5F5; padding-bottom: 50px; padding-top: 50px; } .leftp2gt { width: 50%; float: left; } .rightp2gt { line-height: 1.5; width: 50%; float: right; padding-left: 95px; padding-top: 0px; } .navbar{ margin-bottom: 0 !important; padding: 0; } .bannerchung{ position: relative; } .bgbanner{ z-index: 2; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(3, 46, 84, 0.42), rgba(3, 46, 84, 0.42)), url(caover_auto_x2.jpg); opacity: 1; } .tieudechung { color: #FFFFFF; text-align: center; } .tieudechung h1 { z-index: 2; font-size: 28px; letter-spacing: 3px; position: relative; text-transform: uppercase; padding-bottom: 85px; padding-top: 85px; margin-top: 0; } .tieudechung h1 span { position: relative; } /*.bannerchung:after { content: ""; width: 100%; height: 100%; top: 0; left: 0; background-image: url(/images/bg.png); position: absolute; z-index: 1; background-size: 1366px 200px; }*/ .congtrinh-duan { padding-top: 30px; padding-bottom: 15px; } .congtrinh-duanchuan { padding-top: 30px; margin-bottom: 20px; position: relative; } .col_ctda { margin-bottom: 60px; } p.namevh_listff a { font-family: Segoe UI; font-style: normal; font-weight: bold; font-size: 22px; line-height: 29px; color: #032E54; height: 58px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } p.namevh_listff { margin-top: 15px; } .content_km a { font-family: SVN-Gotham; font-style: normal; font-weight: normal; font-size: 14px; line-height: 18px; color: #000000; } .content_km a img { margin-left: 10px; } .page-navigation1 { text-align: center; } .pagination>.active>a { background: #3e4195!important; color: #FFFFFF!important; border-color: transparent !important; line-height: 24px !important; top: 2px; padding: 4px; } ul.pagination > li > a{ background: #B5B2B2 !important; border: 1px solid #ddd0 !important; border-radius: 0!important; position: relative; color: black !important; } ul.pagination > li{ position: relative; } ul.pagination > li > a:hover{ background: #B5B2B2 !important; color: #FFFFFF!important; } ul.pagination>li:first-child:after{ content: normal; } .item_spham_con.le{ width: 50%; float: left; } .item_spham_con.chan{ width: 50%; float: right; } .imgsphamcon { width: 50%; float: left; } .cten_sphamcon { width: 50%; float: right; padding-left: 30px; padding-top: 10px; } .fluid_gioithieu { padding-top: 50px; } p.name_spcon a { font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 24px; line-height: 33px; color: #032E54; min-height: 99px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; margin-bottom: 20px; } .imgsphamcon img{ width: 100%; height: 166px; object-fit: cover; border-radius: 5px; } .xemtiep a { color: #032E54; } .xemtiep a:hover{ color: #222222; } .xemtiep a img { margin-left: 10px; } .item_spham_con { padding: 15px; } .backg_sp{ background: rgba(60, 132, 194, 0.1); border-radius: 5px; padding: 11px; float: left; width: 100%; } .breadcrumb { padding-left: 0 !important; border-bottom: none !important; } .menu_dusp .container { padding: 0; } .menusp{ background-color: #F5F5F5; } .breadcrumb a { color: #000000; } .breadcrumb a:last-child { color: #3e4195; } .trensp { background:rgba(60, 132, 194, 0.1); padding-top: 20px; padding-bottom: 50px; } .top_sp { width: 50%; float: left; padding-right: 110px; } .right_sp { text-align: center; width: 48%; float: right; background: white; margin-left: 20px; } .right_listpro1 h1 { font-family: 'Segoe UI Bold'; color: #012269; font-size: 34px; text-transform: capitalize; line-height: 45px; } span.notehinh { margin-left: 20px; } .right_listpro1 h3 a { font-size: 14px; font-weight: 400; color: white; padding: 15px 55px; background: #3e4195; border-radius: 12px; } .right_listpro1 p { line-height: 30px; margin-bottom: 30px; } .thongtinsp { text-align: justify; width: 50%; float: left; padding-right: 20px; } .huongdansd { text-align: justify; width: 50%; float: right; padding-left: 20px; } .thongtinsp h4, .huongdansd h4 { font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 20px; line-height: 27px; text-transform: capitalize; color: #032E54; margin-top: 29px; } .detail_sp { padding-bottom: 50px; } p.spcungloai { text-align: center; font-style: normal; font-weight: bold; font-size: 30px; line-height: 40px; text-transform: uppercase; color: #084173; } .other_sp { background: rgba(60, 132, 194, 0.1); padding-top: 30px; padding-bottom: 50px; } .caccauhoi { border-bottom: 1px solid #70707047; } .so1 { cursor: pointer; font-size: 18px; color: #012269; font-family: 'Segoe UI Bold'; padding: 30px 20px 20px 30px; position: relative; } .so1 img { float: right; width: 16px; height: 16px; } .so1 h4 { width: 90%; float: left; text-align: justify; margin-top: 0; text-transform: capitalize; line-height: 25px; font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 24px; line-height: 33px; color: #032E54; } div#show1 { border-top: none; } .hidean { padding-left: 30px; padding-bottom: 30px; padding-right: 30px; text-align: justify; } p#show1 { border-top: none; } .fluid_tintuc { padding-top: 50px; } .text_tt h2 a { font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 20px; line-height: 27px; color: #084173; } .text_tt h2 { line-height: 20px; height: 75px; } .col_tt { margin-bottom: 40px; } .comment.tt_r p { font-family: SVN-Gotham; font-style: normal; font-weight: normal; font-size: 13px; line-height: 17px; color: rgba(0, 0, 0, 0.81); min-height: 68px; -webkit-line-clamp: 4; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } .comment.tt_r a { color: #032E54; font-size: 14px; } .comment.tt_r a img{ margin-left: 10px; } .breadcrumb.cttintuc { background-color: white; } .detail_duan h1{ font-size: 28px; margin-top: 0; color: #012269; text-transform: capitalize; margin-bottom: 20px; } .detail_duan h2{ font-size: 28px; margin-top: 0; color: #012269; text-transform: capitalize; margin-bottom: 20px; } .other_da h3 { color: #012269; text-align: center; margin-bottom: 30px; } .ttkhac { background: #F5F5F5; padding-top: 20px; } .detail_duan { width: 70%; padding-bottom: 50px; } .thmetd{ width: 40%; float: left; } .cttuyendung{ width: 60%; float: right; } nav.nav-sidebar.page6r{ width: 40%; float: left; padding-right: 50px; } .tab-content.one.p6r { width: 60%; float: right; } ul.nav.tabs.p6a1 li a { color: #0A0A0A; font-size: 13px; font-weight: 100; padding: 10px 10px; } ul.nav.tabs.p6a1 li{ display: inline-block; width: 100%; } ul.nav.tabs.p6a1 { flex-direction: column; } .nametd { font-family: 'Segoe UI Bold'; color: #012269; font-size: 18px; font-weight: 700; } .slt { color: #000000; font-size: 16px; font-weight: 600; margin-bottom: 10px; margin-top: 10px; } .hnhs { font-size: 14px; color: #5E5E5E; font-weight: 400 !important; } .boctd { float: left; width: 90%; } .addtd { margin-top: 30px; } ul.nav.tabs.p6a1 li { display: inline-block; width: 100%; border-bottom: 1px solid #70707047; border-right: 1px solid #70707047; } ul.nav.tabs.p6a1 li.active { border-right: none; } ul.nav.tabs.p6a1 li.active img{ transform: rotate(-45deg); } .nav>li>a:focus, .nav>li>a:hover { background-color: #eee0 !important; } .formlienhe { float: left; width: 100%; } div#map { width: 100%; float: right; overflow: hidden; margin-top: 50px; } .input_contactlh { float: left; margin: 2% 2% 2% 0; color: #004E6E; width: 48%; } input#full_name, input#add, input#email, input#tel { width: 100%; padding: 4%; color: #4D4D51; border-radius: 5px; background: rgba(60, 132, 194, 0.05); border: 1px solid #dfdfdf; } .input_contactlh.tex { color: #4D4D51; width: 98%; } textarea#content { padding: 2%; color: #4D4D51; width: 100%; border-radius: 5px; background: rgba(60, 132, 194, 0.05); border: 1px solid #dfdfdf; } input#_send_contact { margin-left: 0px; font-size: 15px; width: 98%; background-color: #3e4195; border-radius: 10px; padding: 10px 30px; color: white; margin-top: 15px; } .formlienhe p { font-family: SVN-Gotham; font-style: normal; font-weight: 300; font-size: 24px; line-height: 31px; color: #4B4B4B; } .formlienhe h3 { font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 28px; line-height: 38px; text-transform: uppercase; color: #084173; margin-bottom: 28px; } .tr_map { padding-top: 50px; } .left_imgpro { width: 56%; float: left; } .detail_ctduan { width: 40%; float: right; } #slider1_container{ position: relative; top: 0px; left: 0px; width: 620px !important; height: 360px; background: transparent; overflow: hidden; margin-left: 0px; } .sty{ position: absolute; left: 0px; top: 0px;width: 480px; height: 360px; overflow: hidden; } .jssort02 .w img { border-radius: 12px; } .detail_ctduan h2 { color: #012269; font-size: 28px; font-family: 'Segoe UI Bold'; } .content_ctda p { line-height: 1.5; text-align: justify; } .content_ctda { margin-top: 20px; } .chiased { margin-top: 25px; } .ndctda { padding-bottom: 50px; } .other_ctda { background: rgba(60, 132, 194, 0.1); padding-top: 20px; padding-bottom: 20px; } .list_other_new h3 { text-align: center; font-family: Segoe UI; font-style: normal; font-weight: bold; font-size: 30px; line-height: 40px; text-transform: uppercase; color: #084173; margin-bottom: 40px; } p.tit_namebl { text-align: center; font-size: 24px; text-transform: capitalize; color: #012269; font-weight: 600; margin-bottom: 20px; } .facts.sp p { text-align: justify; } .button_container.active { right: 0; } .button_container { position: absolute; top: 32%; right: 15px; height: 27px; width: 35px; cursor: pointer; z-index: 100; -webkit-transition: opacity .25s ease; transition: opacity .25s ease; } .button_container.active .top { -webkit-transform: translateY(11px) translateX(0) rotate(45deg); transform: translateY(11px) translateX(0) rotate(45deg); background: white; } .button_container.active .middle { opacity: 0; background: white; } .button_container.active .bottom { -webkit-transform: translateY(-11px) translateX(0) rotate(-45deg); transform: translateY(-11px) translateX(0) rotate(-45deg); background: white; } .button_container span { background: #3e4195; border: none; height: 5px; width: 100%; position: absolute; top: 0; left: 0; -webkit-transition: all .35s ease; transition: all .35s ease; cursor: pointer; } .button_container span:nth-of-type(2) { top: 11px; } .button_container span:nth-of-type(3) { top: 22px; } .overlay { position: fixed; background:#3e4195;; top: 0; left: 0; width: 100%; height: 0%; opacity: 0; visibility: hidden; -webkit-transition: opacity .35s, visibility .35s, height .35s; transition: opacity .35s, visibility .35s, height .35s; overflow: hidden; } .overlay.open { opacity: 1; visibility: visible; height: 100%; } .overlay.open li { -webkit-animation: fadeInRight .5s ease forwards; animation: fadeInRight .5s ease forwards; /*-webkit-animation-delay: .35s;*/ /*animation-delay: .35s;*/ padding-bottom: 30px; } /*.overlay.open li:nth-of-type(2) {*/ /* -webkit-animation-delay: .4s;*/ /* animation-delay: .4s;*/ /*}*/ /*.overlay.open li:nth-of-type(3) {*/ /* -webkit-animation-delay: .45s;*/ /* animation-delay: .45s;*/ /*}*/ /*.overlay.open li:nth-of-type(4) {*/ /* -webkit-animation-delay: .50s;*/ /* animation-delay: .50s;*/ /*}*/ .menu_nho{ display: none; } .overlay ul li a { display: block; position: relative; color: #FFFFFF; text-decoration: none; overflow: hidden; text-transform: uppercase; } nav.overlay-menu { margin-top: 25%; text-align: right; padding-right: 3%; } li.lang_mb a { float: right; padding-left: 20px; } .bocsp.moblie_sp { display: none; } .tdmobile{ display: none; } .ndungft.mobileft{ display: none; } .breadcrumb .container { padding-left: 0; } .rightp3 a:hover, input#_send_contact:hover{ background: #f04f37;; color: #222222; font-weight: 600; } .col_da:hover, .col_ctda:hover, .col_tt:hover{ -webkit-transform: translateY(-5px); -ms-transform: translateY(-5px); transform: translateY(-5px); } .item_spham_con .backg_sp:hover{ -moz-box-shadow: inset 0 0 7px #0000003d; -webkit-box-shadow: inset 0 0 7px #0000003d; box-shadow: inset 0 0 7px #0000003d; /*border: 1px solid #0000003d !important;*/ -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .ndp1:hover{ -moz-box-shadow: inset 0 0 7px #0000003d; -webkit-box-shadow: inset 0 0 7px #0000003d; box-shadow: inset 0 0 7px #0000003d; /*border: 1px solid #0000003d !important;*/ -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .ndp1 { padding-bottom: 11px; padding-top: 11px; background: rgba(60, 132, 194, 0.1); border-radius: 5px; } .ft.hogiadinh { padding-left: 56px; color: white; } .content_da { text-align: justify; } .box_search { top: 21px; position: absolute; right: 110px; z-index: 2; } .sanpham_name_h h1{ font-style: normal; font-weight: bold; font-size: 30px; line-height: 1.5; text-transform: uppercase; color: #084173; text-align: center; margin-top: 30px; margin-bottom: 0; } .left_sl img{ width: 100%; height: 302px; object-fit: cover; } .bao_gia { position: absolute; bottom: 12px; right: 0; } .bao_gia a{ background: #3e4195; border-radius: 8px; color: #FFFFFF; padding: 10px 18px; font-family: 'SVN-Gotham'; } .bao_gia a:hover{ color: #FFFFFF; background: #032E54; } .ndp1 .textp1{ padding-left: 24px; } .page1 .ndp1 .hinhp1 img{ height: 166px; width: 100%; object-fit: cover; border-radius: 5px; } .page1 .ndp1 .hinhp1{ padding-left: 11px; } .img_ttt { width: 40%; float: left; } .text_ttcten { width: 60%; float: right; padding-left: 20px; } .text_ttcten h2 a { font-family: Segoe UI; font-style: normal; font-weight: bold; font-size: 17px; line-height: 24px; color: #032E54; min-height: 21px; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } .text_ttcten h2{ margin-top: 0; } .clear_new{ margin-bottom: 15px; } .img_ttt img{ border-radius: 10px; height: 135px; } .ndtrenft { width: 60%; float: left; margin-top: 30px; } .right_ndtrenft { width: 40%; float: left; margin-top: 30px; } .left_footer { position: relative; } .ndungft { align-self: center; } .thongtinh h3 { font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 18px; line-height: 35px; color: #FFFFFF; } .congty_footer1{ font-family: SVN-Gotham; font-style: normal; font-weight: normal; font-size: 16px; line-height: 23px; color: #FFFFFF; } .logo-fooder { margin-left: -25px; width: 150px; } .ndtrenft .thongtinh{ margin-top: -20px; } .thongtinh p a:hover, .thongtinh p a:focus{ color: #ffffff; } .d_muc_category { width: 50%; float: left; } .duan_sanpham { width: 50%; float: left; } p.danh_muc{ font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 16px; line-height: 25px; text-transform: uppercase; color: #FFFFFF; } .d_muc_category ul{ padding: 0; margin: 0; } .d_muc_category ul li{ display: block; } .d_muc_category ul li a{ font-family: SVN-Gotham; font-style: normal; font-weight: 300; font-size: 15px; line-height: 25px; color: #FFFFFF; } .d_muc_category ul li.active a{ font-style: normal; font-weight: bold; } .duan_sanpham ul{ padding: 0; margin: 0; } .duan_sanpham ul li{ display: block; margin-bottom: 10px; } .duan_sanpham ul li a{ font-family: SVN-Gotham; font-style: normal; font-weight: 300; font-size: 13px; line-height: 20px; color: #FFFFFF; } .duan_sanpham ul li.active a{ font-style: normal; font-weight: bold; } .duan_sanpham ul li a:hover, .d_muc_category ul li a:hover{ font-style: normal; font-weight: bold; } .congtrinh-duanchuan.duan_p:after{ content: ""; position: absolute; width: 100%; height: 45%; background: rgba(60, 132, 194, 0.15); bottom: 13.5%; z-index: -1; left: 0; } /*.orthe_proend p.name_spcon a{ font-size: 20px; }*/ .orthe_proend .imgsphamcon img{ /*height: 191px;*/ } .orthe_proend .imgsphamcon{ width: 50%; } .orthe_proend .cten_sphamcon{ width: 50%; } .fluid_gioithieu.sp { margin-bottom: 38px; } .congtrinh-duan.ct{ margin-bottom: 48px; } .list_new .comment.tt_r p{ font-family: Segoe UI; font-style: normal; font-weight: 300; font-size: 13px; line-height: 21px; color: #000000; height: 85px; } .name_tt a{ font-family: SVN-Gotham; font-style: normal; font-weight: bold; font-size: 20px; line-height: 27px; color: #084173; min-height: 85px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } .name_tt { float: left; } .text_tt .time { margin-top: 20px; } .list_new .comment.tt_r { float: left; } .fluid_tintuc{ position: relative; } .fluid_tintuc.news:after{ content: ""; position: absolute; width: 100%; height: 45%; background: rgba(60, 132, 194, 0.15); bottom: 8.5%; z-index: -1; left: 0; } .input_lienhe { width: 60%; float: right; padding-left: 30px; } .left_lienhe{ float: left; width: 40%; padding-right: 20px; } .thongtin_lh p{ font-family: SVN-Gotham; font-style: normal; font-weight: 450; font-size: 18px; line-height: 24px; color: #4B4B4B; } .thongtin_lh img{ margin-right: 10px; } div#map p{ margin-bottom: -5px; } .alo-ph-img-circle { width: 30px; height: 30px; top: 35px; left: 35px; position: absolute; background: rgba(30, 30, 30, 0.1) url(https://1.bp.blogspot.com/-UbTOXZnLovo/V9kU1RLbX4I/AAAAAAAAGYA/4qQQ0CBifcM8IlNe7f-aVL2Ln-wzLcF4wCLcB/s1600/alo.png) no-repeat center center; background-size: contain; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid transparent; opacity: .7; -webkit-animation: alo-circle-img-anim 1s infinite ease-in-out; -moz-animation: alo-circle-img-anim 1s infinite ease-in-out; -ms-animation: alo-circle-img-anim 1s infinite ease-in-out; -o-animation: alo-circle-img-anim 1s infinite ease-in-out; animation: alo-circle-img-anim 1s infinite ease-in-out; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50% } .alo-phone { position: fixed; visibility: hidden; background-color: transparent; width: 100px; height: 100px; cursor: pointer; z-index: 9999999; -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0); -webkit-transition: visibility .5s; -moz-transition: visibility .5s; -o-transition: visibility .5s; transition: visibility .5s; left: 0; bottom: 0px; } .alo-phone.alo-show { visibility: visible } .alo-phone:hover { opacity: 1; } .alo-ph-circle { width: 100px; height: 100px; top: 0; left: 0; position: absolute; background-color: transparent; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid rgba(30, 30, 30, 0.4); border: 2px solid #012269; opacity: .1; -webkit-animation: alo-circle-anim 1.2s infinite ease-in-out; -moz-animation: alo-circle-anim 1.2s infinite ease-in-out; -ms-animation: alo-circle-anim 1.2s infinite ease-in-out; -o-animation: alo-circle-anim 1.2s infinite ease-in-out; animation: alo-circle-anim 1.2s infinite ease-in-out; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50% } .alo-phone:hover .alo-ph-circle, .hotline> a:hover .alo-ph-circle { border-color:#012269; opacity: .5 } .alo-phone.alo-green:hover .alo-ph-circle, .hotline>a:hover .alo-ph-circle { border-color: #012269; opacity: .5; } .alo-phone.alo-green .alo-ph-circle { border-color: #012269; opacity: .5 } .alo-ph-circle-fill { width: 60px; height: 60px; top: 20px; left: 20px; position: absolute; background-color: #000; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid transparent; opacity: .1; -webkit-animation: alo-circle-fill-anim 2.3s infinite ease-in-out; -moz-animation: alo-circle-fill-anim 2.3s infinite ease-in-out; -ms-animation: alo-circle-fill-anim 2.3s infinite ease-in-out; -o-animation: alo-circle-fill-anim 2.3s infinite ease-in-out; animation: alo-circle-fill-anim 2.3s infinite ease-in-out; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50% } .alo-phone:hover .alo-ph-circle-fill, .hotline> a:hover .alo-ph-circle-fill { background-color: #012269; opacity: .75 !important } .alo-phone.alo-green:hover .alo-ph-circle-fill, .hotline>a:hover .alo-ph-circle-fill { background-color: #012269; opacity: .75 !important; } .alo-phone.alo-green .alo-ph-circle-fill { background-color: #012269; opacity: .75 !important } .alo-phone:hover .alo-ph-img-circle, .hotline> a:hover .alo-ph-img-circle { background-color: #012269; } .alo-phone.alo-green.alo-hover .alo-ph-img-circle, .alo-phone.alo-green:hover .alo-ph-img-circle, .hotline>a:hover .alo-ph-img-circle { background-color: #012269; } .alo-phone.alo-green .alo-ph-img-circle { background-color: #012269; } @-moz-keyframes alo-circle-anim { 0% { transform: rotate(0) scale(.5) skew(1deg); opacity: .1 } 30% { transform: rotate(0) scale(.7) skew(1deg); opacity: .5 } 100% { transform: rotate(0) scale(1) skew(1deg); opacity: .1 } } @-webkit-keyframes alo-circle-anim { 0% { transform: rotate(0) scale(.5) skew(1deg); opacity: .1 } 30% { transform: rotate(0) scale(.7) skew(1deg); opacity: .5 } 100% { transform: rotate(0) scale(1) skew(1deg); opacity: .1 } } @-o-keyframes alo-circle-anim { 0% { transform: rotate(0) scale(.5) skew(1deg); opacity: .1 } 30% { transform: rotate(0) scale(.7) skew(1deg); opacity: .5 } 100% { transform: rotate(0) scale(1) skew(1deg); opacity: .1 } } @keyframes alo-circle-anim { 0% { transform: rotate(0) scale(.5) skew(1deg); opacity: .1 } 30% { transform: rotate(0) scale(.7) skew(1deg); opacity: .5 } 100% { transform: rotate(0) scale(1) skew(1deg); opacity: .1 } } @-moz-keyframes alo-circle-fill-anim { 0% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } 50% { transform: rotate(0) scale(1) skew(1deg); opacity: .2 } 100% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } } @-webkit-keyframes alo-circle-fill-anim { 0% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } 50% { transform: rotate(0) scale(1) skew(1deg); opacity: .2 } 100% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } } @-o-keyframes alo-circle-fill-anim { 0% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } 50% { transform: rotate(0) scale(1) skew(1deg); opacity: .2 } 100% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } } @keyframes alo-circle-fill-anim { 0% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } 50% { transform: rotate(0) scale(1) skew(1deg); opacity: .2 } 100% { transform: rotate(0) scale(.7) skew(1deg); opacity: .2 } } @-moz-keyframes alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) } 10% { transform: rotate(-25deg) scale(1) skew(1deg) } 20% { transform: rotate(25deg) scale(1) skew(1deg) } 30% { transform: rotate(-25deg) scale(1) skew(1deg) } 40% { transform: rotate(25deg) scale(1) skew(1deg) } 50% { transform: rotate(0) scale(1) skew(1deg) } 100% { transform: rotate(0) scale(1) skew(1deg) } } @-webkit-keyframes alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) } 10% { transform: rotate(-25deg) scale(1) skew(1deg) } 20% { transform: rotate(25deg) scale(1) skew(1deg) } 30% { transform: rotate(-25deg) scale(1) skew(1deg) } 40% { transform: rotate(25deg) scale(1) skew(1deg) } 50% { transform: rotate(0) scale(1) skew(1deg) } 100% { transform: rotate(0) scale(1) skew(1deg) } } @-o-keyframes alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) } 10% { transform: rotate(-25deg) scale(1) skew(1deg) } 20% { transform: rotate(25deg) scale(1) skew(1deg) } 30% { transform: rotate(-25deg) scale(1) skew(1deg) } 40% { transform: rotate(25deg) scale(1) skew(1deg) } 50% { transform: rotate(0) scale(1) skew(1deg) } 100% { transform: rotate(0) scale(1) skew(1deg) } } @keyframes alo-circle-img-anim { 0% { transform: rotate(0) scale(1) skew(1deg) } 10% { transform: rotate(-25deg) scale(1) skew(1deg) } 20% { transform: rotate(25deg) scale(1) skew(1deg) } 30% { transform: rotate(-25deg) scale(1) skew(1deg) } 40% { transform: rotate(25deg) scale(1) skew(1deg) } 50% { transform: rotate(0) scale(1) skew(1deg) } 100% { transform: rotate(0) scale(1) skew(1deg) } } #alo-fixed { visibility: visible; opacity: 0; position: fixed; right: -100px; top: 100px } #alo-fixed.show { right: 10px; visibility: visible; opacity: 1 } .right_sp img{ width: 100%; } .p_tt_add{ display: flex; } .span_tt_add{ margin-left: 10px; } button:focus{ outline: none!important; } .blog_list{ margin-bottom: 30px; } .comment.tt_r.tt { float: left; } button#smsearch img { margin-top: -7px; } p.danh_muc.sp { margin-top: 20px; } .right_listpro1 h3 a:hover{ color: #FFFFFF; background: #032E54; } .backg_sp.tt { background: transparent; } ._name_head { position: absolute; top: 35px; left: 120px; font-style: normal; font-weight: 700; font-size: 15px; line-height: 27px; text-transform: uppercase; color: #004683; } .sp_hot_page1 { font-weight: 400; font-size: 28px; line-height: 38px; text-transform: uppercase; color: #084173; text-align: left; width: 100%; margin-bottom: 20px; padding-bottom: 10px; white-space: nowrap; border-bottom: 1px solid #c7bdbe; } .comment_sl { text-align: justify; font-weight: 300; font-size: 16px; line-height: 26px; letter-spacing: 0.02em; color: #000000; } .detai_view a{ padding: 5px 44px; font-weight: 400; font-size: 12px; line-height: 26px; letter-spacing: 0.02em; color: #3e4195; } .detai_view { width: 100%; text-align: right; padding-right: 1%; } .swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: auto!important; left: 110px!important; bottom: -10px!important; top: auto!important; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next { bottom: -10px!important; top: auto!important; left: 20px!important; } img.sp_nbat { height: 238px; object-fit: cover; border-radius: 8px; width: 100%; } .textppage1 h4 a{ color: #032E54; font-weight: 400; font-size: 20px; line-height: 27px; color: #032E54; } .textppage1 a{ color: #4B4B4B; font-weight: 300; font-size: 14px; line-height: 18px; } .textppage1 a img{ margin-top: -6px; margin-left: 7px; } .ndppage1:hover{ border-color: #084173; } .page1 { background: url(/images/banner_sp.png) center top no-repeat; background-size: cover; padding-left: 10%; } .swiper.mySwiper_1 { overflow: hidden; } .mySwiper_1 .swiper-slide a img{ transition: 0.1s; transform: scale3d(0.9, 0.9, 1); } .mySwiper_1 .swiper-slide.swiper-slide-next a img{ -webkit-transform: scale3d(1.2, 1.2, 1); transform: scale3d(1.2, 1.2, 1); } .mySwiper_1 .swiper-slide { padding-top: 48px; } .mySwiper_1 .swiper-button-prev:after, .mySwiper_1 .swiper-container-rtl .swiper-button-next:after{ content: url(/images/left_da.svg); } .mySwiper_1 .swiper-button-next:after, .mySwiper_1 .swiper-container-rtl .swiper-button-prev:after { content: url(/images/right_da.svg); } .mySwiper_1 .swiper-button-prev, .mySwiper_1 .swiper-container-rtl .swiper-button-next{ bottom: 45%!important; top: auto!important; left: 5%!important; } .mySwiper_1 .swiper-button-next, .mySwiper_1 .swiper-container-rtl .swiper-button-prev { right: 5%!important; left: auto!important; bottom: 45%!important; top: auto!important; } .swiper-slide .textdap2 h4 a{ font-weight: 400; font-size: 18px; line-height: 24px; text-align: center; text-transform: uppercase; color: #232323; font-family: 'Segoe UI'; } .swiper-slide.swiper-slide-next .textdap2{ padding-top: 30px; } .swiper-slide.swiper-slide-next .textdap2 h4 a{ color: #084173; } .list_new .tieudep2 h4{ text-align: left; } p.bb-post-tm{ grid-gap: 30px; display: grid; grid-template-columns: 45% 45%; margin-bottom: 0; } .bb-post-tm label.time{ color: #C4C4C4; font-style: normal; font-weight: 400; font-size: 12px; line-height: 16px; } /*.left_slider img{ height: calc(100vh - 166px); object-fit: cover; }*/ .textppage1 h4{ min-height: 54px; } .ndppage1{ border-bottom: 5px solid transparent; margin-bottom: 30px; padding-bottom: 15px; } .slide-hd .owl-dots{ display: none; } .zalo-tt { float: right; } .zalo_backtotop img { width: 60px; margin-top: -15px; margin-left: -1px; } .zalo_backtotop { position: fixed; z-index: 9999; left: 25px; bottom: 110px; width: 50px; height: 50px; line-height: 55px; font-size: 16px; font-weight: 400; text-align: center; display: inline-block; color: #fff; border-radius: 50%; background: #4bb3f9; text-decoration: none; transition: opacity 0.2s ease-out; opacity: 1; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; animation: play 1.5s ease infinite; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; }@keyframes play{0%{transform:rotate(0deg) scale(1) skew(1deg)}10%{transform:rotate(-25deg) scale(1) skew(1deg)}20%{transform:rotate(25deg) scale(1) skew(1deg);box-shadow:0 0 0 5px #FC6,0 0 0 10px #F5EFC0}30%{transform:rotate(-25deg) scale(1) skew(1deg)}40%{transform:rotate(25deg) scale(1) skew(1deg)}100%{transform:rotate(0deg) scale(1) skew(1deg)}} .sp_hot_page1.mobi { display: block; display: flex; } .lh_deck_top_m{ display: none; } .p2gt .about_1{ float: left; width: 50%; padding: 20px; } .rightp_2gt { font-weight: 300; } .rightp_2gtt { font-size: 22px; text-transform: uppercase; margin-bottom: 20px; } .p2gt .about_1:nth-child(2n+3){ clear: both; } .rightp_2gtt p{ color: #012269; font-weight: 700; } .list_gt{ position: relative; } .list_gt:before { position: absolute; content: ''; left: 20%; bottom: -369px; width: 60%; height: 1px; background: #d7d7d7; transform: rotate(90deg); } .sp_hot_{ position: relative; } .sp_hot_:after { position: absolute; bottom: -11px; left: 0; width: 150px; background: #e64400; content: ""; height: 2px; } .page1 .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after .tv-hinhanh .swiper-button-prev:after{ content: url(/images/left_h.svg); } .page1 .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after, .tv-hinhanh .swiper-button-next:after { content: url(/images/right_h.svg); } .page1 .swiper-button-next, .page1 .swiper-container-rtl .swiper-button-prev, .tv-hinhanh .swiper-button-prev { right: 30px!important; left: auto!important; bottom: 50%!important; top: auto!important; } .page1 .swiper-button-prev, .page1 .swiper-container-rtl .swiper-button-next, .tv-hinhanh .swiper-button-next { bottom: 50%!important; top: auto!important; left: 20px!important; } .name-h-anh { margin: 40px 0; text-align: center; } .name-h-anh > h1 { font-size: 28px; line-height: 38px; text-transform: uppercase; color: #084173; width: 100%; margin-bottom: 20px; padding-bottom: 10px; white-space: nowrap; border-bottom: 1px solid #c7bdbe; text-align: center; position: relative; } .name-h-anh > h1:after{ content: " "; border-bottom: 2px solid #f04f37; width: 150px; position: absolute; left: 0; right: 0; bottom: -1px; } .hinhanh { margin: 50px 0; } .swiper-slide-hinhanh{ background: #F1F2ED; border-radius: 8px; } .swiper-slide-hinhanh img{ height: 212px; object-fit: cover; border-radius: 8px 8px 0px 0px; } .swiper-slide-hinhanh .name-lib h3{ padding: 12px 12px 20px; margin: 0; text-align: center; } .swiper-slide-hinhanh .name-lib h3 a{ font-style: normal; font-weight: bold; font-size: 17px; line-height: 22px; text-align: center; color: #032E54; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: inline-block; max-width: 100%; } .hinh-anh-l .lv_sp_next{ cursor: pointer; position: absolute; background: #FFFFFF url(/images/right-tc.svg) no-repeat center center; width: 41px; height: 41px; right: -6px; top: 55%; z-index: 9; border-radius: 50%; border: 1px solid rgba(0, 0, 0, 0.3); box-sizing: border-box; background-size: 50%; } .hinh-anh-l .lv_sp_back{ cursor: pointer; position: absolute; background: #FFFFFF url(/images/right-tc.svg) no-repeat center center; width: 41px; height: 41px; left: -6px; top: 55%; z-index: 9; border-radius: 50%; border: 1px solid rgba(0, 0, 0, 0.3); box-sizing: border-box; background-size: 50%; } .hinhanh .name { font-size: 28px; line-height: 38px; text-transform: uppercase; color: #084173; width: 100%; margin-bottom: 25px; padding-bottom: 10px; white-space: nowrap; border-bottom: 1px solid #c7bdbe; text-align: left; position: relative; } .hinhanh .name:after { content: " "; border-bottom: 2px solid #f04f37; width: 150px; position: absolute; left: 0; bottom: -1px; } .page-about { margin: 30px 0; } .page-about .ab-img { float: left; width: calc(50% - 30px); margin-right: 30px; } .page-about .ab-txt { float: left; width: 50%; font-size: 16px; font-weight: 300; line-height: 27px; } .page-about .ab-title { font-size: 28px; line-height: 38px; text-transform: uppercase; color: #084173; width: 100%; margin-bottom: 20px; padding-bottom: 10px; white-space: nowrap; border-bottom: 1px solid #c7bdbe; text-align: center; position: relative; } .page-about .ab-title::after { content: " "; border-bottom: 2px solid #f04f37; width: 150px; position: absolute; left: 0; right: 0; bottom: -1px; } .page-about .ab-more { display: inline-block; background-color: #f04f37; color: #fff; padding: 8px 30px; border-radius: 20px; margin-top: 20px; } ul.library { margin: 10px -10px 50px; padding: 0; list-style: none; } ul.library > li { float: left; width: 25%; padding: 10px; } .video-container { position: relative; padding-bottom: 54.75%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } @font-face{font-family:swiper-icons;src:url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}.swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-container-multirow>.swiper-wrapper{flex-wrap:wrap}.swiper-container-multirow-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-container-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-container-3d{perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-container-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(-1 * var(--swiper-navigation-size)/ 2);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;text-transform:none;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:10px;right:auto} .swiper-button-prev:after,.swiper-container-rtl .swiper-button-next:after{content:url("/images/left.svg")} .swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:10px;left:auto} .swiper-button-next:after,.swiper-container-rtl .swiper-button-prev:after{content:url("/images/right.svg")}.swiper-button-next.swiper-button-white,.swiper-button-prev.swiper-button-white{--swiper-navigation-color:#ffffff}.swiper-button-next.swiper-button-black,.swiper-button-prev.swiper-button-black{--swiper-navigation-color:#000000}.swiper-button-lock{display:none} .swiper-pagination{ margin-top: 15px; position: relative; text-align: center; transition: .3s opacity; transform: translate3d(0,0,0); z-index: 10; }.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white{--swiper-pagination-color:#ffffff}.swiper-pagination-black{--swiper-pagination-color:#000000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;animation:swiper-preloader-spin 1s infinite linear;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}