/* .welcome */
.welcome{
  height:400px;position:relative;
}
.welcome>.slide{
  position:absolute;width:94%;padding:0px 3%;height:100%;top:0px;left:0px;
  display:flex;justify-content:center;
  opacity:0;transition:opacity 0.5s;
  pointer-events:none;
}
.welcome>.current{
  opacity:1;pointer-events:auto;
}
.welcome>.slide>.text{
  font-weight:bold;text-align:center;margin-top:80px;
}
.welcome>.slide>.text>.head{
  font-size:3.5rem;text-shadow:0px 0px 5px white;
  margin-bottom:10px;
}
.welcome>.slide>.text>.description{
  font-size:1.5rem;text-shadow:0px 0px 5px white;
}
@media (max-width:500px){
  .welcome>.slide>.text>.head{
    font-size:2.5rem;
  }
  .welcome>.slide>.text>.description{
    font-size:1.2rem;
  }
}
.welcome>.circles{
  position:absolute;bottom:0px;left:0px;width:100%;padding:15px 0px;
  display:flex;justify-content:center;
}
.welcome>.circles>.circle{
  width:10px;height:10px;border-radius:50%;background-color:white;opacity:0.75;
  box-shadow:0px 0px 5px black;margin:0px 5px;
}
.welcome>.circles>.current{
  background-color:black;box-shadow:0px 0px 5px white;
}
/* page */
div.page{
  padding:50px 40px;
  line-height:var(--text-line-height);
}
div.page>.headline{
  text-align:center;font-size:2rem;margin-bottom:30px;
}
div.grey{
  background-color:#eeeeee;
}
div.flex{
  display:flex;
  justify-content:center;
}
div.standalone{
  margin:30px 0px;
}
div.center{
  text-align:center;
}
/* video-news */
div.video-news{
  display:grid;grid-template-columns:45% 55%;grid-template-rows:auto;gap:30px;
  justify-content:center;
}
@media (max-width:1200px){
  div.video-news{
    grid-template-columns:50% 50%;
  }
}
@media (max-width:1000px){
  div.video-news{
    grid-template-columns:100%;
  }
  div.page{
    padding:50px 20px;
  }
}
/* video block */
.video-block>.video{
  position:relative;
  padding-bottom:56.25%;
  padding-top:30px;
  height:0px;
  margin:10px 0px;
  overflow: hidden;
}
.video-block>.video>iframe,
.video-block>.video>object,
.video-block>.video>embed{
  position:absolute;
  z-index:0;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
}
/* news block */
.news-block{}
/* news tags */
.news-block>.tags{
  display:flex;font-weight:bold;cursor:pointer;
}
.news-block>.tags>.tag{
  padding:10px;margin:0px 5px;
}
.news-block>.tags>.tag:hover,
.news-block>.tags>.tag:active{
  border-bottom:1px solid var(--brand-color);
}
.news-block>.tags>.tag-selected{
  border-bottom:2px solid var(--brand-color);font-weight:bold;
}
.news-block>.tags>.tag-selected:hover,
.news-block>.tags>.tag-selected:active{
  border-bottom:2px solid var(--brand-color);
}
/* news list */
.news-block>.list{
  padding:15px 20px;
  height:350px;overflow-y:auto;
}
@media screen and (min-width:1000px){
	.news-block>.list::-webkit-scrollbar{width:3px;height:3px;}
	.news-block>.list::-webkit-scrollbar-button{width:0px;height:0px;}
	.news-block>.list::-webkit-scrollbar-thumb{background:var(--brand-color);border:0px none var(--brand-color);}
	.news-block>.list::-webkit-scrollbar-thumb:hover,
	.news-block>.list::-webkit-scrollbar-thumb:active{background:var(--brand-color);}
	.news-block>.list::-webkit-scrollbar-track{background:#dddddd;border:0px none #dddddd;}
	.news-block>.list::-webkit-scrollbar-corner{background:transparent;}
}
.news-block>.list>.news{
  display:grid;
  grid-template-rows:25px auto;
  grid-template-columns:150px auto;
  grid-template-areas:
    "time title"
    "info title";
  padding:15px 0px;
  border-bottom:1px solid #dddddd;
}
.news-block>.list>.news>.time{
  grid-area:time;
}
.news-block>.list>.news>.info{
  grid-area:info;
}
.news-block>.list>.news>.info>.mark{
  color:var(--brand-highlight-color);
}
.news-block>.list>.news>.title{
  grid-area:title;color:var(--brand-light-color);
  transition:color 0.5s;
}
.news-block>.list>.news>.title:hover,
.news-block>.list>.news>.title:active{
  color:var(--brand-color);text-decoration:underline;
}
/* features */
.features{
  display:flex;justify-content:center;
  text-align:center;font-size:1.1rem;
}
.features>.feature{
  width:120px;margin:30px;cursor:pointer;
}
.features>.feature>.icon{
  width:100%;margin-bottom:10px;filter:saturate(0.1);
}
.features>.feature>.icon:hover,
.features>.feature>.icon:active{
  filter:saturate(1);
}
@media (max-width:900px){
  .features{
    flex-wrap:wrap;justify-content:space-between;
  }
  .features>.feature{
    width:20%;margin:20px;
  }
}
@media (max-width:500px){
  .features>.feature{
    width:30%;
  }
}
/* courses */
.courses{
  width:1200px;max-width:100%;margin:0px auto;
  display:flex;justify-content:center;flex-wrap:wrap;
}
.courses>.course{
  position:relative;cursor:pointer;
  flex:none;width:250px;margin:15px;
  border:1px solid #dddddd;
}
@media (max-width:1200px){
  .courses>.course{
    width:45%;margin:2%;
  }
}
@media (max-width:600px){
  .courses>.course{
    width:95%;
  }
}
.courses>.course>img.cover{
  width:100%;height:150px;object-fit:cover;
  border-bottom:1px solid #dddddd;
}
.courses>.course>.online-badge{
  position:absolute;top:0px;right:0px;
  background-color:var(--brand-color);color:white;
  font-size:0.95rem;font-weight:bold;padding:2px 5px;
  box-shadow:0px 0px 5px white;opacity:0.8;
}
.courses>.course>.content{
  padding:10px;
}
.courses>.course>.content>.name{
  font-weight:bold;margin-bottom:10px;
}
.courses>.course>.content>.end-date{
  margin-bottom:10px;
}
.courses>.course>.content>.lecturer{
  margin-bottom:30px;
}
.courses>.course>.content>.more{
  position:absolute;bottom:10px;right:10px;
}