/*
	Theme Name: Dzikie Gziki - Zawody
	Theme URI: https://zawody.dzikiegziki.pl/
	Description: Dedykowany motyw WordPress
	Author: Studio G44
	Author URI: http://www.g44.pl
	Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Dosis:wght@200;300;400;500;600;700;800&display=swap');


body {
	background: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
	font-smoothing: antialiased;
	width:100%;
	height:100%;
	position: absolute;
	margin:0px;
	color: #000;
	font-size: 2.5vh;
	letter-spacing: 0.05em;
	padding:0px;
	font-family: 'Dosis', sans-serif;
}

.admin-bar{
	top:32px;
}
/*
@keyframes changeContent {
  0% {
	opacity: 100;
  }
  30% {
	opacity: 0;
  }
  100% {
	opacity: 100;
  }
}

.change_content{
	opacity: 100;
	animation-name: changeContent;
	animation-iteration-count: 1;
	animation-timing-function: ease-in-out;
	animation-duration: 2s;
	animation-delay: 0s;
}

@keyframes OpacityTo1 {
  0% {
	opacity:0;
	transform: translate3d(0px, 80px, 0px);
  }
  100% {
	opacity:1;
	transform: translate3d(0px, 0px, 0px);
  }
}
*/
p{
	line-height:120%;
	margin: 0px;
}

a{
	text-decoration:none;
	color: #ef3453;
	font-weight: 500;
}

a:hover{
	color: #af0521;
}

h1{
    text-align: center;
    font-size: 5vh;
    line-height: 5vh;
    text-transform: uppercase;
    font-weight: 700;
    color: rgb(0 0 0 / 25%);
    margin: 0;
    margin-top: 2vh;
    margin-bottom: 2vh;
}

@keyframes logoAnim {
  0% {
	opacity:1;
  }
  20% {
	opacity:0.7;
  }
  50% {
	opacity:1;
  }
  100% {
	opacity:1;
  }
}


.logo{
	display:table;
	margin: auto auto 3vh auto;
	width: 17vh;
	animation-name: logoAnim;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	animation-duration: 4s;
	animation-delay: 0s;
}

h2{
	text-align: center;
	margin: 0;
	margin-bottom: 4vh;
	text-transform: uppercase;
	font-weight:500;
	font-size: 8vh;
}

h2 strong{
	font-weight:700;
	font-size: 1.5em;
}

h3{
	font-size: 26px;
	line-height: 120%;
	margin: 0px 0px 10px 0px;
}

.de h3{
	background:rgb(0 0 0 / 15%);
	padding:10px;
	margin-bottom: 70px;
}

div{
	box-sizing: border-box;
}

.flex{
	display:flex;
	flex-direction: column;
	min-height: 100%;
}

.container{
	position: relative;
	flex-basis: 0;
	flex-grow: 1;
	min-width: 0;
	word-break: break-word;
	overflow-wrap: break-word;
	width: 100%;
	display: table;
	/* background: url(images/dg-bg1.jpg) no-repeat center center #faff4d; */
	background: #f0fd60;
	background: -moz-linear-gradient(-45deg,  #f0fd60 0%, #daeb39 100%);
	background: -webkit-linear-gradient(-45deg,  #f0fd60 0%,#daeb39 100%);
	background: linear-gradient(135deg,  #f0fd60 0%,#daeb39 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0fd60', endColorstr='#daeb39',GradientType=1 );
}

.container-middle{
	vertical-align: middle;
	display: table-cell;
	font-weight: 400;
	line-height: 125%;
	padding: 22px 0px;
}

.wrapper{
    width: 85%;
    margin:auto;
}

.full-width .wrapper{
    width: 96%;
    margin:auto;
}

.full-width .col{
    padding: 0 2.5%;
    box-sizing:border-box;
}

.row{
	display: flex;
	text-align: center;
}

.valign-top .col{
	align-self:start;
}

.col{
	width: -webkit-fill-available;
	text-align: center;
	align-self: center;
}

.tor-lewy{
	border-color: red !important;
}

.tor-prawy{
	border-color: blue !important;
}

.row.druzyny{
	align-items: stretch;
}

.row.druzyny .col{
	font-size: 7.5vh;
	line-height: 7.5vh;
	padding:0px;
	font-weight: 700;
	border-top: 1.5vh solid rgb(0 0 0 / 15%);
	border-bottom: 1.5vh solid rgb(0 0 0 / 15%);
	padding:1vh;
	align-self: auto;
	display: flex;
	justify-content: center;
}

.row.druzyny .col span,
.row.druzyny .col .span{
	align-self: center;
}

.row.druzyny .col:nth-child(2n-1){
    padding: 1.5vh;
}

.row.druzyny .col:nth-child(2){
    font-size: 7vh;
    padding-bottom: 2vh;
    color: rgb(0 0 0 / 50%);
    border: none;
    background:rgb(0 0 0 / 15%);
}

.row.punkty .col{
	font-size: 15vh;
	font-weight: 700;
	padding: 0px 0px 5vh 0px;
}

.row.punkty .col:nth-child(2n-1){
    font-size: 24vh;
    font-weight: 700;
    line-height: 24vh;
    padding: 0 0 1.5vh 0;
    -webkit-text-stroke: 2px #f0fc5f;
    text-shadow: 0px 0px 50px rgb(0 0 0 / 50%);
}


.row.bledy .col{
	border-top: 0.4vh solid rgb(0 0 0 / 15%);
	border-bottom:0.4vh solid rgb(0 0 0 / 15%);
	padding: 2vh;
	font-size: 4.5vh;
	text-transform:uppercase;
	align-self: auto;
	display: flex;
	justify-content: center;
}

.row.bledy .col span,
.row.bledy .col .span{
	align-self: center;
}


.row.bledy .col span .hydrated:nth-child(2){
	color:red;
}

.row.bledy .col:nth-child(2n){
    background:rgb(0 0 0 / 15%);
    border:none;
    font-size: 5vh;
    font-weight: 500;
}


/* TABLE */
table {
	margin:auto;
	width:100%;
	border-collapse: collapse;
	letter-spacing:0px;
	font-size:18px;
	font-weight:500;
	line-height:125%;
	border-style: hidden;
}

table:not(.table_1) {
	margin-bottom:30px;
}

table tr td {
	padding: 5px 5px;
	vertical-align: middle;
	white-space: nowrap;
	min-width:20px
}

.table_1 tr td {
	padding: 2px 5px;
}

table td, table th {
    border: 1px solid rgb(0 0 0 / 20%);
}

table tr:nth-child(even) td {
	background: transparent;
}

table tr:nth-child(odd) td {
	background: transparent;
}


table tr td:first-child{
	background:transparent !important
}

table tr:first-child td {
	background: rgb(0 0 0 / 35%) !important;
	text-transform:uppercase;
	font-weight:500;
	color:#fff;
}

table tr td.bg-transparent{
	background:transparent !important;
	color:#000;
}

table tr td.bg-wynik{
	background:rgb(0 0 0 / 35%) !important;
	text-transform:uppercase;
}

table tr td.bg-red{
	background:red !important;
	text-transform:uppercase;
}

table tr td.bg-blue{
	background:blue !important;
	text-transform:uppercase;
}

table tr td.wynik{
	background:rgb(0 0 0 / 16%) !important;
	text-transform:uppercase;
	font-weight:700;
}

table tr td.przerwa{
	background:rgb(0 0 0 / 8%) !important;
	text-transform:uppercase;
}

table tr td.przerwa60{
	font-weight:600;
}



/* DOUBLE ELIMINATION */
.de.col{
	padding:2.5%;
	/* align-self: stretch; */
}

.de .col{
	padding:0px;
	position: relative;
	margin-bottom:5px;
}

.de .long{
	padding:0px;
	align-self: stretch;
}

.de .long span,
.de .long .span{
	margin-bottom:100%;
}

.de .red{
	border-left:2px solid red;
	border-top:2px solid red;
	position:relative;
}

.de .blue{
	border-right:2px solid blue;
	border-top:2px solid blue;
	position:relative;
}

.de .red-blue-top{
	border-top:2px solid blue;
	position:relative;
}

.de .red-blue-top:after{
	height: 2px;
	width: 50%;
	content:"";
	position:absolute;
	top: -2px;
	left:0px;
	z-index: 9999;
	background: red;
}

.de .red-top{
	border-top:2px solid red;
	position:relative;
}

.de .blue-top{
	border-top:2px solid blue;
	position:relative;
}

.de span,
.de .span{
	font-size:14px;
	line-height:125%;
	letter-spacing:0;
	background:#f6ff96;
	padding:4px;
	display:block;
	margin-top: 20px;
	min-height: 8px;
	width: 140%;
}

.de span h6,
.de .span h6{
	font-size:14px;
	font-weight:400;
	line-height:125%;
	padding:0px;
	margin:0px;
}

.de .red span,
.de .red .span{
	left: -45%;
	position: relative;
}

.de .blue span,
.de .blue .span{
	right: -5%;
	position: relative;
}

.de .blue b{
	position:absolute;
	top: -18px;
	right: 0;
	width: 20px;
	text-align: center;
}

.de .red b{
	position:absolute;
	top: -18px;
	left: 0;
	width: 20px;
	text-align: center;
}

.de b{
	font-size:11px;
}

.de strong{
	font-size:11px;
	text-transform:uppercase;
	line-height:125%;
	letter-spacing:0;
	padding:4px;
	display:block;
	position:absolute;
	top:0px;
	left:-50%;
	width:100%;
}

.de .blue-top strong{
	width:200%;
	left: -100%;
}

.de .zwyciezca{
	top: -65px;
	font-size: 13px;
	width: 200px !important;
	left: -100px !important;
}

.de em{
    font-style: normal;
    text-align:center;
    font-size:12px;
    font-weight:700;
    line-height:125%;
    letter-spacing:0;
    padding:2px;
    background:#f5fcbe;
    display:block;
    position:absolute;
    top: -21px;
    width:15px;
    min-height: 15px;
}

.de .blue-top em,
.de .blue em{
	left: 0px;
}

.de .red-top em,
.de .red em{
	right: 0px;
}

.podium{
	font-size:13px;
	font-weight:600;
	line-height:140%;
	text-align:left;
	position:absolute;
	letter-spacing: 0;
	width: 200px;
	left:0px;
	top: -30px;
}

.podium ol{
	margin:0px;
	padding: 0px 0px 0px 15px;
}

.sponsorzy{
	background:#f0fd60;
	flex-basis: 0;
	min-width: 0;
	background: #fff;
	padding: 10px 0px;
	box-sizing: border-box;
	width:100%;
	text-align:
	center;
}

.page-id-7 .sponsorzy{
	display:none;
}

.logo-slider {
    display:none;
}

.slick-initialized{
	display:block;
}

.slick-prev,
.slick-next {
    width: 30px;
    height: 52px;
}

.slider .slick-prev{
    left: -30px;
    background:url(images/arrow-to-left.png);
    background-size:30px;
}

.slider .slick-next{
    right: -30px;
    background: url(images/arrow-to-right.png) no-repeat;
    background-size: 30px;
}

.slider .slick-slider{
	padding: 0px 0px;
}

.slider .slick-list{margin: 0px;}

.slick-dots{
	display:none !important;
}

.slider > div > div > div {
	display:none;
}

.slick-track{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

.slick-track > div{
	float: none !important;
	flex-basis: auto;
}

.slider img{
	max-width: 60%;
	width: auto;
	max-height: 10vh;
	height: auto;
	margin: auto;
}

.slider img.bigger-logo{
	max-width: 100%;
	max-height: none;
}

.mobile-menu{
	/* display:none; */
	position: fixed;
	top: 20px;
	right: 25px;
	z-index: 9999;
	width: 40px;
	height: 38px;
	cursor:pointer;
}

.navigation{
	position:fixed;
	width:100%;
	height:100%;
	z-index:999;
	background: rgb(0 0 0 / 90%);
	display:none;
}

.mobile-menu-opened .navigation{
	display:table;
}

.navigation>div{
	margin:auto;
	display:table-cell;
	vertical-align:middle;
}

.navigation ul{
	margin:auto;
	list-style-type:none;
	padding:0px;
	width:300px;
	text-align:center;
}

.navigation ul li{
	padding:10px 0px;
}

.navigation ul li a{
	padding:10px;
	display:block;
	color:#fff;
	text-decoration:none;
	font-weight:600;
}

.navigation ul li a:hover{
	color:#f0fd60;
}

.mobile-menu:hover .menuhr{
    background:#ef3453;
}

.mobile-menu .menu01,
.mobile-menu .menu02,
.mobile-menu .menu03{
	width: 100%;
	height: 2px;
	background: #000000;
	margin: 8px 0px;
	-webkit-transition: all 0.2s ease 0s;
	-moz-transition: all 0.2s ease 0s;
	-o-transition: all 0.2s ease 0s;
	-ms-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}

.closemenu .menuhr{
	background: #ef3453 !important;
}

.closemenu .menu01{
	transform: rotate(45deg);
	margin-top: 18px !important;
}

.closemenu .menu02{
	transform: rotate(-45deg);
	margin-top: -10px !important;
}

.closemenu .menu03{
	display:none;
}

@keyframes rotateAnim {
  0% {
	transform: rotate(45deg);
	background:yellow;
  }
  40% {
	transform: rotate(45deg);
	background:orange;
  }
  65% {
	transform: rotate(0deg);
	background:pink;
  }
  100% {
	transform: rotate(315deg);
	background:yellow;
  }
}


.rotateAnim{
	animation-name: rotateAnim;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	animation-duration: 2s;
	animation-delay: 0s;
}

.admin-bar .mobile-menu{
		top:50px;
	}

@media (min-width: 1360px), (min-height:1500px) {
	.mobile-menu{
		display:none !important;
	}

	.admin-bar{
		top:0px;
	}

	.admin-bar .mobile-menu{
		top:20px;
	}

	#wpadminbar{
		display:none !important
	}
}

@media (max-width: 1680px) {
    .row-de{
    	display:table;
    	width:100%;
    }

    .de.col{
    	width:100%;
    	padding: 3% 8%;
    	position: relative;
    }
}

@media (max-width: 1360px) {
	
	h3{
        font-size:22px;
        letter-spacing:0;
	}

	table{
		font-size:15px;
	}

	table tr td {
		white-space:normal;
		min-width:20px
	}

	table tr:first-child td {
		white-space:nowrap;
		font-weight: 700;
	}

	.row.punkty .col:nth-child(2n-1){
        text-shadow: 0px 0px 30px rgb(0 0 0 / 20%);
	}
}

@media (max-width: 900px) {
    .full-width .row:not(.row-de .row){
    	display:table;
    	width:100%;
    }

    .full-width .col{
    	width:100%;
    }

    .row.punkty .col:nth-child(2n-1){
        text-shadow: 0px 0px 20px rgb(0 0 0 / 20%);
	}
}


@media (max-width: 768px) {
	.container-middle {
		padding: 40px 0px;
	}

	.row.punkty .col:nth-child(2n-1){
		font-size: 110px;
		line-height: 110%;
        text-shadow: 0px 0px 20px rgb(0 0 0 / 20%);
	}

	.row.punkty .col {
		font-size: 90px;
		padding: 0px 0px 30px 0px;
	}

	.row.bledy .col {
        padding: 1vh;
        font-size: 25px;
	}

	.row.bledy .col:nth-child(2n) {
		font-size: 20px;
	}

	.row.druzyny .col {
		font-size: 20px;
		line-height: 120%;
		font-weight: 600;
	}

	.row.druzyny .col:nth-child(2n-1){
		padding: 1vh;
	}

	.row.druzyny .col:nth-child(2) {
        font-size: 20px;
	}

	h2 {
		font-size: 40px;
		margin-bottom: 3vh;
    }

    .logo {
		margin: auto auto 2vh auto;
		width: 50%;
		max-width:160px;
    }

    .de b{
    	font-size:8px !important;
    }

    .de strong{
    	font-size:8px !important; 
    }
}


@media (max-width: 600px) {
	.row-de{
		zoom:0.7;
	}
	table{
		min-width: 280px;
		width: 100%;
		font-size: 13px;
	}
	table tr:first-child td {
		white-space:normal;
	}

	table tr td {
		padding: 4px 3px;
		min-width:15px
	}
}