/*
Name:    		Camping Val d'Autun
Description:    Responsive pour le thème Camping Val d'Autun
Author:         Inaxel
Template:       ultimatum
Version:        0.1.0
*/

/* ==========================================================================
   Version responsive Tablette (801-1366)
   ========================================================================== */

@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

@media screen and (min-width: 801px) and (max-width: 1366px) {

body											{ width: 100%; height: 100%; margin: 0 auto; padding: 0; }

::-moz-selection								{ background: none; }
::selection										{ background: none; }

/* Header */
#logo 											{ width: 350px; height: 215px; }

/* Menu de navigation */
#menu 											{ margin: 0; }
#menu li.sub-menu_open 							{ display: block; position: relative; z-index: 6; }
#nav_btn_camping_tablette 						{ width: 115px; height: 50px; position: absolute; top: 7px; left: 240px; cursor: pointer; z-index: 5; }
#nav_btn_hebergements_tablette 					{ width: 180px; height: 50px; position: absolute; top: 7px; left: 765px; cursor: pointer; z-index: 5; }

#menu li.menu-item-383 .sub-menu:before,
#menu li.menu-item-383 .sub-menu:after 			{ left: 48%; }

/* Slider jCycle */
#slidercontent 									{ height: 680px; }
#sliderjcycle .img1,
#sliderjcycle .img2,
#sliderjcycle .img3,
#sliderjcycle .img4 							{ background-size: 100% 680px; }
#bg_mask_slider 								{ margin: 190px 0 0; }

/* Content */
#content.accueil 								{ margin: -160px auto 0; }

}


/* ==========================================================================
   Version responsive Smartphone (0-800)
   ========================================================================== */

@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

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

* { text-shadow: none !important; box-shadow: none !important; -moz-box-shadow: none !important; -webkit-box-shadow: none !important; -o-box-shadow: none !important; }

body											{ width: 100%; height: 100%; margin: 0 auto; padding: 0; font-size: 1.75em; }

::-webkit-selection 							{ background: transparent; }
::-moz-selection								{ background: transparent; }
::selection										{ background: transparent; }

/* Boutons pink sur le logo */
.button 										{ position: static; }

/* Header "Logo" */
header											{ width: 100%; height: 300px; margin: 0; padding: 0; }
header.accueil									{ height: 380px; }
#line_top 										{ display: none; }
#logo											{ width: 250px; height: auto; margin: 0 auto; }
#logo img 										{ width: 100%; }

/* Décor page accueil */
#decor_sapin_right,
#decor_sapin_left 								{ display: none; }

/* Bouton de navigation du menu principal */
#click-menu 									{ width: 150px; left: 0; right: 0; margin: 0 auto; top: 150px; transition-property: all; -moz-transition-property: all; -webkit-transition-property: all; -o-transition-property: all; transition-duration: .4s; -moz-transition-duration: .4s; -webkit-transition-duration: .4s; -o-transition-duration: .4s; }
#click-menu #RM3Lines 							{ display: none; }
#click-menu.click-menu-active 					{ opacity: 0; }

/* Menu */
#click-menu.click-menu-active 			{ display: none; }
button#responsive-menu-button 			{ top: 225px; left: 0; right: 0; margin: 0 auto; transition-property: all; -moz-transition-property: all; -webkit-transition-property: all; -o-transition-property: all; transition-duration: .4s; -moz-transition-duration: .4s; -webkit-transition-duration: .4s; -o-transition-duration: .4s; }
button#responsive-menu-button.small 	{ top: 3px !important; }
/* position du bouton du menu de navigation - Nouvelle version module Responsive Menu */
.responsive-menu-box 					{ position: static; }
#responsive-menu-button.is-active 		{ display: none !important; }
#responsive-menu 						{ background: transparent !important; }
#responsive-menu-container,
#responsive-menu-container #responsive-menu-wrapper 			{ background: rgba(26, 34, 0, 0.7); }
#responsive-menu-container #responsive-menu-title,
#responsive-menu-container #responsive-menu-title:hover 		{ background: transparent; color: #7fa306; border-bottom: 1px solid #7fa306; }
#responsive-menu-container #responsive-menu > li.responsive-menu-item:first-child a  	{ border-top: 0 none; }
#responsive-menu-container #responsive-menu li.responsive-menu-item a .responsive-menu-subarrow,
#responsive-menu-container #responsive-menu li.responsive-menu-item a .responsive-menu-subarrow.responsive-menu-subarrow-active 		{ height: 40px; color: inherit; background-color: rgba(98, 126, 2, 0.5); border-left: 1px solid #7fa306; right: 0; left: auto; }
#responsive-menu-container #responsive-menu li.responsive-menu-item a .responsive-menu-subarrow:hover,
#responsive-menu-container #responsive-menu li.responsive-menu-item a .responsive-menu-subarrow.responsive-menu-subarrow-active:hover 	{ background-color: rgba(98, 126, 2, 0.5); border-left: 1px solid #7fa306; }
#responsive-menu-container #responsive-menu li.responsive-menu-item a,
#responsive-menu-container #responsive-menu li.responsive-menu-item a:hover 	{ background: rgba(0, 0, 0, 0.4); border-bottom: 1px solid #7fa306; border-top: 0 none; color: #7fa306; }
#responsive-menu-container #responsive-menu li.responsive-menu-item.responsive-menu-current-item > .responsive-menu-item-link,
#responsive-menu-container #responsive-menu li.responsive-menu-item.responsive-menu-current-item > .responsive-menu-item-link:hover,
#responsive-menu-container #responsive-menu ul.responsive-menu-submenu li.responsive-menu-item a 										{ background: rgba(98, 126, 2, 0.4); border-bottom: 1px solid #7fa306; }

/* Module traduction */
#btn_social-trad 								{ width: 30px; height: 30px; position: absolute; right: 5px; top: 50px; z-index: 5; background: url("images/bg_btn_social-trad.png") no-repeat; background-size: 70%; background-position: center; background-color: #00b4bb; border: 4px solid #79d3ea; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; }
#social-trad 									{ width: 100%; height: 65px; position: absolute; top: 0; z-index: 100; background: rgba(255, 255, 255, 0.75); border-bottom: 1px solid rgba(255, 255, 255, 0.85); display: block !important; }
#social-trad #social,
#social-trad #info-trad 						{ max-width: 215px; height: auto; background: transparent; border: 0 none; }
#social-trad #info-trad #btn_saison,
#social-trad #info-trad #info_tel 				{ float: right; }
#btn_saison .btn 								{ font-size: 0.60em; }
#traduction 									{ width: 265px; background: transparent; }
#traduction a 									{ margin: 0 8px; }

/* Icône facebook */
#facebook 										{ width: 40px; height: 40px; position: static; margin: 0 auto; }
#facebook a 									{ width: 100%; height: 30px; padding: 2px 0 0; display: block; text-align: center; }
#facebook a img 								{ width: 22px; height: 23px; padding: 7px 0; }
#facebook a img.facebook_Over					{ display: none; position: absolute; top: 5px; left: 9px; }

/* Slider */
#slidercontent									{ width: 100%; height: 290px; }
.content-slider .flexslider 					{ height: 290px !important; }
.content-slider .flexslider ul 					{ height: 290px; }
.content-slider .flexslider ul li,
.content-slider .flexslider ul li img 			{ height: 100% !important; }
#sliderjcycle									{ height: 290px; }
#sliderjcycle .img1								{ width: 100%; height: 100%; background: url("slider/img1_smart.jpg") no-repeat; background-position: center; background-size: cover; }
#sliderjcycle .img2								{ width: 100%; height: 100%; background: url("slider/img2_smart.jpg") no-repeat; background-position: center; background-size: cover; }
#sliderjcycle .img3								{ width: 100%; height: 100%; background: url("slider/img3_smart.jpg") no-repeat; background-position: center; background-size: cover; }
#sliderjcycle .img4								{ width: 100%; height: 100%; background: url("slider/img4_smart.jpg") no-repeat; background-position: center; background-size: cover; }

/* Slider nav */
#bg_slidernav_content 							{ display: none; }
#bg_slidernav 									{ background: transparent; border: none; }
#slidernav 										{ display: none; }
#bg_mask_slider,
#bg_mask_img_header								{ width: 100%; height: 40px; position: absolute; margin: 0; left: 0; top: 250px; background-size: 100% 100%; }

/* Position du widget sur la page d'accueil */
#widget-area.accueil							{ float: none; clear: both; margin: 50px auto 0; }

/* Widget Réservation */
#widget_resa 									{ margin: 0 auto 40px !important; float: none !important; }
#widget_resa h3									{ font-size: 30px; }
#widget_resa input[type="button"]				{ width: 100%; /* color: #798700; text-shadow: 0 1px #526d00; */ }

/* Fix place le calendrier au dessus de tout les éléments du site */
#ui-datepicker-div 								{ z-index: 5 !important; }

/* Page d'accueil */
#content.accueil								{ width: 100%; height: 100%; margin: 0 auto; position: relative; }

/* Page d'accueil - Module Actualités */
#content.accueil #actus 						{ height: auto; float: none; clear: both; margin: 0 auto 30px; }
#content.accueil #actus h4						{ font-size: 22px; }
#content.accueil #actus #text 					{ width: 80%; height: auto; margin: 10px auto 0; }
#content.accueil #actus #bloc_img 				{ width: 91%; height: 231px; margin: 0 auto; }
#content.accueil #actus #bloc_img img			{ width: 100%; }
#content.accueil #actus span.bloc_img_arrow 	{ width: 100%; bottom: -21px; left: 0; background-position: center; }
#content.accueil #actus #img_mask 	 			{ width: 81%; margin: 28px; }

/* Page d'accueil - Module Promotions */
#content.accueil #promos 						{ height: auto; float: none; clear: both; margin: 0 auto 30px; }
#content.accueil #promos h4						{ font-size: 22px; }
#content.accueil #promos #text 					{ width: 80%; height: auto; margin: 10px auto 0; }
#content.accueil #promos #bloc_img 				{ width: 91%; height: 231px; margin: 0 auto; }
#content.accueil #promos #bloc_img img			{ width: 100%; }
#content.accueil #promos span.bloc_img_arrow 	{ width: 100%; bottom: -21px; left: 0; background-position: center; }
#content.accueil #promos #img_mask 	 			{ width: 81%; margin: 28px; }

/* Page d'accueil - Module Camping */
#content.accueil .camping 						{ width: 370px; height: auto; float: none; clear: both; margin: 0 auto 30px; }
#content.accueil .camping .text 				{ width: 80%; height: auto; margin: 10px auto 0 !important; }
#content.accueil .camping .bloc_img 			{ width: 73%; height: 175px; padding: 30px; margin: 0 auto !important; }
#content.accueil .camping .bloc_img .wpb_single_image,
#content.accueil .camping .bloc_img .vc_figure,
#content.accueil .camping .bloc_img .vc_single_image-wrapper { width: 100%; }
#content.accueil .camping .bloc_img img			{ width: 100% !important; margin: 0 !important; }
#content.accueil .camping span.bloc_img_arrow 	{ left: 0; right: 0; margin: 0 auto; }

/* page type - design basique pour toutes les pages */
#content 										{ width: 100%; overflow: hidden; }
#img_header 									{ height: 290px; }
#img_header img 								{ width: 100%; height: auto; position: absolute; left: 0; right: 0; margin: 0 auto; }
#line_wave_bottom_header 						{ top: 450px; }
#text 											{ width: auto; margin: 0; font-size: 0.65em; float: none; clear: both; border: 0 none; }
#content.accueil #text 							{ width: 100%; }
#text #title 									{ margin: 10px 15px 25px; }
#text p 										{ font-size: 1em; }
#text.Nos time, #text.Les time 					{ float: none; clear: both; margin-bottom: 0; }
#text.actualites ul, #text.promotions ul,
#text.Les ul, #text.Nos ul 						{ height: 100%; }
#text.actualites ul li,
#text.promotions ul li 							{ height: 100%; }
#text.actualites #content_text,
#text.promotions #content_text 					{ height: 100%; }
#text.actualites ul li p,
#text.Les ul li p,
#text.promotions ul li p,
#text.Nos ul li p 								{ width: 68%; margin: 15px 0 0; float: none; clear: both; font-size: 0.8em; }
#text.actualites ul li #img_mask_cat,
#text.Les ul li #img_mask_cat,
#text.promotions ul li #img_mask_cat,
#text.Nos ul li #img_mask_cat					{ width: 100%; float: none; clear: both; }
#text.actualites ul li #img_mask_cat img,
#text.Les ul li #img_mask_cat img,
#text.promotions ul li #img_mask_cat img,
#text.Nos ul li #img_mask_cat img				{ width: 100%; }
#text.actualites ul li #img_mask_single,
#text.Les ul li #img_mask_single,
#text.promotions ul li #img_mask_single,
#text.Nos ul li #img_mask_single 				{ width: 100%; height: 100%; float: none; clear: both; }
#text.actualites ul li#single p,
#text.Les ul li#single p,
#text.promotions ul li#single p,
#text.Nos ul li#single p 						{ width: 95%; height: 100%; float: none; clear: both; }
#text.actualites #btn_suite,
#text.promotions #btn_suite,
#text.Les #btn_suite,
#text.Nos #btn_suite 							{ float: none; clear: both; margin: 15px 0; }
#text #single 									{ font-size: 1em !important; }
#text #single h4								{ margin: 15px 0 0; }
#img_mask_single img 							{ height: auto; }

/* Position du widget sur les pages types */
.widget-area 									{ float: none; clear: both; margin: 0 auto; }
.widget-area #actus, .widget-area #promos 		{ display: none; }

/* Ajustement module Accordéon de Visual Composer */
.wpb-js-composer .vc_tta.vc_tta-spacing-1 .vc_tta-panel.vc_active .vc_tta-panel-heading,
.wpb-js-composer .vc_tta.vc_tta-spacing-1 .vc_tta-panel:not(:last-child) .vc_tta-panel-heading 			{ margin-bottom: 10px !important; }

/* Classes pour le plugin Visual Composer */
.prestations_locations .wpb_separator 			{ display: none; }
.wpb_content_element.wpb_single_image img,
.wpb_thumbnails .post-thumb img 				{ width: 100%; }
.wpb_accordion_section 							{ width: 100%; height: auto; }
.wpb_heading, .entry-content .wpb_heading		{ font-size: 22px; }
.wpb_accordion .wpb_accordion_wrapper .wpb_accordion_header 	{ width: 94%; }
.wpb_accordion h3 span 											{ right: 1em !important; }
.wpb_accordion .wpb_accordion_wrapper .wpb_accordion_header a 	{ width: 90%; padding-left: 0 !important; padding-right: 0 !important; }
.wpb_content_element .wpb_tour_tabs_wrapper .wpb_tab,
.wpb_content_element .wpb_accordion_wrapper .wpb_accordion_content { font-size: 17px; padding: 0.3em !important; }
.vc-carousel-indicators 						{ display: none; }
.vc_responsive div.vc_row-fluid div[class*="vc_span"] 	{ margin: 15px 0; }
.vc_responsive .wpb_tour .wpb_tour_tabs_wrapper .wpb_tabs_nav,
.vc_responsive .wpb_tour .wpb_tab,
.vc_responsive .wpb_tour_next_prev_nav 			{ width: 100% !important; }
.wpb_tour_next_prev_nav span.wpb_next_slide 	{ width: 38%; padding: 0 35px 0 0 !important; }
.wpb_tour_next_prev_nav span.wpb_prev_slide a,
.wpb_tour_next_prev_nav span.wpb_next_slide a	{ font-size: 18px; }
.wpb_tour_tabs_wrapper div.ui-tabs-panel 		{ width: 97% !important; }
.ui-state-default 								{ width: 99%; }
.ui-state-default a 							{ font-size: 15px; }

/* Réduction de la marge bottom pour le module gallerie d'image de Visual Composer */
.flexslider 									{ margin: 0 0 30px !important; }

/* Styles génériques pour les tableaux du plugin Table Press */
.wpb_row thead div								{ font-size: 16px !important; }
.wpb_row td 									{ font-size: 1.1em; }
.flexslider .slides img 						{ height: auto; }
	
/* Réglage Footable */
.footable-row-detail-row 						{ border-bottom: 1px solid #c6c6c6; display: block; }
.footable-row-detail-name 						{ width: 100%; display: block; }
.footable-row-detail-value 						{ width: 100%; display: block; }
	/*.footable > tbody > tr > td 					{ width: 92% !important; display: block; }
	.tablepress thead th,
	.tablepress tfoot th 							{ width: 100%; }
	.footable-row-detail-name 						{ width: 100%; float: left; margin: 20px 0 0; }
	.footable-row-detail-value 						{ width: 100%; float: left; }*/

/* Styles pour le module DatePicker */
#ui-datepicker-div 								{ width: 240px; font-size: 0.65em; }

/* Formulaire de contact c-Form 7 "Demande de documentation" */
.wpcf7 											{ height: 100%; }

/* Texte bas de page "Date ouverture" */
.widget-area.basPage 							{ margin: 0; }

/* Footer */
footer 											{ width: 100%; height: auto; float: left; border-top: 1px solid #9c9c9c; }

/* Scroll Top */
#scrollToTop 									{ display: none !important; }

/* Décor Footer et Logo Partenaires */
#logo_yellow 									{ width: 150px; }
#decor_partenaires 								{ width: 100%; margin: 0 auto; position: relative; }
#decor_footer 									{ display: none; }
#partenaires									{ width: 96%; height: auto; padding: 8px 6px 15px; top: -280px; left: 0; overflow: hidden; }
#partenaires #content_meteoPart 				{ padding: 0; }
#partenaires #widget_meteo 						{ width: 200px; float: none; margin: 7px auto; padding: 0; border: 0 none; }
#partenaires #cont_MzQxNTB8MnwxfDR8NHxCQkUwRkZ8MXxGRkZGRkZ8Y3wx { float: none; margin: 0 auto; }
#partenaires ul 								{ max-width: 215px; height: 75px; margin: 20px auto 0; float: none; border-left: 0 none; }
#partenaires ul li								{ margin: 8px 5px; }
#partenaires ul li#ucpa 						{ margin: 8px 0 8px 5px; }
#partenaires ul#bottom 							{ height: 115px; }
#partenaires ul#bottom li						{ margin: 20px 12px; }

/* Bottom_footer (ref) */
#bottom_footer 									{ width: 100%; height: auto; }
#bottom_footer #site-info div 					{ margin: 9px 0; padding: 0 7px; font-size: 16px; }
#text-ref 										{ width: 100%; }

/* Copyright */
.copyrt 										{ font-size: 16px; }

footer #info-cpy 								{ height: auto; }
footer #info-cpy #content_info-cpy 				{ width: 100%; padding: 5px 0 15px; }
footer #info-cpy #content_info-cpy div 			{ clear: both; float: none; width: 100%; text-align: center; }

}


/* ==========================================================================
   Version responsive Smartphone (0-400)
   ========================================================================== */

@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

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

/* Widget Réservation */
#widget_resa 									{ width: 78%; }

/* Page d'accueil - Module Actualités */
#content.accueil #actus 						{ width: 100%; }
#content.accueil #actus #img_mask 				{ margin: 10%; }
#content.accueil #actus h3#title.accueil 		{ font-size: 32px; }

/* Page d'accueil - Module Promotions */
#content.accueil #promos 						{ width: 100%; }
#content.accueil #promos #img_mask 				{ margin: 10%; }
#content.accueil #promos h3#title.accueil 		{ font-size: 32px; }

/* Page d'accueil - Module Camping */
#content.accueil .camping 						{ width: 100%; }

/* Image header */
#img_header img 								{ width: auto; height: 100%; }

}