html {
    background: url(../images/lottery/page-bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width:100%;
    height:100%;
}
body { background:rgba(0,0,0,0.7);color:#fff;min-height:100%;}

nav { padding:10px 0 20px 0;}
nav.main { }

* { box-sizing:border-box;}

img { max-width:100%;}

.header { display:block;}
header { padding:15px 0;}

h1 { font-family: 'Exo', sans-serif;text-transform:uppercase;background:rgba(255,30,30,0.8);padding:10px 0;margin:0 0 30px 0;font-size:1.2em;color:#fff;font-weight:bold;text-align:center;}
h1 span { color:#ffd66c; }
h1 span:before { content: ' - ';}

.lotto-balls { padding:0;margin-top:20px;display:block;text-align:center;}
.lotto-balls h3 { font-weight:bold;padding:0;line-height:1.4em;font-size:1em;margin:0 0 10px 0;}
.lotto-ball { border:2px solid #fff;background:rgba(255,30,30,1);margin:0 10px 10px 0;color:#FFF;font-family: "Arial Black";font-weight:800;font-size:1.7em;text-align:center;width:36px;display:inline-block;height:36px;border-radius:50%;line-height:30px;}
.lotto-bonus-ball { background:#fff;color:rgba(255,30,30,1);}

@media screen and (max-width:640px) {
    .lotto-ball { font-size:1.2em;text-align:center;width:32px;display:inline-block;height:32px;border-radius:50%;line-height:26px;}
}

nav a:link,
nav a:active,
nav a:hover { color:#fff;text-decoration:none;}

nav a { font-family: 'Exo', sans-serif;font-weight:800;display:inline-block;margin-left:5px;margin-bottom:5px;padding:7px 14px;border-radius:10px; color:#fff;font-size:1em;background: #666666; /* Old browsers */
    background: -moz-linear-gradient(top,  #666666 0%, #000000 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #666666 0%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #666666 0%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#000000',GradientType=0 );}

nav a:hover {
    background: #000000; /* Old browsers */
    background: -moz-linear-gradient(top,  #000000 0%, #666666 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #000000 0%,#666666 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #000000 0%,#666666 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#666666',GradientType=0 );
}


nav a.white { background: #fff; /* Old browsers */
    background: -moz-linear-gradient(top,  #fff 0%, #ccc 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #fff 0%,#ccc 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #fff 0%,#ccc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#ccc',GradientType=0 );color:#000;}

nav a.white:hover { background: #ccc; /* Old browsers */
    background: -moz-linear-gradient(top,  #ccc 0%, #fff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ccc 0%,#fff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ccc 0%,#fff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccc', endColorstr='#fff',GradientType=0 );color:#000;}

nav a.simulate { background: #ff2211; /* Old browsers */
    background: -moz-linear-gradient(top,  #ff2211 0%, #cc1100 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ff2211 0%,#cc1100 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ff2211 0%,#cc1100 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff2211', endColorstr='#cc1100',GradientType=0 );}

nav a.simulate:hover { background: #cc1100; /* Old browsers */
    background: -moz-linear-gradient(top,  #cc1100 0%, #ff2211 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #cc1100 0%,#ff2211 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #cc1100 0%,#ff2211 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc1100', endColorstr='#ff2211',GradientType=0 );}


nav a.save-simulate { background: #ff2211; /* Old browsers */
    background: -moz-linear-gradient(top,  #ff2211 0%, #cc1100 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ff2211 0%,#cc1100 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ff2211 0%,#cc1100 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff2211', endColorstr='#cc1100',GradientType=0 );}

nav a.save-simulate:hover { background: #cc1100; /* Old browsers */
    background: -moz-linear-gradient(top,  #cc1100 0%, #ff2211 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #cc1100 0%,#ff2211 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #cc1100 0%,#ff2211 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc1100', endColorstr='#ff2211',GradientType=0 );}


nav a:first-child { margin-left:0px;}