/*
Project : Starter CSS
Author	: Nom Prénom
Version	: v.1.0.0
Date 	: 12/04/2018
*/

/*-----------------------------------------------------------*/
/* GLOBAL */
/*-----------------------------------------------------------*/
html {
	box-sizing:border-box;
	font-size: 100%;
}
*, *:before, *:after {
	box-sizing: inherit;
}
body {
	position: relative;
	font-family: 'Lato', 'Helvetica', Arial, sans-serif;
	font-size: 1em; /* soit 16px */
	line-height: 1.5;
	font-weight: 400;
	color: #666666;
	background-color: #fff;
}

/* Typographie */
/*--------------------------*/
h1, .h1-like,
h2, .h2-like,
h3, .h3-like  {
	font-weight: 700;
	margin: 0 0 0.625em 0;
}

h4, .h4-like,
h5, .h5-like,
h6, .h6-like {
	font-weight: 400;
	margin: 0 0 0.625em 0;
}
h1, .h1-like {
	font-size: 1.625em;
}
h2, .h2-like {
	font-size: 1.25em;
}
h3, .h3-like {
	font-size: 1.2em;
}
h4, .h4-like, .h4-like-desktop{
	font-size: 1.15em;
}
h5, .h5-like {
	font-size: 1.1em;
}
h6, .h6-like {
	font-size: 1em;
}
p {
	margin: 0 0 0.625em 0;
}

.p-like{
	font-size: 1em;
}

/* Links */
/*--------------------------*/
a {
	text-decoration: none;
	color: #0057b9;
}


/* Grouping content */
/*--------------------------*/
img,
audio,
video {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
audio {
	min-height: 35px;
}
figure {
	margin: 0;
}




/* table */
/*---------------------------*/
table {
	width: 100%;
	margin: 0.625em 0;
	table-layout: fixed;
	border-collapse: collapse;
}
tr,
td,
th {
	vertical-align: middle;
}
thead th {
	padding: 0.625em 0;
	border-bottom: 2px solid #c1c1c4;
	text-align: left;
	font-weight: 700;
}
tbody td {
	padding: 0.625em;
	border-bottom: 1px solid #c1c1c4;
}
tbody tr:nth-child(even) {
	background: #E7E7E7;
}


/* Forms */
/* -----------------------------------------------------*/
form ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
input,
label,
select {
    display: block;
    font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif;
    font-size: 1em;
}

label {
    margin-bottom: .35938em;
    font-weight: 700;
    cursor: pointer;
}

label.required:after {
    content: " *";
}

textarea,
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="time"],
input[type="week"],
select[multiple="multiple"] {
    box-sizing: border-box;
    width: 100%;
    margin-bottom: .71875em;
    padding: .625em;
    border: 1px solid #e8e8e9;
    border-radius: 0;
    font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif;
    font-size: 1em;
    background-color: #fff;
    box-shadow: none;
    -webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

textarea:hover,
input[type="email"]:hover,
input[type="number"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="text"]:hover,
input[type="url"]:hover,
input[type="color"]:hover,
input[type="date"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="month"]:hover,
input[type="time"]:hover,
input[type="week"]:hover,
select[multiple="multiple"]:hover {
    border-color: #ceced0;
}

textarea:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
input[type="color"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
select[multiple="multiple"]:focus {
    border-color: #f36;
    outline: none;
    box-shadow: 0 0 5px rgba(255, 51, 102,.9);
}

textarea {
    resize: vertical;
}

input[type="checkbox"],
input[type="radio"] {
    display: inline;
    margin-right: .71875em;
}

input[type="file"] {
    width: 100%;
    margin-bottom: .71875em;
    padding-bottom: .23958em;
}
input[type="submit"] {
   cursor: pointer;
}
select {
    width: auto;
    margin-bottom: .71875em;
    max-width: 100%;
}

fieldset {
    margin: 0 0 .71875em 0;
    padding: 1.4375em;
    border: 1px solid #e8e8e9;
    border-radius: 0;
    background: #fafafa;
}

::-webkit-input-placeholder {
    color: #c8c9ca;
}

:-moz-placeholder {
    color: #c8c9ca;
}

::-moz-placeholder {
    color: #c8c9ca;
}

:-ms-input-placeholder {
    color: #c8c9ca;
}
/*input[id="nom"], input[id="prenom"] {
    display: inline-block;
    width: 75%;
}
 label[for="nom"], label[for="prenom"] {
    display: inline-block;
    width: 20%;
}*/


/* browser */
/*--------------------------*/
.browser {
	background-color: #f25648;
    color: #611e18;
	padding: 20px;
	margin: 20px 0;
	border: 10px solid;
	text-align: center;
}
.browser a {
	color: #fff;
	text-decoration: underline;
}
.browser a:hover {
	color: #fff;
	text-decoration: none;
}
/* iframes RWD */
/*----------------------*/
.box-iframe {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
} 
.box-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; 
    height: 100%;
    border: none;
}
/*-----------------------------------------------------------*/
/* CSS GRID */
/*-----------------------------------------------------------*/
/*.grid:before,
.grid:after {
	display: block;
	content: '';
	clear: both;
}*/

.grid {
	margin-left: -10px;
	margin-right: -10px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
	-webkit-box-align: stretch;
	-webkit-align-items: stretch;
	   -moz-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
}


[class*="col-"] {
	width: 100%;
}
.grid [class*="col-"] {
	/*float: left;*/
	padding-left: 10px;
	padding-right: 10px;
}

.col-m-0 {
	width: 0%;
	padding-left: 0px!important;
	padding-right: 0px!important;	
}
.col-m-1 {
	width: 8.333%;
}
.col-m-2 {
	width: 16.667%;
}
.col-m-3 {
	width: 25%;
}
.col-m-4 {
	width: 33.333%;
}
.col-m-5 {
	width: 41.667%;
}
.col-m-6 {
	width: 50%;
}
.col-m-7 {
	width: 58.333%;
}
.col-m-8 {
	width: 66.667%;
}
.col-m-9 {
	width: 75%;
}
.col-m-10 {
	width: 83.333%;
}
.col-m-11 {
	width: 91.667%;
}
.col-m-12 {
	width: 100%;
}

.order-m-1 {
	order: 1;
}
.order-m-2 {
	order: 2;
}
.order-m-3 {
	order: 3;
}
.order-m-4 {
	order: 4;
}
.order-m-5 {
	order: 5;
}
.order-m-6 {
	order: 6;
}
.order-m-7 {
	order: 7;
}
.order-m-8 {
	order: 8;
}
.order-m-9 {
	order: 9;
}
.order-m-10 {
	order: 10;
}
.order-m-11 {
	order: 11;
}
.order-m-12 {
	order: 12;
}

.offset-m-0 {
	margin-left: 0%;
}
.offset-m-1 {
	margin-left: 8.333%;
}
.offset-m-2 {
	margin-left: 16.667%;
}
.offset-m-3 {
	margin-left: 25%;
}
.offset-m-4 {
	margin-left: 33.333%;
}
.offset-m-5 {
	margin-left: 41.667%;
}
.offset-m-6 {
	margin-left: 50%;
}
.offset-m-7 {
	margin-left: 58.333%;
}
.offset-m-8 {
	margin-left: 66.667%;
}
.offset-m-9 {
	margin-left: 75%;
}
.offset-m-10 {
	margin-left: 83.333%;
}
.offset-m-11 {
	margin-left: 91.667%;
}
.offset-m-12 {
	margin-left: 100%;
}

.show-m {
	display: block;
}
.hide-m {
	display: none;
}


/* tablet view */
/*--------------------------*/
@media (min-width: 481px){
	.col-t-0 {
		width: 0%;
		padding-left: 0px!important;
		padding-right: 0px!important;	
	}
	.col-t-1 {
		width: 8.333%;
	}
	.col-t-2 {
		width: 16.667%;
	}
	.col-t-3 {
		width: 25%;
	}
	.col-t-4 {
		width: 33.333%;
	}
	.col-t-5 {
		width: 41.667%;
	}
	.col-t-6 {
		width: 50%;
	}
	.col-t-7 {
		width: 58.333%;
	}
	.col-t-8 {
		width: 66.667%;
	}
	.col-t-9 {
		width: 75%;
	}
	.col-t-10 {
		width: 83.333%;
	}
	.col-t-11 {
		width: 91.667%;
	}
	.col-t-12 {
		width: 100%;
	}
	.order-t-1 {
		order: 1;
	}
	.order-t-2 {
		order: 2;
	}
	.order-t-3 {
		order: 3;
	}
	.order-t-4 {
		order: 4;
	}
	.order-t-5 {
		order: 5;
	}
	.order-t-6 {
		order: 6;
	}
	.order-t-7 {
		order: 7;
	}
	.order-t-8 {
		order: 8;
	}
	.order-t-9 {
		order: 9;
	}
	.order-t-10 {
		order: 10;
	}
	.order-t-11 {
		order: 11;
	}
	.order-t-12 {
		order: 12;
	}



	.offset-t-0 {
		margin-left: 0%;
	}
	.offset-t-1 {
		margin-left: 8.333%;
	}
	.offset-t-2 {
		margin-left: 16.667%;
	}
	.offset-t-3 {
		margin-left: 25%;
	}
	.offset-t-4 {
		margin-left: 33.333%;
	}
	.offset-t-5 {
		margin-left: 41.667%;
	}
	.offset-t-6 {
		margin-left: 50%;
	}
	.offset-t-7 {
		margin-left: 58.333%;
	}
	.offset-t-8 {
		margin-left: 66.667%;
	}
	.offset-t-9 {
		margin-left: 75%;
	}
	.offset-t-10 {
		margin-left: 83.333%;
	}
	.offset-t-11 {
		margin-left: 91.667%;
	}
	.offset-t-12 {
		margin-left: 100%;
	}


	.show-t {
		display: block;
	}
	.hide-t {
		display: none;
	}

}/*--end of tablet view-----*/



/* desktop view */
/*--------------------------*/
@media (min-width: 769px){

	.col-d-0 {
		width: 0%;
		padding-left: 0px!important;
		padding-right: 0px!important;		
	}
	.col-d-1 {
		width: 8.333%;
	}
	.col-d-2 {
		width: 16.667%;
	}
	.col-d-3 {
		width: 25%;
	}
	.col-d-4 {
		width: 33.333%;
	}
	.col-d-5 {
		width: 41.667%;
	}
	.col-d-6 {
		width: 50%;
	}
	.col-d-7 {
		width: 58.333%;
	}
	.col-d-8 {
		width: 66.667%;
	}
	.col-d-9 {
		width: 75%;
	}
	.col-d-10 {
		width: 83.333%;
	}
	.col-d-11 {
		width: 91.667%;
	}
	.col-d-12 {
		width: 100%;
	}
	.order-d-1 {
		order: 1;
	}
	.order-d-2 {
		order: 2;
	}
	.order-d-3 {
		order: 3;
	}
	.order-d-4 {
		order: 4;
	}
	.order-d-5 {
		order: 5;
	}
	.order-d-6 {
		order: 6;
	}
	.order-d-7 {
		order: 7;
	}
	.order-d-8 {
		order: 8;
	}
	.order-d-9 {
		order: 9;
	}
	.order-d-10 {
		order: 10;
	}
	.order-d-11 {
		order: 11;
	}
	.order-d-12 {
		order: 12;
	}



	.offset-d-0 {
		margin-left: 0%;
	}
	.offset-d-1 {
		margin-left: 8.333%;
	}
	.offset-d-2 {
		margin-left: 16.667%;
	}
	.offset-d-3 {
		margin-left: 25%;
	}
	.offset-d-4 {
		margin-left: 33.333%;
	}
	.offset-d-5 {
		margin-left: 41.667%;
	}
	.offset-d-6 {
		margin-left: 50%;
	}
	.offset-d-7 {
		margin-left: 58.333%;
	}
	.offset-d-8 {
		margin-left: 66.667%;
	}
	.offset-d-9 {
		margin-left: 75%;
	}
	.offset-d-10 {
		margin-left: 83.333%;
	}
	.offset-d-11 {
		margin-left: 91.667%;
	}
	.offset-d-12 {
		margin-left: 100%;
	}


	.show-d {
		display: block;
	}
	.hide-d {
		display: none;
	}
}/*--end of desktop view-----*/


/* Large screen view */
/*--------------------------*/
@media (min-width: 1024px){
	.col-l-0 {
		width: 0%;
		padding-left: 0px!important;
		padding-right: 0px!important;	
	}
	.col-l-1 {
		width: 8.333%;
	}
	.col-l-2 {
		width: 16.667%;
	}
	.col-l-3 {
		width: 25%;
	}
	.col-l-4 {
		width: 33.333%;
	}
	.col-l-5 {
		width: 41.667%;
	}
	.col-l-6 {
		width: 50%;
	}
	.col-l-7 {
		width: 58.333%;
	}
	.col-l-8 {
		width: 66.667%;
	}
	.col-l-9 {
		width: 75%;
	}
	.col-l-10 {
		width: 83.333%;
	}
	.col-l-11 {
		width: 91.667%;
	}
	.col-l-12 {
		width: 100%;
	}
	.order-l-1 {
		order: 1;
	}
	.order-l-2 {
		order: 2;
	}
	.order-l-3 {
		order: 3;
	}
	.order-l-4 {
		order: 4;
	}
	.order-l-5 {
		order: 5;
	}
	.order-l-6 {
		order: 6;
	}
	.order-l-7 {
		order: 7;
	}
	.order-l-8 {
		order: 8;
	}
	.order-l-9 {
		order: 9;
	}
	.order-l-10 {
		order: 10;
	}
	.order-l-11 {
		order: 11;
	}
	.order-l-12 {
		order: 12;
	}



	.offset-l-0 {
		margin-left: 0%;
	}
	.offset-l-1 {
		margin-left: 8.333%;
	}
	.offset-l-2 {
		margin-left: 16.667%;
	}
	.offset-l-3 {
		margin-left: 25%;
	}
	.offset-l-4 {
		margin-left: 33.333%;
	}
	.offset-l-5 {
		margin-left: 41.667%;
	}
	.offset-l-6 {
		margin-left: 50%;
	}
	.offset-l-7 {
		margin-left: 58.333%;
	}
	.offset-l-8 {
		margin-left: 66.667%;
	}
	.offset-l-9 {
		margin-left: 75%;
	}
	.offset-l-10 {
		margin-left: 83.333%;
	}
	.offset-l-11 {
		margin-left: 91.667%;
	}
	.offset-l-12 {
		margin-left: 100%;
	}


	.show-l {
		display: block;
	}
	.hide-l {
		display: none;
	}

}/*--end of Large screen view-----*/




/* buttons */
/*--------------------------*/
.btn {
	position: relative;
	display: inline-block;
	background-color: #4589c7;
	color: #fff;
	border: none;
	border-radius: 10px;
	padding: 0.7em 1.25em;
	line-height: 1.5;
	text-align: center;
}

.btn--small {
	font-size: 0.75em;
}
.btn--large {
	font-size: 1.5em;
}
.btn--secondary {
	color: #fff;
	background-color: #4589c7;
	/*border:2px solid #666666;*/
}
.btn-light {
	background-color: #ddd;
	color: #3974ac;
}


/* helpers */
/*--------------------------*/

.v-top {
	vertical-align: top;
}
.v-middle {
	vertical-align: middle;
}
.v-bottom {
	align-self: flex-end;
}

/*
m = margin
a, t, b = all, top, bottom
n, s, m, l = none, small, medium, large
*/

.man {
	margin: 0!important;
}
.mas {
	margin: 20px!important;	
}
.mam {
	margin: 40px!important;	
}
.mal {
	margin: 60px!important;	
}


.mtn {
	margin-top: 0!important;
}
.mts {
	margin-top: 20px!important;	
}
.mtm {
	margin-top: 40px!important;	
}
.mtl {
	margin-top: 60px!important;	
}

.mbn {
	margin-bottom: 0!important;
}
.mbs {
	margin-bottom: 20px!important;	
}
.mbm {
	margin-bottom: 40px!important;	
}
.mbl {
	margin-bottom: 60px!important;	
}

.pan {
	padding: 0px!important;
}
.pas {
	padding: 20px!important;
}
.pam {
	padding: 40px!important;
}
.pal {
	padding: 60px!important;
}


.ptn {
	padding-top: 0!important;
}
.pts {
	padding-top: 20px!important;	
}
.ptm {
	padding-top: 40px!important;	
}
.ptl {
	padding-top: 60px!important;	
}

.pbn {
	padding-bottom: 0!important;
}
.pbs {
	padding-bottom: 20px!important;	
}
.pbm {
	padding-bottom: 40px!important;	
}
.pbl {
	padding-bottom: 60px!important;	
}

.pln {
	padding-left: 0!important;
}
.pls {
	padding-left: 20px!important;	
}
.plm {
	padding-left: 40px!important;	
}
.pll {
	padding-left: 60px!important;	
}


.txt-right {
	text-align: right;
}
.txt-center {
	text-align: center;
}
.txt-left {
	text-align: left;
}

.txt-list {
	padding-left: 10px;
	margin-left: 20px;
	list-style-type: disc;
}

.bg-light {
	background-color: #ddd;
}
.bg-medium {
	background-color: #3974ac;
}
.bg-dark {
	background-color: #0a1520;
}
.txt-light {
	color: #fafafa;
}
.txt-medium {
	color: #ccc;
}
.txt-dark {
	color: #5d5d5d;
}

.center-box {
	float: none!important;
	margin-left: auto!important;
	margin-right: auto!important;
}

.round-box {
	border-radius: 50%;
}
.border-s-light {
	border: 5px solid #fff;
}
.border-s-medium {
	border: 5px solid #333;
}

.ul-clean {
	margin-top: 0;
	margin-bottom: 0;
	padding: 0;
	list-style-type: none;
}
.overlay {
	background-color: rgba(0,0,0,0.7);
}
/*-----------------------------------------------------------*/
/* CONTENT */ /* Code mobile */
/*-----------------------------------------------------------*/
.wrap {
	max-width: 1280px;
	width: 100%;
	padding-left: 10px;
	padding-right: 10px;
	margin-left: auto;
	margin-right: auto;
}

.wrap--full{
	padding-left: 0;
	padding-right: 0;
}

/* header */
/*--------------------------*/
#header { /* ou [id="header"] car ça vaut 10 et non 100 pour #header */

}



#header h1 {
	color: #666666;
	text-align: center;
}


.logo{
	max-height: 100px;
}
/* nav */
/*--------------------------*/
.menu { /* on masque le menu à l'état initial */
	height: 0;
	opacity: 0;
	overflow: hidden;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.menu-collapse {
	height: auto;
	opacity: 1;
}
.menu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.menu a {
	display: block;
	padding: 0.2em;
	text-align: center;
	color: #666666;
	margin-bottom: 5px;
}

.menu .current {
	border-bottom: 5px solid #4589c7;
}

.menu-collapse .current {
	color: #fff;
	background-color: #4589c7;
}

/* Fil d'Ariane */
.fil-ariane{
	padding-top: 10px;
	padding-left: 10px;
}
.fil-ariane,
.fil-ariane a,
.fil-ariane p,
.fil-ariane a:visited{
	font-size: 0.8em;
	color: #5d5d5d;
	display: inline-block;
}

.fil-ariane p{
	margin-left: 3px;
	margin-right: 3px;
}

.fil-ariane a{
	text-decoration: underline;
}

/* btn menu */
/*--------------------------*/
.btn-menu {
	position: absolute;
	top: 20px;
	right: 20px;
	color: #4589c7;

}
/* main */
/*--------------------------*/

/* Index page */
/**************/

/* slider */


.flexslider{
	border-bottom: 0 !important;
} 

ul.slides li{
	position: relative;
}

.flex-caption {
	background: rgba(0,0,0, 0.5);
    bottom: 50px;
    left:50px;
    padding:20px;
    position:absolute;
    display: inline-block;
    width: 50%;
    color: #fff;
}


a.flex-prev,.slides .flex-caption {
	transition: none !important;
}

.flex-direction-nav a {
	line-height: 50px !important;
	height: 55px !important;
}

.flex-control-nav {
    bottom: 10px !important;
}

.flex-control-paging li a {
    width: 20px !important;
    height: 20px !important;
    background: rgba(255, 255, 255, 0.4) !important;
}

.flex-control-paging li a:hover,
.flex-control-paging li a.flex-active {
    background: rgba(255, 255, 255, 0.9) !important;
}

.flex-direction-nav a:before {
	color: rgba(255, 255, 255, 0.9) !important;
}

a.flex-next{
	display: block!important;
}

.flex-caption p{
	font-size: 1.2em;
	line-height: 1.5;
}

ol.flex-control-nav{
display: block!important;
}

@media (max-width: 768px) {

	.flex-caption p{
		display: none;
	}

}

@media (max-width: 480px) {
	.flexslider{
		margin-top: 0px!important;
		margin-bottom: 100px!important;
	}

	.flex-direction-nav a {
		margin-top: 27vw!important;
		height: 60px !important;
	}

	.flex-direction-nav a:before {
		background-color: #4589c7!important;
		color:  #fff !important;
		padding: 5px !important;
		font-size: 2.5em!important;
		text-align: center!important;
	}

	.flex-control-nav {
	    bottom: -50px !important;
	}

	.flex-control-nav li{
		margin-left: 20px!important;
		margin-right: 20px!important;
	}

	.flex-control-paging li a:hover,
	.flex-control-paging li a.flex-active {
		background-color: #4589c7!important;
	}

	.flex-control-paging li a{
		background-color: #ccc!important;
	}

	.flex-caption {
    	bottom: 10px;
	    width: auto;
	    left: 10px;
	}

	.flex-caption h2{
		font-size: 1em;
    	margin-bottom: 10px!important;
	}

	.flex-caption .btn{
		font-size: 0.75em
	}

}




.div-agences {
	background-image: url('../img/index/agences.jpg');
	padding-right: 10px;
	padding-left: 10px;
	min-height: 65vh;
	background-position: 20% 00%;
}

.div-agences h2 {
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.5);
	padding-right: 10px;
	padding-left: 10px;
}

.div-agences p {
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.5);
	padding-right: 10px;
	padding-left: 10px;
}

/* team */
/*--------------------------*/
.team-title {
	font-size: 1.15em;
	margin: 5px 0 0 0;
	color:#fff;
}

.team--secondary h4.team-title{
	color: #5d5d5d;
}

.team-detail {
	font-style: italic;
	margin: 10px 0 10px 0;
	font-size: 1em;
	color:#fff;
}

.team-aside div {
	border-radius: 50%;
    display: inline-block;
    overflow: hidden;
    background-color: #000;
}

.team--secondary,
.team--secondary a img{
	border-radius: 50%;
}


/* Photographer page */
/*********************/

.photographer-title{
	margin-top: 10px;
	margin-bottom: 10px;
}

.photographer-title h2{
	color: #fff;
	background-color: #4589c7;
	display: inline-block;
	padding: 5px 10px;
}

.next-photographer i,
.prev-photographer i{
	background-color: #4589c7;
	color: #fff;
	padding: 5px 8px;
	height: 45px;	
}

.fancybox-caption{
	padding: 15px 10px 20px 20px!important;
	background-color: rgba(0,0,0,0.2)!important;
	display: inline!important;
	text-align: left;
}


.fancybox-caption::after {
  border-bottom: none!important;
}

.fancybox-infobar {
	background-color: rgba(0,0,0,0.7)!important;
	color: #fff!important;
	mix-blend-mode: normal!important;
}

.fancybox-is-open .fancybox-bg {
    opacity: 0.95!important
}

.fancybox-slide--image{
	padding: 0!important;
}



/* footer */
/*--------------------------*/
#footer {
	background-color: #ddd;
	}
#footer .wrap {
	border-top: 1px solid #adadad;
	padding-top: 20px;
}
#footer small {
	text-align: center;
}




/* réseaux sociaux */

footer ul.rs{
	margin: 0;
	margin-top: 10px;
	padding: 0;
	list-style-type: none;
	text-align: left;
}


footer ul.rs li{
	display: inline-block;
	overflow: hidden;
}

footer ul.rs a{
	display: block;
	width: 42px;
	background-image: url(../img/rs.png);
	height: 0;
	padding-top: 42px;
	margin: 0 5px;
}

.fb{
	background-position: 0px 0;
}

.fb:hover{
	background-position: 0px -50px;
}

.tw{
	background-position: -50px 0;
}

.tw:hover{
	background-position: -50px -50px;
}

.in{
	background-position: -100px 0;
}

.in:hover{
	background-position: -100px -50px;
}


#totop {
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 3000;
	background-color: #4589c7;
	color: #fff;
	padding: 5px 8px;
}

/* Photographer page */

.etabs { margin: 0; padding: 0; }

/*
.tab { display: inline-block; zoom:1; *display:inline; background: #fff; border: solid 1px #999; border-bottom: solid 5px #fff; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; }
.tab a { font-size: 1em; line-height: 2em; display: block; padding: 0 10px; outline: none; color:#666666; }
*/

.tab { display: inline-block; zoom:1; *display:inline; background: #fff; border: solid 1px #999; border-bottom: solid 5px #fff; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; }
.tab a { font-size: 1em; line-height: 2em; display: block; padding: 0 5px; outline: none; color:#666666; }


.tab:hover { background-color: #4589c7; color: #fff; border-bottom: solid 5px #4589c7	}
.tab a:hover{ color: #fff;	 }

.tab.active { background: #fff; padding-top: 6px; position: relative; top: 1px; border-color: #666; border-bottom: solid 5px #4589c7; }
.tab a.active {  }

.tab.active:hover { background-color: #4589c7; color: #fff; border-bottom: solid 5px #4589c7	}
.tab a.active:hover{ color: #fff;	 }

.tab-container .panel-container { background: #fff; border: solid #666 1px; padding: 10px; -moz-border-radius: 0 4px 4px 4px; -webkit-border-radius: 0 4px 4px 4px; }

#biographie, #portfolio, #video, #livres {
	padding: 10px;
	border: 1px solid #999;
	border-radius: 10px;
}

#portfolio div {
	align-self: flex-end;
}


#biographie {
/*	border-top-left-radius:  0;*/
}

#biographie img {
	width: 100%;
	border: 5px solid #fff;
}

.photographer-file {
	border: 1px solid #999;
	padding: 5px;
	background-color: #3974ac;
	color: #fff;
}

.photographer-file{
	font-family: Arial;
	font-size: 0.8em;
}

.photographer-file p {
	margin-bottom: 10px;
}

.video-box{
	padding: 30px;
	margin-bottom:10px;
}

iframe{
	max-width: 100%;
}


/* Page présentation */

.banner{
/*	height: 70vh;*/
}

.link-img-box{
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
   	height: 100vh;
}

.link-img-box--france{
	background-image: url('../img/presentation/doisneau-10.jpg');
	background-position: 50% 00%;

}

.link-img-box--usa{
	background-image: url('../img/presentation/lange-26.jpg');	
	background-position: 90% 00%;
}

.link-img-box--photojournalisme{
	background-image: url('../img/presentation/ochlik-10.jpg');	
	background-position: 30% 50%;

}

.link-img-box--aujourdhui{
	background-image: url('../img/presentation/wolf-01.jpg');
	background-position: 30% 30%;

}

.link-img-box--magnum{
	background-image: url('../img/agences/cartier-bresson-02.jpg');
	background-position: 50% 00%;

}

.link-img-box--gamma{
	background-image: url('../img/agences/depardon-07.jpg');
	background-position: 50% 00%;

}

.link-img-box--rapho{
	background-image: url('../img/agences/weiss-01.jpg');
	background-position: 50% 00%;

}

.link-img-box--vu{
	background-image: url('../img/agences/duroy-01.jpg');
	background-position: 50% 00%;

}


.link-img-box div {
	bottom: -70vh;
	left:10px;
	width: 90%;
	padding:10px;
	background: rgba(0,0,0, 0.5);
	position: relative;
}

.link-img-box div h3{
	font-size: 1em;
}

.caption-img figcaption{
	font-size: 0.9em;
}

.caption-img img{
	align-self: flex-end;
}


/* menu secondaire pages présentation et agences */
.menu-secondary ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.menu-secondary a {
	display: block;
	padding: 0.2em;
	text-align: left;
	color: #666666;
	margin-bottom: 2px;
}

.menu-secondary .current {
	border-bottom: 2px solid #4589c7;
}

.aside-fixed {
	max-width: 280px;
}

.aside-fixed-grid{
	padding: 5px;
}


.big-letter p{
	text-align: right;
	line-height: 1em;
	font-size: 2em;
	margin: 0;
}


.team-simple figure div {
	border-radius: 50%;
	display: inline-block;
	overflow: hidden;
	background-color: #000;
}

.team-simple figure div img{
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;	
}

.team-simple figure div img:hover{
	opacity: 0.5;
}

.team-simple p{
	display: inline-block;
	color: #666666;
	padding: 5px;
	margin-top: 0;
}

.team-simple p:hover{
	background-color: #4589c7;
	color: #fff;
}

/*-----------------------------------------------------------*/
/* RWD */
/*-----------------------------------------------------------*/
/* tablet view */
/*--------------------------*/
@media (min-width: 481px){

/*	#header h1 {
	text-align: left;
	}*/

	/* nav */
	/*--------------------------*/
	.menu {
		height: auto; /* on affiche le menu */
		opacity: 1; 
		text-align: right;
	}
	.menu li {
		display: inline-block;
	}
	.menu a {
		padding: 0.5em 0.4em 0em 0.4em;
	}
	/* btn menu */
	/*--------------------------*/
	.btn-menu {
		display: none;
	}

	.caption-img {
		position: relative;
	}

	.caption-img figcaption{
		position: absolute;
		right: 5px;
		bottom: 5px;
		padding-left: 5px;
		margin-left: 5px;
		color: #fff;
		background-color: rgba(0,0,0,0.5);
		text-align: right;
	}

	.photographer-title{
		margin-top: 40px;
	}

	.big-letter p{
		font-size: 3em;
	}

	/* footer */
	/*--------------------------*/
	#footer small {
		text-align: left;
	}
	/*#totop {
		display: inline;
		text-align: inherit;
		background-color: transparent;
		color: #d35f60;
		padding: 0;
		margin: 0;
		border-radius: 0;
	}*/

}/*-- end of tablet view----*/

/* desktop view */
/*--------------------------*/
@media (min-width: 769px){

	h1, .h1-like {
		font-size: 2em;
	}
	h2, .h2-like {
		font-size: 1.75em;
	}
	h3, .h3-like {
		font-size: 1.5em;
	}
	
	.wrap {
	padding-left: 40px;
	padding-right: 40px;
	}

	.wrap--full{
	padding-left: 0;
	padding-right: 0;
	}

	/* Links */
	/*--------------------------*/
	a {
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	a:hover, a:active {
		color: #333;
	}

	#header h1 {
		font-size: 2.5em;
	}

	/* buttons */
	/*--------------------------*/
	.btn {
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.btn:hover {
		color: #4589c7;
		background-color: #fff;
	}
	.btn:active {
		top: 1px;
	}
	.btn--secondary:hover {
	color: #4589c7;
	background-color: #fff;
	}
	/* nav */
	/*--------------------------*/

	.menu a {
		padding: 0.5em 0.8em 0em 0.8em;
		border-bottom: 5px solid #fff;
	}

	.menu a:hover {
		background-color: #4589c7;
		color: #fff;
		border-bottom: 5px solid #4589c7;
	}

	.menu-secondary a:hover {
		background-color: #4589c7;
		color: #fff;
	}


	/* main */
	/*--------------------------*/
	.banner, .banner-app {
		background-attachment: fixed; /*Nota : Ne mettez pas le fixed en vue mobile et tablette 
										sinon vous faites sauter le COVER sur Ios !!!!
										TAKE CARE !!!! */
	}

	.h4-like-desktop{
		font-size: 1.25em;
	}

	.tab a {
	padding: 0 10px;
	}

	/* team */
	/*--------------------------*/
	/*
	1- agrandir l'image
	2- masquer ce qui dépasse
	3- mettre en position absolute la team-box
	4- masquer les éléments à l'état initial
	5-afficher les élément au hover
	*/
	.team {
		cursor: pointer;
		overflow: hidden; /*2*/
		position: relative; /*3*/
	}
	.team img {
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.team:hover img {
		transform: scale(1.5); /*1*/
	}
	.team-box {
		position: absolute; /*3*/
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background-color: rgba(0,0,0,0.7);
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
		opacity: 0; /*4*/
	}
	.team:hover .team-box {
		opacity: 1; /*5*/
	}
	.team-detail, .team-title {
		opacity: 0;/*4*/
		margin-top: 10px;
	}
	.team:hover .team-title {
		opacity: 1;/*5*/
		padding-left: 10px;
		color: #fff;
		-webkit-transition: all 0.3s ease-in-out 0.3s;
		transition: all 0.3s ease-in-out 0.3s;
	}
	.team:hover .team-detail {
		opacity: 1;/*5*/
		padding-left: 10px;
		color: #fff; 	
		-webkit-transition: all 0.3s ease-in-out 0.5s;
		transition: all 0.3s ease-in-out 0.5s;
	}

	.team-detail, h4.team-title {
		font-size: 0.9em;
		margin-top: 20%;
		margin-left: 0;
	}

	.link-img-box div {
		bottom: -70vh;
		left:50px;
		width: 50%;
		padding:20px;
	}

	.link-img-box div h3{
		font-size: 1.5em;
	}

	.aside-fixed {
		top: 240px;
		position: fixed;
		width: 22vw;
		max-width: 280px;
		font-size: 0.8em;
	}

	.aside-mobile {
		font-size: 0.8em;
		max-width: 200px;		
	}

	.aside-fixed-grid{
		top: 350px;
		position: fixed;
		width: 22vw;
		max-width: 280px;
	}

	.big-letter p{
		font-size: 4em;
	}

	/* footer */
	/*--------------------------*/
	#totop:hover {
		color: #4589c7;
		background-color: #fff;
	}
}/*-- end of desktop view----*/