@font-face {
font-family: LeagueSpartan-Bold; 
src: url("https://www.silveroakmail.com/main-page/font/LeagueSpartan-Bold.otf") format("opentype"); 
} 
	
body{padding:0 0 0px; color:#888; font-weight:bold; background-color: #fff; min-height:100vh;position:relative;margin:0;padding:0;font-family: 'Open Sans', sans-serif;font-size:18px}
ul,li{list-style:none;margin:0;padding:0}
h1,h2,h3,h4,h5,p,strong,em{padding:0;margin:0;}
h1{ color:#ef5d5d; font-family: "LeagueSpartan-Bold"; font-size: 24px; padding: 40px 20px 0px 20px; text-transform: uppercase;}
h3{font-family: 'Open Sans', sans-serif; color:#888;}

.yellow{color:#deb740 !important;}

@media screen and (max-width: 760px){ h1{ padding-top: 14px;} }
@media screen and (max-width: 700px){ h1{ font-size: 20px;} }
@media screen and (max-width: 600px){ h1{ font-size: 18px; } h3{ font-size: 16px; } }
@media screen and (max-width: 460px){ h1{ padding-top: 0px;} }

h2{color:#fff;font-weight:normal;font-size:19px;padding:0 10px 10px;display:block;margin:0 auto;text-align:center}
img{max-width:100%}
*,:before,:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}
a{color:inherit;text-decoration:none}

.logo { max-width: 250px;  width: 100%;  padding: 20px 0px; }
@media only screen and (max-width:370px) { .logo { max-width: 70%; } }

.section-container {text-align: center;}
@media only screen and (max-width: 600px){ .section-container{padding: 0px 15px 0px 15px !important;} }

.footer{ max-width:530px;margin:0 auto;text-align:center;border-radius:3px;font-size:17px}

.payment{ opacity: 0.9; padding:30px; max-width: 500px;}
@media only screen and (max-width:600px){ .payment{ padding:10px;} }

.section-inner{max-width:100%;position:relative;margin:0 auto;}
.blocks{display:flex;justify-content:center;align-items:flex-start;text-align:center; width: 100%;  padding: 35px 0px 15px 0px;}

.blocks li{width:33%;max-width:400px;padding: 0px !important; background-color: #e7c350; border-radius:10px; margin: 10px;}
.blocks li img{ width: 100%;padding: 0px !important; border-top-right-radius:9px; border-top-left-radius:9px;}
.blocks li span{text-decoration: none; font-size: 22px; font-family: "LeagueSpartan-Bold"; color:#fff; text-transform: uppercase; display: block; padding: 14px 0px 7px 0px;}
.blocks li:first-child { background-color: #e7c350;}.blocks li:nth-child(2) { background-color: #72d4ef;}.blocks li:nth-child(4) { background-color: #72d4ef;} 
.blocks li:hover{transition: all .2s ease-in-out;  transform: scale(1.02); cursor:pointer; }
.blocks img{width:100%;height:auto;border:0;outline:none;display:block;padding:15px 0;}

@media screen and (max-width: 1200px){.blocks li a{ font-size: 18px;}}
@media screen and (max-width: 760px){
    .blocks{flex-direction:column;}     
    .blocks li{width:90%;max-width:500px;padding: 0px !important; margin: 20px auto;} .blocks{padding: 0px !important;}
}
@media screen and (max-width: 460px){ .blocks li{width:100%;} .blocks li a{font-size:18px;} }

.section-container { padding-top:0px !important; text-align: center; }

@media only screen and (max-width: 640px){.footer {max-width:none;border-left:none;border-bottom:none;border-radius:0;border-right:0}}

.button{display:inline-block;padding:20px 0px 10px 0px; margin: 20px 0; transition:0.1s;max-width:335px;border-radius:55px;  font-family: "LeagueSpartan-Bold"; color:#fff; background-color: #f56262; width:60%; text-transform: uppercase;}.button strong{ font-weight:800; font-size:24px; line-height: 30px;}
.button:hover{transform:scale(1.02);filter:drop-shadow(0px 3px 8px transparent)}
@media only screen and (max-width: 1100px){.button strong{ font-size:26px; line-height: 25px;} .button{padding:20px 0px 10px 0px; max-width:335px;} }
@media screen and (max-width: 460px){.button strong{ font-weight:800; font-size:25px;} .button{width:90%;}}
@media screen and (max-width: 400px){.button strong{ font-weight:800; font-size:20px; line-height: 20px;} }
@media screen and (min-width: 1000px){.button{font-size:25px !important}}


/**
 * The "shine" element
 */
 
 .button {
  position: relative;
  overflow: hidden;
  display: inline-block;  
}


.button:after {
  content: "";
  position: absolute;
  top: -110%;
  left: -210%;
  width: 200%;
  height: 200%;
  opacity: 0;
  transform: rotate(30deg);
  
  background: rgba(255, 255, 255, 0.13);
  background: linear-gradient(
    to right, 
    rgba(255, 255, 255, 0.23) 0%,
    rgba(255, 255, 255, 0.23) 77%,
    rgba(255, 255, 255, 0.5) 92%,
    rgba(255, 255, 255, 0.0) 100%
  );
}

/*  CTA ANIMATION  */
.button{
   cursor: pointer;
  -webkit-animation: pulse 2.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 2.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 2.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 2.25s infinite cubic-bezier(0.66, 0, 0, 1);
  position: relative;
  border: none;
  box-shadow: 0 0 0 0 rgba(232, 76, 61, 0.7);

}

.button:hover 
{
  -webkit-animation: none;-moz-animation: none;-ms-animation: none;animation: none;
}
@-webkit-keyframes pulse {to {box-shadow: 0 0 0 25px rgba(246, 128, 124, 0);}}
@-moz-keyframes pulse {to {box-shadow: 0 0 0 25px rgba(246, 128, 124, 0);}}
@-ms-keyframes pulse {to {box-shadow: 0 0 0 25px rgba(246, 128, 124, 0);}}
@keyframes pulse {to {box-shadow: 0 0 0 25px rgba(246, 128, 124, 0);}}

