/* For id use # in css file example
HTML
 <h1 id="color_blue">

 CSS
#color_blue{
    background: #000000;
} 

For a class:
Html
<div class="main">
    Welcome
</div>

CSS
.main {
    background: #000;
}

*/
body,html{
    height:100%;
    width:100%;
}
body{
    background: #000000;
    /*background: linear-gradient(#000000, #3d3b3b);*/
    /*background: -webkit-linear-gradient(270deg, #000000, #3d3b3b);*/
    
    /*#434343*/
    /*background: linear-gradient(217deg, rgba(34, 34, 34, 0.8), rgba(255,0,0,0) 70.71%),
                linear-gradient(127deg, rgba(10, 10, 10, 0.8), rgba(0,250,0,0) 70.71%),
                linear-gradient(336deg, rgba(8, 8, 8, 0.8), rgba(0,0,250,0) 70.71%);*/
    /* background: linear-gradient(90deg,#3d3d3d, #000000); */
    /* 0deg, 180deg, 270deg, 90deg*/
}

#grad1{
    background: #dfdf4c;
    background: linear-gradient(#ebe7e7, #f9f999);
/*background: linear-gradient(#f70707, #0606f4); */
}
#grad2{
    background: #f9f999;
}
#grad_black{
    height: 100px;
    background: linear-gradient(#c28787, #282222);
}

#intro{
    /*height: 250px;*/
    padding: 5px 15px;
    background: #DC3545;
    /*dfdf4c*/

}
#yellowshade{
    background: #f9f999;

}
.card { height: 100%; 
}


/* Text formating for Math Quote page: Drama (TextA), Emotion(TextB), Conflict(TextC), The Climax(TextD) */

/*Drama */
.textA {
    font-size: 40px;
    font-family: Brush Script;
  }

 /*Emotion */ 
  .textB {
    font-size: 40px;
    font-family: Cursive;
  }

  /*Conflict*/
  .textC {
    font-size: 40px;
    font-family: Optima;
  }

/*The Climax*/
  .textD {
    font-size: 40px;
    font-family: impact;
  }

  /*Have Math*/
  .textE {
    font-size: 40px;
    font-family: Times New Roman;
  }