@charset "utf-8"; /* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,400i,500,500i,700,900'); /*font-family:'Roboto', sans-serif; */

* {
    padding: 0; 
    margin: 0;
}

body {
    font-family: 'Roboto', sans-serif; 
    font-size: 100%; 
    font-weight: 400; 
    padding: 0; 
    margin: 0;
}

a:hover {
    text-decoration: none;
}

h1, 
h2, 
h3, 
h4, 
h5, 
h6, 
p {
    margin: 0px; 
    padding: 0px; 
    font-weight: 400;
}

::-moz-selection {
    color: #fff; 
    background: #4379de;
}

::selection {
    color: #fff; 
    background: #4379de;
}

:focus {
    outline: 0px;
}

.white-bg {
    background: #FFF;
}

.wrapper {
    width: 100%;
    max-width: 1140px; 
    margin: 0 auto; 
    padding: 0px;
}

.wrapper:after {
    clear: both; 
    display: block; 
    content: "";
}

p {
    font-size: 15px; 
    color: #696969;
}

.heaingh2 {
    font-size: 35px; 
    font-weight: 500; 
    color: #000; 
    margin: 0px; 
    padding: 0px; 
    display: block; 
    width: 100%;
}

.heaingh2 span {
    color: #0d61ac;
}

.heaingp {
    font-size: 16px; 
    font-weight: 400; 
    color: #222222; 
    margin: 0px; 
    padding: 0px 0px 50px 0px; 
    display: block; 
    width: 100%;
}

.heainghr {
    width: 50px; 
    height: 5px; 
    background: #0d61ac; 
    border-radius: 50px; 
    margin: 15px auto; 
    display: block;
}

.mdl-layout__header {
    background: #eee;
}

.lang-menu-img {
    width: 20px; 
    margin-top: -4px;
}

.mdl-menu__item img {
    width: 20px
}

.wid5.mobile-view {
    display: none;
}

.wid5 {
    width: 50%; 
    float: left; 
    box-sizing: border-box; 
    display: block;
}

.wid5:after {
    display: block; 
    clear: both; 
    content: "";
}

.viuwi-banner {
    background: url(../img/banner.jpg) top center no-repeat; 
    background-size: cover; 
    display: table; 
    width: 100%; 
    height: 600px; 
    position: relative;
}

.viuwi-banner h2 {font-size:44px; font-weight: 500; color: #FFF; padding: 0 0 10px 0px;}
.viuwi-banner p {font-size: 22px; line-height: 28px; font-weight: 400; text-align: left; color: #FFF; margin: 0px; padding: 0px 0px 20px 0px;}
.viuwi-banner h5 {font-size: 16px; line-height: 20px; font-weight: 500; color: #FFF; padding: 20px 0px 0px 0px; display: block;}
.viuwi-banner h5 a {color: #fff;}
.viuwi-banner .height-mid {display:table-cell; vertical-align:middle;}
.viuwi-banner .white-box {background:rgb(64,140,219,0.5); padding:30px 30px; box-sizing:border-box;}
.viuwi-banner-screen {position:absolute; bottom:-50px; } 

.login {background:#448aff; color:#FFF; font-size:16px; padding:8px 35px; border-radius:0px; margin-right: 10px;}
.login:hover {color:#FFF; opacity: 1;}

.vipcenter {background:#dadada; font-size: 16px; padding: 8px 35px; border-radius: 0px; border: none; color: #424242;}
.vipcenter:hover {color: #FFF;}
.viuwi-what {padding: 180px 0 80px 0;}
.viuwi-what h2 {text-align: center;}
.viuwi-what p {text-align: center;}
.viuwi-what .viuwi-what-box {text-align: center; padding: 0 10px;}
.viuwi-what .viuwi-what-box img {margin-bottom:5px;}
.viuwi-what .viuwi-what-box h3 {font-size: 20px; line-height: 30px; font-weight: 600; text-align: center; text-transform: uppercase; color:#0d61ac; margin: 0px; padding: 10px 0;}
.viuwi-what .viuwi-what-box p {font-size: 14px; line-height: 20px; font-weight: 400; text-align: center; color: #8a8a8a; margin: 0px; padding: 0px;}
.viuwi-helps {padding: 80px 0; position: relative; overflow: hidden;}
.viuwi-helps hr {margin: 20px 0;}
.viuwi-helps p {font-size: 16px; font-weight: 400; text-align: left; color:#222222; margin: 0px; padding: 0px 0px 25px 0px;}
.viuwi-helps p strong {font-size: 20px; color: #000; font-weight: 500;}
.viuwi-helps p span {font-size: 20px; color: #448aff; font-weight: 600;}
.viuwi-helps .account {background:#448aff; color: #fff; font-size: 16px; padding: 8px 40px;}
.white-ring {position: absolute; top:30px; right: -160px; z-index: -1;}
.blue-ring.left {position: absolute; top:100px; left: -160px; z-index: -1;}
.iq-fadebounce {-webkit-animation-name: fadebounce; animation-name: fadebounce; -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite}
 @-webkit-keyframes fadebounce {
0% {-webkit-transform:translateY(0); transform:translateY(0); opacity:1}
50% {-webkit-transform:translateY(20px); transform:translateY(20px); opacity:1}
to {-webkit-transform: translateY(0); transform: translateY(0); opacity:1}}
.viuwi-feature {padding: 50px 0;}
.viuwi-feature h2 {text-align:center;}
.viuwi-feature hr {margin:30px auto;}
.flip-card {
    background-color: transparent; 
    width: 360px; 
    height: 280px; 
    perspective: 1000px; 
    box-sizing: border-box; 
    position: relative;
}

.flip-card-inner {
    position: relative; 
    width: 100%; 
    height: 100%; 
    text-align: center; 
    transition: transform 0.6s; 
    transform-style: preserve-3d;
}

.mdl-cell--4-col-desktop.hover .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front, 
.flip-card-back {
    position: absolute; 
    width: 100%; 
    height: 100%; 
    -webkit-backface-visibility: hidden; 
    backface-visibility: hidden;
}

.flip-card-front {
    text-align:center; 
    padding: 45px 30px; 
    box-sizing: border-box; 
    background: #f7f7f7;
}

.flip-card-front i {
    background: #757575; 
    border-radius: 50px; 
    font-size: 60px; 
    color: #fff; 
    padding: 20px;
}

.flip-card-front h5 {font-weight: 600; margin:10px 0; color: #969696;}
.flip-card-front p {font-size:14px; line-height:18px; text-align:center; font-weight:500; color:#969696; margin-bottom:3px;}
.flip-card-back {background-color:#0d61ac; color: white; transform: rotateY(180deg); padding: 40px; box-sizing: border-box;}
.flip-card-back h5 {font-size: 25px; text-align: left; font-weight: 600; margin: 0; padding: 0px; color: #fff;}
.flip-card-back hr {width: 40px; height: 4px; background: #FFF; border-radius: 50px; margin: 15px 0 10px 0px;}
.flip-card-back p {font-size: 16px; line-height: 25px; text-align: left; color: #FFF; padding: 0px; margin: 0px;}
.viuwi-quote {background:#f6f6fe; padding: 50px 0 50px 0; margin: 0px 0 0 0;}
.viuwi-quote p {font-size: 20px; line-height: 30px; text-align: center; font-weight: 500; padding: 0px; margin: 0 auto; text-align: center; display: block; color: #000; position: relative;}
.viuwi-quote i {font-size:100px; color:#0d61ac; position: absolute;}
.viuwi-quote i.quote-left {left: 110px; top: -40px;}
.viuwi-quote i.quote-right {right: 150px; bottom: -45px;}
.viuwi-faq {padding: 100px 0; position:relative;}
.viuwi-faq h2 {text-align:center;}
.viuwi-faq hr {margin:30px auto;}
.viuwi-faq ul {margin-bottom: 15px;}
.viuwi-faq ul li {list-style: none; display: block;}
.viuwi-faq .mdl-accordion {margin-bottom: 10px;}
.viuwi-faq .mdl-accordion.mdl-accordion--opened .mdl-navigation__link.mdl-accordion__button {color: #FFF;}
.viuwi-faq .mdl-navigation__link.mdl-accordion__button {background:#0d61ac; font-size: 15px; font-weight: 500; color: #fff; padding: 15px 40px 15px 20px; border-radius: 50px; display: block; position:relative;}
.viuwi-faq .mdl-accordion__content {
    background: #f7f7f7; 
    font-size: 18px !important; 
    line-height: 20px; 
    font-weight: 400; 
    color: #565656;
    padding: 0px 15px; 
    border-radius: 20px; 
    height: 100px;
    text-transform: none;
}
.viuwi-faq img {max-width: 100%;}
.viuwi-faq .faq-table {margin-top:20px;}
.mdl-accordion.mdl-accordion--opened {margin-top:-1px;}
.mdl-accordion.mdl-accordion--opened + .mdl-accordion.mdl-accordion--opened {border-top: none; margin-top: 0;}
.mdl-accordion .mdl-accordion__content-wrapper {overflow: hidden;}
.mdl-accordion .mdl-accordion__content {transition-property: margin-top; transition-duration: 0.2s;}
.mdl-accordion .mdl-accordion__icon {transition-property: transform; transition-duration: 0.2s; color: rgba(0,0,0,0.3); position: absolute; right:15px; margin-top: -2px; color: #FFF; font-size: 25px;}
.mdl-accordion.mdl-accordion--opened .mdl-accordion__icon.add {display: none;}
.mdl-accordion.mdl-accordion__icon.remove {display: none;}
.mdl-accordion.mdl-accordion--opened .mdl-accordion__icon {transform: rotate(-180deg);}
.mdl-accordion.mdl-accordion--opened .mdl-accordion__button {color: teal;}
.mdl-accordion.mdl-accordion--opened .mdl-accordion__content {margin-top:0 !important; padding: 20px;}
.faq .mdl-accordion__button {font-size: 15px; text-align: left; display: block; padding: 10px 20px 10px 10px; background: #f7f7f7; color: #000; position: relative; margin-bottom: 5px;}
.faq .mdl-accordion__content {font-size: 15px; text-align: left;}
.viuwi-faq .mdl-navigation__link {
    font-size: 15px; 
    line-height: 20px; 
    font-weight: 400; 
    color: #676767;
    text-transform: none;
}
.footer {background: #64a1ff; padding: 30px 0 40px 0;}
.footer img {margin: 0 auto 5px; display: block; text-align: center;}
footer p {font-size: 14px; line-height: 25px; text-align: center; font-weight: 400; color: #FFF;}
footer a {color: #FFF; padding: 0 5px; text-decoration:none; font-weight:400;}
.copyright {background:#424242; padding:10px 0; margin: 0px;}
copyright a {font-size: 14px; line-height: 25px; text-align: center; font-weight: 400; color: #FFF; margin-right: 10px;}
.copyright a:hover {color: #21b9fc;}
.copyright ul {margin: 0px; text-align: right;}
.copyright ul li {list-style: none; display: inline-block;}
.copyright p {text-align: right;}
.mdl-navigation a {text-decoration: none;}
.mdl-navigation__link__footer {background: #eee; width: 100%;}
span.mdl-layout-title a:first-child {margin-left: -20px;}

@media (max-width:479px) {.hidden-phone {display: none !important;}
.layout-title__user {text-align: center;}}

@media (min-width:320px) and (max-width:767px) {
.wid5 {width:100%; float:none;}
.viuwi-banner {padding:30px 15px; box-sizing:border-box; height:auto;}
.viuwi-banner .mobile-view .viuwi-banner-screen {margin-bottom:30px;}
.viuwi-banner .white-box {padding:20px 20px;}
.viuwi-banner h2 {font-size:20px; line-height:25px; padding:0 0 10px 0;}
.viuwi-banner p {font-size:15px; line-height:20px; padding:0 0 15px 0;}
.wid5.mobile-view {display:block;}
.desktop-view {display:none;}
.heaingh2 {font-size: 23px;}
.heaingp {font-size: 14px; line-height: 20px;}
.login {padding:2px 20px; font-size:14px;}
.vipcenter {padding:2px 20px; font-size:14px;}
.viuwi-banner h5 {font-size:13px; padding:10px 0 0 0;}
.viuwi-banner img {position: relative; right: 0; left: 0px; width: 100%; top: 0px;}
.viuwi-what {padding: 30px 20px;}
.viuwi-helps {padding: 30px 20px;}
.viuwi-faq {padding: 30px 0px;}
.viuwi-faq h2 {margin-bottom: 10px;}
.white-ring {display: none;}
.blue-ring {display: none;}
.flip-card {width:90%; margin:0 auto; text-align:center;}
.flip-card-back {padding:20px;}
.viuwi-quote p {font-size: 14px; line-height: 20px;}
.viuwi-quote i {font-size: 50px;}
.viuwi-quote i.quote-left {left: 0px; right: 0px; top: -50px;}
.viuwi-quote i.quote-right {right: 0px; left: 0px; bottom: -50px;}
.help-src {max-width: 100%; margin-top:30px;}
.viuwi-faq hr {margin:10px auto 0;}
.viuwi-faq .faq-table {margin:10px;}
.viuwi-helps .account {font-size:15px; padding:5px 20px;}
.mdl-accordion .mdl-accordion__icon {font-size:23px;}
.viuwi-faq .mdl-navigation__link.mdl-accordion__button {font-size:14px; line-height:18px; padding:10px 50px 10px 25px;}
.viuwi-faq .mdl-accordion__content {height:130px;}
}

@media (min-width:768px) and (max-width:991px) {
.viuwi-banner {padding: 20px 0; height:auto;}
.viuwi-banner h2 {font-size:20px; line-height:25px; padding:10px 0;}
.viuwi-banner p {font-size:14px; line-height:20px; padding:0 0 15px 0;}
.viuwi-banner h5 {font-size:14px;}
.viuwi-banner .white-box {margin-top:0;}
.login {padding:2px 20px; font-size:12px;}
.vipcenter {padding:2px 20px; font-size:12px;}
.viuwi-what {padding: 30px 0;}
.viuwi-what .viuwi-what-box p {font-size:12px;}
.viuwi-what .viuwi-what-box img {width:15%;}
.viuwi-what .viuwi-what-box h3{line-height:20px;}
.heaingh2 {font-size: 23px;}
.heaingp {font-size: 14px; line-height: 20px;}
.viuwi-faq {padding: 30px 0;}
.viuwi-faq h2 {margin-bottom: 10px;}
.viuwi-faq .mdl-accordion__content {height:180px;}
.viuwi-banner {height:auto;}
.viuwi-banner h2 {padding:10px 0}
.viuwi-banner img {position:relative; width:100%; left:0px; bottom:-100px;}
.viuwi-quote p {font-size:16px; line-height:22px;}
.viuwi-quote i {font-size: 50px;}
.viuwi-quote i.quote-left {left: 0px; right: 0px; top: -50px;}
.viuwi-quote i.quote-right {right: 0px; left: 0px; bottom: -50px;}
.viuwi-faq .mdl-navigation__link {font-size:14px; line-height:14px; font-weight:400;}
.viuwi-faq .mdl-navigation__link.mdl-accordion__button {font-size:15px; line-height:20px;}
.white-ring {display:none;}
.blue-ring {display: none;}
.viuwi-faq img {margin-top:50px;}
.flip-card {width:100%;}
.flip-card-back h5 {font-size:20px;}
.flip-card-back p {font-size:14px; line-height:20px;}
.help-src {max-width: 100%;}
.viuwi-helps {padding:20px 0;}
.viuwi-helps p {font-size:12px; line-height:20px;padding: 0px 0px 10px 0px;}
.viuwi-helps p strong{font-size:14px; line-height:22px;}
.viuwi-helps p span{font-size:14px;}
.viuwi-helps .account{font-size: 14px;padding: 3px 15px;}
.viuwi-feature {padding:25px 0;}
.viuwi-quote p {font-size:14px;}
.viuwi-faq hr {margin:0px auto;}
.viuwi-faq img {margin:0;}
.viuwi-faq .faq-table {margin-top:60px;}
.viuwi-faq .mdl-navigation__link.mdl-accordion__button {font-size: 12.5px;line-height: 16px;}
.mdl-accordion.mdl-accordion--opened .mdl-accordion__content {padding:15px;}
.viuwi-faq .mdl-navigation__link {font-size: 12px;line-height: 15px;}}