body {
background: #234647;
font-family: "Candara", "Open Sans", sans-serif;
font-size:16px;
color: white;
}
a {
color: #0783b9;
}
.tiny {
font-size: 9px;
margin: 0 auto;
text-align: center;
}
/*Everything in the main box goes in this*/
.wrapper {
width: 750px;
border: 3px solid black;
margin: 0 auto;
top: 0px;
}
.header {
background: black;
height: 300px;
border-bottom: 3px solid black;
margin: 0 auto;
overflow: hidden;
background: linear-gradient(rgb(0,0,0,0.7),rgb(0,0,0,0.7)), url("pond.gif"); /*Header image -- replace with your own!*/
background-size:cover;
}
/*This and the header-title class are deprecated now that this style uses a background image for the header div.*/
/*.header img {
display: block;
opacity: 0.35;
width: 100%;
height: 100%;
overflow: hidden;
}
*/
/*If you want to use a smaller title or normal text, add .header p or .header h4 or whatever to the list*/
.header h2, .header h3, .header h1 {
font-weight: bold;
color: white;
text-align: center;
border: 0px solid green;
margin: 18% auto; /*approx centered*/
opacity: 0.999999;
}
.links {
background: black;
padding: 10px;
border-bottom: 3px solid black;
}
.links a {
color: white;
padding: 3px;
margin-left: 5px;
margin-right:5px;
text-decoration: none;
font-size:17px;
}
.main {
padding: 15px;
margin: 0 auto;
background: #222222;
}
/*Prevent overflow of large images in main text areas.*/
.main img {
max-width: 100%;
height: auto;
}
.footer {
background: black;
padding: 20px;
padding-top:5px;
padding-bottom:5px;
border-top: 3px solid black;
font-size:14px;
}
/*For narrow screens*/
@media(max-width: 790px) {
.wrapper {
width: 95%;
}
.header h1, .header h2, .header h3 { /*Vertical centering gets wonky when the box is variable width*/
margin: 20% 5% auto;
}
}
/*Mobile compatibility*/
@media(orientation: portrait) {
.wrapper {
width: 95%;}
.header {
height:230px;
}
.header h1, .header h2, .header h3 {
margin: 20% 3% auto;
}
}
The web site of ahhhhhhhhhhhhhhhhh
Welcome to my Website!
This is a paragraph! Here's how you make a link: Neocities.
Here's how you can make bold and italic text.
Here's how you can add an image:
Here's how to make a list:
- First thing
- Second thing
- Third thing
To learn more HTML/CSS, check out these tutorials!