*{
   margin: 0;
   /*margin: 10px;*/
   /*margin: 1.5rem;*/
   /*margin: 1.5em;*/
}



#backColor{
   background-color: tan;
}
body{
   background-color: lightblue;
   font-family: Arial, Helvetica, sans-serif;
}
#bcolour{
   background-color: yellow;
}
#idatt{
   background-color: lightblue;
}
.ccolour{
   color: blue;
}
ol{
   list-style-type: decimal-leading-zero;
}
ul{
   list-style-type: square;
}
.loremp{
   font-family: "Times New Roman", Times, serif;
}
/*#lorem{*/
/*   color: red;*/
/*}*/
/*h3.loremp{*/
/*   color: red;*/
/*}*/
/*section>h3{*/
/*   color: red;*/
/*}*/
section>h3+p+p,section>h3+p{
   background-color: pink;
}
section p:hover{
   background-color: yellow;
}
#loremSection>h3:first-letter{
   font-size: 150%;
   color: purple;
}
/*[href]{*/
/*   background-color: lightblue;*/
/*}*/
[href="https://www.w3schools.com"]{
   background-color: lightblue;
}
[href^=".."]{
   border: 4px dotted red;
}
[href$="wk02.html"]{
   background-color: white;
}
li>ul>li:first-child{
   color: red;
}
li>ul>li:last-child{
   color: green;
}
li>ul>li:nth-child(2){
   color: orange;
}
li>ul>li:nth-child(3){
   color: yellow;
}
/**************************************************/
header, footer, main{
   border: dotted white 4px;
   margin: 0 1.5em;
   padding: 2em;
}
body{
   background-image: url("../img/ahmed-abbas-dPrVq_7xbm8-unsplash.jpg");
}
#wrapper{
   background-color: rgba(47, 42, 35, 0.85);
   color: tan;
}
h1{
   font-size: 450%;
   text-shadow: 6px 6px 8px black;
}
h2,h3,h4,h5,h6{
   color: purple;
}
#loremSection>h3{
   color: red;
}
.buttons{
   color: tan;
   text-decoration: none;
   border: 4px solid purple;
   padding: 10px;
   margin: .5em;
   border-radius: 30px;
   background-image: linear-gradient(to bottom,rebeccapurple, violet);
   box-shadow: 4px 4px 8px black;
}
nav{
   text-align: center;
   position: sticky;
   top: 18px;
   z-index: 1;
}
header p{
   font-size: 10px;
}
header{
   height: 100vh;
   text-align: center;
   position: relative;
}
header>section{
   border: 6px solid saddlebrown;
   position: relative;
   width: fit-content;
   top: 30%;
   left: 10%;
   background-image: linear-gradient(to bottom, tan, saddlebrown);
   padding: 2em;
   border-radius: 40px 0;
   box-shadow: 8px 8px 10px black;
}
header>img{
   position: absolute;
   bottom: 100px;
   right: 10px;
}
footer,#listSection,#linkSection,#loremSection,#imageSection{
   height: 100vh;
   padding-top: 3em;
}
#infoSection{
   padding-top: 3.5em;
   height: 100vh;
}

#linkSection p, #linkSection h3,#linkSection a{
   margin: 1em;
}