html {
width: 100%;
height: 100%;
}
body {
/*background: url(../img/bg-main.jpg) no-repeat top center #000;*/
/*background-size: cover;*/
/*min-width: 1000px;*/
width: 100%;
height: 100%;
font-family: "MyriadPro", Arial, sans-serif;
font-size: 14px;
overflow-x: hidden;
}
body.sc,
body.ch {
font-family: "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", Arial, sans-serif !important;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
ul, ol, dl {
margin: 0;
padding: 0;
}
li {
list-style-type: none;
}
a {
text-decoration: none;
}
a:focus, a:active, a:visited,
a img:focus, a img:active, a img:visited {
border: none;
outline: none;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
}
.header {
background-color: #011422;
padding: 0 0 10px 0;
}
.inner {
max-width: 980px;
width: 100%;
margin: 0 auto;
}
.logo-wrap {
float: left;
margin-top: 25px;
}
.stamp-wrap {
float: right;
margin: 10px 40px 0 0;
}
.content {
background: url("../img/bg-main.jpg") no-repeat top center;
background-size: cover;
width: 100%;
height: 629px;
clear: both;
display: block;
padding-top: 45px;
}
.content .inner {
max-width: 960px;
width: 100%;
}
.banner {
margin-bottom: 52px;
}
.sc .banner, .ch .banner {
margin-bottom: 90px;
}
.id .banner {
margin-bottom: 85px;
}
h1 {
margin: 0;
font-family: Aero, Arial, sans-serif;
font-size: 29px;
color: #191919;
/*font-style: italic;*/
font-weight: normal;
text-align: right;
width: 350px;
float: right;
margin-bottom: 15px;
line-height: 1;
}
.vn h1 {
line-height: 1.2;
}
.vn h1, .vn h2, .vn h3, .vn h4 {
font-family: "Myriadpro", serif;
font-weight: bold;
}
.sc h1, .ch h1 {
font-family: "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", Arial, sans-serif !important;
line-height: 1.1;
}
h1 .percent {
font-family: Aero;
font-size: 85px;
color: #ffb000;
}
h1 .middle,
h1 .bottom {
font-size: 35px;
color: #fff;
font-style: italic;
font-family: "MyriadProBold", Arial, serif;
font-weight: normal;
}
.sc .middle, .sc .bottom,
.ch .middle, .ch .bottom {
font-family: "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", Arial, sans-serif !important;
font-weight: bold;
font-size: 54px;
}
.btn {
background: #ffc200; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmYzIwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ZmYzIwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2ZmYjAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmIwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ffc200 0%, #ffc200 50%, #ffb000 51%, #ffb000 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffc200), color-stop(50%,#ffc200), color-stop(51%,#ffb000), color-stop(100%,#ffb000)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffc200 0%,#ffc200 50%,#ffb000 51%,#ffb000 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffc200 0%,#ffc200 50%,#ffb000 51%,#ffb000 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffc200 0%,#ffc200 50%,#ffb000 51%,#ffb000 100%); /* IE10+ */
background: linear-gradient(to bottom, #ffc200 0%,#ffc200 50%,#ffb000 51%,#ffb000 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc200', endColorstr='#ffb000',GradientType=0 ); /* IE6-8 */
clear: both;
display: block;
float: right;
padding: 20px 25px;
font-size: 19px;
color: #3b2314;
border: 1px solid #fff100 !important;
font-weight: bold;
-webkit-transition: all 0.2s ease-in-out 0s;
-moz-transition: all 0.2s ease-in-out 0s;
-o-transition: all 0.2s ease-in-out 0s;
-ms-transition: all 0.2s ease-in-out 0s;
transition: all 0.2s ease-in-out 0s;
}
.btn:hover {
background: #ffc200; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmYzIwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmMyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ffc200 0%, #ffc200 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffc200), color-stop(100%,#ffc200)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffc200 0%,#ffc200 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffc200 0%,#ffc200 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffc200 0%,#ffc200 100%); /* IE10+ */
background: linear-gradient(to bottom, #ffc200 0%,#ffc200 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc200', endColorstr='#ffc200',GradientType=0 ); /* IE6-8 */
-webkit-transform: scale(1.03);
-moz-transform: scale(1.03);
-o-transform: scale(1.03);
-ms-transform: scale(1.03);
transform: scale(1.03);
}
.id .btn {
padding: 20px 35px;
}
.vn .btn {
padding: 20px 60px;
}
.sc .btn, .ch .btn {
padding: 20px 50px;
}
.steps {
clear: both;
margin-bottom: 40px;
}
.th .steps {
margin-bottom: 30px;
}
.id .steps {
margin-bottom: 30px;
}
.vn .steps {
margin-bottom: 30px;
}
.kr .steps {
margin-bottom: 30px;
}
.steps a {
display: block;
float: left;
color: #fff;
}
.steps .num {
font-family: Aero, Arial, sans-serif;
display: block;
float: left;
font-size: 70px;
margin-top: -13px;
margin-right: 18px;
}
.steps a p {
margin: 0;
font-size: 13px;
}
.id .steps a p {
font-size: 14px;
}
.steps a p span {
font-family: "MyriadProBold", Arial, sans-serif;
color: #edc283;
font-size: 20px;
font-style: italic;
}
.id .steps a p span {
font-size: 24px;
}
.sc .steps a p span,
.ch .steps a p span {
font-family: "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", Arial, sans-serif !important;
font-weight: bold;
}
.step {
padding: 25px 30px;
-webkit-transition: all 0.2s ease-in-out 0s;
-moz-transition: all 0.2s ease-in-out 0s;
-o-transition: all 0.2s ease-in-out 0s;
-ms-transition: all 0.2s ease-in-out 0s;
transition: all 0.2s ease-in-out 0s;
}
.step:hover {
-webkit-transform: scale(1.03);
-moz-transform: scale(1.03);
-o-transform: scale(1.03);
-ms-transform: scale(1.03);
transform: scale(1.03);
}
.step-1 {
background-image: url("../img/bg-step-1.png");
width: 314px;
height: 102px;
}
.step-2 {
background-image: url("../img/bg-step-2.png");
width: 351px;
height: 102px;
margin-left: -28px;
padding-left: 55px;
}
.step-3 {
background-image: url("../img/bg-step-3.png");
width: 351px;
height: 102px;
margin-left: -28px;
padding-left: 55px;
}
.misc {
clear: both;
}
.getmore {
max-width: 640px;
width: 100%;
float: left;
}
h3 {
font-size: 16px;
border-bottom: 1px solid #edc283;
color: #fff;
font-weight: normal;
font-style: italic;;
padding-bottom: 4px;
margin: 0 0 10px 0;
}
.sc h3, .ch h3 {
font-weight: bold;
}
.getmore ul li {
float: left;
width: 28%;
font-size: 16px;
background: url("../img/check.png") no-repeat center left;
list-style-position: inside;
padding-left: 35px;
line-height: 2;
color: #fff;
font-family: "MyriadProCond", Arial, sans-serif
}
.id .getmore ul li {
width: 27%;
}
.en .getmore ul li {
width: 33%;
}
.sc .getmore ul li,
.ch .getmore ul li {
font-family: "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", Arial, sans-serif !important;
width: 37%;
}
.sc .getmore ul li:first-child,
.ch .getmore ul li:first-child,
.sc .getmore ul li:nth-child(4),
.ch .getmore ul li:nth-child(4) {
width: 25%;
}
.getmore ul li.mid {
width: 44%;
}
.id .getmore ul li.mid {
width: 41%;
}
.counter {
float: right;
max-width: 290px;
width: 100%;
text-align: center;
}
#digits {
margin-bottom: 15px;
}
#digits .digit:first-child {
margin-right: 15px;
}
#digits .digit:nth-child(4) {
margin-right: 15px;
}
.digit {
display: block;
width: 35px;
height: 54px;
float: left;
color: rgba(0,0,0,0);
margin-right: 3px;
}
.digit0 {
background: url("../img/digit0.png") no-repeat;
}
.digit1 {
background: url("../img/digit1.png") no-repeat;
}
.digit2 {
background: url("../img/digit2.png") no-repeat;
}
.digit3 {
background: url("../img/digit3.png") no-repeat;
}
.digit4 {
background: url("../img/digit4.png") no-repeat;
}
.digit5 {
background: url("../img/digit5.png") no-repeat;
}
.digit6 {
background: url("../img/digit6.png") no-repeat;
}
.digit7 {
background: url("../img/digit7.png") no-repeat;
}
.digit8 {
background: url("../img/digit8.png") no-repeat;
}
.digit9 {
background: url("../img/digit9.png") no-repeat;
}
h4 {
font-family: "MyriadProBold", Arial, sans-serif;
font-weight: normal;
font-size: 16px;
color: #fff;
font-style: italic;
}
.sc h4, .ch h4 {
font-family: "Microsoft Yahei", "微软雅黑", 宋体, SimSun, STXihei, "华文细黑", Arial, sans-serif !important;
font-weight: bold;
}
.footer {
background: #011422;
padding-top: 50px;
color: #d3d1b6;
font-size: 12px;
}
.footer a {
color: #d3d1b6;
}
.links {
margin-bottom: 35px;
width: 100%;
text-align: center;
}
.links a {
font-size: 12px;
text-align: center;
padding: 0 13px;
border-right: 1px solid #d3d1b6;
color: #d3d1b6;
text-transform: uppercase;
}
.links a:last-child {
border: none;
}
.links a:hover {
color: #ffe000;
}
/*
.sc .links a,
.ch .links a {
padding: 0 27px;
}
.th .links a {
padding: 0 12px;
}
.vn .links a {
padding: 0 12px;
}
.id .links a {
padding: 0 19px;
}
.kr .links a {
padding: 0 30px;
}
*/
.partners {
text-align: center;
margin-bottom: 20px;
}
.partners img {
display: block;
margin: 0 auto 20px;
}
.partners-img{
width: 100%;
max-width:995px;
}
.payments-img{
width: 100%;
max-width:772px;
}
.social {
margin-bottom: 20px;
}
.social h4 {
margin: 0 0 10px 0;
font-size: 14px;
color: #d3d1b6;
}
.about p {
color: #d3d1b6;
margin: 0 0 10px 0;
text-align: justify;
}
.about {
width: 585px;
float: left;
margin-right: 35px;
}
.en .about {
width: 610px;
}
.vn .about {
width: 592px;
}
.th .about {
width: 550px;
margin-right: 60;
}
.follow {
width: 360px;
float: left;
}
.en .follow {
width: 320px;
}
.vn .follow {
width: 300px;
}
.follow h4 {
text-align: center;
margin-bottom: 15px;
}
.follow-icons {
text-align: center;
margin-bottom: 15px;
}
.follow-icons a {
margin: 0 4px;
}
.follow-icons img:hover {
box-shadow: 0 0 3px yellow;
}
.contact-icons a {
margin: 0 10px 10px 0;
display: block;
float: left;
text-align: center;
line-height: 1;
color: #d6a876;
}
.sc .contact-icons a,
.ch .contact-icons a {
float: none;
text-align: left;
}
.contact-icons img {
vertical-align: middle;
margin: 0;
}
.phone span {
position: relative;
top: 0;
}
.copyright {
text-align: center;
color: #d3d1b6;
background-color: #010f1a;
padding: 8px 0;
margin: 0;
}
.digit0 {
-webkit-transition: all 0.2s ease-in-out 0s !important;
-moz-transition: all 0.2s ease-in-out 0s !important;
-o-transition: all 0.2s ease-in-out 0s !important;
-ms-transition: all 0.2s ease-in-out 0s !important;
transition: all 0.2s ease-in-out 0s !important;
}
/* fonts */
@font-face {
font-family: 'MyriadPro';
src: url('../fonts/MyriadPro-Regular.eot?') format('eot'),
url('../fonts/MyriadPro-Regular.otf') format('opentype'),
url('../fonts/MyriadPro-Regular.woff') format('woff'),
url('../fonts/MyriadPro-Regular.ttf') format('truetype'),
url('../fonts/MyriadPro-Regular.svg#MyriadPro-Regular') format('svg');
}
@font-face {
font-family: 'MyriadProBold';
src: url('../fonts/MyriadPro-Bold.eot?') format('eot'),
url('../fonts/MyriadPro-Bold.otf') format('opentype'),
url('../fonts/MyriadPro-Bold.woff') format('woff'),
url('../fonts/MyriadPro-Bold.ttf') format('truetype'),
url('../fonts/MyriadPro-Bold.svg#MyriadPro-Regular') format('svg');
}
@font-face {
font-family: 'MyriadProCond';
src: url('../fonts/MyriadPro-Cond.eot?') format('eot'),
url('../fonts/MyriadPro-Cond.otf') format('opentype'),
url('../fonts/MyriadPro-Cond.woff') format('woff'),
url('../fonts/MyriadPro-Cond.ttf') format('truetype'),
url('../fonts/MyriadPro-Cond.svg#MyriadPro-Regular') format('svg');
}
@font-face {
font-family: 'Aero';
src: url('../fonts/Aero.eot?#iefix') format('embedded-opentype'),
url('../fonts/Aero.woff') format('woff'),
url('../fonts/Aero.ttf') format('truetype'),
url('../fonts/Aero.svg#Aero') format('svg');
font-weight: normal;
font-style: normal;
}
/* micro clearfix*/
.cf:before,
.cf:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.cf:after {
clear: both;
}
/**
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.cf {
*zoom: 1;
}
/* ~micro clearfix*/
/****MEDIA QUERIES******/
@media only screen and (max-width:1024px), only screen and (max-device-width: 1024px) {
.banner{
margin-right: 30px;
}
.counter{
float: right;
}
.social {
margin: 0 auto;
width: 1024px;
}
}
@media only screen and (max-width:980px), only screen and (max-device-width: 980px) {
.banner{
margin-right: 30px;
}
.steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:380px;
}
.step-1{
margin-top: 10px;
}
.step-2 {
margin-top: 10px;
}
.step-3 {
margin-top: 10px;
}
.getmore{
margin:0 auto;
margin-top: 20px;
margin-bottom: 100px;
width: 960px;
float: none;
}
.counter{
margin:0 auto;
width: 960px;
float: none;
}
.links{
float: none;
margin: 0 auto;
margin-top: 200px;
margin-bottom: 20px;
width: 850px;
}
.sc .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.ch .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.vn .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.id .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.social {
float: none;
margin: 0 auto;
width: 960px;
}
.en .about {
margin-left: 20px;
width: 500px;
}
.sc .about {
margin-left: 20px;
width: 500px;
}
.ch .about {
margin-left: 20px;
width: 500px;
}
.vn .about {
margin-left: 20px;
width: 500px;
}
.id .about {
margin-left: 20px;
width: 500px;
}
.follow {
}
.copyright {
}
}
@media only screen and (max-width:870px), only screen and (max-device-width: 870px) {
.banner{
margin-right: 30px;
}
.percent{
text-shadow:2px 2px 2px #000000;
}
.middle{
text-shadow:2px 2px 2px #000000;
}
.bottom{
text-shadow:2px 2px 2px #000000;
}
.steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:380px;
}
.step-1{
margin-top: 10px;
}
.step-2 {
margin-top: 10px;
}
.step-3 {
margin-top: 10px;
}
.getmore{
margin:0 auto;
margin-top: 20px;
margin-bottom: 100px;
width: 768px;
float: none;
}
.counter{
margin:0 auto;
width: 768px;
float: none;
}
.links{
float: none;
margin: 0 auto;
margin-top: 200px;
margin-bottom: 20px;
width: 568px;
}
.sc .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.ch .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.vn .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.id .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.social {
float: none;
margin: 0 auto;
width: 700px;
}
.en .about {
margin: 0 auto;
width: 700px;
float: none;
}
.en .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.sc .about {
margin: 0 auto;
width: 700px;
float: none;
}
.sc .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.ch .about {
margin: 0 auto;
width: 700px;
float: none;
}
.ch .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.vn .about {
margin: 0 auto;
width: 700px;
float: none;
}
.vn .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.id .about {
margin: 0 auto;
width: 700px;
float: none;
}
.id .follow {
margin: 0 auto;
width: 450px;
float: none;
}
}
@media only screen and (max-width:765px), only screen and (max-device-width: 765px) {
.banner{
margin-right: 30px;
}
.percent{
text-shadow:2px 2px 2px #000000;
}
.middle{
text-shadow:2px 2px 2px #000000;
}
.bottom{
text-shadow:2px 2px 2px #000000;
}
.steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:380px;
}
.step-1{
margin-top: 10px;
}
.step-2 {
margin-top: 10px;
}
.step-3 {
margin-top: 10px;
}
.getmore{
margin:0 auto;
margin-top: 20px;
margin-bottom: 100px;
width: 768px;
float: none;
}
.counter{
margin:0 auto;
width: 768px;
float: none;
}
.links{
float: none;
margin: 0 auto;
margin-top: 200px;
margin-bottom: 20px;
width: 568px;
}
.sc .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.ch .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.vn .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.id .links{
float: none;
margin: 0 auto;
margin-top: 250px;
margin-bottom: 20px;
width: 615px;
}
.social {
float: none;
margin: 0 auto;
width: 600px;
}
.en .about {
margin: 0 auto;
width: 600px;
float: none;
}
.en .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.sc .about {
margin: 0 auto;
width: 600px;
float: none;
}
.sc .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.ch .about {
margin: 0 auto;
width: 600px;
float: none;
}
.ch .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.vn .about {
margin: 0 auto;
width: 600px;
float: none;
}
.vn .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.id .about {
margin: 0 auto;
width: 600px;
float: none;
}
.id .follow {
margin: 0 auto;
width: 450px;
float: none;
}
}
@media only screen and (max-width:640px), only screen and (max-device-width: 640px) {
.banner{
margin-right: 30px;
}
.percent{
text-shadow:2px 2px 2px #000000;
}
.middle{
text-shadow:2px 2px 2px #000000;
}
.bottom{
text-shadow:2px 2px 2px #000000;
}
.steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:380px;
}
.sc .steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:308px;
}
.ch .steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:308px;
}
.vn .steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:308px;
}
.id .steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:308px;
}
.step-1{
margin-top: 10px;
}
.step-2 {
margin-top: 10px;
}
.step-3 {
margin-top: 10px;
}
.getmore{
margin:0 auto;
margin-top: 20px;
margin-bottom: 100px;
width: 500px;
float: none;
}
.sc .getmore{
margin:0 auto;
margin-top: 20px;
margin-bottom: 100px;
width: 500px;
float: none;
margin-left: 225px;
}
.sc .getmore ul {
margin-left: -35px;
}
.sc .getmore ul li{
float: none;
text-align: left;
border: none;
}
.ch .getmore{
margin:0 auto;
margin-top: 20px;
margin-bottom: 100px;
width: 500px;
float: none;
margin-left: 225px;
}
.ch .getmore ul {
margin-left: -35px;
}
.ch .getmore ul li{
float: none;
text-align: left;
border: none;
}
.vn .getmore{
margin:0 auto;
margin-top: 20px;
margin-bottom: 100px;
width: 500px;
float: none;
margin-left: 225px;
}
.vn .getmore ul {
margin-left: -35px;
}
.vn .getmore ul li{
float: none;
text-align: left;
border: none;
}
.id .getmore{
margin:0 auto;
margin-top: 20px;
margin-bottom: 100px;
width: 500px;
float: none;
margin-left: 225px;
}
.id .getmore ul {
margin-left: -35px;
}
.id .getmore ul li{
float: none;
text-align: left;
border: none;
}
.counter{
margin:0 auto;
width: 640px;
float: none;
}
.sc .counter{
margin:0 auto;
width: 640px;
float: none;
margin-top: -75px;
}
.ch .counter{
margin:0 auto;
width: 640px;
float: none;
margin-top: -75px;
}
.vn .counter{
margin:0 auto;
width: 640px;
float: none;
margin-top: -75px;
}
.id .counter{
margin:0 auto;
width: 640px;
float: none;
margin-top: -75px;
}
.links{
float: none;
margin: 0 auto;
margin-top: 200px;
margin-bottom: 20px;
width: 468px;
}
.sc .links{
float: none;
margin: 0 auto;
margin-top: 370px;
margin-bottom: 20px;
width: 405px;
}
.ch .links{
float: none;
margin: 0 auto;
margin-top: 370px;
margin-bottom: 20px;
width: 405px;
}
.vn .links{
float: none;
margin: 0 auto;
margin-top: 370px;
margin-bottom: 20px;
width: 405px;
}
.id .links{
float: none;
margin: 0 auto;
margin-top: 370px;
margin-bottom: 20px;
width: 405px;
}
.social {
float: none;
margin: 0 auto;
width: 500px;
}
.en .about {
margin: 0 auto;
width: 500px;
float: none;
}
.en .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.sc .about {
margin: 0 auto;
width: 450px;
float: none;
}
.sc .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.ch .about {
margin: 0 auto;
width: 450px;
float: none;
}
.ch .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.vn .about {
margin: 0 auto;
width: 450px;
float: none;
}
.vn .follow {
margin: 0 auto;
width: 450px;
float: none;
}
.id .about {
margin: 0 auto;
width: 450px;
float: none;
}
.id .follow {
margin: 0 auto;
width: 450px;
float: none;
}
}
@media only screen and (max-width:500px), only screen and (max-device-width: 500px){
.banner{
margin-right: 30px;
}
.percent{
text-shadow:2px 2px 2px #000000;
}
.middle{
text-shadow:2px 2px 2px #000000;
}
.bottom{
text-shadow:2px 2px 2px #000000;
}
.steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:325px;
}
.step-1{
margin-top: 10px;
}
.step-2 {
margin-top: 10px;
}
.step-3 {
margin-top: 10px;
}
.getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 115px;
width: 500px;
}
.getmore ul li{
float: none;
text-align: center;
border: none;
}
.sc .getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 130px;
width: 550px;
}
.sc .getmore ul {
margin-left: -35px;
}
.sc .getmore ul li{
float: none;
text-align: left;
border: none;
}
.ch .getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 130px;
width: 550px;
}
.ch .getmore ul {
margin-left: -35px;
}
.ch .getmore ul li{
float: none;
text-align: left;
border: none;
}
.vn .getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 130px;
width: 550px;
}
.vn .getmore ul {
margin-left: -35px;
}
.vn .getmore ul li{
float: none;
text-align: left;
border: none;
}
.id .getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 130px;
width: 550px;
}
.id .getmore ul {
margin-left: -35px;
}
.id .getmore ul li{
float: none;
text-align: left;
border: none;
}
.counter{
width: 480px;
margin-top:-50px;
margin-left: 70px;
float: none;
}
.sc .counter{
width: 480px;
margin-top:-50px;
margin-left: 70px;
float: none;
}
.ch .counter{
width: 480px;
margin-top:-50px;
margin-left: 70px;
float: none;
}
.links{
float: none;
margin: 0 auto;
margin-top: 400px;
margin-bottom: 20px;
width: 380px;
}
.sc .links{
float: none;
margin: 0 auto;
margin-top: 400px;
margin-bottom: 20px;
width: 315px;
}
.ch .links{
float: none;
margin: 0 auto;
margin-top: 400px;
margin-bottom: 20px;
width: 315px;
}
.vn .links{
float: none;
margin: 0 auto;
margin-top: 400px;
margin-bottom: 20px;
width: 315px;
}
.id .links{
float: none;
margin: 0 auto;
margin-top: 400px;
margin-bottom: 20px;
width: 315px;
}
.links a{
border: none;
}
.social {
float: none;
margin: 0 auto;
width: 380px;
}
.en .about {
margin:0 auto;
float: none;
width: 300px;
}
.en .follow {
margin:0 auto;
width: 360px;
}
.sc .about {
margin-left:20px;
float: none;
width: 300px;
}
.sc .follow {
margin-left:20px;
float: none;
width: 300px;
}
.ch .about {
margin-left:20px;
float: none;
width: 300px;
}
.ch .follow {
margin-left:20px;
float: none;
width: 300px;
}
.vn .about {
margin-left:20px;
float: none;
width: 300px;
}
.vn .follow {
margin-left:20px;
float: none;
width: 300px;
}
.id .about {
margin-left:20px;
float: none;
width: 300px;
}
.id .follow {
margin-left:20px;
float: none;
width: 300px;
}
}
@media only screen and (max-width:400px), only screen and (max-device-width: 400px){
.banner{
margin-right: 30px;
}
.percent{
text-shadow:2px 2px 2px #000000;
}
.middle{
text-shadow:2px 2px 2px #000000;
}
.bottom{
text-shadow:2px 2px 2px #000000;
}
.steps{
float: none;
margin: 0 auto;
margin-top: -30px;
width:325px;
}
.step-1{
margin-top: 10px;
}
.step-2 {
margin-top: 10px;
}
.step-3 {
margin-top: 10px;
}
.getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 65px;
width: 500px;
}
.getmore ul li{
float: none;
text-align: center;
border: none;
}
.sc .getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 65px;
width: 550px;
}
.sc .getmore ul {
margin-left: -35px;
}
.sc .getmore ul li{
float: none;
text-align: left;
border: none;
}
.ch .getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 65px;
width: 550px;
}
.ch .getmore ul {
margin-left: -35px;
}
.ch .getmore ul li{
float: none;
text-align: left;
border: none;
}
.vn .getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 65px;
width: 550px;
}
.vn .getmore ul {
margin-left: -35px;
}
.vn .getmore ul li{
float: none;
text-align: left;
border: none;
}
.id .getmore{
margin-top: 20px;
margin-bottom: 100px;
margin-left: 65px;
width: 550px;
}
.id .getmore ul {
margin-left: -35px;
}
.id .getmore ul li{
float: none;
text-align: left;
border: none;
}
.counter{
width: 480px;
margin-top:-50px;
margin-left: 20px;
float: none;
}
.sc .counter{
width: 480px;
margin-top:-50px;
margin-left: 20px;
float: none;
}
.ch .counter{
width: 480px;
margin-top:-50px;
margin-left: 20px;
float: none;
}
.vn .counter{
width: 480px;
margin-top:-50px;
margin-left: 20px;
float: none;
}
.id .counter{
width: 480px;
margin-top:-50px;
margin-left: 20px;
float: none;
}
.links{
float: none;
margin: 0 auto;
margin-top: 400px;
margin-bottom: 20px;
width: 300px;
}
.links a{
border: none;
}
.sc .links{
float: none;
margin: 0 auto;
margin-top: 420px;
margin-bottom: 20px;
width: 315px;
}
.ch .links{
float: none;
margin: 0 auto;
margin-top: 420px;
margin-bottom: 20px;
width: 315px;
}
.vn .links{
float: none;
margin: 0 auto;
margin-top: 420px;
margin-bottom: 20px;
width: 315px;
}
.id .links{
float: none;
margin: 0 auto;
margin-top: 420px;
margin-bottom: 20px;
width: 315px;
}
.social {
float: none;
margin: 0 auto;
width: 380px;
}
.en .about {
margin-left:20px;
float: none;
width: 300px;
}
.en .follow {
margin-left:20px;
float: none;
width: 300px;
}
.sc .about {
margin-left:20px;
float: none;
width: 300px;
}
.sc .follow {
margin-left:20px;
float: none;
width: 300px;
}
.ch .about {
margin-left:20px;
float: none;
width: 300px;
}
.ch .follow {
margin-left:20px;
float: none;
width: 300px;
}
.vn .about {
margin-left:20px;
float: none;
width: 300px;
}
.vn .follow {
margin-left:20px;
float: none;
width: 300px;
}
.id .about {
margin-left:20px;
float: none;
width: 300px;
}
.id .follow {
margin-left:20px;
float: none;
width: 300px;
}
}