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

html {
  height: 100%;
}
body {
  height: 100%;
  background: linear-gradient(225deg, #ff0000, #00ffff) fixed;
  background-size: 400% 400%;
  animation: background 10s linear infinite;
}




body {
	font-family: Avenir, sans-serif;
	font-size: 20px;
	color: white;
	}


a:link, a:active {
	color: white;
	text-decoration: none;
	font-family: Avenir;
	font-size: 50px;
	}

a:hover {
	color: indianred;
	text-decoration: none;
	font-family: Avenir, sans-serif;
	font-size: 50px;
	}



p {
	color: #38323B;
	padding: 10px;
	font-family: Avenir, sans-serif;
	}

h1 {
  color: white;
  font-size: 50px;
  font-family: Avenir, sans-serif;
  }

h3 {
  color: white;
  font-size: 20px;
  font-family: Avenir;
  }

  ol{
   font-size: 3em; 
  }
  ol div{
   font-size: 18px; 
  }

  

.video-app .videosList-wrapper {
  min-height: 350px;
  margin-bottom: 30px;
}

.video-app .videosList-wrapper .videosList ul {
  color: white;
  font-size: 30px;
  
}


.video-app .videosList-wrapper .videosList li {
  margin: 15px 0;
  color: white;
  
}

.video-app .videosList-wrapper .videosList li:hover {
  cursor: pointer;
  color: indianred;
}


.video-app .videosList-wrapper .videosList li div:first-child {
  padding: 0
}


.video-app .videosList-wrapper .btn {
  background-color: #f17f7f;
  outline: none
}

.video-app .videosList-wrapper .btn:hover,
.video-app .videosList-wrapper .btn:focus {
  color: #fff
}

.video-app .videosList-wrapper .btn:hover {
  opacity: .85
}


.modal {
  display: none
}

.modal.on {
  display: block !important;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: #fff
  }

.modal .videoWrapper {
  float: none;
  clear: both;
  width: 100%;
  position: relative;
  padding-bottom: 50%;
  height: 0
}

.modal .videoWrapper iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
  height: 70%
}


/*# sourceMappingURL=main.css.map */