@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Rubik);
/* <<<<<<<<<<<<<<<<<<            B O D Y            >>>>>>>>>>>>>>>>>>>>>>>> */

body { 
    padding-top: 190px; 
	padding-left: 10px;
	padding-right: 10px;
    background-color: #0d54a0;
}
.wrapper {
    background: #dce1e5;
    min-height: calc(100vh - 125px);
    margin: 0px; /* épaisseur du cadre */
	padding: 8px;
    box-sizing: border-box;
}

/* <<<<<<<<<<<<<<<<<<       N A V I G A T I O N       >>>>>>>>>>>>>>>>>>>>>>>> */
@media (min-width: 768px) 
{
	nav {
		height: 181px;
		text-align: center;
	}
	.logo  {
		position:absolute;
		top: 0px;
		left:0px;
		padding:10px;
	}
	ul.navbar-nav {
		float:none;
		display:inline-block;
		margin-left: 320px;
		padding-top: 10px;
	}
}
.navbar-default {
	border-bottom: 2px solid #0d54a0;;
    text-align:center;
	padding-top: 10px;
	background: linear-gradient(
		to bottom,
		#ffffff 0%,
		#8eafd2 50%,
		#0d54a0 100%
	);
}
.navbar-default .navbar-nav > li.logo {
    margin-top: -10px;
    margin-bottom: -14px;
    margin-left: -15px;
}
/* couleur des rubriques du menu */ 
.navbar-default .navbar-nav > li > a { 
    color: #fff;
    font-family: 'Rubik', sans-serif;
    font-weight: 800;
	font-size: 13px;
}
/* couleur de la rubrique active  */
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus { 
	background-color: transparent;
	color: #242f6c;
	font-weight: bold;
}

.navbar-default .navbar-nav li:hover a { 
	color: #242f6c;
 }

.nav > li > a i.fa { 
	margin-right: 4px; 
}
.nav > li > a i.fa-2x {
	font-size: 1.2em;
}
@media (min-width: 880px) {
    .navbar-nav > li:not(.logo) {
        margin-top: 15px;
    }
	ul.navbar-nav {
       padding-top: 6px;
    }
	.navbar-default .navbar-nav > li > a {
		font-size: 14px;
	}
}
@media (min-width: 1000px) {
    ul.navbar-nav {
       padding-top: 8px;
    }
	.navbar-default .navbar-nav > li > a {
		font-size: 16px;
	}
}
@media (min-width: 1220px) {
    ul.navbar-nav {
       padding-top: 28px;
    }
	.navbar-default .navbar-nav > li > a {
		font-size: 18px;
	}
}
@media (min-width: 1400px) {
    ul.navbar-nav {
       padding-top: 30px;
    }
	.navbar-default .navbar-nav > li > a {
		font-size: 20px;
	}
}
@media (min-width: 1600px) {
    ul.navbar-nav {
       padding-top: 30px;
    }
	.navbar-default .navbar-nav > li > a {
		font-size: 22px;
	}
}
@media (min-width: 2030px) {
    ul.navbar-nav {
       padding-top: 50px;
    }
}
/* Traits invisibles au départ */
.navbar-nav > li:not(.active)  > a::before,
.navbar-nav > li:not(.active)  > a::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;          /* largeur = largeur du lien */
    height: 2px;
    background: #242f6c;
    opacity: 0;           /* invisible */
    transition: all 0.5s cubic-bezier(.25,.8,.25,1);
}
/* Position initiale (éloignés) */
.navbar-nav > li:not(.active)  > a::before {
    top: -8px;
}
.navbar-nav > li:not(.active)  > a::after {
    bottom: -8px;
}
/* Au hover */
.navbar-nav > li:not(.active)  > a:hover::before {
    top: 0;
    opacity: 1;
}
.navbar-nav > li:not(.active)  > a:hover::after {
    bottom: 0;
    opacity: 1;
}
.navbar-nav > li.active  > a::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;          /* largeur = largeur du lien */
    height: 2px;
    background: #242f6c;
	bottom: 0px;
}

/* espacement des rubriques */
@media (min-width: 768px) { 
	.navbar-nav > li {
		padding-left: 10px;
		padding-right: 10px;
	}
	.navbar-nav > li > a {
		padding: 4px 0px;
	}
}

@media (max-width: 767px) { 
    body {
        padding-top: 68px;
    }
	.wrapper {
		min-height: calc(100vh - 68px);
	}
    .navbar-brand  {
        padding-top: 0px;
    }
    .navbar-default .navbar-nav > li > a {
        font-size: 18px; 
    }
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        text-align: center;
        margin: 8px;
        font-size: 15px;
        color: #242423;
    }
}

/* <<<<<<<<<<<<<<<<<<       F O O T E R      >>>>>>>>>>>>>>>>>>>>>>>> */
footer {
	background-color: #0d54a0;
	margin-top: 10px;
}
#bloc-footer-bas {
	font-size: 16px;
	padding-top: 10px;
}
#bloc-footer-bas, #bloc-footer-bas a {
	color: #ffffff;
}
#bloc-footer-bas ul {
	list-style:none
}
#bloc-footer-bas li {
	display:inline-block;
	margin-right: 20px;
	margin-left: 20px;
	margin-top: 8px;
	margin-bottom: 8px;

}
#bloc-footer-bas i.fa {
	margin-right: 8px;
}
#bloc-footer-bas li.liens {
	display: none !important;
}
/* mediaqueies mobile et petite tablette en mode portrait */
@media (max-width:750px) {
    #bloc-footer-bas li {
        display: block;
    }
}

/* <<<<<<<<<<<<<<<<<<       C S S   G E N E R A U X      >>>>>>>>>>>>>>>>>>>>>>>> */
a { 
	color: #777a7c; 
}
a:hover { 
	color: #23527c; 
}
.intro {
	max-width: 1200px;
	margin: 0 auto;
}
.intro h1, .intro h2 {
	font-size: 18px;	
}
.intro .btn {
	color: #fff;
    background-color: #0d54a0;
    border-color: #2e6da4;
}
.clear {
	clear: both;
	height: 0;
	font-size: 1px;
	line-height: 0px;
}
.alignement-gauche {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}
.alignement-droite {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}
/* panel de même hauteur */
@media (min-width:992px) {
	.equal, .equal > div[class*='col-'] {
		display: flex;
		flex: 1 1 auto;
	}
	.equal .panel { 	
		width: 100%; 
	}
}

/* bouton retour en haut */
#back-top {
	position: fixed;
	bottom: -11px;
	right: 10px;
	display: none;
	z-index: 10;
}
#back-top span {
	width: 56px;
	height: 48px;
	display: block;
	background: #333435 url(images/top.png) no-repeat center center;
	transition: 1s;
	border-radius: 15px;
	border: 1px solid #fff;
	box-shadow: 1px 1px 12px #555;
}
#back-top a:hover span {
	background-color: #999999; 
}
/* form */
.form-error {
    color: #970F11;
}
.help-block {
    margin: 0 ;
}
/* boutons */
.btn-default {
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
}
.btn-default:active {
	box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn:active, .btn.active {
	background-image: none; 
}
.btn-default {
	background-image: linear-gradient(to bottom, #ffffff 0%, #e0e0e0 100%);
	background-repeat: repeat-x;
	border-color: #dbdbdb;
	text-shadow: 0 1px 0 #fff;
}
.btn-default:hover, 
.btn-default:focus {
	background-color: #e0e0e0;
}
.btn-default:active, 
.btn-default.active {
	background-color: #e0e0e0;
	border-color: #dbdbdb;
}
.btn-default.disabled, 
.btn-default:disabled, 
.btn-default[disabled] {
	background-color: #e0e0e0;
	background-image: none;
}

/* images */
.fancybox-caption {
	text-align: center;
}
.photos tr.legendes td {
    padding-top: 0px;
    padding-bottom: 2px;
}
.photos a img {
	border: 1px solid #5b87b7;
	border-radius: 4px;
	transition: all 1s ease-in-out
}
.photos a:hover img { 
	opacity: 0.5; 
	transform: scale(0.9, 0.9);
}
.photos {
	table-layout: fixed;
	width: 100%;
	border-collapse: separate;
	border-spacing: 8px 8px; /* Nombre de pixels d'espace horizontal et vertical */
}
.photos td {
	vertical-align: top;
	text-align: center;
    padding-top: 16px;
}
.photos td:hover { 	
	border-color: #555; 
}
.photos img {
	margin-bottom: 1px;
	max-width: 100%;
}
.photos td.col-1 { width: 10%; }
.photos td.col-2 { width: 20%; }
.photos td.col-3 { width: 30%; }
.photos td.col-4 { width: 40%; }
.photos td.col-5 { width: 50%; }
.photos td.col-6 { width: 60%; }
.photos td.col-7 { width: 70%; }
.photos td.col-8 { width: 80%; }
.photos td.col-9 { width: 90%; }

@media (max-width:767px) {
	table.photos {
		margin-top: 0px;
		margin-bottom: 0px;
		border-spacing: 0px;
	}
	table.photos td, 
	table.photos td[class*="col-"], 
	table.photos th[class*="col-"] {
		display: block;
		width: 100%;
		font-size: 18px;
	}
}

/* composants et classes supplémentaires  http://bootstrap-doc.prauds.fr/index1.php */
@media (min-width:992px) {
.col-lg-height, 
.col-md-height, 
.col-sm-height, 
.col-xs-height {
	display: table-cell;
	float: none !important;
}
.row-full-height { 
	height: 100%; 
}
.col-full-height {
	height: 100%;
	vertical-align: middle;
}
.col-full-height:before {
	content: "";
}
.row-same-height {
	display: table;
	width: 100%;
	table-layout: fixed;
}
.row-centered { 
	text-align: center; 
}
.col-centered {
	display: inline-block;
	float: none;
	margin-right: -4px;
}
.col-top { 
	vertical-align: top;
}
.col-middle { 
	vertical-align: middle; 
}
.col-bottom { 
	vertical-align: bottom; }
}

/* bloquer le zoom sur les input de l'iphone */
@media (max-width: 740px) {
input[type='text'], 
input[type='tel'], 
input[type='number'], 
input[type='email'], 
input[type='url'],
textarea { 
	font-size: 15px !important; }
}
/* Print pour ne pas afficher le footer. Nav est déjà caché par Bootstrap. Orientation Portrait pour afficher toutes les photos */
@media print {
    @page {
      size: landscape;
    }
    @page rotated { size : landscape }
    body {
        padding-top: 0px;
    }
    footer {
        display: none;
    }   
}