@charset "utf-8";
html, body { height: 100%;}
body { font-family: 'Montserrat', sans-serif; background-color:#f24860; background-image:url(../images/map-images.jpg); background-attachment: fixed; background-repeat:repeat-x; background-position:bottom center; }
* { box-sizing:border-box; -webkit-box-sizing:border-box; }
body, h1, h2, h3, h4, h5, h6, ul, li, p { margin:0; padding:0;}
a, a:hover, a:focus, input, button { color:inherit; text-decoration:none; outline:none; transition: all ease 0.4s; -webkit-transition: all ease 0.4s; -moz-transition: all ease 0.4s;}
li { list-style:none; }
img { max-width:100%;}

.top-elements-bg { width:100%; height:420px; position:fixed; z-index:-1;}
.top-elements { width:100%; height:420px; background-image:url(../images/shapes.png); background-position:center; background-repeat:no-repeat; position:absolute; left:0; top:0; z-index:2 }
.jr-dollars { width:100%; height:420px; background-image:url(../images/dollar.gif); background-position:center; background-repeat:no-repeat; position:absolute; left:0; top:0 }
.jr-coins { width:100%; height:420px; background-image:url(../images/coins.png); background-position:center; background-repeat:no-repeat; position:absolute; left:0; top:0; z-index:2 }

.jr-opn-mn { float:right; color:#fff; font-size:24px; margin:50px; position:relative; z-index:5; cursor:pointer; }
.jr-sidenav { height: 100%; width: 0; position: fixed; z-index: 6; top: 0; right: 0; background-color: #fff; overflow-x: hidden; transition: 0.5s; padding-top: 60px;}
.jr-sidenav a { text-decoration: none; font-size: 42px; color: #383838; display: block; transition: 0.3s; font-weight:700;}
.jr-sidenav a:hover { color: #000;}
.jr-sidenav .jr-closebtn { position: absolute; top: 0; right: 0; font-size: 58px; margin:50px 46px ; color:#666; font-weight:300; padding:0; line-height: 35px;}
.jr-mn-ftr { position: absolute; bottom: 0; width: 100%; padding: 0 80px 50px 80px;}
.jr-mn-ftr li { display:inline-block; margin-right:30px; }
.jr-mn-ftr li a { padding:0;}
.jr-mn-ftr p { font-size: 14px;}
.jr-mn-mnu li { padding:48px 80px;}
.jr-brdr-ln { width:100%; display:inline-block; height:1px; background-color:#e0e0e0; margin-bottom:20px}
@media screen and (max-height: 450px) { .jr-sidenav {padding-top: 15px;} .jr-sidenav a {font-size: 18px;}}
.jr-cntnr { position:relative; z-index:2; max-width:720px; margin:0 auto; text-align:center; padding-top:56px; }
.jr-lg img{ max-width:95px;}
.jr-vdo-wrpr { width:641px; height:311px; border:14px solid #fff; border-radius: 50px; -webkit-border-radius: 50px; -webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,.03); box-shadow: 0 0 3px 3px rgba(0,0,0,.03); margin:25px auto 10px; position:relative; overflow:hidden; background-color:#000 }
.jr-vdo-wrpr:after { content:""; width:24px; height:181px; background-image:url(../images/phone-top.png); background-position:center; background-size:100%; position:absolute; left:0; top:0; bottom:0; margin:auto; }
.jr-vdo video { margin-left: -70px; margin-top: -30px;}
.mute-video {  background:url(../images/mute.png) no-repeat center; background-size:16px; border:0; position: absolute; bottom: 10px; right: 10px; width: 40px; height: 40px; background-color: #000; border-radius: 50%; text-indent:-999px; opacity:0.5; cursor:pointer; font-size:0px; }
.unmute-video { background:url(../images/unmute.png) no-repeat center;background-size:16px; border:0; position: absolute; bottom: 10px; right: 10px; width: 40px; height: 40px; background-color: #000; border-radius: 50%; text-indent:-999px; opacity:0.5; cursor:pointer; font-size:0px; }
.mute-video:hover, .unmute-video:hover { opacity:1; }
.jr-vdo-shdw { width: 100%; height:22px; background-image:url(../images/shadow.png); display:inline-block; background-repeat:no-repeat; background-position:center; margin-bottom:5px; }
.jr-cntnts h3 { font-size:38px; font-weight:500; color:#fff; font-family: 'Montserrat', sans-serif; }
.jr-cntnts h1 { font-size:60px; font-weight:900; color:#fff; font-family: 'Montserrat', sans-serif; }
.jr-app-dwnd { max-width:193px; display:inline-block; margin: 35px 0; }
.jr-ftrd { display:inline-block; width:100%; padding:20px 0;}
.jr-ftrd h4 { font-size:16px; font-weight:500; color:#000; margin-bottom:15px; }
.jr-ftrd h4:before, .jr-ftrd h4:after { content:""; width:60px; height:1px; display:inline-block; background-color:#000; vertical-align:middle; margin:0 10px; }
.jr-ftrd li { list-style:none; display:inline-block; vertical-align:middle; margin:0 20px; opacity:0.8; }
.jr-ftrd li:hover { opacity:1; }
.jr-ftr { width: 100%;  position: fixed; bottom: 0; left: 0; height: 468px; }
.jr-rd1 { width:650px; height:450px; background-image:url(../images/road1.png); background-repeat:no-repeat; background-position:right bottom; left:0; bottom:0; position:absolute;}
.jr-rd2 { width:462px; height:468px; background-image:url(../images/road2.png); background-repeat:no-repeat; background-position:right bottom; right:0; bottom:0; position:absolute;}
.jr-usrcr { width:227px; height:109px; background-image:url(../images/user-car.png); position:absolute; bottom:0; left:0 }
.usrcr1 { bottom: 27px; left: -90px;  animation-name: usrcr1; animation-duration: 10s; animation-iteration-count: infinite;}
@keyframes usrcr1 { 0%  { transform:rotate(0deg);} 50%   { transform:rotate(10deg);} 100%   { transform:rotate(0deg);}}
.usrcr2 { transform: rotate(-79deg); -webkit-transform: rotate(-79deg); -moz-transform: rotate(-79deg); left: -47px; bottom: 100px; animation-name: usrcr2; animation-duration: 8s; animation-iteration-count: infinite;}
@keyframes usrcr2 { 0%  { opacity:0; left: -47px; bottom: 100px;} 10%  { opacity:1; left: -47px; bottom: 100px;} 90%  { left: 13px; bottom: 255px; opacity:1;} 100%  { left: 13px; bottom: 255px; opacity:0;}}
.jr-coin { width:80px; height:80px; border:8px solid #e4ded5; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; background-color:#e4ded5; background-image:url(../images/coin.png); position:absolute;}
.coin1 {left:190px;}
.coin2 { right: 80px; bottom: 20px;}
.coin3 { right: 40px; top: -30px;}
.jr-ubrcr { position:absolute; width:71px; height:120px; background-image:url(../images/uber-car.png); right: 247px; top: 50px; animation-name: ubrcr; animation-duration: 20s; animation-iteration-count: infinite; transform:rotate(-4deg); }
@keyframes ubrcr { 0%   {right: 247px; top: 50px;} 40%  {right: 237px; top: 150px; transform:rotate(-4deg);} 50%  { transform:rotate(176deg); right: 237px; top: 150px;} 90%  { transform:rotate(176deg); right: 247px; top: 50px;} 100%   {right: 247px; top: 50px; transform:rotate(-4deg);}}

.overlay { position: fixed; top: 0;bottom: 0; left: 0; right: 0; transition: opacity 500ms; visibility: hidden; opacity: 0; z-index:99; background-color:rgba(0,0,0,0.7); }
.overlay:target { visibility: visible; opacity: 1;}
.popup { margin: 70px auto; padding: 70px 20px 40px; text-align: center; background: #fff; width: 100%;  max-width: 560px; position: relative; transition: all 1s ease-in-out;}
.popup .close { position: absolute; top: 20px;  right: 30px;  transition: all 200ms;  font-size: 30px;  font-weight: bold;  text-decoration: none;  color: #333;}
.popup .content {  max-height: 30%;  overflow: auto;}
.popup h2 { font-size:36px; color:#000; font-weight:700; margin-bottom:60px; }
.popup .content h3 { font-size:24px; color:#f24860; font-weight:500; margin-bottom:10px; }
.popup .content h3 img { display:inline-block; vertical-align:middle; }
.popup .content p { margin:0 0 30px;}
.popup .content p a { font-size:16px; color:#000; font-weight:500; }

/*inner pages*/
p.logo img{text-align: left; display: inline-block; padding:10px 40px; width:150px;}
.wrapper{width: 100%;}
.header{width:100%; background-color: #fff; display: inline-block;}
.header p{display: inline;text-align: right;}
.container{width:100%; max-width: 960px; padding: 40px 60px; margin:0px auto; background-color: #fffffff5; line-height: 26px; font-size: 15px; color: #3e3e3e; font-weight: 300;}
span.jr-opn-mn.inr-nav{color:#ed455f; margin:20px 40px;}
.container a{color:#ed455f;}
.container h1{padding-bottom: 20px;}
.container h2{padding-bottom: 10px;}
.container p{padding-bottom:20px; }

.container ul li{padding-bottom: 20px;}
.container ul li ol{padding-top:20px; }
.container ul li ol li{list-style: decimal;}

@media screen and (max-width: 700px){
.popup{ width: 90%; }
}

@media(max-width:1440px){
.jr-rd1{ -ms-transform: scale(1,1); -webkit-transform: scale(.7,.7); transform: scale(.7,.7); left: -70px; bottom: -70px;}
.jr-rd2{ -ms-transform: scale(1,1); -webkit-transform: scale(.7,.7); transform: scale(.7,.7); right: -70px; bottom: -70px;}
.jr-mn-mnu li { padding: 30px 80px;}
}
@media(max-width:1366px){
.jr-cntnts h1 { font-size: 52px;}
.jr-vdo-wrpr { width: 601px; height: 292px;}
.jr-app-dwnd { margin: 15px 0;}
.jr-ftrd { padding: 6px 0;}
.jr-cntnr { padding-top: 26px;}
.jr-sidenav a { font-size: 36px;}
}
@media(max-width:767px){
.top-elements-bg, .jr-vdo-wrpr, .jr-vdo-shdw, .jr-ftr { display:none;}
.jr-lg {margin-bottom: 30px; text-align: center; width: 100%; display: inline-block;}
.jr-cntnr { padding-top: 50px;}
.jr-opn-mn { position: absolute; right: 0;}
.jr-cntnts h1 { font-size: 72px;}
.container{width:100%; max-width: 960px; padding: 40px 20px;}
}
@media(max-width:480px){
.jr-sidenav .jr-closebtn, .jr-opn-mn { margin: 30px;}
.jr-mn-mnu li { padding: 25px 20px;}
.jr-sidenav { transition: 0.1s;}
.jr-sidenav a { font-size: 30px;}
.jr-mn-ftr { position: static; padding:20px;}
.jr-cntnts h1 { font-size: 57px;}
.jr-app-dwnd { margin: 35px 0;}
.jr-ftrd li { margin: 10px;}
}
@media(max-width:320px){
.jr-cntnr { padding-top: 30px;}
.jr-lg { margin-bottom: 20px;}
.jr-lg img { max-width: 85px;}
.jr-cntnts h3 { font-size: 30px;}
.jr-cntnts h1 { font-size: 48px; margin: 15px 0 0;}
.jr-app-dwnd { max-width: 153px; margin: 20px 0;}
.jr-ftrd li {  margin: 5px;}
.jr-sidenav { padding-top: 20px;}
.jr-sidenav a {  font-size: 26px;}
}