html, body{
	height:100%;
	background: #ffba5457;
}

label{
	font-weight:500;
}

button{
	width: 100%;
    background: #ff9600!important;
    border: 1px currentColor!important;
    font-weight: 600!important;
}

button:hover{
	background: #474747!important;
}

.height100{
	height:100%;
}

.container{
	background:blanchedalmond;
	width: 500px;
 	box-shadow: 0px 0px 28px 0px #00000082;
}



small {
	font-weight: 700;
	color:red!important;
}

.downlaods-text{
    font-weight: 500;
    text-align: center;
}

.btn-secondary{
	width: fit-content;
    margin: 0px auto;
	font-weight: 700;
	border:none;
}

.btn-secondary:hover{
	background:#ff9600;
}

.downlaods-h1 {
    color: #ff9600;
    font-weight: 700;
    text-align: center;
    font-size: 27px;
}

.uploads-h1{
	font-size: 27px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 30px;
}

.hidden{
	display:none;
}

.visible{
	display:contents;
}

progress {
    position: absolute;
    height: 30px;
    width: 405px;
    border: 1px solid #a4a4a4;
	box-shadow: 0px 0px 10px 0px #0000006b;
}

progress::before {
    content: "Yükleme... " attr(value) "%";
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 18px;
	font-weight:500;
    color: white;
}

progress::-webkit-progress-bar {
    background-color: #474747;
}

progress::-webkit-progress-value {
    background-color: #ff9600!important;
	box-shadow: 0px 0px 10px 0px #ff9600;
}      

.loading {
    font-weight: 700;
    color: #e62424;
}

.disabled{
  pointer-events: none;
  background:#474747!important;
}

.tooltip1 {
  display: inline;
  position: relative;
}
.tooltip1:hover:after{
  position:absolute;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  background: #444;
  border-radius: 8px;
  color: #fff;
  content: attr(title);
  margin-left: -305px;
  margin-top: -30px;
  font-size: 16px;
  padding: 13px;
  width: 300px;
  text-align:center;
}

.fa-circle-info:hover{
	color:#444;
}

.blink-soft{
	animation: blinker 1.5s linear infinite;
  }
  @keyframes blinker {
	50% {
	  opacity: 0;
	}
  }

.fa-circle-info:hover{
	color:#444;;
}

.gradient-background {
  background: linear-gradient(222deg,#9400d3,#e61b3f,#d3b500);
  background-size: 360% 360%;
  animation: gradient-animation 5s ease infinite;
  box-shadow:0px 0px 4px 0px #00000082;
  transition:1s;
}

.gradient-background:hover {
  background: linear-gradient(222deg,#4b4b4b,#000000);
  background-size: 360% 360%;
  animation: gradient-animation 1s ease infinite;
  transition:1s;

}

@keyframes gradient-animation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}