/* Navigation styles */
@import "phone-nav.css";

/* globals */

/* width & margins */

header.phone > div, 
nav.phone > div, 
section.phone > div
{
	width: 100%;
}

footer.phone > div {
	width:				90%;
	padding-left: 5%;
}

section.phone > div {
	width:			100%;
	
}

/* fixed menu */
body>nav.phone div.nav {
	margin-left: 	0px;
	width: 			100%;
	overflow: 		hidden;
}


section.phone:first-of-type {
	margin-top:				100px;
}

/* header & logo */


body>header.phone {
	height: 				40px;
	position:				fixed;
	background-color: 		#F6F0D6;
	background-image: 		url("../images/bg.png"), url("../images/bg2.jpg");
	background-repeat:		repeat, repeat-x;
}

header.phone div.logo {
	/*background-image: 		url("./images/triton-logo-346x300.png");*/
	width: 					102px;
	height: 				90px;
	right:					0px;
	top:					-7px;
}

header.phone div.motd {
	font-size:		14px;
	top: 			0px;
	left: 			0px;
}

header.phone  div.motd span:first-child {
	top:			4px;
	left:			15px;	
}

header.phone div.motd span:first-child + span {
	top:			17px;
	left:			35px;	
}


/* default */

section.phone div.block {
	width: 				90%;
	margin: 			0px 5% 20px 5%;
}

section.phone div.block div.image {
	width: 				100%;
	aspect-ratio: 		4/3;
}
section.phone h2 {
	font-size: 			16px;
	line-height: 		18px;
}

section.phone h3 {
	font-size: 			12px;
}


/* tiny */

section.phone div.block.tiny {
	width:				98px;
	margin-right:		9px;
	margin-bottom:		9px;
}

section.phone div.block.tiny div.image {
	width: 				90px;
	height: 			90px;
	margin-bottom:		7px;
	background-size: 	70px 70px;
	border-radius:		4px;
	border-width:		4px;
	
}

section.phone div.block.tiny div.image img {
	top: 				-4px;
	left: 				-4px;
	border-radius:		4px;
	border-width:		4px;
}

footer.phone div.block.tiny {
	width: 				100%;
	text-align:			center;
}



/* tables & specials */

section.phone div.text div.specials {
	width:					96%;
	float:					left;
	clear:					both;
	
	margin-left: 			0px;
	margin-right: 			0px;
}

section.phone div.text div.specials div.img div.image.specials {
	width: 100%;
	aspect-ratio: 4 / 3;
	height: auto;
}

footer.phone div.specials {
	width:					90%;
	margin:					0px 5% 20px 5%;
}
/*
footer.phone div.specials a.button, 
footer.phone div.specials button, 
footer.phone div.specials input[type="submit"] {
	position:				absolute;
	left:					0px;
	right:					0px;
	width:					100%;
}*/

section.phone div.text div.table {
	width:					93%;
	float:					left;
	clear:					both;
	
	margin-left: 			1px;
	margin-right: 			1px;
	padding:				10px;
	
	-webkit-border-radius: 	6px;
	-moz-border-radius: 	6px;
	border-radius: 			6px;
	
}

section.phone div.text div.table table {
	font-size: 			12px;
	line-height: 		18px;
}

section.phone div.text div.table table td {
	padding-left:		3px;
	padding-right:		3px;
	vertical-align: top;
}
	
section.phone div.text div.table th {
	padding-left:		3px;
	padding-right:		3px;
}

/* Clip slideshow images that extend beyond their container, preventing horiz overflow */
section.phone div.specials div.img {
	overflow: 				hidden;
	position: 				relative;
}

section.phone div.specials > div:not(.img) {
	width: 					100%;
	margin-left:			0px;
	margin-right:			0px;
}
section.phone div.url.crop {
	white-space: normal;
}

section.phone div.url.nowrap{
	white-space: nowrap;
}

section.phone div.block.travel div.image.specials {
	display:			initial;
	width: 				100%;
}

section.phone div.text div.specials div.img div.image.specials {
	width:				100%;
	
}

section.phone div.specials > div {
	width: 100%;
}

/* footer */

footer.phone > div:last-of-type > div {
	display:			none;
}

/* phone box */
footer.phone div.phonebox {
	background: 	none;
	position: 		relative;
	overflow: 		hidden;
	padding: 	0px;
	width: 			100%;
	color: 			#817671;
	flex-direction: column;
	display: flex;
	/* center */
	justify-content: center;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	height: auto;
	margin-bottom: 20px;
}


footer.phone div.phonebox div {
	margin-left:	0px;
	text-align: center;
	border-top: 1px solid #cac3be;
	padding-top: 6px;
	padding-bottom: 6px;
	margin-left: 5%;
	margin-right: 5%;
}

footer.phone div.phonebox div:first-child {
	font-size: 24px;
	padding: none;
    line-height: 26px;
    margin-bottom: 0.5em;
    margin: 0;
    font-family: "cronos-pro-display", serif;
    font-weight: 300;
    color: #453e3a;
    text-rendering: optimizelegibility;
	text-align: left;
	margin-bottom: 15px;
	border: none;
}

section.phone div.galleryContainer {
	justify-content: center;
	display: flex;
}

section.phone div.galleryStripe {
	width: 100%;
}