/*
Theme Name: Clockwork Hotel Theme
Theme URI: https://www.square22.com/
Author: Dan Bacon
Author URI: https://www.square22.com/
Description: Theme for Clockwork Hotel Theme.
Version: 2.2
License: GNU General Public License v2 or later
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


	body {
		font-family:'Edu NSW ACT Cursive';
		font-size:11pt;
		margin:0px;
		padding:0px;
		color:#1a1a1a;
		}

	a { text-decoration:none; outline:none; }

	.page_width {
		position:relative;
		margin:0 auto;
		width:1000px;
		}

		.section {
			clear: both;
			padding: 0px;
			}

		.col {
			display: block;
			float:left;
			margin: 0 0 0 1%;
			}
			.col:first-child { margin-left: 0; }

		.group:before,
		.group:after { content:""; display:table; }
		.group:after { clear:both;}
		.group { zoom:1; /* For IE 6/7 */ }

		.s12 {width: 100%;}
		.s11 {width: 91.58%;}
		.s10 {width: 83.16%;}
		.s9 {width: 74.75%;}
		.s8 {width: 66.33%;}
		.s7 {width: 57.91%;}
		.s6 {width: 49.5%;}
		.s5 {width: 41.08%;}
		.s4 {width: 32.66%;}
		.s3 {width: 24.25%;}
		.s2 {width: 15.83%;}
		.s1 {width: 7.416%;}

	.mobile_hide { display:block; }
	.mobile_show { display:none; }


/* HEADER */




/* CONTENT */


	#breadcrumbs{
		list-style:none;
		margin:0;
		padding:0;
		overflow:hidden;
		text-align:right;
		margin-top:15px;
		padding-bottom:15px;
		border-bottom:1px solid #e4e4e4;
		font-size:9pt;
		}

		#breadcrumbs li{
			display:inline-block;
			vertical-align:middle;
			margin-right:5px;
			}

			#breadcrumbs .separator{
				color:#ccc;
				}

			#breadcrumbs a {
				color:#909090;
				}


	.main_content { margin-top:40px; font-size:11pt; }

	.main_content h1 { margin:0px; padding:0px; font-family:cursive; font-size:22pt; margin-bottom:15px; }
	.main_content h2 { margin:0px; padding:0px; font-family:cursive; font-size:18pt; margin-bottom:15px; }
	.main_content h3 { margin:0px; padding:0px; font-family:cursive; font-size:14pt; margin-bottom:15px; }

	.main_content a { color:#aa70af; }

	.hero_container {
		position:relative;
		padding:0;
		width:100%;
		margin:0;
		box-sizing:border-box;
		background:black;
		z-index:100;
		}

	.hero_image {
		position:absolute;
		top:0px;
		padding:0;
		width:100%;
		margin:0;
		box-sizing:border-box;
		background:black;
		z-index:100;
		}

		.hero_image_img {
			position:relative;
			background:no-repeat;
			background-size: cover;
			padding:0;
			width:100%;
			margin:0;
			box-sizing:border-box;
			z-index:100;
			}

		.hero_logo {
			position:absolute;
			top:10%;
			width:100%;
			margin:0px auto;
			text-align:center;
			z-index:120;
			}

			.hero_logo img {
				width:35%;
				}

		.hero_subtitle {
			color:white;
			font-size:16pt;
			}

		.hero_play {
			color:white;
			font-size:40pt;
			margin-top:30px;
			}

			.hero_play a {
				color:white;
				font-size:40pt;
				}

		.header_arrow {
			position:absolute;
			width:100%;
			bottom:40px;
			text-align:center;
			z-index:120;
			}

		@media only screen and (max-width: 600px) {

			.hero_logo img { width:60%; }

			}

		.promo_video {
			position:absolute;
			top:0px;
			width:100%;
			height:auto;
			}


	.sub_header_image {
		position:relative;
		padding:0;
		margin:0;
		width:100%;
		}

		.sub_header_image img {
			width:100%;
			display:block;
			}



			.subpage_links {
				display:flex;
				width:100%;
				justify-content:space-between;
				flex-wrap:wrap;
			    box-sizing: border-box;
			    flex-direction:row;
				}

			.sub_link {
				position:relative;
				width:31.5%;
				font-size:10pt;
				box-sizing: border-box;
				font-size:10pt;
				color:#1a1a1a;
				}

				.sub_link_title {
					background: url('images/arrow.png') no-repeat center right #70af8a;
					padding:10px;
					margin:0px;
					font-weight:normal;
					color:white;
					font-family:cursive;
					font-size:12pt;
					letter-spacing:1px;
					transition: all 0.3s;
					}

					.sub_link:hover .sub_link_title {
						padding-left:15px;
						}

				.sub_link img {
					display:block;
					position:relative;
					width:100%;
					}

				@media only screen and (max-width: 600px) {

					.sub_link {
						width:100%;
						font-size:10pt;
						box-sizing: border-box;
						font-size:10pt;
						color:#1a1a1a;
						margin-bottom:2%;
						}


					}


			.subpages {
				display:flex;
				width:100%;
				justify-content:flex-start;
				flex-wrap:wrap;
			    box-sizing: border-box;
			    flex-direction:row;
				}

			.sub_item {
				position:relative;
				width:23.5%;
				margin-right:1.5%;
				margin-bottom:1.5%;
				font-size:10pt;
				box-sizing: border-box;
				}

			.sub_item_title {
				background: url('images/arrow.png') no-repeat center right #aa70af;
				padding:6px;
				margin:0px;
				font-weight:normal;
				color:white;
				font-family:cursive;
				font-size:12pt;
				letter-spacing:1px;
				transition: all 0.3s;
				}

				.sub_item:hover .sub_item_title {
					padding-left:15px;
					}

				.sub_item img {
					position:relative;
					display:block;
					width:100%;
					}

			@media only screen and (max-width: 700px) {

				.sub_item {
					width:48.5%;
					}

			}


			.room_information {
				display:flex;
				width:100%;
				justify-content:flex-start;
				flex-wrap:wrap;
			    box-sizing: border-box;
			    flex-direction:row;
				}

			.room {
				position:relative;
				width:23.5%;
				margin-right:1.5%;
				margin-bottom:1.5%;
				font-size:10pt;
				box-sizing: border-box;
				font-size:10pt;
				color:#1a1a1a;
				}

			.room_title {
				padding:8px;
				margin:0px;
				font-weight:normal;
				color:white;
				font-family:cursive;
				font-size:11pt;
				letter-spacing:1px;
				transition: all 0.3s;
				background: url('images/arrow.png') no-repeat center right #709daf;
				}

				.room:hover .room_title {
					padding-left:15px;
					}

				.room p {
					padding:5px 0;
					margin:0px;
					}

				.room img {
					display:block;
					position:relative;
					width:100%;
					}

			@media only screen and (max-width: 700px) {

				.room {
					width:48.5%;
					}

			}


	.content_side_menu {
		list-style:none;
		padding:0px;
		margin:0px;
		margin-top:30px;
		width:100%;
		float:right;
		}

		.content_side_menu a {
			display:block;
			width:100%;
			padding:10px;
			background:#c3c7c8;
    		box-sizing: border-box;
    		margin-bottom:5px;
    		}

    .home_box {
    	background:#709daf;
    	display:inline-block;
    	}

		.home_box img {
			width:100%;
			}

		.home_box p {
			padding:4px;
			margin:0px;
			}

	.divider {
		position:relative;
		text-align:center;
		width:100%;
		margin:40px auto;
		}

		.divider img { width:15%; }

	.divider2 {
		position:relative;
		text-align:center;
		width:100%;
		margin:40px auto;
		border-bottom:1px solid #e4e4e4;
		}



		div.wpcf7 {
			margin-top:30px;
			border-top:1px solid #e4e4e4;
			padding-top:10px;
			}

		.wpcf7 label {
			font-family:cursive;
			font-size:13pt;
			}

		.wpcf7 p {
			margin:14px 0;
			}

			.wpcf7-form-control-wrap {
				display:block;
				margin-top:10px;
				}

			.wpcf7-form-control {
				font-family:cursive;
				width:100%;
				padding:10px;
				font-size:10pt;
				border:1px solid #b7b7b7;
			    box-sizing: border-box;
				}

				.textarea { height:100px; }

				.gform_button { background:#aa70af; color:white; font-family:cursive; font-size:14pt; padding:15px 30px; border:0px; border-radius:4px; }

				div.wpcf7-mail-sent-ok { border:0px; padding:20px; background: #088d3f; color:white; font-size:14pt; }

.gform_confirmation_wrapper {
background: #d7f1da;
padding: 40px;
border-radius: 5px;
font-size: 14pt;
}


/* NAVIGATION */


	nav {
		position:relative;
		display:block;
		background:#aaaeb1;
		color:#1c1c1c;
		height:50px;
		z-index:999;
		height:70px;
		border-bottom:1px solid white;
		}

		.logo {
			position:relative;
			display:block;
			height:50px;
			width:auto;
			padding:10px 0;
			}

		.nav_social ul {
			position:relative;
			padding:0px;
			margin:0px;
			list-style:none;
			line-height:70px;
			height:70px;
			}

			.nav_social ul li {
				display:inline-block;
				padding:0;
				margin-right:15px;
				line-height:70px;
				height:70px;
				}

				.nav_social ul li:last-child {
					margin-right:0;
					}

			.nav_social ul li a {
				color:#1c1c1c;
				font-size:15pt;
				}



		.sticky {
			position: fixed;
			top: 0;
			width: 100%
			}

		.nav_menu ul {
			position:relative;
			padding:0px;
			margin:0 auto;
			list-style:none;
			line-height:70px;
			height:70px;
			}

			.nav_menu ul li {
				display:inline-block;
				padding:0;
				margin-right:12px;
				background:url("images/dot.png") no-repeat right;
				padding-right:18px;
				line-height:70px;
				}

				.nav_menu ul li:last-child { margin-right:0; }

			.nav_menu ul li a {
				color:#1c1c1c;
				font-size:15pt;
				font-family:cursive;
				text-decoration:none;
				}

			.nav_menu ul li:last-child { background-image: none; padding:0px;}


			.nav_menu ul.sub-menu {
				display:none;
				background:#aaaeb1;
				z-index:200;
				position:absolute;
				height:auto;
				width:200px;
				margin-left:-5px;
				letter-spacing:1px
				line-height:normal;
				text-align:left;
				top:70px;
				}

			.nav_menu ul.sub-menu li{
				display:block;
				margin-bottom:0;
				list-style:none;
				margin:0;
				padding:0px;
				background:none;
				line-height:normal;
				}

				.nav_menu ul.sub-menu li a {
					display:block;
					padding:5px 10px;
					font-size:13pt;
					}

				.nav_menu ul.sub-menu li a:hover { background:#bbbec0; }





	.nav_logo { display: block; float:left; width:18%; background:none; }

	.nav_menu { display: block; float:left; width:70%; background:none; text-align:center; }

	.nav_social { display: block; float:left; width:12%; background:none; text-align:right; }

	.nav_mobile_icon {
		position:relative;
		display:none;
		font-size:24pt;
		text-align:right;
		height:70px;
		line-height:70px;
		float:left;
		width:50%;
		color:#1c1c1c;
		}

		.nav_mobile_icon a { text-decoration:none; padding-right:5%; outline:none; color:#1c1c1c; }

	@media only screen and (max-width: 960px) {

		nav ul li a { font-size:13pt !important; }

		.nav_logo { width:25%; }
			.nav_logo img { padding-left:3%; }

		.nav_menu { width:75%; }

		.nav_social { display:none; }

	}

	@media only screen and (max-width: 700px) {

		.nav_logo { width:50%; }

		.nav_menu { width:100%; display:none; }

		.nav_mobile_icon { display:block; }

		.nav_menu ul {
			position:relative;
			display:block;
			background:#aaaeb1;
			align:right;
			padding:0px;
			margin:0px;
			line-height:normal;
			text-align:left;
			height:auto;
			line-height:normal;
			}

			.nav_menu ul li {
				display:block;
				margin:0px;
				padding:5px;
				background:none;
				height:auto;
				line-height:normal;
				}

				.nav_menu ul li:last-child { padding:5px; }

				.nav_menu ul li a {
					display:block;
					padding:5px;
					height:auto;
					line-height:normal;
					}

			.nav_menu ul.sub-menu {
				display:none;
				background:#aaaeb1;
				position:relative;
				height:auto;
				width:auto;
				top:0px;
				}

				.nav_menu ul.sub-menu li a {
					display:block;
					padding-left:25px;
					}

				.nav_menu ul.sub-menu li a:hover { background:#bbbec0; }

	}


/* FOOTER */

<style>
  footer {
    background: #222;
    color: #eee;
    padding: 40px 20px;
    font-family: Arial, sans-serif;
  }

  .footer_content {
    display: flex;
    flex-direction: row;
    align-items: left;
    gap: 100px;
    text-align: left;
    max-width: 200px;
    margin: 0 auto;
  }

  .footer_contact {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .footer_contact li {
	  margin-bottom: 10px;
	  color: #000000;
	  font-size: 16px;
	  text-align: center;
}

.footer_contact li a {
  text-decoration: none;
  color: #000000;
}

  .footer_contact a {
    color: #000000;
    text-decoration: none;
    line-height: 1.5;
  }

  .footer_contact a:hover {
    text-decoration: underline;
  }
  .footer_map {
    width: 100%;
	max-width: 300px;
    height: 150px;
    border: 0;
  }
  .footer_socials {
    display: flex;
    justify-content: center;
    gap: 20px;
  }

  .footer_socials a {
    color: #eee;
    font-size: 28px;
    transition: color 0.3s ease;
8  }

  .footer_socials a:hover {
    color: #ff69b4;
  }
</style>

<script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>

	.terms_menu {
		display:inline-block;
		}

	.terms_menu ul {
		display:inline;
		list-style:none;
		padding:0px;
		margin:0px;
		text-align:right;
		}

		.terms_menu ul li {
			display:inline-block;
			margin-right:20px;
			}

	.copyright {
		color:#666666;
		text-decoration:none;
		text-align:right;
		margin:20px 0 !important;
		font-size:9pt;
		}

		.copyright a {
			color:#666666;
			text-decoration:none;
			}

@media only screen and (max-width: 600px) {
  .footer_content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  .footer_map {
    width: 100% !important;
    max-width: 300px;
    height: 150px;
    margin: 0 auto;
    display: block;
  }
}
		.footer_contact { padding:2% 3%;  }

		.footer_menu ul {
			display:block;
			list-style:none;
			text-align:right;
			}

			.footer_menu ul li {
				margin:10px 0;
				}

		.terms_menu {
			display:block;
			margin-bottom:15px;
			}

			.terms_menu ul li:last-child {
				margin-right:0px;
				}

	}


	/** RESPONSIVE **/

		@media only screen and (max-width: 900px) {

			.page_width { width:100%; box-sizing: border-box; }

			.mobile_width { width:100%; padding:0 2%; box-sizing: border-box; }

		}

		@media only screen and (max-width: 600px) {

			.copyright { text-align:center; }

			.divider img { width:35%; }

			.col {  margin: 0%; }

			.s1, .s2, .s3, .s4, .s5, .s6, .s7, .s8, .s9, .s10, .s11, .s12 { width: 100%; }

			.page_width { width:100%; }

			.header_menu ul li { display:inline-block; padding:0 5px; }

			.mobile_hide { display:none; }
			.mobile_show { display:block; }

		}
