*{font-family: 'Merriweather', Arial, serif;}
#page{
background: #1b0f0a;
position: relative;
overflow: hidden;
}
.bg-right{
position: absolute;
left:0;
bottom: -15px;
width: 250px;
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
z-index: 1;
}
.form-section{
background: url('img/bg.png');
background-size: cover;
background-position: center right;
background-repeat: no-repeat;
min-height: 60vh;
}
.form-section:before {
content: '';
background: #1b0f0a;
height: 46px;
position: absolute;
bottom: -15px;
width: 100%;
filter: blur(5px);
}
.game-img-c.allowed-game{
border-radius: 8px;
overflow: hidden;
}
.main-form h1{
color: #fff;
font-weight: bold;
}
.main-form p{
color: #fff;
}
.games {
display: flex;
flex-wrap: wrap;
margin-left: -1rem;
margin-right: -1rem;
justify-content: center;
position: relative;
z-index: 2
}
.game {
border-radius: 8px;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 1.5rem;
flex-basis: calc(25% - 2rem);
max-width: calc(25% - 2rem);
margin-left: 1rem;
margin-right: 1rem;
}
.modal-content {
background: #000;
border-radius: 12px;
padding: 1.5rem;
color: #fff
}
img.game-img {
pointer-events: none;
border: 5px solid #c27c28;
border-radius: 8px;
}
button.modal-close.is-large {
position: absolute;
top: -35px;
right: 0
}
.modal-content.content {
overflow: visible;
position: relative
}
div#register {
padding: .5rem
}
.game-img-c.allowed-game{
pointer-events: all;
}
.modal{
max-width: 800px !important;
overflow: initial;
}
.modal iframe{
width: 100%;
min-height: 50vh;
}
#regform.modal{
max-width: 450px !important;
}
.terms-link{
color: #fff;
display: block;
}
.row label{
color: #fff;
}
.control {
box-sizing: border-box;
clear: both;
font-size: 1rem;
position: relative;
text-align: left;
}
.control.has-icons-right .input, .control.has-icons-right .select select {
padding-right: 2.25em;
}
.control.has-icons-left .input, .control.has-icons-left .select select {
padding-left: 2.25em;
}
.input, .textarea {
background-color: #fff;
border-color: #dbdbdb;
color: #363636;
box-shadow: inset 0 1px 2px rgb(10 10 10 / 10%);
max-width: 100%;
width: 100%;
}
.row label a{
color: #fff;
}
.row label a:hover{
color: #fff;
}
.row:not(:last-child) {
margin-bottom: .75rem;
}
.control{
position: relative;
max-width: 400px;
}
.control.has-icons-left .icon.is-left {
left: 0;
}
.control.has-icons-left .icon, .control.has-icons-right .icon {
color: #dbdbdb;
height: 2.25em;
pointer-events: none;
position: absolute;
top: 0;
width: 2.25em;
z-index: 4;
}
.control.has-icons-right .icon.is-right {
right: 0;
}
.control.has-icons-left .icon, .control.has-icons-right .icon {
color: #dbdbdb;
height: 2.25em;
pointer-events: none;
position: absolute;
top: 0;
width: 2.25em;
z-index: 4;
}
input[type=checkbox], input[type=radio] {
vertical-align: baseline;
}
.button.is-gradient {
background: #c27c28;
background: -moz-linear-gradient(0deg, #c27c28 0%, #e5bc4e 100%);
background: -webkit-linear-gradient(
0deg, #c27c28 0%, #e5bc4e 100%);
background: linear-gradient(
0deg, #c27c28 0%, #e5bc4e 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c27c28", endColorstr="#e5bc4e", GradientType=1);
color: #000;
}
.input, .textarea {
background-color: #fff;
border-color: #dbdbdb;
color: #363636;
box-shadow: inset 0 1px 2px rgb(10 10 10 / 10%);
max-width: 100%;
width: 100%;
max-width: 400px;
position: relative;
}
.button, .input, .textarea, .select select, .file-cta, .file-name, .pagination-previous, .pagination-next, .pagination-link, .pagination-ellipsis {
-moz-appearance: none;
-webkit-appearance: none;
align-items: center;
border: 1px solid transparent;
border-radius: 4px;
box-shadow: none;
display: inline-flex;
font-size: 1rem;
height: 2.25em;
justify-content: flex-start;
line-height: 1.5;
padding-bottom: calc(.375em - 1px);
padding-left: calc(.625em - 1px);
padding-right: calc(.625em - 1px);
padding-top: calc(.375em - 1px);
position: relative;
vertical-align: top;
}
.button.is-large {
padding-left: 2.5rem;
padding-right: 2.5rem;
font-weight: 800;
}
.button.is-large {
font-size: 1.5rem;
}
.icon {
align-items: center;
display: inline-flex;
justify-content: center;
height: 1.5rem;
width: 1.5rem;
}
footer{
background: #2e1911;
border-top: 2px solid #c27c28;
color:#fff;
}
.footer-site{
font-size: 18px;
}
.footer-nav{
font-size: 14px;
color:#ccc;
}
.modal input{
border: 1px solid #000;
}
.modal p, .modal label, .modal label a, .modal label a:hover {
color: #000;
}
.blocker{
z-index: 20 !important;
}
.skip-reg{
display: block;
font-size: 12px;
padding-left: 20px;
padding-top: 5px;
}
@media screen and (max-width: 768px) {
.bg-right{
display: none;
}
.form-section{
background-position: center;
min-height: 100%;
}
.game{
flex-basis: calc(50% - 2rem);
max-width: calc(50% - 2rem);
}
}
@media screen and (max-width: 480px) {
.game{
flex-basis: calc(100% - 2rem);
max-width: calc(100% - 2rem);
}
}