/* body section start */
body {
  background-color: rgb(16, 51, 111);
  color: rgb(255, 255, 255);
}

/* body section end */


/* title section start */
.title {
  font-size: 8rem;
}

/* title section end */


/* subtitle section start */
.subtitle {
  font-size: 4rem;
}
/* subtitle section end */

/* p section end */
p {
  color: rgb(255, 255, 255);
  ;font-size: 1.2rem;
}


/* p section end */


/* heading section strart */
h1 {
  color: rgb(255, 255, 255);
}

h2 {
  color: rgb(0, 119, 255);
}
/* heading section end */


/* image section start */
img {
  max-width: 100%;
  height: auto;
  display: block;
  width: 300px;
}

/* image section end */

/* parent container srtart */
.parent {
  background-color: rgb(31, 80, 171);
  padding: 20px;
}
/* parent container end */

/* flex section start */
.flex-end-parent {
  display: flex;
  justify-content: flex-end;
  background-color: rgb(101, 149, 204);
  padding: 20px;
}
/* flex section end */

/* row reverse parent start */
.flex-row-reverse img { 
  display: flex;
  float: left;
}
/* row reverse parent end */


/* column section start */
.column-parent {
  background-color: rgba(200, 86, 33, 0.481);
  display: flex;
  justify-content: flex-end;
  padding: 20px;
  flex-direction: column;
}

/* column section end */

/* space around-parent start */
.space-around-parent {
  background-color: rgba(73, 131, 255, 0.481);
  display: flex;
  justify-content: space-around;
}

/* space around-parent end */


/* center section start */
.center-parent {
  background-color: rgb(23, 25, 102);
  padding: 20px;
  text-align: center;
}

/* center section end */

/* space section start */
.space-evenly-parent {
  background-color: rgb(21, 95, 159);
}

/* space section end */

/* center image start */
.center-parent img {
  margin: 20px auto;
}
/* center image end */

/* evenly image start */
.space-evenly-parent img {
  margin: 20px auto;
}
/* evenly image end */



/* reverse column start */
.column-evense-parent {
  display: flex;
  flex-direction: column-reverse;
  padding: 20px;
}

/* reverse column end */


/* div start */
div div {
  background-color: rgb(0, 0, 0);
}

/* div end */


/* spacing start */
div,
ul {
  margin: .5rem;
  padding: .5rem;
}

/* spacing end */

/* media section start */
@media (max-width: 768px) { 

  body {
    color: rgb(254, 254, 254);
  }

  h1 {
    color: rgb(255, 188, 54);
  }

  .parent {
    background-color: rgb(255, 132, 0);
  }

  .center-parent {
    background-color: rgb(79, 82, 181);
  }

  .flex-row-reverse {
  background-color: rgb(194, 194, 202);
  }

  .reverse-parent {
    background-color: rgb(184, 10, 10);
  }

  .flex-end-parent {
    background-color: rgb(28, 117, 111);
  }

  .space-evenly-parent {
    background-color: rgb(77, 64, 192);
  }

  .column-parent {
    background-color: rgb(228, 172, 18);
  }

  .space-around-parent {
    background-color: rgb(159, 18, 18);
  }
} 
/* media section end */

/* media landscape section start */

@media (orientation: landscape) {

 body {
    color: rgb(254, 254, 254);
  }

  h1 {
    color: rgb(255, 188, 54);
  }

  .parent {
    background-color: rgb(255, 132, 0);
  }

  .center-parent {
    background-color: rgb(79, 82, 181);
  }

  .flex-row-reverse {
  background-color: rgb(194, 194, 202);
  }

  .reverse-parent {
    background-color: rgb(184, 10, 10);
  }

  .flex-end-parent {
    background-color: rgb(28, 117, 111);
  }

  .space-evenly-parent {
    background-color: rgb(77, 64, 192);
  }

  .column-parent {
    background-color: rgb(228, 172, 18);
  }

  .space-around-parent {
    background-color: rgb(159, 18, 18);
  }
}
/* media landscape section end */

/* media portrait section start */
@media (portrait) {
  p {
  color: rgb(255, 255, 255);
  ;font-size: xx-large
  /* media portrait section end */

}
}