body {
	
    font-family: 'Gotham Narrow1', Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	overflow-x: hidden !important;
}

.nav-item {
	font-size: 12px !important;
	line-height: 14px;
}
.nav-link {
	color: #fff !important;
}
h4 {
	font-size: 16px;
	line-height: 19px;
}
h3 {
	font-size: 34px;
	line-height: 41px;
}
h5 {
	font-size: 24px;
	line-height: 29px;
}
h2 {
	font-size: 20px;
	line-height: 25px;
	font-family: 'Gotham Narrow2';
}
@media (max-width: 580px) {
	h2 {
		font-size: 14px;
	    line-height: 17px;
	}
	h5 {
	font-size: 18px;
	line-height: 23px;
    }
}
.live_stream {
	margin-top: -80px;
	height: 450px;
	overflow: hidden !important;
}
.live_div {
	margin-top: 90px;
}
@media (max-width:580px) {
	.live_stream {
	height: 800px !important;
	margin-top: -50px!important;
	}
	.div_90 {
		transform: rotate(90deg);
		
	}
	.div_90_1 {
		transform: rotate(-90deg);	
	}
	.date {
		transform: rotate(-90deg);
		margin-bottom: 40px !important;
		
	}
}
.btn_pill {
	width: 0;
    height: 0;
    border: 20px solid transparent;
    border-bottom-color: #89D4FF;
    position: relative;
    top: -20px;
	
}
.btn_pill:after {
	  content: '';
      position: absolute;
      left: -20px;
      top: 20px;
      width: 0;
      height: 0;
      border: 20px solid transparent;
      border-top-color: #89D4FF;
}
.btn_pill2 {
	background-color: #89D4FF;
	width: 22px;
	height: 22px;
	border-radius: 50%;
}
@media (max-width:580px) {
	.btn_pill2 {
		width: 18px;
	    height: 18px;
		margin-top: 1px !important;
	}
}
.progress {
	background-color: #89D4FF;
}
.live_img {
	margin-top: -60px;
}
.date {
	background: linear-gradient(101.18deg, rgba(236, 252, 255, 0.56) 5.56%, rgba(156, 219, 255, 0.36) 106.86%);
    box-shadow: 0px 60.2941px 48.2353px rgba(41, 72, 152, 0.05), 0px 39.0795px 28.2489px rgba(41, 72, 152, 0.037963), 0px 23.2244px 15.3638px rgba(41, 72, 152, 0.0303704), 0px 12.0588px 7.83823px rgba(41, 72, 152, 0.025), 0px 4.91285px 3.93028px rgba(41, 72, 152, 0.0196296), 0px 1.11656px 1.89815px rgba(41, 72, 152, 0.012037);
    border-radius: 66.8541px;
	padding: 7px 30px 3px 30px !important;
	border: 1px solid #89D4FF;
		
}
a.btn_pill {
	margin-top: -19px !important;
}
.kreis {
	background: linear-gradient(101.18deg, rgba(255, 255, 255, 0.33) 5.56%, rgba(255, 255, 255, 0.17) 106.86%);
	box-shadow: 0px 103.669px 82.9355px rgba(41, 72, 152, 0.05), 0px 67.1931px 48.571px rgba(41, 72, 152, 0.037963), 0px 39.9319px 26.4165px rgba(41, 72, 152, 0.0303704), 0px 20.7339px 13.477px rgba(41, 72, 152, 0.025), 0px 8.44713px 6.75771px rgba(41, 72, 152, 0.0196296), 0px 1.9198px 3.26366px rgba(41, 72, 152, 0.012037);
    border-radius: 114.944px;
	border: 0.71px solid #89D4FF;
	width: 152.83px;
    height: 150.28px;
	
   
}
.kreis2 {
	background: linear-gradient(101.18deg, rgba(255, 255, 255, 0.33) 5.56%, rgba(255, 255, 255, 0.17) 106.86%);
	box-shadow: 0px 103.669px 82.9355px rgba(41, 72, 152, 0.05), 0px 67.1931px 48.571px rgba(41, 72, 152, 0.037963), 0px 39.9319px 26.4165px rgba(41, 72, 152, 0.0303704), 0px 20.7339px 13.477px rgba(41, 72, 152, 0.025), 0px 8.44713px 6.75771px rgba(41, 72, 152, 0.0196296), 0px 1.9198px 3.26366px rgba(41, 72, 152, 0.012037);
    border-radius: 182.55px;
	height: 293.06px;
    width: 298px;
	border: 0.71px solid #89D4FF;
   
}
.trikot {
	width: 230px;
	margin-left: -48px;
	margin-top: -40px;
}
.psd-file {
	width: 140px;
	margin-left: -5px;
}
.upload {
	width: 140px;
	margin-top: -10px !important;
	margin-left: -5px;
}
.profil {
	width: 150px;
}
.profil2 {
	width: 280px;
}
.profil_1 {
	height: 160px;
	overflow: hidden;
}
.profil_1_1 {
	height: 294px;
	overflow: hidden;
}
.trikot2 {
	margin-bottom: -100px!important;
	padding: 30px;
	margin-left: -40px !important;
}
.div_tr {
	height: 400px;
	overflow: hidden;
}
@media (max-width: 580px) {
	.div_tr {
	height: 850px;
	overflow: hidden;
	margin-top: -100px !important;
	}
	.div_trikot {
		height: 630px !important;
		clip-path: polygon(60% 5%, 75% 0, 100% 0, 100% 100%, 70% 100%, 0 100%, 0 100%, 0 5%) !important;
	}
	.bg_uplod {
	clip-path: polygon(13% 0, 25% 1%, 100% 1%, 100% 100%, 25% 100%, 0 100%, 0 0) !important;
	margin-top: -45px !important;
	}
	.trikot2 {
	margin-left: 0px !important;
	}
}
.btn_bay {
	border-radius: 60px;
	width: 280px;
	padding: 10px 0px;
	border-color: transparent;
	background: linear-gradient(95.62deg, #89D4FF 0%, #2687BE 100%);
	color: #fff;
	background-color: transparent;

}
.btn_bay:hover {
    color: #fff !important;
	
}
.btn {
	border: none !important;
}
.div_trikot {
	height: 280px;
	background-color: #fff;
	clip-path: polygon(76% 10%, 85% 0, 100% 0, 100% 100%, 21% 100%, 0 100%, 0 100%, 0 10%);
}
.bg_uplod {
	clip-path: polygon(13% 0, 25% 5%, 100% 5%, 100% 100%, 25% 100%, 0 100%, 0 0);
	margin-top: -75px !important;
	overflow: hidden !important;
}
.bg_footer {
	background: linear-gradient(266.33deg, #5DB3E4 8.15%, #179BE6 106.25%);
}
.footer {
	clip-path: polygon(0 0, 78% 0, 84% 8%, 100% 8%, 100% 100%, 0 100%);
	
}
@media (max-width: 580px) {
	.footer {
	clip-path: polygon(0 0, 78% 0, 84% 2%, 100% 2%, 100% 100%, 0 100%) !important;
	}
}

.animated-icon1, .animated-icon2, .animated-icon3 {
width: 30px;
height: 20px;
position: relative;
margin: 0px;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
cursor: pointer;
}

.animated-icon1 span, .animated-icon2 span, .animated-icon3 span {
display: block;
position: absolute;
height: 3px;
width: 100%;
border-radius: 9px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
-o-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}

.animated-icon1 span {
background: #e65100;
}

.animated-icon2 span {
background: #e3f2fd;
}

.animated-icon3 span {
background: #f3e5f5;
}


/* Icon 3*/

.animated-icon2 span:nth-child(1) {
top: 0px;
}

.animated-icon2 span:nth-child(2), .animated-icon2 span:nth-child(3) {
top: 10px;
}

.animated-icon2 span:nth-child(4) {
top: 20px;
}

.animated-icon2.open span:nth-child(1) {
top: 11px;
width: 0%;
left: 50%;
}

.animated-icon2.open span:nth-child(2) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}

.animated-icon2.open span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}

.animated-icon2.open span:nth-child(4) {
top: 11px;
width: 0%;
left: 50%;
}

.navbar-toggler {
	border: none!important;
	margin-top: 30px;
	margin-right: 20px;
}
.navbar-collapse {
	align-items: center !important;
	width: 100%;
	
}
.form-control {
			border-radius: 60px;
			padding: 10px 0px;
			color: #000 !important;
			outline: none;
			text-align: center;
			border: 1px solid #89D4FF;
			margin-bottom: 20px;
			
}
.form-select {
			border-radius: 60px;
			padding: 10px 0px;
			color: #000 !important;
			outline: none;
			text-align: center !important;
			border: 1px solid #89D4FF;
			margin-bottom: 10px;
			
}
		.form-control-lg::file-selector-button {
			background: linear-gradient(266.33deg, #5DB3E4 1.42%, #179BE6 99.51%);
			color: #fff;
			border-radius: 40px!important;
			padding: 10px 40px !important;
			font-size: 12px !important;
			border: none !important;

		}
		.form-control-lg::-webkit-file-upload-button {
			background: linear-gradient(266.33deg, #5DB3E4 1.42%, #179BE6 99.51%);
			color: #fff;
			border-radius: 40px!important;
			padding: 7px 30px 5px 30px !important;
			text-transform: uppercase!important;
			border-color: #000!important;
			font-size: 16px !important;
			border: none !important;
			}
		
		@media (max-width: 580px) {
			.form-control-lg::-webkit-file-upload-button {
				font-size: 12px !important;
			}
		}
		.form-control-lg[type=file] {
 			 overflow: hidden;
  			 font-size: 14px!important;
			}
		::placeholder {
 			 color: #000 !important;
  			 opacity: 1; /* Firefox */
		}
		.help-block {
			margin-top: -37px !important;
			margin-right: 20px;
			
		}
		.offcanvas-bottom {
			height: 86vh !important;
		}

.progress {
            display: -ms-flexbox;
            display: flex;
            height: 2.5rem;
            overflow: hidden;
            line-height: 0;
            font-size: 0.75rem;
			color: #fff;
            background: linear-gradient(101.18deg, rgba(236, 252, 255, 0.56) 5.56%, rgba(156, 219, 255, 0.36) 106.86%);
            border-radius: 0rem;
            border: 1px solid #fff;
            transform: skew(20deg);
        }

 .progress .progress-bar {
            transition: unset;
        }

 .progress-bar {
            width: 0;

        }

.progress-bar {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: column;
            flex-direction: column;
            -ms-flex-pack: center;
            justify-content: center;
            overflow: hidden;
            text-align: center;
            white-space: nowrap;
            background: linear-gradient(101.18deg, #89D4FF 5.56%, #179BE6 106.86%);
            transition: width 0.6s ease;
        }

        .bar_text {
            background: linear-gradient(260.15deg, #384247 2.5%, #1D3644 30.98%, #1E2A32 84.38%, #293C49 146.47%);
            height: 2.5rem;
            width: 500px;
            margin-top: -12px;
			border: 1px solid #fff;
            overflow: hidden;
            font-size: 14px;
            display: -ms-flexbox;
            display: flex;
            justify-content: center;
            color: #0D59A0;
            text-align: center;
            transform: skew(20deg);
        }

        @media (max-width:480px) {
            .bar_text {
                width: 200px;
				font-size: 12px;
            }
			h1 {
			font-size: 18px;
			}
        }

        .bar_text p {
            transform: skew(-20deg) !important;
            font-weight: 700;
            color: #ffffff;
            margin: auto 0 !important;
        }
		
        @media (max-width:480px) {
			h1 {
			font-size: 18px;
			}
        }

		.div_bar {
            z-index: 10 !important;
           
        }
		.div_bar2 {
            background-color: transparent;
        }