body {

font-family: 'Raleway', sans-serif;
background-color: #F0F0F0;

}

header{
	height:75px;
	padding:0px;
	margin: 30px 0 0 0;
}

#homelink {
	text-decoration: none;
	font-weight: bold;
	color:#000000;
}

#worldclass {
	background-color: #F0F0F0;
}

#titleline {
	width: 300px;
}

.mySlides {
	display: none;
	
}
.gallerywrapper{
	height: 2100px;
}

.spotifywrapper {
	height: 850px;
}

#wrapper{
	margin:auto;
	width:90%;
	background:#FFF;
	padding: 10px;
}

#resizeimage {
	width: 250px;
	height: 190;
	padding: 5px;
}

.instagram {
	
}

.homepagegallery {
	
	display: block;
	width: 740px;
	top: 200px;
	left: 27%;
	z-index: 1;
}


#displaying {
	
}


#displaying2 {
	
	
}

#second {
	
	
}

main {
	display: inline-block;
}

.resizemain {
	width: 100%;
	height: ;
}
footer {
	display: block;

}

#biopic {
	float: left;
	padding: 10px;
}

#bioessay {
	
}

#subscribetable {

	margin-left: 40%;
}

#biolist {
	padding: 20px;
	float: left;
}
li {
	padding: 5px;
}

.gallerypictures {
	float: left;
	padding: 5px;
}

#gallery {
	background-color: #ffffff;
}

#gallerysizing {
	width: 400px;
}

#change {
	position: relative;
	width: 300px;
	float: left;
	display: inline-block;
}

table, th, td {

    border: 1px solid black;
    border-collapse: collapse;
    border-spacing: 5px;
}

th, td {
    padding: 20px;
}

th {
    text-align: center;
}

#buttoncycler {
	float: left;
}




nav a{
	text-decoration:none;
	font-weight: bold;
	color:#544643;
}


nav ul li{
	display:inline-block;
	position:relative;
}
nav ul li a{
	display:inline-block;
	padding:6px 60px;
}
nav ul li a:before{
	content:"";
	position:absolute;
	width:100%;
	height:2px;
	bottom:0;
	left:0;
	background-color:#000;
	visibility:hidden;
	-webkit-transform:scaleX(0);
	transform:scaleX(0);
	-webkit-transition:all 0.3s ease-in-out 0s;
	transition:all 0.3s ease-in-out 0s;
}
nav ul li:hover ul{
	display:block;
}
nav ul li a:hover:before{
	visibility:visible;
	transform:scaleX(1);
}
nav ul li ul{
	min-width:100%;
	opacity:0.9;
	display:none;
	position:absolute;
	background-color: #FFFFFF;
	z-index: 999;
}
nav ul li ul li{
	display:block;
	left: -20px;
}
nav ul li ul li a{
	padding:6px;
	text-align:center;
}

* {box-sizing:border-box}



.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}


.mySlides {
    display: none;
}


.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}


.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}


.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}


.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}


.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}


.dot {
  cursor:pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}


.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

.banner{
	position: absolute;
	top: 1620px;
	width: 50%;
	height: 538px;
	left: 25%;
	
	
}

#slider{
	overflow: hidden;
	width: 100%;
	height: 538px;
}
#changepositiongolf{
	top: -50px;
}

#next{
	text-align: center;
	line-height:50px;
	color: #ffffff;
	width:50px;
	height:50px;
	background-color:#1aaba5;
	position: absolute;
	top:205px;
	right:0;
	z-index:99;
	cursor: pointer;
	opacity: .4;
}


#pre{
	text-align: center;
	line-height: 50px;
	color: #ffffff;
	width:50px;
	height:50px;
	background-color: #1aaba5;
	position: absolute;
	top:205px;
	left:0;
	z-index:99;
	cursor: pointer;
	opacity:.4;
}

.banner: hover #next{
	opacity:1;
	transition: all .5s ease-out;
	-webkit-transition: all .5s ease-out;
	-ms-transition: all .5s ease-out;
}

.banner: hover #pre{
	opacity:1;
	transition: all .5s ease-out;
	-webkit-transition: all .5s ease-out;
	-ms-transition: all .5s ease-out;

}