/*
Gradient 2:
background: rgb(31,167,246);
background: linear-gradient(135deg, rgba(31,167,246,1) 11%, rgba(115,214,255,1) 49%, rgba(38,173,228,1) 86%, rgba(107,210,251,1) 100%);
Gradient 2:
background: rgb(92,188,255);
background: linear-gradient(83deg, rgba(92,188,255,1) 0%, rgba(0,154,255,1) 34%, rgba(102,197,247,1) 68%, rgba(50,173,226,1) 100%);
*/
html { scroll-behavior: smooth; }
  body {
    font: 400 15px Roboto, sans-serif;
    line-height: 1.8;
    color: black;
    background-color:  #26ADE4;
  }

p {
    padding: 0px;
    margin: 3px;
}
.container-fluid {
padding: 60px 50px;
}

.jumbotron {
  background-color: #26ADE4; /* Orange */
  color: #ffffff;


}


/*
.jumbotron p{
  color: #D1E751;
} */

.navbar {
  margin-bottom: 0;
  letter-spacing: 2px;
  font-size: 12px;
  /* box-shadow: 5px 10px 15px rgba(0,0,0, .2); */
}

/* animacja navbar */
.navbar .nav-item a{
    transition: 0.3s;

}

.navbar .nav-item a:hover{
    transform: scale(1.1);

}

.navbar .dropdown a{
    transition: 0.3s;

}

.navbar .dropdown a:hover{

    border-radius: 20px;

}


#navbar1 {
  background-color:  #4DBCE9;
}
.navbar2 {
  background-color: #26ADE4;
  letter-spacing: 2px;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  width: 100%;
  /* position: absolute; */

}

.navbar3 {
  background-color: #26ADE4;

  letter-spacing: 2px;
  /*border-top: 1px solid rgba(255, 255, 255, 0.5);
  border-bottom: 2px solid #ffffff66; */
  width: 100%;
  /* position: absolute; */

}


.navbar-brand {
  letter-spacing: 3px;
  /*color: #D1E751 !important; */
  color: white !important;
}


.navbar-light .navbar-nav .nav-link{
  color: #FFFFFF !important;
}

.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link{
  color: #D1E751 !important;

}

.btn-primary {
  background-color: white;
  border-color: #26ADE4;
  color: #282a2b;
}
.btn-primary:hover {
  background-color: black;
  border-color: black;
}
.btn-primary:hover:active:focus, .btn-primary:focus, .btn-primary:hover:active:focus  {
  background-color: black;
  border-color: black;
  box-shadow: 0px 0px 0px 0px rgba(255,255,255,1) !important;
}



.pod-loginem {
  margin-bottom: 0;
  margin-right: 15px;
  letter-spacing: 0px;
  font-size: 12px;
  color: #ffffff;
  text-decoration: none;
}
.pod-loginem:hover{
    text-decoration: none;
    color: black;
}

/* LOGIN FORM */
.form-inline .form-control, .form .form-control {
    background-color: #26ADE4;
    border: 3px solid #ffffff66;
    color: white;
}
.form-inline .form-control:focus {
    background-color: #26ADE4;
    box-shadow: 0px 0px 5px 1px rgba(255,255,255,1);
}


.form-inline .form-control::placeholder {
    color: #e9ecef;
}

/* Profile FORM */
.profile-form-input {
    background-color: #26ADE4;
    border: 3px solid #ffffff66;
    color: white;
    display: inline-block;
    border-radius: 4px;
    font-size: 18px;
}

#id_profile_photo:before{
    border: 3px solid #ffffff66 !important;
    text-transform: capitalize;
    padding: 3px !important;
    background-color: #26ADE4;
    font-size: 18px !important;
    text-align: center !important;


    }

/* --------------------CHECKBOX FORM---------------------- */
.checkbox-input {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.checkbox-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: relative;
  display: inline-block;
  top: 8px;
  height: 27px;
  width: 27px;
  background-color: #4dbce9;
  border: 3px solid #ffffff66;
  border-radius: 4px;
}

/* On mouse-over, add a grey background color */
.checkbox-container:hover input ~ .checkmark {
  background-color: #ffffff30;
}

/* When the checkbox is checked, add a blue background */
.checkbox-container input:checked ~ .checkmark {
  background-color: #4dbce9;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.checkbox-container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkbox-container .checkmark:after {
  left: 5px;
  bottom: 4px;
  width: 14px;
  height: 27px;
  border: solid white;
  border-width: 0 6px 6px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
/* --------------------CHECKBOX FORM END ---------------------- */
#ElemenToMove{
  /*margin-bottom: 10px; */
  transition: padding 0.4s linear;
}


.padding1{
  padding-top: 75px !important;
}

.padding2{
  padding-top: 45px !important;
}

img{
 margint-top: 0px;
}

/* REGISTER FORM */
#register_form .form-control, .blue-input .form-control{
    background-color: #26ADE4;
    border: 3px solid #ffffff66;
    color: white;
}

#register_form .form-control:focus, .blue-input .form-control:focus {
    background-color: #26ADE4;
    box-shadow: 0px 0px 5px 1px rgba(255,255,255,1);
}

#register_form  .form-control::placeholder, .blue-input .form-control::placeholder {
    color: #e9ecef;
}


#search_user  .form-control::placeholder, .blue-input .form-control::placeholder {
    color: #e9ecef;
}

/* button z internetu */
.button {
  display: inline-block;
  height: 40px;
  width: 125px;
  border: 2px solid #D1E751;
  border-radius: 5px;
  background-color: #4DBCE9;
  color: white;
  text-transform: uppercase;
  text-decoration: none;
  font-size: .8em;
  letter-spacing: 1.5px;
  align-items: center;
  justify-content: center;
  overflow: hidden;


  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.button:hover{
    box-shadow: 0px 0px 5px 1px rgba(255,255,255,1);

}




.button span {
  position: relative;
  transition: all .35s ease-Out;
  color: white;
}

.button.focus, .button:focus {
    outline: 0;

}

.slide2 {
  width: 100%;
  height: 100%;
  left: -200px;
  background: #D1E751;
  position: absolute;
  transition: all .35s ease-out; /* cubic-bezier(.17,.78,.44,.09); */
  bottom: 0;
}



.button:hover .slide2 {
  left: 0;
}


.button:hover a {
  color: black;
  text-decoration: none;

}

/* SLIDE w home page */
.home_slide_anim {visibility:hidden;}
.home_slide {
  /* The name of the animation */
  animation-name: slide;
  -webkit-animation-name: slide;
  /* The duration of the animation */
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  /* Make the element visible */
  visibility: visible;
}

@keyframes slide {
  0% {
    opacity: 0;
    transform: translateY(70%);
  }
  100% {
    opacity: 1;
    transform: translateY(0%);
  }
}
@-webkit-keyframes slide {
  0% {
    opacity: 0;
    -webkit-transform: translateY(70%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0%);
  }
}


/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 1px solid white;
  -webkit-text-fill-color: white;
  -webkit-box-shadow: 0 0 0px 1000px #4dbce9 inset;
  transition: white 5000s ease-in-out 0s;

}

#id_nazwa:-webkit-autofill:focus
#id_nazwa:-webkit-autofill,
#id_nazwa:-webkit-autofill:hover,
#id_nazwa:-webkit-autofill:focus,
#id_nazwa:-webkit-autofill,
#id_nazwa:-webkit-autofill:hover,
#id_nazwa:-webkit-autofill:focus,
#id_nazwa:-webkit-autofill,
#id_nazwa:-webkit-autofill:hover,
#id_nazwa:-webkit-autofill:focus{
  border: 1px solid grey;
  -webkit-text-fill-color: black;
  -webkit-box-shadow: 0 0 0px 1000px white inset;
  transition: white 5000s ease-in-out 0s;

}

input:-webkit-autofill {
        color: red !important;
    }


/* PLAN DYZUROW */

.dzien-col {
        padding-top: 10px;
    }


/* MEGE MENU */
.menu-large {
  position: static !important;

}

.megamenu {
  /*padding: 20px 20px; */
  width: 100%;
  background-color: #26ADE4;


  border-bottom: 1px solid #ffffff8a;
  border-radius: 0px;
  margin: 0px;


}

.megamenu > div > li > ul {
  padding: 0;
  margin: 0;
}

.navbar3 a {
  color: white;
}

.megamenu > div > li > ul > li {
  list-style: none;
}

.megamenu > div > li > ul > li > a {
  display: block;
  clear: both;
  font-weight: normal;
  line-height: 1.428571429;
  color: white;
  white-space: normal;
  font-size: 12px;
}

.megamenu > div > li > ul > li > a:hover,
.megamenu > div > li > ul > li > a:focus {
  text-decoration: none;
  color: white;
  background-color: #26ADE4;
}

.megamenu.disabled > a,
.megamenu.disabled > a:hover,
.megamenu.disabled > a:focus {
  color: white;
}


.megamenu-dropdown-item:hover {
    background-color: #4dbce900;
    font-size: 12px;


}

.megamenu.dropdown-menu {
    background-color:#26ADE4;
    font-size: 12px;
    border: 0px solid #4DBCE9;
    border-bottom: 1px solid #4DBCE9;
    /*margin-top: 35px; to jak fale umieszczam trzeba dac */

}
.megamenu-dropdown-item {

    font-size: 12px;
    padding: 5 0 0 0;


}

.megamenu-dropdown-item a:hover {
    margin: 0px;

    text-decoration: underline;
}

.megamenu.disabled > a:hover,
.megamenu.disabled > a:focus {
  text-decoration: none;
  background-color: red;
  background-image: none;
  filter: progid: DXImageTransform.Microsoft.gradient(enabled=false);
  cursor: not-allowed;
}

.megamenu-dropdown-header {
  color: #D1E751;
  font-size: 18px;
}


@media (max-width: 768px) {
  .megamenu {
    margin-left: 0;
    margin-right: 0;

  }
  .megamenu > li {
    margin-bottom: 30px;
  }
  .megamenu > li:last-child {
    margin-bottom: 0;
  }
  .megamenu.dropdown-header {
    padding: 3px 15px !important;
  }
  .navbar-nav .open  .dropdown-header {
    color: yellow;
  }
}



/* hamburger */
.custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='white' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler.navbar-toggler {
  border-color: white;
}


/* Wybor oddzialu */
#wyborOddzialu {
	color: white;
	background-color: #26ADE4;
	border: 3px solid #ffffff66;
    position: relative;
    z-index: 10;


}

@media (max-width: 400px) {
  #wyborOddzialu {font-size:14px;}
}

@media (max-width: 360px) {
  #wyborOddzialu {margin-top: 5px;}
}
#wyborOdddzialuDropdown .dropdown-item{
    color: black;
}


slide-zindex1{
    z-index: 100;
}

slide-zindex2{
    z-index: 200;
}

slide-transparent{
    opacity: 0;
}

#admin1{
    z-index: 1;
}

#zastrzezenia1{
    z-index: 1;
}

#oddzialy{
    z-index: 1;
}

.blueBorder{
background-color: white;
border: 1px solid #26ADE4;
color: black;
}


.blueBorder:hover:active:focus, .blueBorder:focus, .blueBorder:active,  .blueBorder:hover:active:focus {
    background-color: #26ADE4 !important;;
    border: 1px solid white !important;;
    color: white !important;
    box-shadow: 0 0 0 0.1rem #26ade43d !important;;

}

.show>.btn-secondary.dropdown-toggle.blueBorder{
background-color:  #26ADE4;
color: white;
border: 1px solid white;
}


.show>.btn-secondary.dropdown-toggle.blueBorder:focus{
    box-shadow: 0 0 0 0.2rem #26ade43d
}

.blueBackground{
    background-color:  #26ADE4;
    color: white;
    border: 1px solid white;
}
.blueBackground:hover{
    background-color:  white;
    color: #26ADE4;
    border: 1px solid #26ADE4;
}

.blueBackground:hover:active:focus, .blueBackground:focus, .blueBackground:active,  .blueBackground:hover:active:focus {
    background-color:  white;
    color: #26ADE4;
    border: 1px solid #26ADE4;

}
.lightblueBackground{
    background-color:  #4DBCE9;
    color: white;
}
.show>.btn-secondary.dropdown-toggle.blueBackground{
    background-color:  white;
    color: #26ADE4;
    border: 1px solid #26ADE4;
}

.blueBackground-container{
    background-color:  #26ADE4;
    color: white;
}

.blueBackground-button{
    background-color:  #26ADE4;
    color: #ffffffd9 !important;
    text-decoration:none;
}

.blueBackground-button:hover{
    background-color:  #66c5ec;
    color: white;
    border-color: #ffffff94;
}
.lightblueBackground-button{
    background-color:  #f1f3f5;
    color: #343a40c2 !important;
    text-decoration:none;
    border: 3px solid #26ADE4;

}
.lightblueBackground-button:hover{
    background-color: #26ADE4;
    color: white !important;
    border-color: #ffffff94;
}
.redBackground-button{
    background-color:  #f44336cf;
    color: #ffffffd9 !important;
    text-decoration:none;
}

.redBackground-button:hover{
    background-color:  #ff6559cf;
    color: white;
    border-color: #ffffff94;
}

.yellowBackground-button{
    background-color:  #d1e751;
    color: #343a40;
    text-decoration:none;
}

.yellowBackground-button:hover{
    background-color: #dff562;
    color: #343a40;
    border-color: #ffffff94;
}


.greenBackground-button{
    background-color:  #65e061;
    color: #343a40;
    text-decoration:none;
}

.greenBackground-button:hover{
    background-color: #77e873;
    color: #343a40;
    border-color: #ffffff94;
}

.blueBackground-row{
    border: 0px solid white;
    border-radius: 25px;
    color: white;
}

.blueBackground-cards{
    background-color:  #26ADE4;
    color: white;
    border: 1px solid white;
}
.blueBackground-cards a{
    color: #D1E751;
}




.whiteBackground-cards{
    background-color:  #ffffff;
    color: black !important;
    border: 1px solid white;
}

.yellowBackground{
 background-color: #D1E751;
}
.show>.btn-secondary.dropdown-toggle.blueBackground:focus{
    box-shadow: 0 0 0 0.2rem #26ade43d
}


.blueBackground .text-muted{
    background-color:  #26ADE4;
    color: #dee2e6 !important;
    font-size: 0.85rem;
}

.greyBackground{
    background-color:  #f8f9fa;
}

.card{
  box-shadow: 5px 0px 10px rgba(0,0,0, .2);

}

.card:hover{
  box-shadow: 5px 0px 40px rgba(0,0,0, .2);

}

.section-header{
background-color: #26ADE4;
border-radius: 10px;
color: white;
margin-bottom: 10px;

box-shadow: 5px 10px 15px rgba(0,0,0, .2);

}

/* CARDS */
.card-header{
    /*background-color: #D1E751; żółty kolor*/
    color: #282a2b;
    border-top: 1px solid #00000054;
    border-left: 1px solid #00000054;
    border-right: 1px solid #00000054;

}
.card{
    background-color: white;
}
.card-body{
    color: #282a2b;
    border-bottom: 1px solid #00000054;
    border-left: 1px solid #00000054;
    border-right: 1px solid #00000054;
}

.red_circle{
  height: 25px;
  width: 25px;
  background-color: #ee413e;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
}


.svg-navbar{
    background-color:  #26ADE4;
}

.shadow-inset {
   -moz-box-shadow:    inset 0px 0px 3px 2px  rgba(0,0,0,.075)!important;
   -webkit-box-shadow: inset 0px 0px 3px 2px rgba(0,0,0,.075)!important;
   box-shadow:         inset 0px 0px 3px 2px rgba(0,0,0,.075)!important;
}
.shadow-inset2 {
   -moz-box-shadow:    inset 0px 0px 3px 2px rgba(0,0,0,.055)!important
   -webkit-box-shadow: inset 0px 0px 3px 2px rgba(0,0,0,.055)!important
   box-shadow:         inset 0px 0px 3px 2px rgba(0,0,0,.055)!important
}

.dodajnews{
    border: 1px solid white;
    border-radius: 10px;
    background-color: #26ADE4;
    color: white;
    transition: 0.3s;
}

.dodajnews a{
    color: white;

}


.dodajnews:hover a{
    color: #26ADE4;
}
.dodajnews:hover {
    color: #26ADE4;
    background-color: white;
}



.link_button_blue{
    border: 1px solid white;
    border-radius: 10px;
    background-color: #26ADE4;
    color: white;
    transition: 0.3s;
}

.link_button_blue a{
    color: white;

}


.link_button_blue:hover a{
    color: #26ADE4;
}
.link_button_blue:hover {
    color: #26ADE4;
    background-color: white;
}



.circle-comments{
    border: 0.5px solid #c9c4c4;
    border-radius: 100%;
    width: 55px;
    height: 55px;
    background-size: cover;
    margin: auto;
    }

.circle-small{
    border: 1px solid black;
    border-radius: 100%;
    background-size: cover;
    background-position: center;
    width: 100px;
    height: 100px;
    position:relative;
    }

.circle-big{

    border-radius: 100%;
    background-size: cover;
    background-position: center;
    margin: auto;
    padding: 50%;
    }

.circle-no-image{
    font-size: 300%;
    line-height: 1px;
    background: linear-gradient(12deg, rgba(31,167,246,1) 11%, rgba(115,214,255,1) 49%, rgba(38,173,228,1) 86%, rgba(107,210,251,1) 100%);
    color: white;
    border: 1px solid #dddddd;
    text-shadow: 0 0 2px black;

}
.circle-no-image .d-flex{

    position: relative; /* has to be position relative for left to work, or you could just do margin-left: -50px; too */
    left: -32px;
}


.hover-shadow:hover{
  box-shadow: 5px 0px 20px rgba(0,0,0, .2) !important;


}
.white-shadow:hover{
    -webkit-box-shadow: 0px 0px 6px 2px rgba(255,255,255,1) !important;
    -moz-box-shadow: 0px 0px 6px 2px rgba(255,255,255,1) !important;
    box-shadow: 0px 0px 6px 2px rgba(255,255,255,1) !important;
}


.blueBackground-empty{
    background-color:  #26ADE4;
    color:black;
    margin: 0px;
}

.shadow-top{

box-shadow: 0 -.125rem .25rem rgba(0,0,0,.075)!important;
}

.scrollable-dropdown{
    height: auto;
    max-height: 200px;
    overflow-x: hidden;
}
.scrollable-dropdown a{
    background-color: #ffffff;
}

.sup {
  font-size: 50%;
  color:red;
}

.oddzial-card{
margin-bottom: 20px;

}

.oddzial-card .card-header{
border: 0px solid white;
}


.oddzial-card .card-body{
border: 0px solid white;

}

.bg-darker-light{
background-color: #f1f3f5;

}

/* TABELA */

.td-siatka{
    width: 32px;
    text-align: center !important;
    border: 1px solid #0000001c;

}
.td-siatka-dzien-tygodnia{
    width: 32px;
    text-align: center !important;
    border-left: 2px solid #ffffff66;
    font-weight: bolder;

}

.zastrzezone{
    background-color: #e63d4d;
}

.tr-siatka{
    padding: 0px;
}


.tr-siatka:hover{
  -webkit-box-shadow: inset 0px 5px 10px 0px #00000024;
     -moz-box-shadow: inset 0px 0px 10px 5px #00000024;
          box-shadow: inset 0px 0px 10px 5px #00000024;


}

.vertical{
          writing-mode: vertical-rl;
          text-orientation: mixed;
          vertical-align: top;
}

.table-hover-shadow:hover{
  -webkit-box-shadow: inset 0px 1px 3px 0px #333333a8;
     -moz-box-shadow: inset 0px 1px 3px 0px #333333a8;
          box-shadow: inset 0px 1px 3px 0px #333333a8;


}


.plus-button-wolny{
 color: white;
 padding: 2px 7px 0px 7px;
 font-weight: bolder;
 border: 2px solid #ffffff66 !important;
}

.plus-button{
 color: #575757;
 padding: 2px 7px 0px 7px;
 font-weight: bolder;
 border: 2px solid #575757 !important;
}

.plus-button:hover{
 color: #65e061;
}
/* PLAN EDYCJA SIATKA */

.plus-button-edycja{
 color: #57575736;
 padding: 2px 7px 0px 7px;
 font-weight: bolder;
 border: 2px solid #57575736 !important;
}

.plus-button-edycja:hover{
 color: #65e061;
}


 .parent {
     width: 1vw;
     height: 1vh;
     justify-content: center;
     align-items: center;
     padding: 0;
     margin: 0;

 }

 .child-div {

     background-color: #f44336cf;
     padding: 0;
     margin: 0;
 }
.child-div-weekend{

     background-color: #ffa8b0 !important;
     padding: 0;
     margin: 0;
 }
.changed-div {

     background-color: #88C425;
     padding: 0;
     margin: 0;
 }

.red-background{
    background-color: #e63d4d;
 }

.sticky-div{
  position: -webkit-sticky;
  position: sticky;
  z-index: 10;
  font-size:18px;
  background-color:white;
}



.fixed-uwagi{
  top: 20%;
  left: 35%;
  position: fixed;
  z-index: 10;
  font-size:18px;
  display: none;
}

.display-none{
    display:none;
}

.text-yellowgreen{
   color: #D1E751 !important;
}

.bg-yellowgreen{
   background-color: #D1E751 !important;
}

.bg-green{
   background-color: #65e061 !important;
}

.bg-red{
   background-color: #f44336cf !important;
}

/* TABELA SIATKA PLAN */
/*
to chyba nie potrzebne
.table-siatka td{
 padding: 0px;
 position: relative;
} */

.table-siatka {
 min-width: 1140px;
 max-width: 1150px;
}
.table-siatka-container{
    overflow: hidden;
}

.table-siatka .sup {
 margin-top: 15px;
 padding: 0px;
 position: absolute;

}

.symbol-td{
 margin-top: -7px;
 position: absolute;
 font-weight: bolder;

}

.table-siatka div{
 padding: 0px;
 margin: 0px;
}

.table-siatka button{
 margin: 0.1rem !important;

 border: 1px solid red;
}

#cookies{
   z-index: 10000;
}

@media only screen and (min-width: 850px) {
    #calendarDay{
        position: absolute;
        margin-top: 20px;
        margin-right: 25px;
        font-size: 11px;
        width: 165px;
        right: 0px;
    }

}

@media only screen and (max-width: 850px) {
    #calendarDay{
        position: block;
        margin: 0 auto 0 auto;

        font-size: 11px;
        width: 165px;
        background-color: red;
    }
}

#calendarDay .blueBackground-container{
    background-color: #4DBCE9;

}

.comment-small{
    font-size: 10px;
}

.emotList{
    z-index: 1030;
    top: -165px;
    right: 25px;
}
#textAreaComment{
    height: 100px;
}
form div li{
     list-style-type: none;
}

#RodoModal .modal-body, #RegulaminModal .modal-body, .overflow-hidden-modal{
      height: 400px;
}


#id_profile_photo::-webkit-file-upload-button {
  visibility: hidden;
}
#id_profile_photo::before {
  content: 'wybierz plik';
  display: inline-block;
  background: linear-gradient(top, white, white);
  border: 1px solid white;
  border-radius: 3px;
  padding: 5px 8px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  font-size: 12px;
}


.warning-przerwa{
  background-color: #ffda6bed !important;
  color: #e63d4d;
  border-radius: 5px;
}

.warning-miesiac{
  background-color: #ffda6bed !important;
  color: #e63d4d;
  border-radius: 5px;
}

.kwadrat-legenda{

    width: 15px;
    height: 20px;
    border-radius: 2px;
    display: inline-block;


}

.na-kwadrat{
    display: inline-block;

}
.opis-legendy{
    position: relative;
    display: inline-block;
    font-size: 14px;
    bottom: 5px;
}

/* MANUAK */

.manual-menu{
    width: 300px !important;
    top: 100px;
    z-index: 0;
}

.dropdown-menu-custom{
      display: none;
      position: absolute;
      background-color: #f9f9f9;
      z-index: 1;
      box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
      max-height: 150px;
      overflow: auto;

}
.dropdown-menu-custom-containter:hover .dropdown-menu-custom {
  display: block;
}

.dropdown-menu-custom a:hover {background-color: #f1f1f1}

.cover-loading {
    position: absolute;
    width: 99%;
    height: 97.5%;
    padding: 0px;
    bottom: 4px;
    left: 19px;
    z-index: 1;
    background-color: rgba(255,255,255, 0.65)

 }

 .cover-loading-table {
    position: absolute;
    width: 100%;
    height: 100%;
    margin:0px;
    padding: 0px;
    bottom: 0px;
    left: 0px;
    z-index: 1;
    background-color: rgba(255,255,255, 0.65)

 }

 .bg-custom-danger{
    background-color: #f8d7da;
    color: #721c24;
 }

.bg-custom-succes{
    background-color: #d4edda;
    color: #155724;
 }

#to_close_info{
    z-index: 1000;
}
#LoginForm{
    z-index: 1;
}
#contact{
    background-color: #26ADE4 !important;
}

#contact a{
    color: black !important;
}

.button-press-blue {
  display: block;
  font-size: 24px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0 3px #338fb4;


}
.button-press-blue:hover {
    box-shadow: 0 5px #338fb4;
    transform: translateY(3px);
    -webkit-box-shadow:  0px 3px 0px 0px #338fb4;
        -moz-box-shadow:  0px 3px 0px 0px #338fb4;
            box-shadow:  0px 3px 0px 0px #338fb4;

    }

.button-press-blue:active {
    box-shadow: 0 3px #338fb4;
    transform: translateY(3px);
    -webkit-box-shadow: inset 0px 1px 2px 2px #338fb4;
        -moz-box-shadow: inset 0px 1px 2px 2px #338fb4;
            box-shadow: inset 0px 1px 2px 2px #338fb4;
    outline: none;
}


.button-press-yellow {
  background-color:#d1e751;
  display: inline-block;
  font-size: 24px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0 6px #a8b55b;

}
.button-press-yellow:hover {
    box-shadow: 0 5px #d1e751;
    transform: translateY(3px);
    -webkit-box-shadow:  0px 3px 0px 0px #a8b55b;
        -moz-box-shadow:  0px 3px 0px 0px #a8b55b;
            box-shadow:  0px 3px 0px 0px #a8b55b;

    }

.button-press-yellow:active {
    box-shadow: 0 3px #338fb4;
    transform: translateY(3px);
    -webkit-box-shadow: inset 0px 1px 2px 2px #a8b55b;
        -moz-box-shadow: inset 0px 1px 2px 2px #a8b55b;
            box-shadow: inset 0px 1px 2px 2px #a8b55b;
    outline: none;
}


.button-press-yellow-inactive {
  background-color:#d1e751a6;
  display: inline-block;
  font-size: 24px;
  cursor: pointer;
  color: #4e6151;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0 4px #a8b55ba8;
  ointer-events: none;
  cursor: default;
}



.button-press-green {
  background-color:#65e061;
  display: inline-block;
  font-size: 24px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0 6px #499e46;

}
.button-press-green:hover {
    box-shadow: 0 6px #d1e751;
    transform: translateY(3px);
    -webkit-box-shadow:  0px 3px 0px 0px #499e46;
        -moz-box-shadow:  0px 3px 0px 0px #499e46;
            box-shadow:  0px 3px 0px 0px #499e46;

    }

.button-press-green:active {
    box-shadow: 0 6px #338fb4;
    transform: translateY(3px);
    -webkit-box-shadow: inset 0px 1px 2px 2px #499e46;
        -moz-box-shadow: inset 0px 1px 2px 2px #499e46;
            box-shadow: inset 0px 1px 2px 2px #499e46;
    outline: none;
}
.button-press-green-inactive {
  background-color:#65e0615e;
  display: inline-block;
  font-size: 24px;
  cursor: pointer;
  color: #343a4094;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0 6px #499e4675;
  ointer-events: none;
  cursor: default;
}

.button-press-green-inactive-nopress {
  background-color:#65e0615e;
  display: inline-block;
  font-size: 24px;
  cursor: pointer;
  color: #343a4094;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0 6px #499e4675;
  ointer-events: none;
  cursor: default;
}

.button-press-green-inactive:hover {
    box-shadow: 0 5px #499e464f;
    transform: translateY(3px);
    -webkit-box-shadow:  0px 3px 0px 0px #499e464f;
        -moz-box-shadow:  0px 3px 0px 0px #499e464f;
            box-shadow:  0px 3px 0px 0px #499e464f;
}

.button-press-green-inactive:active {
    box-shadow: 0 3px #499e464f;
    transform: translateY(3px);
    -webkit-box-shadow: inset 0px 1px 2px 2px #499e464f;
        -moz-box-shadow: inset 0px 1px 2px 2px #499e464f;
            box-shadow: inset 0px 1px 2px 2px #499e464f;
    outline: none;
}

.button-press-red {
  background-color:#F44336;
  display: inline-block;
  font-size: 24px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0 6px #ad2c22;

}


.button-press-white {
  background-color: white;
  display: inline-block;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0px 6px 0px 0px #d0d0d0;

}


.button-press-grey {
    background-color: white;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    outline: none;
    border: none;
    box-shadow: 0px 6px 0px 0px #c3c3c3;
    border: 1px solid #a7a7a7;

}
.button-press-red:hover {
    box-shadow: 0 5px #ad2c22;
    transform: translateY(3px);
    -webkit-box-shadow:  0px 3px 0px 0px #ad2c22;
        -moz-box-shadow:  0px 3px 0px 0px #ad2c22;
            box-shadow:  0px 3px 0px 0px #ad2c22;

    }

.button-press-red:active {
    box-shadow: 0 3px #338fb4;
    transform: translateY(3px);
    -webkit-box-shadow: inset 0px 1px 2px 2px #ad2c22;
        -moz-box-shadow: inset 0px 1px 2px 2px #ad2c22;
            box-shadow: inset 0px 1px 2px 2px #ad2c22;
    outline: none;
}

.button-press-red-inactive {
  background-color:#f443365e;
  display: inline-block;
  font-size: 24px;
  cursor: pointer;
  color: #343a408f;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  box-shadow: 0 6px #ad2c2275;
  ointer-events: none;
  cursor: default;
}

.button-plain-red:hover{
    background-color:#f443365e;
}

.big-dropdown {
	color: white;
	background-color: #4DBCE9;
	border: 2px solid rgba(255, 255, 255, 1);
    position: relative;
    z-index: 10;
    border-radius: 5px;
    padding: 10px;
    text-align: center;
    font-weight: bold;
}

.big-dropdown option {
	color: black;
	background-color: white;
    margin: 40px;
    border-radius: 51px;
    font-size: 20px;
    border: 2px solid rgba(255, 255, 255, 1);
    font-weight: bold;
}

.medium-dropdown {
	color: white;
	background-color: #4DBCE9;
	border: 2px solid rgba(255, 255, 255, 1);
    position: relative;
    z-index: 10;
    border-radius: 5px;
    padding: 5px;
    text-align: center;
    font-weight: bold;
    width: 300px;
}

.medium-dropdown option {
	color: black;
	background-color: white;
    margin: 40px;
    border-radius: 51px;
    font-size: 20px;
    border: 2px solid rgba(255, 255, 255, 1);
    font-weight: bold;
}

.input-blue{
    width: 70px;
    background-color: #26ade4;
    border: 2px solid white;
    border-radius: 5px;
    font-weight: 700;
    color: white;
    padding-left: 20px;
    }

.zastrzezenia-input{
    position: absolute;
    max-width: 276px;
    z-index: 30;
    max-height: 400px;
    overflow: auto;
    right: 60px;
    border-radius: 5px;
    border: 2px solid white

}

/* RESPONISVE CUSTOM */
.font-size-1 {font-size: 9px;}
@media (min-width: 340px) {
  .font-size-1 {font-size:10px;}
}

@media (min-width: 425px) {
  .font-size-1 {font-size:13px;}
}

@media (min-width: 600px) {
  .font-size-1 {font-size:15px;}
}


@media (min-width: 1024px) {
  .font-size-1 {font-size:15px;}
}


/* FONT-SIZE-2 */
.font-size-2 {font-size: 16px;}
@media (min-width: 300px) {
  .font-size-2 {font-size:20px;}
}

@media (min-width: 400px) {
  .font-size-2 {font-size:20px;}
}

@media (min-width: 600px) {
  .font-size-2 {font-size:24px;}
}


@media (min-width: 1024px) {
  .font-size-2 {font-size:27px;}
}

@media (min-width: 1240px) {
  .font-size-2 {font-size:30px;}
}


/* FONT-SIZE-3 */
.font-size-3 {font-size: 16px;}
@media (min-width: 340px) {
  .font-size-3 {font-size:18px;}
}

@media (min-width: 400px) {
  .font-size-3 {font-size:22px;}
}

@media (min-width: 600px) {
  .font-size-3 {font-size:22px;}
}


@media (min-width: 1024px) {
  .font-size-3 {font-size:20px;}
}

/* FONT-SIZE-4 */
.font-size-4 {font-size: 12px;}
@media (min-width: 300px) {
  .font-size-4 {font-size:12px;}
}

@media (min-width: 400px) {
  .font-size-4 {font-size:14px;}
}

@media (min-width: 600px) {
  .font-size-4 {font-size:14px;}
}


@media (min-width: 1024px) {
  .font-size-4 {font-size:14px;}
}

/* FONT-SIZE-5 */
.font-size-5 {font-size: 16px;}
@media (min-width: 340px) {
  .font-size-5 {font-size:16px;}
}

@media (min-width: 1024px) {
  .font-size-5 {font-size:16px;}
}

/* FONT-SIZE-6 */
.font-size-6 {font-size: 16px;}
@media (min-width: 300px) {
  .font-size-6 {font-size:25px;}
}

@media (min-width: 400px) {
  .font-size-6 {font-size:27px;}
}

@media (min-width: 600px) {
  .font-size-6 {font-size:30px;}
}



@media (min-width: 1240px) {
  .font-size-6 {font-size:35px;}
}



/* DISPLAY-SIZE-1 */
.display-size-1 {font-size: 10vw;}
@media (min-width: 340px) {
  .display-size-1 {font-size:10vw;}
}

@media (min-width: 425px) {
  .display-size-1 {font-size:7vw;}
}

@media (min-width: 600px) {
  .display-size-1 {font-size:7vw;}
}

@media (min-width: 1024px) {
  .display-size-1 {font-size: 5vw;}
}


@media (min-width: 1280px) {
  .display-size-1 {font-size: 5vw;}
}

@media (min-width: 1600px) {
  .display-size-1 {font-size: 4vw;}
}

/* DISPLAY-SIZE-2 */
.display-size-2 {font-size: 8vw;}
@media (min-width: 300px) {
  .display-size-2 {font-size:8vw;}
}

@media (min-width: 425px) {
  .display-size-2 {font-size:7vw;}
}

@media (min-width: 600px) {
  .display-size-2 {font-size:6vw;}
}

@media (min-width: 1024px) {
  .display-size-2 {font-size: 4vw;}
}


@media (min-width: 1280px) {
  .display-size-2 {font-size: 4vw;}
}

@media (min-width: 1600px) {
  .display-size-2 {font-size: 3vw;}
}


/* DISPLAY-SIZE-4 */
.display-size-4 {font-size: 4vw;}
@media (min-width: 340px) {
  .display-size-4 {font-size:4vw;}
}

@media (min-width: 425px) {
  .display-size-4 {font-size:4vw;}
}

@media (min-width: 600px) {
  .display-size-4 {font-size:4vw;}
}


@media (min-width: 1024px) {
  .display-size-4 {font-size: 1.5vw;}
}


.circle{
    border: 1px solid black;
    border-radius: 100%;
    width: 68px;
    height: 68px;
    background-size: cover;

    }

@media (min-width: 340px) {
  .circle {width: 75px; height: 75px; margin: auto;}
}

@media (min-width: 425px) {
  .circle {width: 80px; height: 80px; margin: auto;}
}

@media (min-width: 600px) {
  .circle {width: 95px; height: 95px; margin: auto;}
}

.border-1 {
    border: 3px solid #ffffff5c !important;
}
.border-1-bottom {
    border-bottom: 2px solid #ffffff5c;
}

.border-3 {
    border: 3px solid #ffffff5c;
}

.border-4 {
    border: 4px solid #ffffff5c;
}

.border-dark-3 {
    border: 3px solid #343a40;
}
.border-light-3 {
    border: 3px solid #343a404a;
}

.text-white-1{
    color: #ffffff94;
}

.hover-text:hover{
    color: #ffffff8f !important;
}

.img-container{
    display:block;
    overflow: hidden;
    border-radius: 50%;
    position:relative;
}





@media only screen and (max-width: 2800px) {
  .img-box {
    height:500px;
    width: 500px;
    top:-50px;

    position: relative;
  }
}
@media only screen and (max-width: 600px) {
  .img-box {
    height: 90vw;
    width: 90vw;
    top: -10px;
    right: 9vw;
    position: relative;
  }
}

.circle-number{
    border-radius: 50%;
    height:150px;
    width: 150px;
    font-size: 40px;
    font-weight: 800;

}

@media only screen and (max-width: 2800px) {
  .img-box {
    height:500px;
    width: 500px;
    top:-50px;

    position: relative;
  }
}
@media only screen and (max-width: 600px) {
  .img-box {
    height: 90vw;
    width: 90vw;
    top: -10px;
    right: 9vw;
    position: relative;
  }
}

.contact-form:hover row{
    color:white;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.35)!important;
}
.contact-form:hover .fa-envelope{
    color: #f8f9fab5!important;
}
/*.contact-form:hover button{
    border: 3px solid #d1e751b3!important;
}*/


/* SCROLL EFFECTS */
.scroll-hide{
    opacity: 0;
    transition: opacity 1s, top 1s;
    position: relative;
    top: 100px;
}
.scroll-show{
   opacity: 1;
   top: 0px;
}

/* WELCOME PAGE EFFECTS*/
.circle-left-starting{
    height: 70%;
    width: 70%;
    bottom: 100%;
    right: -90vw;
    transform: rotate(700deg);
    transition: right 1s, transform 2s;

}
.circle-left-final{
    height: 70%;
    width: 70%;
    bottom: 100%;
    right: 10%;
    transform: rotate(0deg);
    z-index:11;
    transition: all 1s;
}
.circle-left-final:hover{
/*    transform: rotate(360deg);*/
    width: 80%;
    height: 80%;
    z-index: 100;
    transition: all 1s;
}


.circle-top-starting{
    height: 60%;
    width: 60%;
    bottom: 130vh;
    left: 35%;
    transition: bottom 1s, transform 2s;
    transform: rotate(-300deg);

}
.circle-top-final{
    bottom: 5%;
    transform: rotate(0deg);
    transition: all 1s;
}
.circle-top-final:hover{
/*    transform: rotate(360deg);*/
    width: 75%;
    height: 75%;
    z-index: 100;
    bottom: 25%;
    left: 25%;
    transition: all 1s;
}

.circle-bottom-starting{
    height: 60%;
    width: 60%;
    top: 100vh;
    left: 35%;
    transition: top 1s, transform 2s;
    transform: rotate(-300deg);
    z-index:10;

}
.circle-bottom-final{
    top: 5%;
    transform: rotate(0deg);
    transition: all 1s;
}
.circle-bottom-final:hover{
    height: 75%;
    width: 75%;
    top: 10%;
    left: 30%;
    z-index: 100;
    transform: rotate(360deg);
    transition: all 1s;
}

/*.get-started:hover{
  animation: mymove 500ms forwards;
  max-width: 900px !important;
}
@keyframes mymove {
  33%  {transform: rotate(5deg);}
  66%  {transform: rotate(-5deg);}
  100%  {transform: rotate(0deg);}

}*/

/*.get-started:hover .button-press-yellow{
    animation: pressing 1s;
}

@keyframes pressing {
  10%  {box-shadow: 0px 3px 0px 0px #a8b55b;transform: translateY(3px);}
  40%  {box-shadow: 0px 6px 0px 0px #a8b55b;transform: translateY(0px);}
  70%  {box-shadow: 0px 3px 0px 0px #a8b55b;transform: translateY(3px);}
  100%  {box-shadow: 0px 6px 0px 0px #a8b55b;transform: translateY(0px);}
}*/

.get-started:hover i{
    color: #f6665b;
    transition: color 2s;
}

.hide-circle-number{
   position: absolute;
   width: 150px;
   height: 150px;
   left: -20px;
   top: -20px;
   background-color: #f8f9fa;
   transition: top 2s linear;
}
.show-circle-number{
   position: absolute;
   width: 150px;
   height: 150px;
   left: -20px;
   top:  -155%;
   background-color: #f8f9fa;

}
.shadow-show{
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
    transition: box-shadow 500ms;

}
.shiny:hover{
    animation: shining 250ms;
}

.shine{
    animation: shining 250ms;
}

@keyframes shining {
  0%  {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 0%, rgba(180,230,250,1) 0%, rgba(77,188,233,1) 15%, rgba(77,188,233,1) 100%);}
  5% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 0%, rgba(180,230,250,1) 5%, rgba(77,188,233,1) 20%, rgba(77,188,233,1) 100%);}
  10% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 0%, rgba(180,230,250,1) 10%, rgba(77,188,233,1) 25%, rgba(77,188,233,1) 100%);}
  15% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 0%, rgba(180,230,250,1) 15%, rgba(77,188,233,1) 30%, rgba(77,188,233,1) 100%);}
  20% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 5%, rgba(180,230,250,1) 20%, rgba(77,188,233,1) 35%, rgba(77,188,233,1) 100%);}
  25% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 10%, rgba(180,230,250,1) 25%, rgba(77,188,233,1) 40%, rgba(77,188,233,1) 100%);}
  30% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 15%, rgba(180,230,250,1) 30%, rgba(77,188,233,1) 45%, rgba(77,188,233,1) 100%);}
  35% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 20%, rgba(180,230,250,1) 35%, rgba(77,188,233,1) 50%, rgba(77,188,233,1) 100%);}
  40% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 25%, rgba(180,230,250,1) 40%, rgba(77,188,233,1) 55%, rgba(77,188,233,1) 100%);}
  45% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 30%, rgba(180,230,250,1) 45%, rgba(77,188,233,1) 60%, rgba(77,188,233,1) 100%);}
  50% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 35%, rgba(180,230,250,1) 50%, rgba(77,188,233,1) 65%, rgba(77,188,233,1) 100%);}
  55% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 40%, rgba(180,230,250,1) 55%, rgba(77,188,233,1) 75%, rgba(77,188,233,1) 100%);}
  65% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 45%, rgba(180,230,250,1) 60%, rgba(77,188,233,1) 80%, rgba(77,188,233,1) 100%);}
  70% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 50%, rgba(180,230,250,1) 65%, rgba(77,188,233,1) 85%, rgba(77,188,233,1) 100%);}
  75% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 55%, rgba(180,230,250,1) 70%, rgba(77,188,233,1) 90%, rgba(77,188,233,1) 100%);}
  80% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 60%, rgba(180,230,250,1) 75%, rgba(77,188,233,1) 95%, rgba(77,188,233,1) 100%);}
  85% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 65%, rgba(180,230,250,1) 80%, rgba(77,188,233,1) 100%, rgba(77,188,233,1) 100%);}
  90% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 70%, rgba(180,230,250,1) 85%, rgba(77,188,233,1) 105%, rgba(77,188,233,1) 100%);}
  95% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 75%, rgba(180,230,250,1) 90%, rgba(77,188,233,1) 110%, rgba(77,188,233,1) 100%);}
  100% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 80%, rgba(180,230,250,1) 95%, rgba(77,188,233,1) 115%, rgba(77,188,233,1) 100%);}
}
/*

@keyframes shining {
  0%  {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 0%, rgba(180,230,250,1) 5%, rgba(77,188,233,1) 10%, rgba(77,188,233,1) 100%);}
  5% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 5%, rgba(180,230,250,1) 10%, rgba(77,188,233,1) 15%, rgba(77,188,233,1) 100%);}
  10% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 10%, rgba(180,230,250,1) 15%, rgba(77,188,233,1) 20%, rgba(77,188,233,1) 100%);}
  15% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 15%, rgba(180,230,250,1) 20%, rgba(77,188,233,1) 25%, rgba(77,188,233,1) 100%);}
  20% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 20%, rgba(180,230,250,1) 25%, rgba(77,188,233,1) 30%, rgba(77,188,233,1) 100%);}
  25% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 25%, rgba(180,230,250,1) 30%, rgba(77,188,233,1) 35%, rgba(77,188,233,1) 100%);}
  30% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 30%, rgba(180,230,250,1) 35%, rgba(77,188,233,1) 40%, rgba(77,188,233,1) 100%);}
  35% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 35%, rgba(180,230,250,1) 40%, rgba(77,188,233,1) 45%, rgba(77,188,233,1) 100%);}
  40% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 40%, rgba(180,230,250,1) 45%, rgba(77,188,233,1) 50%, rgba(77,188,233,1) 100%);}
  45% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 45%, rgba(180,230,250,1) 50%, rgba(77,188,233,1) 55%, rgba(77,188,233,1) 100%);}
  50% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 50%, rgba(180,230,250,1) 55%, rgba(77,188,233,1) 60%, rgba(77,188,233,1) 100%);}
  55% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 55%, rgba(180,230,250,1) 60%, rgba(77,188,233,1) 65%, rgba(77,188,233,1) 100%);}
  65% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 60%, rgba(180,230,250,1) 65%, rgba(77,188,233,1) 70%, rgba(77,188,233,1) 100%);}
  70% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 65%, rgba(180,230,250,1) 70%, rgba(77,188,233,1) 75%, rgba(77,188,233,1) 100%);}
  75% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 70%, rgba(180,230,250,1) 75%, rgba(77,188,233,1) 80%, rgba(77,188,233,1) 100%);}
  80% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 75%, rgba(180,230,250,1) 80%, rgba(77,188,233,1) 85%, rgba(77,188,233,1) 100%);}
  85% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 80%, rgba(180,230,250,1) 85%, rgba(77,188,233,1) 90%, rgba(77,188,233,1) 100%);}
  90% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 85%, rgba(180,230,250,1) 90%, rgba(77,188,233,1) 95%, rgba(77,188,233,1) 100%);}
  95% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 90%, rgba(180,230,250,1) 95%, rgba(77,188,233,1) 100%, rgba(77,188,233,1) 100%);}
  100% {background: rgb(77,188,233); background: linear-gradient(120deg, rgba(77,188,233,1) 0%, rgba(77,188,233,1) 95%, rgba(180,230,250,1) 100%, rgba(77,188,233,1) 105%, rgba(77,188,233,1) 100%);}
}*/


