body, html, .main {
  height: 100%;
}

section {
  min-height: 100%;
}

body {
  /* background: linear-gradient(to bottom, #5E5E5E 0%, #222222 100%);   
	background: #AAAFFF;*/
}

.space { 
  /* The image used */
  background-image: url("./../images/space.jpg") ;
  background-size: 100%;
  position: relative;
  width: 100%;
  height: 100%;
  display: table;
  margin-top: 0px;
  cursor: default;
  /* Center and scale the image nicely */
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover; 
  
}

span.albumtitle {
	display: inline-block;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
 /* background-color: #5313; */
}

/*li {
  float: left;
}*/

.box {
    width:300px;
    height:300px;
    background-color:#d9d9d9;
    position:fixed;
    margin-left:-150px; /* half of width */
    margin-top:-150px;  /* half of height */
    top:50%;
    left:50%;
}

.img-valign {
  align: left;
  vertical-align: middle;
  margin-bottom: 0.75em;
  width: 135px;
  height: auto;
}

span.text1 {
  font-size: 23px;
  font-family: Courier New;
  width:200px; 
}

li a, div a {
  display: block;
  color: black;
  text-align: center;
  vertical-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-family: Courier New;
}

li a:hover:not(.active) {
  color: rgb(252,127,46);
}

div a:hover:not(.active) {
    font-weight: bold;
	color: rgb(252,127,46);
	
}

.active {
  color: #4CAF50;
}

ul {
  margin-top: 25px;
  margin-bottom:50px;
  margin-right: 50px;
  margin-left: 80px;
}

h3.infel {
        color: rgb(252,127,46);
		font-weight: bold;
		font-family: Courier New;
		display: inline;
}

h3.gamothrate {
        color: black;
		font-family: Courier New;
		display: inline;
}

h3.menu {
        color: black;
}

*,
:after,
:before {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

section {
  height: 100vh;
  width: 100%;
  display: table;
  
}

section.ok{
  background-color: #888;
  background-image: url("./../images/albums_background.jpg") ;
  background-size: 100%;
  position: relative;
  width: 100%;
  height: 100%;
  display: table;
  
  /* Center and scale the image nicely */
  background-position: left top;
  background-repeat: repeat;
}


/* p.albums{
  color: black;
  font-family: Courier New;
  font-weight: Bold;
  position: absolute;
  bottom: 200px;
  left: 50%;
  margin-left: -3px;
} */

#gotoatr a {
   bottom: 110px;
}
#gotoatr a span {
  position: absolute;
  bottom: 110px;
  left: 50%;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  border-left: 3px solid #91AEC1;
  border-bottom: 3px solid #91AEC1;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb04 2s infinite;
  animation: sdb04 2s infinite;
  box-sizing: border-box;
}

#gotoatrb a span {
  position: absolute;
  bottom: 110px;
  left: 50%;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  border-left: 3px solid #8E6B81;
  border-bottom: 3px solid #8E6B81;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb04 2s infinite;
  animation: sdb04 2s infinite;
  box-sizing: border-box;
}

@-webkit-keyframes sdb04 {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
  }
  20% {
    -webkit-transform: rotate(-45deg) translate(-20px, 20px);
  }
  40% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
  }
}
@keyframes sdb04 {
  0% {
    transform: rotate(-45deg) translate(0, 0);
  }
  20% {
    transform: rotate(-45deg) translate(-20px, 20px);
  }
  40% {
    transform: rotate(-45deg) translate(0, 0);
  }
}