/*
==========================================================================================

1. General styles
2. Horizontal slider
3. Header & Top menu
4.1. Section > Full Width content
4.2. Section > Half Width content
4.3. Section > Middle content
5. Featured product
6. Featured productS
7. Featured event
8. Members feedback quotes
9. Featured news
10. Footer<br>

11.1. Helper > .horizontalScrollable
11.2. Helper > .progress-bar

==========================================================================================
*/

/*
==========================================================================================
------------------------------------ 1. General styles -----------------------------------
==========================================================================================
*/

* {
    box-sizing: border-box;
}

[v-cloak] {
    display: none !important;
}

.TODO{
	opacity: 0.4 !important;
}

:root {
    --orange-color:#ff8200;
}

img {
    display: block;
}

html{
	scroll-behavior: smooth;
}

html, body, ul, li, h1, h2, h3, p {
    margin: 0;
    padding: 0;
    font-family: 'Oswald', sans-serif;
}

html, body {
    font-size: 17px;
    line-height: 1.5em;
    color: #22312d;
    background: #cccccc;
}

body
{
    /*background: url('../img/paper_texture_10.png') repeat;*/
    background: url('../img/fishes_bg.png') repeat;
}

body.MOBILE{
	font-size: 13px;
}

a{
	color: #fff;
}

input[type="text"],
input[type="button"],
select{
    -moz-appearance:none; /* Firefox */
    -webkit-appearance:none; /* Safari and Chrome */
    appearance:none;
}

input:focus,
input:active {
    outline: none;
}

input[type="checkbox"]{
    -webkit-appearance: auto;
}

input.select,
select{
    background-image: url(../img/spot2.gif);
    background-repeat: no-repeat;
    background-position-x: 100%;
    background-position-y: 50%;
    background-size: contain;
}

/* body.MOBILE || body.TABLET || body.DESKTOP */

h1{
	font-family: 'Roboto', sans-serif;
	font-weight: normal;
	font-size: 3em;
}

.MOBILE h1{
	font-size: 3em;
}

h1 .subtitle{
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	font-size: 0.7em;
	padding: 0.8em 0 0;
}

h2{
	font-family: 'Roboto', sans-serif;
	font-weight: normal;
	font-size: 2.8em;
}

h2 a{
	color: inherit;
}

.clearfix:before, .clearfix:after{content:'';display:table}
.clearfix:after{clear:both}
.clearfix{zoom:1}

.fright{float:right}
.fleft{float:left}

.mtop5{margin-top:5px !important}
.mtop10{margin-top:10px !important}
.mtop15{margin-top:15px !important}
.mtop20{margin-top:20px !important}
.mtop25{margin-top:25px !important}

.mbottom5{margin-bottom:5px !important}
.mbottom10{margin-bottom:10px !important}
.mbottom15{margin-bottom:15px !important}
.mbottom20{margin-bottom:20px !important}
.mbottom25{margin-bottom:25px !important}

.point{position:relative;height:0px}
.rel{position:relative}
.abs{position:absolute}

.pointer{cursor:pointer}

.alignCenter{text-align:center}
.alignLeft{text-align:left}

.greyBg{background-color: #F2F3F2;}

.button {
	font-family: 'Oswald', sans-serif;
	font-size: 0.9em;
	line-height: 1.5em;
    display: inline-block;
    position: relative;
    border: solid 2px #f7f5f6;
    color: #f7f5f6;
    /*padding: 1em 2.4em;*/
    padding: 0.75em 2.4em;
    text-transform: uppercase;
    text-decoration: none;
    background: transparent;
    cursor: pointer;
    transition: background-color 0.15s ease-in;
    text-align: center;
    font-weight: bold;
    letter-spacing: 0.04em;
}

.MOBILE .button{
	font-size: 0.95em;
	padding: 0.9em 2.6em;
}

.button:hover, .button--active {
    background: #ff8200;
    border: solid 2px #ff8200;
    color: #fff;
}

.button--dark {
    border: solid 2px #22312d;
    color: #22312d;
}

.button--grey {
    border: solid 2px #C2C3C3;
    background: #C2C3C3;
    color: #22312d;
}

.button--red {
    border: solid 2px #D90000;
    color: #D90000;
}

.button--plus {
    border: solid 2px #22312d;
    color: #22312d;
    padding: 0.77em 3em;
    padding-left: 7.5em;
    background: transparent;
    position: relative;
    text-transform: uppercase;
    text-align: center;
    border: solid 2px #000000;
    transition: opacity 0.15s ease-in;
    display: inline-block;
}

.button--plus:hover{
    color: #fff !important;
    background: #ff8200 !important;
}

.button--plus::before
{
    width: 2em;
    content: '';
    background: url(../img/cross.gif) no-repeat 50% 50%;
    background-size: contain;
    position: absolute;
    display: inline-block;
    top: 0;
    left: 0;
    height: 100%;
    font-size: 2.2em;
    line-height: 1.28em;
    background-color: #22312d;
    color: #f7f5f6;
    overflow: hidden;
}

.MOBILE .button--plus{
	padding-left: 9em;
}

.MOBILE .button--plus::before{
	padding: 0em 0.5em;
	font-size: 2em;
	line-height: 1.6em;
}

.swal-button, .swal-button:hover, .swal-button:active, .swal-button:focus{
    font-family: 'Oswald', sans-serif;
    display: inline-block;
    position: relative;
    padding: 0.75em 2.4em;
    text-transform: uppercase;
    text-decoration: none;
    background: #ff8200 !important;
    border: solid 2px #ff8200;
    border-radius: unset;
    color: #fff;
    cursor: pointer;
    transition: background-color 0.15s ease-in;
    text-align: center;
    font-weight: bold;
    letter-spacing: 0.04em;
    outline: none;
    box-shadow: none;
}

.swal-footer{
    text-align: center;
    padding-bottom: 18px;
}

.hide{
	display: none !important;
}

.orange{
	color: #ff8200 !important;
}

.flatpickr-current-month{
	font-size: 110% !important;
}

.textNowrap
{
    white-space: nowrap;
}

.contentWrapper {
    margin: 0 auto;
    max-width: 1600px;
}

.innerContainer{
	padding-left: 5em;
	padding-right: 5em;
}

.MOBILE .mobileInnerContainer,
.MOBILE .innerContainer{
	padding-left: 7% !important;
	padding-right: 7% !important;
}

.flexContainer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
}
.flexContainer--left
{
    justify-content: left;
}

.textColorLight
{
    color: #f7f5f6;
}
.textColorDark
{
    color: #22312d;
}

.textAlignLeft
{
    text-align: left;
}

.textAlignCenter{
	text-align: center;
}

/*
==========================================================================================
---------------------------------- 2. Horizontal slider ----------------------------------
==========================================================================================
*/

.horizontalSlider {
    overflow: hidden;
}

.horizontalSlider__slides {
    display: flex;
    overflow-x: auto;
    position: relative;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;

    scrollbar-color: transparent transparent;
    scrollbar-width: none;
}

.horizontalSlider__slides::-webkit-scrollbar,
.horizontalSlider__slides::-webkit-scrollbar-thumb,
.horizontalSlider__slides::-webkit-scrollbar-track
{
    display: none;
    background: transparent;
}

.horizontalSlider__slide
{
    scroll-snap-align: start;
    flex-shrink: 0;
    transform-origin: center center;
    transform: scale(1);
    transition: transform 0.5s;
    position: relative;
}

.horizontalSlider__navigation[data-direction="prev"],
.horizontalSlider__navigation[data-direction="next"]{}

.MOBILE .horizontalSlider__slide{
	width: 100%;
}

.horizontalSlider__navigation .triangle_arr{
    /*top: 0.5em !important;*/
    width: 20px;
    height: 20px;
    border-right: 0.26em solid #000;
    border-top: 0.26em solid #000;
}

.MOBILE .horizontalSlider__navigation .triangle_arr{
    border-right: 0.16em solid #000;
    border-top: 0.16em solid #000;
}

/*
==========================================================================================
---------------------------------- 3. Header & Top menu ----------------------------------
==========================================================================================
*/
header
{
    //background-color: transparent;
    background-color: #22312d;
    position: fixed;
    z-index: 10000;
    padding: 0.9em 0;
    width: 100%;
    transition: background-color 0.3s ease-in;
}

header.not-index
{
	background-color: #22312d !important;
	top: 0;
}

.MOBILE header{
	padding: 2em 0.8em;
}

.MOBILE header .flexContainer
{
    justify-content: left;
}

.pageScrolled header
{
    background-color: #22312d;
    opacity: 0.95;
}

.header__logo{
	padding-left: 2%;
}
.header__logo img{
	width: 130px;
	height: 80px;
}

.MOBILE .header__logo
{
    display: none;
}

.header__nav
{
    position: relative;
    display: none;
    padding: 0 1em;
}

.DESKTOP .header__nav
{
    flex-grow: 1;
    display: block;
}

.MOBILE .header__nav
{
    display: block;
}

.DESKTOP .header__nav input
{
    display: none;
}

.MOBILE .header__nav input
{
    display: block;
    width: 40px;
    height: 28px;
    position: absolute;
    margin: 0;
    cursor: pointer;
    opacity: 0.001;
    z-index: 2;
    -webkit-touch-callout: none;
}

.DESKTOP .header__nav span
{
    display: none;
}

.MOBILE .header__nav span
{
    display: block;
    width: 36px;
    height: 2px;
    /*margin-bottom: 7px;*/
    /*width: 2.5em;*/
	/*margin-bottom: 0.4em;*/
	margin-bottom: 5px;
    position: relative;
    background: #ffffff;
    border-radius: 3px;
    z-index: 1;
    transform-origin: 4px 0px;
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
    background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
    opacity 0.55s ease;
}

.header__nav span:first-child
{
    transform-origin: 0% 0%;
}

.header__nav span:nth-last-child(2)
{
    transform-origin: 0% 100%;
}

/* Transform all the slices of hamburger into a crossmark. */
.header__nav input:checked ~ span
{
    opacity: 1;
    /*transform: rotate(45deg) translate(-2px, -1px);*/
    transform: rotate(45deg) translate(-8px, -6px);
    z-index: 2;
}

/* But let's hide the middle one. */
.header__nav input:checked ~ span:nth-last-child(3)
{
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
}

/*  Ohyeah and the last one should go the other direction */
.header__nav input:checked ~ span:nth-last-child(2)
{
    transform: rotate(-45deg) translate(0, -2px);
}

.DESKTOP .header__nav .topMenu
{
    list-style-type: none;
    text-align: right;
}

.MOBILE .header__nav .topMenu
{
    position: absolute;
    width: 110vw;
    height: 110vh;
    background-color: #22312d;
    list-style: none;
    margin: -100px 0 0 -50px;
    padding: 50px;
    padding-top: 110px;
    transform-origin: 0% 0%;
    transform: translate(-100%, 0);
    -webkit-font-smoothing: antialiased;
    /* to stop flickering of text in safari */
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

/* And let's slide it in from the left */
.MOBILE .header__nav input:checked ~ .topMenu
{
    transform: none;
    z-index: 1;
}

.DESKTOP .header__nav .topMenu li
{
    display: inline-block;
    padding-left: 0.85em;
    padding-right: 0.85em;
}

.header__nav .topMenu
{
	font-family: 'Oswald', sans-serif;
}

.header__nav .topMenu li
{
    padding: 10px 0;
    position: relative;
}

.header__nav .topMenu a
{
    color: #f7f5f6;
    text-transform: uppercase;
    text-decoration: none;
}

.header__nav .topMenu a:hover
{
    text-decoration: underline;
}

.header__nav .topMenu a.submenu{
    text-decoration: none !important;
    cursor: default;
}

.header__nav .topMenu li a.submenu .triangle_arr{
    transform: rotate(135deg);
    transition: all 0.15s ease-in;
}

.header__nav .topMenu li:hover a.submenu .triangle_arr{
    transform: rotate(-45deg);
    top: 2px;
}

.header__nav .topMenu a.homeLink{
    display: none;
}

.MOBILE .header__nav .topMenu a.homeLink{
    display: block;
}

.header__nav .topMenu li input[type="checkbox"] {
    display: none;
}

.header__nav .topMenu li .dropdown-menu{
    min-width: 220px;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    list-style: none;
    text-align: left;
    background-color: #22312d;
    display: none;
}

.header__nav .topMenu li:hover .dropdown-menu{
    display: block;
}

.header__nav .topMenu .dropdown-menu li{
    display: block;
    margin: 0.2em 0;
}

.MOBILE .header__nav .topMenu li:hover .dropdown-menu{
    display: none;
}

.MOBILE .header__nav .topMenu li a.submenu .triangle_arr,
.MOBILE .header__nav .topMenu li:hover a.submenu .triangle_arr{
    transform: rotate(135deg);
    top: -3px;

    width: 8px;
    height: 8px;
    border-right: 0.14em solid white;
    border-top: 0.14em solid white;
}

.MOBILE .header__nav .topMenu li input[type="checkbox"]:checked ~ a.submenu .triangle_arr{
    transform: rotate(-45deg);
    top: 1px;
}

.MOBILE .header__nav .topMenu li input[type="checkbox"]:checked ~ .dropdown-menu{
    display: block;
    position: unset;
    margin-top: 10px;
}

.MOBILE .header__nav .topMenu li input[type="checkbox"]:checked ~ .dropdown-menu li{
    margin: 0;
}

.MOBILE .header__nav .topMenu li input[type="checkbox"]:checked ~ .dropdown-menu li.last{
    padding-bottom: 0;
}

.DESKTOP .header__icons{
	display: none;
}

.header__icons{
	margin-left: auto;
}

.header__icons .iconMenu{
	list-style: none;
}

.header__icons .iconMenu li{
	display: inline-block;
}

.iconEl a{
	display: inline-block;
	width: 18px;
	height: 17px;
	background: no-repeat 50% 50%;
	/*margin-right: 1.2em;*/
}

.iconEl_profile a{
	background-image: url(../img/icon-profile.gif);
}

.iconEl_shop a{
	/*background-image: url(../img/icon-shop2.gif);*/
	background-image: url(../img/cart.svg);
}

.site-header__cart-bubble {
    position: absolute;
    top: 12px;
    right: 10px;
    width: 7px;
    height: 7px;
    background-color: #ff8200;
    border-radius: 50%;
    opacity: 0;
    transition: all 0.25s ease-out;
    -ms-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
}

.site-header__cart-bubble--visible {
    /*opacity: 1;
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);*/
}

.MOBILE .site-header__cart-bubble{
    top: 24px;
    right: 8px;
}

.MOBILE .header__nav .topMenu .site-header__cart-bubble{
    top: 8px;
    left: 14px;
}

/*
==========================================================================================
------------------------- 4.1. Section > Full Width content ------------------------------
==========================================================================================
*/
section.fullWidth
{
    /*padding: 0 0 6.5em 0;*/
    text-align: center;
    background-repeat: no-repeat;
    background-size: cover;
}

section.fullWidth--white{
	background-color: #fff;
}

.fullWidth.fullWidth--paddingTopMenu
{
    padding: 8em 0 10em;
    box-shadow: inset 0 0 7em #2a362a;
}

/*.fullWidth.fullWidth--paddingTopMenu:after{
	background-color: #fff;
    height: 20px;
    content: "";
    position: absolute;
    bottom: -20px;
    left: -20px;
    right: -20px;
}*/

.fullWidth.fullWidth--paddingTopMenu--withoutShadow
{
	padding-top: 9.4em;
	box-shadow: none;
}

.fullWidth--paddingTopMenu
{
    padding-top: 9.4em;
}

.fullWidth--paddingBottom
{
    padding-bottom: 9%;
}

.MOBILE .fullWidth.fullWidth--paddingTopMenu {
    padding-top: 5em;
    padding-bottom: 7em;
}

.fullWidth h1 {
    line-height: 1.1em;
    padding: 0.5em 0 0.3em;
}

.fullWidth h2
{
    line-height: 1em;
    /*padding: 2em 0 0.4em;*/
    padding: 1em 0 0.4em;
}

.fullWidth h3
{
	font-size: 1.2em;
}

.main__description
{
	font-family: 'Oswald', sans-serif;
    font-size: 1.2em;
    line-height: 1.3;
    margin-bottom: 2.5em;
}

.main__dates{
	color: #f2f3f2;
	font-size: 1em;
	line-height: 1.5;
}


.fullWidth--centeredButtons .button
{
    min-width: 15em;
    padding-left: 0;
    padding-right: 0;
    margin: 0.5em 0.5em 0.5em 0.5em;
}

.fullWidth--centeredButtons .button.button--big
{
    min-width: 19em;
}

/*
==========================================================================================
--------------------------- 4.2. Section > Half Width content ----------------------------
==========================================================================================
*/
.halfWidth
{
    background-color: #22312d;
}

.halfWidth > .flexContainer{
	align-items: stretch;
}

.halfWidth .pageBox
{
    width: 50%;
}

.MOBILE .halfWidth .pageBox
{
    width: 100%;
    padding: 2.5em 4%;
}

.pageBox
{
    padding: 1.9em 4%;
    background-repeat: no-repeat;
    background-size: cover;
}

.pageBox--left
{
    text-align: left;
}

.pageBox--right
{
    text-align: right;
}

.pageBox h2
{
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
    font-size: 1.7em;
}

.pageBox h2.orange{
	color: #ff8200;
}

.pageBox p
{
	font-family: 'Oswald', sans-serif;
    padding: 1.5em 0;
}

.MOBILE .pageBox--right {
    text-align: left;
}

/*
==========================================================================================
--------------------------- 4.3. Section > Middle content ------------------------------
==========================================================================================
*/
section.middleContent {

}


/*
==========================================================================================
---------------------------------- 5. Featured product -----------------------------------
==========================================================================================
*/
.featuredProduct{
	padding: 4em 0;
}

.MOBILE .featuredProduct{
	padding: 2em 0 3em;
}

.featuredProduct__image {
	align-self: start;
}

.featuredProduct__image,
.featuredProduct__content,
.featuredProduct__story
{
    width: 50%;
    margin: 0 auto;
    text-align: left;
}

.featuredProduct__image,
.featuredProduct__story{
	padding: 0 0 0 4%;
}

.featuredProduct__content{
	padding: 0 4% 0 4%;
}

.featuredProduct__story .featuredProduct__image{
	margin: 0;
	padding: 0 !important;
	width: 100%;
	max-height: 25em;
	object-fit: cover;
}

.featuredProduct__storyDesc{
	/*background: #8a978c;*/
	background: #000;
	/*color: #f7f5f6;*/
	color: #ff8200;
	text-align: center;
	min-height: 16em;
	padding: 3.5em;
}

.featuredProduct__storyDesc p,
.featuredProduct__storyDesc .p{
	font-size: 0.8em;
}

.featuredProduct__storyTitle{
	font-family: 'Roboto', sans-serif;
	font-size: 1.8em;
    line-height: 1.2em;
	margin-bottom: 1em;
}

.featuredProduct__storyVer{
	font-size: 0.85em;
	font-weight: bold;
	text-transform: uppercase;
	margin-top: 2em;
}


.featuredProduct--event .featuredProduct__image,
.featuredProduct--event .featuredProduct__story {
    padding: 0 4% 0 0;
}

.featuredProduct--event .featuredProduct__content{
	text-align: right;
	padding: 0 4% 0 4%;
}

.MOBILE .featuredProduct__image,
.MOBILE .featuredProduct__content,
.MOBILE .featuredProduct__story
{
    width: 100%;
    padding: 8% 4% 0 4%;
    text-align: left;
}

.featuredProduct h2
{
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
    padding: 0.2em 0 0.4em 0;
}

.featuredProduct h3
{
	font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    color: #ff8200;
}

.featuredProduct__price
{
	font-family: 'Oswald', sans-serif;
    color: #919993;
    padding: 0 0 1em 0;
}

.featuredProduct__description {
	font-family: 'Oswald', sans-serif;
    font-size: 0.9em;
    margin: 0 0 2em 0;
    overflow: hidden;
}

.featuredProduct__description h1{
	font-size: 1.5em;
}

.featuredProduct__description ul{
	font-size: 0.7em;
	line-height: 1.9em;
}

.featuredProduct__description p{
	font-size: 1em;
}

.featuredProduct__description h1{
	padding: 0 0 0.2em;
}

.featuredProduct__description img{
	max-width: 100%;
}

/*
==========================================================================================
---------------------------------- 6. Featured productS ----------------------------------
==========================================================================================
*/
.featuredProducts {
	padding: 1em 1em 3em;
}

.featuredProducts ul
{
    margin: 0 auto 1em auto;
    text-align: left;
    list-style: none;
}
p.featuredProducts__description
{
	font-family: 'Oswald', sans-serif;
    margin: 0 0 2em 0;
    padding: 0 4% 1em 4%;
    font-size: 1em;
}

.featuredProducts__link {
	font-family: 'Oswald', sans-serif;
    color: #22312d;
    text-decoration: none;
    margin: 0 auto;
    padding: 0 0.8em;
    flex: 0 1 30%;
}

.featuredProducts__link .fon{
    width: 100%;
    height: 26em;
    /*background: #b7bbb7;
    opacity: 0.5;*/
    background: #CFD4D0;
    opacity: 0.65;
}

.MOBILE .featuredProducts__link{
	flex: 1 0 100%;
}

.featuredProducts__link a{
	text-decoration: none;
}

.featuredProducts .picture{
    position: relative;
    /*width: 25em;*/
    height: 26em;
    background: no-repeat 50% 50%;
    /*background-size: cover;*/
    background-size: 90%;
    cursor: pointer;
}

.MOBILE .featuredProducts .picture{
	width: auto;
}

.featuredProducts__link .picture .hint
{
    position: absolute;
    width: 100%;
    padding: 1em 0;
    text-align: center;
    text-transform: uppercase;
    background-color: #ff8200;
    bottom: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.15s ease-in;
    font-weight: bold;
}

.MOBILE .featuredProducts__link .picture .hint{
	font-size: 1.35em;
	font-weight: bold;
}

.MOBILE .featuredProducts__link .picture .hint,
.featuredProducts__link:hover .picture .hint
{
    opacity: 1;
}

.featuredProducts h3
{
	font-family: 'Roboto', sans-serif;
    font-size: 1.5em;
    line-height: 1.2em;
	margin: 0.6em 0 0;
    height: 2.4em;
    font-weight: normal;
}

.MOBILE .featuredProduct h3{
	font-size: 1.7em;
}


/*
==========================================================================================
---------------------------------- 7. Featured event -------------------------------------
==========================================================================================
*/


/*
==========================================================================================
---------------------------- 8. Members feedback quotes ----------------------------------
==========================================================================================
*/

.quotes
{
    position: relative;
    max-width: 1100px;
    padding: 10em 8%;
    margin: 0 auto;
    text-align: center;
}

.quotes__prev,
.quotes__next
{
    display: flex;
    align-items: center;
    box-sizing: border-box;
    position: absolute;
    top:0;
    height: 100%;
    font-size: 1.3em;
    font-weight: bold;
    cursor: pointer;
    z-index: 1000;
}

.quotes__prev {left: 4%}
.quotes__next {right: 4%}

.MOBILE .quotes{
    padding: 5em 3%;
}

.MOBILE .quotes__prev,
.MOBILE .quotes__next{
	font-size: 2.8em;
}

.quotes__quote
{
    width: 100%;
    padding: 0 2em;
}

.MOBILE .quotes__quote{
	padding: 0 5em;
}

.quotes__title
{
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
    font-size: 42px;
    line-height: 1.1em;
    padding: 0 0 30px 0 !important;
}

.MOBILE .quotes__title{
	font-size: 2.5em;
}

.quotes__text
{
	font-family: 'Oswald', sans-serif;
    text-align: justify;
    font-size: 20px;
}

.MOBILE .quotes__text{
	font-size: 1.15em;
	line-height: 1.5em;
}

.quotes__author
{
	font-family: 'Oswald', sans-serif;
    display: inline-block;
    margin: 0 auto;
    padding-top: 2em;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 20px;
    line-height: 1.3em;
    color: #22312D;
}

.quotes__author::before
{
    display: block;
    content: "-";
    float: left;
    margin-right: 0.5em;
}

/*
==========================================================================================
---------------------------------------- 10. Footer --------------------------------------
==========================================================================================
*/
footer
{
	font-family: 'Oswald', sans-serif;
    text-align: center;
    background-color: #22312d;
    padding: 3em 0 2em;
}

.MOBILE footer{
	padding-top: 4em;
	padding-bottom: 4em;
}

footer > .flexContainer {
	align-items: baseline;
}

.footer__links
{
    list-style: none;
    text-align: left;
    padding-left: 1em;
    width: 50%;
}

.MOBILE .footer__links
{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 0;
    width: 100%;
}

.footer__links a
{
    color: #f7f5f6;
    text-transform: uppercase;
    text-decoration: none;
    margin: 0.5em 0;
	display: block;
}

.MOBILE .footer__links a
{
    display: block;
    width: 100%;
    margin: 0.4em 0;
    padding-left: 0;
    padding-right: 0;
    font-weight: bold;
}

.footer__links a:hover
{
    text-decoration: underline;
}

.signup
{
    min-width: 500px;
    padding: 3em 1em;
    text-align: right;
}

.MOBILE .signup {
	width: 100%;
	min-width: auto;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
}

.signup p { padding-bottom: 0.9em }

.signup h2 {
	font-size: 1em;
	font-family: 'Oswald', sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	margin-bottom: 1em;

	line-height: 1.6em
}

.MOBILE .signup h2{
	font-size: 1.15em;
	margin-bottom: 0.1em;
}

.MOBILE .signup p{
	letter-spacing: 0.03em;
}

.signup__submit, .signup__input
{
    border:none;
    float: right;
    padding: 1em 1.2em;
    outline: none;
    font-size: 0.8em;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    height: 3.5em;
    border-radius: unset !important;
}

.signup__submit
{
    width: 35%;
    background-color: #f7f5f6;
    color: #2a362a;
    cursor: pointer;
    font-weight: bold;
    -webkit-appearance: none;
}

.signup__input
{
    width: 65%;
    color: #f7f5f6;
    background-color: #999999;
}
.signup__input::placeholder
{
    color: #f7f5f6;
}
.signup__input:-ms-input-placeholder,
.signup__input::-ms-input-placeholder
{
    color: #f7f5f6;
}

.footer__copywrite
{
    display: block;
    padding: 2.5em 0.5em 0.3em 0.5em;
    font-family: 'Roboto', sans-serif;
}

.MOBILE .footer__copywrite{
	font-size: 1.2em;
	padding-top: 1em;
}



/*
==========================================================================================
------------------------- 11.1. Helper > .horizontalScrollable -----------------------------
==========================================================================================
*/
.horizontalScrollableContainer
{
    overflow-x: hidden;
}
.horizontalScrollable
{
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s;
}
.horizontalScrollable > *
{
    margin: auto;
    position: relative;
}


/*
==========================================================================================
--------------------------- 11.2. Helper > .progress-bar ---------------------------------
==========================================================================================
*/
.progressBar
{
    display: none;
}

.MOBILE .progressBar {
    display: block;

    width: 80%;
    height: 8px;

    background-color: rgba(255, 130, 0, 0.5);
    border-radius: 0px;
    position: relative;
    margin: 0.8em auto 1.6em auto;
}

.progressBar > .progressBar__value {
    width: 33%;
    height: 8px;
    background-color: #ff8200;
    border-radius: 0px;

    display: block;
    text-indent: -9999px;
}

/*Message section*/
.messageContainer{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 6em 8em 10em;
    font-family: 'Oswald', sans-serif;
    font-size: 1.1em;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: normal;
    text-align: left;
    color: #273126;

    background-color: #ffffff;
}

.MOBILE .messageContainer{
	display: block;
	padding: 7%;
}

.message-col {
    flex: 1 1 20%;
    margin-right: 20px;
}
.message-col3 {
    flex: 1 1 25%;
}

.MOBILE .message-col,
.MOBILE .message-col3{
	width: 100%;
}

.messageHeader {
  /*font-family: AbhayaLibreExtraBold;*/
  font-family: 'Roboto', sans-serif;
  font-size: 3em;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.95em;
  letter-spacing: normal;
  text-align: left;
  color: #22312d;
}

.MOBILE .messageHeader{
	margin: 0.3em 0 1em;
}

.messageByline {
  font-family: 'Oswald', sans-serif;
  font-size: 1em;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: left;
  color: #273126;
  margin-top: 1em;

}

.messageQuote {
  /*font-family: AbhayaLibreExtraBold;*/
  font-family: 'Roboto', sans-serif;
  font-size: 1.6em;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.94;
  letter-spacing: normal;
  text-align: left;
}

.button--shop{
	width: 14em;
    margin-top: 2em;
    /*margin-bottom: 7em;*/
}

.articles{
	margin: 5em 0;
	/*padding: 0 0.5em;*/
}

.articles__filter{
	text-transform: uppercase;
	padding: 0 0.5em;
}

.articles__filter .left{
	margin-right: auto;
}

.articles__filter .left .articles__select{
	margin-right: 2em;
}

.articles__filter .right{
	margin-left: auto;
}

.MOBILE .articles__filter .left,
.MOBILE .articles__filter .right{
	margin-right: unset;
	margin-left: unset;
}

.articles__filter .articles__select select,
.articles__filter .articles__search input{
	text-transform: uppercase;
	color: #12231E;
	font-weight: bold;
	font-family: 'Oswald', sans-serif;
}

.articles__filter .articles__select{
	border-bottom: solid 2px #12231E;
	min-width: 10em;
	overflow: hidden;
	background: no-repeat url(../img/down.gif) 95% 50%;
}

.articles__filter .articles__select select{
	border: none;
	background: transparent;
	padding: 0;
	width: 115%;
}

.articles__filter .articles__search{
	border-bottom: solid 2px #12231E;
	min-width: 15em;
	overflow: hidden;
	background: no-repeat url(../img/lence.gif) 95% 50%;
	background-size: 1.2em;
}

.articles__filter .articles__search input{
	border: none;
	background: transparent;
	padding: 0;
	width: 90%;
	/*font-size: 1em;*/
}

.articles__filter .articles__search input::placeholder {
	color: #12231E;
	opacity: 1;
}

.MOBILE .articles__filter .articles__select,
.MOBILE .articles__filter .articles__search{
	min-width: 20em;
	width: 100%;
	margin: 0;
	margin-bottom: 2em;
}

.article.article_featured{
	width: 100%;
	margin-top: 5em;
	color: #fff;
	background: no-repeat url(../img/dane-deaner-KsvDFpP1Av8-unsplash.jpg) right 90%;
	/*background-size: cover;*/
	background-size: 70%;
}

.MOBILE .article.article_featured{
	min-height: 35em;
	align-content: baseline;
	background-size: cover;
	margin-top: 3em;
}

.article.article_featured label{
	text-transform: uppercase;
	color: #F77F01;
	font-weight: bold;
}

.article.article_featured .article__info{
	margin-right: auto;
	background: #22312D;
	width: 35%;
	min-width: 350px;
	padding: 20px 30px;
}

.MOBILE .article.article_featured .article__info{
	width: 100%;
}

.article.article_featured .article__title{
	margin-top: 0.2em;
	font-size: 1.7em;
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
}


.article.article_featured .article__desc{
	margin: 0.6em 0 1.2em;
}

.article.article_featured .article__pict{
	width: 65%;
	height: 100%;
	background: no-repeat 50% 50%;
}

.articles__result{
	margin-top: 5em;
	padding: 0 0.5em;
	justify-content: left;
}

.articles__result .article:nth-child(3n - 1){
	margin-left: 5%;
	margin-right: 5%;
}

.MOBILE .articles__result .article:nth-child(3n - 1){
	margin: 0 0 4em;
}

.article{
	width: 30%;
	margin: 0 0 2.5em;
}

.MOBILE .article{
	width: 100%;
	margin: 0 0 4em;
}

.article_pict{
	width: 100%;
	height: 15em;
    background: no-repeat 50% 50%;
    background-size: cover;
}

.article__title{
	margin-top: 0.5em;
	font-size: 1.7em;
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
	line-height: 1.1em;
}

.article__desc{
	margin: 0.4em 0 1.6em;
}

.article__desc a{
    display: none;
}

.articles__result{
    align-items: start;
}

.articles__result .article__info a.button{
	color: #22312d;
	border-color: #22312d;
}

.article__more{
	width: 100%;
	text-align: center;
}

.article__more a.button{
	background: #ff8200;
	color: #fff;
	border: none;
}

.subscribe{
	min-height: 25em;
	background: no-repeat url(../img/fredrik-ohlander-CbeApl8sxxw-unsplash2.jpg) 50% 50%;
	background-size: cover;
	color: #fff;
}

.subscribe > .contentWrapper{
	position: relative;
	height: 100%;
	min-height: 25em;
}

.subscribe > .contentWrapper .app__bgarrows{
	right: 0;
	left: auto;
	width: 11em;
}

.subscribe > .contentWrapper .app__arrow{
	bottom: 2.35em;
}

.subscribe > .contentWrapper .app__arrow_prev{
	right: 6.5em;
	left: auto;
}

.subscribe > .contentWrapper .app__arrow_next{
	right: 3em;
	left: auto;
}

.subscribe__inner{
	padding: 5em 0.5em;
	width: 50%;
    text-shadow: #888 1px 0 4px;
}

.MOBILE .subscribe__inner{
	width: 100%;
}

.subscribe__inner h1
{
	font-size: 3em;
	line-height: 1;
}

.subscribe__inner p{
	margin: 1.8em 0 2.1em;
}

.subscribe__inner .button {
    background: #ff8200;
    color: #fff;
    border: none;
}

.faqSection {
    align-content: center;
    margin: auto;
    padding: 0 7em 2em;
}

.MOBILE .faqSection{
	padding: 1em 2em 2em;
}

.faqSection h1{
	padding-bottom: 0.4em;
}

.faqSection h3{
	padding-bottom: 4em;
}

/* collapsable Items*/
.faqSection .collapsibleItem {
    display: block;
    width: 100%;
    min-height: 50px;
    margin-bottom: 20px;

    color: #f7f5f6;
    background-color: #919993;
    transition: transform 0.25s ease-out;
}

.faqSection input {
    position: absolute;
    left: -9999px;
    /*&:focus ~ .collapsibleItem{
      border-color: grey;
    }*/
}

.faqSection .questionLine{
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 50px;
    transition: transform 0.25s ease-out;
}

.faqSection .question {
    margin: 0.5em 0.5em 0.5em 20px;
    /*font-family: 'Abhaya Libre', sans-serif;*/
    font-family: 'Roboto', sans-serif;
    font-size: 1.4em;
    text-align: left;
}

.faqSection .spot {
    /*height: 50px;*/
    min-height: 50px;
    min-width: 50px;
    background: #ff8200 url(../img/spot.gif) no-repeat 50% 50%;
    transition: transform 0.25s ease-out;
    align-self: stretch;
}

.faqSection .answer {
    font-size: 0;
    margin-left: 20px;
    opacity: 0;
    padding: 0;
    height: 0;
}

/*.faqSection input:checked ~ .collapsibleItem {
    background: #22312d;
}*/

.faqSection input:checked ~ .questionLine {
    background: #22312d;
}

.faqSection input:checked ~ .questionLine .spot{
    transform: rotate(180deg);
}

.faqSection input:checked ~ .answer {
    background-color: #22312d;
    font-size: 16px;
    opacity: 1;
    height: auto;
    margin: 0;
    padding: 0 70px 20px 20px;
    transition: transform 1.25s ease-out;
    text-align: left;
}

.slider{
	margin: 0;
	/*height: 42vw;*/
	height: 28em;
	overflow: hidden;
}

.MOBILE .slider{
	/*height: 45vw;*/
	font-size: 0.7em;
}

.slider__content{
	width: 100%;
	height: 100%;
}

.slider__panel{
	width: 10%;
	height: 90%;
	padding: 2.1em 0;
	position: relative;
	overflow: hidden;
	cursor: pointer;
    background: no-repeat 50% 50%;
    background-size: cover;
}

.slider__panel_left{
	margin-right: auto;
}

.slider__panel_right{
	margin-left: auto;
}

.slider__arrows{
    position: absolute;
    height: 28em;
    width: 6.5em;
    left: calc(87.5% - 6.5em);
}

.slider__arrows .app__bgarrows{
    height: 28em;
    width: 6.5em;
}

.slider__arrows .app__arrow_prev{
    top: 8em;
    left: 2.4em;
}

.slider__arrows .app__arrow_next{
    top: 19em;
    left: 2.4em;
}

.slider__inner{
	width: 75%;
	height: 100%;
    position: relative;
}

.slider__panel label{
	display: block;
	background: #ff8200;
	opacity: 0.85;
	/*height: 30vw;*/
	height: 100%;
	width: 70%;
	/*margin: 40% 0;*/
}

.slider__panel_right label{
	margin-left: auto;
}

.slider__legend {
	position: absolute;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.4em;
	letter-spacing: 0.02em;
	line-height: 1;
	width: 42vw;
	text-align: center;
	transform: rotate(90deg);
	color: #fff;
	top: 48%;
	left: -17.6vw;
	z-index: 2;
}

.slider__panel_right .slider__legend {
	left: -14.5vw;
	transform: rotate(270deg);
}

.slider__item{
	width: 100%;
	height: 100%;
	color: #fff;
	background: no-repeat 50% 50%;
	background-size: cover;
}

.slider__item .info{
	padding: 16em 8% 0 8%;
	width: 100%;
	text-align: left;
}

.MOBILE .slider__item .info{
	width: 100%;
}

.slider__item .info h1{
	font-size: 3.2em;
	padding: 0;
}

.MOBILE .slider__item .info h1{
	font-size: 3em;
}

.slider__item .info h3{
	margin-top: 1.2em;
	font-weight: normal;
	line-height: 1.3em;
}

.numbers > .flexContainer{
	justify-content: left;
	/*padding: 0 12em;*/
	padding: 0 6%;
}

.numbers__item{
	width: 50%;
	padding: 0 2% 5%;
	flex-wrap: nowrap;
    justify-content: left;
}

.MOBILE .numbers__item{
	width: 100%;
	padding-bottom: 10%;
}

.numbers__legend{
	font-size: 6.8em;
	/*width: 1.4em;*/
	padding: 0 0.18em;
}

.numbers__desc{
	text-align: left;
	margin-top: 8px;
}

.numbers__desc label{
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
	font-size: 2em;
	line-height: 1;
}

.numbers__desc p{
	margin-top: 0.3em;
	line-height: 1.25em;
}

.quote{
	background: #F2F3F2;
	padding: 140px 0;
}

.quote__text{
	font-size: 3.5em;
	line-height: 1;
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
}

.quote__item p{
	margin-top: 2.5em;
	font-size: 1.1em;
}

.quote__member{
	color: #4F564E;
	margin-top: 1em;
	font-size: 2em;
	font-weight: bold;
	text-transform: uppercase;
}

.quote__inner{
	width: 80%;
}

.quote__arrow{
	background: no-repeat url(../img/arrow_left.gif) 50% 50%;
	width: 10%;
	height: 5em;
}

.quote__arrow_next{
	transform: rotate(180deg);
}

section.pricing{
	padding: 4em 3%;
}

.MOBILE section.pricing{
	padding: 0 5% 6%;
}

.pricing__desc{
	width: 32%;
	text-align: left;
}

.pricing__list{
	width: 68%;
	align-items: stretch;
}

.MOBILE .pricing__desc,
.MOBILE .pricing__list {
	width: 100%;
}

.MOBILE .pricing__desc{
	text-align: center;
	margin: 0 1em 3em;
}

.icons a{
	display: inline-block;
}

.icons img{
	height: 5em;
}

.MOBILE .icons img{
    margin: 1em 0;
    width: 16em;
    height: auto;
}

.pricing__block{
	width: 46%;
	max-width: 30em;
	min-width: 25em;
	margin: 0 0 2% 2%;
	padding: 40px;
	color: #fff;
	background: #22312D;
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
}

.MOBILE .pricing__block{
	width: 100%;
	max-width: unset;
	min-width: unset;
	margin-bottom: 1.5em;
}

.pricing__title{
	font-size: 2.2em;
}

.pricing__amount{
	font-size: 4em;
	line-height: 1;
	margin-top: 35px;
}

.pricing__info{
	font-family: 'Oswald', sans-serif;
	margin: 16px 0 30px;
    height: 3em;
}

/*
==========================================================================================
--------------------------- PRODUCT PAGE -------------------------------------------------
==========================================================================================
*/

.product__filter{
	width: 20%;
	margin-top: 1em;
	margin-right: 3%;
	text-align: left;
	align-self: flex-start;
}

.MOBILE .product__filter{
	width: 100%;
	display: flex;
}

.MOBILE .product__filter__el{
	width: 50%;
}

.product__data{
	width: 77%;
	align-self: start;
}

.MOBILE .product__data{
	width: 100%;
}

.product__filter__header{
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
    font-size: 1.6em !important;
}

.product__filter__level1 {
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    font-weight: normal;
    padding-left: 1em;
}

.MOBILE .product__filter__level1{
	padding-left: 0;
}

.product__filter__level1 > li > img {
    display: none;
    height: 16px;
}

.product__filter__level2 {
    display: none;
    font-family: 'Oswald', sans-serif;
    font-size: 16px;
    font-weight: normal;
    margin-top: 6px;
}

.product__filter__level2 img {
    height: 16px;
}

.product__filter__item {
    position: relative;
    /*margin-left: 15px;*/
    list-style: none;
    cursor: pointer;
    margin-bottom:  10px;

    text-decoration: none !important;
    color: #22312d;
}

.product__filter__item span {
	text-transform: uppercase;
    text-decoration: none !important;
    color: #22312d;
    vertical-align: top;
    cursor: pointer;
}

.product__filter__item svg.collapse{
	display: none;
	transform: rotate(90deg);
}

.product__filter__item input{
	display: none;
}

.product__filter__item input:checked ~ span {
   font-weight: bold;
}

.product__filter__item input:checked ~ svg{
   display: inline;
}

.product__filter__item input:checked ~ ol{
	display: block;
}

.product__filter__level2 span{
	display: inline-block;
	padding-left: 25px;
	background: no-repeat url(../img/tree-mark-off.jpg) 0% 50%;
	background-size: 17px;
}

.product__filter__level2 input:checked ~ span{
	background-image: url(../img/tree-mark-on.jpg);
}

.product__select__collections{
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
	align-items: center;
	align-content: center;
	margin-bottom: 4em;
}

.product__select__collection{
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
	align-items: center;
	align-content: center;
	font-size: 0.92em;
	background: #252F2E;
	color: #fff;
	margin-right: 1em;
	margin-bottom: 1em;
	padding: 0.15em 0.8em 0.15em 0.5em;
}

.product__select__collection img{
	height: 0.8em;
	padding-right: 0.5em;
	cursor: pointer;
}

.product__group{
	margin-bottom: 2em;
}

.MOBILE .product__group{
	margin: 2em 0 1em;
}

.product__group h1,
.product__group p{
	padding: 0;
	text-align: left;
}

.product__group h1{
	font-size: 2.6em;
	line-height: 1.1;
}

.product__line{
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    margin-top: 2em;
}

.product__box {
    flex: 0 1 31%;
    text-align: left;
    margin-right: 2%;
    margin-bottom: 5%;
}

.MOBILE .product__box{
	width: 100%;
	flex: 0 1 100%;
	min-height: 10em;
	margin: 1em 0 3em;
}

.product__box a.button{
	border-color: #000000;
	color: #000;
}

.product__box a.button:hover{
	color: #fff;
	border-color: transparent;
}

.product__box .button--plus{
    background: #fff;
}

.product__box .fon{
    width: 100%;
    height: 22em;
    background: #CFD4D0;
    opacity: 0.65;
}

.product__cover {
	display: block;
	position: relative;
	width: 100%;
	min-height: 22em;
	background: no-repeat #D4D7D5 50% 50%;
	/*background-size: cover;*/
	/*background-size: contain;*/
	background-size: 90%;
	cursor: pointer;
}

.product__line_bundles .product__cover{
	min-height: 22em;
}

.MOBILE .product__cover{
	min-height: 30em;
}

.product__cover img {
  width: 100%;
  object-fit: cover;
}

.product__cover a.product__link
{
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    opacity: 0;
    padding: 1em 2em;
    text-align: center;
    color: #fff;
    background: #ff8200;
    text-transform: uppercase;
    font-weight: bold;
    cursor: pointer;
}

.product__cover:hover a.product__link
{
    opacity: 1;
}

.product__cover .button--plus
{
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    opacity: 0;
}

.product__cover:hover .button--plus
{
    opacity: 1;
}

.product__box h4 {
    margin-top: 0;
    margin-bottom: 0;
    margin-top: 0.6em;
    /*font-family: AbhayaLibreExtraBold;*/
    font-family: 'Roboto', sans-serif;
    line-height: 1.05em;
    font-size: 1.5em;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    text-align: left;

    height: 2.2em;
    overflow: hidden;
}

.product__box h5 {
    margin-top: 0.4em;
    margin-bottom: 1.5em;
    font-family: 'Oswald', sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    text-align: left;
}

.product__box a{
	text-decoration: none;
}

.product__box button {
    width: 70%;
    height: 15%;
    display:block;
    margin-top: 20px;
}

.league__info{
	padding: 5em 0;
}

.MOBILE .league__info{
	padding: 3em 0;
}

.league__info p{
	width: 40%;
	text-align: left;
    align-self: start;
}

.MOBILE .league__info p{
	width: 100%;
	margin: 1em 0;
}

.league__info p.left{
	margin-left: auto;
	margin-right: 1%;

}

.league__info p.right{
	margin-right: auto;
	margin-left: 1%;
}

section.purchase{
    padding: 4em 0;
}

.purchase__block{
    align-content: start;

	width: 46%;
	color: #fff;
	padding: 6em 3.5em;
	background: #22312d no-repeat 50% 50%;
	background-size: cover;
}

.MOBILE .purchase__block{
	width: 100%;
	margin: 0 !important;
}

.purchase__block.left{
	margin-left: auto;
	margin-right: 1%;
}

.purchase__block.right{
	margin-right: auto;
	margin-left: 1%;
}

.purchase__block h2{
	padding: 0;
	color: #ff8200;
	font-size: 2em;
	line-height: 1.1em;
    height: 2.2em;
}

.purchase__block p{
	padding: 2em 0 2.4em;
	font-size: 1.1em;
	line-height: 1.5em;
    height: 10em;
}

.featuredMembers{
	padding: 5% 3%;
	background: #F2F3F2;
}

.featuredMember__desc{
	width: 42%;
	text-align: left;
}

.MOBILE .featuredMember__desc{
	width: 100%;
	text-align: center;
}

.featuredMember__list{
	width: 58%;
	justify-content: start;
}

.MOBILE .featuredMember__list{
	width: 100%;
	margin-top: 4em;
}

.featuredMember__block{
	width: 30%;
	height: 20em;
	margin: 0 0 3% 3%;
	color: #fff;
	background: #22312D;
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	line-height: 1;
	cursor: pointer;
}

.MOBILE .featuredMember__block{
	width: 100%;
	margin: 0 0 5% 0;
	height: 28em;
}

.featuredMember__title{
	font-size: 1.2em;
	line-height: 1.2em;
	font-weight: bold;
	padding: 0.85em 0.3em;
}

.MOBILE .featuredMember__title{
	font-size: 1.8em;
	/*padding: 1.3em;*/
}

.featuredMember__image{
    height: 15em;
	background: no-repeat 50% 0;
	background-size: cover;
}

/*.featuredMember__block:hover .featuredMember__image{
	height: 15em;
}*/

.MOBILE .featuredMember__image{
    height: 21em;
    background-position: 50% 10%;
}

.MOBILE .featuredMember__block:hover .featuredMember__image{
	height: 21em;
}

.events__filter {
	color: #22312D;
	padding: 40px 0;
    align-items: stretch;
}

.events__filter > div{
	margin: 0 0.5em;
}

.events__filter .input{
	border: solid 2px #22312D;
	position: relative;
	padding: 8px 25px;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 0.9em;
	text-align: left;
	min-width: 160px;
	margin-bottom: 1.4em;
	cursor: pointer;
}

.MOBILE .events__filter .input{
	width: 50%;
}

.events__filter .input.cal{
	cursor: pointer;
	text-align: center;
}

.MOBILE .events__filter .input.cal{
    text-align: left;
}

.events__filter .input.select{
	background: no-repeat url(../img/down.gif) calc(100% - 10px) 50%;
}

.events__filter .input.select.hover{
	color: #fff;
	background: #22312D;
}

.events__filter .input.select .options{
	display: none;
	position: absolute;
	top: 100%;
	left: -1px;
	z-index: 10;
	width: calc(100% + 2px);
	color: #fff;
	background: #22312D;
	cursor: pointer;
}

.events__filter .input.select.hover .options{
	display: block;
}

.events__filter .input.select .option {
	padding: 8px 25px;
	text-align: left;
}

.events__filter .input.select:hover .option:hover{
	background: #FF8200;
}

.events__filter .input.search{
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;

	cursor: pointer;
	text-align: center;
	background: no-repeat url(../img/lence.gif) calc(100% - 15px) 50%;
	background-size: 20px;
	padding: 0;
	padding-right: 50px;
}

.events__filter .input.search input{
	padding: 9px 15px;
	border: none;
	background: transparent;
	font-family: 'Oswald', sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 1em;
    line-height: 1em;
	text-align: left;
	color: #22312D;
    -webkit-appearance: none;
}

.events__filter .input.search input::placeholder{
	opacity: 1;
}

.MOBILE .events__filter .input.search{
    text-align: left;
    height: 3.4em;
    background-size: 16px;
}

.MOBILE .events__filter .input.search input{
    margin-left: 12px;
    width: 100%;
    padding: 0 15px;
    /*line-height: 3em;*/
}

.MOBILE .events__filter .input.select{
    height: 3.4em;
}

.events__result{
	width: 100%;
	/*padding-bottom: 3em;*/
}

.events__paging{
	width: 100%;
	margin: 2em 0 0;
}

.events__paging__item{
	cursor: pointer;
	padding: 0 0.5em;
	color: #fff;
	text-decoration: none;
	opacity: 0.6;
}

.events__paging__item:hover{
	opacity: 1;
}

.events__paging__item--selected{
	opacity: 1;
	font-weight: bold;
}

.event__loadmore{
	margin: 2em 0 4em;
}

.event{
	margin-bottom: 1em;
	color: #22312d;
}

.MOBILE .event{
	margin-bottom: 2em;
}

.event__image, .event__desc{
	width: 50%;
	position: relative;
}

.event__image{
	align-self: stretch;
	background: #fff no-repeat /*url(../img/agnes-elena-craciun-R3Z2V5_7e2o-unsplash.jpg)*/ 50% 50%;
	background-size: cover;
}

.event__image.none{

}

.event_self .event__image{
	width: 25%;
}

.MOBILE .event__image{
	width: 100%;
	min-height: 21em;
}

.event__prize{
	position: absolute;
	top: 0;
	right: 0;
	color: #f2f3f2;
	background: #ff8200;
	text0-align: left;
	min-width: 22%;
	padding: 0.6em 0.85em;
	text-transform: uppercase;
	font-weight: bold;
}

.MOBILE .event__prize{
	left: 0;
	width: 100%;
}

.event__name{
	position: absolute;
	top: 0;
	left: 0;
	background: #22312D;
	color: #fff;
	padding: 1.2em 3.6em;
	font-size: 0.65em;
	text-transform: uppercase;
	font-weight: bold;
}

.event__desc{
	background: #F2F3F2;
	padding: 65px 60px 35px;
	padding: 4em 3em 1.75em;
	text-align: left;
}

.event_self .event__desc{
	width: 75%;
	/*padding: 30px 40px 25px;*/
	padding: 1.8em;
}

.MOBILE .event__desc{
	width: 100%;
	padding-top: 5em;
}

.event__addlink{
	text-transform: uppercase;
	color: #273126;
	text-decoration: none;
	font-size: 0.8em;
	background: no-repeat url(../img/plus.gif) 0% 50%;
	padding-left: 27px;

	position: absolute;
	top: 15px;
	right: 30px;
	min-height: 22px;
}

.event__title{
	color: #ff8200;
	font-size: 1.8em;
    line-height: 1.1em;
	/*font-family: 'Abhaya Libre', serif;*/
	font-family: 'Roboto', sans-serif;
	margin-bottom: 0.1em;
}

.event_self .event__title{
	color: #22312d;
}

.event__sub{
	display: block;
	color: rgba(34, 49, 45, 0.75);
	text-transform: uppercase;
}

.event__sub a{
	color: rgba(34, 49, 45, 0.75);
}

.event__dates{
	margin: 0.8em 0;
}

.event__info{
	font-size: 0.9em;
	line-height: 1.3;
}

.event__actions{
    /*width: calc(100% + 20px);*/
	/*display: flex;*/
    margin-top: 1em;
	margin-right: -20px;
	float: right;
    /*align-items: center;*/
}

.MOBILE .event__actions{
	margin: 2em 0;
	float: none;
}

.event__actions_left{
	float: left;
}

.event__actions .button{
	min-width: 11em;
	font-size: 0.75em;
	padding: 0.9em 0em;
}

.event__ext_info{
    margin-top: 1em;
    width: 100%;
    text-shadow: 0 0 5px #000;
}

.event__desc .event__ext_info{
    text-shadow: none;
}

.event__ext_info > div{
    width: 50%;
    min-width: 260px;
}

.event__ext_info .name{
    text-transform: uppercase;
}

.event__ext_info .link{
    text-transform: uppercase;
    color: #ff8200;
    text-decoration: none;
}

.event__ext_buttons{
    margin-left: auto;
    white-space: nowrap;
}

.event__features{
	margin: 0.8em 0 0;
	justify-content: start;
}

.event__feature{
	flex: 1 0 25%;
	align-items: start;
	margin: 0.4em 0;
}

.participant .event__feature{
	flex: 0 1 25%;
}

.MOBILE .event__feature{
	flex: 1 0 45%;
	padding: 0.5em 1em 0.8em 0;
}

.event__feature__logo{
	width: 75px;
	height: 75px;
	background: no-repeat 50% 50%;
	border-radius: 50%;
	background-size: cover;
}

.event__feature__desc{
	width: calc(100% - 75px);
	font-weight: bold;
	padding-left: 0.3em;
	margin-top: 0.5em;
}

.event__feature__number{
	font-size: 0.95em;
    line-height: 1.3em;
}

.event__feature__info{
	margin-top: 0.1em;
	text-transform: uppercase;
	font-size: 0.8em;
	line-height: 1.2;
}

.participant .organizations__list{
	margin: 3em 0 0;
	font-size: 0.75em;
}

.participant .organization{
	cursor: pointer;
	color: #fff;
	text-decoration: none !important;
}

.participant .organization__logo{
	width: 100px;
	height: 100px;
}

.app{
	padding: 2em 0;
}

.app__content_reverse{
	flex-direction: row-reverse;
}

.app__pictures, .app__info{
	width: 50%;
}

.app__logo{
	width: 10em;
	height: 10em;
	border-radius: 50%;
	background: no-repeat 50% 50%;
	background-size: cover;
	margin-bottom: 1em;
}

.app__pictures{
	position: relative;
	align-self: stretch;
}

.app_product .app__pictures{
	max-height: 37em;
}

.MOBILE .app__pictures,
.MOBILE .app__info{
	width: 100%;
	padding: 0;
}

.MOBILE .app__pictures{
	min-height: 26em;
}

.MOBILE .app__info{
	margin-top: 1.6em;
}

.app__picture__slider{
	display: flex;
	overflow-x: auto;
	position: relative;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-color: transparent transparent;
	scrollbar-width: none;
	height: 400px;
	/*background: #D4D8D5;*/
	background: transparent;
}

.app__bgarrows{
	position: absolute;
	bottom: 0;
	left: 0;
	background: #ff8200;
	opacity: 0.6;
	height: 4.2em;
	width: 7em;
	z-index: 5;
}

.app__arrow{
	position: absolute;
	width: 0;
	height: 0;
	border-top: 16px solid transparent;
	border-bottom: 16px solid transparent;
	cursor: pointer;
	z-index: 10;
}

.app__arrow_prev{
	/*bottom: 2.2em;
	left: 3.5em;*/
    bottom: 0.9em;
    left: 1.2em;
	/*border-right: 25px solid #ff8200;*/
	border-right: 1.5em solid #ff8200;
}

.app__arrow_next{
	/*bottom: 2.2em;
	left: 8em;*/
    bottom: 0.9em;
    left: 4.2em;
	border-left: 1.5em solid #ff8200;
}

.app__picture{
	width: 100%;
	height: 100%;
	background: transparent 50% 50% no-repeat;
	overflow: hidden;
	justify-content: start;
	flex-wrap: nowrap;
	background-size: cover !important;

	scroll-snap-align: start;
	flex-shrink: 0;
	transform-origin: center center;
	transform: scale(1);
	transition: transform 0.5s;
	position: relative;
}

.app__picture__image{
	flex: 1 0 100%;
	width: 100%;
	height: 100%;
	background: no-repeat 50% 50%;
	background-size: cover;
}

.app__info{
	padding: 4em 3em;
	text-align: left;
}

.app_product .app__info {
	padding: 0 3em;
}

.MOBILE .app_product .app__info{
	padding: 0;
}

.app__info_left{
	padding-left: 0;
}

.app__info label{
	color: #ff8200;
	text-transform: uppercase;
	font-size: 1.6em;
	font-weight: bold;
}

.app__info h1{
	font-size: 3.1em;
	line-height: 0.95em;
	padding: 0.2em 0 0.2em;
}

.MOBILE .app__info h1{
	font-size: 2.6em;
	padding-bottom: 0.1em;
}

.app__info h2{
	padding: 0.4em 0;
}

.app__info p, .app__info .p{
	line-height: 1.4em;
}

.app__info .p h1{
	font-size: 1.5em;
}

.app__info .p ul{
	font-size: 0.7em;
}

.app__info .p p{
	font-size: 1em;
}

.app__info .p a{
	color: #22312d;
}

.app__info .p h1{
	padding: 0 0 0.2em;
}

.MOBILE .app__info p, .MOBILE  .app__info .p{
	line-height: 1.6em;
}

.app__info .button--plus{
	margin-top: 3em;
}

.MOBILE .app__info .button--plus{
	margin-top: 2em;
}

.app__totals{
	margin: 0.5em 0;
	text-transform: uppercase;
	color: #273126;
	font-size: 0.95em;
}

a.app__event{
    color: #22312d;
    text-decoration: none;
}

a.app__event:hover{
    text-decoration: underline;
}

.app__event legend{
	font-size: 1.2em;
	color: #ff8200;
	text-transform: uppercase;
}

.app__event h2{
	font-size: 1.65em;
}

.app__event h2 .subtitle{
	margin-top: 0.3em;
	font-size: 0.75em;
	text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
}

.app_videos{
	background: #f2f3f2;
}

.app_videos .app__info{
	width: 38%;
}

.MOBILE .app_videos .app__info{
	width: 100%;
	margin-top: 0;
}

.app_videos .app__pictures{
	width: 56%;
	margin: 0 0 0 6%;
}

.MOBILE .app_videos .app__pictures{
	width: 100%;
	margin: 2.5em 0 0;
}

.app__video{
	width: 100%;
	height: 100%;
}

.app__video .app__picture{
	/*height: 19em;*/
	height: 440px;
}

.app__video .app__picture iframe{
	width: 100%;
	height: 100%;
}

.app__video .app__desc {
	flex-direction: column;
	background: #22312d;
	color: #fff;
	height: 40%;
	padding: 40px 20px;
}

.MOBILE .app__video .app__desc{
	flex-direction: row;
}

.app__video h2{
	font-size: 1.9em;
	line-height: 1;
	padding: 0;
}

.app__video p{
	font-size: 0.75em;
	padding-top: 1.1em;
}

.app_videos .app__bgarrows{
	top: 21em;
	right: 0;
	left: auto;
	width: 12em;
	height: 5em;
}

.app_videos .app__arrow_prev{
	top: 22.5em;
	right: 7.5em;
	left: auto;
}

.app_videos .app__arrow_next{
	top: 22.5em;
	right: 3em;
	left: auto;
}

.app__video .app__picture{
	position: relative;
}

.app__video__play {
    position: absolute;
    top: 50%;
	left: 50%;

    width: 22px;
    height: 17px;
    border-left: 1px solid transparent;
    border-bottom: 1px solid #fff;
    transform: rotate(90deg) scale(3.2);
    cursor: pointer;
}

.app__video__play,
.app__video__play::before {
    display: block;
    box-sizing: border-box;
    border-right: 1px solid transparent
}

.app__video__play::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    border-left: 1px solid #fff;
    border-top: 1px solid #fff;
    border-bottom: 1px solid transparent;
    transform: rotate(45deg) skew(10deg,10deg);
    left: 0;
	bottom: -11px;
}

.app__price{
	margin: 0.9em 0 1.2em;
	color: #919993;
}

.app__formField{
	background: #fff;
	width: 75%;
	margin: 0.5em 0 1.5em;
}

.app__formField_select{
	background: #fff no-repeat url(../img/dropdown_arrow.gif) 100% 50%;
	background-size: contain;
	overflow: hidden;
}

.app__formField select{
	text-transform: uppercase;
	border: none;
	background: transparent;
	padding: 0.5em 1em;
	color: #22312d;
	height: 3.2em;
	width: calc(100% + 3.2em);
}

.app__formField input{
	text-transform: uppercase;
	border: none;
	background: #fff;
	width: calc(100% - 50px);
	padding: 0.5em 1em;
	color: #22312d;
}

/*
.app__formField .dropdown{
	width: 50px;
	height: 50px;
	background: #ff8200;
	margin-left: auto;
	cursor: pointer;
}

.app__formField .dropdown svg{
	transform: rotate(90deg);
}*/

section.organizations,
section.events{
	margin: 2em 0;
}

section.numbers{
    margin: 4em 0 2em;
}

.organizations__list{
	margin-top: 2em;
	justify-content: start;
    align-items: start;
}

.MOBILE .organizations__list{
	margin-top: 3em;
}

.organization{
	flex: 0 1 33%;
	margin-bottom: 2.8em;
	align-items: start;
}

a.organization,
a.organization:hover{
    text-decoration: none !important;
    cursor: pointer;
    color: inherit;
}

a.organization .organization__desc label{
    text-decoration: none !important;
    cursor: pointer;
}

.organization > a{
	text-decoration: none;
}

.organization > a:hover{
	text-decoration: underline;
}

.organization > a *{
	cursor: pointer;
}

.MOBILE .organization{
	flex: 0 1 100%;
}

.organization__logo{
	width: 120px;
	height: 120px;
	border: solid 1px #555;
	background: no-repeat 50% 50%;
	background-size: cover;
	border-radius: 50%;
}

.organization__desc{
	align-self: start;
	width: calc(100% - 120px);
	overflow: hidden;
	padding: 0.1em 5% 0 3%;
	text-align: left;
}

.organization__desc label {
	display: block;
	height: 3.4em;
	overflow: hidden;
	font-family: 'Roboto', sans-serif;
	font-size: 1.6em;
	line-height: 1.1em;

	text-overflow: ellipsis;
}

.organization__desc label:hover{
	text-decoration: underline;
}

.organization__desc p{
	font-size: 0.9em;
	line-height: 1.4em;
}

.MOBILE .organization__desc p{
	margin-top: 0.2em;
	line-height: 1.5em;
}

.organization__links{
	margin-top: -1.5em;
	height: 25px;
	text-align: right;
	margin-right: 2em;
}

.organization__links a{
	text-decoration: none;
}

.tabulator{
	margin: 5em 0;
	width: 100%;
}

.tabulator__tabs{
	/*justify-content: start;*/
	justify-content: flex-end;
	flex-direction: row-reverse;
	align-items: flex-end;
	overflow: hidden;
}

.tabulator__tab{
    display: flex;
    align-items: center;

	cursor: pointer;
	color: #22312d;
	text-transform: uppercase;
	font-family: Arial;
	font-size: 1.1em;
	line-height: 1.5em;
	font-weight: bold;
	background: #F2F3F2;
	padding: 1.2em 2em 1.2em 3em;
	border-top-right-radius: 1em;
	margin-left: 0em;
	box-shadow: 1px 2px 5px #999;
}

.tabulator__tab:last-child{
	padding: 1.2em 2em;
	border-top-left-radius: 1em;
	margin-left: 0;
}

.tabulator__tab_selected,
.tabulator__tab:hover{
	background: #22312D;
	color: #f2f3f2;
	padding: 1.2em 2em;
	padding-top: 1.8em !important;
	padding-bottom: 1.8em !important;
	margin-left: 0;
	box-shadow: none;
	border-top-right-radius: 1em;
	border-top-left-radius: 1em;
}

.MOBILE .tabulator__tab{
    justify-content: center;
	font-size: 0.8em;
	padding: 0.8em 0.9em 0.8em 1.2em;
	margin-left: -0.2em;
    width: auto;
	max-width: 9em;
    min-height: 5em;
}

.MOBILE .tabulator__tab:last-child{
	padding: 0.8em 0.9em;
	margin-left: 0;
}

.MOBILE .tabulator__tab_selected,
.MOBILE .tabulator__tab:hover{
	padding: 0.8em 0.9em !important;
	margin-left: 0;
}

.tabulator__content{
	background: #22312D;
	color: #f2f3f2;
	padding: 2.5em 2em;
}

.MOBILE .tabulator__content{
	padding: 2em;
}

.memories{
	padding: 3em 6em;
	justify-content: start;
	align-items: start;
}

.MOBILE .memories{
	padding: 0;
	justify-content: space-around;
}

.memory{
	flex-direction: column;
    width: 25%;
	flex: 0 1 25%;
	padding: 1.2em 0;
}

.MOBILE .memory{
	flex: 0 1 45%;
	padding: 1.4em 0;
}

.memory .button{
	margin-top: 0.6em;
	font-size: 0.75em;
}

.MOBILE .memory .button{
	font-size: 0.85em;
}

.memory__logo{
	width: 130px;
	height: 130px;
	background: no-repeat url(../img/no_team.gif) 50% 50%;
	background-size: cover;
	border-radius: 50%;
}

.memory__place{
	margin-top: 2%;
	font-size: 0.6em;
	text-transform: uppercase;
	font-weight: bold;
	height: 20px;
}

.memory__title{
	color: #ff8200;
	font-family: 'Roboto', sans-serif;
	font-size: 1.2em;
	line-height: 1.2em;
	padding: 1% 8%;
    width: 100%;
    height: 2.6em;
    /*white-space: nowrap;*/
    overflow: hidden;
    text-overflow: ellipsis;
}

.memory__info{
	text-transform: uppercase;
	font-size: 0.75em;
}

.profile__info{
	width: 90%;
	padding: 0 2em;
	/*text-align: left;*/
}

.profile__info .form__field .item__half{
	display: block;
}

.profile__info .form__field label{
	width: 100%;
	text-align: left;
	display: inline-block;
}

.users__topList{
	padding: 3em 12em 1em;
	justify-content: start;
	font-size: 1em;
}

.MOBILE .users__topList{
	width: 100%;
	padding: 0;
	justify-content: space-around;
}

.MOBILE .users__topList .user:first-child{
	width: 100%;
	flex: unset;
}

.user{
    width: 32%;
	flex-direction: column;
	flex: 0 1 32%;
	padding: 1.2em 0;
	color: #f2f3f2;
	text-decoration: none;
}

.user__logo{
	width: 130px;
	height: 130px;
	background: no-repeat url(../img/no_avatar.gif) 50% 50%;
	background-size: cover;
	border-radius: 50%;
}

.user__place{
	margin-top: 2%;
	font-size: 0.6em;
	text-transform: uppercase;
	font-weight: bold;
	height: 20px;
}

.user__title{
	color: #ff8200;
	font-family: 'Roboto', sans-serif;
	font-size: 1.5em;
	line-height: 1.1em;
	padding: 0 8% 2%;
    width: 100%;
    /*white-space: nowrap;*/
    height: 2.3em;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user__info{
	text-transform: uppercase;
	font-size: 0.95em;
	line-height: 1.5;
	max-width: 7em;
}

.users__list{
	font-size: 0.8em;
	padding: 2em 4em 3em;
}

.MOBILE .users__list{
	justify-content: space-between;
}

.users__list .user{
	flex: 0 1 16%;
	padding: 1em 0 2em;
}

.MOBILE .users__list .user{
    flex: 0 1 45%;
}

.users__list .user__place{
	font-size: 0.7em;
}

.users__list .user__title{
	line-height: 1.1;
	padding: 0 8% 2%;
}

.users__list .user__info{
	text-transform: none;
	opacity: 0.8;
}

.users__list .user__logo{
	width: 100px;
	height: 100px;
}

.MOBILE .participant{
	padding: 7em 0 5em;
}

.participant .app__info{
	width: 30%;
	padding-top: 0;
	padding: 0 2em;
}

.participant .app__info h2{
	font-size: 2.7em;
}

.participant .app__event h2{
	font-size: 1.75em;
}

.participant .app__event a{
    color: #273126;
    text-decoration: none;
}

.participant .app__event a:hover{
    text-decoration: underline;
}

.MOBILE .participant .app__info{
	width: 100%;
	padding-left: 7%;
	padding-right: 7%;
	padding-bottom: 4em;
}

.participant .tabulator{
	width: 70%;
	margin-top: 0;
}

.MOBILE .participant .tabulator{
	width: 100%;
}

.participant__content{
	align-items: start;
}

.participant__paging{
	margin-top: 5em;
}

.MOBILE .participant__paging {
	display: flex;
    align-items: center;
    justify-content: space-around;
    margin-top: 3em;
}

.participant__paging .next,
.participant__paging .prev{
	margin: 0.85em 0;
	cursor: pointer;
	text-transform: uppercase;
	font-size: 1.45em;
	font-weight: bold;
	height: 3em;
	background: no-repeat 0 50%;
	padding-left: 4em;
	display: flex;
    align-items: center;
    color: #22312d;
    text-decoration: none;
}

.MOBILE .participant__paging .next,
.MOBILE .participant__paging .prev{
	padding-left: 5em;
}

.participant__paging .next{
	background-image: url(../img/p_next.gif);
}

.participant__paging .prev{
	background-image: url(../img/p_prev.gif);
}

.MOBILE .participant__paging .prev{
	background: no-repeat url(../img/p_prev.gif) 100% 50%;
	padding-left: 0;
	padding-right: 5em;
}

.catches{
	padding: 2em 0;
}

.catch{
	align-items: stretch;
	margin-bottom: 1em;
}

.MOBILE .catch{
	margin-bottom: 2em;
}

.catch__image{
	width: 45%;
	min-height: 15em;
	position: relative;

	align-self: stretch;
	background: no-repeat 50% 50%;
	background-size: cover;
}

.catch__image.none{
	background: #fff no-repeat url(../img/no_catch.gif) 50% 50%;
	background-size: auto;
}

.MOBILE .catch__image{
	width: 100%;
}

.catch__weight{
	color: #f7f5f6;
	font-size: 2.1em;
	text-transform: uppercase;
	font-weight: bold;
	position: absolute;
	top: 0;
	right: 0;
	padding: 1em 0.75em;
}

.catch__image.none .catch__weight{
	text-shadow: #888 1px 0 4px;
}

.catch__bg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.6;
	background: #ff8200;
}

.catch__bg_link{
	width: 7.8em;
	height: 2.8em;
	top: auto;
	bottom: 0;
	left: 0;
}

.catch__image .catch__link{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 7.8em;
	height: 2.8em;
	color: #fff;
	font-size: 1em;
	line-height: 2.8;
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	cursor: pointer;
}

.catch__desc{
	position: relative;
	width: 45%;
	background: #F2F3F2;
	padding: 1.4em 2em;
	text-align: left;
	color: #22312d;
}

.MOBILE .catch__desc{
	width: 100%;
}

.catch__balls{
	position: absolute;
	top: 0;
	right: 0;
	font-size: 2.1em;
	line-height: 1;
	padding: 0.5em 0.6em 0.6em 0.5em;
	color: #f2f3f2;
	background: #22312d;
}

.catch__title{
	color: #ff8200;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.4em;
}

.catch__info{
	font-size: 0.95em;
	line-height: 1.3em;
	margin: 0.6em 0 0;
	opacity: 0.65;
	text-transform: uppercase;
	text-decoration: none;
	color: #22312d;
}

.catch__check{
	display: block;
	font-size: 0.95em;
	line-height: 1.4em;
	text-transform: uppercase;
	margin: 1.2em 0;
}

.catch__check input {
    display: none;
}

.catch__check span{
	padding-left: 1.5em;
	background: no-repeat url(../img/tree-mark-off.jpg) 0% 50%;
	background-size: 1.2em;
	cursor: pointer;
}

.catch__check input:checked ~ span{
	background-image: url(../img/tree-mark-on.jpg);
}

.catch__actions{
	font-size: 0.7em;
	margin-top: 5em;
}

.MOBILE .catch__actions{
	margin-top: 3em;
}

.catch__actions .button{
	padding: 0.3em 2.5em;
}

.MOBILE .catch__actions .button{
	font-size: 1.2em;
}

.catch__disqualified .catch__image__legend{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.6em;
	background: #ff8200;
	opacity: 0.5;
}

.catch__disqualified .catch__balls{
	background: #ff8200;
}

.profile > .flexContainer{
	padding: 0 5em;
}

.MOBILE .profile > .flexContainer{
	padding: 0;
}

.profile .events__result, .profile .event{
	padding: 0;
}

.profile .event__image{
	width: 22%;
}

.profile .event__desc{
	width: 78%;
}

.MOBILE .profile .event__image,
.MOBILE .profile .event__desc{
	width: 100%;
}

.MOBILE .profile .event__desc{

}

.popupShadow {
    position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    overflow: hidden;
    background-color: #f2f2f2;
    opacity: 0;
    transition: opacity 0.2s linear;

}

.popupShadow.show {
    width: 100%;
    height: 100%;
    opacity: 0.6;
}

.popup {
	position: fixed;
	padding: 50px;
	width: 90%;
	max-width: 980px;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity .5s, visibility 0s linear .5s;
	transition: opacity .5s, visibility 0s linear .5s;
	z-index: 10001;
	background: #22312d;
	color: #fff;
	box-shadow: 0px 0px 20px 0px #555555;
}

.popup.show {
	visibility: visible;
	opacity: 1;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.popup .form__field{
    margin: 0.2em 0;
}

.popup__middle{
	margin: 1em 0 0;
	text-align: center;
}

.popup__middle iframe{
	width: 100%;
	height: 300px;
	border: none;
}

.popup__middle form{
	width: 100%;
}

.popup__middle form h1{
	width: 100%;
}

.popup.downloadCsv{
    max-width: 450px;
    padding: 60px 40px 55px;
    text-align: center;
}

.popup.downloadCsv .button{
    margin: 0 15px;
    width: 9em;
}

.popup.registeredUsersList{
	max-width: 600px;
    padding: 50px 5px;
}

.popup.registeredUsersList table{
	width: 100%;
	padding: 0 30px 20px;
}

.popup.registeredUsersList table td,
.popup.registeredUsersList table th{
	text-align: left;
}

.popup.registeredUsersList .button{
	font-size: 0.85em;
}

.popup .admin__info{
	font-size: 3.5em;
	line-height: 1.2em;
	margin-bottom: 0.6em;
}

.MOBILE .popup .admin__info{
    font-size: 2em;
}

.popup .admin__info .admin__email{
	font-size: 0.8em;
}

.popup .admin__info .admin__avatar{
	min-width: 150px;
	min-height: 150px;
	background: no-repeat 50% 50%;
	background-size: contain;
	margin-bottom: 0.3em;
}

.popup.calendar{
	max-width: 1200px;
	color: #22312d;
	border-radius: 1.2em;
	box-shadow: none;
	padding: 0;
	border: none;
	overflow: hidden;
	position: absolute;
	top: 50%;
	transform: translate(-50%, 0);
}

.MOBILE .popup.calendar{
	font-size: 0.5em;
}

.popup.calendar .close{
	right: 0.3em;
	top: 0.4em;
}

.MOBILE .popup.calendar .close{
	margin-top: 0.2em;
}

.calendar__month{
	background: #22312d;
	color: #f7f5f6;
	text-transform: uppercase;
	font-size: 2.8em;
	line-height: 1.5;
	font-weight: bold;
	padding: 0.5em 0;
}

.calendar__month__arrow{
	cursor: pointer;
	margin-top: 0.1em;
}

.calendar__month__arrow_next{
	margin-left: 0.6em;
}

.calendar__month__arrow_prev{
	margin-right: 0.6em;
}

.calendar__month__arrow_prev svg{
	transform: rotate(180deg);
}

.calendar__week{
	background: #22312d;
	padding: 0.5em 0;
}

.calendar__week__day{
	flex: 0 1 14.28%;
	color: #f7f5f6;
	font-size: 1.6em;
	line-height: 1.5;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
}

.calendar__days{
	justify-content: start;
	align-items: stretch;
	background: #A7ADAB;
	color: #22312d;
}

.calendar__day{
	flex: 0 1 14.28%;
	text-align: left;
	border-right: solid 1px #22312d;
	border-bottom: solid 1px #22312d;
	padding: 0.6em 0.3em 0.5em 0.5em;
	min-height: 11em;
	overflow: hidden;
}

.calendar__day_inactive{
	background: #656F6C;
}

.calendar__day:hover{
	background: #656F6C;
}

.calendar__day_lastWeek{
	border-right: none;
}

.calendar__day_lastMonth{
	border-bottom: none;
}

.calendar__day_current{
	background: #ff8200;
}

.calendar__day_current .calendar__day__number,
.calendar__day_current .calendar__events {
	color: #fff;
}

.calendar__day__number{
	font-size: 3.5em;
	line-height: 1.2;
	font-weight: bold;
	color: #43504D;
}

.calendar__events{
	margin-top: 0.3em;
	font-family: 'Roboto', sans-serif;
	font-size: 1em;
	line-height: 1.2em;
}

.MOBILE .calendar__events{
	font-size: 1.8em;
}

.calendar__event{
	display: block;
	margin-top: 0.2em;
	color: #43504D;
	text-decoration: none;
}

.calendar__event:hover{
	text-decoration: underline;
}

.popup h3{
	color: #fff;
}

.popup .close {
	position: absolute;
	right: 0;
	top: 0;
	/*padding: 5px;*/
	color: #f2f3f2;
	transition: color .3s;
	font-size: 4em;
	/*line-height: .6em;*/
	font-weight: bold;
	text-decoration: none;
}

.popup .close svg{
	width: 1em;
	height: 1em;
}

.popup .close:hover svg path{
	fill: #FF8200;
}

#popupImagesGallery{
	padding-bottom: 1em;
}

#popupViewImage{
	max-width: 700px;
}

#popupViewImage img{
	width: 100%;
}

.imagesGallery{
	height: 500px;
	position: relative;
}

.imagesGallery__bgarrows{
	position: absolute;
    /* top: 0; */
    bottom: 0;
    right: 0;
    background: #ff8200;
    opacity: 0.6;
    height: 5em;
    width: 100%;
    z-index: 9;
}

.imagesGallery__arrows{
    position: absolute;
    /* top: 0; */
    bottom: 0;
    /* right: 0; */
    left: 0;
    height: 5em;
    width: 100%;
    z-index: 10;
}

.imagesGallery__arrow{
	position: absolute;
	/*left: 36%;*/
	cursor: pointer;
	border-top: 1em solid transparent;
	border-bottom: 1em solid transparent;
}

.imagesGallery__arrow_prev{
    top: 32%;
    left: 10%;
    border-right: 25px solid #ff8200;
}

.imagesGallery__arrow_next{
    top: 32%;
    border-left: 25px solid #ff8200;
    right: 10%;
}

.imagesGallery__inner{
	height: 100%;

	display: flex;
    overflow-x: auto;
    position: relative;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: transparent transparent;
    scrollbar-width: none;
}

.imagesGallery__inner::-webkit-scrollbar,
.imagesGallery__inner::-webkit-scrollbar-thumb,
.imagesGallery__inner::-webkit-scrollbar-track
{
    display: none;
    background: transparent;
}

.imagesGallery__el
{
	height: 100%;
	width: 100%;
	background: #333 no-repeat 50% 50%;
	/*background-size: cover;*/
	background-size: contain;

    scroll-snap-align: start;
    flex-shrink: 0;
    transform-origin: center center;
    transform: scale(1);
    transition: transform 0.5s;
    position: relative;
}

.imagesGallery__title{
	padding: 0.6em 0 0.4em;
	color: #FF8200;
	font-size: 2em;
	text-transform: uppercase;
	white-space: nowrap;
	font-weight: bold;
}

.products{
	background: #F2F3F2;
	padding: 2.5em 0 3em;
}

.form__fields{
	margin: 2em 0 0;
	width: 60%;
}

.MOBILE .form__fields{
	width: 90%;
}

.form__field_flex2{
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    align-content: center;
}

.form__field{
	margin: 0.9em 0 1.1em;
	/*text-align: left;*/
}

.form__field.flexContainer{
    justify-content: space-between;
}

.form__field .label{
    text-align: left;
    display: block;
    font-weight: bold;
    margin-bottom: -5px;
    /*margin-top: 20px;*/
    width: 100%;
}

.form__field .key{
	text-align: left;
}

.form__field .exp,
.form__field .cvv-number{
	width: 45%;
}

.form__field .value.card-number
/*.form__field .exp .value,*/
/*.form__field .cvv-number .value*/{
	display: inline-block;
	width: 100%;
	border: solid 1px #fff;
	background: #fff;
	color: #22312d;
	margin: 0.8em 0;
	padding: 0.6em 1em;
	font-family: 'Oswald', sans-serif;
	font-size: 0.95em;
	overflow: hidden;
}

.form__field .value.card-number{
	/*height: auto;
	background: transparent;
	border: none;
	padding: 0px;*/
}

.form__field .value.card-number .input{
	margin: 0;
}

#VUE-addTournament .form__fields{
	margin: 0;
}

.form__field .input,
.form__field input,
.form__field select,
.form__field textarea{
	display: inline-block;
	width: 100%;
	border: solid 1px #fff;
    border-radius: 0;
	background-color: #fff;
	color: #22312d;
	margin: 0.8em 0;
	padding: 0.6em 1em;
	font-family: 'Oswald', sans-serif;
	font-size: 0.95em;
}

.popup .form__field .input,
.popup .form__field input,
.popup .form__field select,
.popup .form__field textarea{
    margin: 0.4em 0;
}

.form__field .input.StripeElement{
	height: 2.8em;
	overflow: hidden;
}

.form__field textarea:focus,
.form__field input:focus,
.form__field .input.StripeElement--focus{
	border-color: #22312d;
}

.form__field .input--error,
.form__field .input.StripeElement--invalid{
	border-color: #fa755a;
	color: #fa755a;
}

.form__field input:disabled,
.form__field select:disabled{
	opacity: 0.5;
}

.form__field input::placeholder,
.form__field select::placeholder {
	opacity: 0.5;
}

.form__field input:disabled::placeholder{
	opacity: 1;
}

.form__field input[type="radio"],
.form__field input[type="checkbox"]{
	width: auto;
	margin-right: 0.32em;
}

.form__field .item{
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.form__field .item__half{
	width: 48%;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.form__field .item.error{
	justify-content: center;
	height: 40px;
	color: #fa755a;
}

.form__field .item .key{
	width: 6em;
	margin-right: 1em;
	text-align: left;
}

.form__field .item .value{
	width: calc(100% - 7em);
}

.form__field .datetimepicker-dummy{
	margin: 0.5em 0;
	background: #fff;
}

.form__field .datetimepicker-dummy .datetimepicker-dummy-wrapper{
	border: none;
}

.form__field .datetimepicker-dummy .datetimepicker-dummy-wrapper:focus{
	border: solid 1px #22312d;
}

.form__field .datetimepicker-dummy input{
	margin: 0;
}

.form__field .datetimepicker-dummy .datetimepicker-clear-button{
	margin-top: 0.2rem;
}

.form__hint{
	font-size: 0.8em;
}

.form__hint a{
	color: inherit;
}

.costManagement{
	/*flex-direction: column;*/
}

.costManagement__save{
	margin-left: auto;
	font-size: 0.8em !important;
}

.costManagement__title{
	margin-right: auto;
	font-size: 1.8em !important;
	text-align: left;
}

.costManagement__form{
	width: 100%;
}

.costManagement__form textarea{
	width: 100%;
	height: 14em;
	padding: 1.1em 1.4em;
}

.costManagement__table{
	margin: 2em 0 0;
	width: 100%;
}

.costManagement__el{
	align-items: stretch;
	justify-content: start;
	text-align: left;
	margin: 0.3em 0 1.5em;
}

.costManagement__el_header{
	color: #f2f3f2;
	text-transform: uppercase;
	text-align: left;
	font-size: 1.2em;
	line-height: 1.5;
	margin-bottom: 0.8em;
}

.costManagement__td1{width:30%}
.costManagement__td2{width:28%; margin-left:auto;}
/*.costManagement__td3{width:22.5%}*/
.costManagement__td4{width:25%}
.costManagement__td5{width:15%}

.costManagement__td5 .button{
	/*float: right;*/
    margin-left: auto;
	font-size: 0.8em;
}


.MOBILE .costManagement__td1{width:100%; margin-bottom:0.4em;}
.MOBILE .costManagement__td2{width:40%; margin-left: 0;}
/*.MOBILE .costManagement__td3{width:20%}*/
.MOBILE .costManagement__td4{width:35%}
.MOBILE .costManagement__td5{width:25%}

.costManagement__name{
	cursor: pointer;
	font-size: 1.6em;
	line-height: 1.2;
}

.MOBILE .costManagement__name{
	font-size: 1.2em;
}

.costManagement__input{
	display: flex;
	align-items: center;
}

.costManagement__input .labelPrice{
	color: #000;
	background: #fff;
	height: 100%;
    max-height: 50px;
	display: flex;
	align-items: center;
	font-size: 0.7em;
	padding: 0 0.1em 0 1.3em;
}

.costManagement__input input,
.costManagement__input select{
	width: 95%;
	height: 100%;
	max-height: 50px;
	font-size: 0.67em;
	/*line-height: 1.2;*/
	padding: 1.1em 1.4em;
	letter-spacing: 0.1em;
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	border: none;
    border-radius: 0;
}

.costManagement__input select{
	background: #fff no-repeat url(../img/dropdown_arrows.gif) 100% 50%;
	background-size: contain;

	-webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

.login__form{
	width: 55%;
	padding: 2.5em 0;
	margin: 2em auto;
	border-radius: 1em;
	background: #fff;
	box-shadow: 0 1em 2em #2a362a;
}

.MOBILE .login__form{
	width: 90%;
	font-size: 1.2em;
}

.login__form h1{
	font-size: 3em;
	margin: 0;
	padding: 0;
}

.MOBILE .login__form h1{
    font-size: 2.4em;
}

.login__form .form__fields{
	margin-top: 1.2em;
	width: 78%;
}

.login__form .form__fields.has-error{
	color: #FF8200;
	font-size: 0.9em;
}

.login__form .form__field input,
.login__form .form__field select,
.login__form .form__field textarea{
	background: #f2f3f2;
	margin: 0.4em 0;
}

.login__form .form__field input:focus{
	background: #fff;
}

.login__form .product__select__collections{
	margin: 0.5em 0 0;
}

.form__field_file{
	margin: 0;
	text-align: left;
}

.form__field_file input[type="file"]{
	background: transparent;
	padding: 0;
}

/*.login__form .form__field input[type="file"]{
	width: auto;
	background: transparent;
}*/

.MOBILE .login__form .button{
	font-size: 0.9em;
}

.previewImage{
	max-height: 10em;
	padding: 0.6em 0;
}

.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected.inRange, .flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay {
    background: #ff8200 !important;
    border-color: #ff8200 !important;
}

input.flatpickr-input{
    text-align: left;
}

.flatpickr-current-month{
	display: flex !important;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    align-content: center;
}

.flatpickr-months .flatpickr-month{
	margin-top: 3px;
}

.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month{
	padding: 13px !important;
}

.flatpickr-current-month .flatpickr-monthDropdown-months:hover,
.flatpickr-current-month .numInputWrapper:hover{
	background: transparent !important;
}

.flatpickr-current-month .numInputWrapper span.arrowUp,
.flatpickr-current-month .numInputWrapper span.arrowDown{
	right: -5px;
}

.flatpickr-innerContainer{
	margin-top: 3px;
}

.flatpickr-time input{
	font-family: 'Oswald', sans-serif;
}

.swal-text{
    font-size: 20px;
}

.triangle_arr{
    position: relative;
    top: -5px;
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    border-right: 0.14em solid white;
    border-top: 0.14em solid white;
    margin-right: 0.5em;
    margin-left: 0.5em;
}

.triangle_arr.left {
    transform: rotate(225deg);
    top: -1px;
}

.triangle_arr.right {
    transform: rotate(45deg);
    top: -1px;
}

.triangle_arr.down {
    transform: rotate(135deg);
}

.triangle_arr.up {
    transform: rotate(-45deg);
    top: 2px;
}