/*
	#                               #####                              
	#         ##   ###### #   #    #     # #####    ##    ####  ###### 
	#        #  #      #   # #     #       #    #  #  #  #    # #      
	#       #    #    #     #      #  #### #    # #    # #      #####  
	#       ######   #      #      #     # #####  ###### #      #      
	#       #    #  #       #      #     # #   #  #    # #    # #      
	####### #    # ######   #       #####  #    # #    #  ####  ###### 

/* - CSS File - Crewe Courtyard Cottages - */
/* - Copyright 2011-2015 Lazy Grace Ltd - */
/* - June 2015 - */

/*_+_+_+_+_ Common Elements _+_+_+_+_*/
body{ margin: 0; padding: 0; height: 100%; width: 100%;	position: absolute;	background: #ffffff; font-family: 'Martel', serif; font-weight: 400; border-top: 8px solid #527579;}
img{ margin: 0; padding: 0;	border: 0;}

/*_+_+_+_+_ TEXT & TABLE _+_+_+_+_*/
.carousel > figure:focus::before, [tabindex]:focus, a:focus, area:focus, button:focus, input:focus, object:focus, select:focus, textarea:focus{	outline: 0px;}
p { margin: 0; padding: 0 0 15px 0;	font-size: 0.9em; color: #000000; line-height: 1.5em; font-weight: 400;}
ul { margin: 0; padding: 0;}
h1 {font-size: 24px; font-weight: 300; text-transform: uppercase;}
h2 {font-size: 18px; font-weight: 300; text-transform: uppercase; margin-top: 0;}

/* Cookies */
#cookies{position: fixed; bottom: 0; width: 100%; min-height: 40px; height: auto; line-height: 40px; display: block; text-align: center; background: #527579; color: #f5f5f5; left: 0; z-index: 999; font-size: .7em;}
#cookies a{	color: #f5f5f5;}
#cookies #butt_cookies{	display: inline-block; padding: 0 10px;	text-align: center;	background: #000000; color: #ffffff; line-height: 30px;	height: 30px; margin: 0 10px; text-transform: uppercase;}
#cookies #butt_cookies:hover{text-decoration: none; opacity: .8;}

/*_+_+_+_+_ Main Styles _+_+_+_+_*/
.menu-button { display: none;}
.menu-button { margin: 15px; cursor: pointer; width: 30px; height: 30px; margin-left: 23px; position: absolute; top:0px; right: 0px;}
.menu-button span { background: #1d1d1b; display: block; width: 30px; height: 4px; border-radius: 5px; margin-bottom: 5px; -webkit-transition: all 0.5s linear; transition: all 0.3s linear;}
.open span:nth-child(1), .open span:nth-child(3) { transform: translate(0px, 13px) rotate(-45deg) scalex(1.3); margin: 0;}
.open span:nth-child(2) { display: none;}
.open span:nth-child(3) { transform: translate(0px, 9px) rotate(45deg) scalex(1.3);}
.mobile-nav { background-color: #000000; overflow: hidden;}
.mobile-nav .menuItem { width: 100%; text-align: center;}
.mobile-nav .menuItem a { display: block; padding: 20px; color: #ffffff; text-decoration: none;}
.mobile-nav .menuItem a:hover { display: block; padding: 20px; background-color: #527579; color: #000000;}

/*_+_+_+_+_ Main Styles _+_+_+_+_*/
.mainWrapper {position: relative;}
header { position: relative; z-index: 50;}
header.sticky { height: 80px; position: fixed; width: 100%; background-color: #ffffff; border-bottom: 2px solid #527579;}
header.sticky img { width: 70%;}
header.sticky .mainNav .mainMenu .menuItem a {font-size: 12px;}
header.sticky .mainNav { margin: 25px; margin-bottom: 0px; margin-left: 0px; }
.header { height: auto;}
.header .logo { float: left;}
.header .logo.col-m-3 {width: 19%;}
.header .mainNav { margin: 35px; margin-bottom: 0px;}
.header .mainNav .mainMenu { list-style-type: none;}
.header .mainNav .mainMenu .menuItem { float: left; text-transform: uppercase; border-right: 1px solid #bbe8ed; font-size: 16px; padding:7px;}
.header .mainNav .mainMenu .menuItem:first-child { padding-left:0px;}
.header .mainNav .mainMenu .menuItem:last-child { border:none;}
.header .mainNav .mainMenu .menuItem a { text-decoration: none; padding: 10px; color: #000000;}
.header .mainNav .mainMenu .menuItem a:hover { color: #759194;}
.header .mainNav .mainMenu .menuItem.active a { color: #759194;}
.carousel {
    margin-bottom: 0;
    overflow: hidden;
    position: relative;
	clear: both;
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;
}
#carousel .holding { background-repeat: no-repeat; background-size:cover;}
.carouselCont ol { display: none;}
.carouselCont button { display: none;}
.homepage .blankImg { height: 449px;}
.blankImg { height: 300px;}
.slider-dots { display: none;}
.contentImage { float: left; margin: 0px 30px 20px 0px; }
.one { background-color: orange; height: 347px;}
.row { margin: 0;}
#googleMap { height: 300px;}
.mainContent { margin-top: -20px; z-index: 20; position: relative;}
.mainContent .content-wrapper .cottages { overflow:hidden; text-align: center; margin-bottom: 30px;}
.mainContent .content.floral { background-image: url(../images/floral.jpg); background-size:cover; background-repeat: no-repeat;}
.mainContent .content.floral a { color: #ffffff; text-decoration: underline;}
.mainContent .content.floral a:hover { color: #ffffff; text-decoration: none;}
.mainContent .content { height: 415px; text-align: center; color: #ffffff;}
.mainContent .fullPanel { text-align: left; }
.homepage .mainContent .fullPanel p { color: #ffffff;}
.mainContent .title.border { background-image: url(../images/thin-border.png); background-repeat: no-repeat; background-position: center;}
.cottages .mainContent .title.border { background-image: url(../images/cottageBorder.png); background-repeat: no-repeat; background-position: center;}
.cottages .cottageGallery h1 { background-image: url(../images/thin-border.png); background-repeat: no-repeat; background-position: center;}
.mainCopy .fullPanel { text-align: center;}
.mainCopy a { color: #527579;}
body.homepage h2.contItem { font-size: 17px;}

/*_+_+_+_+_ Content Pages _+_+_+_+_*/
.homepage .contentImage { border-width: 30px; border-style: solid; border-image: url(../images/contentBorder.png) 10%; border-image-repeat: stretch;}
.content-wrapper .right { padding-left: 40px; margin-bottom: 20px;}
.content-wrapper .right .fullPanel { text-align: left;}
.content-wrapper .right .fullPanel img { float: right; margin: 0px 0px 20px 20px;}
.content-wrapper .right h1 { text-align: center;}
.content-wrapper .right h2 { font-weight: 700;}
.content-wrapper .right h4 { font-weight: 700; text-transform: uppercase; text-decoration:underline;}
.content-wrapper .left h2 { font-size: 22px; margin-top: 25px;}
.content-wrapper .left .sideListings { list-style-type: none;}
.content-wrapper .left .sideListings .genInfo { background-color: #c4d0d1; padding: 10px; overflow: hidden;}
.content-wrapper .left .sideListings .info { width: 45px; float: left; text-align: center; color: #527579; background-color: #f0f0f0; padding: 5px 0px; margin-right: 10px;}
.content-wrapper .left .sideListings .butt { background-color: #000000; color: #ffffff; display: block; padding: 8px 7px; width: 45px; margin-right: 0; text-decoration: none; text-transform: uppercase; font-size: 12px;}
.content-wrapper .left .sideListings .rowCott { overflow:hidden; margin-bottom: 30px;}
.content-wrapper .left .sideListings .side.cottage-1 {display: block; background-color: #527579; background-image: url(../images/no1Small.jpg); background-repeat: no-repeat; background-position: top left; width: 100%; height: 28px; margin: 0;}
.content-wrapper .left .sideListings .side.cottage-2 {display: block; background-color: #527579; background-image: url(../images/no2Small.jpg); background-repeat: no-repeat; background-position: top left; width: 100%; height: 28px; margin: 0;}
.content-wrapper .left .sideListings .side.cottage-3 {display: block; background-color: #527579; background-image: url(../images/no3Small.jpg); background-repeat: no-repeat; background-position: top left; width: 100%; height: 28px; margin: 0;}
.content-wrapper .left .sideListings .title a { color: #ffffff; text-decoration: none; padding-left: 50px; padding-top: 5px; display: block;}

/*_+_+_+_+_ Cottages _+_+_+_+_*/
.homepage .cottagePreview { height: auto; overflow: hidden;}
.cottage-1 {display: block; background-color: #527579; background-image: url(../images/no1.jpg); background-repeat: no-repeat; background-position: top left; width: 100%; height: 52px; margin: 0;}
.cottage-2 {display: block; background-color: #527579; background-image: url(../images/no2.jpg); background-repeat: no-repeat; background-position: top left; width: 100%; height: 52px; margin: 0;}
.cottage-3 {display: block; background-color: #527579; background-image: url(../images/no3.jpg); background-repeat: no-repeat; background-position: top left; width: 100%; height: 52px; margin: 0;}
.cottagePreview { background-color: #c4d0d1; height: 660px; position: relative;}
.cottagePreview .title a { display: block; text-decoration: none; color: #ffffff; font-size:28px; font-weight: 300; padding-top: 9px; text-align: left; padding-left: 80px;}
.cottagePreview .more { background-color: #527579; display: block; margin: 20px 15px; }
.cottagePreview .more a { color: #ffffff; text-decoration: none; text-transform: uppercase; display: block; padding: 12px;}
.cottagePreview .more:hover { background-color: #4C666A;}
.cottagePreview .features { background-color: #e2e8e8; list-style-type: inherit; padding: 15px 40px; margin: 0px 15px; text-align: left; font-size:13px; height: 180px;}
.cottagePreview .features li { color: #527579; margin-bottom: 5px;}
.cottagePreview .features li span { color: #000000;}
.cottagePreview .intro { margin: 15px 15px; margin-bottom: 0;}
.content-wrapper .booking-banner { text-align: center; height: 160px; background-image: url(../images/bookingbg.jpg); background-repeat: no-repeat; background-size:cover; padding: 30px;}
.content-wrapper .booking-banner h2 { color: #ffffff; margin-bottom: 40px;}
.content-wrapper .booking-banner a { color: #ffffff; text-transform: uppercase; text-decoration: none; background-color: #199aac; padding: 10px 37px;}
.content-wrapper .booking-banner a:hover { color: #ffffff; text-transform: uppercase; text-decoration: none; background-color: #0cc0d9; padding: 10px 37px;}
.content-wrapper .booking-banner span { color: #ffffff; opacity: 1;}
.cottages .mainCopy .bookingButton { background-color: #527579;}
.cottages .mainCopy .bookingButton:hover { background-color: #1899ab;}
.cottages .mainCopy .bookingButton a { padding: 8px; color: #ffffff; text-decoration: none; display: block; font-size: 21px;}
.cottages .mainCopy .bookingButton span { font-size: 16px;}


.cottages .mainCopy .bookingButtonFoot { background-color: #527579; margin-top: 30px;}
.cottages .mainCopy .bookingButtonFoot:hover { background-color: #1899ab;}
.cottages .mainCopy .bookingButtonFoot a { padding: 13px 8px 8px 8px; color: #ffffff; text-decoration: none; display: block; font-size: 16px;}
.cottages .mainCopy .bookingButtonFoot span { font-size: 16px;}


.cottages .cottageGallery { clear: left;}
.cottages .mainCopy .col-m-6 {text-align: left; padding: 0px 20px;}
.cottages .mainCopy .col-m-6 ul { margin-bottom: 20px;}
.cottages .mainCopy .col-m-6 ul li { font-size:14px; line-height: 22px;}
.cottages .mainCopy h2 { font-weight: 700; font-size: 16px; line-height: 24px;}
.cottages .mainCopy h4 { font-weight: 700; margin-top: 0px; text-decoration:underline;}
.cottages .cottageHolder h4 { text-decoration:none;}
.cottages .mainCopy p { font-size: 14px; line-height: 22px;}
.cottages .title span { color: #199aac;}
.cottages .cottageGallery { margin-top: 30px; overflow: hidden;}
.cottages .cottageFeatures { background-color: #c7d2d3; padding: 10px; margin-top: 20px;}
.cottages .cottageFeatures .innerList { background-color: #e2e8e8; padding: 10px;}
.cottages .cottageFeatures .innerList h4 { text-decoration: underline;}
.cottages .cottageFeatures .innerList p { font-size: 13px; padding-bottom: 8px; text-align: left; line-height: 18px;}
.genInfo .fa { padding-right: 7px; }
.cottageGallery #gallery .galleryImage { margin-bottom: 15px;}
.otherCottages { clear: left; overflow: hidden; padding-top: 50px;}
.otherCottages ul { list-style-type: none;}
.otherCottages ul li { float: left; width: 32%; margin-right: 1.5%;}
.otherCottages ul li:last-child { margin: 0px;}
.otherCottages .sideListings .title a { color: #ffffff; text-decoration: none; font-size: 28px; font-weight: 100; padding-top: 8px; display: block;}
.otherCottages .rowCott { background-color: #c4d0d1;}
.otherCottages .sideListings .info { float: left; text-align: center; color: #527579; background-color: #f0f0f0; padding: 5px 0px; margin: 8px; width: 33%;}
.otherCottages .sideListings .butt { background-color: #000000; color: #ffffff; display: block; padding: 8px 7px; width: 20%; text-decoration: none; text-transform: uppercase; font-size: 12px;}

/*.thumbHolder img:hover {-webkit-transform: scale(2); 
    -moz-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2); -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;}*/

/*_+_+_+_+_ Blog _+_+_+_+_*/
.blog .postPageShare { clear: both; margin-top: 20px;}
.blog .postPageShare a { font-size: 28px; padding-right: 5px;}
.blog .postPageLinks { overflow: hidden;}
.blog .postPageLinks a { color: #527579; text-decoration: none;}
.blog .postPageLinks a:hover { text-decoration: underline;}
.blog .postPageLinks a[rel=next] { float: right; }
.blog .postPageLinks a[rel=prev] { float: left; }
.blog .postPageLinks a[rel=next] i { padding-left: 10px; }
.blog .postPageLinks a[rel=prev] i { padding-right: 10px; }
.blog .newslist { list-style-type: none;}
.blog .newslist a { color: #527579; text-decoration: none; }
.blog .newslist a:hover { text-decoration: underline; }

/*_+_+_+_+_ Contact _+_+_+_+_*/
 textarea{min-height: 8.25rem;}

/*_+_+_+_+_ Firefox _+_+_+_+_*/

@-moz-document url-prefix() { 
	.mainContent { clear: both; }
}

/*_+_+_+_+_ Contact _+_+_+_+_*/
#ajax-contact-form #submit { border:none; background-color: #527579; color: #ffffff; text-transform: uppercase; padding-top: 5px; }
#ajax-contact-form #submit:hover { border:none; background-color: #199aac; color: #ffffff; text-transform: uppercase; }

/*_+_+_+_+_ Footer _+_+_+_+_*/
footer { height: 230px; background-color: #000000;}
footer p { color: #ffffff; font-size: 14px; float: right;}
footer p a { color: #ffffff; text-decoration: none; }
footer p a:hover { text-decoration: underline; }
.footer .twitter h2 { color: #ffffff; margin-top: 15px;}
.footer .twitter a { color: #ffffff;}
.footer .twitter ul { position:relative; background-color: #313131; display: block; margin: 0; list-style-type: none; padding:15px;}
.footer .twitter ul img{ width: 50px; height: auto; float: left; margin-right: 15px; margin-bottom: 60px;}
.footer .twitter ul h4{ padding:0; margin: 0; color: #ffffff; font-size: 14px;}
.footer .twitter ul h5{ padding:0; margin: 0; color: #ffffff; font-size: 12px; }
.footer .twitter ul h5 a { text-decoration: none;}
.footer .twitter ul li span { color: #ffffff; position: absolute; right: 30px; top: 19px; font-size: 10px;}
.footer .footerNav .mainMenu { list-style-type: none; float: right; margin: 20px; margin-right:0px; margin-bottom: 10px;}
.footer .footerNav .mainMenu .menuItem { float: left; text-transform: uppercase; padding: 0px 10px; border-right: 1px solid #bbe8ed;}
.footer .footerNav .mainMenu .menuItem a {color: #ffffff; text-decoration: none; }
.footer .footerNav .mainMenu .menuItem:first-child {padding-left: 0px;}
.footer .footerNav .mainMenu .menuItem:last-child { padding-right: 0px; border:none;}

/*_+_+_+_+_ Responsive _+_+_+_+_*/


@media all and (min-width: 948px) and (max-width: 1195px){
	.header .mainNav { margin-top: 30px; margin-left: 0px; margin-right: 0px;}
	.header .mainNav.col-m-9 { width: 81%;}
	.header .mainNav .mainMenu .menuItem { font-size: 12px;}
	.header .logo.col-m-3 { width: 16%;}
	header.sticky img { width: 100%;}
	.cottagePreview.col-m-4 { width: 33%;}
	.mainContent .fullPanel .col-m-4 { width: 33%;}
	.mainContent .content { height: auto;}
	footer { height: auto;}
	footer .col-m-4 { width: 40%}
	footer .col-m-8 { width: 60%;}
	.footer .footerNav .mainMenu .menuItem { padding: 0px 6px; font-size: 11px;}
	footer p {font-size: 10px;}
	.content-wrapper .booking-banner { height: auto;}
	.content-wrapper .left.col-m-2 { width: 21%;}
	.content-wrapper .right.col-m-10 { width: 79%}
	.cottages .mainCopy.col-m-10 { width: 80%;}
	.cottages .mainCopy.col-m-2 { width: 20%;}
	.cottages .mainCopy .col-m-6 ul { margin-left: 30px;}
	.homepage .blankImg { height: 349px;}
	#carousel .holding { background-position:center;}
	.blankImg { height: 200px;}

}

@media all and (min-width: 750px) and (max-width: 947px) {
	.header .mainNav { display: none;}
	.menu-button { display: block;}
	.cottagePreview.col-m-4 { width: 33%;}
	.homepage .blankImg { height: 349px;}
	#carousel .holding { background-position:center;}
	.blankImg { height: 200px;}
	.cottagePreview .title a { font-size:19px; padding-top:15px;}
	.cottagePreview .intro { font-size: 12px;}
	.homepage .contentImage { display: none; }
	footer { height: auto;}
	.footerNav {display: none;}
	.contact-info { overflow: hidden; margin-top: 20px;}
	.contact-info p { float: left;}
	.content-wrapper .booking-banner { height: auto;}
	.cottagePreview .more a { font-size: 12px;}
	.cottagePreview .features li { font-size: 11px;}
	.cottages .mainCopy p { font-size: 12px;}
	.cottages .mainCopy.col-m-10 { width: 80%;}
	.cottages .mainCopy.col-m-2 { width: 20%;}
	.cottages .mainCopy .bookingButton a { font-size: 16px;}
	.cottages .cottageFeatures .innerList p { font-size: 11px;}
	.content-wrapper .left.col-m-2 { width: 21%;}
	.content-wrapper .right.col-m-10 { width: 79%}
	.content-wrapper .left .sideListings .title a { font-size: 12px;}
	.content-wrapper .left .sideListings .butt { width: 100%; margin-top:10px;}
	.content-wrapper .left .sideListings .info { width: 53px; margin-right: 4px;}

}

@media all and (min-width: 300px) and (max-width: 749px) {
	.header { height: 130px;}
	.header .mainNav { display: none;}
	.menu-button { display: block;}
	.header .logo.col-m-3 { width: 100%;}
	.homepage .blankImg { height: 249px;}
	#carousel .holding { background-position:center;}
	.cottagePreview { padding: 0px!important; margin-bottom: 20px;}
	.homepage .contentImage { display: none; }
	footer { height: auto;}
	.content-wrapper .booking-banner { height: auto;}
	.mainContent .content { height: auto;}
	.footerNav {display: none;}
	.contact-info { overflow: hidden; margin-top: 20px;}
	.footer p { font-size: 11px;}
	.footer .twitter h2 { font-size: 15px;}
	.cottagePreview .title a { font-size: 23px; padding-top: 12px;}
	.cottages .mainCopy.col-m-10 { margin-bottom: 30px;}
	.cottages .mainCopy .bookingButton span { width: 100%; display: block;}
	.cottages .mainCopy .col-m-6 { padding: 0px;}
	.cottages .mainCopy h2 { font-size: 12px;}
	.cottages .mainCopy p { font-size: 11px;}
	.cottages .mainCopy .col-m-6 ul { margin-left: 20px;}
	.cottages .mainCopy .col-m-6 ul li { font-size: 11px;}
	.content-wrapper .right { padding: 0px;}
	.content-wrapper .booking-banner a { display: block; padding:10px;}
	header.sticky img { width: 60%;}

}

@media all and (min-width: 300px) and (max-width: 550px) {

	.content-wrapper .right .fullPanel img { width: 100%;}


}