/*
''template details start''
'name:Page
'primary:true
'serial:1000
'cssFile:template_page.css
'aspFile:template_page.asp
''template details end''
*/

/* defaults - copied from CMS2016.css so documents will inherit these styles in editing mode */
	* { vertical-align:baseline; font-weight:inherit; font-family:inherit; font-style:inherit; font-size:100%; border:0 none; outline:0; padding:0; margin:0; }
	html, body { margin:0; padding:0; font-family:'Open Sans', sans-serif; font-weight:400; color:#555; }
	a { color:#07C; text-decoration:none; }
	a:hover { opacity:0.9; }
	p { margin:1em 0; }
	h1 { font-size:175%; font-weight:400; }
	.pageTitle { border-bottom:1px solid #e6e6e6; padding-bottom:10px; margin-bottom:30px; text-align:center; }
	h2 { font-size:135%; font-weight:400; }
	h3 { font-size:100%; font-weight:600; }
	hr { height:0; border:none; border-top:#eee solid 1px; margin:1.5em 0; }
	hr.noLine { border:1px solid #fff; }
	ul, ol { margin:1em 0; }
	ul li, ol li { margin:0 0 0 30px; }
	b, strong { font-weight:bold; font-weight:600; }
	.clear { clear:both; }
	iframe { width:100% !important; display:block; }
	.box { padding:30px; border:1px solid #e6e6e6; box-sizing:border-box; }
	.note { padding:20px; background:#fffacd; font-style:italic; font-size:90%; }
/* defaults - copied from CMS2016.css so documents will inherit these styles in editing mode */

/* colours - first is for CMS editor, second is to overide CMS2016.css */
h1.pageTitle,
h2.pageTitle { color:#2db4d2; font-size:200%; font-weight:300; }
h2, .pageContent h2 { color:#2db4d2; }
h3, .pageContent h3 { color:#2db4d2; font-size:120%; }
.btn, .pageContent .btn { background:#2db4d2; color:#fff; }
.bodyStyle .btn:hover { opacity:0.9; }
.box, .pageContent .box { border:1px solid #e6e6e6; }

/* header */
.bodyStyle #headerBlock { background:url(/~images/template/background.jpg) top center no-repeat #1f4284; }
.logoRight img { height:118px; box-shadow:0 2px 5px rgba(0,0,0,0.2); }

/* datepicker reset */
#staahbooking ul { margin:0; padding:0; list-style:none; }
#staahbooking li { margin:0; padding:0; display:inline-block; }
#staahbooking .wd_departure,
#staahbooking button.ui-datepicker-trigger { display:none; }

/* datepicker styling */
.bookingBox { max-width:600px; margin:5px; }
#staahbooking { position:relative; }
#staahbooking li.wd_checkin { background:#fff; border-bottom:2px solid rgba(0,0,0,0.2); padding:0; position:relative; text-align:left; text-indent:30px; line-height:32px; height:32px; box-sizing:border-box; }
#staahbooking li.wd_checkin:before { content:''; background:url(/~css/images/icon_calendar128red.png) center center no-repeat; background-size:contain; width:16px; height:30px; position:absolute; top:0; left:8px; }
#staahbooking .wd_checkin label { color:#999; }
#staahbooking #checkinDateText { background:none; }
#staahbooking #checkinDateText:hover { color:#666; cursor:pointer; }
#staahbooking .booking_btn { border:none; border-bottom:2px solid rgba(0,0,0,0.2); color:#fff; text-decoration:none; text-align:center; padding:0 20px; margin-left:5px; line-height:32px; height:32px;
	background:#65b319; transition:background 150ms ease-in-out; font-weight:bold; text-transform:uppercase; }
#staahbooking .booking_btn:hover { background:#72c91c; cursor:pointer; }
#ui-datepicker-div { display:none; z-index:9999 !important; font-size:100%; } /* force datepicker above navbar */

/* page */
body { font-size:90%; }
#pageOuter { margin:40px 10px; }
.intro { padding:0 30px 10px; font-size:115%; }

/* footer */
.footerCopy { text-align:center; color:#ccc; font-size:80%; }
.footerCopy a { color:inherit; }

/* home */
.home { width:32%; box-sizing:border-box; display:inline-block; vertical-align:top; margin-right:2%; float:left; }
.home:nth-of-type(4n) { margin:0; }
.home .descBlock { background:#f6f6f6; border:none; box-shadow:0 1px 5px rgba(0,0,0,0.2); }
.home .descBlock h2.maintitle, 
.home .descBlock .description, 
.home .descBlock ul.gallery { width:100%; display:block; float:none; }
.home .descBlock ul.gallery { height:180px; }
.home .descBlock ul.gallery img { box-shadow:none; }
.home .descBlock h2.maintitle { padding:20px 20px 5px; font-size:110%; font-weight:700; color:#1f4284; }
.home .descBlock .description { padding:0 20px 15px; margin:0; }
.home .descBlock .btn { display:block; max-width:70%; margin:auto; }
.home .descBlock ul { margin:0; }

/* blockPlus */
.row .blockPlus, .row .blockPlus .gallery, .row .blockPlus .plusimage { height:400px; }
.row .blockPlus h2.maintitle { font-size:150%; padding:30px 30px 50px; line-height:150%; }
.blockPlus h3.subtitle { display:none; }
.row .blockPlus .overlay { display:none; }
.row .blockPlus .teaser { padding:0 30px; top:auto; bottom:30px; height:20px; z-index:3; }
.row .blockPlus .popup-btn { left:auto; right:20px; width:200px; bottom:60px; }
.row .blockPlus .links .btn { width:200px; }
.row .blockPlus .teaser,
.row .blockPlus .popup-btn { opacity:1; }
.ispopup .popBlock .list li { width:100%; }
.popBlock .links .xlink { padding-left:10px; }
.row .blockPlus .popup-btn:hover,
.row .blockPlus .links .btn:hover { opacity:1; background:#355490 }

/*=======================================================*/
/*======================= MOBILE ========================*/
/*=======================================================*/

@media only screen and (max-width: 960px) 
{
	#pageOuter { margin:1.5em 1.25em; }
.bookingBox { max-width:none; text-align:center; }
.row .blockPlus .popup-btn,
.row .blockPlus .links .btn { width:100px; }

}

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

#mainContent { margin:1em 0 2.5em; }
#staahbooking li { display:block; }
#staahbooking li.wd_checkin { display:block; }
#staahbooking .booking_btn { display:block; margin:0; width:100%; }

/* blockPlus */
.row .blockPlus { height:auto; padding:0 0 1.5em 0; margin:0 0 1.5em 0; border-bottom:1px solid #eee; text-align:center; }
.row .blockPlus .gallery { margin-bottom:1em; }
.row .blockPlus .gallery, 
.row .blockPlus .plusimage { height:200px; }
.row .blockPlus h2.maintitle { color:#1f4284; font-size:120%; padding:0; background:none; }
.row .blockPlus .teaser { padding:0.5em 0; height:auto; }
.row .blockPlus .popup-btn,
.row .blockPlus .links .btn { margin:0 auto 5px; width:200px; }

}