


@media only screen and (max-width: 1060px)
{	
	H1{color: #606060; font-size: 40px; line-height: 46px; letter-spacing: -3px}
	H1.small{font-size: 34px; line-height: 40px}
	
	/************************* NAV *******************/
	#icon-menu{width: 20px; height: 21px; cursor: pointer; position: absolute; right: 0%; top: 50px; display: block}
	
	#main-nav{text-align: left; width: calc(100% - 2px); border: solid 1px #c8c8c8; border-top: none; border-bottom: none; position: relative; left: 0px; top: 0px; z-index: 80; overflow: hidden}
	#main-nav:after{display: none}
	P.main-nav-inactive{display: none}
	P.main-nav-active{display: block}	

	#main-nav A.nav{color: #000; font-size: 14px; line-height: 14px; font-weight: normal; letter-spacing: 0px; width: calc(50% - 20px); margin: 0px 0px 0px -1px; padding: 15px 0px 13px 20px; border: solid 1px #c8c8c8; border-right: none; border-top: none; display: inline-block; background: #fff}
	#main-nav A.nav:hover{border: solid 1px #c8c8c8; border-right: none; border-top: none; background: #e8e8e8}
	#main-nav A.nav-active, #main-nav A.nav-active:hover{color: #fff; border: solid 1px #c8c8c8; border-right: none; border-top: none; background: #888}

	/************************* HOME *******************/
	#slide, #next{width: 150%; margin-left: -25%}		
	
	DIV.partners{padding: 50px 0px 50px 0px}
	DIV.partners-left{width: 400px}
	DIV.partners-right{width: calc(100% - 400px)}
	DIV.partners-left, DIV.partners-right{vertical-align: top}
	DIV.partners-right P.link{margin-bottom: 0px}	
	
	/************************* INNER PAGE BANNERS *******************/
	#banner IMG{width: 150%; margin-left: -25%}		

	/************************* YACHT LISTINGS PAGE *******************/
	#sub-menu LI A{padding-left: 35px; padding-right: 35px}
	
	/************************* YACHT DESCRIPTIONS PAGE *******************/	
	#popup{width: 90%; margin: 0px 0px 0px -10px; left: 5%}	
	
	/************************* CHARTER PAGE *******************/
	#charter-page UL{margin-left: 0px; margin-right: 0px}	
	
	/************************* CHARTER PAGE ITINERARIES SECTION *******************/
	DIV.dive-site{padding: 30px}
	DIV.dive-site-text P{margin-left: 30px}
	DIV.dive-site-even DIV.dive-site-text P{margin-right: 30px}
	DIV.charter-itineraries-map{margin-top: 30px}

	/************************* CHARTER PAGE AZIMUT SECTION *******************/
	#charter-popup{width: 90%; margin: 0px 0px 0px -10px; left: 5%}

	/************************* CHARTER PAGE RESERVATIONS SECTION *******************/
	#charter-reservations-section{padding-left: 0px; padding-right: 0px}
	
	#charter-contact-form-inner{margin-left: 35px}
	DIV.charter-type{width: 50%}
	DIV.charter-type-bottom{margin: 15px 0px 0px 0px}	
	
	/************************* ABOUT US PAGE *******************/
	DIV.about-staff{padding: 50px 0px 50px 0px}
	DIV.about-left{width: 312px}
	DIV.about-left IMG{width: 300px; height: 300px}
	DIV.about-right{width: calc(100% - 312px)}	
	DIV.about-right-odd H2, DIV.about-right-odd P{padding-left: 40px}
	DIV.about-right-even H2, DIV.about-right-even P{padding-right: 40px} 

	/************************* CONTACT PAGE *******************/
	#contact-left{width: 220px}
	#contact-right{margin: 0px 0px 0px 260px}	
	FORM.contact-table{padding-top: 20px}
	FORM.contact-table DIV.contact-left{width: 100%; padding: 5px 0px 5px 0px; clear: both; float: none}
	FORM.contact-table DIV.contact-left P.label{text-align: left; padding: 0px 0px 0px 2px}
	FORM.contact-table DIV.contact-left P.message-label{padding-top: 0px}
	FORM.contact-table INPUT.submit{margin-top: 0px}
	FORM.contact-table DIV.contact-right{width: 100%; padding: 0px 0px 10px 0px; float: none}
}

@media only screen and (max-width: 850px)
{
	/************************* CONTAINER *******************/
	#shadow-border{margin-bottom: 20px}	
	
	/************************* FOOTER *******************/
	DIV.footer-col{width: calc(50% - 100px)}
	DIV.footer-col-3{width: 140px; padding-left: 59px}	
	
	/************************* FOOTER SUB *******************/
	#footer-sub P.main A{font-size: 12px; line-height: 12px}
	#footer-sub P.main SPAN{padding: 0px 10px 0px 10px}	

	/* HOME */
	DIV.partners-right{width: 100% ; display: block}
	DIV.partners-left{display: none}
	DIV.partners-right IMG{width: 100%; max-width: 489px; height: auto; margin: 5px auto 30px; display: block}

	#home-partners H2, #home-partners P{text-align: center; padding-left: 0px; padding-right: 0px}
	DIV.partners-right P.link{margin-top: 35px; padding-bottom: 10px}

	/************************* YACHT LISTINGS PAGE *******************/	
	DIV.yacht-placeholder-outer{width: calc(50% - 10px); margin: 0px 0px 20px 0px}
	DIV.yacht-placeholder-spacer{width: 20px; display: inline-block}
	DIV.yacht-placeholder-spacer-2, DIV.yacht-placeholder-spacer-4, DIV.yacht-placeholder-spacer-6, DIV.yacht-placeholder-spacer-8, DIV.yacht-placeholder-spacer-10, DIV.yacht-placeholder-spacer-12{display: none}
	P.yacht-placeholder-text-intro{font-size: 14px; line-height: 20px}	
	
	/************************* YACHT DESCRIPTIONS PAGE *******************/	
	DIV.img-stock-yacht{width: 48%}
	
	/************************* CHARTER PAGE *******************/
	#charter-page UL{padding: 0px 20px 0px 21px}	
	
	/************************* CHARTER PAGE ITINERARIES SECTION *******************/
	#charter-itineraries-buttons{max-width: 500px}
	#charter-button-similan, #charter-button-dining{margin-top: 10px}
	
	DIV.dive-site-text P{margin-left: 25px}
	DIV.dive-site-even DIV.dive-site-text P{margin-right: 25px}

	/************************* CHARTER PAGE DINING SECTION *******************/
	#charter-dining-photos DIV.outer{width: 50%}
	#charter-dining-photos DIV.outer-1 DIV.inner, #charter-dining-photos DIV.outer-3 DIV.inner{margin: 0px; margin-right: 10px}
	#charter-dining-photos DIV.outer-2 DIV.inner, #charter-dining-photos DIV.outer-4 DIV.inner{margin: 0px; margin-left: 10px}
	#charter-dining-photos DIV.outer-1 DIV.inner, #charter-dining-photos DIV.outer-2 DIV.inner{margin-bottom: 20px}

	/************************* ABOUT US PAGE *******************/
	DIV.about-left{display: none}
	DIV.about-right{width: 100%}	
	DIV.about-right-odd H2, DIV.about-right-odd P{text-align: center; padding-left: 0px}
	DIV.about-right-even H2, DIV.about-right-even P{text-align: center; padding-right: 0px} 
	DIV.about-right IMG{width: 90%; max-width: 450px; margin: 5px auto 30px; padding: 5px; border: solid 1px #d0d0d0; display: block}
}

@media only screen and (max-width: 760px)
{
	H1.small{color: #606060; font-size: 40px; line-height: 46px; letter-spacing: -3px}
	
	/************************* TILES *******************/
	A.tile{width: calc(50% - 6px)}
	A.tile-1, A.tile-2{margin-bottom: 45px}
	DIV.tile-spacer-2{display: none}
	A.tile P.collection{font-size: 16px; line-height: 16px; font-weight: bold}			
	
	/************************* FOOTER *******************/
	#footer{text-align: center}
	#footer DIV.container{max-width: 500px}
	DIV.footer-col{width: 100%; margin: 0px; padding: 0px; border: none; float: none}
	DIV.footer-col-1{margin: 40px 0px 40px 0px; padding: 40px 0px 40px 0px; border: solid 1px #808080; border-left: none; border-right: none}
	DIV.footer-col P.address{padding-right: 0px}
		
	DIV.footer-col-3 DIV{width: 50%; display: inline-block}
	DIV.footer-col-3 DIV.elan{margin: 0px}
		
	/************************* FOOTER SUB *******************/
	#footer-sub{padding-top: 30px} 
	#footer-sub P.main{margin-bottom: 20px; padding-bottom: 0px}
	#footer-sub P.main A{font-size: 14px; line-height: 14px; padding: 10px 0px 10px 0px; border-top: solid 1px #d0d0d0; display: block}
	#footer-sub P.main A:hover{color: #fff; background: #404040}
	#footer-sub P.main SPAN{display: none}

	/* HOME */
	#yacht-charters DIV.container{padding: 50px 0px 50px 0px}
	#yacht-charters H2, #yacht-charters H2 SPAN{font-size: 60px; line-height: 75px; letter-spacing: -2px}
	#yacht-charters H2 SPAN.kern-less{letter-spacing: 0px}
	#yacht-charters H2 SPAN.kern-more{letter-spacing: -10px}

	#yacht-charters P.intro{font-size: 26px; line-height: 26px; letter-spacing: -1px; padding: 0px 0px 50px 0px}
	#yacht-charters P.read-more A{color: #fff; font-size: 24px; line-height: 24px; border: solid 1px #fff}
	
	/************************* YACHT DESCRIPTIONS PAGE *******************/	
	DIV.img-stock-yacht{width: 100%; clear: both; float: none}
	#yacht-descriptions-left P.left, #yacht-descriptions-left P.right{width: 40%}
	#yacht-descriptions-left P.right{width: 60%}	
	
	/************************* CHARTER PAGE AZIMUT SECTION *******************/	
	#charter-azimut-amenities{width: auto; padding: 0px; border: none}
	DIV.charter-azimut-amenities{width: 100%}
	DIV.charter-azimut-amenities-left P{margin-right: 0px}
	DIV.charter-azimut-amenities-right P{margin-left: 0px}	
		
	DIV.charter-azimut-amenities P.fridge{background: #f0f8ff url(../charters/images/icon-fridge.png) no-repeat 10px center}
	DIV.charter-azimut-amenities P.tea{background: url(../charters/images/icon-tea.png) no-repeat 10px center}
	DIV.charter-azimut-amenities p.microwave{background: #f0f8ff url(../charters/images/icon-microwave.png) no-repeat 10px center}
	DIV.charter-azimut-amenities P.cooking{background:  #fff url(../charters/images/icon-cooking.png) no-repeat 10px center}
	DIV.charter-azimut-amenities P.dinghy{background: #f0f8ff url(../charters/images/icon-dinghy.png) no-repeat 10px center}
	DIV.charter-azimut-amenities P.snorkel{background: #fff url(../charters/images/icon-snorkel.png) no-repeat 10px center}	
	
	#charter-azimut-specs{width: auto; margin: 0px auto 0px; padding: 0px; border: none}
	#charter-azimut-specs-left, #charter-azimut-specs-right{width: 100%}
	#charter-azimut-specs-left P.charter-azimut-specs-left{margin-right: 0px}
	#charter-azimut-specs-left P.charter-azimut-specs-right{right: 12px}
	#charter-azimut-specs-right P.charter-azimut-specs-left{margin-left: 0px}		
	
	/************************* CHARTER PAGE RESERVATIONS SECTION *******************/
	TABLE.charter-prices TD{font-size: 20px; line-height: 28px; letter-spacing: 0px}	
	
	#charter-contact-personnel{width: auto; display: block}
	DIV.charter-contact-personnel{width: 50%; display: inline-block}
	DIV.charter-contact-personnel-right{margin: 0px}
	DIV.charter-contact-personnel-left DIV{margin: 0px 5px 0px 0px}
	DIV.charter-contact-personnel-right DIV{margin: 0px 0px 0px 5px}

	#charter-contact-form{width: auto; display: block}
	#charter-contact-form-inner{margin: 40px 0px 0px 0px}		

	/************************* CONTACT AND FIND A YACHT PAGES *******************/
	#contact-right{width: 100%; margin: 0px; padding: 0px 0px 10px 0px; background: none}
	#contact-left{display: none}	
	
	#contact-right H1, #contact-right P.intro{text-align: center}
	
	FORM.contact-table{padding: 25px 25px 15px 25px}
	FORM.contact-table DIV.contact-left{width: 25%; padding: 8px 0px 10px 0px; clear: both; float: left}
	FORM.contact-table DIV.contact-right{width: 75%; padding: 0px 0px 15px 0px; float: right}

	FORM.contact-table DIV.contact-left P.label{text-align: right; padding: 0px 10px 0px 10px}
	FORM.contact-table DIV.contact-left P.message-label{padding-top: 65px}
	FORM.contact-table INPUT.submit{margin-top: 10px}	

	P.success{padding-bottom: 50px}
}

@media only screen and (max-width: 660px)
{
	/************************* YACHT LISTINGS PAGE *******************/	
	#sub-menu LI A{padding-left: 10px; padding-right: 10px}

	/************************* CHARTER PAGE ITINERARIES SECTION *******************/
	DIV.dive-site-odd{background: #fff}
	DIV.dive-site{padding-left: 0px; padding-right: 0px}
	DIV.dive-site-image{display: none}
	DIV.dive-site-text{width: 100%}
	DIV.dive-site-text IMG{width: 100%; max-width: 400px; margin: 10px auto 35px; display: block}
	DIV.dive-site-odd DIV.dive-site-text P, DIV.dive-site-even DIV.dive-site-text P{text-align: center; margin: 0px}
	DIV.charter-itineraries-map{margin-top: 35px}
}

@media only screen and (max-width: 599px)
{
	/************************* NAV *******************/
	#main-nav{width: calc(100% - 1px); border-left: none}
	#main-nav A.nav{width: auto; margin: 0px; display: block}		
	
	/************************* NEW BOATS PAGE *******************/
	#new-boats-brands{padding-bottom: 40px}
	DIV.new-boats{width: 100%; margin-bottom: 10px}
	DIV.new-boats-spacer{display: none}	
	DIV.new-boats A P{font-size: 28px; line-height: 28px; padding: 15px 0px 15px 0px}
	DIV.new-boats A P SPAN{font-size: 14px; line-height: 14px}	

	/************************* YACHT LISTINGS PAGE *******************/	
	#sub-menu LI A{padding-left: 5px; padding-right: 5px}
	#stock-search{padding-left: 0px}
	
	/************************* YACHT DESCRIPTIONS PAGE *******************/	
	#yacht-descriptions-page{padding-bottom: 15px}
	#yacht-descriptions-header{margin: 0px; padding: 0px 0px 5px 0px; border: none}
	#yacht-descriptions-header P{padding: 0px 0px 15px 0px}
	#yacht-descriptions-left{width: 100%; margin: 0px; float: none}
	#yacht-descriptions-right{width: 100%; margin: 10px 0px 0px 0px; float: none}
	#previously-viewed-content{display: none}
	
	/************************* CONTACT PAGE *******************/
	FORM.contact-table{padding: 20px}
	FORM.contact-table DIV.contact-left{width: 100%; padding: 5px 0px 5px 0px; float: none}
	FORM.contact-table DIV.contact-left P.label{text-align: left; padding: 0px 0px 0px 2px}
	FORM.contact-table DIV.contact-left P.message-label{padding-top: 0px}
	FORM.contact-table INPUT.submit{margin-top: 0px}
	FORM.contact-table DIV.contact-right{width: 100%; padding: 0px 0px 10px 0px; float: none}
	FORM.contact-table INPUT, FORM.contact-table TEXTAREA{width: 97%}	
}

@media only screen and (max-width: 480px)
{
	BODY{background: #fff url(../images/bg-body.png) repeat-x 0px 115px}
	#container{padding-top: 85px; background: url(../images/logo.png) no-repeat -84px 5px}
	#shadow-border{margin-bottom: 15px}
	#icon-logo{width: 184px; height: 45px; top: 25px}
	#icon-menu{top: 35px}

	/************************* FONTS *******************/
	H1, H1.small{color: #000; font-size: 36px; line-height: 42px; letter-spacing: -2px}
	H2{color: #000}
	P.intro, P.intro A{color: #101010; font-size: 18px; line-height: 26px}	
	
	/************************* TILES *******************/
	A.tile{width: 100%; margin: 0px 0px 45px 0px; display: block}
	A.tile-4{margin-bottom: 0px}
	A.tile P.collection{font-size: 18px; line-height: 18px; font-weight: normal; margin: 0px; padding: 25px 0px 15px 0px; border-top: none}
	DIV.tile-spacer{display: none}
	
	/************************* NEW BOATS MENU *******************/
	#new-boats-page A.menu{width: 100%; margin: 5px 0px 15px 0px}
	#new-boats-page A.menu-bottom{margin-bottom: 0px}
	#new-boats-page DIV.menu-spacer{display: none}
	
	/************************* YACHT LISTINGS PAGE *******************/	
	#sub-menu{padding: 0px}
	#sub-menu LI{margin: 0px 0px -1px 0px; float: none}
	#sub-menu LI A{padding: 12px 0px 12px 10px}
	
	P.page-nav{display: none}	
	DIV.page-nav P{display: block}	
	
	DIV.yacht-placeholder-outer{width: auto; margin: 0px 0px 20px 0px; display: block}
	DIV.yacht-placeholder-spacer{display: none}

	/************************* CHARTER PAGE *******************/	
	#charter-page UL{padding: 0px 0px 0px 1px}
	#charter-page UL LI{font-size: 14px; line-height: 14px; padding: 8px 0px 8px 0px}

	#charter-page H2{color: #686868; font-size: 30px; line-height: 30px; letter-spacing: -2px}
	
	/************************* CHARTER PAGE ITINERARIES SECTION *******************/
	DIV.charter-section-banner-itineraries IMG{width: 160%; margin-left: -15%}	
	#charter-itineraries-buttons{margin-bottom: 30px}
	P.charter-itineraries-button{width: 160px}	
	#charter-button-half-day, #charter-button-full-day, #charter-button-similan, #charter-button-dining{margin-left: 0px; margin-right: 0px}
	#charter-button-half-day, #charter-button-similan{margin-right: 5px}	
	#charter-button-full-day, #charter-button-dining{margin-left: 5px}
	
	/************************* CHARTER PAGE DINING SECTION *******************/
	#charter-dining-photos DIV.outer-1 DIV.inner, #charter-dining-photos DIV.outer-3 DIV.inner{margin-right: 5px}
	#charter-dining-photos DIV.outer-2 DIV.inner, #charter-dining-photos DIV.outer-4 DIV.inner{margin-left: 5px}
	#charter-dining-photos DIV.outer-1 DIV.inner, #charter-dining-photos DIV.outer-2 DIV.inner{margin-bottom: 10px}
	
	/************************* CHARTER PAGE AZIMUT SECTION *******************/
	DIV.charter-section-banner-azimut IMG{width: 130%; margin-left: -10%}
	#charter-azimut-summary DIV.summary{width: 25%}
	#charter-azimut-summary DIV.summary-5{display: none}
	#charter-azimut-summary DIV.summary-4{border: none}
	#charter-azimut-summary P.field{font-size: 12px; line-height: 12px}
	#charter-azimut-summary P.value{color: #b8b8b8; font-size: 26px; line-height: 26px; letter-spacing: -1px; padding-right: 1px}

	#charter-azimut-amenities, #charter-azimut-specs{width: 100%} 
	
	/************************* CHARTER PAGE RESERVATIONS SECTION *******************/
	#charter-reservation-notes{margin: 35px auto 30px; padding: 20px 0px 20px 0px}
	#charter-reservation-notes P{max-width: 300px}
	
	#charter-contact-personnel{text-align: center; background: #fff}
	DIV.charter-contact-personnel{width: auto; display: block}
	DIV.charter-contact-personnel DIV{margin: 0px; padding: 0px; border: none; background: #fff}
	DIV.charter-contact-personnel-left DIV{padding: 20px 0px 20px 0px; border-top: solid 1px #d0d0d0}
	DIV.charter-contact-personnel-right DIV{padding-bottom: 20px; border-bottom: solid 1px #d0d0d0}
	
	DIV.charter-contact-personnel P.header{font-size: 16px; line-height: 16px}
	DIV.charter-contact-personnel IMG{width: 70%; margin: 15px auto 15px; border: none}
}

@media only screen and (min-width: 1200px)
{	
	/* HOME */
	#slide, #next{width: 100%; margin-left: 0%}
	
	#yacht-charters DIV.container{padding: 80px 0px 80px 0px}
	#yacht-charters P.intro{padding-top: 25px}
	
	/************************* CHARTER PAGE AZIMUT SECTION *******************/
	DIV.charter-azimut-plan IMG{width: 80%}

	/************************* BANNER *******************/
	#banner IMG{width: 100%; margin-left: 0%} 

	/************************* CONTACT PAGE *******************/
	#contact-left{width: 350px}
	#contact-right{margin: 0px 0px 0px 390px}		
}




