/*600
Theme Name: Daad Gathering 2023
Theme URI: https://daad.hu
Author: Mnemotechnika Ltd.
Author URI: https://mnemotechnika.hu
Description: Daad Gathering 2023 Wordpress Theme.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: ajax, responsive, wordpress
*/

* {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: inherit;
	font-weight: inherit;
	font-family: inherit;
	font: inherit;
	text-align: inherit;
	text-transform: inherit;
	vertical-align: inherit;
	list-style-type: none;
	outline: none;
	text-decoration: none;
	border-collapse: collapse;
	border: none;
	border-color: transparent;
	font-family: inherit;
	color: inherit;
	line-height: inherit;
	transition: all 0s linear; 
	background-repeat: no-repeat;
	position: relative;
}

::-webkit-scrollbar {
	width: calc( 0.5vw + 0.5vh );
	height: calc( 0.5vw + 0.5vh );
	background: transparent;
}
::-webkit-scrollbar-track {
	background: transparent;
}
::-webkit-scrollbar-thumb {
	background: rgb( 10, 30, 60 );
	background: rgba( 10, 30, 60, 0.5 );
	border-radius: 0px;
}
::-webkit-scrollbar-thumb:hover {
	background: rgb( 10, 30, 60 );
}

html {
	background-color: rgb( 10, 30, 60 );
	text-align: center;
	font-family: 'VT323', monospace;
	font-size: calc( 3vh + 1vw );
	line-height: calc( 3vh + 1vw );
	text-transform: uppercase;
	color: rgb( 196, 189, 127 );
	overflow-y: overlay;
	scroll-behavior: smooth;
	vertical-align: baseline;
}

body {
	transition: opacity 1s linear;
	opacity: 0;
}

iframe {
	width: 140%;
	margin-left: -20%;
}

video {
	pointer-events: none;
}
video::-webkit-media-controls {
	display: none !important;;
}
video::-webkit-media-controls-panel,
video::-webkit-media-controls-panel-container,
video::-webkit-media-controls-start-playback-button {
	display:none !important;
	-webkit-appearance: none;
}

body > svg {
    height: 0;
	width: 0;
	display: block;
}

#loop,
.loop,
#delete,
#rotor {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    
}
.loop {
	transition: opacity 3s linear;
	opacity: 0;
}
.fadein {
	opacity: 1;
}
.fadeout {
	opacity: 0;
}






#content,
#carousel,
#pass-content,
#menu-content,
#timeline-content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	min-height: 100vh;
	visibility: hidden;
	z-index: 0;
}
#menu-content {
	width: calc( 100% - 20px );
	min-height: calc( 100vh - 20px );
}
#timeline-content {
	display: none;
}
#menu-content.open,
#pass-content.open,
#timeline-content.open,
#carousel.open,
#content.open {
	visibility: visible;
	z-index: 1;
}
#timeline-content.open {
	display: block;
}

#pass-button,
#menu-button,
#timeline-button,
.language {
	position: fixed;
	top: 0;
	display: block;
	margin: calc( 1vw + 1vh );
	z-index: 2;
	
}
#pass-button {
	left: 0;
}
#menu-button {
	right: 0;
}
#timeline-button {
	left: 0;
	top: auto;
	bottom: 0;
}
#menu-button.open .menu,
#pass-button.open .pass,
#timeline-button.open .timeline,
#menu-button .close,
#pass-button .close,
#timeline-button .close {
	display: none;
}
#menu-button.open .close, 
#pass-button.open .close,
#timeline-button.open .close {
	display: block;
}
.language {
	bottom: 0;
    top: auto;
    right: 0;
}
.language svg {
	height: calc( 5vw + 5vh );
	width: calc( 5vw + 5vh );
	display: block;
	fill:rgb( 196, 189, 127 );
}




#logo {
	height: calc( 10vw + 10vh);
	width: calc( 16vw + 16vh );
	padding: calc( 1.3vw + 1.3vh );
	margin: 0 auto;
	display: block;
}





#list,
#category {
	font-size: calc( 4.5vh + 1.5vw );
	padding: calc( 9vh + 3vw ) calc( 9vh + 3vw );
}
#list {
	z-index: 0;
	width: 100%;
	position: absolute;
	top: 50%;
	-ms-transform: translateY( -50% );
	transform: translateY( -50% );
	padding: 0;
}
.separator {
	font-size: calc( 3vh + 1vw );
	font-weight: 600;
	margin: calc( 3vh + 3vw );
}

#list a,
#category a,
#list span,
.separator {
	display: inline-flex;
	margin: calc( 0.2vw + 0.2vh );
	padding: calc( 0.2vw + 0.2vh );
	line-height: calc( 3vh + 1vw );
	vertical-align: middle;
}
#menu-button:hover,
#pass-button:hover,
#timeline-button:hover,
#list a:hover,
#category a:hover  {
	color: rgb( 10, 30, 60 );
	background-color: rgb( 196, 189, 127 );
}

#pass {
	width: 80vw;
	min-height: 60vh;
	margin: 0 auto;
}

#timeline-content #stages,
#timeline-content #timeline {
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
	display: inline-block;
	vertical-align: middle;
}
#timeline-content #timeline {
	width: calc( 100% - ( 10vw + 10vh ) - 8px );
	-webkit-user-select: none; /* Safari */
  	-ms-user-select: none; /* IE 10 and IE 11 */
	user-select: none; /* Standard syntax */
}


#timeline span,
#stages span {
	display: inline-grid;
	padding: 0 calc( 1vw + 1vh );
	white-space: normal;
	height: 100%;
	align-items: center;
	width: calc( 8vw + 8vh );
	border: 1px solid rgba( 234, 220, 175, 0.8 );
}
#timeline-content .stage {
	display: block;
	width: fit-content;
	margin: calc( 1vw + 1vh ) 0;
	height: calc( 4vw + 4vh )
}
#timeline-content #stages .stage {
	width: 100%;
}
#timeline span {
	margin: 0 calc( 0.5vw + 0.5vh );
}
#timeline .item {
	background-color: rgb( 234, 220, 175 );
	color: rgb( 10, 30, 60 );
}
#stages .stage-name {
	background-color: rgb( 10, 30, 60 );
}
#timeline .uncategorized {
	opacity: 0;
}

#timeline .tba {
	background-color: rgba( 234, 220, 175, 0.1 );
}
#timeline .long3600 {
	width: calc( 6vw + 6vh )
}
#timeline .long5400 {
	width: calc( 9vw + 9vh )
}
#timeline .long7200 {
	width: calc( 12vw + 12vh )
}
#timeline .long9000 {
	width: calc( 15vw + 15vh )
}
#timeline .long10800 {
	width: calc( 18vw + 18vh )
}

#footer {
    position: absolute;
	left: 10px;
    width: calc( 100% - ( 16vh + 16vw ) - 20px);
	padding: 0 calc( 8vh + 8vw );
}
#footer .down {
	vertical-align: baseline;
}









.carousel-cell {

}
.carousel-cell.actual {
}



#carousel {
}
#carousel .flickity-viewport {
	width: 100%;
	position: absolute;
	overflow-y: auto;
}
#carousel .carousel-cell {
	background: none;
	padding: calc( 5vh + 5vw ) calc( 20vh + 20vw );
	width: calc( 20vh + 20vw );
}
#carousel .carousel-cell .content {
	
}
#carousel .carousel-cell.wide {
	
}
#carousel .carousel-cell .title {
	font-size: calc( 4.5vh + 1.5vw );

}
#carousel .carousel-cell img.featured {
	width: 100%;
	filter: grayscale( 1 );
	filter: url( #cmDaadStage );
	-webkit-filter: grayscale( 1 );
	-webkit-filter: url( #cmDaadStage );
	margin-bottom: calc( 0px - 3vh - 1vw );
	cursor: pointer;
}
#carousel .carousel-cell.wide img,
#carousel .thumbnail:hover img {

}
#carousel .thumbnail {
    display: block;
}
#carousel .title {
	margin-top: calc( 1vh + 1vw );
	margin-bottom: calc( 1vh + 1vw );
}
#carousel .content {
	text-align: center;
	text-transform: none;
}
#carousel .soundcloud {
	width: calc( 100% - 20px );
	opacity: 0.8;
	margin: 0 10px;
}
#carousel .content a {
	text-decoration: underline;
}
#carousel .content p {
	margin: calc( 1vh + 1vw ) 0;
}
#carousel h2 {
	margin: 0;
}
#carousel .content strong {
}



.page {
	background: none;
	padding: calc( 3vh + 3vw );
	text-transform: none;
}

.flickity-slider {
	height: auto;
}

.flickity-prev-next-button {
}
.flickity-button svg {
	display: none;
}
.flickity-prev-next-button.next {
}
.flickity-prev-next-button.previous {
}
.flickity-button:hover {

}
.flickity-button:active {
	display: none;
}
.flickity-button:disabled {
	display: none;
}

@media screen and ( max-width: 480px ) {
	#pass-button,
	#menu-button {
		text-orientation: upright;
		writing-mode: vertical-lr;
		letter-spacing: -1vh;
	}
}