/*
Theme Name: Trippo
Description: Custom theme for Trippo
Version: 1.0
Author: Stephen Merriman
Author URI: http://www.cre8d-design.com
*/

#togglemenu a:after,
#socialicons ul li a:after,
.content .btn:after,
.content .gallery ul li.video .gall-image:after {
	background-image:url(images/sprite.png);background-repeat:no-repeat;background-color:transparent;
	background-size:56px 216px;
}

img, .wp-caption {max-width:100%;height:auto;}

.clearfix:before, .clearfix:after {content:" ";display:table;}
.clearfix:after {clear:both;}
.clearfix {*zoom:1;}

a img {border:none;}

a:link, a:visited {text-decoration:none;color:#4572AF;}
a:hover, a:active {text-decoration:underline;color:#2C5293;}

p, ul, ol {margin-top:0;margin-bottom:30px;}

.alignleft {float:left;display:inline;margin:0 20px 30px 0;max-width:50%;}
.alignright {float:right;display:inline;margin:0 0 30px 20px;max-width:50%;}
.aligncenter {display:block;margin:0 auto 30px auto;}
.alignnone.wp-caption {margin-bottom:30px;}
.wp-caption img {vertical-align:bottom;}
.wp-caption-text {margin:5px 0 0 0;font-size:14px;font-weight:normal;}

@media screen and (max-width:479px) {
	.alignleft, .alignright {float:none;display:block;max-width:100%;margin-right:auto;margin-left:auto;}
}

@media screen and (max-width:1023px) {
	p, ul, ol {margin-bottom:20px;}
	.alignleft, .alignright, .aligncenter, .alignnone.wp-caption {margin-bottom:20px;}
}

body,html {min-width:320px;}

html {-webkit-text-size-adjust:100%;}

body,input,textarea,select {font-size:18px;color:#1D1D1B;font-family:Lato,sans-serif;}

body {
	margin:0;
	background:#fff;
	line-height:1.6;
}

.container {min-width:300px;max-width:1180px;margin:0 auto;padding:0 10px;}

#header {
	background: #3767a6;
	background: -moz-linear-gradient(top,  #3767a6 0%, #5984be 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3767a6), color-stop(100%,#5984be));
	background: -webkit-linear-gradient(top,  #3767a6 0%,#5984be 100%);
	background: -o-linear-gradient(top,  #3767a6 0%,#5984be 100%);
	background: -ms-linear-gradient(top,  #3767a6 0%,#5984be 100%);
	background: linear-gradient(to bottom,  #3767a6 0%,#5984be 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3767a6', endColorstr='#5984be',GradientType=0 );
	color:#fff;
	padding:20px 0;
}

#menu ul {margin:0;padding:0;list-style:none;font-size:0;}
#menu ul li {margin:0 0 0 2px;padding:0;display:-moz-inline-box;display:inline-block;*display:inline;zoom:1;vertical-align:top;font-size:13px;line-height:35px;text-transform:uppercase;font-weight:900;letter-spacing:0.1em;}
#menu ul li a {color:inherit;display:block;-moz-border-radius:8px;border-radius:8px;text-decoration:none;padding:0 13px 0 14px;}
#menu ul li a:hover, #menu ul li a:active {background:#2C5293;}
#menu ul li.current-menu-item a {background:#6A8FC0;}

#togglemenu {display:none;}
#togglemenu a {color:inherit;display:-moz-inline-box;display:inline-block;*display:inline;zoom:1;vertical-align:top;font-size:13px;line-height:35px;text-transform:uppercase;font-weight:900;letter-spacing:0.1em;text-decoration:none;padding-left:26px;}
#togglemenu a:after {content:"";display:block;background-position: -33px -183px;width:16px;height:12px;position:absolute;top:50%;left:0;margin-top:-6px;}

#logo {margin:0;width:255px;float:left;display:inline;position:relative;}
#logo img {vertical-align:bottom;}

#socialicons {margin-left:25px;}
#socialicons ul {margin:3px 0 4px -20px;padding:0;list-style:none;font-size:0;}
#socialicons ul li {margin:0 0 0 20px;padding:0;font-size:13px;display:-moz-inline-box;display:inline-block;*display:inline;zoom:1;vertical-align:top;}
#socialicons ul li a {text-indent:-9999px;display:block;width:28px;height:28px;overflow:hidden;position:relative;text-align:left;}
#socialicons ul li.facebook a {margin:0 -10px;}
#socialicons ul li.twitter a {margin:0 -6px;}
#socialicons ul li.instagram a {margin:0 -6px;}
#socialicons ul li.tripadvisor a {margin:0 -1px 0 0;}
#socialicons ul li a:after {content:"";display:block;position:absolute;top:50%;left:50%;}
#socialicons ul li.facebook a:after {background-position: -48px -119px;width:8px;height:16px;margin-left:-4px;margin-top:-8px;}
#socialicons ul li.twitter a:after {background-position: -33px -195px;width:16px;height:14px;margin-left:-8px;margin-top:-7px;}
#socialicons ul li.instagram a:after {background-position: -33px -167px;width:16px;height:16px;margin-left:-8px;margin-top:-8px;}
#socialicons ul li.tripadvisor a:after {background-position: -0px -200px;width:27px;height:16px;margin-left:-14px;margin-top:-8px;}

#menuwrap {font-size:0;text-align:right;margin-top:2px;position:relative;margin-left:255px;}
#menu, #socialicons {display:-moz-inline-box;display:inline-block;*display:inline;zoom:1;vertical-align:top;}

.banner {color:#fff;position:relative;background-position:center top;background-repeat:no-repeat;}
.banner-blacktext .banner {color:#1D1D1B;}
.banner .overlay {position:absolute;top:0;left:0;width:100%;height:100%;}
.banner .valign {display:table;width:100%;height:100%;}
.banner .valign .pagetitle {display:table-cell;width:100%;vertical-align:middle;}

.bannerwrap {position:relative;}

.banner-home .pagetitle {padding-top:40px;}
.bannerwrap .banner-desc {padding:30px 0 0 0;text-align:center;position:absolute;top:156px;left:0;width:100%;font-size:24px;font-weight:bold;color:#fff;line-height:32px;}
.bannerwrap .banner-desc span {display:block;padding:0 10px;}
.bannerwrap .banner-desc:before {content:"";display:block;width:160px;margin:0 auto;border-top:2px solid #fff;position:absolute;top:0;left:50%;margin-left:-80px;}

.pagetitle {margin:0;font-size:86px;font-weight:900;font-style:italic;line-height:86px;padding:0 10px;text-align:center;}

.content .pagetitle {margin-bottom:70px;}

#body {padding:80px 0 50px 0;}

.narrow {width:830px;max-width:100%;margin:0 auto;}

.content {text-align:center;}

.content a {font-weight:bolder;}

.content h2 {font-size:24px;line-height:32px;font-style:italic;font-weight:900;margin:70px 0 30px 0;}

.content ul, .content ol {list-style-position:inside;}

.content .btn {width:260px;display:-moz-inline-box;display:inline-block;*display:inline;zoom:1;vertical-align:top;text-transform:uppercase;font-size:24px;font-weight:900;font-style:italic;color:#fff;background:#1d1d1b;text-decoration:none;-moz-border-radius:8px;border-radius:8px;line-height:1;padding:101px 0 20px 0;position:relative;letter-spacing:0.05em;}
.content .btn:hover, .content .btn:active {background:#10100f;}
.content .btn.btn-red {background:#FB5254;}
.content .btn.btn-red:hover, .content .btn.btn-red:active {background:#F93638;}
.content .btn.btn-blue {background:#4572AF;}
.content .btn.btn-blue:hover, .content .btn.btn-blue:active {background:#2C5293;}

.content .btn:after {content:"";display:block;position:absolute;top:20px;left:50%;}
.content .btn.btn-book:after {top:20px;background-position: -0px -0px;width:56px;margin-left:-28px;height:61px;}
.content .btn.btn-location:after {top:27px;background-position: -0px -119px;width:48px;margin-left:-24px;height:48px;}
.content .btn.btn-pricing:after {top:22px;background-position: -0px -61px;width:56px;margin-left:-28px;height:58px;}

.content .btns {font-size:0;margin-left:-80px;display:block;}
.content .btns .btn {margin-left:80px;}

.content .btnswrap {margin:80px 0;}

.content blockquote {font-style:italic;margin:0 40px;padding:0;}

.content .strong1 {font-size:48px;line-height:56px;font-weight:900;font-style:italic;display:inline-block;margin:2px 0;}
.content .strong2 {font-size:32px;line-height:40px;font-style:italic;font-weight:normal;display:inline-block;margin:2px 0;}
.content .larger {font-size:24px;line-height:1.4;}

.content .gallery {width:1180px;max-width:100%;margin:80px auto;}
.content .gallery ul {margin:0 0 -40px -40px;padding:0;list-style:none;font-size:0;text-align:left;}
.content .gallery ul li {margin:0 0 40px 0;padding:0;display:-moz-inline-box;display:inline-block;*display:inline;zoom:1;vertical-align:top;width:305px;font-size:14px;}
.content .gallery ul li .li-a {margin-left:40px;}
.content .gallery ul li .gall-image {display:block;position:relative;}
.content .gallery ul li.video .gall-image:after {content:"";display:block;background-position: -0px -167px;width:33px;height:33px;position:absolute;bottom:10px;right:10px;z-index:10;}
.content .gallery ul li .gall-image img {display:block;}
.content .gallery ul li .gall-caption {display:block;margin-top:8px;line-height:1.4;}

.content hr {width:160px;height:2px;background:#1d1d1b;color:#1d1d1b;border:none;margin:50px auto;}

.content .pricetable {width:690px;max-width:100%;margin:80px auto;text-align:left;}
.content .pricetable:first-child {margin-top:0;}
.content .pricetable:last-child {margin-bottom:30px;}
.content .pricetable ul {margin:0;padding:0;list-style:none;}
.content .pricetable ul li {margin:0 0 35px 0;padding:0;font-size:24px;line-height:1;background:url(images/dots.png) bottom left repeat-x;}
.content .pricetable ul li .label {float:left;display:inline;background:#fff;padding-right:5px;}
.content .pricetable ul li .value {display:block;text-align:right;}
.content .pricetable ul li .value span {display:-moz-inline-box;display:inline-block;*display:inline;zoom:1;vertical-align:top;background:#fff;padding-left:5px;}
.content .pricetable h2 {font-size:28px;}

.content iframe {max-width:100%;}

.content .weatherwidget {width:260px;margin:0 auto;}

.content .googlemap {margin:0 0 30px 0;}
.content .googlemap iframe.scrolloff {pointer-events:none;}

.content .facebookbox {margin:80px auto;}

.content .gallery:last-child {margin-bottom:30px;}
.content .btnswrap:last-child {margin-bottom:30px;}
.content .pricetable:last-child {margin-bottom:30px;}
.content .facebookbox:last-child {margin-bottom:30px;}

@media screen and (max-width:1023px) {		
	#body {padding:40px 0 20px 0;}
	.content .pagetitle {margin-bottom:30px;}
	.content h2 {margin:40px 0 20px 0;}
	.content .gallery {margin:40px auto;}
	.content .gallery:last-child {margin-bottom:20px;}
	.content .btnswrap {margin:40px 0;}
	.content .btnswrap:last-child {margin-bottom:20px;}
	.content .facebookbox {margin:40px auto;}
	.content .facebookbox:last-child {margin-bottom:20px;}
	.content .pricetable {margin:40px auto;}
	.content .pricetable:last-child {margin-bottom:20px;}
	
	.pagetitle {font-size:64px;line-height:64px;}
	
	.content .strong1 {font-size:36px;line-height:44px;}
	.content .strong2 {font-size:28px;line-height:36px;}
	.content .pricetable h2 {font-size:26px;}
	
	.content .pricetable ul li {font-size:22px;margin-bottom:23px;}
	
	.content .googlemap {margin-bottom:20px;}
	
	.bannerwrap .banner-desc {padding-top:0;margin-top:50px;position:relative;top:auto;left:auto;color:#1D1D1B;}
	.bannerwrap .banner-desc:before {display:none;}	
}
@media screen and (max-width:767px) {	
	.pagetitle {font-size:32px;line-height:40px;}
	
	.content .strong1 {font-size:28px;line-height:36px;}
	.content .strong2 {font-size:24px;line-height:32px;}
	.content .larger {font-size:18px;line-height:1.6;}
	
	.content .pricetable ul li {font-size:18px;}
	.content .pricetable h2 {font-size:22px;}
}
@media screen and (max-width:479px) {
	body {font-size:16px;}
	.banner-home .pagetitle {padding-top:15px;font-size:28px;}
	
	.content .pricetable ul li {font-size:14px;}
	.content .pricetable h2 {font-size:20px;}
}

.content h2:first-child {margin-top:0;}
.content .pricetable:first-child {margin-top:0;}
.content .btnswrap:first-child {margin-top:0;}
.content .gallery:first-child {margin-top:0;}
.content hr + h2 {margin-top:0;}

#footer {background:#1D1D1B;color:#fff;padding:35px 0;}
#footer ul {margin:0 0 0 -30px;padding:0;list-style:none;font-size:0;text-align:center;}
#footer ul li {margin:0 0 0 30px;padding:0;display:-moz-inline-box;display:inline-block;*display:inline;zoom:1;vertical-align:top;font-size:14px;line-height:30px;}
#footer a {color:inherit;}
#footer ul li.design a {color:#777776;}
#footer ul li.design a:hover, #footer ul li.design a:active {color:#919191;}
#footer ul li .fb-like span {vertical-align:middle !important;}

@media screen and (min-width:1500px) {
	.banner {margin-top:10px;}
}
@media screen and (max-width:1220px) {
	.content .gallery {width:875px;}
}
@media screen and (min-width:1181px) {
	.banner {padding-bottom:0 !important;}
}
@media screen and (max-width:1180px) {
	.banner {height:0 !important;background-size:cover;}
}
@media screen and (max-width:1023px) {
	#logo {float:none;display:block;margin:0 auto 20px auto;}
	#menuwrap {text-align:center;margin-left:0;}
	.content .btns {margin-left:-64px;}
	.content .btns .btn {width:200px;margin-left:64px;}
}
@media screen and (max-width:915px) {
	.content .gallery {width:570px;}
}
@media screen and (max-width:767px) {
	#menu ul {display:none;}
	body.menuopen #menu ul {display:block;}
	
	#menuwrap {padding-top:35px;}
	#togglemenu {display:block;position:absolute;top:0;left:0;}
	#socialicons {position:absolute;top:0;right:0;}
		
	#menu {display:block;text-align:left;}
	#menu ul li {display:block;margin:5px 0;}
	#menu ul li a {background:none !important;padding:0;}
	
	#header {padding-bottom:8px;}
	#logo {margin-bottom:8px;}
	
	.content .btns {width:260px;margin:0 auto -20px auto;}
	.content .btns .btn {margin-left:0;width:260px;margin-bottom:20px;}
}
@media screen and (max-width:610px) {
	.content .gallery {width:265px;}
}

@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi) {
	#togglemenu a:after,
	#socialicons ul li a:after,
	.content .btn:after,
	.content .gallery ul li.video .gall-image:after {
		background-image:url(images/sprite@2x.png);
	}	
	#logo a {text-indent:-9999px;display:block;background:url(images/logo@2x.png) top left no-repeat;background-size:100%;}
}