@import url('https://fonts.googleapis.com/css2?family=Abel&family=Tourney:wght@100;200;300;400;500;900&display=swap');


/* FONTS GO ON TOP!!! */

p{
 	color: #9DAEF2;
 	font-family: Abel;
 	font-size: 25px;
 	margin: 20px;
}
h1{
	color: #5967FF;
	font-family: Tourney;
	font-weight: 500;
	font-size: 40px;

	margin: 20px;
}
h3{
	color:#5967FF ;
	text-align: center;
	font-family: Tourney ;
}

a{

}
table{
	border-collapse: collapse;
	border: 1px solid black;
	max-width: 600px;
	width: 100%;
	font-family: Abel;
	margin: auto;
}
th,td{
	border: 1px solid white;
	padding: 20px;

}
th{
	text-align: left;
}

a{
	color: #5967FF;

}
a:visited{
	color: white;
}
a:hover{
	color: blue;
}	
ul,li {
	color:white;
	font-family: Abel;
	font-size: 20px;
}
h2{
	color: white;
	font-family: Tourney;

}
table{
	color:white;
}
#section img{
	margin: 20px;
	border-style: ridge;
	border-color: #9DAEF2;

}
#header img{
	width: 100%;
}

body{
	background-image: url("tropo2.jpg");
	background-repeat: no-repeat;
	
	background-size: cover;
}
/*BODY*/

#header{
	background: #000000;
	position: relative;
	max-width: 940px;
	width: 90%;
	margin:auto;
	margin-bottom: 20px;
}
#nav{
	background: #000000;
	position: relative;
	max-width: 900px;
	width: 90%;
	margin:auto;
	padding: 20px;
	margin-bottom: 20px;
}
#section{
	background: #000000;
	position: relative;
	max-width: 900px;
	width: 90%;
	margin:auto;
	overflow: hidden;
	padding: 20px;
	margin-bottom: 20px;
}
#footer{
	background: #000000;
	position: relative;
	max-width: 900px;
	width: 90%;
	margin:auto;
	padding: 20px;
	margin-bottom: 20px;
	}

/*NAV*/

#nav li{
	display: inline;
	padding-right: 50px;
	font-family: Tourney;
	font-weight: 900;
}
#nav ul{
	text-align: center;
}	
.floaty{
	float: left;
	margin: 10px;

}

.crop{
 height: 300px;
 margin: auto;
 float: right;


}
.sidebar 
{
float: right;
width: 30%;
height: auto;
border: 1px #skyblue;
margin-left: auto;
margin-right: auto;
}
.sidebar-bottom {
display: none;
}

@media screen and (max-width: 900px) {

.sidebar {
display: none;
}

.sidebar-bottom {
display: block;
position: relative;
width: 90%;
height: auto;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
border: 1px solid white;
background: white;
}
}