




/** START MAIN CONTENT BLOCK **/
/** ------------------------ **/

.small-12.columns.main-content {
	padding: 45px;
	padding-left: 45px;
	padding-right: 45px;
	margin-bottom: 0px;
	padding-bottom: 0px;
	max-width: 1200px;
}

.side-column {
	position: absolute;
	height: 100%;
	right:0;
}

#home-content-slider{
	visibility: visible;
	position:relative;
	background-color: #fff;
	/*min-height: 400px;*/
}
#home-content-slider .small-8 {
	position:relative;
}
#home-content-static{
	display: none;
}
#home-content-static img{
	margin-top: -6px;
}


.orbit-container{
	width: auto;
}

.orbit-container .orbit-slide-number,
.orbit-container .orbit-prev, .orbit-container .orbit-next{
	display: none;
}

.orbit-container .orbit-bullets
{
	position: absolute;
	z-index: 5000;
	left: 50%;
	margin: 0;
	top: 70%;
}
.orbit-container .orbit-bullets li.active{
	background: none;
	border: 2px solid #ffffff;
}

.orbit-container .orbit-timer{
	display: none; /*pause button*/
}

.active .marquee-text, .active .marquee-text a {
	display:inline-block !important;

}


.tab-holder span {
	font-family: "Quadon Bold";
}
.marquee-text{
		
	color: #0659a1;
	font-size: 20px;
	padding: 15px 0 0 30px;
	background-color: #FFFFFF;
	width: 100%;
	height: 100px;
	z-index: 1;
	display: none !important;

}
.marquee-text a{
	color: #0659a1;
	font-family: "Quadon Italic";

}



.tab-holder,
.tab-holder-small {
	position: relative;
	height: 43px;
}

.tab-holder svg,
.tab-holder-small svg {
	position: absolute;
	left: 0;
	height: 43px;
	width: 100%;
}

.tab-holder svg {
	background-color: #0659a1;
}



.tab-holder div,
.tab-holder-small div {
	z-index: 1;
	text-align: center;
	pointer-events: none;
	margin-top: 13px;
	-webkit-transition:  all 0.3s ease;
	-moz-transition:  all 0.3s ease;
    transition: all 0.3s ease;
}

.tab-holder-small div{
	margin-top: 15px;
}

svg path {
	-webkit-transition:  all 0.3s ease;
	-moz-transition:  all 0.3s ease;
    transition: all 0.3s ease;
    fill: #efefef;
    pointer-events:all;
    cursor: pointer;
}

path:hover {
	fill: #fccf5d;
}

path.tab-selected {
	fill: #FFF;
}

path.tab-selected:hover {
	fill: #FFF;
}


.tab-holder span, .tab-holder-small span {
	color: #053f73;
	font-size: .875em;
	font-family: "Quadon Bold";
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    display: block;
}

.tab-holder div span.tab-selected, .tab-holder-small div span.tab-selected {
	color: #333;
}

.reservations{
	position: relative;
	background-color: #FFFFFF;
	width: 100%;
	margin-left: 0;
	margin-bottom: 0;
	height: auto;

}


/* New Reservation */
.reservations ul {
	margin: 0;
}
#new-reservation form div,
#small-new-reservation form div{
	text-align: center;
	
}


.reservations .row {

	margin-top: 15px;
}



}
.new-reserve-arrow{
	padding-left: 110px;
	margin: -1px -1px -1px 0px;
}


#travel-date{
	position: relative;
}




/* Pop-up Calendar Styling */

.calendar .months{
	background-color: #fccf5d;
	border: 1px solid #b88d23;
}
.calendar .months > span{
	font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, sans-serif;
	font-size: 0.9em;
}
.calendar table tbody tr td > span{
	font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, sans-serif;
}








.button-block {
	position: absolute;
	bottom: 5%;
	width: 100%;
	text-align: center;
	height: auto;
}
.button-block a {
	display:inline-block;
}

#captains-card{
	width: 100%;
}
#captains-card a, #directions a {
	border: none;
	border-top: 1px solid #cccccc;
	font-family: "Trebuchet MS";
	font-size: 18px;
	color: #4169e1 ;
	padding: 15px 55px;
	background-repeat: no-repeat;
	
}

#captains-card a{
	background-image: url(../img/icons/captains-card.png), url(../img/icons/reservation-arrow.png);
	background-position: 0% 50%, 99% 50%;
}


#directions a{
	background-image: url(../img/icons/directions.png), url(../img/icons/reservation-arrow.png);
	background-position: 4.5% 50%, 99% 50%;
}


#change-reservation,
#small-change-reservation{
	text-align: center;
	display: none;
	margin-left: 0;
}

#cr-last-name div input{
	padding-left: 10px;
}


#small-change-reservation form > .row > div > input{
	padding-left: 7px;
}

#small-submit-reserve{
	margin-top: 25px;
}

/*small reservation block*/
#small-reservation-tab{
	display: none;
	margin-top: -15px;
}

#small-reservation-tab > .reservations{
	height: 100%;
	padding-top: 16px;
}

#travel-date-small img{
	position: absolute;
	top: 6px;
	right: 9px;
}

#reserve-tablet,
#change-reserve-tablet{
	margin: 0 10px 0 10px;
	text-align: center;
	border-top: 1px solid #cccccc;
}
#reserve-tablet > li,
#change-reserve-tablet > li{
	padding-top: 15px;
	padding-bottom: 15px;
	margin: 10px 0 10px 0;
	text-align: left;
}
#reserve-tablet > li > a,
#change-reserve-tablet > li > a{
	font-family: "Trebuchet MS";
	font-size: 16px;
	color: #0659a1;
	display: block;
}

#reserve-table-cc,
#change-reserve-table-cc{
	border-right: 1px solid #cccccc;
}


#reserve-arrow1-tablet,
#change-reserve-arrow1-tablet{
	float: right;
	margin: 7px 10px 0 0;
}
#cc-icon-tablet,
#change-cc-icon-tablet{
	padding-right: 20px;
}
#direction-icon-tablet,
#change-direction-icon-tablet{
	margin: 0 20px 0 15px;
}
#reserve-arrow2-tablet,
#change-reserve-arrow2-tablet{
	float: right;
	margin: 6px 0 0 0;
}

/*mobile new reserve*/


#reserve-mobile > li > a,
#change-reserve-mobile > li > a{
	font-family: "Trebuchet MS";
	font-size: 16px;
	color: #0659a1;
	display: block;
}
#mobile-cc,
#change-mobile-cc{
	border-top: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	padding: 15px 0 15px 0;
}
#cc-icon-mobile,
#change-cc-icon-mobile{
	padding-right: 20px;
	padding-left: 15px;
}
#reserve-arrow1-mobile,
#change-reserve-arrow1-mobile{
	float: right;
	margin: 7px 15px 0 0;
}
#mobile-directions,
#change-mobile-directions{
	padding: 15px 0 15px 0;
	border-bottom: 1px solid #cccccc;
}
#direction-icon-mobile,
#change-direction-icon-mobile{
	margin: 0 34px 0 29px;
}
#reserve-arrow2-mobile,
#change-reserve-arrow2-mobile{
	float: right;
	margin: 6px 15px 0 0;
}


/** END MAIN CONTENT BLOCK **/
/** ------------------------ **/



/** START ADVERTISEMENT BLOCK **/
/** ------------------------ **/

#content-blocks{
	margin-top: 60px;
	margin-bottom: 15px;
}

#content-captions{
	text-align: center;
	font-family: "Quadon";
	font-style: italic;
	font-size: 18px;
	color: #0659a1;
	visibility: visible;
}
#content-captions li a{
	color: inherit;
}
#content-captions li a:hover{
	text-decoration: underline;
}

#content-blocks .show-for-small{
	text-align: center;
}

#content-medium {
	clear:both;
}

#content-medium li a img:hover,
#content-blocks div a img:hover{
	opacity: 0.7;
}

#content-medium-text{
	display: none;
	font-family: "Quadon";
	font-style: italic;
	font-size: 24px;
	color: #053f73;
	text-align: center;
}

/** END ADVERTISEMENT BLOCK **/
/** ------------------------ **/










/** START MEDIA QUERIES **/
/** ------------------- **/


/** Large Screen **/



@media only screen and (min-width: 1226px){

.reservations .row {
		margin-top: 31px;
	}
}


@media only screen and (max-width: 1190px){
	/*reservation tabs become off-centered*/
	#changeTabText span{
		margin-left: 10px;
	}

	.button-block {
		bottom: 3%;
	}
}



@media only screen and (min-width: 1024px) and (max-width: 1180px) {
	#changeTabText span{
		margin-top: -6px;
		margin-right: 17px;
	}
	#newTabText span{
		width: 73%;
		margin-top: -6px;
		margin-left: 17px;
	}

	div.row#submit-reserve {
		margin-top: 15px;
	}


	#captains-card {
		width: 100%;
	}

	#captains-card a {
		padding: 15px 60px;
	}

	#directions a {
		padding: 12px 60px;
	}

}



@media only screen and (max-width: 1023px) {

	#captains-card a {
		padding: 12px 60px;
	}

	#directions a {
		padding: 10px 60px;
	}
}


@media only screen and (max-width: 994px){
	/*reservation tab text splits into two lines*/
	.tab-holder div{
		margin-top: 6px;
	}
	#newTabText{
		padding-left: 25px;
	}



	#newTabText span{
		width: 81%;
		margin-left: 3px;
	}
}

@media only screen and (max-width: 992px){
	#captains-card a {
		padding: 15px 60px;
	}

	#directions a {
		padding: 8px 60px;
	}

}


/* main header too big at ~941px */
@media only screen and (max-width: 59em){

	.marquee-text{
		font-size: 16px;
		height: 85px;
	}
}

@media only screen and (max-width: 970px){

	.button-block {
		bottom: 1%;
	}
}

@media only screen and (min-width: 768px) and (max-width: 980px){
	/* home page new reservation */
	#start-reservation{
		font-size: 18px;
		height: initial;
	}


	#captains-card a{
		font-size: 16px;
	}
	#cc-icon{
		padding-right: 8px;
	}
	#reserve-arrow1{
		margin-left: 20px;
	}

	#directions a{
		font-size: 16px;
		padding: 10px 60px;
	}
	#direction-icon{
		margin: 0 20px 0 9px;
	}

	.columns#submit-reserve{
		margin-top: 20px;
	}
	.columns#submit-reserve,
	div.large-12#captains-card{
		margin-top: 16px;
	}
	#captains-card a{
		padding: 11px 50px;
	}
	#directions a {
		padding: 11px 50px;
	}
	div.large-12#directions{
		margin-top: 8px;
	}

	#handicap {
		margin-bottom: 18px;
	}

	/*change reservation*/
	#change-reservation form > div > input{
		padding-right: 57px;
	}
	/*#cr-last-name > input,{*/
	#change-reservation form >  #cr-last-name > input.reserve-date{
		margin-top: 15px;
	}
	/*#cr-travel-date > input,{*/
	#change-reservation form >  #cr-travel-date > input.reserve-date{
		margin-top: 7px;
	}
	#change-reserve{
		padding-left: 30px;
		padding-right: 30px;
	}

	#btn-change-reserve{
		font-size: 18px;
	}
	#submit-cr > a{
		padding: 0px;
	}

}


@media only screen and (max-width: 904px) { /* 56.5em */

	#content-captions{
		font-size: 15px;
	}

}

@media only screen and (max-width: 895px){

	#new-reservation select, #new-reservation .date-input {

		height: 30px;
		padding-top: 2px;
		padding-bottom: 2px;

	}

	#cr-last-name div input {
		/*height: 30px;*/
		height: 40px;
		padding-top: 2px;
		padding-bottom: 2px;
	}

	

	#captains-card a {
		padding: 15px 20px 15px 60px;
	}
	#directions a {
		padding: 15px 20px 15px 60px;
	}

	/*#start-reservation {
		padding: 5px 0px 5px 0px;
	}*/


	#handicap {
		margin-bottom: 13px;
	}


	/*.date-input-icon { 
		top: 2px;
		right: 8px;
	}*/
	.date-input-icon {

                top: 0px;
                right: 0px;
        }

}




@media only screen and (max-width: 804px) { /* 50.250em */
	#newTabText{
		padding-left: 20px;
	}
}

@media only screen and (max-width: 785px){
	#handicap{
		margin-top: 5px;
	}
}





/** Medium Screen **/
/* TABLET SIZE */
@media only screen and (max-width: 48em) { /* 768px */
	/**MAIN CONTENT**/
	#home-content-slider,
	#content-captions{
		display: none !important;
		height: 0;
	}
	#content-medium{
		margin-left: 3px;
		margin-right: 3px;
	}

	#home-content-static{
		display: block;
	}
	#home-content-static img{
		width: 100%;
	}

	#small-reservation-tab{
		display: block;
	}

	
}

@media only screen and (min-width: 640px) and (max-width: 768px) {
	#content-medium-text{
		display: block;
	}
}

/*Small Nav Bar*/

@media only screen and (max-width: 40em) { /* 640px */
	/**RESERVATIONS**/
	#small-home-reserve{
		margin-bottom: 420px;
	}

	#content-medium-text{
		display: block;
		margin: 25px 0 15px 0;
	}

	.reservations .row {
		margin-top: 20px;
	}

	
}

@media only screen and (max-width: 400px){

	#cc-icon-mobile,
	#change-cc-icon-mobile{
		padding-right: 10px;
	}
	#direction-icon-mobile,
	#change-direction-icon-mobile{
		margin-right: 25px;
	}
}





@media only screen and (max-width: 350px){
	.tab-holder-small div{
		margin-top: 7px;
	}
	#small-newTabText span{
		width: 125px;;
		margin-left: 20px;
	}
	#small-changeTabText span{
		width: 150px;
		margin-left: 9px;
	}
}



@media only screen and (max-width: 330px){
	#small-newTabText span{
		margin-left: 13px;
	}
	#small-changeTabText span{
		margin-left: 5px;
	}
}