/* 
     RRRRRR    EEEEEEE  BBBBBB   EEEEEEE   CCCCCC,       AA                    CCCCCC,
     RR   RR   EE       BB   BB  EE       CCC   C       AAAA                  CCC   C
     RR  RR    EE       BB  BB   EE      CC            AA  AA       WITH     CC
     RRRRRR    EEEE     BBBBBB   EEEE    CC           AAAAAAAA               CC
     RR  RR    EE       BB  BB   EE      CC          AA      AA      ONE     CC
     RR   RR   EE       BB   BB  EE       CCC   C,  AA        AA              CCC   C,
     RR    RR  EEEEEEE  BBBBB    EEEEEEE   CCCCCC  AA          AA              CCCCCC

      ^'^
                    ^'^                                        ^'^
                                                 ^'^                                      ^'^
      //`                                                                    /          
     ///``      /      //`         /                    ``                 ///```         
    //////``   //``  /////``      ///`    //`        ////```     //`     /////```    /`  
 ///////////`/////``///////``   //////`` ///``    //////////```  ////`   ///////```` //``  /
////////////``/////``///////``/////////`///////``///////////````//////``/////////````///````/
/////////////````///////////```/////////`////````////////////````////````/////////````///````
////////////////``````////`````````/////`////`````/////````````````/``````/////////````////``
=============================================================================================
~~~~~~~~~~~~~~ * ~~~~~~~~~~~~~~~~~ * ***** *** ~~~~~~~~ * ~~~~~~~~~~~~~~~~ *** ~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~ * ~~~~~ ********** ~~~~ * ~~ * ~~~~~~~~~~~ * ~~~ WEB ~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~***************** ~~~~~~~~~~~~~~~~~~~~~~~~ PAGE ~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~************ **** ~~~~~~~~~~~~~~~~~~~~~ & ~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~~~ * ~~~~~~ ** **************** ** ~~~~~ * * ~~~~~~~~~ SEA ~~ * ~~~~~~~
~~~~~~~~~~~~~~~~~~~ * ~~~~~~~~ *************************** ~~~~~~~~~~ * * ~~~~~~~ CREATED ~~~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~ ************************ ** * ~~~~~~~~~~~~~~~~ BY ~~~~~~~~
~~~~~~~~~~~~~~ * ~~~~~~~ ************************************** ~~~~~~~~~~~~~~~~~ REBECA ~~~~
~~~~~~~~~~~~~~~~~~~********** ******************** ******************** ~~~~~~~~~~~~~~~~~~~~~
*/
* {
	margin: 0;
	padding: 0;
	text-decoration: none;
	font-family: "Helvetica";
	font-size: 12pt;
}

body#canvas {
	width: 100vw;
	height: 100vh;
}
	header {
		position: fixed;
		width: 100%;
		height: 6%;
	}
		a {
			float: left;
			margin-top: 3%;
			margin-left: 2%;
			color: #B10F2E;
		}
			section{
				width: 100%;
			}

				main {
					display: inline-block;
					margin-top: 12%;
				}
					h1 {
						text-align: center;
						margin-bottom: 2%;
						color: white;
						font-size: 2em;
					}
					figure {
						display: block;
					}
						img {
							display: block;
							margin-left: auto;
							margin-right: auto;
							margin-bottom: 10%;
						}
							footer {
								position: fixed;
								bottom: 0;
								width: 100%;
								height: 6%;
							}
								h6 {
									text-align: center;
									margin-top: 3%;
									color: #B10F2E;
								}
img {
	max-width: 100%;
}

/* mobile display */
@media screen and (max-width: 479px) {
	body {
		width: 375px;
		height: 627px;
	}
}

/* phablet display */
@media screen and (min-width: 480px) and (max-width: 767px) {
	body {
		width: 480px;
		height: 768px;
	}
}

/* tablet display */
@media screen and (min-width:  768px) and (max-width: 1365px) {
	body {
		width: 768px;
		height: 1024px;
	}
	header {
		height: 8%;
	}
	 a {
	 	font-size: 24pt;
	 }
	#mobile {
		display: inline-block;
		margin: 1.4vw;
	}
	#tablet {
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 86%;
	}
}

/* laptop display */
@media screen and (min-width: 1366px) and (max-width: 1919px) {
	body {
		width: 1366px;
		height: 768px;
	}
	header {
		height: 10%;
	}
	main {
		margin-top: 7%;
	}
	 a {
	 	font-size: 24pt;
	 	margin-top: 1.6%;
	 }
	#mobile {
		display: inline-block;
		margin: 3.3vw;
	}
	#tablet {
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 86%;
	}
	footer {
		height: 12%;
	}
}

/* desktop or television display */
@media screen and (min-width: 1920px) {
	body {
		width: 1920px;
		height: 1080px;
	}
	header {
		height: 12.5%;
	}
	main {
		margin-top: 7%;
	}
	a {
		margin-top: 2%;
		font-size: 36pt;
	}
	#mobile {
		display: inline-block;
		margin: 7.8vw;
		margin-top: 2%;
	}
	#tablet {
		display: inline-block;
		margin: 6.1vw;
	}
	footer {
		height: 12%;
	}
}

/* CSS COLOR CLASSES */

.blackt {
	background-color: #000000BF;
}
.black {
	background-color: black;
}
.red {
	background-color: #B10F2E;
}