/* #PRODUIRE{fond=css/perso.css}
   md5:d2f95656df946b6761775ed358f4054a */
.glyphicon.glyphicon-link{ display: none !important; }

@import "css/functions";
@import "css/variables.";
@import "css/mixins.";

// Reset and dependencies
@import "css/bootstrapleger/glyphicons.";

// Core CSS
@import "css/bootstrapleger/type.";
@import "css/bootstrapleger/grid.";
@import "css/bootstrapleger/tables.";
@import "css/bootstrapleger/forms.";
@import "css/bootstrapleger/buttons.";

// Components
 @import "css/bootstrapleger/component-animations.";
// 
// 
// 
@import "css/bootstrapleger/navbar.";
@import "css/bootstrapleger/pagination.";
// 
// 
// 
// 
@import "css/bootstrapleger/messages.";
// 
// 
@import "css/bootstrapleger/responsive-utilities.";
@import "css/bootstrapleger/responsive-embed.";
// 

// Components w/ JavaScript
// 
// 
// 
@import "css/bootstrapleger/carousel.";

// ------------------------------------------------------------------------
// ====== MAIS QUE FAIT LA POLICE ! ======
// ------------------------------------------------------------------------

@import url('https://fonts.googleapis.com/css?family=Fira+Sans:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

@font-face {
  font-family: 'kg_happy_shadowsregular';
  src: url('https://ceuxquitiennentlalaisse.info/squ/squ-sites/ceuxquitiennentlalaisse.info/fonts/kghappyshadows-webfont.woff2') format('woff2'),
       url('https://ceuxquitiennentlalaisse.info/squ/squ-sites/ceuxquitiennentlalaisse.info/fonts/kghappyshadows-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'kg_happy';
  src: url('https://ceuxquitiennentlalaisse.info/squ/squ-sites/ceuxquitiennentlalaisse.info/fonts/kghappysolid-webfont.woff2') format('woff2'),
       url('https://ceuxquitiennentlalaisse.info/squ/squ-sites/ceuxquitiennentlalaisse.info/fonts/kghappysolid-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'kg_happyregular';
  src: url('https://ceuxquitiennentlalaisse.info/squ/squ-sites/ceuxquitiennentlalaisse.info/fonts/kghappy-webfont.woff2') format('woff2'),
       url('https://ceuxquitiennentlalaisse.info/squ/squ-sites/ceuxquitiennentlalaisse.info/fonts/kghappy-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

// ------------------------------------------------------------------------
// =========== VARIABLES ! ============
// ------------------------------------------------------------------------

$sansFontFamily: 			   				'Fira Sans', Geneva, Verdana, sans-serif;
$serifFontFamily:  			 				Georgia, Cambria, Times New Roman, Times, serif;
$titraille: 							 			 				KG_happy, 'Fira Sans', Geneva, Verdana, sans-serif;
$monoFontFamily:    					"Courier New", Courier, monospace;
$font-family-monospace: 		$monoFontFamily;
$jaune: 																#FECC49;
$orange: 														#E65517;
$rouge: 															#D80A13;
$couleur-defaut: 								$jaune;

*::selection {
	background: $jaune;
	color: #000;
}

body 					{
	font-family: $sansFontFamily;
	font-size: 1.8em;
}
h1 { 	margin-bottom: 0.66666667em; }
#contenu 	{ margin: 1em 0 ; }
iframe {
	width: 80%;
	min-height: 600px;
	margin: 2em 0;
}

// ------------------------------------------------------------------------
// ========== SITE NORMAL ==========
// ------------------------------------------------------------------------

.officiel {
	h1, h2, h3, h4, h5 {
	    margin: 0 0 0.9em;
	    color: $jaune;
	}
}
.grotit, .message 		{ text-align: center;}
h2 													{ line-height: 130%; }
.content-section 		{ padding-top: 320px; }

section, .decalbas {
	position: relative;
	z-index: 5;
}
.decalbas { margin-top: 7em; }
.page_article .content-section {padding-top: 320px; }

.bandocenter{
	text-align: center;
	background: #000;
	img{ width: 5%; }
}
.stit												{ font-size: 20px;}
.bando 									{
	margin-top: 3em;
	animation-duration: 1s,1.5s;
	animation-delay: .1s, 1.1s;
	animation-iteration-count: 1,2;
	animation-timing-function: ease;
	animation-name: zoomInUp, tada;
}
.interieur .bando	{ margin: 2.5em 0 0; }
.intro {
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: none;
}

	.btn-circle {
    border: 2px solid $jaune;
    border-radius: 50%;
    color: #fff;
    background: 0 0;
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
		width: 3em;
		height: 3em;
		font-size: 1em;
		margin-bottom: 10px;
		margin-top: 0;
		padding: .7em;
}

article .main {
	@import "css/article";

	.reponse_formulaire p { margin: 0; }
}

#tubular-shield {height: 0 !important; }
#tubular-player {margin: 119px 20% 0 !important; }

// Navbar

.container > .navbar-collapse {
	text-align: center;
	.navbar-nav{
		margin: 0;
		display: inline-block;
		float: none;
	}
}

.navbar{
	padding: 4px 0 0;
	font-size: 0.85em;
	&>li>a{
		padding: 0.7em 1em;
		border-radius: 0.3em;
		&:hover{ background-color: transparent; }
	}
}
.navbar-custom.top-nav-collapse {border-bottom-color: #222; }

.cartouche { margin-bottom: 0; }
section article {
	.texte {
		background: #000;
		padding: 0 2em 1em;
	}
	h2, .main h3.spip {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 1.6em;
	}
	h2 {
		font-size:2em;
		background: #000;
		padding-bottom: 1.6em;
		padding-top: 0.6em;
		margin-bottom: 0;
	}

}

.glyphicon.glyphicon-link{ display: none; }

#contenu .formulaire_spip {
	border: 1px solid #666;
	border-radius: 5px;
	form {
		.editer, .legend{
			padding: 0;
			width: 90%;
			margin-left: 5%;
		}
		.legend {
			margin-bottom: 1.5em;
			color: $couleur-defaut;
			font-size: 1.5em;
			font-weight: 400;
			padding-bottom: .5em;
		}
		.submit {
			background-color: $couleur-defaut;
			color: #000;
			padding: 0.3em 1.4em;
			border: 0 solid;
			border-radius: 1.2em;
			font-size: 21px;
			text-transform: lowercase;
			white-space: initial;
			font-weight: 500;
			font-family: "Fira sans";
			margin-bottom: 1.5em;
		}
		.saisie_case, .saisie_radio {
			.choix {
				label { float: right; }
				input {
					margin: 6px 10px 7px 0;
					float: left;
				}
			}
		}
		.saisie_case .choix, .saisie_radio, .editer_horaire, .editer_session .choix	 { label { width: 93%; } }
		p.boutons { margin: 0; }
	}
}

.formulaire_newsletter{
	margin-bottom: 11em;
	form {
		text-align: center;
		.saisie_input, .saisie_nom_inscription, .saisie_mail_inscription,
		.saisie_mot, .saisie_case, .editer_nom, .editer_pays,
		.editer_nom_site, .editer_url_site, .editer_new_pass,
		.editer_new_pass2, .editer_session_email, .editer_email {
			width: 39.5%;
			margin: 0 5% 2em;
			text-align: center;
			input { text-align: center; }
		}
		.editer label{
			font-size: 1.3em;
			text-align: center;
			font-weight: 400;
			margin-bottom: 1em;
		}
		.boutons {
			text-align: center;
			input {
				padding: 10px 55px;
				border-right: 4px;
			}
			.editer > label {
				margin-bottom: 1em;
				font-size: 1.1em;
			}
		}
	}
}

// ------------------------------------------------------------------------
// ========== CROWDFUNDING ==========
// ------------------------------------------------------------------------

.crowdfunding {
	background: transparent;
	.content-section { padding-bottom: 0; }
	.grotit, .objectif {	text-transform: none; }
	.grosurtit {
		margin: .2em auto 0.6em;
		border-bottom: 1px solid #cecece;
		padding-bottom: .2em;
		display: table;
		text-align: center;
	}
	.grotit, .grosurtit {
		font-weight: 600;
		font-family: sans-serif, 'Montserrat';
		img {
			margin-top: 3em;
			animation-duration: 1s,1.2s;
			animation-delay: .1s, 1.1s;
			animation-iteration-count: 1,1;
			animation-timing-function: ease;
			animation-name: zoomInUp, tada;
			width: 850px;
			max-width: 80%;
			margin: 0 10%;
		}
	}
	.objectif {
		font-size: 1.2em;
		text-transform: none;
		border-bottom: 1px solid #ccc;
		display: table;
		clear: both;
		text-align: center;
		margin: 0 auto 0.6em;
		width: 200px;
		padding: 0 0 7px;
		letter-spacing: 0;
	}
	.barre {
		text-align: center;
		svg {
			stroke-linecap: round;
			border: 2px solid #ffc414;
			border-radius: 2px;
			path {
				fill: none;
				stroke-width: 20px;
				stroke-miterlimit: round;
				transition: stroke-dashoffset 2s ease-in-out;
			}
		}

	}
	article, .aside {
		iframe {
			width: 100%;
			min-height: 0;
			margin: 0;
		}
	}
	.aside {
		iframe {
			min-height: 245px;
		}
		.spip_documents  {
			margin-bottom: .2em;
			width: 100%;
			figcaption .spip_doc_titre {display: none; }
		}
		.titre {
			font-size: 1.4em;
			text-transform: none;
			font-weight: 600;
			color: #E22221;
			padding: 0.4em 0.6em 0.1em;
			text-align: center;
		}
	}
	#contenu { margin-top: 6em; }
	.content-section { padding-top: 50px; }

	&, section.content-section,
	.top-nav-collapse, .list-group-item, .formulaire_spip, .formulaire_spip fieldset legend,
	.comment-meta, .comment-content, .comments-posts, .modererforum .submit,
	section article h2, section article .texte {
		background: #fff;
	}
	&, .intro, .formulaire_spip fieldset, .list-group-item, .navbar-custom.top-nav-collapse, .formulaire_spip,
	.comment-content, .modererforum .submit legend, .formulaire_spip fieldset legend, .formulaire_spip .editer > label,
	.formulaire_spip .explication, .navbar-nav > li > a {
		color: #000;
	}
	.bandocenter { display: none; }

	.titarticle {
		font-family: $titraille;
		color: #E5341F;
	}

}
li.crowdfunding { background-color:transparent; }
#contenu .formulaire_spip form {
	.editer.gros {
		background: $jaune;
		padding: 1.1em .5em;
		text-align: center;
		border-radius: 0.3em;
		margin-bottom: 0;
		* { text-align: center; }
		.text {
			font-size: 32px;
			margin: .5em 20%;
			width: 60%;
			background-color: #fff;
		}
	}
	.explication_texte p {
		font-size: 0.9em;
		font-style: italic;
		text-align: center;
	}
	.intro p {
	 margin-bottom: 0 !important;
	 text-align: left;
	 font-style: none;
	 font-weight: 600;
	 font-size: 1.1em;
	}
}

span.obligatoire {
	font-size: 0.8em;
	font-style: italic;
	font-weight: 400;
	color: #555;
}

.formulaire_paiement {
	h2 {padding-bottom: 0.6em; }
	.payer_modes .item {
		margin: 0 0.4em 0;
		padding-top: 54%;
		.payer_mode {
			padding-top: 0;
			.titre.h4 { padding: .2em 0 .7em; }
		}
	}
}

// ---------------------------------------------------------------------------
// ============ RESPONSIVE ============
// ---------------------------------------------------------------------------

@media (orientation: landscape) {.intro {background-size: 100%; } }

@media (max-width: 992px) {
	.nav > li > a { padding: 15px 8px; }
	.intro{
		background-size: auto 89%;
		background-position: center 0;
	}
}

@media (max-width: 462px) {
	.content-section {
		padding-top: 50px;
		margin-left: 35px;
    margin-right: 35px;
	}
	iframe {
		width: 100%;
	  min-height: 60vw;
	  margin: 1em 0;
	}

	#tubular-container{
		background: #000 url('https://ceuxquitiennentlalaisse.info/squ/squ-sites/ceuxquitiennentlalaisse.info/ergo/affichevecto.jpg') center 0 no-repeat;
		background-size: 143vw;
	}
	body #tubular-player{
		width: 100vw !important;
		height: 59vw !important;
		margin: 74vw 0 !important;
		left: 0 !important;
	}
	section article {
		h2, .main h3.spip {
			font-size: 1.5em;
			padding: 0.9em;
		}
	}
	h2 {font-size: 1.6em; }
	.crowdfunding .navbar{ display: none; }
	.intro{
		padding: 0;
		height: 166vw;
		background-size: auto 118vw;
		background-position: center 5vw;
	}
	.crowdfunding #contenu .intro {
		height: auto;
		.explication {
			padding: 0;
			.explication_texte  {
				p {
					text-align: center;
					font-size: 0.8em;
					line-height: 1.3em;
					font-style: normal;
					font-weight: 400;
				}
			}
		}
	}
	.navbar-brand {
		font-size: 1.1em;
		line-height: 120%;
		line-height: 1.6em;
		i{ display: none; }
	}

	.stit{ font-size: 5vw;}
	.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
	    padding-right: 10px;
	    padding-left: 10px;
	}
	h2, .h2 {font-size: 26px; }
	.content-section {
		padding-bottom: 0;
		padding-top: 6em;
	}
  footer {padding: 10px; }
  input.email{width: 100%; }

  button, input, optgroup, select, textarea {
    font-size: 0.9em;
    margin: .5em 0 0;
  }
  #contenu .formulaire_spip{
  	.editer{ padding: 0; }
  	form {
  		.saisie_case .choix label {
  			float: right;
  			width: 87%;
  		}
  		.saisie_radio label { margin-right: 0.6em; }
  	 	.choix {display: block; }
  	 	.editer-groupe {
  	 		margin-bottom: 0;
  	 		margin-left: 0;
  	 	}
  	 	input.submit { margin: 0; }
  	}
  }

	.formulaire_newsletter form {
		.saisie_input, .saisie_nom_inscription, .saisie_mail_inscription,
		.saisie_mot, .saisie_case, .editer_nom, .editer_pays,
		.editer_nom_site, .editer_url_site, .editer_new_pass,
		.editer_new_pass2, .editer_session_email, .editer_email {
			width: 100%;
			margin: 0 0 2em;
		}
	}

	// ------------------------------------------------------------------------
	// ========== CROWDFUNDING ==========
	// ------------------------------------------------------------------------
	.crowdfunding {
		.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
		    padding-right: 15px;
		    padding-left: 15px;
		}
	}

	.crowdfunding #contenu {margin-top: 2em;}
	section article .texte { padding: 0; }

}

@media (min-width: 463px) { #contenu { margin: 12em 0 6em; } }