/* Add here all your CSS customizations */

body {
background-image:url('img/bg.png');
background-repeat:repeat;

}

audio:hover, audio:focus, audio:active
{
-webkit-box-shadow: 15px 15px 20px rgba(0,0, 0, 0.4);
-moz-box-shadow: 15px 15px 20px rgba(0,0, 0, 0.4);
box-shadow: 15px 15px 20px rgba(0,0, 0, 0.4);
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
transform: scale(1.05);
}


audio
{
-webkit-transition:all 0.5s linear;
-moz-transition:all 0.5s linear;
-o-transition:all 0.5s linear;
transition:all 0.5s linear;
-moz-box-shadow: 2px 2px 4px 0px #006773;
-webkit-box-shadow:  2px 2px 4px 0px #006773;
box-shadow: 2px 2px 4px 0px #006773;
-moz-border-radius:7px 7px 7px 7px ;
-webkit-border-radius:7px 7px 7px 7px ;
border-radius:7px 7px 7px 7px ;
}

bottombar {
   position: absolute;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: #d6eaf8;
   color: white;
   text-align: center;
}

/*! ========================================================================
 * Bootstrap Toggle: bootstrap-toggle.css v2.2.0
 * http://www.bootstraptoggle.com
 * ========================================================================
 * Copyright 2014 Min Hur, The New York Times Company
 * Licensed under MIT
 * ======================================================================== */
.checkbox label .toggle,.checkbox-inline .toggle{margin-left:-20px;margin-right:5px}
.toggle{position:relative;overflow:hidden}
.toggle input[type=checkbox]{display:none}
.toggle-group{position:absolute;width:200%;top:0;bottom:0;left:0;transition:left .35s;-webkit-transition:left .35s;-moz-user-select:none;-webkit-user-select:none}
.toggle.off .toggle-group{left:-100%}
.toggle-on{position:absolute;top:0;bottom:0;left:0;right:50%;margin:0;border:0;border-radius:0}
.toggle-off{position:absolute;top:0;bottom:0;left:50%;right:0;margin:0;border:0;border-radius:0}
.toggle-handle{position:relative;margin:0 auto;padding-top:0;padding-bottom:0;height:100%;width:0;border-width:0 1px}
.toggle.btn{min-width:59px;min-height:34px}
.toggle-on.btn{padding-right:24px}
.toggle-off.btn{padding-left:24px}
.toggle.btn-lg{min-width:79px;min-height:45px}
.toggle-on.btn-lg{padding-right:31px}
.toggle-off.btn-lg{padding-left:31px}
.toggle-handle.btn-lg{width:40px}
.toggle.btn-sm{min-width:50px;min-height:30px}
.toggle-on.btn-sm{padding-right:20px}
.toggle-off.btn-sm{padding-left:20px}
.toggle.btn-xs{min-width:35px;min-height:22px}
.toggle-on.btn-xs{padding-right:12px}
.toggle-off.btn-xs{padding-left:12px}

/*! ========================================================================
 * Radio text blur
 * ======================================================================== */
@import url(https://fonts.googleapis.com/css?family=Hind:700);
.span {
	color: transparent;
	animation: blur 10s ease-out infinite;
	-webkit-animation: blur 10s ease-out infinite;
	font-family: 'Hind', sans-serif;
	font-size: 200%;
	color:#000000;
}

.span:nth-child(1) {
	animation-delay: 0.1s;
	-webkit-animation-delay: 0.1s;
}
.span:nth-child(2) {
	animation-delay: 0.2s;
	-webkit-animation-delay: 0.2s;
}
.span:nth-child(3) {
	animation-delay: 0.3s;
	-webkit-animation-delay: 0.3s;
}
.span:nth-child(4) {
	animation-delay: 0.4s;
	-webkit-animation-delay: 0.4s;
}
.span:nth-child(5) {
	animation-delay: 0.5s;
	-webkit-animation-delay: 0.5s;
}
.span:nth-child(6) {
	animation-delay: 0.6s;
	-webkit-animation-delay: 0.6s;
}
.span:nth-child(7) {
	animation-delay: 0.7s;
	-webkit-animation-delay: 0.7s;
}

@keyframes blur {
	0%		{text-shadow:  0 0 100px #000; opacity:0;}
	5%		{text-shadow:  0 0 90px #000;}
	15%		{opacity: 1;}
	20%		{text-shadow:  0 0 0px #000;}
	80%		{text-shadow:  0 0 0px #000;}
	85%		{opacity: 1;}
	95%		{text-shadow:  0 0 90px #000;}
	100%	{text-shadow:  0 0 100px #000; opacity:0;}
}

@-webkit-keyframes blur {
	0%		{text-shadow:  0 0 100px #000; opacity:0;}
	5%		{text-shadow:  0 0 90px #000;}
	15%		{opacity: 1;}
	20%		{text-shadow:  0 0 0px #000;}
	80%		{text-shadow:  0 0 0px #000;}
	85%		{opacity: 1;}
	95%		{text-shadow:  0 0 90px #000;}
	100%	{text-shadow:  0 0 100px #000; opacity:0;}
}

/*! ========================================================================
 * CSS loader interfata chat
 * ======================================================================== 
#myProgress {
  width: 100%;
  background-color: #ddd;
}

#myBar {
  width: 1%;
  height: 10px;
  background-color: #4CAF50;
}
#apropoChat{
    display:none;
}
*/

/*
	================================================
	efecte butoane: pulse buton
	<a class="animated-btn text-white" href="#"><i class="fa fa-play"></i></a>
	================================================
*/
.animated-btn {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    line-height: 80px;
    display: inline-block;
    text-align: center;
    background: #ff3f3f;
    position: relative;
}

.animated-btn::before, .animated-btn::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    background: rgba(255, 63, 63, 0.8);
    animation: ripple-1 2s infinite ease-in-out;
    z-index: -1;
}

.animated-btn::after {
    background: rgba(255, 63, 63, 0.6);
    animation: ripple-2 2s infinite ease-in-out;
    animation-delay: 0.5s;
}

@keyframes ripple-1 {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    100% {
        transform: scale(1.5);
        opacity: 0;
    }
}

@keyframes ripple-2 {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

/*
	Scrollbar CSS
*/

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #1476C7 #DFE9EB;
}

/* Chrome, Edge and Safari */
*::-webkit-scrollbar {
  width: 10px;
  width: 10px;
}
*::-webkit-scrollbar-track {
  border-radius: 5px;
  background-color: #DFE9EB;
}

*::-webkit-scrollbar-track:hover {
  background-color: #B8C0C2;
}

*::-webkit-scrollbar-track:active {
  background-color: #B8C0C2;
}

*::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background-color: #1476C7;
}

*::-webkit-scrollbar-thumb:hover {
  background-color: #398FCB;
}

*::-webkit-scrollbar-thumb:active {
  background-color: #153688;
}

/*

	 butonul trivia
*/