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

body {
    font-family: 'Open Sans' , sans-serif;
    background-color: hsl(200, 100%, 30%);
}

h1 {
    color: rgb(0, 0, 0);
    height: 300px;
    line-height: 280px;
    text-align: left;
    padding: 80px 16px 110px 16px; /*top right bottom left*/
    margin: 16px 0px;
    text-indent: 6vw;

    /*background image declarations*/
    background-image: url(../mountains1.jpg);
    background-size: cover; 
    background-position: 80% 80%;
}

h1 > span {
    background-color: hsla(200, 100%, 100%, .6);
    display: block; /* make this inline span behave like a block */
    padding-top: 4px;
    padding-bottom: 4px;
    text-shadow: 0px 0px 4px whitesmoke
}

section:nth-child(1) {
    border: 4px solid orange;
    margin: 10px;
    min-height: 200px;
}

div.mainlink {
    border: 4px solid pink;
    width: 60px; height: 60px;
    border-radius: 50%;
    margin: 50px auto;

}


div.mainlink a {
    background-color: lightgray;
    display: block;
    width: 100%; height: 100%;
    border-radius: 50%;
    transition: all .7s;
}

div.mainlink > img {
    display: block;
    width: 100%; height: 100%;
    margin: 0 auto;
    padding: top 8px;
}

div.mainlink a:hover {
    background-color: #ff9;
    border: 4px solid #567;
    outline: 4px solid red;
    border-radius: 50%;
}

section:nth-child(2) {
    border: 4px solid orange;
    margin: 10px;
    min-height: 500px;
    background-image: url(../snow.jpg);
    background repeat
}