html {
direction: ltr
}
/*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
html {
line-height: 1.15;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%
}
body {
margin: 0
}
article,
aside,
footer,
header,
nav,
section {
display: block
}
h1 {
font-size: 2em;
margin: 0.67em 0
}
figcaption,
figure {
display: block
}
figure {
margin: 1em 40px
}
hr {
box-sizing: content-box;
height: 0;
overflow: visible
}
main {
display: block
}
pre {
font-family: monospace, monospace;
font-size: 1em
}
a {
background-color: transparent;
-webkit-text-decoration-skip: objects
}
abbr[title] {
border-bottom: none;
text-decoration: underline;
text-decoration: underline dotted
}
b,
strong {
font-weight: inherit
}
b,
strong {
font-weight: bolder
}
code,
kbd,
samp {
font-family: monospace, monospace;
font-size: 1em
}
dfn {
font-style: italic
}
mark {
background-color: #ff0;
color: #000
}
small {
font-size: 80%
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
}
sub {
bottom: -0.25em
}
sup {
top: -0.5em
}
audio,
video {
display: inline-block
}
audio:not([controls]) {
display: none;
height: 0
}
img {
border-style: none
}
svg:not(:root) {
overflow: hidden
}
button,
input,
optgroup,
select,
textarea {
font-family: sans-serif;
font-size: 100%;
line-height: 1.15;
margin: 0
}
button {
overflow: visible
}
button,
select {
text-transform: none
}
button,
html [type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText
}
input {
overflow: visible
}
[type="checkbox"],
[type="radio"] {
box-sizing: border-box;
padding: 0
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto
}
[type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px
}
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none
}
::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit
}
fieldset {
padding: 0.35em 0.75em 0.625em
}
legend {
box-sizing: border-box;
display: table;
max-width: 100%;
padding: 0;
color: inherit;
white-space: normal
}
progress {
display: inline-block;
vertical-align: baseline
}
textarea {
overflow: auto
}
details {
display: block
}
summary {
display: list-item
}
menu {
display: block
}
canvas {
display: inline-block
}
template {
display: none
}
[hidden] {
display: none
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 1
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}
@-moz-keyframes fadeInDown {
0% {
opacity: 1
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}
@-ms-keyframes fadeInDown {
0% {
opacity: 1
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}
@-o-keyframes fadeInDown {
0% {
opacity: 1
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}
@keyframes fadeInDown {
0% {
opacity: 1
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}
@-webkit-keyframes fillHorizontal {
0% {
width: 0%
}
100% {
width: 100%
}
}
@-moz-keyframes fillHorizontal {
0% {
width: 0%
}
100% {
width: 100%
}
}
@-ms-keyframes fillHorizontal {
0% {
width: 0%
}
100% {
width: 100%
}
}
@-o-keyframes fillHorizontal {
0% {
width: 0%
}
100% {
width: 100%
}
}
@keyframes fillHorizontal {
0% {
width: 0%
}
100% {
width: 100%
}
}
@keyframes glowFilter {
from {
filter: drop-shadow(0 0 1px #fff) drop-shadow(0 0 3px #fff)
}
to {
filter: drop-shadow(0 0 2px #6d6743) drop-shadow(0 0 5px #6d6743)
}
}
@keyframes glowStrokeFilter {
from {
filter: drop-shadow(-1px -1px 0 white) drop-shadow(-1px 1px 0 white) drop-shadow(1px 1px 0 white) drop-shadow(1px -1px 0 white)
}
to {
filter: drop-shadow(-1px -1px 0 #6d6743) drop-shadow(-1px 1px 0 #6d6743) drop-shadow(1px 1px 0 #6d6743) drop-shadow(1px -1px 0 #6d6743)
}
}
@keyframes placeHolderShimmer {
0% {
background-position: 500px 0
}
100% {
background-position: -500px 0
}
}
.badge {
display: inline-block;
padding: .25rem 1.4rem;
font-size: 50%;
line-height: 1;
text-align: center;
white-space: nowrap;
vertical-align: middle;
border: .1rem solid transparent;
border-radius: .25rem
}
.badge-primary {
color: #6d6743;
background-color: rgba(0, 0, 0, 0.4);
border-color: #6d6743
}
*,
*:after,
*:before {
box-sizing: inherit
}
html {
box-sizing: border-box;
font-size: 62.5%;
width: 100%;
height: 100%
}
.main-content {
position: relative;
max-width: 100%;
-moz-transition: padding 0.3s ease-in-out, margin 0.3s ease-in-out, width 0.3s ease-in-out;
-o-transition: padding 0.3s ease-in-out, margin 0.3s ease-in-out, width 0.3s ease-in-out;
-webkit-transition: padding 0.3s ease-in-out, margin 0.3s ease-in-out, width 0.3s ease-in-out;
transition: padding 0.3s ease-in-out, margin 0.3s ease-in-out, width 0.3s ease-in-out;
margin: 0 auto;
width: calc(100% - 1rem)
}
@media (min-width: 480px) {
.main-content {
width: calc(48rem - 1.4rem)
}
}
@media (min-width: 768px) {
.main-content {
width: calc(76.8rem - 1.6rem)
}
}
@media (min-width: 1200px) {
.main-content {
width: calc(120rem - 2rem)
}
}
.main-content .main-content {
margin: 0 auto;
width: 100%
}
@media (min-width: 480px) {
.main-content .main-content {
width: calc(100% - 1.4rem)
}
}
@media (min-width: 768px) {
.main-content .main-content {
width: calc(100% - 1.6rem)
}
}
@media (min-width: 1200px) {
.main-content .main-content {
width: calc(100% - 2rem)
}
}
.main-content.page-content .top-space {
height: 12rem
}
.main-content.page-content .page-header .page-title h1 {
font-size: 4.6rem;
filter: drop-shadow(0 0 1.2rem #000);
margin-bottom: 1rem
}
.main-content.page-content .page-header .page-btns {
display: flex;
justify-content: center;
align-items: center;
align-content: center
}
.main-content.page-content-narrow {
margin-left: auto;
margin-right: auto;
max-width: 50rem
}
@media (min-width: 1200px) {
.main-content.page-content-narrow {
width: 60rem
}
}
.main-content.page-content-narrow-80 {
margin-left: auto;
margin-right: auto;
max-width: 80rem
}
@media (min-width: 1200px) {
.main-content.page-content-narrow-80 {
width: 80rem
}
}
@media (min-width: 1200px) {
.main-content.has-aside {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 0 3rem
}
.main-content.has-aside>.single-page-header {
grid-column: 1 / span 4
}
.main-content.has-aside>section {
grid-column: 1 / span 2
}
.main-content.has-aside>.aside {
grid-column: span 2
}
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0
}
.d-none {
display: none
}
.invisible {
visibility: hidden
}
hr {
height: 0;
border: 0 none;
border-top: 0.1rem solid rgba(0, 0, 0, 0.2);
width: 100%
}
.cookiealert {
position: sticky;
bottom: 0;
background-color: #111;
padding: 2rem;
font-size: 1.2rem
}
.cookiealert button {
margin: 0;
font-size: 1.2rem
}
figure {
margin: .5rem .5rem 2rem
}
figure figcaption {
font-size: 80%
}
.button,
.button,
button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
background-color: #6d6743;
border: .1rem solid #6d6743;
border-radius: .3rem;
color: #fff;
cursor: pointer;
display: inline-flex;
justify-content: center;
align-content: center;
align-items: center;
height: 4rem;
padding: .7rem 3rem;
text-align: center;
text-decoration: none;
white-space: nowrap;
font-family: 'LatoLatinWeb', sans-serif;
font-size: 1.4rem;
font-weight: 400;
line-height: 1;
letter-spacing: 0;
margin-bottom: 1rem;
-moz-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
-o-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
-webkit-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out
}
:lang(fa) .button,
:lang(fa) .button,
:lang(fa) button,
:lang(fa) input[type='button'],
:lang(fa) input[type='reset'],
:lang(fa) input[type='submit'] {
letter-spacing: 0
}
.button+.button,
.button+.button,
.button+button,
.button+input[type='button'],
.button+input[type='reset'],
.button+input[type='submit'],
.button+.button,
.button+.button,
.button+button,
.button+input[type='button'],
.button+input[type='reset'],
.button+input[type='submit'],
button+.button,
button+.button,
button+button,
button+input[type='button'],
button+input[type='reset'],
button+input[type='submit'],
input[type='button']+.button,
input[type='button']+.button,
input[type='button']+button,
input[type='button']+input[type='button'],
input[type='button']+input[type='reset'],
input[type='button']+input[type='submit'],
input[type='reset']+.button,
input[type='reset']+.button,
input[type='reset']+button,
input[type='reset']+input[type='button'],
input[type='reset']+input[type='reset'],
input[type='reset']+input[type='submit'],
input[type='submit']+.button,
input[type='submit']+.button,
input[type='submit']+button,
input[type='submit']+input[type='button'],
input[type='submit']+input[type='reset'],
input[type='submit']+input[type='submit'] {
margin-left: .5rem
}
.button .icon,
.button .img-icon,
.button .icon,
.button .img-icon,
button .icon,
button .img-icon,
input[type='button'] .icon,
input[type='button'] .img-icon,
input[type='reset'] .icon,
input[type='reset'] .img-icon,
input[type='submit'] .icon,
input[type='submit'] .img-icon {
width: 1.5rem;
align-items: center;
flex: 1 0 0
}
.button .icon-text,
.button .img-icon-text,
.button .icon-text,
.button .img-icon-text,
button .icon-text,
button .img-icon-text,
input[type='button'] .icon-text,
input[type='button'] .img-icon-text,
input[type='reset'] .icon-text,
input[type='reset'] .img-icon-text,
input[type='submit'] .icon-text,
input[type='submit'] .img-icon-text {
color: #fff;
flex: 3 0 0
}
.button [class^="linearicons-"],
.button [class^="icon-"],
.button [class^="linearicons-"],
.button [class^="icon-"],
button [class^="linearicons-"],
button [class^="icon-"],
input[type='button'] [class^="linearicons-"],
input[type='button'] [class^="icon-"],
input[type='reset'] [class^="linearicons-"],
input[type='reset'] [class^="icon-"],
input[type='submit'] [class^="linearicons-"],
input[type='submit'] [class^="icon-"] {
font-size: 1.9rem;
line-height: 2.4rem;
vertical-align: text-top
}
.button:active,
.button:visited,
.button:link,
.button:active,
.button:visited,
.button:link,
button:active,
button:visited,
button:link,
input[type='button']:active,
input[type='button']:visited,
input[type='button']:link,
input[type='reset']:active,
input[type='reset']:visited,
input[type='reset']:link,
input[type='submit']:active,
input[type='submit']:visited,
input[type='submit']:link {
color: #163a6a
}
.button:focus,
.button:hover,
.button:focus,
.button:hover,
button:focus,
button:hover,
input[type='button']:focus,
input[type='button']:hover,
input[type='reset']:focus,
input[type='reset']:hover,
input[type='submit']:focus,
input[type='submit']:hover {
background-color: #fffbb1;
border-color: #fffbb1;
color: #000;
outline: 0;
box-shadow: none
}
.button[disabled],
.button[disabled],
button[disabled],
input[type='button'][disabled],
input[type='reset'][disabled],
input[type='submit'][disabled] {
cursor: default;
opacity: .5
}
.button[disabled]:focus,
.button[disabled]:hover,
.button[disabled]:focus,
.button[disabled]:hover,
button[disabled]:focus,
button[disabled]:hover,
input[type='button'][disabled]:focus,
input[type='button'][disabled]:hover,
input[type='reset'][disabled]:focus,
input[type='reset'][disabled]:hover,
input[type='submit'][disabled]:focus,
input[type='submit'][disabled]:hover {
background-color: #6d6743;
border-color: #6d6743
}
.button.button-white,
.button.button-white,
button.button-white,
input[type='button'].button-white,
input[type='reset'].button-white,
input[type='submit'].button-white {
background-color: rgba(255, 255, 255, 0.3);
border-color: transparent;
color: #fff
}
.button.button-white:focus,
.button.button-white:hover,
.button.button-white:focus,
.button.button-white:hover,
button.button-white:focus,
button.button-white:hover,
input[type='button'].button-white:focus,
input[type='button'].button-white:hover,
input[type='reset'].button-white:focus,
input[type='reset'].button-white:hover,
input[type='submit'].button-white:focus,
input[type='submit'].button-white:hover {
background-color: rgba(255, 255, 255, 0.1);
border-color: transparent;
color: #fff
}
.button.button-white[disabled]:focus,
.button.button-white[disabled]:hover,
.button.button-white[disabled]:focus,
.button.button-white[disabled]:hover,
button.button-white[disabled]:focus,
button.button-white[disabled]:hover,
input[type='button'].button-white[disabled]:focus,
input[type='button'].button-white[disabled]:hover,
input[type='reset'].button-white[disabled]:focus,
input[type='reset'].button-white[disabled]:hover,
input[type='submit'].button-white[disabled]:focus,
input[type='submit'].button-white[disabled]:hover {
color: rgba(255, 255, 255, 0.7)
}
.button.button-black,
.button.button-black,
button.button-black,
input[type='button'].button-black,
input[type='reset'].button-black,
input[type='submit'].button-black {
background-color: rgba(0, 0, 0, 0.3);
border-color: transparent;
color: #fff
}
.button.button-black:focus,
.button.button-black:hover,
.button.button-black:focus,
.button.button-black:hover,
button.button-black:focus,
button.button-black:hover,
input[type='button'].button-black:focus,
input[type='button'].button-black:hover,
input[type='reset'].button-black:focus,
input[type='reset'].button-black:hover,
input[type='submit'].button-black:focus,
input[type='submit'].button-black:hover {
background-color: rgba(0, 0, 0, 0.6);
border-color: transparent;
color: #fff
}
.button.button-black[disabled]:focus,
.button.button-black[disabled]:hover,
.button.button-black[disabled]:focus,
.button.button-black[disabled]:hover,
button.button-black[disabled]:focus,
button.button-black[disabled]:hover,
input[type='button'].button-black[disabled]:focus,
input[type='button'].button-black[disabled]:hover,
input[type='reset'].button-black[disabled]:focus,
input[type='reset'].button-black[disabled]:hover,
input[type='submit'].button-black[disabled]:focus,
input[type='submit'].button-black[disabled]:hover {
color: rgba(0, 0, 0, 0.2)
}
.button.button-success,
.button.button-success,
button.button-success,
input[type='button'].button-success,
input[type='reset'].button-success,
input[type='submit'].button-success {
background-color: #00ff72;
border-color: transparent;
color: #fff
}
.button.button-success:focus,
.button.button-success:hover,
.button.button-success:focus,
.button.button-success:hover,
button.button-success:focus,
button.button-success:hover,
input[type='button'].button-success:focus,
input[type='button'].button-success:hover,
input[type='reset'].button-success:focus,
input[type='reset'].button-success:hover,
input[type='submit'].button-success:focus,
input[type='submit'].button-success:hover {
background-color: #33ff8e;
border-color: transparent;
color: #fff
}
.button.button-success[disabled]:focus,
.button.button-success[disabled]:hover,
.button.button-success[disabled]:focus,
.button.button-success[disabled]:hover,
button.button-success[disabled]:focus,
button.button-success[disabled]:hover,
input[type='button'].button-success[disabled]:focus,
input[type='button'].button-success[disabled]:hover,
input[type='reset'].button-success[disabled]:focus,
input[type='reset'].button-success[disabled]:hover,
input[type='submit'].button-success[disabled]:focus,
input[type='submit'].button-success[disabled]:hover {
color: rgba(255, 255, 255, 0.7)
}
.button.button-warning,
.button.button-warning,
button.button-warning,
input[type='button'].button-warning,
input[type='reset'].button-warning,
input[type='submit'].button-warning {
background-color: #ff5a00;
border-color: transparent;
color: #fff
}
.button.button-warning:focus,
.button.button-warning:hover,
.button.button-warning:focus,
.button.button-warning:hover,
button.button-warning:focus,
button.button-warning:hover,
input[type='button'].button-warning:focus,
input[type='button'].button-warning:hover,
input[type='reset'].button-warning:focus,
input[type='reset'].button-warning:hover,
input[type='submit'].button-warning:focus,
input[type='submit'].button-warning:hover {
background-color: #ff7b33;
border-color: transparent;
color: #fff
}
.button.button-warning[disabled]:focus,
.button.button-warning[disabled]:hover,
.button.button-warning[disabled]:focus,
.button.button-warning[disabled]:hover,
button.button-warning[disabled]:focus,
button.button-warning[disabled]:hover,
input[type='button'].button-warning[disabled]:focus,
input[type='button'].button-warning[disabled]:hover,
input[type='reset'].button-warning[disabled]:focus,
input[type='reset'].button-warning[disabled]:hover,
input[type='submit'].button-warning[disabled]:focus,
input[type='submit'].button-warning[disabled]:hover {
color: rgba(255, 255, 255, 0.7)
}
.button.button-install,
.button.button-install,
button.button-install,
input[type='button'].button-install,
input[type='reset'].button-install,
input[type='submit'].button-install {
background-color: #fdc038;
border-color: transparent;
color: #fff
}
.button.button-install:focus,
.button.button-install:hover,
.button.button-install:focus,
.button.button-install:hover,
button.button-install:focus,
button.button-install:hover,
input[type='button'].button-install:focus,
input[type='button'].button-install:hover,
input[type='reset'].button-install:focus,
input[type='reset'].button-install:hover,
input[type='submit'].button-install:focus,
input[type='submit'].button-install:hover {
background-color: #fed06a;
border-color: transparent;
color: #fff
}
.button.button-install[disabled]:focus,
.button.button-install[disabled]:hover,
.button.button-install[disabled]:focus,
.button.button-install[disabled]:hover,
button.button-install[disabled]:focus,
button.button-install[disabled]:hover,
input[type='button'].button-install[disabled]:focus,
input[type='button'].button-install[disabled]:hover,
input[type='reset'].button-install[disabled]:focus,
input[type='reset'].button-install[disabled]:hover,
input[type='submit'].button-install[disabled]:focus,
input[type='submit'].button-install[disabled]:hover {
color: rgba(255, 255, 255, 0.7)
}
.button.button-play,
.button.button-play,
button.button-play,
input[type='button'].button-play,
input[type='reset'].button-play,
input[type='submit'].button-play {
background-color: rgba(126, 126, 126, 0.5);
border-color: transparent;
color: #fff
}
.button.button-play:focus,
.button.button-play:hover,
.button.button-play:focus,
.button.button-play:hover,
button.button-play:focus,
button.button-play:hover,
input[type='button'].button-play:focus,
input[type='button'].button-play:hover,
input[type='reset'].button-play:focus,
input[type='reset'].button-play:hover,
input[type='submit'].button-play:focus,
input[type='submit'].button-play:hover {
background-color: #fcb006;
border-color: transparent;
color: #fff
}
.button.button-play[disabled]:focus,
.button.button-play[disabled]:hover,
.button.button-play[disabled]:focus,
.button.button-play[disabled]:hover,
button.button-play[disabled]:focus,
button.button-play[disabled]:hover,
input[type='button'].button-play[disabled]:focus,
input[type='button'].button-play[disabled]:hover,
input[type='reset'].button-play[disabled]:focus,
input[type='reset'].button-play[disabled]:hover,
input[type='submit'].button-play[disabled]:focus,
input[type='submit'].button-play[disabled]:hover {
color: rgba(255, 255, 255, 0.7)
}
.button.button-list,
.button.button-list,
button.button-list,
input[type='button'].button-list,
input[type='reset'].button-list,
input[type='submit'].button-list {
background-color: #00a651;
border-color: transparent;
color: #fff
}
.button.button-list:focus,
.button.button-list:hover,
.button.button-list:focus,
.button.button-list:hover,
button.button-list:focus,
button.button-list:hover,
input[type='button'].button-list:focus,
input[type='button'].button-list:hover,
input[type='reset'].button-list:focus,
input[type='reset'].button-list:hover,
input[type='submit'].button-list:focus,
input[type='submit'].button-list:hover {
background-color: #00d96a;
border-color: transparent;
color: #fff
}
.button.button-list[disabled]:focus,
.button.button-list[disabled]:hover,
.button.button-list[disabled]:focus,
.button.button-list[disabled]:hover,
button.button-list[disabled]:focus,
button.button-list[disabled]:hover,
input[type='button'].button-list[disabled]:focus,
input[type='button'].button-list[disabled]:hover,
input[type='reset'].button-list[disabled]:focus,
input[type='reset'].button-list[disabled]:hover,
input[type='submit'].button-list[disabled]:focus,
input[type='submit'].button-list[disabled]:hover {
color: rgba(255, 255, 255, 0.7)
}
.button.button-clear,
.button.button-clear,
button.button-clear,
input[type='button'].button-clear,
input[type='reset'].button-clear,
input[type='submit'].button-clear {
background-color: transparent;
border-color: transparent;
color: #6d6743
}
.button.button-clear:focus,
.button.button-clear:hover,
.button.button-clear:focus,
.button.button-clear:hover,
button.button-clear:focus,
button.button-clear:hover,
input[type='button'].button-clear:focus,
input[type='button'].button-clear:hover,
input[type='reset'].button-clear:focus,
input[type='reset'].button-clear:hover,
input[type='submit'].button-clear:focus,
input[type='submit'].button-clear:hover {
background-color: transparent;
border-color: transparent;
color: #fffbb1
}
.button.button-clear[disabled]:focus,
.button.button-clear[disabled]:hover,
.button.button-clear[disabled]:focus,
.button.button-clear[disabled]:hover,
button.button-clear[disabled]:focus,
button.button-clear[disabled]:hover,
input[type='button'].button-clear[disabled]:focus,
input[type='button'].button-clear[disabled]:hover,
input[type='reset'].button-clear[disabled]:focus,
input[type='reset'].button-clear[disabled]:hover,
input[type='submit'].button-clear[disabled]:focus,
input[type='submit'].button-clear[disabled]:hover {
color: #6d6743
}
.button.button-block,
.button.button-block,
button.button-block,
input[type='button'].button-block,
input[type='reset'].button-block,
input[type='submit'].button-block {
width: 100%
}
.button.button-working,
.button.button-working,
button.button-working,
input[type='button'].button-working,
input[type='reset'].button-working,
input[type='submit'].button-working {
pointer-events: none;
position: relative
}
.button.button-working:before,
.button.button-working:before,
button.button-working:before,
input[type='button'].button-working:before,
input[type='reset'].button-working:before,
input[type='submit'].button-working:before {
content: '';
z-index: 1;
position: absolute;
top: -.1rem;
right: -.1rem;
bottom: -.1rem;
left: -.1rem;
border-radius: .3rem;
background-color: rgba(0, 0, 0, 0.7)
}
.button.button-working:after,
.button.button-working:after,
button.button-working:after,
input[type='button'].button-working:after,
input[type='reset'].button-working:after,
input[type='submit'].button-working:after {
content: '';
z-index: 1;
position: absolute;
width: 4rem;
height: 100%;
margin-left: -2rem;
border-radius: 50%;
top: 0;
left: 50%;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-size: contain
}
.button.button-small,
.button.button-small,
button.button-small,
input[type='button'].button-small,
input[type='reset'].button-small,
input[type='submit'].button-small {
font-family: 'LatoLatinWeb', sans-serif;
font-size: 1.3rem;
line-height: 1.6rem;
border-radius: .5rem;
padding: .6rem 1.5rem
}
.button.button-xsmall,
.button.button-xsmall,
button.button-xsmall,
input[type='button'].button-xsmall,
input[type='reset'].button-xsmall,
input[type='submit'].button-xsmall {
font-family: 'LatoLatinWeb', sans-serif;
font-size: 1.2rem;
line-height: 1.4rem;
border-radius: .5rem;
padding: .5rem 1.2rem
}
.button.button-xsmall.button-working:before,
.button.button-xsmall.button-working:before,
button.button-xsmall.button-working:before,
input[type='button'].button-xsmall.button-working:before,
input[type='reset'].button-xsmall.button-working:before,
input[type='submit'].button-xsmall.button-working:before {
border-radius: .5rem;
background-color: rgba(0, 0, 0, 0.7)
}
.button.button-xsmall.button-working:after,
.button.button-xsmall.button-working:after,
button.button-xsmall.button-working:after,
input[type='button'].button-xsmall.button-working:after,
input[type='reset'].button-xsmall.button-working:after,
input[type='submit'].button-xsmall.button-working:after {
width: 2.4rem;
height: 2.4rem;
top: 0;
left: 50%;
margin-left: -1.2rem
}
.button.button-selector,
.button.button-selector,
button.button-selector,
input[type='button'].button-selector,
input[type='reset'].button-selector,
input[type='submit'].button-selector {
display: none
}
.button.button-selector-xsmall,
.button.button-selector-wide,
input.button.button-selector-wide[type='button'],
input.button.button-selector-wide[type='reset'],
input.button.button-selector-wide[type='submit'],
.button.button-selector-xsmall,
.button.button-selector-wide,
input.button.button-selector-wide[type='button'],
input.button.button-selector-wide[type='reset'],
input.button.button-selector-wide[type='submit'],
button.button-selector-xsmall,
button.button-selector-wide,
input[type='button'].button-selector-xsmall,
input.button-selector-wide[type='button'],
input[type='reset'].button-selector-xsmall,
input.button-selector-wide[type='reset'],
input[type='submit'].button-selector-xsmall,
input.button-selector-wide[type='submit'] {
font-family: 'LatoLatinWeb', sans-serif;
font-size: 1.2rem;
line-height: 1.4rem;
border-radius: .5rem;
padding: .5rem 1.2rem;
background-color: rgba(255, 255, 255, 0.3);
border: none;
color: #fff;
width: 4rem;
height: 4rem
}
.button.button-selector-xsmall:hover,
.button.button-selector-wide:hover,
.button.button-selector-xsmall:hover,
.button.button-selector-wide:hover,
button.button-selector-xsmall:hover,
button.button-selector-wide:hover,
input[type='button'].button-selector-xsmall:hover,
input.button-selector-wide[type='button']:hover,
input[type='reset'].button-selector-xsmall:hover,
input.button-selector-wide[type='reset']:hover,
input[type='submit'].button-selector-xsmall:hover,
input.button-selector-wide[type='submit']:hover {
background-color: #6d6743
}
.button.button-selector:checked+.button.button-selector-xsmall,
.button.button-selector:checked+.button.button-selector-wide,
.button.button-selector:checked+.button.button-selector-xsmall,
.button.button-selector:checked+.button.button-selector-wide,
button.button-selector:checked+.button.button-selector-xsmall,
button.button-selector:checked+.button.button-selector-wide,
input[type='button'].button-selector:checked+.button.button-selector-xsmall,
input[type='button'].button-selector:checked+.button.button-selector-wide,
input[type='reset'].button-selector:checked+.button.button-selector-xsmall,
input[type='reset'].button-selector:checked+.button.button-selector-wide,
input[type='submit'].button-selector:checked+.button.button-selector-xsmall,
input[type='submit'].button-selector:checked+.button.button-selector-wide,
.button.button-selector:checked+.button.button-selector-xsmall,
.button.button-selector:checked+.button.button-selector-wide,
.button.button-selector:checked+.button.button-selector-xsmall,
.button.button-selector:checked+.button.button-selector-wide,
button.button-selector:checked+.button.button-selector-xsmall,
button.button-selector:checked+.button.button-selector-wide,
input[type='button'].button-selector:checked+.button.button-selector-xsmall,
input[type='button'].button-selector:checked+.button.button-selector-wide,
input[type='reset'].button-selector:checked+.button.button-selector-xsmall,
input[type='reset'].button-selector:checked+.button.button-selector-wide,
input[type='submit'].button-selector:checked+.button.button-selector-xsmall,
input[type='submit'].button-selector:checked+.button.button-selector-wide,
.button.button-selector:checked+button.button-selector-xsmall,
.button.button-selector:checked+button.button-selector-wide,
.button.button-selector:checked+button.button-selector-xsmall,
.button.button-selector:checked+button.button-selector-wide,
button.button-selector:checked+button.button-selector-xsmall,
button.button-selector:checked+button.button-selector-wide,
input[type='button'].button-selector:checked+button.button-selector-xsmall,
input[type='button'].button-selector:checked+button.button-selector-wide,
input[type='reset'].button-selector:checked+button.button-selector-xsmall,
input[type='reset'].button-selector:checked+button.button-selector-wide,
input[type='submit'].button-selector:checked+button.button-selector-xsmall,
input[type='submit'].button-selector:checked+button.button-selector-wide,
.button.button-selector:checked+input[type='button'].button-selector-xsmall,
.button.button-selector:checked+input.button-selector-wide[type='button'],
.button.button-selector:checked+input[type='button'].button-selector-xsmall,
.button.button-selector:checked+input.button-selector-wide[type='button'],
button.button-selector:checked+input[type='button'].button-selector-xsmall,
button.button-selector:checked+input.button-selector-wide[type='button'],
input[type='button'].button-selector:checked+input[type='button'].button-selector-xsmall,
input[type='button'].button-selector:checked+input.button-selector-wide[type='button'],
input[type='reset'].button-selector:checked+input[type='button'].button-selector-xsmall,
input[type='reset'].button-selector:checked+input.button-selector-wide[type='button'],
input[type='submit'].button-selector:checked+input[type='button'].button-selector-xsmall,
input[type='submit'].button-selector:checked+input.button-selector-wide[type='button'],
.button.button-selector:checked+input[type='reset'].button-selector-xsmall,
.button.button-selector:checked+input.button-selector-wide[type='reset'],
.button.button-selector:checked+input[type='reset'].button-selector-xsmall,
.button.button-selector:checked+input.button-selector-wide[type='reset'],
button.button-selector:checked+input[type='reset'].button-selector-xsmall,
button.button-selector:checked+input.button-selector-wide[type='reset'],
input[type='button'].button-selector:checked+input[type='reset'].button-selector-xsmall,
input[type='button'].button-selector:checked+input.button-selector-wide[type='reset'],
input[type='reset'].button-selector:checked+input[type='reset'].button-selector-xsmall,
input[type='reset'].button-selector:checked+input.button-selector-wide[type='reset'],
input[type='submit'].button-selector:checked+input[type='reset'].button-selector-xsmall,
input[type='submit'].button-selector:checked+input.button-selector-wide[type='reset'],
.button.button-selector:checked+input[type='submit'].button-selector-xsmall,
.button.button-selector:checked+input.button-selector-wide[type='submit'],
.button.button-selector:checked+input[type='submit'].button-selector-xsmall,
.button.button-selector:checked+input.button-selector-wide[type='submit'],
button.button-selector:checked+input[type='submit'].button-selector-xsmall,
button.button-selector:checked+input.button-selector-wide[type='submit'],
input[type='button'].button-selector:checked+input[type='submit'].button-selector-xsmall,
input[type='button'].button-selector:checked+input.button-selector-wide[type='submit'],
input[type='reset'].button-selector:checked+input[type='submit'].button-selector-xsmall,
input[type='reset'].button-selector:checked+input.button-selector-wide[type='submit'],
input[type='submit'].button-selector:checked+input[type='submit'].button-selector-xsmall,
input[type='submit'].button-selector:checked+input.button-selector-wide[type='submit'] {
background-color: #6d6743
}
.button.button-selector-wide,
.button.button-selector-wide,
button.button-selector-wide,
input[type='button'].button-selector-wide,
input[type='reset'].button-selector-wide,
input[type='submit'].button-selector-wide {
height: 3rem;
width: auto;
min-width: 15rem
}
.button.button-upload,
.button.button-upload,
button.button-upload,
input[type='button'].button-upload,
input[type='reset'].button-upload,
input[type='submit'].button-upload {
position: relative
}
.button.button-upload input[type="file"],
.button.button-upload input[type="file"],
button.button-upload input[type="file"],
input[type='button'].button-upload input[type="file"],
input[type='reset'].button-upload input[type="file"],
input[type='submit'].button-upload input[type="file"] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0
}
.button.split-button,
.button.split-button,
button.split-button,
input[type='button'].split-button,
input[type='reset'].split-button,
input[type='submit'].split-button {
display: flex;
flex-direction: row;
padding: 0;
background-color: transparent;
justify-content: center
}
.button.split-button:hover .split-button-section:first-child,
.button.split-button:hover .split-button-section:first-child,
button.split-button:hover .split-button-section:first-child,
input[type='button'].split-button:hover .split-button-section:first-child,
input[type='reset'].split-button:hover .split-button-section:first-child,
input[type='submit'].split-button:hover .split-button-section:first-child {
flex: 1 0 auto
}
.button.split-button:hover .split-button-section .split-button-section,
.button.split-button:hover .split-button-section .split-button-section,
button.split-button:hover .split-button-section .split-button-section,
input[type='button'].split-button:hover .split-button-section .split-button-section,
input[type='reset'].split-button:hover .split-button-section .split-button-section,
input[type='submit'].split-button:hover .split-button-section .split-button-section {
flex: 0 1 auto
}
.button.split-button .split-button-section,
.button.split-button .split-button-section,
button.split-button .split-button-section,
input[type='button'].split-button .split-button-section,
input[type='reset'].split-button .split-button-section,
input[type='submit'].split-button .split-button-section {
display: flex;
flex-direction: column;
width: 50%;
height: calc(4rem - (.1rem * 2));
padding: 1rem 3rem;
justify-content: center;
overflow: hidden;
flex: 1 0 auto;
-moz-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out, flex-grow 0.3s ease-in-out, flex-shrink 0.3s ease-in-out;
-o-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out, flex-grow 0.3s ease-in-out, flex-shrink 0.3s ease-in-out;
-webkit-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out, flex-grow 0.3s ease-in-out, flex-shrink 0.3s ease-in-out;
transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out, flex-grow 0.3s ease-in-out, flex-shrink 0.3s ease-in-out
}
.button.split-button .split-button-section:first-child,
.button.split-button .split-button-section:first-child,
button.split-button .split-button-section:first-child,
input[type='button'].split-button .split-button-section:first-child,
input[type='reset'].split-button .split-button-section:first-child,
input[type='submit'].split-button .split-button-section:first-child {
background-color: #6d6743
}
.button.split-button .split-button-section:last-child,
.button.split-button .split-button-section:last-child,
button.split-button .split-button-section:last-child,
input[type='button'].split-button .split-button-section:last-child,
input[type='reset'].split-button .split-button-section:last-child,
input[type='submit'].split-button .split-button-section:last-child {
background-color: rgba(0, 0, 0, 0.8)
}
.button.split-button .split-button-section.split-button-section-second,
.button.split-button .split-button-section.split-button-section-second,
button.split-button .split-button-section.split-button-section-second,
input[type='button'].split-button .split-button-section.split-button-section-second,
input[type='reset'].split-button .split-button-section.split-button-section-second,
input[type='submit'].split-button .split-button-section.split-button-section-second {
padding: 0.8rem 1rem 0.8rem 1rem
}
.button.split-button .split-button-section .split-button-section,
.button.split-button .split-button-section .split-button-section,
button.split-button .split-button-section .split-button-section,
input[type='button'].split-button .split-button-section .split-button-section,
input[type='reset'].split-button .split-button-section .split-button-section,
input[type='submit'].split-button .split-button-section .split-button-section {
flex-direction: row;
justify-content: center;
font-size: 1rem;
width: 100%;
height: 50%;
padding: 0;
color: #6d6743
}
.button.split-button .split-button-section .split-button-section:first-child,
.button.split-button .split-button-section .split-button-section:first-child,
button.split-button .split-button-section .split-button-section:first-child,
input[type='button'].split-button .split-button-section .split-button-section:first-child,
input[type='reset'].split-button .split-button-section .split-button-section:first-child,
input[type='submit'].split-button .split-button-section .split-button-section:first-child {
background-color: transparent
}
.button.split-button .split-button-section .split-button-section:last-child,
.button.split-button .split-button-section .split-button-section:last-child,
button.split-button .split-button-section .split-button-section:last-child,
input[type='button'].split-button .split-button-section .split-button-section:last-child,
input[type='reset'].split-button .split-button-section .split-button-section:last-child,
input[type='submit'].split-button .split-button-section .split-button-section:last-child {
background-color: transparent
}
@keyframes working-button {
0% {
background: #6d6743
}
50% {
background: #7e7e7e
}
100% {
background: #6d6743
}
}
.tooltip {
position: relative;
display: inline-block
}
[title],
[tooltip] {
position: relative
}
[title]:after,
[title]:before,
[tooltip]:after,
[tooltip]:before {
-moz-transition: opacity 0.3s ease-in-out;
-o-transition: opacity 0.3s ease-in-out;
-webkit-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out
}
[title]:after,
[tooltip]:after {
content: attr(tooltip);
position: absolute;
opacity: 0;
white-space: nowrap;
width: auto;
height: 2rem;
pointer-events: none;
padding: 0.5rem;
border-radius: .3rem;
background-color: #fff;
color: #000;
top: -2.5rem;
font-size: 1.2rem;
line-height: 1.2rem
}
[title]:before,
[tooltip]:before {
content: '';
position: absolute;
opacity: 0;
width: 0;
border: .5rem solid transparent;
border-top-color: #fff;
top: -.5rem
}
[title]:hover,
[tooltip]:hover {
z-index: 200
}
[title]:hover:after,
[title]:hover:before,
[tooltip]:hover:after,
[tooltip]:hover:before {
z-index: 201;
opacity: 1
}
[title][tooltip-position='top']:after,
[tooltip][tooltip-position='top']:after {
top: -2.5rem
}
[title][tooltip-position='top']:before,
[tooltip][tooltip-position='top']:before {
border-top-color: #fff;
top: -.5rem
}
[title][tooltip-position='bottom']:after,
[tooltip][tooltip-position='bottom']:after {
bottom: -2.5rem
}
[title][tooltip-position='bottom']:before,
[tooltip][tooltip-position='bottom']:before {
border-bottom-color: #fff;
bottom: -.5rem
}
[title]:after {
content: attr(title)
}
.container {
margin: 0 auto;
max-width: 112rem;
padding: 0 .5rem;
position: relative;
width: 100%
}
.container.padded {
padding: 0 1rem
}
.container.narrow {
max-width: 80rem
}
.row {
display: flex;
flex-direction: column;
padding: 0;
width: 100%
}
.row.row-no-padding {
padding: 0
}
.row.row-no-padding>.column {
padding: 0
}
.row.row-wrap {
flex-wrap: wrap
}
.row.row-top {
align-items: flex-start
}
.row.row-bottom {
align-items: flex-end
}
.row.row-center {
align-items: center
}
.row.row-stretch {
align-items: stretch
}
.row.row-baseline {
align-items: baseline
}
.row.row-forced {
flex-direction: row;
margin-left: 0;
width: 100%
}
.row.row-forced .column {
margin-bottom: inherit;
padding: 0 1rem
}
.row.row-forced .column.column-20 {
flex: 0 0 50%;
max-width: 50%
}
.row.row-forced .column.column-20:nth-child(odd) {
padding-left: 0;
padding-right: 0.5rem
}
.row.row-forced .column.column-20:nth-child(even) {
padding-right: 0;
padding-left: 0.5rem
}
.row .column {
display: block;
flex: 1 1 auto;
margin-left: 0;
max-width: 100%;
width: 100%
}
.row .column .column-top {
align-self: flex-start
}
.row .column .column-bottom {
align-self: flex-end
}
.row .column .column-center {
align-self: center
}
@media (min-width: 40rem) {
.container {
padding: 0 2rem
}
.container.padded {
padding: 0 2rem
}
.row {
flex-direction: row;
margin-left: -1rem;
width: calc(100% + 2.0rem)
}
.row .column {
margin-bottom: inherit;
padding: 0 1rem
}
.row .column.column-center {
margin-left: auto;
margin-right: auto
}
.row .column.column-right {
margin-left: auto
}
.row .column.column-40-last {
margin-left: 60%
}
.row .column.column-60-first {
margin-left: -100%
}
.row .column.column-offset-10 {
margin-left: 33.3333%
}
.row .column.column-offset-20 {
margin-left: 33.3333%
}
.row .column.column-offset-25 {
margin-left: 33.3333%
}
.row .column.column-offset-33,
.row .column.column-offset-34 {
margin-left: 33.3333%
}
.row .column.column-offset-50 {
margin-left: 50%
}
.row .column.column-offset-66,
.row .column.column-offset-67 {
margin-left: 66.6666%
}
.row .column.column-offset-75 {
margin-left: 66.6666%
}
.row .column.column-offset-80 {
margin-left: 66.6666%
}
.row .column.column-offset-90 {
margin-left: 66.6666%
}
.row .column.column-10 {
flex: 0 0 33.3333%;
max-width: 33.3333%
}
.row .column.column-20 {
flex: 0 0 33.3333%;
max-width: 33.3333%
}
.row .column.column-25 {
flex: 0 0 33.3333%;
max-width: 33.3333%
}
.row .column.column-33,
.row .column.column-34 {
flex: 0 0 33.3333%;
max-width: 33.3333%
}
.row .column.column-40 {
flex: 0 0 66.6666%;
max-width: 66.6666%
}
.row .column.column-50 {
flex: 0 0 50%;
max-width: 50%
}
.row .column.column-60 {
flex: 0 0 66.6666%;
max-width: 66.6666%
}
.row .column.column-66,
.row .column.column-67 {
flex: 0 0 66.6666%;
max-width: 66.6666%
}
.row .column.column-75 {
flex: 0 0 66.6666%;
max-width: 66.6666%
}
.row .column.column-80 {
flex: 0 0 66.6666%;
max-width: 66.6666%
}
.row .column.column-90 {
flex: 0 0 66.6666%;
max-width: 66.6666%
}
.row .column.column-100 {
flex: 0 0 100%;
max-width: 100%
}
.row .column.column-center-content {
justify-content: center;
margin-left: auto;
margin-right: auto;
max-width: calc(100% - 20rem)
}
.row.row-forced .column.column-20 {
flex: 0 0 33.3333%;
max-width: 33.3333%
}
.row.row-forced .column.column-20:nth-child(odd) {
padding-left: 1rem;
padding-right: 1rem
}
.row.row-forced .column.column-20:nth-child(even) {
padding-left: 1rem;
padding-right: 1rem
}
}
@media (min-width: 80rem) {
.container {
padding: 0 2rem
}
.container.padded {
padding: 0 2rem
}
.row {
flex-direction: row;
margin-left: -1rem;
width: calc(100% + 2.0rem)
}
.row .column {
margin-bottom: inherit;
padding: 0 1rem
}
.row .column.column-offset-10 {
margin-left: 10%
}
.row .column.column-offset-20 {
margin-left: 20%
}
.row .column.column-offset-25 {
margin-left: 25%
}
.row .column.column-offset-33,
.row .column.column-offset-34 {
margin-left: 33.3333%
}
.row .column.column-offset-50 {
margin-left: 50%
}
.row .column.column-offset-66,
.row .column.column-offset-67 {
margin-left: 66.6666%
}
.row .column.column-offset-75 {
margin-left: 75%
}
.row .column.column-offset-80 {
margin-left: 80%
}
.row .column.column-offset-90 {
margin-left: 90%
}
.row .column.column-10 {
flex: 0 0 10%;
max-width: 10%
}
.row .column.column-20 {
flex: 0 0 20%;
max-width: 20%
}
.row .column.column-25 {
flex: 0 0 25%;
max-width: 25%
}
.row .column.column-33,
.row .column.column-34 {
flex: 0 0 33.3333%;
max-width: 33.3333%
}
.row .column.column-40 {
flex: 0 0 40%;
max-width: 40%
}
.row .column.column-50 {
flex: 0 0 50%;
max-width: 50%
}
.row .column.column-60 {
flex: 0 0 60%;
max-width: 60%
}
.row .column.column-66,
.row .column.column-67 {
flex: 0 0 66.6666%;
max-width: 66.6666%
}
.row .column.column-75 {
flex: 0 0 75%;
max-width: 75%
}
.row .column.column-80 {
flex: 0 0 80%;
max-width: 80%
}
.row .column.column-90 {
flex: 0 0 90%;
max-width: 90%
}
.row .column.column-center-content {
justify-content: center;
margin-left: auto;
margin-right: auto;
max-width: calc(100% - 40rem)
}
.row.row-forced .column.column-20 {
flex: 0 0 20%;
max-width: 20%
}
.row.row-forced .column.column-20:nth-child(odd) {
padding-left: 1rem;
padding-right: 1rem
}
.row.row-forced .column.column-20:nth-child(even) {
padding-left: 1rem;
padding-right: 1rem
}
}
input[type='email'],
input[type='number'],
input[type='password'],
input[type='search'],
input[type='tel'],
input[type='text'],
input[type='url'],
input[type='date'],
textarea,
select {
appearance: none;
background-color: #fff;
border: .1rem solid rgba(0, 0, 0, 0);
border-radius: .3rem;
box-shadow: none;
box-sizing: inherit;
-webkit-appearance: none;
appearance: none;
padding: .7rem;
width: 100%;
font-family: 'LatoLatinWeb', sans-serif;
line-height: 1.15;
box-shadow: 0 0 2px #7e7e7e;
-moz-transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
-o-transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
-webkit-transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out
}
input[type='email']:focus,
input[type='email']:focus:hover,
input[type='number']:focus,
input[type='number']:focus:hover,
input[type='password']:focus,
input[type='password']:focus:hover,
input[type='search']:focus,
input[type='search']:focus:hover,
input[type='tel']:focus,
input[type='tel']:focus:hover,
input[type='text']:focus,
input[type='text']:focus:hover,
input[type='url']:focus,
input[type='url']:focus:hover,
input[type='date']:focus,
input[type='date']:focus:hover,
textarea:focus,
textarea:focus:hover,
select:focus,
select:focus:hover {
border-color: #6d6743;
outline: 0
}
input[type='email']::placeholder,
input[type='number']::placeholder,
input[type='password']::placeholder,
input[type='search']::placeholder,
input[type='tel']::placeholder,
input[type='text']::placeholder,
input[type='url']::placeholder,
input[type='date']::placeholder,
textarea::placeholder,
select::placeholder {
color: #c9c9c9
}
input[type='email']:invalid,
input[type='number']:invalid,
input[type='password']:invalid,
input[type='search']:invalid,
input[type='tel']:invalid,
input[type='text']:invalid,
input[type='url']:invalid,
input[type='date']:invalid,
textarea:invalid,
select:invalid {
border-color: #ff5a00;
outline: 0
}
input[type='email'].size-sm,
input[type='number'].size-sm,
input[type='password'].size-sm,
input[type='search'].size-sm,
input[type='tel'].size-sm,
input[type='text'].size-sm,
input[type='url'].size-sm,
input[type='date'].size-sm,
textarea.size-sm,
select.size-sm {
padding: 1rem
}
input[type='email'].dose-load,
input[type='number'].dose-load,
input[type='password'].dose-load,
input[type='search'].dose-load,
input[type='tel'].dose-load,
input[type='text'].dose-load,
input[type='url'].dose-load,
input[type='date'].dose-load,
textarea.dose-load,
select.dose-load {
background-position: 100% 50%;
background-repeat: no-repeat
}
input[type='email'].isloading,
input[type='number'].isloading,
input[type='password'].isloading,
input[type='search'].isloading,
input[type='tel'].isloading,
input[type='text'].isloading,
input[type='url'].isloading,
input[type='date'].isloading,
textarea.isloading,
select.isloading {
background-image: url('data:image/svg+xml;utf8,')
}
select {
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
padding-right: 3.0rem;
background-position: center right
}
select:focus {
background-image: url('data:image/svg+xml;utf8,')
}
select.dark {
background-color: rgba(255, 255, 255, 0.2);
border: 0.1rem solid transparent;
border-radius: 0.3rem;
box-shadow: none;
color: #ffffff;
padding: 0.7rem;
-moz-transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
-o-transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
-webkit-transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out
}
textarea {
min-height: 6.5rem
}
label,
legend {
display: block;
font-size: 1.6rem;
margin-bottom: .5rem
}
legend {
font-weight: 700
}
fieldset {
border-width: 0;
padding: 0
}
input[type='checkbox'],
input[type='radio'] {
display: inline
}
.label-inline {
display: inline-block;
font-weight: normal;
margin-right: .5rem
}
.form-group {
margin-bottom: 3rem
}
.field-validation-error {
background-color: #f04e4e;
display: block;
padding: 0.3rem 0.5rem 0.2rem 0.5rem;
margin: 0.2rem 0 0 0;
border-radius: 0 0 .6rem .6rem;
box-shadow: inset 0 16px 26px -13px #000;
color: #fff
}
.validation-summary-errors {
background-color: #f04e4e;
display: block;
padding: 0.1rem;
margin: 0 0 0.4rem 0;
border-radius: .5rem;
color: #fff
}
.validation-summary-errors ul {
list-style: none;
padding: 0;
margin: 1rem 0 0 0
}
.validation-summary-errors ul li {
margin: 0 0 1rem 0;
padding: 0 1rem
}
[type='range'] {
-webkit-appearance: none;
background: transparent;
margin: 1.4rem 0;
width: 100%
}
[type='range']::-moz-focus-outer {
border: 0
}
[type='range']:focus {
outline: 0
}
[type='range']:focus::-webkit-slider-runnable-track {
background: #fff
}
[type='range']:focus::-ms-fill-lower {
background: #fff
}
[type='range']:focus::-ms-fill-upper {
background: #fff
}
[type='range']::-webkit-slider-runnable-track {
cursor: default;
height: .8rem;
transition: all .2s ease;
width: 100%;
-webkit-box-shadow: .1rem .1rem .1rem rgba(0, 0, 0, 0.2), 0 0 .1rem rgba(13, 13, 13, 0.2);
box-shadow: .1rem .1rem .1rem rgba(0, 0, 0, 0.2), 0 0 .1rem rgba(13, 13, 13, 0.2);
background: #fff;
border: .2rem solid #fff;
border-radius: .5rem
}
[type='range']::-webkit-slider-thumb {
-webkit-box-shadow: .4rem .4rem .4rem rgba(0, 0, 0, 0.2), 0 0 .4rem rgba(13, 13, 13, 0.2);
box-shadow: .4rem .4rem .4rem rgba(0, 0, 0, 0.2), 0 0 .4rem rgba(13, 13, 13, 0.2);
background: #6d6743;
border: .2rem solid #6d6743;
border-radius: 50%;
cursor: default;
height: 2.8rem;
width: 2.8rem;
-webkit-appearance: none;
margin-top: -1.2rem
}
[type='range']::-moz-range-track {
-webkit-box-shadow: .1rem .1rem .1rem rgba(0, 0, 0, 0.2), 0 0 .1rem rgba(13, 13, 13, 0.2);
box-shadow: .1rem .1rem .1rem rgba(0, 0, 0, 0.2), 0 0 .1rem rgba(13, 13, 13, 0.2);
cursor: default;
height: .8rem;
transition: all .2s ease;
width: 100%;
background: #fff;
border: .2rem solid #fff;
border-radius: .5rem;
height: .4rem
}
[type='range']::-moz-range-thumb {
-webkit-box-shadow: .4rem .4rem .4rem rgba(0, 0, 0, 0.2), 0 0 .4rem rgba(13, 13, 13, 0.2);
box-shadow: .4rem .4rem .4rem rgba(0, 0, 0, 0.2), 0 0 .4rem rgba(13, 13, 13, 0.2);
background: #6d6743;
border: .2rem solid #6d6743;
border-radius: 50%;
cursor: default;
height: -1.2rem;
width: -1.2rem
}
[type='range']::-ms-track {
cursor: default;
height: .8rem;
transition: all .2s ease;
width: 100%;
background: transparent;
border-color: transparent;
border-width: 1.4rem 0;
color: transparent
}
[type='range']::-ms-fill-lower {
-webkit-box-shadow: .1rem .1rem .1rem rgba(0, 0, 0, 0.2), 0 0 .1rem rgba(13, 13, 13, 0.2);
box-shadow: .1rem .1rem .1rem rgba(0, 0, 0, 0.2), 0 0 .1rem rgba(13, 13, 13, 0.2);
background: #f2f2f2;
border: .2rem solid #fff;
border-radius: 1rem
}
[type='range']::-ms-fill-upper {
-webkit-box-shadow: .1rem .1rem .1rem rgba(0, 0, 0, 0.2), 0 0 .1rem rgba(13, 13, 13, 0.2);
box-shadow: .1rem .1rem .1rem rgba(0, 0, 0, 0.2), 0 0 .1rem rgba(13, 13, 13, 0.2);
background: #fff;
border: .2rem solid #fff;
border-radius: 1rem
}
[type='range']::-ms-thumb {
-webkit-box-shadow: .4rem .4rem .4rem rgba(0, 0, 0, 0.2), 0 0 .4rem rgba(13, 13, 13, 0.2);
box-shadow: .4rem .4rem .4rem rgba(0, 0, 0, 0.2), 0 0 .4rem rgba(13, 13, 13, 0.2);
background: #6d6743;
border: .2rem solid #6d6743;
border-radius: 50%;
cursor: default;
height: -1.2rem;
width: -1.2rem;
margin-top: .2rem
}
[type='range']:disabled::-webkit-slider-thumb {
cursor: not-allowed
}
[type='range']:disabled::-moz-range-thumb {
cursor: not-allowed
}
[type='range']:disabled::-ms-thumb {
cursor: not-allowed
}
[type='range']:disabled::-webkit-slider-runnable-track {
cursor: not-allowed
}
[type='range']:disabled::-ms-fill-lower {
cursor: not-allowed
}
[type='range']:disabled::-ms-fill-upper {
cursor: not-allowed
}
.input-button-group {
display: flex
}
.input-button-group input [type='email'],
.input-button-group input[type='number'],
.input-button-group input[type='password'],
.input-button-group input[type='search'],
.input-button-group input[type='tel'],
.input-button-group input[type='text'],
.input-button-group input[type='url'],
.input-button-group input[type='date'] {
margin: 0;
border-radius: .3rem 0 0 .3rem
}
.input-button-group button {
margin: 0;
border-radius: 0 .3rem .3rem 0
}
header,
.header {
position: relative;
display: flex;
flex-direction: column;
justify-content: space-around;
align-content: center;
align-items: center;
margin: 0
}
header#header,
.header#header {
margin: 0
}
header .header-last,
.header .header-last {
display: flex;
flex-direction: column;
justify-content: flex-end;
align-content: center;
align-items: center
}
.control-group {
text-align: left
}
.radio-checkbox-control {
display: block;
position: relative;
margin-bottom: 1.5rem;
cursor: pointer
}
.radio-checkbox-control.radio-control input {
border-radius: 50%
}
.radio-checkbox-control.radio-control input:after {
border-radius: 50%
}
.radio-checkbox-control.checkbox-control input:after {
border-radius: .3rem
}
.radio-checkbox-control input {
position: relative;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
height: 2rem;
width: 2rem;
display: inline-block;
box-sizing: border-box;
vertical-align: middle;
flex: 0 0 auto;
margin: 0 0.5rem 0 0
}
.radio-checkbox-control input:after {
content: ' ';
position: absolute;
top: 0;
z-index: 1;
left: 0;
height: 2rem;
width: 2rem;
background: #4f4f4f
}
.radio-checkbox-control input:checked:after {
background: #6d6743
}
.radio-checkbox-control input:checked:hover:after {
background: #7d764d
}
.radio-checkbox-control input:checked[type="checkbox"]:before {
content: '';
z-index: 2;
top: 0.3rem;
left: 0.6rem;
width: 0.8rem;
height: 1.2rem;
border: solid #4f4f4f;
border-width: 0 0.3rem 0.3rem 0;
transform: rotate(45deg);
position: absolute
}
.radio-checkbox-control input:checked[type="radio"]:before {
content: '';
z-index: 2;
top: 0.4rem;
left: 0.4rem;
width: 1.2rem;
height: 1.2rem;
border: 0 none;
position: absolute;
border-radius: 50%;
background-color: #4f4f4f
}
.radio-checkbox-control input:hover:after {
background: #4f4f4f
}
.select {
position: relative;
display: inline-block;
margin-bottom: 15px;
width: 100%
}
.select select {
display: inline-block;
width: 100%;
cursor: pointer;
padding: 10px 15px;
outline: 0;
border: 0;
border-radius: 0;
background: #e6e6e6;
color: #7b7b7b;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none
}
.select select::-ms-expand {
display: none
}
.select select:hover,
.select select:focus {
color: #000;
background: #ccc
}
.select select:disabled {
opacity: 0.5;
pointer-events: none
}
.select__arrow {
position: absolute;
top: 16px;
right: 15px;
width: 0;
height: 0;
pointer-events: none;
border-style: solid;
border-width: 8px 5px 0 5px;
border-color: #7b7b7b transparent transparent transparent
}
.select select:hover~.select__arrow,
.select select:focus~.select__arrow {
border-top-color: #000
}
.select select:disabled~.select__arrow {
border-top-color: #ccc
}
.custom-scrollbar::-webkit-scrollbar {
width: .9rem;
height: .9rem
}
.custom-scrollbar::-webkit-scrollbar-track {
width: .9rem;
height: .9rem;
background: rgba(0, 0, 0, 0.1);
border-radius: .5rem
}
.custom-scrollbar::-webkit-scrollbar-thumb {
width: .9rem;
height: .9rem;
border-radius: .5rem;
background: rgba(109, 103, 67, 0.8)
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
background: #6d6743
}
.custom-scrollbar::-webkit-scrollbar-thumb:active {
background: #6d6743
}
.scroll.scroll-y {
max-height: 10rem;
overflow-x: hidden;
overflow-y: auto
}
.scroll.scroll-x {
width: 100%;
overflow-y: hidden;
overflow-x: auto
}
.scroll.scroll-x .scroll-x-inner {
height: 100%;
width: 100%
}
.scroll.scroll-x .scroll-x-spacer {
width: 500rem;
height: 100%
}
.scroll.scroll-y-20rem {
max-height: 20rem
}
.scroll.scroll-y-30rem {
max-height: 30rem
}
.scroll.scroll-y-40rem {
max-height: 40rem
}
.scroll.scroll-y-50rem {
max-height: 50rem
}
.scroll.scroll-y-60rem {
max-height: 60rem
}
.scroll.scroll-y-70rem {
max-height: 70rem
}
.scroll.scroll-y-80rem {
max-height: 80rem
}
.scroll.scroll-y-90rem {
max-height: 90rem
}
.scroll.scroll-y-100rem {
max-height: 100rem
}
.pagination {
text-align: center;
min-height: 15rem;
display: flex;
justify-content: center;
align-items: center;
position: relative;
flex-wrap: wrap;
list-style: none;
column-gap: 1rem;
row-gap: 1rem;
padding: 0;
margin: 0
}
.pagination .page-item {
margin: 0 0.2rem
}
.pagination .page-item:first-child {
margin-right: 0
}
.pagination .page-item:last-child {
margin-left: 0
}
.pagination .page-item a {
border: .1rem solid #fff;
border-radius: .3rem;
cursor: pointer;
display: inline-flex;
justify-content: center;
align-content: center;
align-items: center;
height: 3rem;
padding: 0.7rem 1.2rem;
text-align: center;
text-decoration: none;
white-space: nowrap;
-moz-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
-o-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
-webkit-transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
background-color: rgba(255, 255, 255, 0.3);
border-color: transparent;
color: #fff
}
.pagination .page-item a:focus,
.pagination .page-item a:hover {
background-color: rgba(255, 255, 255, 0.1);
border-color: transparent;
color: #fff
}
.pagination .page-item a[disabled]:focus,
.pagination .page-item a[disabled]:hover {
color: rgba(255, 255, 255, 0.7)
}
.pagination .page-item.active a {
cursor: default;
opacity: .5
}
.pagination .page-item.active a:focus,
.pagination .page-item.active a:hover {
color: rgba(255, 255, 255, 0.7)
}
.spinner-box {
display: flex;
justify-content: center;
align-content: center;
align-items: center
}
.spinner-box>.spinner {
display: inline-flex;
justify-content: center;
align-content: center;
align-items: center
}
.spinner-box>label {
display: inline-flex;
justify-content: center;
align-content: center;
align-items: center;
font-size: 1.5rem
}
.spinner {
margin: auto;
width: 7rem;
text-align: center;
z-index: 10;
pointer-events: none
}
.spinner>div {
width: 1.2rem;
height: 1.2rem;
margin: 0 0.2rem;
background-color: #6d6743;
border-radius: 100%;
display: inline-block;
-webkit-animation: sk-bouncedelay .8s infinite ease-in-out both;
animation: sk-bouncedelay .8s infinite ease-in-out both
}
.spinner .bounce1 {
-webkit-animation-delay: -0.32s;
animation-delay: -0.32s
}
.spinner .bounce2 {
-webkit-animation-delay: -0.16s;
animation-delay: -0.16s
}
@-webkit-keyframes sk-bouncedelay {
0%,
80%,
100% {
-webkit-transform: scale(0)
}
40% {
-webkit-transform: scale(1)
}
}
@keyframes sk-bouncedelay {
0%,
80%,
100% {
-webkit-transform: scale(0);
transform: scale(0)
}
40% {
-webkit-transform: scale(1);
transform: scale(1)
}
}
table {
border-spacing: 0;
width: 100%
}
td,
th {
border-bottom: 0.1rem solid rgba(0, 0, 0, 0.08);
padding: 1.2rem 1.5rem;
text-align: left
}
td:first-child,
th:first-child {
padding-left: 0
}
td:last-child,
th:last-child {
padding-right: 0
}
table.tiny td,
table.tiny th {
padding: 1rem .5rem
}
@media (min-width: 480px) {
table.tiny {
font-size: 1rem;
line-height: 1rem
}
}
.responsive-table-container {
display: block;
width: calc(100vw - 2rem);
margin: 0 auto;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar
}
@media (min-width: 480px) {
.responsive-table-container {
width: calc(100% - 2.8rem)
}
}
@media (min-width: 768px) {
.responsive-table-container {
width: calc(100% - 4rem)
}
}
@media (min-width: 1200px) {
.responsive-table-container {
width: calc(100% - 4rem)
}
}
.tabs {
margin: 0 auto 1rem;
width: 100%;
position: relative;
display: grid
}
@media (min-width: 480px) {
.tabs {
display: block;
overflow: hidden
}
}
.tabs section.tab-content {
display: block;
width: 100%;
backdrop-filter: blur(1rem)
}
@media (min-width: 480px) {
.tabs section.tab-content {
opacity: 0;
max-height: 0;
padding: 0;
position: absolute;
z-index: -100;
top: 0;
pointer-events: none
}
}
@media (min-width: 480px) {
.tabs section.tab-content:first-of-type .tab-content-inner:first-child {
border-radius: 0 .3rem .3rem .3rem
}
}
.tabs section.tab-content .tab-content-inner {
padding: 0;
background-color: rgba(0, 0, 0, 0.6);
border-radius: 0 0 .3rem .3rem
}
@media (min-width: 480px) {
.tabs section.tab-content .tab-content-inner {
border-radius: .3rem;
opacity: 0;
-moz-transition: opacity .3s ease-in-out;
-o-transition: opacity .3s ease-in-out;
-webkit-transition: opacity .3s ease-in-out;
transition: opacity .3s ease-in-out
}
}
.tabs section.tab-content .tab-content-inner+.tab-content-inner {
margin-top: 2rem
}
.tabs section.tab-content .tab-content-inner .tab-content-inner-padding {
padding: 1rem
}
@media (min-width: 480px) {
.tabs section.tab-content .tab-content-inner .tab-content-inner-padding {
padding: 3.3rem
}
}
.tabs input.tab-control {
display: none;
grid-row: 1
}
.tabs .tabs-extra-btns,
.tabs label.tab-control {
display: inline-flex;
justify-content: flex-start;
align-items: center;
align-content: center;
height: 4rem;
padding: 0.7rem 2rem;
font-weight: 500;
text-align: center;
color: #fff;
white-space: nowrap;
overflow: hidden;
background-color: rgba(0, 0, 0, 0.4);
z-index: 1;
line-height: 2.5rem;
-moz-transition: max-width .3s ease-in, background-color .3s ease-in-out, border-radius .3s ease-in-out, padding .3s, margin .3s, height .3s;
-o-transition: max-width .3s ease-in, background-color .3s ease-in-out, border-radius .3s ease-in-out, padding .3s, margin .3s, height .3s;
-webkit-transition: max-width .3s ease-in, background-color .3s ease-in-out, border-radius .3s ease-in-out, padding .3s, margin .3s, height .3s;
transition: max-width .3s ease-in, background-color .3s ease-in-out, border-radius .3s ease-in-out, padding .3s, margin .3s, height .3s;
width: 100%;
max-width: 100%;
margin: 1rem 0 0 0;
border-radius: .3rem .3rem 0 0
}
@media (min-width: 480px) {
.tabs .tabs-extra-btns,
.tabs label.tab-control {
color: #fff;
background-color: rgba(0, 0, 0, 0.3);
border-radius: .3rem;
width: auto;
margin: 0 .5rem .5rem 0
}
}
.tabs .tabs-extra-btns .icon,
.tabs .tabs-extra-btns .linearicons,
.tabs .tabs-extra-btns .img-icon,
.tabs label.tab-control .icon,
.tabs label.tab-control .linearicons,
.tabs label.tab-control .img-icon {
flex: 0 0 auto;
background-size: auto;
font-size: 2rem;
margin: 0 1rem 0 0
}
.tabs .tabs-extra-btns {
margin: 0
}
.tabs label.tab-control:hover {
color: #fff;
cursor: pointer;
background-color: rgba(0, 0, 0, 0.4)
}
.tabs .tabs-extra-btns {
display: none
}
@media (min-width: 768px) {
.tabs .tabs-extra-btns {
display: block;
background-color: transparent;
padding: 0;
border-radius: 0;
max-width: initial;
margin: 0;
float: right
}
}
.tabs .tabs-extra-btns .button,
.tabs .tabs-extra-btns button {
display: inline-flex;
justify-content: flex-start;
align-items: center;
align-content: center;
font-weight: 500;
white-space: nowrap;
overflow: hidden;
z-index: 1;
line-height: 2.5rem;
margin-bottom: 0;
border-radius: .3rem
}
.tabs .tabs-extra-btns .button .icon,
.tabs .tabs-extra-btns .button .linearicons,
.tabs .tabs-extra-btns .button .img-icon,
.tabs .tabs-extra-btns button .icon,
.tabs .tabs-extra-btns button .linearicons,
.tabs .tabs-extra-btns button .img-icon {
flex: 0 0 auto;
background-size: auto;
width: 2.5rem;
height: 2.5rem;
vertical-align: middle;
font-size: 2.5rem;
line-height: 2.5rem;
float: left;
margin: 0 1rem 0 0
}
.tabs label[for=tab1] {
grid-row: 1
}
.tabs #content1 {
grid-row: 2
}
.tabs label[for=tab2] {
grid-row: 3
}
.tabs #content2 {
grid-row: 4
}
.tabs label[for=tab3] {
grid-row: 5
}
.tabs #content3 {
grid-row: 6
}
.tabs label[for=tab4] {
grid-row: 7
}
.tabs #content4 {
grid-row: 8
}
.tabs label[for=tab5] {
grid-row: 9
}
.tabs #content5 {
grid-row: 10
}
.tabs label[for=tab6] {
grid-row: 11
}
.tabs #content6 {
grid-row: 12
}
.tabs label[for=tab7] {
grid-row: 13
}
.tabs #content7 {
grid-row: 14
}
.tabs label[for=tab8] {
grid-row: 15
}
.tabs #content8 {
grid-row: 16
}
.tabs label[for=tab9] {
grid-row: 17
}
.tabs #content9 {
grid-row: 18
}
.tabs label[for=tab10] {
grid-row: 19
}
.tabs #content10 {
grid-row: 20
}
@media (min-width: 480px) {
.tabs input.tab-control:checked+label.tab-control {
color: #fff;
background-color: rgba(0, 0, 0, 0.6)
}
}
@media (min-width: 480px) and (min-width: 480px) {
.tabs input.tab-control:checked+label.tab-control {
margin-bottom: 0;
height: 4.5rem;
padding-bottom: 1.2rem;
padding-top: 0.7rem;
border-radius: .3rem .3rem 0 0
}
}
@media (min-width: 480px) {
.tabs #tab1:checked~#content1,
.tabs #tab2:checked~#content2,
.tabs #tab3:checked~#content3,
.tabs #tab4:checked~#content4,
.tabs #tab5:checked~#content5,
.tabs #tab6:checked~#content6,
.tabs #tab7:checked~#content7,
.tabs #tab8:checked~#content8,
.tabs #tab9:checked~#content9 {
display: block;
opacity: 1;
max-height: 10000rem;
position: relative;
z-index: 1;
pointer-events: inherit
}
.tabs #tab1:checked~#content1 .tab-content-inner,
.tabs #tab2:checked~#content2 .tab-content-inner,
.tabs #tab3:checked~#content3 .tab-content-inner,
.tabs #tab4:checked~#content4 .tab-content-inner,
.tabs #tab5:checked~#content5 .tab-content-inner,
.tabs #tab6:checked~#content6 .tab-content-inner,
.tabs #tab7:checked~#content7 .tab-content-inner,
.tabs #tab8:checked~#content8 .tab-content-inner,
.tabs #tab9:checked~#content9 .tab-content-inner {
opacity: 1
}
}
.tabs-sibling {
padding: 1rem;
background-color: rgba(0, 0, 0, 0.6);
border-radius: .3rem;
margin-bottom: 1rem;
backdrop-filter: blur(1rem)
}
@media (min-width: 480px) {
.tabs-sibling {
padding: 3rem
}
}
.toggle-checkbox[type="checkbox"]:not(:checked),
.toggle-checkbox[type="checkbox"]:checked {
position: absolute;
left: -9999px
}
.toggle-checkbox[type="checkbox"]:not(:checked)+label,
.toggle-checkbox[type="checkbox"]:checked+label {
position: relative;
padding-left: 4.5rem;
cursor: pointer
}
.toggle-checkbox[type="checkbox"]:not(:checked)+label:before,
.toggle-checkbox[type="checkbox"]:checked+label:before,
.toggle-checkbox[type="checkbox"]:not(:checked)+label:after,
.toggle-checkbox[type="checkbox"]:checked+label:after {
content: '';
position: absolute;
top: 0.4rem;
left: 0;
height: 2rem;
-moz-transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out;
-o-transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out;
-webkit-transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out
}
.toggle-checkbox[type="checkbox"]:not(:checked)+label:before,
.toggle-checkbox[type="checkbox"]:checked+label:before {
width: 3.5rem;
background: #7e7e7e;
border-radius: 1rem
}
.toggle-checkbox[type="checkbox"]:not(:checked)+label:after,
.toggle-checkbox[type="checkbox"]:checked+label:after {
background-color: #fff;
border-radius: 50%;
width: 1.8rem;
height: 1.8rem;
top: .5rem;
transform: translateX(-0.2rem) translateZ(0)
}
.toggle-checkbox[type="checkbox"]:checked+label:after {
transform: translateX(1.5rem) translateZ(0)
}
.toggle-checkbox[type="checkbox"]:checked+label:before {
background-color: #12bb00
}
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:not(:checked)+label,
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:checked+label {
padding-left: inherit;
padding-right: 4.5rem
}
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:not(:checked)+label:before,
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:checked+label:before,
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:not(:checked)+label:after,
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:checked+label:after {
right: 0;
left: auto
}
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:not(:checked)+label:after,
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:checked+label:after {
transform: translateX(-1.5rem) translateZ(0)
}
.toggle-checkbox.toggle-checkbox-end[type="checkbox"]:checked+label:after {
transform: translateX(0) translateZ(0)
}
b,
strong {
font-weight: bold
}
p {
margin-top: 0;
text-align: justify
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: 'LatoLatinWeb', sans-serif;
font-weight: 800;
letter-spacing: 0;
margin-bottom: 2.0rem;
margin-top: 0
}
:lang(fa) h1,
:lang(fa) h2,
:lang(fa) h3,
:lang(fa) h4,
:lang(fa) h5,
:lang(fa) h6 {
letter-spacing: 0
}
h1 {
font-size: 3rem;
line-height: 1.5
}
h2 {
font-size: 2.6rem;
line-height: 1.8
}
h3 {
font-size: 2.2rem;
line-height: 1.6
}
h4 {
font-size: 2rem;
line-height: 1.4
}
h5 {
font-size: 1.8rem;
line-height: 1.2
}
h6 {
font-size: 1.6rem;
line-height: 1
}
.text-primary {
color: #6d6743
}
.text-gray {
color: #7e7e7e
}
.text-gray-light {
color: #c9c9c9
}
.text-success {
color: #00ff72
}
.text-warning {
color: #ff5a00
}
.text-danger {
color: #f04e4e
}
.text-info {
color: #01f9b6
}
.text-center {
text-align: center
}
.text-dot {
font-size: 2rem
}
.text-first {
text-align: left
}
.text-last {
text-align: right
}
a,
span.a {
color: #6d6743;
text-decoration: none
}
a:link,
span.a:link {
color: #6d6743
}
a:active,
a:hover,
a:focus,
span.a:active,
span.a:hover,
span.a:focus {
color: #fff
}
span.a {
cursor: default !important
}
.left-right {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr
}
.left-right :first-child {
justify-self: flex-start
}
.left-right :last-child {
justify-self: flex-end
}
.limitted-height-container .limitted-height-el {
overflow: hidden;
text-overflow: ellipsis;
position: relative;
text-align: justify;
display: block;
max-width: 100%;
width: 100%;
white-space: normal;
-webkit-mask-image: linear-gradient(to bottom, white 70%, transparent 100%);
mask-image: linear-gradient(to bottom, white 70%, transparent 100%);
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
box-orient: vertical;
line-clamp: 3
}
.limitted-height-container .limitted-height-el.show-all {
-webkit-mask-image: none;
mask-image: none;
-webkit-line-clamp: unset;
overflow: visible
}
.limitted-height-container .limitted-height-el.show-all+.limitted-height-handle .limitted-height-handle-text-show-more {
display: none
}
.limitted-height-container .limitted-height-el.show-all+.limitted-height-handle .limitted-height-handle-text-show-less {
display: block
}
.limitted-height-container .limitted-height-handle {
cursor: pointer;
float: right;
display: flex;
align-items: center;
justify-content: space-between;
width: 9rem;
flex-direction: row;
font-size: 1rem
}
.limitted-height-container .limitted-height-handle .limitted-height-handle-text-show-more {
display: block
}
.limitted-height-container .limitted-height-handle .limitted-height-handle-text-show-less {
display: none
}
.large-coming-soon {
font-weight: 800;
font-size: 5rem;
line-height: 1;
color: rgba(255, 255, 255, 0.1);
text-align: center;
position: relative
}
p.shout {
font-weight: 800;
font-size: 3.3rem;
line-height: 1;
font-style: italic;
color: rgba(255, 255, 255, 0.5);
text-transform: uppercase;
text-align: center;
position: relative;
text-shadow: -1px -1px 3px rgba(0, 0, 0, 0.2);
max-width: 80rem;
margin: auto !important
}
p.paragraph {
margin-bottom: 3rem
}
h2.shout {
font-weight: 800;
font-size: 5.3rem;
line-height: 1;
font-style: italic;
color: rgba(255, 255, 255, 0.5);
text-transform: uppercase;
text-align: center;
position: relative;
text-shadow: -1px -1px 3px rgba(0, 0, 0, 0.2);
max-width: 80rem;
margin: auto !important
}
h1.shout {
line-height: 1;
font-weight: 800;
text-transform: uppercase
}
.hilight {
color: #6d6743
}
.page-title {
text-align: center
}
@media (min-width: 480px) {
.page-title {
text-align: left
}
}
.title {
padding: 3rem 0
}
.ltr {
direction: ltr
}
.ltr {
direction: lrt
}
.text-left {
text-align: left
}
.text-right {
text-align: right
}
.sticky {
position: sticky;
position: -webkit-sticky;
z-index: 1
}
.sticky.sticky-top {
top: 0
}
.sticky.sticky-bottom {
bottom: 0
}
.sticky.sticky-start {
left: 0
}
.sticky.sticky-end {
right: 0
}
.no-padding {
padding: 0 !important
}
.page-margin {
margin-top: 2rem;
margin-bottom: 2rem
}
.min-height-10rem {
min-height: 10rem
}
.min-height-20rem {
min-height: 20rem
}
.min-height-30rem {
min-height: 30rem
}
.min-height-40rem {
min-height: 40rem
}
.min-height-50rem {
min-height: 50rem
}
.min-height-60rem {
min-height: 60rem
}
.min-height-70rem {
min-height: 70rem
}
.min-height-80rem {
min-height: 80rem
}
.min-height-90rem {
min-height: 90rem
}
.min-height-100rem {
min-height: 100rem
}
.pull-first {
float: left;
align-self: flex-start;
justify-self: flex-start;
place-self: flex-start;
margin-right: auto
}
.pull-last {
float: right;
align-self: flex-end;
justify-self: flex-end;
place-self: flex-end;
margin-left: auto
}
.text-align-left {
text-align: left !important
}
.color-primary {
color: #6d6743 !important
}
.png-dropshadow-white {
-webkit-filter: drop-shadow(5px 5px 5px rgba(255, 255, 255, 0.5));
filter: drop-shadow(5px 5px 5px rgba(255, 255, 255, 0.5));
-ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=12, OffY=12, Color='#ffffff')";
filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=12, OffY=12, Color='#ffffff')"
}
.flex {
display: flex
}
.flex-justify-space-between {
display: flex;
justify-content: space-between
}
.flex-justify-space-around {
display: flex;
justify-content: space-around
}
.flex-justify-end {
display: flex;
justify-content: flex-end
}
.flex-justify-center {
display: flex;
justify-content: center
}
.flex-column {
flex-direction: column
}
.flex-column-center {
display: flex;
flex-direction: column;
align-items: center
}
.relative {
position: relative
}
.sr-only {
border: 0 !important;
clip: rect(1px, 1px, 1px, 1px) !important;
-webkit-clip-path: inset(50%) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
width: 1px !important;
white-space: nowrap !important
}
.anchor {
margin-top: -20rem;
display: block;
width: 0;
height: 0;
position: absolute
}
.cognito .c-button-section {
text-align: center
}
.cognito .c-action {
float: none
}
.cognito #c-submit-button {
float: none
}
.cognito .c-forms-heading .c-forms-form-title {
display: none
}
html {
scroll-behavior: smooth;
margin: 0;
padding: 0
}
body {
margin: 0;
background-color: #0e0d09;
color: #9c9460;
font-family: 'LatoLatinWeb', 'Open Sans';
font-size: 1.6rem;
padding: 16rem 0 0 0;
word-break: break-word;
display: flex;
flex-direction: column;
min-height: 100%
}
main {
flex: 1 0 auto
}
header {
display: flex;
flex-direction: row;
width: 100%;
z-index: 5000;
position: fixed;
height: 16rem;
top: 0;
background-color: #080705
}
header>.container {
display: flex;
flex-direction: row;
height: 16rem;
justify-content: space-between;
align-items: center
}
header nav ul {
margin: 0;
padding: 0;
display: inline-block
}
header nav ul li {
margin: 0;
padding: 0;
display: block
}
@media (min-width: 768px) {
header nav ul li {
display: inline-block
}
}
header nav ul li a {
display: inline-block;
margin: 0 1rem;
padding: 1rem
}
header nav ul li a:hover {
background-color: #000
}
@media (min-width: 768px) {
header nav ul li a {
padding: 2rem
}
}
.hero {
height: 45rem;
display: flex;
justify-content: center;
align-items: center;
background-color: #080705
}
@media (min-width: 768px) {
.hero {
height: 53rem
}
}
.hero .container {
width: 100%;
height: 100%
}
.hero .hero-main-carousel {
width: 100%;
height: 100%
}
.hero .hero-main-carousel .carousel-cell {
display: flex;
width: 100%;
height: 100%;
margin: 0;
justify-content: center;
align-items: center
}
.hero .hero-main-carousel .flickity-prev-next-button {
padding: 0
}
.about {
display: flex;
justify-content: center;
align-items: center;
font-size: 2rem;
padding: 6rem 0
}
@media (min-width: 768px) {
.about {
padding: 12rem 0
}
}
.about img {
margin: 0 auto 2rem
}
.games {
min-height: 50vh;
display: flex;
justify-content: center;
align-items: center
}
.games .game {
display: flex;
flex-direction: column;
margin: 0 0 4rem 0;
border-bottom: 0.1rem solid rgba(109, 103, 67, 0.2)
}
.games .game:last-child {
border-bottom: 0 none
}
@media (min-width: 768px) {
.games .game {
flex-wrap: nowrap;
flex-direction: row
}
}
.games .game .game-img {
border-radius: 0.5rem;
width: auto;
margin: 0 auto
}
.games .game .game-img img {
width: 100%;
max-width: 310px;
height: auto
}
@media (min-width: 768px) {
.games .game .game-img {
width: 310px
}
.games .game .game-img img {
width: 310px
}
}
.games .game .game-desc {
flex: 1 1 auto;
display: flex;
flex-direction: column;
flex-wrap: wrap
}
@media (min-width: 768px) {
.games .game .game-desc {
padding: 0 0 0 2rem
}
}
.games .game .game-desc h2 {
text-align: center
}
@media (min-width: 768px) {
.games .game .game-desc h2 {
text-align: left
}
}
.games .game .game-desc p {
flex: 1 0 auto
}
.dev-blog-summary {
margin: 0 0 3rem 0;
padding: 0 0 3rem 0;
border-bottom: 0.1rem solid #2e2b1c
}
.dev-blog-summary-title {
margin: 0
}
.dev-blog-summary-content {
color: #fff
}
.dev-blog-summary time {
color: #807f7f;
font-size: 1.2rem
}
footer {
min-height: 20vh;
display: flex;
justify-content: center;
align-items: center;
background-color: #080705;
color: #8d8556;
padding: 2rem 0
}
footer .container {
display: flex;
flex-wrap: nowrap;
flex-direction: column
}
@media (min-width: 768px) {
footer .container {
flex-direction: row
}
}
footer .footer-col {
display: flex;
align-items: center;
justify-content: center;
padding: 0 0 1rem 0;
flex: 1 1 0
}
@media (min-width: 768px) {
footer .footer-col {
width: 33.333333%;
padding: 0
}
}
@media (min-width: 768px) {
footer .footer-col:first-child {
justify-content: flex-start
}
}
@media (min-width: 768px) {
footer .footer-col:last-child {
justify-content: flex-end
}
}
footer .social-media {
display: flex;
width: 100%;
flex-wrap: nowrap
}
footer .social-media-facebook {
background-color: #1877F2
}
footer .social-media-twitter {
background-color: #1DA1F2
}
footer .social-media-youtube {
background-color: #FF0000
}
footer .social-media-linkedin {
background-color: #0077B5
}
footer .social-media-instagram {
background-color: #E4405F
}
footer .social-media-tumblr {
background-color: #36465D
}
footer .social-media a {
display: flex;
align-items: center;
justify-content: center;
width: 4rem;
height: 4rem;
padding: .5rem;
border-radius: 50%;
margin: 0 .5rem .5rem 0;
line-height: 0
}
footer .social-media a:hover svg path {
fill: #FFF
}
footer .social-media svg {
width: 2.4rem;
height: 2.4rem
}
footer .social-media svg path {
fill: #FFF
}
/*! Flickity v2.2.1
https://flickity.metafizzy.co
---------------------------------------------- */
.flickity-enabled {
position: relative
}
.flickity-enabled:focus {
outline: none
}
.flickity-viewport {
overflow: hidden;
position: relative;
height: 100%
}
.flickity-slider {
position: absolute;
width: 100%;
height: 100%
}
.flickity-enabled.is-draggable {
-webkit-tap-highlight-color: transparent;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.flickity-enabled.is-draggable .flickity-viewport {
cursor: move;
cursor: -webkit-grab;
cursor: grab
}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
cursor: -webkit-grabbing;
cursor: grabbing
}
.flickity-button {
position: absolute;
background: rgba(255, 255, 255, 0.75);
border: none;
color: #333
}
.flickity-button:hover {
background: white;
cursor: pointer
}
.flickity-button:focus {
outline: none;
box-shadow: 0 0 0 5px #19F
}
.flickity-button:active {
opacity: 0.6
}
.flickity-button:disabled {
opacity: 0.3;
cursor: auto;
pointer-events: none
}
.flickity-button-icon {
fill: currentColor
}
.flickity-prev-next-button {
top: 50%;
width: 44px;
height: 44px;
border-radius: 50%;
transform: translateY(-50%)
}
.flickity-prev-next-button.previous {
left: 10px
}
.flickity-prev-next-button.next {
right: 10px
}
.flickity-rtl .flickity-prev-next-button.previous {
left: auto;
right: 10px
}
.flickity-rtl .flickity-prev-next-button.next {
right: auto;
left: 10px
}
.flickity-prev-next-button .flickity-button-icon {
position: absolute;
left: 20%;
top: 20%;
width: 60%;
height: 60%
}
.flickity-page-dots {
position: absolute;
width: 100%;
bottom: -25px;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
line-height: 1
}
.flickity-rtl .flickity-page-dots {
direction: rtl
}
.flickity-page-dots .dot {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 8px;
background: #333;
border-radius: 50%;
opacity: 0.25;
cursor: pointer
}
.flickity-page-dots .dot.is-selected {
opacity: 1
}
/*# sourceMappingURL=style.css.map */