* { margin: 0; padding: 0; font-family: "Open Sans", Arial, "Helvetica Neue", Helvetica, sans-serif; box-sizing: border-box; overflow: auto; }


a { text-decoration: none; }
h1, h2, h3, h4, h5 { text-transform: uppercase; font-weight: normal; }
h2 { margin-bottom: 15px; font-size: 60px; text-shadow: 1px 1px 1px #aaa }
h3 { margin-bottom: 15px; font-size: 40px; text-shadow: 1px 1px 1px #aaa }
h4 { margin-bottom: 15px; font-size: 30px; text-shadow: 1px 1px 1px #aaa }
h5 { margin-bottom: 15px; font-size: 20px; text-shadow: 1px 1px 1px #aaa }
p { margin-bottom: 15px; line-height: 150%; }
q { font-style: italic; }

.center { text-align: center; }
.right { text-align: right; }
.dark { background: #333; color: white; }
.darker { background: #000; color: white; }
.wrapper { width: 100%; }
.container { width: 80%; margin: 0 auto;  }
section { margin-bottom: 50px; }


.stickymenu a { background: #000; color: white; padding: 10px; display: inline-block; }
nav { display: none; z-index: 100}
nav ul { list-style: none; margin: 0; padding: 0; background: #000; }
nav ul li { margin: 0 0 5px 0 }


.col-100 { width: 100%; float: left; }
.col-50 { width: 50%; float: left; }
.col-75 { width: 65%; float: left; }
.col-33 { width: 33.33%; float: left; }
.col-25 { width: 35%; float: left; }
.content { padding: 30px; }
.content img { width: 100%; }
.conditions ul { margin: 0 0 20px 10px; }
.conditions ul li { list-style-type: disc; margin: 0 0 10px 20px; overflow: visible }
.content table { width: 100%; border-collapse: collapse; margin-bottom: 20px;}
.content table td, .content table th { border-bottom: 1px solid #999; padding: 5px; }


header { background: #333; text-transform: uppercase; z-index: 1; position: relative;  }
header .logo { color: white; text-align: center; }
header .logo h1 { margin: 0; padding: 0; }
header .logo h1 a { color: white; font-size: 36px; margin: 0 0 30px 0; display: inline-block; font-weight: normal; letter-spacing: 2px }
header .logo h1 a img { height: 30px; }

header .links { position: absolute; right: 0; top: 0; }
header .links a { margin: 0; padding: 5px 10px; color: white; background: #666; display: inline-block; }
header .links a.imp { background: red; }

.slider img { width: 100%; }
.why-stay-with-us { background: #333; background-image: linear-gradient(#333, #fff, #fff)}
.why-stay-with-us h2 { color: white; margin-top: 10px; }
.why-stay-with-us .card { width: 29.3%; margin: 0 2%; background: white; float: left; border: 1px solid black; padding: 10px; }
.why-stay-with-us .card i { font-size: 50px; }

.photogrid-container { width: 100%; background: #eee; padding: 20px 0; }
.photogrid-container .row { border: 1px dashed #aaa; width: 100%;  }
.photogrid { width: 90%; margin: 0 auto; }
.photogrid .box { width: 33.33%; float: left; }
.photogrid .box img { width: 100%; }
.photogrid .dashed { }

.gallerygrid { width: 70%; margin: 0 auto; }
.gallerygrid img { width: 30%; margin: 1%; border: 10px solid white; box-shadow: 1px 1px 1px #aaa; float: left; }
.gallerypage { background: #555; color: white; }

.contact-us { background: #333; color: white; margin-top: 10px; }
.contact-us a { color: #aaa; }
.contact-us a:hover { color: #fff; }

#social img { width: 64px; }
#social .center img:first-of-type { margin-right: 30px; }

footer { background: #333; }
footer h5 { text-shadow: none !important }

@media screen and (max-width: 800px) {
	h2 { margin-bottom: 15px; font-size: 40px; text-shadow: 1px 1px 1px #aaa }
	h3 { margin-bottom: 15px; font-size: 30px; text-shadow: 1px 1px 1px #aaa }
	h4 { margin-bottom: 15px; font-size: 24px; text-shadow: 1px 1px 1px #aaa }
	h5 { margin-bottom: 15px; font-size: 14px; text-shadow: 1px 1px 1px #aaa }

	.newline::after { content: "\A", white-space: pre; }

	.content { padding: 10px 20px; }

	.col-50 { width: 100%; float: left; }
	.col-75 { width: 100%; float: left; }
	.col-33 { width: 100%; float: left; }
	.col-25 { width: 100%; float: left; }

	.photogrid .box { width: 100%; float: left; }

	.gallerygrid { width: 100%; margin: 0 auto; }
	.gallerygrid img { border: 5px solid white; }


	footer .content, footer .right { text-align: center; }
	footer h5 { text-shadow: none !important }

	.hideonmob { display: none; }
}