@font-face {
  font-family: Aller;
  src: url("../fonts/aller/aller_bd.eot");
  /* IE9 Compat Modes */
  src: url("../fonts/aller/aller_bd.eot?#iefix") format("embedded-opentype"), url("../fonts/aller/aller_bd.woff") format("woff"), url("../fonts/aller/aller_bd.ttf") format("truetype"), url("../fonts/aller/aller_bd.svg#svgFontName") format("svg");
  /* Legacy iOS */
  font-weight: bold;
  font-style: normal; }

.header-gradient, .header {
  background: #4a90e2;
  /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left, #4a90e2, #d56fa1);
  /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(right, #4a90e2, #d56fa1);
  /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(right, #4a90e2, #d56fa1);
  /* For Firefox 3.6 to 15 */
  background: linear-gradient(to right, #4a90e2, #d56fa1);
  /* Standard syntax */ }

.header {
  padding: 40px 0;
  margin-bottom: 40px; }
  .header .logo {
    margin: 40px 0; }
  .header .title {
    margin-top: 0;
    font-family: Lato;
    font-weight: lighter;
    font-style: italic;
    color: white; }
  .header .subtitle {
    font-family: Lato;
    font-size: 20px;
    color: white;
    margin-bottom: 30px; }
  .header .store-button {
    max-width: 45%;
    height: auto; }

@media (min-width: 768px) and (max-width: 991px) {
  .header .logo {
    margin-top: 80px; } }

.footer-gradient, .footer {
  background: #4a90e2;
  /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(#4a90e2, #6e7fd8);
  /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#4a90e2, #6e7fd8);
  /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#4a90e2, #6e7fd8);
  /* For Firefox 3.6 to 15 */
  background: linear-gradient(#4a90e2, #6e7fd8);
  /* Standard syntax */ }

.footer {
  padding: 40px 10px; }
  .footer .footer-logo-container img {
    margin-bottom: 30px; }
  .footer .title {
    color: white;
    font-family: Lato;
    font-style: italic;
    font-weight: lighter; }
  .footer .link-container .links {
    color: white;
    font-family: Lato;
    font-size: 20px; }
    .footer .link-container .links.transparent {
      opacity: 0.6; }
  .footer .copyright {
    margin-top: 20px;
    color: white;
    font-family: Lato;
    font-size: 15px;
    opacity: 0.6; }
    .footer .copyright:last-child {
      margin-top: 0; }

@media (max-width: 767px) {
  .footer {
    border-radius: 0; } }

#terms-and-conditions .terms-and-conditions-section {
  margin: 10px 0; }
  #terms-and-conditions .terms-and-conditions-section.grey {
    background-color: #f8f8fb; }
  #terms-and-conditions .terms-and-conditions-section .section-title {
    color: #000000; }

#about .about-section {
  margin: 10px 0; }
  #about .about-section.grey {
    background-color: #f8f8fb; }

#about .text-section {
  margin-top: 30px;
  margin-bottom: 100px; }

.how-to-section {
  margin: 10px 0;
  padding: 20px 0; }
  .how-to-section.grey {
    background-color: #f8f8fb; }

.text-wrapper {
  height: 400px;
  position: relative; }
  .text-wrapper .section-text {
    position: absolute;
    top: 40%;
    height: 100px;
    margin-top: -50px; }

.title {
  font-family: Lato;
  font-weight: 400;
  color: #000000;
  margin-bottom: 30px; }

.section-header {
  font-family: Aller;
  font-weight: bold;
  color: #6e7fd8; }

.subtext {
  font-family: Lato;
  font-size: 18px;
  color: #000; }

.how-to-image {
  height: 400px;
  max-width: 100%; }

@media (max-width: 767px) {
  .text-wrapper {
    height: auto;
    position: static; }
    .text-wrapper .section-text {
      position: static;
      height: auto;
      margin-top: 0; }
  .how-to-image {
    height: 200px; } }

  .m-0 { margin:0!important; }
.m-1 { margin:.25rem!important; }
.m-2 { margin:.5rem!important; }
.m-3 { margin:1rem!important; }
.m-4 { margin:1.5rem!important; }
.m-5 { margin:3rem!important; }

.mt-0 { margin-top:0!important; }
.mr-0 { margin-right:0!important; }
.mb-0 { margin-bottom:0!important; }
.ml-0 { margin-left:0!important; }
.mx-0 { margin-left:0 !important;margin-right:0 !important; }
.my-0 { margin-top:0!important;margin-bottom:0!important; }

.mt-1 { margin-top:.25rem!important; }
.mr-1 { margin-right:.25rem!important; }
.mb-1 { margin-bottom:.25rem!important; }
.ml-1 { margin-left:.25rem!important; }
.mx-1 { margin-left:.25rem!important;margin-right:.25rem!important; }
.my-1 { margin-top:.25rem!important;margin-bottom:.25rem!important; }

.mt-2 { margin-top:.5rem!important; }
.mr-2 { margin-right:.5rem!important; }
.mb-2 { margin-bottom:.5rem!important; }
.ml-2 { margin-left:.5rem!important; }
.mx-2 { margin-right:.5rem!important;margin-left:.5rem!important; }
.my-2 { margin-top:.5rem!important;margin-bottom:.5rem!important; }

.mt-3 { margin-top:1rem!important; }
.mr-3 { margin-right:1rem!important; }
.mb-3 { margin-bottom:1rem!important; }
.ml-3 { margin-left:1rem!important; }
.mx-3 { margin-right:1rem!important;margin-left:1rem!important; }
.my-3 { margin-bottom:1rem!important;margin-top:1rem!important; }

.mt-4 { margin-top:1.5rem!important; }
.mr-4 { margin-right:1.5rem!important; }
.mb-4 { margin-bottom:1.5rem!important; }
.ml-4 { margin-left:1.5rem!important; }
.mx-4 { margin-right:1.5rem!important;margin-left:1.5rem!important; }
.my-4 { margin-top:1.5rem!important;margin-bottom:1.5rem!important; }

.mt-5 { margin-top:3rem!important; }
.mr-5 { margin-right:3rem!important; }
.mb-5 { margin-bottom:3rem!important; }
.ml-5 { margin-left:3rem!important; }
.mx-5 { margin-right:3rem!important;margin-left:3rem!important; }
.my-5 { margin-top:3rem!important;margin-bottom:3rem!important; }

.mt-auto { margin-top:auto!important; }
.mr-auto { margin-right:auto!important; }
.mb-auto { margin-bottom:auto!important; }
.ml-auto { margin-left:auto!important; }
.mx-auto { margin-right:auto!important;margin-left:auto!important; }
.my-auto { margin-bottom:auto!important;margin-top:auto!important; }

.p-0 { padding:0!important; }
.p-1 { padding:.25rem!important; }
.p-2 { padding:.5rem!important; }
.p-3 { padding:1rem!important; }
.p-4 { padding:1.5rem!important; }
.p-5 { padding:3rem!important; }

.pt-0 { padding-top:0!important; }
.pr-0 { padding-right:0!important; }
.pb-0 { padding-bottom:0!important; }
.pl-0 { padding-left:0!important; }                             
.px-0 { padding-left:0!important;padding-right:0!important; }
.py-0 { padding-top:0!important;padding-bottom:0!important; }

.pt-1 { padding-top:.25rem!important; }         
.pr-1 { padding-right:.25rem!important; }                       
.pb-1 { padding-bottom:.25rem!important; }      
.pl-1 { padding-left:.25rem!important; }                            
.px-1 { padding-left:.25rem!important;padding-right:.25rem!important; }
.py-1 { padding-top:.25rem!important;padding-bottom:.25rem!important; }

.pt-2 { padding-top:.5rem!important; }                                              
.pr-2 { padding-right:.5rem!important; }                                
.pb-2 { padding-bottom:.5rem!important; }               
.pl-2 { padding-left:.5rem!important; }                                             
.px-2 { padding-right:.5rem!important;padding-left:.5rem!important; }
.py-2 { padding-top:.5rem!important;padding-bottom:.5rem!important; }

.pt-3 { padding-top:1rem!important; }                               
.pr-3 { padding-right:1rem!important; }             
.pb-3 { padding-bottom:1rem!important; }                
.pl-3 { padding-left:1rem!important; }                              
.py-3 { padding-bottom:1rem!important;padding-top:1rem!important; }
.px-3 { padding-right:1rem!important;padding-left:1rem!important; }

.pt-4 { padding-top:1.5rem!important; }                             
.pr-4 { padding-right:1.5rem!important; }               
.pb-4 { padding-bottom:1.5rem!important; }              
.pl-4 { padding-left:1.5rem!important; }                                
.px-4 { padding-right:1.5rem!important;padding-left:1.5rem!important; }
.py-4 { padding-top:1.5rem!important;padding-bottom:1.5rem!important; }

.pt-5 { padding-top:3rem!important; }   
.pr-5 { padding-right:3rem!important; } 
.pb-5 { padding-bottom:3rem!important; }    
.pl-5 { padding-left:3rem!important; }  
.px-5 { padding-right:3rem!important;padding-left:3rem!important; }
.py-5 { padding-top:3rem!important;padding-bottom:3rem!important; }