*{
	font-family: 'Raleway', sanserif;
	margin: 0px;
}

body{
	margin: 0;
	/*width: 800px;
	margin: 0 auto;*/
}

h1{
	margin: 0px;
}

h2{
	margin: 0;
}

#bodyarea{
	padding-top: 20px;
	padding-bottom: 10px;
	text-align: center;
	max-width: 800px;
	margin: 0 auto;
}


p{
	padding: 15px;
	margin: 0px;
}

/*HEADER*/

header{
	text-align: center;
	background-color: #FFCC00;
	color: black;
}

header>div{
	width: 80%;
	max-width: 800px;
	margin: 0 auto;
	display: flex;
}

.headerimg>img{
	height: 150px
}

.headertext{
	width: 65%;
	text-align: right;
}

.headertext>h1{
	font-size: 450%;
}

.headertext>h2{
	font-size: 200%;
}

.headerimg{
	width: 30%
}

.headercontact{
	max-width: 800px;
	display: inline-block;
	text-align: center;
	padding-bottom: 10px;
}

.headercontact>p{
	padding-top: 10px;
}

.headercontact p{
	padding: 0px;
}

.special {
	background-color: #e306f2;
	color: black;
	text-align: center;
	padding: 20px;
}


#navigation{
    background: #333;
}

/* Add a black background color to the top navigation */
.topnav {
    overflow: hidden;
    margin: 0 auto;
    max-width: 800px;
    text-align: center;
}

/* Style the links inside the navigation bar */
.topnav a {
    display: inline-block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #ddd;
    color: black;
}

/* Add a color to the active/current link */
.topnav a.active {
    background-color: #4CAF50;
    color: white;
}

/*INDEX PAGE*/

.indeximage{
	display: inline-flex;
	margin: 0 auto;
	max-width: 750px;
	padding-top: 10px;
}

.indeximage>img{
	width: 50%;
	height: 50%;
}

.mobileindeximage{
	display: none;
}

/*PRICES PAGE*/

.pricestable{
	width: 80%;
	margin: 0 auto;
	border-collapse: collapse;
}

.pricestable th, .pricestable td{
	border-bottom: 1px solid black;
	padding: 10px;
}

.pricestable tr:nth-child(even){
	background-color: #f2f2f2;
}

.pricestable th{
	background-color: #696969;
	color: white;
}

.pricesoffers{
	padding: 10px;
}

.giftcard{
	margin: 0 auto;
	width: 100%;
	display: inline-flex;
}

.giftcardleft{
	width: 30%;
}

.giftcardleft>img{
	width: 100%;
	height: 100%;
	transform: rotate(90deg);
}

.giftcardright{
	width: 100%;
}

/*FIND US*/

.findusimg{
	margin: 0 auto;
	display: block;
	width: 60%;
	height: 60%;
}

/*FOOTER*/

footer{
	width: 100%;
	background-color: #333;
	color: white;
	margin: 0;
}

footer>div{
	width: 80%;
	max-width: 800px;
	margin: 0 auto;
	display: flex;
	padding-top: 40px;
	padding-bottom: 20px;
}

.footdiv1{
	width: 33.33%;
	text-align: center;
}

.footertable{
	margin: 0 auto;
}

.footdiv2{
	width: 33.33%;
	text-align: center;
}

.footdiv3{
	width: 33.33%;
	text-align: center;
}

.footdiv2>p{
	padding: 0px;
}

table.footertable{
	border: 0px;
}

.socialmedia{
	padding:20px;
}

/* Style all font awesome icons */
.socialmedia > .fa {
    padding: 20px;
    font-size: 30px;
    width: 30px;
    text-align: center;
    text-decoration: none;
    border-radius: 50%;
}

/* Add a hover effect if you want */
.socialmedia > .fa:hover {
    opacity: 0.7;
}

/* Set a specific color for each brand */

/* Facebook */
.fa-facebook {
    background: #3B5998;
    color: white;
}

/* Instagram */
.fa-instagram {
    background: #4C4C4C;
    color: white;
}

@media only screen and (max-width: 750px) {
	.mobilefooter{display: block; padding-top: 10px;}
	.mobilewidth{width: 100%;}
	.mobilehidden{display: none;}
	.mobileheader{width: 100%;text-align: center;}
	.mobileindeximage{display: inline-block; width: 50%; height: 50%;}
	.indeximage{display: none;}
}
