/* body */
body
{
	font-family: Comfortaa, sans-serif;
	background-color: #040813;
	color: #c0c0c0;
}

.background
{
	background-image: url("../pic/bg.jpg");
	min-height: 100vh;
	width: auto;
}

/* menu */
.navbar-nav > .nav-item
{
	font-size: 1.2rem;
}

.navbar-nav > .nav-item > a
{
	color: #C0C0C0 !important;
}

.navbar-nav > .nav-item > a:hover
{
  color: #FFF !important;
}

.navbar-brand > #logo
{
	height: 44px;
	padding-left: 6px;
}

.navbar-brand > #moon
{
	height: 80px;
}

.menu-club-dark
{
	background-color: #07132b;
  border-right: 1px solid #c0c0c0;
  border-left: 1px solid #c0c0c0;
  border-top: 1px solid #c0c0c0;
}

/* intro */
#intro
{ 
  position: relative;
  border: 1px solid #c0c0c0;
  background-color: #32417c;
}

.lyrics
{
  padding-top: 12px;
  position: absolute;
  top: 0;
  left: 35%;
  width: 30%;
  z-index: 1000;
}

.lyricsText
{
  color: #c0c0c0;
	margin: auto;
  font-size: 1.4rem;
  max-width: 1140px;
  overflow: hidden;
}

/* about */
#about
{
  padding: 60px 0px;
  border-right: 1px solid #c0c0c0;
  border-left: 1px solid #c0c0c0;
  background-color: #07132b;
}

/*music */
#music
{
  padding: 60px 0px;
  border-right: 1px solid #c0c0c0;
  border-left: 1px solid #c0c0c0;
  background-color: #32417c;
}

.spotifyWrapper
{
  text-align: center;
}

#spotifyPlayer
{
  height: 480px;
  width: -webkit-calc(100% - 50px);
  width:    -moz-calc(100% - 50px);
  width:         calc(100% - 50px);
  max-width: 760px;  
  margin-left: 10px;
  margin-top: 20px;
  margin-bottom: 20px;
  border: 1px solid #9f9f9f;
  border-radius: 12px;
  z-index: -1;  
}
#spotifyFollow
{
  border:0 ;  
  margin-top: 4px;
  height: 45px;
  width: 150px;
}


/* misc */
.h2C
{
  font-size: 1.8rem;
  padding-bottom: 1.4rem;
}

a 
{
   outline: 0; // remove dotted line
}

/* turning moon */
@-webkit-keyframes NAME-YOUR-ANIMATION {
  70%   { opacity: 0.7; }
  100% { opacity: 1; }
}
@-moz-keyframes NAME-YOUR-ANIMATION {
  70%   { opacity: 0.7; }
  100% { opacity: 1; }
}
@-o-keyframes NAME-YOUR-ANIMATION {
  70%   { opacity: 0.7; }
  100% { opacity: 1; }
}
@keyframes NAME-YOUR-ANIMATION {
  70%   { opacity: 0.7; }
  100% { opacity: 1; }
}


.rotating {
  -webkit-animation: NAME-YOUR-ANIMATION 12s infinite; /* Safari 4+ */
  -moz-animation:    NAME-YOUR-ANIMATION 12s infinite; /* Fx 5+ */
  -o-animation:      NAME-YOUR-ANIMATION 12s infinite; /* Opera 12+ */
  animation:         NAME-YOUR-ANIMATION 12s infinite; /* IE 10+, Fx 29+ */
}


/* media queries */

@media screen and (max-width: 991px) 
{
  .h2C, .lead
  {
    padding-left: 10px;
  }
}


@media screen and (max-width: 600px) 
{
  .lyricsText
  {
    font-size: 1.2rem;
  }  

  .lead
  {
    font-size: 1rem;
  }

  #about, #music
  {
    padding: 30px 0px;
  }

  .h2C
  {
    font-size: 1.4rem;
    padding-bottom: 1.2rem;
  }
}


@media screen and (max-width: 500px) 
{
  .lyricsText
  {
    font-size: 1.1rem;
  }


}


@media screen and (max-width: 400px) 
{
  .navbar-brand > #moon, .navbar-brand > #logo
  {
    height: 38px;
  }  

  .lyricsText
  {
    font-size: 1.0rem;
  } 

  .h2C
  {
    font-size: 1.2rem;
    padding-bottom: 1.0rem;
  } 

  #spotifyPlayer
  {
    width: -webkit-calc(100% - 10px);
    width:    -moz-calc(100% - 10px);
    width:         calc(100% - 10px);
    margin: 0px 0px;
  }

  #spotifyFollow
  { 
    
    margin-top: 32px;
  }


}


@media screen and (max-width: 374px) 
{
  .navbar-brand > #moon, .navbar-brand > #logo
  {
    height: 34px;
  }  

  .lyricsText
  {
    font-size: 0.9rem;
  }  

   .lead
  {
    font-size: 0.9rem;
  }
}