.font { /*CODE FOR FONT*/
	font: 400 15px/1.8 "Lato", sans-serif;
	color: #777;
}
.box {  /*CODE FOR GREEN BLUE GRADIENT BOX*/
	padding: 2%;
	background-image: linear-gradient(to bottom right, rgba(0,243,91,255), rgba(11,115,230,255));
}
.aboutbox {  /*CODE FOR PINK TO ORANGE GRADIENT BACKGROUND ON ABOUT PAGE*/
	padding: 2%;
	background-image: linear-gradient(to bottom right, rgba(223,36,117,255), rgba(247,81,49,255));
}
.historybox {  /*CODE FOR PINK TO ORANGE GRADIENT BACKGROUND ON ABOUT PAGE*/
	padding: 2%;
	background-image: linear-gradient(to bottom right, rgba(247,227,67,255), rgba(234,46,46,255));
}
.letterbox {  /*CODE FOR GRADIENT BACKGROUND ON PAGE*/
	padding: 2%;
	background-image: linear-gradient(to bottom right, rgba(0,243,91,255), rgba(11,115,230,255));
}
.contactbox {  /*CODE FOR GRADIENT BACKGROUND ON PAGE*/
	padding: 2%;
	background-image: linear-gradient(to bottom right, rgba(226,0,255,255), rgba(126,2,250,255));
}
.box2 { /*BOX THAT IS INSIDE OF THE GREEN BLUE BOX*/
	display: flex;
	align-items: center;
	justify-content: center;
}
.boxtitle { /*BOX FOR TITLE TEXT*/
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 55px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
	font-weight: 1000;
    text-shadow: 4px 4px 0px #eb451b, 7px 7px 0px #efa042, 10px 10px 0px #017e7f, 13px 13px 0px #00008B, 16px 16px 0px #EB5406; 
}
.subboxtitle { /*BOX FOR SMALLER ON ALT PLAGES TITLE TEXT*/
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 45px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
	font-weight: bold;
	text-shadow: 6px 6px 0px #000000;
}
.formtitletext { /*TITLE OF FORM TEXT*/
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
	letter-spacing: 3px;
	color: white;
	text-align: center;
	font-weight: bold;
}
.titletext { /*TEXT THAT IS UNDER TITLE*/
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 25px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
}
.smalltitletext { /*THE NORMAL TEXT THAT IS USED IN THE SITE*/
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
	width: 75%;
	margin-left: auto;
	margin-right: auto;
	font-weight: bold;
}
.normtext { /*THE NORMAL TEXT THAT IS USED IN THE SITE*/
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
	width: 75%;
	margin-left: auto;
	margin-right: auto;
}
.imgcenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 50%;
	height: auto;
	border: 2px solid #D4D4D4
}
.GTAimgcenter { /*CODE FOR THE GTA 5 IMAGE TO FIT CORRECTLY*/
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 85%;
	height: auto;
	border: 2px solid #D4D4D4
}
.button { /*CODE FOR THE BUTTONS STARTS HERE*/
	border: none;
	color: white;
	padding: 5px 28px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	transition-duration: 0.4s;
	cursor: pointer;
}
.button1 {
	border-radius: 10px;
	background-color: white; 
	color: black; 
	border: 2px solid #555555;
}
.button1:hover {
	background-image: linear-gradient(to bottom right, rgba(223,36,117,255), rgba(247,81,49,255));
	color: white;
}
.button2 {
	border-radius: 10px;
	background-color: white; 
	color: black; 
	border: 2px solid #555555;
}
.button2:hover {
	background-image: linear-gradient(to bottom right, rgba(247,227,67,255), rgba(234,46,46,255));
	color: white;
}
.button3 {
	border-radius: 10px;
	background-color: white; 
	color: black; 
	border: 2px solid #555555;
}
.button3:hover {
	background-image: linear-gradient(to bottom right, rgba(0,243,91,255), rgba(11,115,230,255));
	color: white;
}
.button4 {
	border-radius: 10px;
	background-color: white;
	color: black;
	border: 2px solid #555555;
}
.button4:hover {
	background-image: linear-gradient(to bottom right, rgba(226,0,255,255), rgba(126,2,250,255));
	color: white;
	} /*CODE FOR THE BUTTONS ENDS HERE*/
	
.button5 {
	border-radius: 10px;
	background-color: white;
	color: black;
	border: 2px solid #555555;
}
.button5:hover {
	background-color:#FF7377;
	color: white;
} /*CODE FOR THE BUTTONS ENDS HERE*/
	
.button6 {
	border-radius: 10px;
	background-color: white;
	color: black;
	border: 2px solid #555555;
}
.button6:hover {
	background-color:#FFD580;
	color: white;
} /*CODE FOR THE BUTTONS ENDS HERE*/
	
.button7 {
	border-radius: 10px;
	background-color: white;
	color: black;
	border: 2px solid #555555;
}
.button7:hover {
	background-color:lightgreen;
	color: white;
} /*CODE FOR THE BUTTONS ENDS HERE*/
	
.arrow { /*CSS/KEYFRAMES CODE FOR ARROW*/
	position: relative;
	bottom: -2rem;
	left: 50%;
	margin-left:-20px;
	width: 40px;
	height: 40px;
	background-image: url(https://icons.veryicon.com/png/o/internet--web/prejudice/down-arrow-5.png);
	background-size: contain;
}

.bounce {
	animation: bounce 2s infinite;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
} /*END OF THE CSS CODE FOR THE BOUNCING ARROW*/

table, td, th { /*FOR TABLE ON ABOUT PAGE*/
	border: 1.5px solid black;
}

table { /*FOR TABLE*/
	width: 100%;
	border-collapse: collapse;
}
li {
	display: inline;
}
.sample { /*TO LIMIT THE SIZE OF THE NEWS LETTER SAMPLE*/
	max-width: 500px;
	max-height: auto;
}
.logoimages { /*FOR THE LOGO IMAGES ON NEWS LETTER PAGE*/
	max-width: 600px;
	max-height: auto;
}
@media screen and (min-width: 1700px) { /*MEDIA QUERIE #1 TO DISABLE BOUNCING ARROW IF USER IS ON COMPUTER IN FULL SCREEN*/
  .arrow {visibility: hidden;}
}
@media screen and (max-width: 1000px) { /*MAKES SHADOWS DISSAPEAR FROM SUB TITLE TEXT WHEN ON TABLETS OR PHONES.*/
.subboxtitle { 
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 45px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
	font-weight: bold;
	text-shadow: none;
}
}

/*CODE FOR PRINT STYLE SHEET*/
@media print {
.boxtitle { 
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 55px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
	font-weight: 1000;
    text-shadow: none;
}
.normtext { 
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}
.subboxtitle {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 35px;
	letter-spacing: 3px;
	color: #fff;
	text-align: center;
	font-weight: bold;
	text-shadow: none;
}
}