/* Stylesheet CSS*/

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700;800;900&display=swap');

/* 
font-family: 'Montserrat', sans-serif;

font-family: 'Rubik', sans-serif;


/*-------------
 	General
-------------*/

* {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	font: normal 16px sans-serif;
	color: #555;
	font-family: 'Montserrat', sans-serif;
	background: #fff;
}

ul,
nav {
	list-style: none;
}

a {
	text-decoration: none;
	color: inherit;
	cursor: pointer;
	opacity: 0.9;
}

a:hover {
	opacity: 1;
}

body {
	max-width: 100vw;
}

/* -------------
 	typography
 ------------- */

p {
	color: #555;
	font-family: 'Rubik', sans-serif;
	font-size: 0.9em;
	line-height: 1.2em;
	font-weight: 300;
	letter-spacing: 0.1em;
	/* margin: 1.5em 0; */
}

small {
	font-size: 0.7em;
	line-height: 1.5em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: #444;
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	line-height: 1em;
}

h1 {
	font-size: 2.125em;
}

h2 {
	font-size: 2em;
}

h3 {
	font-size: 1.825em;
}

h4 {
	font-size: 1.5em;
}

h5 {
	font-size: 1.25em;
}

h6 {
	font-size: 1.125em;
}

.redfont {
	font-size: 1em;
	color: #7c1919;
	border: 1px solid #7c1919;
	padding: 1vh;
}

/* *900PX SCREENS AND UP for-tablet-landscape-up*/
@media only screen and (min-width: 56.250em) {

p {
	font-size: 1.1em;
}

	h1 {
		font-size: 2.825em;
	}

	h2 {
		font-size: 2.5em;
	}

	h3 {
		font-size: 2.25em;
	}

	h4 {
		font-size: 2em;
	}

	h5 {
		font-size: 1.5em;
	}

	h6 {
		font-size: 1.25em;
	}

}


/* -------------
	 DESIGN MOBILE FIRST. ALL CSS IS FOR MOBILE SCREENS UP TO 599PX WIDE= 37.4EM
------------- */

/* *600PX SCREENS AND UP for-tablet-portrait-up*/
@media only screen and (min-width: 37.5em) {}

/* *900PX SCREENS AND UP for-tablet-landscape-up*/
@media only screen and (min-width: 56.250em) {}

/* *1200PX SCREENS AND UP for-desktop-up*/
@media only screen and (min-width: 75em) {}

/* *1800PX SCREENS AND UP for-big-desktop-up*/
@media only screen and (min-width: 112.50em) {}

/* -------------
 SITE COLORS
 ------------- */

.brandblack {
	color: #222;
}

.brandwhite {
	color: #f7f7f7;
}

.brandorange {
	color: #ff4000;
}

.brandblue {
	color: #6483af;
}

.brandsalmon {
	color: #faaa8d;
}

.brandblackbg {
	background-color: #222;
}

.brandwhitebg {
	background-color: #f7f7f7;
}

.brandorangebg {
	background-color: #ff4000;
}

.brandbluebg {
	background-color: #6483af;
}

.brandsalmonbg {
	background-color: #faaa8d;
}



/* -------------
 SPACING AND HIDING HACKS
 ------------- */
.desktopOnly{display:none}.mobileOnly{display:inline}@media only screen and (min-width:56.250em){.desktopOnly{display:inline}.mobileOnly{display:none}}@media only screen and (min-width:37.5em){.desktopOnly{display:inline}.mobileOnly{display:none}}.h2{height:2vh}.h5{height:5vh}.h10{height:10vh}.h20{height:20vh}.h30{height:30vh}.h40{height:40vh}.h50{height:50vh}.h60{height:60vh}.h70{height:70vh}.h80{height:80vh}.h90{height:90vh}.w2{width:2vw}.w5{width:5vw}.w10{width:10vw}.w20{width:20vw}.w30{width:30vw}.w40{width:40vw}.w50{width:50vw}.w60{width:60vw}.w70{width:70vw}.w80{width:80vw}.w90{width:90vw}.w100{width:100vw}.pad2{padding:2vh}.pad5{padding:5vh}



hr {
	width: 50vw;
	height: 0.2vh;
	background-color: #f2ddc7;
	border: 0;
	margin: 0 auto;
	margin-bottom: 2vh;
	margin-top: 2vh;
}

.vl {
	width: 0.1vh;
	height: 90%;
	background-color: #f7f7f7;

}

/* -------------
 BUTTONS
 ------------- */
.btn {
	color: #feefdd;
	border-radius: 4px;
	text-transform: uppercase;
	background-color: #ff4000;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 1em;
	font-weight: 600;
	letter-spacing: 0.3rem;
	text-align: center;
	padding: 3vh 6vh;
	border: 0px solid #feefdd;
	cursor: pointer;
	margin: 2vh;
	-webkit-box-shadow: #000;
	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.3);
}

.btn-ghost {
	color: #feefdd;
	border-radius: 4px;
	text-transform: uppercase;
	background-color: rgba(0, 0, 0, 0.3);
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 1em;
	font-weight: 400;
	letter-spacing: 0.3rem;
	text-align: center;
	padding: 3vh 6vh;
	border: 1px solid #feefdd;
	cursor: pointer;
	margin: 2vh;
	-webkit-box-shadow: #000;
	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.3);
	display: flex;
	flex-wrap: wrap;
}

.btn-cta {
	color: #fdfdfd;
	border-radius: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	-ms-border-radius: 0px;
	-o-border-radius: 0px;
	text-transform: uppercase;
	background-color: transparent;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 0.8em;
	font-weight: 300;
	letter-spacing: 0.3rem;
	text-align: center;
	padding: 2vh 6vh;
	border: #fdfdfd 1px solid;
	cursor: pointer;
	margin: 2vh;
	/*-webkit-box-shadow: #000;
	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.3);
	*/

}

.dark-border {
	color: #555;
	border: #555 1px solid;
}

.btn-cta:hover{
	background-color: #6483af;
	color: #fdfdfd;
	border: #fdfdfd 1px solid;
}

.btn-small {
	color: #666;
	text-transform: uppercase;
	background-color: transparent;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 0.6em;
	font-weight: 400;
	letter-spacing: 0.3rem;
	text-align: center;
	padding: 1vh 2vh;
	border: 1px solid #666;
	cursor: pointer;
}

.btn-small:hover{
	background-color: #6483af;
	color: #fdfdfd;
	border: #fdfdfd 1px solid;
}

.deletebtn {
	background-color: #7c1919;
	width: 30vw;
	height: 8vw;
	font-family: 'Open Sans', sans-serif;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	font-size: 0.8em;
	text-transform: uppercase;
	color: #FFF;
	letter-spacing: 2px;
	text-align: center;
	vertical-align: middle;
	line-height: 8vw;
	margin: 1vh;
	-webkit-box-shadow: #000;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);

}

.editbtn {
	background-color: #456990;
	width: 30vw;
	height: 8vw;
	font-family: 'Open Sans', sans-serif;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	font-size: 0.8em;
	text-transform: uppercase;
	color: #FFF;
	letter-spacing: 2px;
	text-align: center;
	vertical-align: middle;
	line-height: 8vw;
	margin: 1vh;
	-webkit-box-shadow: #000;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
}

.ghost {
	color: aliceblue;
	background: transparent;
	border: 1px solid aliceblue;
  }

  .tix {
	color: #000;
	background: rgba(0, 0, 0, 0.9);
	background: rgba(240, 248, 255, 0.5);
	border: 1px solid #000;
	padding: 1vh 2vh;
	font-size: 0.8em;
}

@media only screen and (min-width: 56.250em) {

	.btn-small {
		font-size: 0.8em;
		padding: 1.5vh 3vh;
	
	}

	.deletebtn {
		width: 4vw;
		height: 2vw;
		line-height: 2vw;
	}

	.editbtn {
		width: 4vw;
		height: 2vw;
		line-height: 2vw;
	}

}

/* :::::::::::::::

IMG CLASSES

::::::::::::::: */

img {
	display: block;
	width: 100%;
	height: auto;
	-o-object-fit: cover;
	object-fit: cover;
}

.logo {
	max-width: 90vw;
	height: auto;
}

.logoSmall {
	max-width: 50vw;
	height: auto;
}

.logoAvatar {
	max-width: 40vw;
	height: auto;
}

.socialIcon {
	max-width: 8vw;
	height: auto;
	margin: 2vh;
}

.locationIcon {
	max-width: 4vw;
	height: auto;
	margin: 0 auto;
}

.heroImage {
	max-width: 90vw;
	height: auto;
}


@media only screen and (min-width: 56.250em) {
	.logo {
		max-width: 40vw;
	}

	.logoSmall {
		max-width: 20vw;
	}

	.logoAvatar {
		max-width: 10vw;
	}

	.socialIcon {
		max-width: 2vw;
	}

	.heroImage {
		max-width: 20vw;
	}
	.locationIcon {
		max-width: 1vw;
	}

}

/* :::::::::::::::::::::::::::::::::::::::::::::

L A Y O U T

::::::::::::::::::::::::::::::::::::::::::::: */

/* TO INCLUDE BACKGROUND IMAGE ON PAGE::: */
/* background: url(img/hero.jpg) no-repeat center left fixed;
	background-size: cover; */


/*::::::::::::
 	Header
::::::::::::*/

header {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

header nav li {
	margin: 0;
}

header nav li:first-child {
	margin-left: 0;
}

header nav li:last-child {
	margin-right: 0;
}

/**---- Header ----**/

.header {
	z-index: 9;
	position: fixed;
	top: 0;
	left: 100vw;
	padding-top: 10vh;
	padding-bottom: 4em;
	/* width: 30vw; 5*/
	height: 100%;
	background-color: #fdfdfd;
	/* overflow-y: scroll; */
	text-align: center;
	-webkit-transition: -webkit-transform 900ms ease;
	transition: -webkit-transform 900ms ease;
	transition: transform 900ms ease;
	transition: transform 900ms ease, -webkit-transform 900ms ease;
}

.header nav,
.header ul {
	height: 100%;
	width: 50vw;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: distribute;
	justify-content: space-around;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.header li {
	border-bottom: 0px solid #1f678a;
}

.header a {
	font-weight: 400;
	letter-spacing: 0.3em;
	color: #666;
	display: block;
	padding: 1vh;
	-webkit-transition: background-color 900ms ease-in;
	transition: background-color 900ms ease-in;
	font-size: 1em;
}

.header a:hover {
	color: #f2ddc7;
}

.menu-icon p {
	opacity: 0;
}


@media only screen and (min-width: 56.250em) {

	.header a {
		font-size: 1.2em;
	}

	.menu-icon p {
		font-size: 4em;
		opacity: 1;

	}

	.header nav,
	.header ul {
		width: 30vw;
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::

MENU

::::::::::::::::::::::::::::::::::::::::::::: */

/* TO USE MENU ICON INSTEAD OF WORD "MENU"  PLACE THIS IN mobile-bar-right DIV */

/* <label for="menu-toggle" class="menu-icon">
  <span></span>
</label> */

.menu-icon {
	z-index: 10;
	display: block;
	position: relative;
	width: 25px;
	height: 100%;
	cursor: pointer;
	-webkit-transition: -webkit-transform 900ms ease;
	transition: -webkit-transform 900ms ease;
	transition: transform 900ms ease;
	transition: transform 900ms ease, -webkit-transform 900ms ease;
}

.menu-icon>span {
	display: block;
	position: absolute;
	top: 55%;
	margin-top: -0.3em;
	width: 100%;
	height: 0.15em;
	border-radius: 1px;
	background-color: #cccccc;
	-webkit-transition: -webkit-transform 900ms ease;
	transition: -webkit-transform 900ms ease;
	transition: transform 900ms ease;
	transition: transform 900ms ease, -webkit-transform 900ms ease;
}

.menu-icon>span:before,
.menu-icon>span:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 1px;
	background-color: #e1e1e1;
	-webkit-transition: -webkit-transform 900ms ease;
	transition: -webkit-transform 900ms ease;
	transition: transform 900ms ease;
	transition: transform 900ms ease, -webkit-transform 900ms ease;
}

.menu-icon>span:before {
	-webkit-transform: translateY(-0.6em);
	transform: translateY(-0.6em);
}

.menu-icon>span:after {
	-webkit-transform: translateY(0.6em);
	transform: translateY(0.6em);
}

@media only screen and (min-width: 56.250em) {
	/* .menu-icon {
		display: none;
	} */
}

/**---- Menu Icon Effects ----**/

.menu-toggle:checked+.mobile-bar .menu-icon {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.menu-toggle:checked+.mobile-bar span:before,
.menu-toggle:checked+.mobile-bar span:after {
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}

/**---- Off-Canvas Effect ----**/
/* CHANGE THE WIDTH OF THE SLIDE IN NAVIGATION
EG:  -100% AND 100% IS FULL PAGE */

.menu-toggle:checked~.header {
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
	-webkit-transform: translate3d(-100%, 0, 0);
	transform: translate3d(-100%, 0, 0);
}

.menu-toggle:checked~.container {
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
	-webkit-transform: translate3d(100%, 0, 0);
	transform: translate3d(100%, 0, 0);
}

.menu-toggle:checked~.dropdown-menu {
	-webkit-transform: translateY(50vh);
	transform: translateY(50vh);
}

.menu-toggle:checked~.pagedrop {
	-webkit-transform: translateY(50vh);
	transform: translateY(50vh);
}

@media only screen and (min-width: 56.250em) {
	.menu-toggle:checked~.header {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
	}

	.menu-toggle:checked~.container {
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
	}
}

/**---- Top Down Effect ----**/

.dropdown-menu {
	position: fixed;
	top: -50vh;
	left: 0;
	padding-top: 10vh;
	padding-bottom: 4em;
	/* width: 30vw; */
	height: 50vh;
	background-color: rgba(0, 0, 0, 0.2);
	/* overflow-y: scroll; */
	text-align: center;
	-webkit-transition: -webkit-transform 900ms ease;
	transition: -webkit-transform 900ms ease;
	transition: transform 900ms ease;
	transition: transform 900ms ease, -webkit-transform 900ms ease;

}

.dropdown-menu nav,
.dropdown-menu ul {
	height: 100%;
	width: 100vw;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: distribute;
	justify-content: space-around;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.dropdown-menu li {
	border-bottom: 0px solid #1f678a;
}

.dropdown-menu a {
	font-weight: 400;
	letter-spacing: 0.3em;
	color: #80ced7;
	display: block;
	padding: 1vh;
	-webkit-transition: background-color 300ms ease-in;
	transition: background-color 300ms ease-in;
	font-size: 1em;
}

.dropdown-menu a:hover {
	color: #dbf4a7;
}

.menu-icon p {
	opacity: 0;
}


@media only screen and (min-width: 56.250em) {

	.dropdown-menu a {
		font-size: 2em;
	}

	.menu-icon p {
		font-size: 4em;
		opacity: 1;

	}

	.dropdown-menu {
		top: 0;
		height: auto;
		padding-top: 2vh;
		padding-bottom: 2vh;
	}

	.dropdown-menu nav,
	.dropdown-menu ul {
		width: 100vw;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}

	/* .dropdown-menu li{
		margin: 0.8vh;
	} */
}


/* :::::::::::::::::::::::::::::::::::::::::::::

MOBILE BAR  MOBILE APP MODULE

::::::::::::::::::::::::::::::::::::::::::::: */

.menu-toggle {
	display: none;
}

.mobile-bar {
	z-index: 10;
	position: fixed;
	top: 0;
	left: 0;
	padding: 0 2.5vw;
	width: 100vw;
	height: 15vh;
	background-color: transparent;
	background-color: #fdfdfd;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
}

.mobile-bar-left {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.mobile-bar-center {
	z-index: 8;
	-webkit-box-flex: 3;
	-ms-flex: 3;
	flex: 3;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.mobile-bar-right {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.mobile-bar-logo {
	width: 50vw;
	height: auto;
}


/* :::::::::::::::::::::::::::::::::::::::::::::

FOOTER  SECTION

::::::::::::::::::::::::::::::::::::::::::::: */

.footer {
	width: 100%;
	background-color: #666;
	bottom: 0;
	padding-bottom: 8vh;
}

.footer p {
	font-size: 0.7em;
	line-height: 1.5em;
	color: #f2ddc7;
	padding: 0 2vh;
}

@media only screen and (min-width: 56.250em) {
	.footer p {
		font-size: 0.8em;
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::

FOOTER  MOBILE APP BAR MOBILE APP MODULE

::::::::::::::::::::::::::::::::::::::::::::: */

.mobileappbar {
	z-index: 9;
	background: transparent;
	width: 100vw;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 0;
	position: fixed;
	bottom: 0;
}

.mobileappbar p {
	color: #fcd0a1;
	letter-spacing: 0.3em;
	font-size: 0.825em;
	line-height: 1.0em
}

.mobileappbarbutton {
	width: 100%;
	background: rgba(0, 0, 0, 0.9);
	height: auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	border-radius: 0px;
	text-align: center;
	border-right: rgba(64, 63, 76, 0.8) solid 1px;
	padding: 2vh 3vh;
}

.last {
	border-right: 0px;
}

@media only screen and (min-width: 56.250em) {
	.mobileappbar {
		display: none;
	}
}



/* :::::::::::::::::::::::::::::::::::::::::::::

L A Y O U T

::::::::::::::::::::::::::::::::::::::::::::: */

/*---------------------
	PAGE LAYOUT SECTION
	JUST ADD LAYOUT PROPERTIES HERE
---------------------*/
.page {
	min-height: 100vh;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-transition: -webkit-transform 900ms ease;
	transition: -webkit-transform 900ms ease;
	transition: transform 900ms ease;
	transition: transform 900ms ease, -webkit-transform 900ms ease;
}

.pagedrop {
	height: 100vh;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 10vh;
	-webkit-transition: -webkit-transform 900ms ease;
	transition: -webkit-transform 900ms ease;
	transition: transform 900ms ease;
	transition: transform 900ms ease, -webkit-transform 900ms ease;
}

.row {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.col {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.rowcol {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.colrow {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.colhalf {
	width: 100%;
}



@media only screen and (min-width: 56em) {
	.page {
		/* -webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center; */
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}

	.pagedrop {
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}

	.rowcol {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}

	.colrow {
		width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}

	.colhalf {
		flex: 1;
	}
	
}

.start {
	justify-content: flex-start;
}

/*---------------------
	 PAGE STYLING SECTIONS
	 NO LAYOUT PROPERTIES
	 Just add styling properties like
	 background:  background-color:  min-height: padding: text-align etc
---------------------*/

/* LANDING PAGE CSS /////////////////////////////////////////////// */
.landing {
	min-height: 90vh;
	width: 100%;
	background-color: #fdfdfd;
	background: url(https://casa28.squaremonkeys.com/public/img/general/hero-3.jpg) no-repeat center center fixed;
	background-size: cover;
	padding-top: 10vh;
	text-align: center;
	justify-content: center;

}

.landing h5 {
	text-align: center;
	color: #fdfdfd;
	font-weight: 300;
}
.landing p {
	text-align: center;
}


@media only screen and (min-width: 56.250em) {

	.landing {
		padding-bottom: 2vh;
	}

}


/* LANDING PAGE HERO SECTION CSS /////////////////////////////////////////////// */

.landingHero {
	min-height: 100vh;
	width: 100%;
	background-color: #fdfdfd;
	/* background: url(http://localhost/NewMaster/public/img/general/heromob1.jpg) no-repeat top center fixed;
	background-size: cover; */
	/* padding: 2vh; */
	text-align: center;
}

.landingHero h2 {
	text-align: center;
}
.landingHero p {
	text-align: center;
	padding: 0 2vh;
}

.landingHero h5 {
    font-size: 1.5em;
}

@media only screen and (min-width: 56.250em) {
	/* .landingHero {
		background: url(http://localhost/NewMaster/public/img/general/hero1.jpg) no-repeat top center fixed;
	} */

}

/* LANDING PAGE HERO SECTION CSS /////////////////////////////////////////////// */

.landingFull {
	min-height: 100vh;
	width: 100%;
	background-color: #fdfdfd;
	background: linear-gradient(180deg,rgba(0,0,0,0)0%,rgba(0,0,0,0.5)50%,rgba(0,0,0,0)100%), url(https://casa28.squaremonkeys.com/public/img/casa/Casa-28-Woolgoolga-4.jpg) no-repeat center center fixed;
	background-size: cover;
	padding: 2vh;
	text-align: center;
}

.landingFull h3 {
	text-align: center;
	color: #fdfdfd;
}
.landingFull p {
	text-align: center;
}
.colhalf p {
	text-align: center;
	padding: 0 2vh;
}

@media only screen and (min-width: 56.250em) {
	/* .landingHero p {
		font-size: 1.2em;
	}
	.colhalf p {
		font-size: 1.2em;
	} */
}

.amenities p {
	text-align: center;
	padding: 0 2vh;
}

.panorama p {
	text-align: center;
	padding: 0 2vh;
}

.location p {
	text-align: center;
	padding: 0 2vh;
}

.reviews {
	padding: 15vh 2vh;
}

.comforts {
	padding: 1vh;
}

.comforts-col {
	flex: 1;
	margin: 2vh;
}

.comforts-col p {
	text-align: center;
	padding: 0 2vh;
}



.town-bio {
	height: 100vh;
	width: 100%;
	padding: 2vh;
	justify-content: center;
	align-items: center;
}

.town-bio p{
	text-align: center;
	padding: 0 2vh;
}

.town-bio h3{
	color: #444;
}

.flex1 {
	flex: 1;
}
.flex2 {
	flex: 1;
}

.booknow {
	width: 100%;
	height: 50vh;
	background: #f2ddc7;
}

.booknow p {
	text-align: center;
	padding: 0 2vh;
}

@media only screen and (min-width: 56.250em) {

	.reviews {
		padding: 15vh 30vh;
	}
	.town-bio p {
		text-align: center;
		max-width: 50vw;
	}
	.flex2 {
		flex: 2;
	}
}


/* LANDING PAGE NEWS SECTION CSS /////////////////////////////////////////////// */
.landingNews {
	min-height: 100vh;
	width: 100%;
	background-color: #FAAA8D;
	/* background: url(http://localhost/NewMaster/public/img/general/heromob3.jpg) no-repeat top center fixed; */
	padding: 2vh;
}

.landingNews-feature-image {
	max-width: 90vw;
	height: auto;
	display: block;
}

.landingNews-listing {
	width: 90%;
}


@media only screen and (min-width: 56.250em) {
	/* .landingNews {
		background: url(http://localhost/NewMaster/public/img/general/hero3.jpg) no-repeat top center fixed;
	} */

	.landingNews-feature-image {
		max-width: 40vw;
	}

	.landingNews-listing {
		width: 70%;
	}
}

/* LANDING PAGE GIGS SECTION CSS /////////////////////////////////////////////// */
.landingGigs {
	padding-top: 10vh;
	min-height: 100vh;
	width: 100%;
	background-color: #feefdd;
}

.landingGigs-listing {
	background-color: rgba(0, 0, 0, 0.3);
	width: 90%;
}

.landingGigs-listing h1 {
	color: #ffda98;
}

.gig-listing {
	width: 90%;
	background-color: rgba(0, 0, 0, 0.1);
	padding-top: 1vh;
}

/* .gig-listing p {
	font-size: 1em;
} */

.gig-listing-section {
	flex: 1;
	flex-wrap: wrap;
	align-items: center;
	padding-left: 0;
}




@media only screen and (min-width: 56.250em) {
	/* .landingGigs {
		background: url(http://localhost/NewMaster/public/img/general/hero2.jpg) no-repeat top center fixed;
	} */

	.gig-listing {
		width: 80%;
	}

	.gig-listing-section {
		align-items: flex-start;
		padding-left: 2vh;
	}

	.landingGigs-listing {
		width: 70%;
	}
}


/* LANDING PAGE BIO SECTION CSS /////////////////////////////////////////////// */
.landingBio {
	min-height: 100vh;
	width: 100%;
	background-color: #FAAA8D;
}

.bio-body {
	width: 90%;
}

@media only screen and (min-width: 56.250em) {
	.bio-body {
		width: 60%;
	}
}

/* LANDING PAGE CONTACT SECTION CSS /////////////////////////////////////////////// */
.landingContact {
	width: 100%;
	background-color: #fdfdfd;
}

.landingContact p {
	text-align: center;
	padding: 0 2vh;
}

.landingContact h4 {
	color: #f2ddc7;
	font-weight: 400;
}


@media only screen and (min-width: 56.250em) {
	/* .landingBio {
	} */

}

/* CONTACT PAGE SECTION CSS /////////////////////////////////////////////// */
.contact {
	width: 100%;
	padding: 2vh;
	min-height: 100vh;
}

.contact h1,
h2,
h3,
h4 {
	color: #f7f7f7;
}

.contact p {
	color: #241623;
}

/* MUSIC PAGE SECTION CSS /////////////////////////////////////////////// */
.music {
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	background-color: #1c7293;
	height: 80vh;
	width: 100%;
	padding: 2vh;
	padding-top: 10vh;
}

.music h1,
h2,
h3,
h4 {
	color: #f7f7f7;
}

.music p {
	color: #9eb3c2;
}

/* VIDEO PAGE SECTION CSS /////////////////////////////////////////////// */

.video {
	background-color: #fff;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 10vw 2vw;
}

.video h1 {
	font-size: 4vh;
	/* color: #fff; */
}

.video p {
	color: #ecdccd;
	text-align: left;
	/* font-size: 2.5vh; */
	line-height: 1.2;
	margin-bottom: 0;
}

/* LOGIN PAGE CSS /////////////////////////////////////////////// */
.loginPage {
	min-height: 70vh;
	font-family: 'Roboto Condensed', sans-serif;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding-top: 10vh;
}

/* .loginPage p {
	font-size: 1em;
} */


.edit-button {
	height: 100%;
	width: 70px;
	padding: 0 6px;
	border: none;
	border-radius: 4px;
	margin: 8px;
	font-family: arial;
	font-size: 13px;
	line-height: 36px;
	color: #111;
	text-transform: uppercase;
	text-align: center;
	border: #111 solid 1px;
}

.edit-button:hover {
	background: green;
	color: #F6F6F6;
}

input .hidden {
	display: none;
}

.delete-button {
	height: 100%;
	width: 70px;
	padding: 0 6px;
	border: none;
	border-radius: 4px;
	margin: 8px;
	font-family: arial;
	font-size: 13px;
	line-height: 36px;
	color: #111;
	text-transform: uppercase;
	text-align: center;
	border: #111 solid 1px;
}

.delete-button:hover {
	background: red;
	color: #F6F6F6;
}

.logout-button {
	height: 100%;
	width: 70px;
	padding: 0 6px;
	border: none;
	border-radius: 4px;
	margin: 8px;
	font-family: arial;
	font-size: 13px;
	line-height: 36px;
	color: #111;
	text-transform: uppercase;
	text-align: center;
	border: #111 solid 1px;
}

/* DASHBOARD PAGE CSS /////////////////////////////////////////////// */
/* DASHBOARD PAGE CSS /////////////////////////////////////////////// */
/* DASHBOARD PAGE CSS /////////////////////////////////////////////// */

.dashboard {
	background: #e6e6e6;
	width: 99.9vw;
	min-height: 100vh;
}

.dashboard h1,
h2,
h3,
h4,
p {
	color: #2b435c;
	text-align: left;
	line-height: 1em;
}

.dashboard h1 {
	font-size: 2em;
	text-align: center;
}

.dashboard h2 {
	color: #3c787e;
	font-size: 2em;
}

.dashboard p {
	color: #3d3d3d;
}

.dashboard-sidebar {
	width: 100%;
	background: #3c787e;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	text-align: center;

}

.dashboard-sidebar h1,
h2,
h3,
h4,
h5,
p {
	color: #1a1a1a;
}

.dashboard-sidebar-header {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	text-align: center;
	padding: 2vh;
	border-bottom: 0.1vh solid #9eb3c2;
}

.dashboard-sidebar hr {
	width: 90vw;
	height: 0.1vh;
	border: 0;
	margin: 0 auto;
	margin-bottom: 2vh;
	margin-top: 2vh;
	background-color: #9eb3c2;
}

.dashboard-sidebar ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;


}

.dashboard-sidebar li {
	margin: 1vh;
	color: #e6efe9;
	cursor: pointer;
	list-style: none;
}

.dashboard-sidebar li:hover {
	color: #facc6b;
	font-weight: 700;
}

.dashboard-sidebar-footer {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	text-align: center;
	font-size: 0.8em;
	color: #e6efe9;
}

.dashboard-sidebar-footer p {
	color: #241623;
}

.dashboard-content {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 0 2vh;
	padding-top: 1vh;
}

.dashboard-content-header {
	width: 90%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-bottom: 2vh;
	color: #2b435c;
}

.dashboard-content-header p {
	font-weight: 400;
	color: #2b435c;
}

.dashboard-post {
	width: 90%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	/* border-top: 1px solid #9eb3c2; */
	margin-bottom: 2vh;
}

.dashboard-post-title {
	width: 100%;
}

.dashboard-post-body {
	width: 100%;
}

.dashboard-post-image {
	width: 100%;
}

.dashboard-post-action {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

/* IPAD SCREEN STYLINGS ////////////////////////////////////// */
/* IPAD SCREEN STYLINGS ////////////////////////////////////// */
/* IPAD SCREEN STYLINGS ////////////////////////////////////// */

@media only screen and (min-width: 56.250em) {

	.dashboard {
		/* margin-top: 10vh;
		height: 80vh; */
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
	}

	.dashboard h2,
	h4,
	h5 {
		font-size: 1em;
	}

	.dashboard-sidebar h1 {
		font-size: 1em;
	}

	.dashboard-sidebar li {
		font-size: 0.5em;
	}

	.dashboard-sidebar {
		height: 100vh;
		width: 15vw;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}

	.dashboard-sidebar hr {
		width: 10vw;
	}



	.dashboard-content {
		max-height: 80vh;
		overflow-y: scroll;
	}

	.dashboard-content-header {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		margin: 2vh 5vh;
	}

	.dashboard-post {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		margin: 2vh 5vh;
	}

	.dashboard-post-title {
		width: 25%;
	}

	.dashboard-post-body {
		max-width: 40%;
	}

	.dashboard-post-action {
		width: 15%;
	}

	.dashboard-post-image {
		width: 15%;
	}


}

/* DESKTOP SCREEN STYLINGS ////////////////////////////////////// */
/* DESKTOP SCREEN STYLINGS ////////////////////////////////////// */
/* DESKTOP SCREEN STYLINGS ////////////////////////////////////// */

/* *1200PX SCREENS AND UP for-desktop-up*/
@media only screen and (min-width: 75em) {
	.dashboard-sidebar h1 {
		font-size: 1.5em;
	}

	.dashboard-sidebar li {
		font-size: 1em;
	}

	/* .dashboard-sidebar-footer p {
		font-size: 0.8em;
	} */

	.dashboard h2,
	h4,
	h5 {
		font-size: 2em;
	}
}


/* POSTS PAGE CSS /////////////////////////////////////////////// */
/* POSTS PAGE CSS /////////////////////////////////////////////// */
/* POSTS PAGE CSS /////////////////////////////////////////////// */


.postspage {
	min-height: 70vh;
	width: 90vw;
	background: #9eb3c2;

}

.postspage-entry {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	width: 90%;
	margin: 0 auto;
	text-align: left;
}


@media only screen and (min-width: 56.250em) {
	.postspage {
		width: 70vw;
	}

	.postspage-entry {
		width: 70%;
	}

}





/* VIDEO ON PAGE SETTINGS:::::::::::::::::::::::::::::::::::::::::::::::::::: */
/* VIDEO ON PAGE SETTINGS:::::::::::::::::::::::::::::::::::::::::::::::::::: */
/* VIDEO ON PAGE SETTINGS:::::::::::::::::::::::::::::::::::::::::::::::::::: */



.iframe-container {
	position: relative;
	width: 100%;
	padding: 2vh;
	margin: 1 auto;
}

.iframe-container .ratio {
	display: block;
	width: 100%;
	height: auto;
}

.iframe-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.iframe-container video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media only screen and (min-width: 56.250em) {
	/* .video-page {
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	    -ms-flex-direction: row;
	        flex-direction: row;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	text-align: center;
	} */

	.iframe-container {
		width: 50%;
	}
}




/* FORM :::::::::::::::::::::::::::::::::: */
/* FORM :::::::::::::::::::::::::::::::::: */
/* FORM :::::::::::::::::::::::::::::::::: */

form {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	max-width: 100%;
	width: 100%;
	padding: 2vh;
}

.form-group {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: flex-start;
	-ms-flex-align: flex-start;
	align-items: flex-start;
	width: 100%;
	margin: 0 auto;
	text-align: left;
}

.form-group input {
	padding: 15px;
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	width: 100%;
	/* margin-right: 30px; */
	font-size: 18px;
	color: #555;
	margin: 0 0 20px 0;
	-ms-flex-preferred-size: 100%;
	flex-basis: 100%;
	font-family: 'Roboto Condensed', sans-serif;

}

.form-group textarea {
	padding: 15px;
	width: 100%;
	height: 15vh;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1.2em;
	color: #555;
	margin: 0 0 2vh 0;
}


button {
	color: #fff;
	border-radius: 4px;
	text-transform: uppercase;
	background-color: transparent;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 0.8em;
	font-weight: 400;
	letter-spacing: 0.3rem;
	text-align: center;
	padding: 2vh 4vh;
	border: 1px solid #FFF;
	cursor: pointer;
	margin: 2vh;
}



button:hover {
	background-color: #50b2c0;
}


@media only screen and (min-width: 56.250em) {

	.form-group input {
		width: 100%;
	}

	.form-group textarea {
		width: 100%;
		height: 20vh;
	}

	form .btn {
		width: auto;
		font-size: 2vh;
	}

}

/* LOGIN FORM :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
.loginForm {
	width: 90vw;
	min-height: 50vh;
	padding: 20px;
	border-radius: 6px;
	background-color: #857c8d;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-family: 'Roboto Condensed', sans-serif;
}

.loginForm input {
	height: 5vh;
	width: 90%;
	/* padding: 0 15px; */
	border: none;
	border-radius: 4px;
	background-color: #feefdd;
	font-family: arial;
	font-size: 20px;
}

.loginForm h2 {
	color: #feefdd;
}

.loginForm p {
	color: #feefdd;
}

.loginForm label {
	color: #201e1f;
}

@media only screen and (min-width: 56.250em) {

	.loginForm {
		width: 50vw;
	}

}

@media only screen and (min-width: 75em) {
	.loginForm {
		width: 25vw;
	}

}

.loginForm button {
	color: #fff;
	border-radius: 4px;
	text-transform: uppercase;
	background-color: #50b2c0;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1em;
	font-weight: 400;
	letter-spacing: 0.3rem;
	text-align: center;
	padding: 2vh 4vh;
	border: 1px solid #FFF;
	cursor: pointer;
	margin: 2vh;
}

.loginForm button:hover {
	background-color: #2b435c;
}

/* CONTENT FORM :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */


.content-form {
	width: 95vw;
}

.contact-form {
	width: 95vw;
	background-color: #2b435c;
}

@media only screen and (min-width: 56.250em) {
	.content-form {
		width: 80%;
	}

	.contact-form {
		width: 50vw;
	}

}


/* CONTACT FORM :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
.contactForm {
	justify-content: flex-start;
	align-items: flex-start;
	width: 100%;
	min-height: 50vh;
	padding: 3vh;
	border-radius: 3vh;
	background-color: #857c8d;
	background-color: #201e1f;
	font-family: 'Roboto Condensed', sans-serif;
	color: #201e1f;
	-webkit-box-shadow: #000;
	box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.5);
	-webkit-border-radius: 3vh;
	-moz-border-radius: 3vh;
	-ms-border-radius: 3vh;
	-o-border-radius: 3vh;
}

.contactFormHalf {
	width: 100%;
	justify-content: flex-start;
	align-items: flex-start;
	padding-left: 2vh;

}

.contactForm h2 {
	color: #faaa8d;
}

.contactForm p {
	color: #feefdd;
}

.contactForm input {
	height: 5vh;
	width: 100%;
	border: none;
	border-bottom: 1px solid #F6F6F6;
	border-radius: 0;
	background-color: transparent;
	font-family: arial;
	font-size: 20px;
	-webkit-border-radius: 0x;
	-moz-border-radius: 0x;
	-ms-border-radius: 0x;
	-o-border-radius: 0x;
	font-family: 'Roboto Condensed', sans-serif;
	color: #aeaeae;
}

.contactForm textarea {
	padding: 15px;
	width: 100%;
	height: 15vh;
	font-family: 'Roboto Condensed', sans-serif;
	/* font-size: 1.2em; */
	color: #aeaeae;
	background-color: transparent;
	margin: 5VH 0 5vh 0;
	border: none;
	border-bottom: 1px solid #F6F6F6;

}

.contactForm .form-group {
	justify-content: flex-start;
}

.contactForm ::placeholder {
	font-family: 'Roboto Condensed', sans-serif;
	color: #201e1f;
	color: #aeaeae;
	font-size: 0.8em;
	cursor: text;
}

.contactForm :focus {
	color: #aeaeae;
}


.contactForm label {
	color: #aeaeae;
}



@media only screen and (min-width: 56.250em) {

	.contactForm {
		width: 60vw;
		padding: 3vh;

	}
	.contactFormHalf {
		width: 50%;
		padding-left: 10vh;
	}

}

@media only screen and (min-width: 75em) {
	.contactForm {
		width: 80vw;
	}

}


.smallForm {
	width: 90%;
}

.smallForm input {
	color: #747474;
	border: none;
	border-bottom: 1px solid #555;
	background-color: transparent;
}

.smallForm textarea {
	height: 30vh;
	color: #aeaeae;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid #555;

}

@media only screen and (min-width: 56.250em) {
	.smallForm {
		width: 25%;
	}
}

/* MESSAGE FLASH FOR SUCCESS */

.alert-success {
	background: #22be51;
	padding: 1vh;
}


/* BOOTSTRAP CSS FOR INVALID INPUT */


.invalid-feedback {
	display: none;
	width: 100%;
	margin-top: 0.25rem;
	font-size: 80%;
	color: #dc3545;
	background: #fff;
	text-align: center;
	padding: 1vh;
}

.invalid-tooltip {
	position: absolute;
	top: 100%;
	z-index: 5;
	display: none;
	max-width: 100%;
	padding: 0.25rem 0.5rem;
	margin-top: .1rem;
	font-size: 0.875rem;
	line-height: 1.5;
	color: #fff;
	background-color: rgba(220, 53, 69, 0.9);
	border-radius: 0.25rem;
}

.was-validated .form-control:invalid,
.form-control.is-invalid {
	border-color: #dc3545;
	padding-right: calc(1.5em + 0.75rem);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23dc3545' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23dc3545' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E");
	background-repeat: no-repeat;
	background-position: center right calc(0.375em + 0.1875rem);
	background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.was-validated .form-control:invalid:focus,
.form-control.is-invalid:focus {
	border-color: #dc3545;
	-webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
	box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.was-validated .form-control:invalid~.invalid-feedback,
.was-validated .form-control:invalid~.invalid-tooltip,
.form-control.is-invalid~.invalid-feedback,
.form-control.is-invalid~.invalid-tooltip {
	display: block;
}

.was-validated textarea.form-control:invalid,
textarea.form-control.is-invalid {
	padding-right: calc(1.5em + 0.75rem);
	background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
}

.was-validated .custom-select:invalid,
.custom-select.is-invalid {
	border-color: #dc3545;
	padding-right: calc((1em + 0.75rem) * 3 / 4 + 1.75rem);
	background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23dc3545' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23dc3545' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E") #fff no-repeat center right 1.75rem/calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.was-validated .custom-select:invalid:focus,
.custom-select.is-invalid:focus {
	border-color: #dc3545;
	-webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
	box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.was-validated .custom-select:invalid~.invalid-feedback,
.was-validated .custom-select:invalid~.invalid-tooltip,
.custom-select.is-invalid~.invalid-feedback,
.custom-select.is-invalid~.invalid-tooltip {
	display: block;
}

.was-validated .form-control-file:invalid~.invalid-feedback,
.was-validated .form-control-file:invalid~.invalid-tooltip,
.form-control-file.is-invalid~.invalid-feedback,
.form-control-file.is-invalid~.invalid-tooltip {
	display: block;
}

.was-validated .form-check-input:invalid~.form-check-label,
.form-check-input.is-invalid~.form-check-label {
	color: #dc3545;
}

.was-validated .form-check-input:invalid~.invalid-feedback,
.was-validated .form-check-input:invalid~.invalid-tooltip,
.form-check-input.is-invalid~.invalid-feedback,
.form-check-input.is-invalid~.invalid-tooltip {
	display: block;
}

.was-validated .custom-control-input:invalid~.custom-control-label,
.custom-control-input.is-invalid~.custom-control-label {
	color: #dc3545;
}

.was-validated .custom-control-input:invalid~.custom-control-label::before,
.custom-control-input.is-invalid~.custom-control-label::before {
	border-color: #dc3545;
}

.was-validated .custom-control-input:invalid~.invalid-feedback,
.was-validated .custom-control-input:invalid~.invalid-tooltip,
.custom-control-input.is-invalid~.invalid-feedback,
.custom-control-input.is-invalid~.invalid-tooltip {
	display: block;
}

.was-validated .custom-control-input:invalid:checked~.custom-control-label::before,
.custom-control-input.is-invalid:checked~.custom-control-label::before {
	border-color: #e4606d;
	background-color: #e4606d;
}

.was-validated .custom-control-input:invalid:focus~.custom-control-label::before,
.custom-control-input.is-invalid:focus~.custom-control-label::before {
	-webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
	box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.was-validated .custom-control-input:invalid:focus:not(:checked)~.custom-control-label::before,
.custom-control-input.is-invalid:focus:not(:checked)~.custom-control-label::before {
	border-color: #dc3545;
}

.was-validated .custom-file-input:invalid~.custom-file-label,
.custom-file-input.is-invalid~.custom-file-label {
	border-color: #dc3545;
}

.was-validated .custom-file-input:invalid~.invalid-feedback,
.was-validated .custom-file-input:invalid~.invalid-tooltip,
.custom-file-input.is-invalid~.invalid-feedback,
.custom-file-input.is-invalid~.invalid-tooltip {
	display: block;
}

.was-validated .custom-file-input:invalid:focus~.custom-file-label,
.custom-file-input.is-invalid:focus~.custom-file-label {
	border-color: #dc3545;
	-webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
	box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.form-inline {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-flow: row wrap;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	flex-flow: row wrap;
	-ms-flex-align: center;
	-webkit-box-align: center;
	align-items: center;
}

.form-inline .form-check {
	width: 100%;
}

/* @media (min-width: 576px) { */
/* .form-inline label {
	  display: -ms-flexbox;
	  display: flex;
	  -ms-flex-align: center;
	  align-items: center;
	  -ms-flex-pack: center;
	  justify-content: center;
	  margin-bottom: 0;
	}
	.form-inline .form-group {
	  display: -ms-flexbox;
	  display: flex;
	  -ms-flex: 0 0 auto;
	  flex: 0 0 auto;
	  -ms-flex-flow: row wrap;
	  flex-flow: row wrap;
	  -ms-flex-align: center;
	  align-items: center;
	  margin-bottom: 0;
	}
	.form-inline .form-control {
	  display: inline-block;
	  width: auto;
	  vertical-align: middle;
	}
	.form-inline .form-control-plaintext {
	  display: inline-block;
	}
	.form-inline .input-group,
	.form-inline .custom-select {
	  width: auto;
	}
	.form-inline .form-check {
	  display: -ms-flexbox;
	  display: flex;
	  -ms-flex-align: center;
	  align-items: center;
	  -ms-flex-pack: center;
	  justify-content: center;
	  width: auto;
	  padding-left: 0;
	}
	.form-inline .form-check-input {
	  position: relative;
	  -ms-flex-negative: 0;
	  flex-shrink: 0;
	  margin-top: 0;
	  margin-right: 0.25rem;
	  margin-left: 0;
	}
	.form-inline .custom-control {
	  -ms-flex-align: center;
	  align-items: center;
	  -ms-flex-pack: center;
	  justify-content: center;
	}
	.form-inline .custom-control-label {
	  margin-bottom: 0;
	}
  } */

  /* ///////////////////////////////////////////////////////////////////////////////////////////////
THIS IS THE CSS TO MAKE FULL BACKGROUND IMAGES WORK ON IOS DEVICES
This Media Query, targets IOS devices only (AS AT April 2021)
Include every page that has full page background image in here and add the property
background-attachment: initial;
/////////////////////////////////////////////////////////////////////////////////////////////// */

@supports (-webkit-touch-callout: none) {
	.landing {
		background-attachment: initial;
	} 
	.landingFull {
		background-attachment: initial;
	} 

	}
/* ///////////////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////////////// */