*
{
padding: 0px;
margin: 0px;
display: block;
}
header
{
position: absolute;
top: 0px;
text-align: center;
width: 100%;
height: 13.45%;
background-color: blue;
}
body
{
width: 100%;
height: 100%;
background-image: url("cityImg.jpg");
background-position: 0% 0%;
background-size: cover;
}
section
{
position: relative;
margin-top: 11%;
float: left;
width: 30%;
}
section.leftSide p
{
text-indent: 10%;
margin-left: 10%;
font-size: 1.5em;
width: 75%;
text-align: left;
color: rgb(00, 00, 80);
}
section.leftSide p:nth-child(1)
{
color: red;
}
section.leftSide p:nth-child(2)
{
color: black;
}
section.leftSide p:nth-child(3)
{
color: blue;
}
div.center
{
position: relative;
margin-top: 10%;
margin-left: 3%;
float: left;
width: 30%;
}
aside
{
position: relative;
margin-top: 12%;
float: right;
width: 25%;
}
aside li
{
list-style: none;
margin-top: 2%;
margin-bottom: 2%;
}
aside a
{
text-decoration: none;
color: rgb(00, 00, 80);
}
aside a:hover
{
background-color: pink;
}
/* Two Column layout for the introductory paragraph */
section.leftSide p
{
-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;
-moz-column-gap: 20px;
-webkit-column-gap: 20px;
column-gap: 20px;
-moz-column-rule: 1px solid black;
-webkit-column-rule: 2px solid black;
column-rule: 2px solid black;
}
.vanishingDiv
{
display: block;
visibility: hidden;
}
.visibleDiv
{
visibility: visible;
}
.scrollable
{
width: 3000px;
}