@charset "utf-8";
/* CSS Document */


@font-face {
    font-family: 'robotolight';
    src: url('../fonts/roboto-light-webfont.woff2') format('woff2'),
         url('../fonts/roboto-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'robotoregular';
    src: url('../fonts/roboto-regular-webfont.woff2') format('woff2'),
         url('../fonts/roboto-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}



@font-face {
    font-family: 'robotomedium';
    src: url('../fonts/roboto-medium-webfont.woff2') format('woff2'),
         url('../fonts/roboto-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
  font-family: 'HelveticaNeueLTStd-Hv';
  src: url('../fonts/HelveticaNeueLTStd-Hv.eot') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}


p{ font-size:16px; color:#404041; font-family: 'robotolight';}
h1{font-size:36px; color:#666;margin:0px 0 10px; font-family: 'robotolight'; }
h2{font-size:30px; color:#666;margin:0px 0 10px; font-family: 'robotolight'; }
h3{font-size:25px; color:#666;margin:20px 0 10px;font-family: 'robotolight'; }
h4{font-size:22px; color:#666;margin:20px 0 10px;font-family: 'robotolight'; }
h4{font-size:20px; color:#666;margin:20px 0 10px;font-family: 'robotolight'; }

.outer{ float:left; width:100%}
.header{ width:100%; float:left;background:#fff; margin-bottom:-5px;}
.logo{ float:left; width:100%; padding:39px 0px 10px;}
.logo img{ width:100%;}
.menu-top{width:100%; float:left;}
.menu-top ul{ margin:0px; padding:0px; float:right;}
.menu-top ul li{ float:left; list-style:none; padding:40px 24px;}
.menu-top ul li a{}
.menu{ width:100%; float:left;}
.nav.navbar-nav{ float:left;}
.icon{ float:left; width:100%; margin-top:28px;}
.icon ul{ padding:0px; margin:0px; }
.icon ul li{ list-style:none; display:inline-block; padding:0px 3px;}
.icon ul li a:hover{ opacity:0.7;}
.app-top{ float:left; width:100%; 
background: rgba(229,40,94,1);
background: -moz-linear-gradient(45deg, rgba(229,40,94,1) 0%, rgba(229,40,94,1) 12%, rgba(226,47,68,1) 94%, rgba(226,47,68,1) 100%);
background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(229,40,94,1)), color-stop(12%, rgba(229,40,94,1)), color-stop(94%, rgba(226,47,68,1)), color-stop(100%, rgba(226,47,68,1)));
background: -webkit-linear-gradient(45deg, rgba(229,40,94,1) 0%, rgba(229,40,94,1) 12%, rgba(226,47,68,1) 94%, rgba(226,47,68,1) 100%);
background: -o-linear-gradient(45deg, rgba(229,40,94,1) 0%, rgba(229,40,94,1) 12%, rgba(226,47,68,1) 94%, rgba(226,47,68,1) 100%);
background: -ms-linear-gradient(45deg, rgba(229,40,94,1) 0%, rgba(229,40,94,1) 12%, rgba(226,47,68,1) 94%, rgba(226,47,68,1) 100%);
background: linear-gradient(45deg, rgba(229,40,94,1) 0%, rgba(229,40,94,1) 12%, rgba(226,47,68,1) 94%, rgba(226,47,68,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5285e', endColorstr='#e22f44', GradientType=1 );
}

.logo{ width:100%; float:left;}
.logo img{ width:100%;}
.free{ width:100%; float:left; margin-top:20px;}
.free h1{ font-size:95px; color:#fff; line-height:82px;font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:bold;}
.free h3{ font-size:20px; color:#fff;}
.free1{ width:100%; float:left;}
.free1 h3{ font-size:20px; color:#fff;}
.app{ float:left; width:48%; margin-right:2%;}
.app img{ width:100%}
.play{ float:left; width:48%; margin-left:2%;}
.play img{ width:100%}
.mob-img{ width:100%; float:left; }
.mob-img img{ width:100%;margin:-15px 0 0 160px}
.footer-top{ width:100%; float:left; background:#3d454d;}
.car-top{ float:left; width:100%;}
.ban{width:100%; float:left; margin-top:-30px;}
.ban img{ width:100%;}
.footer-text{ width:100%; float:left; margin:20px 0px 20px 20px ;}
.footer-text h2{font-size:25px; color:#fff;}
.footer-text p{color:#fff;}

.footer-bottom{ float:left; width:100%; background:#373d46;}
.copy{float:left; width:100%; margin-top:10px;}
.copy p{ color:#fff;}
.phone{float:left; width:100%;}
.phone h4 a{font-size:20px; color:#fff !important; margin-top:15px; font-family: 'robotolight';}
.phone h4 a:hover{ color:#e42c54 !important; }

/*----------------------*/
.header-inner{ width:100%; float:left; padding:18px 0px;}
.contant{ width:100%; float:left; background:#f2f2f2;}
.contant-text{ width:100%; float:left; background:#fff; padding:30px;min-height: 500px;}
.app-button{ float:left; width:100%; margin-top:10px;}
.logo-inner{float:left; width:100%;}


div.ccm-page header nav ul li ul{ top:77px !important;}


@media screen and (max-width:1199px) {
div.ccm-page header nav ul li a{ padding:35px 14px !important;}
.icon ul li{ padding:0px;}
.mob-img img{ margin:-15px 0 0 130px}
.ban{ margin-top:-30px;}
div.ccm-page header nav ul li ul{ top:88px !important;}
.free{ margin-top:0px;}
.free h3{ margin:0 0 10px;}
}
@media screen and (max-width:992px) {
div.ccm-page header nav ul li a{padding:20px 5px !important;}
div.ccm-page header nav ul a{ font-size:12px !important;}
.col-sm-2.padding-left{ padding:0px;}
.icon{ margin-top:10px;}
.mob-img img{ margin:-10px 0 0 130px}
.logo{padding: 14px 0px 10px;}
.free1 h3{ margin-top:10px; font-size:18px;}
.free h1{ font-size:70px; line-height:60px;}
div.ccm-page header nav ul li ul{ top:57px !important;}
}
@media screen and (max-width:767px) {
.logo{margin: 0 auto;text-align: center;}
.icon{margin: 0 auto 20px;text-align: center;}
.free{ margin:20px 0px;}
.free h1 {font-size: 95px;line-height: 85px;}
.free{ text-align:center;}
.mob-img img{ margin:0px}
.ban{ margin-top:30px;}
.footer-text{ margin:20px 0px; text-align: center;}
.mob-img{ margin-top:20px;}
.free1{ text-align:center; margin-top:10px;}
.free1 h3{ font-size:20px;}
.phone{ text-align:center;}
.logo-inner{ margin:0 auto; text-align:center;}
.contant-text{ padding:30px 0px;}
}
@media screen and (max-width:640px) {
.free h1 {font-size: 80px;line-height: 70px;}
}


@media screen and (max-width:540px) {
.free h1 {font-size:70px;line-height: 60px;}
}

@media screen and (max-width:480px) {
.free h1 {font-size:60px;line-height:55px;}
}

@media screen and (max-width:420px) {
.free h1 {font-size:50px;line-height:45px;}
}

@media screen and (max-width:360px) {
.free h1 {font-size:42px;line-height:38px;}
}
