html {
  height: 100%;
}
body {
  height: 100%;
}
/* HEADER PART */
#headerprinc {
  height: 100%;
}

#RL{
  position: fixed;
  left: 40%;
  top: 1%;
  height:20%;
  width: 30%;
  margin: 0;
  z-index: 1;
}
#headerwp {
 position:fixed;
 height: 25%;
 width: 100%;
 left: 0px;
 top: 0px;
 z-index: -1;
}

#clickbait{
  position: fixed;
  height: 100px;
  width: 100px;
  right: 3%;
  top: -1%;
}
/* ASIDE PART*/
 aside {
  position: fixed;
  height: 100%;
  width: 15%;
  top:25%;
  left: 0;
  background:-moz-linear-gradient(left, #1e5799 0%, #000000 0%, #141414 50%, #111111 100%);
}

#Ah1 {
  text-align: center;
  font-family: "impact";
  color: white;
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
  text-decoration: underline;
  text-decoration-color: #000;
}
 ul{
   font-family: "Sweet";
   font-size: 30px;
   list-style: none;
 }
 #ul1 a:hover{
   background-color: black;
   color: #FFF;
 }

#li1 {
  background: url(images/ball.png);
  background-repeat: no-repeat;
  background-size: 30px 30px;
  padding-bottom: 20px;
  padding-left: 35px;
}
#li2 {
  background: url(images/cc3.png);
  background-repeat: no-repeat;
  background-size: 30px 30px;
  padding-bottom: 20px;
  padding-left: 35px;
}
#li3 {
  background: url(images/GrandChampion.png);
  background-repeat: no-repeat;
  background-size: 30px 30px;
  padding-bottom: 20px;
  padding-left: 35px;
}
#li4 {
  background: url(images/arc.png);
  background-repeat: no-repeat;
  background-size: 30px 30px;
  padding-bottom: 20px;
  padding-left: 35px;
}
#ul2 {
  display: none;
}

#li4:target {
  display: block;
}
/* SECTION PART */
  /*HEADER SECTION PART */

section {
  font-family: "Amaranth";
}
#section1 {
  position: absolute;
  left: 15%;
  top: 25%;
  z-index: -3;
  background-image: -moz-linear-gradient(left, #1e5799 0%, #2989d8 50%, #1e5799 100%);
  background-size: cover;
}
#Overview {
  text-align: center;
  font-family: "impact";
  color: white;
  font-size: 50px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
  text-decoration: underline;
  text-decoration-color: #000;
  margin-top: 0;
  padding-top: 25px;
}
#Overview2 {
  text-align: center;
  color: white;
  font-size: 50px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
  /*ARTICLE SECTION PART */

#pOverview {
  text-align: center;
  font-size: 25px;
}
#feat {
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 50px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
  text-decoration: underline;
  text-decoration-color: #000;
}
#pfeat {
  text-align: center;
  font-size: 25px;
}
#Ranked {
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 50px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
  text-decoration: underline;
  text-decoration-color: #000;
}
#SpanRankedDivisions {
    position:absolute;
}
#S3{
  height: 80%;
  width: 50%;
  padding-left: 20px;
}
#S4 {
  height: 50%;
  width: 40%;
  padding-left: 20px;
}
#Arenas {
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 50px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
  text-decoration: underline;
  text-decoration-color: #000;
}
#spanDFH h1{
  display: block;
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanDFH img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanUrban h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanUrban img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanMann h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanMann img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanBeck h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanBeck img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanUtopia h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanUtopia img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanWaste h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanWaste img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanDunk h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanDunk img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanNeoT h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanNeoT img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanAqua h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanAqua img{
  position: relative;
  height: 80%;
  width: 80%;
  left: 10%;
}
#spanARC h1{
  text-align: center;
  color: white;
  font-family: "impact";
  font-size: 35px;
  -webkit-text-stroke-color: #000;
  -webkit-text-stroke-width: 3px;
}
#spanARC img{
  position: relative;
  height: 80%;
  width: 80%;
  left:10%;
  padding-bottom: 20px;
}
/* FOOTER PART*/
#footer1 {
  bottom: 0;
  background-color: black;
  z-index: -2;
}
#pfooter1 {
  text-align: right;
  color: #FFF;
  font-size: 25px;
  margin-bottom: 0;
  margin-top: 0;
  padding-bottom: 30px;
  padding-top: 30px;
  padding-right: 10px;
}
/*Fonts PART*/
@font-face {
  font-family: "Amaranth";
src: url('fonts/ama.ttf');
}
@font-face {
  font-family: "Sweet";
  src:url('fonts/Sweet.ttf');
}
