.skoSwal
{
  width:500px;
}
.btn-skolarli { 
  color: #ffffff; 
  background-color: #276D77; 
  border-color: #006D77; 
} 

.btn-skolarli:hover, 
.btn-skolarli:focus, 
.btn-skolarli:active, 
.btn-skolarli.active, 
.open .dropdown-toggle.btn-skolarli { 
  color: #ffffff; 
  background-color: #005b63; 
  border-color: #006D77; 
} 
 
.btn-skolarli:active, 
.btn-skolarli.active, 
.open .dropdown-toggle.btn-skolarli { 
  background-image: none; 
} 
 
.btn-skolarli.disabled, 
.btn-skolarli[disabled], 
fieldset[disabled] .btn-skolarli, 
.btn-skolarli.disabled:hover, 
.btn-skolarli[disabled]:hover, 
fieldset[disabled] .btn-skolarli:hover, 
.btn-skolarli.disabled:focus, 
.btn-skolarli[disabled]:focus, 
fieldset[disabled] .btn-skolarli:focus, 
.btn-skolarli.disabled:active, 
.btn-skolarli[disabled]:active, 
fieldset[disabled] .btn-skolarli:active, 
.btn-skolarli.disabled.active, 
.btn-skolarli[disabled].active, 
fieldset[disabled] .btn-skolarli.active { 
  background-color: #276D77; 
  border-color: #006D77; 
} 
 
.btn-skolarli .badge { 
  color: #276D77; 
  background-color: #ffffff; 
}
.btn.btn-light-skolarli{
  color: #276D77;
  background-color:#bee1e6;
}

.btn.btn-light-skolarli i{
  color: #276D77;
}

.btn.btn-light-skolarli:hover i{
  color:#bee1e6;
}

.btn.btn-light-skolarli svg{
  color: #276D77;
}

.btn.btn-light-skolarli:hover svg{
  color:#bee1e6;
}

.btn-light-skolarli:hover, 
.btn-light-skolarli:focus, 
.btn-light-skolarli:active, 
.btn-light-skolarli.active, 
.open .dropdown-toggle.btn-light-skolarli { 
  color: #ffffff; 
  background-color: #276D77; 
  border-color: #006D77; 
} 

.btn.btn-light-skolarli.disabled, 
.btn.btn-light-skolarli[disabled], 
fieldset[disabled] .btn.btn-light-skolarli, 
.btn.btn-light-skolarli.disabled:hover, 
.btn.btn-light-skolarli[disabled]:hover, 
fieldset[disabled] .btn.btn-light-skolarli:hover, 
.btn.btn-light-skolarli.disabled:focus, 
.btn.btn-light-skolarli[disabled]:focus, 
fieldset[disabled] .btn.btn-light-skolarli:focus, 
.btn.btn-light-skolarli.disabled:active, 
.btn.btn-light-skolarli[disabled]:active, 
fieldset[disabled] .btn.btn-skolarli:active, 
.btn.btn-light-skolarli.disabled.active, 
.btn.btn-light-skolarli[disabled].active, 
fieldset[disabled] .btn.btn-light-skolarli.active { 
  background-color: #276D77; 
  border-color: #006D77; 
} 

.text-skolarli{
  color: #276D77; 
}

.skolarli-drag:hover{cursor:move;}
.image-input-wrapper-skolarli {width:820px; height:auto;}


.progress {height: 32px;}

/*Progress bar for Video upload*/
#progress-bar-container {
  display: flex;
  margin-top: 20px;
  width: 100%;
  height: 30px;
  border: 1px solid #1dc9b7;
  display: none;
  border-radius: 3px;
}

#progress-bar-fill {
  height: 100%;
  width: 0%;
  transition: 1s ease-in-out all;
  background-color: #1dc9b7;
  background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
background-size: 1rem 1rem;
}

#upload {
  width: 100%;
}


.progress-bar-container {
  display: flex;
  margin-top: 20px;
  width: 100%;
  height: 30px;
  border: 1px solid #1dc9b7;
  display: none;
  border-radius: 3px;
}

.progress-bar-fill {
  height: 100%;
  width: 0%;
  transition: 1s ease-in-out all;
  background-color: #1dc9b7;
  background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
background-size: 1rem 1rem;
}

.bg-light-skolarli{background:#d9f3f7;}