html {
background: url(http://cdn.pcwallart.com/images/gradient-black-to-white-square-wallpaper-4.jpg) top fixed;
/*I didn't know what to do with the background, so...*/
}
h1 {
font-family: 'Righteous', cursive;
font-size: 35px;
text-shadow: 0 2px 2px gray;
text-transform: uppercase;
}
body {
font-family: 'Varela Round', sans-serif;
margin: 0 auto;
width: 900px;
}
.home-link:before {
color: transparent;
content: '►';
margin-right: 5px;
text-shadow: 0 2px 2px transparent;
}
.home-link:after {
color: transparent;
content: '◄';
margin-left: 5px;
text-shadow: 0 2px 2px transparent;
}
.home-link {
color: transparent;
font-weight: bold;
letter-spacing: 2px;
position: relative;
text-decoration: none;
text-shadow: 0 2px 2px black;
text-transform: uppercase;
top: -10px;
}
.home-link:hover:before, .home-link:hover:after {
color: black;
text-shadow: 0 2px 2px gray;
}
.home-link:hover {
color: black;
}
#contentContainer {
width: 700px;
height: 400px;
border: 5px solid black;
overflow: hidden;
}
#wrapper {
width: 2800px;
transform: translate3d(0, 0, 0);
transition: transform .5s ease-in-out;
}
.content {
float: left;
width: 700px;
height: 400px;
white-space: normal;
background-repeat: no-repeat;
}
#itemOne {
background: url(http://cdn.wallpapersafari.com/28/46/ZBz0Hg.jpg) center;
background-size: 115%;
}
#itemTwo {
background: url(https://littleanimeblog.files.wordpress.com/2016/06/bananya1.jpg) center;
background-size: 110%;
}
#itemThree {
background: url(http://www.omniareviews.com/wp-content/uploads/2016/04/maxresdefault-1.jpg) center;
background-size: 110%;
}
#itemFour {
background: url(http://blogs-images.forbes.com/olliebarder/files/2015/08/aot_ps4.jpg) center;
}
.content h2 {
font-family: 'Righteous';
letter-spacing: 5px;
text-shadow: 2px 2px 0 white, -2px 2px 0 white, -2px -2px 0 white, 2px -2px 0 white;
text-transform: uppercase;
}
.content p {
background: rgba(255, 255, 255, 0.7);
box-shadow: 0 0 5px black;
font-size: 13px;
position: relative;
}
#navLinks {
text-align: center;
width: 550px;
}
#navLinks ul {
margin: 0px;
padding: 0px;
display: inline-block;
margin-top: 6px;
}
#navLinks ul li {
float: left;
text-align: center;
margin: 10px;
list-style: none;
cursor: pointer;
background-color: #CCCCCC;
padding: 5px;
border-radius: 50%;
border: black 3px solid;
}
#navLinks ul li:hover {
background-color: darkgray;
}
#navLinks ul li.active {
background-color: #333333;
color: #FFFFFF;
outline-width: 7px;
}
#navLinks ul li.active:hover {
background-color: black;
color: #FFFFFF;
}
h3 {
font-family: 'Righteous', cursive;
font-size: 25px;
letter-spacing: 2px;
text-transform: uppercase;
}
h4 {
font-family: 'Righteous', cursive;
font-size: 20px;
letter-spacing: 2px;
line-height: 0px;
}
#fav-anime {
width: 700px;
}
.cindy, .lauryn {
font-size: 12px;
width: 345px;
}
.cindy {
border-right: 5px solid black;
float: left;
}
.lauryn {
border-left: 5px solid black;
float: right;
}