/**********************************
	* CSS DOCUMENT
**********************************/	
@font-face{
    font-family:"Brown";
    font-weight: normal;
    src:url("Fonts/Brown-Regular.woff2") format("woff2"),url("Fonts/Brown-Regular.woff") format("woff");
}
@font-face{
    font-family:"Brown";
    font-weight: bold;
    src:url("Fonts/Brown-Bold.woff2") format("woff2"),url("Fonts/Brown-Bold.woff") format("woff");
}
@font-face{
    font-family:"Brown Bold Italic";
    src:url("Fonts/Brown-BoldItalic.woff2") format("woff2"),url("Fonts/Brown-BoldItalic.woff") format("woff");
}
/***
 * Icons
**/
@font-face {
  font-family: 'c3icons';
  src:url('Fonts/c3icons.eot?-xiwskd');
  src:url('Fonts/c3icons.eot?#iefix-xiwskd') format('embedded-opentype'),
    url('Fonts/c3icons.ttf?-xiwskd') format('truetype'),
    url('Fonts/c3icons.woff?-xiwskd') format('woff'),
    url('Fonts/c3icons.svg?-xiwskd#c3icons') format('svg');
  font-weight: normal;
  font-style: normal;
}

/** ====================================================
   GLOBAL RESET
====================================================== */
*, html, body, iframe, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, table, th, td, audio, video { margin:0; padding:0; outline:0; box-sizing:border-box; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, img { display:block; }
table { border-collapse:collapse; border-spacing:0; }
table td { vertical-align:top; }
iframe, fieldset, img, a img { border:0 none; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; text-align:left; } 
h1, h2, h3, h5, h5, h6 { font-size:100%; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
nav ul { list-style:none }
ol, ul, li { list-style:none; }
html>body * a { position:relative; }  /* Gets links displaying over a PNG background */
a { outline:none; } /* Gets rid of Firefox's dotted borders */
input, select { vertical-align:middle; }


/* ======================================================
   TRANSITIONS
====================================================== */
a, button, .btn, .icon { transition: all ease-in 0.1s; }


/* ======================================================
   GENERIQUE et classes courantes
====================================================== */
html { height:100%; /*important for chrome*/ width:100%; }
body { width:100%; font:1em/1.4em "Brown",helvetica, Arial, sans-serif; color:#333132; text-align:left; background-color: #fff; /*letter-spacing: 0.1em; word-spacing: 0.1em;*/ }
h1 { margin:0.5em 0; font: normal 1.4em/1.2em "Brown Bold Italic",helvetica, Arial, sans-serif; text-transform: uppercase; letter-spacing: 0.24em; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; }
h2 { margin:0.5em 0; font: normal 1.4em/1.0em "Brown Bold Italic",helvetica, Arial, sans-serif; text-transform:uppercase; letter-spacing: 0.24em; }
h3 { margin:0.5em 0; font: normal 1.2em/1.0em "Brown Bold Italic",helvetica, Arial, sans-serif; text-transform:uppercase; }
h4 { margin-top:1em; font-weight: bold; font-size: 1em; text-transform:uppercase; }
h5 { font-weight: normal; font-size: 1em; text-transform:uppercase; }
h6 { margin:1em 0; font-weight: normal; font-size: 1em; text-transform:uppercase; }

a { color:#777; text-decoration:underline; }
a:hover, a:focus { color:#000; }
strong, b { font-weight:bold; }
em, i { font-style:italic; }
img { width: 100%; max-width: 100%; }
p { margin: 0.5em 0 1.5em; }
hr { clear:both; margin:2em 0; padding:0; border:none; line-height: 2px; height: 2px; background-color: #aaa; color: #aaa; }

.imgToLeft { float:left; margin: 0 1em 1em 0; }
.imgToRight { float:right; margin: 0 0 1em 1em; }
.invisible, .hidden { display:none; }
.debug { display: none; }
.smaller { font-size:0.8em; }
.msg, .error-msg { color: red; }
.ctn-msg { padding: 1em 0;} /***#039112***/
.ctn-msg .error { color: red; } 
.ctn-msg .success { color: green; } 
.transparent { zoom: 1; filter: alpha(opacity=90); opacity: 0.9; }
.clearing { clear:both; }
.clear-float { clear:both; }
.clear-fix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }

.wrapper {margin: 0 auto; width: 94%; }
.wrapper:after { clear: both; }
.wrapper-inner { margin: 0 auto; padding: 2em 0; width: 94%; }

#content ul, #content ol { margin:0.5em 0 1.5em; }
#content ul li { float:none; list-style:disc outside; margin:0 0 0.5em 1em }
#content ol li { float:none; list-style:decimal outside; margin:0 0 0.5em 1em }

.more { display: block; margin: 1em 0; font-size: 1em; line-height: 1em; text-transform: uppercase; text-decoration: none; }
.more:after { font-family: "c3icons"; content: "\e602"; font-size: 1em; line-height: 1em; margin-left: 0.5em; }
a.btn { display:inline-block; margin:0.5em 1.5em 0.5em 0; padding:0.5em 1em; border: 2px solid #fff; background-color:#333132; color:#fff; text-decoration:none; text-transform: uppercase; text-align: center; cursor: pointer; }
a.btn:hover, a.btn:focus { text-decoration:none; color:#333132; background-color:#fff; border-color:#333132; }
a.btn-white { background-color:#fff; color:#333132; border-color:#333132; }
a.btn-white:hover, a.btn-white:focus { background-color:#333132; color:#fff; border-color:#fff; }
a.btn-prayer, a.btn-tech, a.btn-jesus, a.btn-give { margin:0.5em 0 0 0; width: 100%; font-size: 0.7em; }
.btn-goToSite { display: block; margin: 1em 0 0 0; }
.btn-icon { color: #fff; display:block; font-size: 1.7em; float: left; width:50px; height:50px; overflow:hidden; text-decoration: none; text-align: center; z-index: 2; }
.btn-icon:hover, .btn-icon:focus { color: #fff; text-decoration: none; }
.btGoBottom { position:absolute; bottom:5%; left:50%; margin-left: -25px; color:#fff; }
.btGoBottom:hover { color:#fff; }
.white-theme a.btGoBottom, .white-theme a.btGoBottom:hover { color:#fff; }
.btGoBottom.active { -webkit-transform: rotate(180deg); transform: rotate(180deg); color:#fff; }

.white-theme { background-color: #fff; color: #333132; }
.white-theme a { color: #777; }
.white-theme a:hover, .white-theme a:focus { color: #000; }
.white-theme a.btn { color: #fff; }
.white-theme a.btn:hover, .white-theme a.btn:focus { color: #333132; }
.white-theme a.btn-white { color: #333132; }
.white-theme a.btn-white:hover, .white-theme a.btn-white:focus { color: #fff; }
.black-theme { background-color: #333132; color: #fff; }
.black-theme a { color: #fff; }
.black-theme a:hover, .black-theme a:focus { color: #fff; }
.black-theme a.btn { color: #fff; }
.black-theme a.btn:hover, .black-theme a.btn:focus { color: #333132; }
.black-theme a.btn-white { color: #333132; }
.black-theme a.btn-white:hover, .black-theme a.btn-white:focus { color: #fff; }
/* On refixe pour les div pour régler les pb d'héritage */
div.white-theme a { color: #777; }
div.white-theme a:hover, div.white-theme a:focus { color: #000; }
div.white-theme a.btn { color: #fff; }
div.white-theme a.btn:hover, div.white-theme a.btn:focus { color: #333132; }
div.white-theme a.btn-white { color: #333132; }
div.white-theme a.btn-white:hover, div.white-theme a.btn-white:focus { color: #fff; }
div.black-theme a { color: #fff; }
div.black-theme a:hover, div.black-theme a:focus { color: #fff; }
div.black-theme a.btn { color: #fff; }
div.black-theme a.btn:hover, div.black-theme a.btn:focus { color: #333132; }
div.black-theme a.btn-white { color: #333132; }
div.black-theme a.btn-white:hover, div.black-theme a.btn-white:focus { color: #fff; }
/*
  ICONS
*/
.icon { 
  font-family: 'c3icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; letter-spacing: normal;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-menu:before { content: "\e600"; }
.icon-arrow-left:before { content: "\e601"; }
.icon-arrow-right:before { content: "\e602"; }
.icon-go-down:before { content: "\e603"; }
.icon-close:before { content: "\e604"; }
.icon-facebook:before { content: "\e605"; }
.icon-instagram:before { content: "\e606"; }
.icon-podcast:before { content: "\e607"; }

/* 
  Formulaires 
*/
form { margin:1em 0; font-size: 0.9em; }
form p { clear:both; margin:0.3em 0; padding: 0; }
form label { display:block; float:left; padding:0.1em 0; width:75%; cursor:pointer; }
form input[type="text"], form input[type="password"], form textarea, form select { 
  padding:0.5em 0.5em; width:100%; font:1em/1.3em "Brown",Arial,Helvetica,sans-serif; color:#333132; background-color:#fff; border:2px solid #333132; }
form select { margin-bottom: 0.1em; padding: 0.2em 0.5em; }
form input[type="text"]:focus, form input[type="password"]:focus, form textarea:focus { border-color:#aaa; }
form textarea { height:10em; }
form input[type="submit"] { margin:1em 0; padding:0.3em 1em; font-family:"Brown",Arial,Helvetica,sans-serif; font-size:1em; text-transform:uppercase; border:2px solid #333132; background-color:#fff; color:#333132; text-decoration:none;  cursor:pointer; }
form input[type="submit"]:hover, form input[type="submit"]:focus { border-color:#fff;  background-color:#333132; color: #fff; }
button { margin:1em 0; padding:0.3em 1em; font-family:"Brown",Arial,Helvetica,sans-serif; font-size:1.1em; text-transform:uppercase; border:2px solid #333132; background-color:#fff; color:#333132; text-decoration:none;  cursor:pointer; }
button:hover, button:focus { border-color:#fff;  background-color:#333132; color: #fff; }
.code-image { clear:both; margin:1em 0; }
.code-image label { display:block; float:none; margin-bottom:0.5em; width:100%; }
.code-image img { border:medium none; float:left; margin:0 0.5em 0 0; width:150px; border-radius:inherit; }
.code-image #field-captcha { height:50px; width:140px; text-align:center; letter-spacing:0.4em; text-transform:uppercase; }
.checkbox { position: relative; }
.checkbox label { float: none; margin-left: 2em; width: 100%; }
.checkbox input { position: absolute; top: 10px; left: 0; }
form.agendaTypeSelect select { 
    width: 150px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: inline-block;
    padding: .5em 2em .5em .9em;
    cursor: pointer;
    color: #fff;
    font-family: inherit;
    font-size: 1em;
    border: 1px solid #333132;
    border-radius: .2em;
    background-color: #333132;
    background-image:  url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNzAiIGhlaWdodD0iMjQwIj4KPHBhdGggZmlsbD0iI2ZmZmZmZiIgZD0iTTUsNUgyNjVMMTM1LDIzMCIvPgo8L3N2Zz4=');
    background-size: .8em;
    background-repeat: no-repeat;
    background-position: calc(100% - .4em) center;
}
form.agendaTypeSelect select option { color: #fff; background-color: #333132; }
#form-contact input, #form-contact select, #form-contact textarea { max-width: 310px; } 
#form-kids select { width: 30%; }
#form-kids input[type="button"] { margin-left: 0.2em; }
#form-worldpay input[type="text"] { width:150px; }

div[data-service="googlemaps"] { display: block; max-width: 700px; }
.cc_div button { color: #000; }
/* ======================================================
   HEADER
====================================================== */
#header { background-color: #fff; color: #333132; position: fixed; top: 0; width: 100%; z-index: 100; }
#logo { display: block; margin: 0.7em 0; width: 210px; height:56px; }
#logo img { width: auto; height: 100%; }


/* ======================================================
   MENU
====================================================== */
.sb-toggle-right { 
  display:block; position: absolute; top: 2.2em; right: 2.5%; padding: 0 0.5em; text-align:right; line-height: 1; cursor:pointer; }
.sb-toggle-right .icon { font-size: 1.3em; vertical-align: middle; }
.blk-menu { margin:0 -220px 0 0; padding:0 3%; height: 100vh; position: absolute; top: 0; right: 0; z-index: 10; background-color:#333132; text-align:left; width: 220px; }
.blk-menu.open { transform: translate(-220px); }
#menu { float:none; width:auto; padding:1.4em 0 2em; color:#fff; font-family:"Brown",arial,helvetica,sans-serif; border-bottom: 1px solid #fff; }
#menu li.btn-menu { position:relative; display:block; margin:0 0 1px 0; list-style:none; }
#menu li.btn-menu > a { display:inline-block; padding:0.5em 0 0; color:#fff; text-decoration:none; text-transform:uppercase; line-height:1.5em; white-space: nowrap; }
#menu li.btn-menu > a span { display:inline-block; border-bottom:2px solid transparent; }
#menu li.btn-menu > a:hover span, #menu > li.btn-menu:hover > a span, #menu > li.btn-menu:focus-within > a span { font-weight: bold; }
#menu li.btn-menu.current > a span { font-weight: bold; }
button.btnOpen { display:block; position:absolute; top:0; right:0; margin:0; padding:.5em; border:none; font-size:1em; font-weight:bold; color:#fff; background-color:transparent; }
button.btnOpen:hover, button.btnOpen:focus { color:inherit; background-color:inherit; }
i.icon-arrowdown::after { font-style:normal; }
i.icon-arrowdown::after { display:inline-block; font-family:'c3icons';content:"\e602"; transform:rotate(90deg); }

/* Sous-menu */
div.s-menu { display:none; margin:0; padding:.5em 0; width:auto; }
div.s-menu.active { display: block; }
div.s-menu li { margin:.25em 0 }
div.s-menu a { color:#fff; text-decoration:none; white-space:nowrap; }
div.s-menu a:hover, div.s-menu a:focus { text-decoration:underline }
div.ss-menu, div.s-menu ul { display:inline-block; break-inside:avoid-column; }
div.ss-menu { margin-bottom:1.65em; }
div.ss-menu > span { display: inline-block; margin-top:.25em; padding:0; width:100%; line-height:1.5; font-weight:bold; color:#777 }

/* Langue */
#menulang { position:absolute; top:0.5em; right:2.5%; text-align:right; padding-bottom: 2px; }
#menulang li.btn-menu { display:inline-block; }
#menulang li.btn-menu a { border-left:1px solid #333132; line-height:1em; color:#333132; display:block; padding:0 0.5em; text-decoration:none; text-transform:uppercase; }
#menulang li.btn-menu a.current { font-weight: bold; }
#menulang li.btn-menu:first-child a { border-left:none; }

/* Menu divers */
.blk-menu .blk-social .btn-icon { color: #fff; }
.blk-menu address { margin:2em 0 0; padding:2em 0 0; line-height:1.5em; color:#fff; border-top:1px solid #fff; }

/* Animation */
.blk-menu {
  -webkit-transform: translate( 0px );
  transform: translate( 0px );
  
  transition: transform 400ms ease;
  
  -webkit-transition-property: -webkit-transform, left, right; /* Add left/right for Android < 4.4. */
  -webkit-backface-visibility: hidden; /* Prevents flickering. This is non essential, and you may remove it if your having problems with fixed background images in Chrome. */
}
.sb-hide { 
  display: none; /* Optionally applied to control classes when Slidebars is disabled over a certain width. */
}
.sb-close { position:absolute; display:block; top:2.2em; right:2.5%; margin:0; padding:0; width:30px; height:30px; line-height:30px; font-size:0.8em; color:#fff; cursor:pointer; }

/* ======================================================
   MAIN, CONTENT
====================================================== */
#content { position: relative; padding-top: 50px; }
.home #content { padding-top: 0; }
#content .top-image { background-position: center top; background-repeat: no-repeat; background-size: cover; height: 200px; }
#content .wrapper { margin-bottom: 3em; }
#content .parallax { background-attachment: fixed; background-position: center center; background-repeat: no-repeat; background-size: cover; }
.center { text-align: center; }

/* Bloc avec image de fond */
.img-bkg { background-position: center center; background-repeat: no-repeat; background-size: cover; padding: 1px 0; }
.img-bkg h1 { color: #fff; text-align: center; }
/* Bloc responsive */
#content .ctn-responsive { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%;  }
/*#content .ctn-responsive.gmaps { margin:auto; padding-bottom: 28%; max-width: 100%; }*/
#content .ctn-responsive iframe, #main .ctn-responsive embed, #main .ctn-responsive object { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* Affichage en grille */
.grid-items, .grid-2columns { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-flow: row wrap; }
.grid-items h2 { font-family:"Brown",arial,helvetica,sans-serif; font-weight: bold; font-size: 1.2em; letter-spacing: initial; margin-bottom: 0; }
.grid-items .item { position: relative; margin-bottom: 1.5em; width: 100%; text-transform: uppercase; }
.grid-items .item .ctn-image { position: relative; }
.grid-items .item .link { position: absolute; top: 0; bottom: 0; right: 0; left: 0; }
.grid-2columns .column { margin:0.5em 0; width: 100%; }
.grid-2columns .column-livestream { text-transform: uppercase; }
.grid-2columns .column img { width: 100%; }
.grid-2columns .column iframe { margin: 0; width: 100%; height: 100%; }
.grid-2columns .white-column { color: #333132; background-color: #fff; padding: 1.5em; }
.grid-2columns .column .code-image img { width: initial; margin: initial; }

/*
  Page GROUPES
*/
.list-groups { font-size: 1.2em; padding: 0; }
#content .list-groups li { background-color: #fff; list-style: none; margin: 2.5em 0; }
#content .list-groups li a { display: block; color: #333132; font-family:"Brown Bold Italic",arial,helvetica,sans-serif; text-decoration: none; padding: 1em; text-transform: uppercase; }

/*
  Page CULTE
*/
.list-kids { margin-bottom: 2em; }
#content .list-kids li { list-style: none; display: block; margin: 0.5em 0; height: 64px; }
#content .list-kids li a { display: block; height: 100%; }
#content .list-kids li img { width: auto; height: 100%; }
a.livestream-thumb { position: relative; display: block; }
a.livestream-thumb::after { content: url("/template/images/picto_video-white.svg"); width: 30%; height: auto; display: block; position: absolute; top: calc(20%); left: calc(35%); margin: 0 auto; opacity: 0.8; }

/*
  Page EVENEMENTS / Calendrier
*/
.section-events { margin-top:50px; }
.title_calendriercomplet { display: none; }
.events #content { position: static; }
.monthBloc img { width: auto; }
.monthBloc h1 { background-color: #fff; font-size: 1.4em; position: absolute; z-index: 11; width: 94%; }
#content ul.list-dates { width:100%; margin:1em 0 1em 0; padding:4em 0 2em; border-bottom:2px solid #333132; list-style:none; }
#content .monthBloc:last-child ul.list-dates { border-bottom: 0; }
#content ul.list-dates li.item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-flow: row wrap; align-items: center; position:relative; margin:0; list-style: none; }
#content ul.list-dates li.item:before { content: " "; position:absolute; top:51%; left:calc(25% - 20px); transform: translate(0, -50%); padding:0 12px 24px; background:#fff; border-radius:60px; font-size:1em; color:#fff; border:4px solid #ccc; z-index: 10; }
.list-dates li.item .itemDate { margin: auto 0; padding:0.7em 0; width:25%; text-align:center; border-right:7px solid #ccc; }
.list-dates li.item:last-child .itemDate { padding-bottom:0; }
.list-dates li.item .itemDate .day { display:block; line-height:1em; }
.list-dates li.item .itemDate .datenum { display:block; font-size:3em; line-height:1em; }
.list-dates li.item .itemDate .hour { display:block; line-height:1em; }
.list-dates li.item .itemImg { margin: 0 1em 0 0; width: auto; height: auto; max-width: 60px; }
.list-dates li.item h2 { font-family:"Brown",arial,helvetica,sans-serif; font-weight: bold; font-size: 1.1em; padding:0; margin: 0; color: #333132; text-transform: none;}
.list-dates li.item .itemLink { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-flow: row wrap; align-items: center; }
.list-dates li.item .itemLink { border-left:7px solid #ccc; margin:auto 0 auto -7px; padding:0 50px 0 40px; text-decoration:none; width: 75%; color: #777; }
.list-dates li.item a .icon { color: #ccc; font-size: 2.4em; position: absolute; top: 50%; transform: translate(0, -50%); right: 0; }
#content ul.list-dates li.item a.itemLink:hover, #content ul.list-dates li.item a:hover .icon { color: #333132; }
#content ul.list-dates li.item .itemLink div { padding: 0.5em 0; width: 73%; }
#agenda .agendaTypeSelect { float: right; margin: 0; }

/*
  HOMEPAGE
*/
.blk-pastors { position: relative; padding-top: 45%; }
.blk-pastors .gradient { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; }
.blk-pastors .wrapper-inner { position: relative; z-index: 2 }
#content .blk-pastors.parallax { background-attachment: scroll; background-position: center -50px; background-size: contain; }

/* 
  HOMEPAGE / banner image-video
*/
#myBanner { padding-top: 50px; position: relative; }
#myBanner .blk-banner { background-position: center center; background-size: cover; background-repeat: no-repeat; position: relative; overflow: hidden; width: 100%; height: calc(100vh - 50px); }
.blk-banner iframe {
  width: 100vw;
  height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
  min-height: 100vh;
  min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
.blk-banner img {
  width: 100vw;
  height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
  min-height: 100vh;
  min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
.blk-banner a { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 4; }
.blk-banner .text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; }
.blk-banner .text h3 { color: #fff; font-size: 3.5em; font-family: "Brown",helvetica, Arial, sans-serif; font-weight: bold; font-style: italic; letter-spacing: 0.18em; }

/* 
  HOMEPAGE / livestream popup
*/
#live-popup { background-color: #fff; padding: 2.5em; position: relative; width:auto; max-width: 600px; margin: 20px auto;}
#live-popup h2 { margin: 0 0 0.5em; color: #333132; }
#live-video-popup { background-color: #fff; padding: 2.5em; position: relative; width:auto; max-width: 736px; margin: 20px auto;}
#live-video-popup a.btn { display: block; float: left; }

.js-video {
  height: 0;
  padding-top: 25px;
  padding-bottom: 67.5%;
  margin-bottom: 10px;
  position: relative;
  overflow: hidden;
}
.js-video.widescreen {
  padding-bottom: 56.34%;
}
.js-video.vimeo {
  padding-top: 0;
}
.js-video embed, .js-video iframe, .js-video object, .js-video video {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}
button.mfp-close { margin:0; background-color: transparent; border: none; }



/* ======================================================
   FOOTER
====================================================== */
#footer { position: relative; background-color: #333132; color: #fff; text-transform: uppercase; }
#footer.white-theme { background-color: #fff; color: #333132; }
#footer a { color: #fff; text-transform: uppercase; text-decoration: none; }
#footer a:hover, #footer a:focus { color: #fff; text-decoration: underline; }
#footer.white-theme a { color: #333132; }
#footer .links a {  }
.blks-footer { padding: 1.5em 0 0; position: relative; }
.blks-footer .column { margin: 1.5em 0; text-align: left; }
.blks-footer .col1 { margin-top: 0; }
.blks-footer .col2 { position: absolute; top: 0; right: 0; text-align: right; }
.blks-footer .col3 { margin: 0 auto; text-align: center; max-width: 350px }
a.appBtn { float: left; padding: 0.5em 2%; width: 50%; }
.copyright { padding: 0.5em 0 3em; line-height: 1em; font-size: 0.5em; text-align: center; }


/**=====================================================
   ECRANS smartphones portrait seulement
====================================================== */
@media (max-width:480px) {
  .slideTxt { width:60%; top: 35%; left:50%; margin-left: -30%; }
  .slideTxt h1 { font-size: 1.8em; }
  
  .ctn-classes a { width: 98%; }

  #content ul.list-dates img { width: 50px; }
  #content ul.list-dates li.item::before { left: 70px; }
  #content ul.list-dates li.item .itemDate { font-size: 0.7em; width: 90px; }
  #content ul.list-dates li.item h2 { clear: both; }
  #content ul.list-dates li.item .itemLink { padding: 0 0 0 20px; }
  #content ul.list-dates li.item a .icon { display: none; }
  .blk-pastors { padding-top: 40%; }
}


/**=====================================================
   ECRANS moyens: tablettes
====================================================== */
@media (min-width:641px) {
  #logo { width: 245px; }
  .grid-items .item { width:31.33%; margin:0 2% 1.5em 0; }
  .grid-2columns .column { margin:0 5% 0 0; width: 45%; }
  .grid-2columns .column:nth-of-type(2n) { margin-right: 0; margin-left: 5%; width: 45%; }
  #content ul.list-dates li.item .itemLink div { width: 75% }
  .blks-footer .col1 { position: absolute; top: 0; left: 0; margin-top: 1.5em; }
  #content .ctn-responsive.gmaps { margin:auto; padding-bottom: 30%; max-width: 100%; }
  .blk-pastors { min-height: 700px; padding-top: 20%; }
  .blk-pastors .gradient { 
  background: -moz-linear-gradient(181deg, rgba(255,255,255,0) 0%, rgba(253,254,255,0) 52%, rgba(252,254,255,1) 70%, rgba(252,254,255,1) 100%); /* ff3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(252,254,255,1)), color-stop(30%, rgba(252,254,255,1)), color-stop(48%, rgba(253,254,255,0)), color-stop(100%, rgba(255,255,255,0))); /* safari4+,chrome */
  background: -webkit-linear-gradient(181deg, rgba(255,255,255,0) 0%, rgba(253,254,255,0) 52%, rgba(252,254,255,1) 70%, rgba(252,254,255,1) 100%); /* safari5.1+,chrome10+ */
  background: -o-linear-gradient(181deg, rgba(255,255,255,0) 0%, rgba(253,254,255,0) 52%, rgba(252,254,255,1) 70%, rgba(252,254,255,1) 100%); /* opera 11.10+ */
  background: -ms-linear-gradient(181deg, rgba(255,255,255,0) 0%, rgba(253,254,255,0) 52%, rgba(252,254,255,1) 70%, rgba(252,254,255,1) 100%); /* ie10+ */
  background: linear-gradient(269deg, rgba(255,255,255,0) 0%, rgba(253,254,255,0) 52%, rgba(252,254,255,1) 70%, rgba(252,254,255,1) 100%); /* w3c */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FCFEFF', endColorstr='#FFFFFF',GradientType=1 ); /* ie6-9 */
  }
  #content .blk-pastors.parallax { background-attachment: fixed; background-position: center center; background-size: cover; }
  #content .blk-pastors p { max-width: 35% }
}

/*
  Pour le menu home page probleme overflow ie
*/
@media (max-width:960px) {
  .sb-slidebar { overflow-y: auto; /* Enable vertical scrolling on Slidebars when needed. */ }
}

@media (min-width:960px) {
  html { height:auto;/* Supprime l'ascenseur vertical */ }
  h1 { font-size: 2em; line-height: 1.2em; letter-spacing: 0.24em; }
  h2 { font-size: 2em; line-height: 1.2em; letter-spacing: 0.24em; }
  h3 { font-size: 1.5em; line-height: 1.0em; }
  .debug { display: block; }
  #header .logolink { display:block; float:left; width:10%; }
  .wrapper-inner { padding: 3em 0; max-width: 960px; width: auto; }
  
  #content.page-standard h1 { position: absolute; width: 19%; margin: 0 0 0 -22%; text-align: right; }
  #content.page-standard .wrapper-inner { margin-left: 25%; margin-right: 10%; }
  #content .top-image { height: 350px; }
  
  a.btn-prayer, a.btn-tech, a.btn-jesus, a.btn-give { width: calc(98%/2); margin-right:2%; vertical-align: middle; }
  a.btn-tech, a.btn-give { margin-right:0; }
  .more { font-size: 1.2em; }
  a.item { clear:none; float:left; width:32%; }
  a.item.child2 { margin:0 2%; }
  a.item img { float:none; margin:0; width:100%; }
  #content .list-kids li { display: inline-block; margin: 0.5em; }
  
  .sb-toggle-right, .blk-menu .sb-close, .blk-menu address, .blk-menu .blk-social { display:none; }
  .blk-menu { background: #fff; position: absolute; top:50%; transform: translate(0,-50%); right: 120px; padding: 0; margin: 0; height: auto; width: auto; }
  .blk-menu.open { transform: translate(0);  }
  #menu { padding:0; color:#fff; border:none; }
  #menu li.btn-menu { display:inline-block; margin:0 1px 0 0; }
  #menu li.btn-menu a { display:inline-block; padding:0 1em; color:#333132; font-size: 0.9em; }
  #menu li.btn-menu a:hover span { border-bottom-color:#fff; }
  #menu li.first-child { display:none; }
  #menu > li:nth-child(3) div.s-menu { columns:3; }
  div.s-menu { position:absolute; right:auto; top:auto; box-shadow:0 .5em .5em 0 rgba(0, 0, 0, 0.1); text-align:left; background-color:#fff; }
  #menu > li:hover .s-menu, #menu > li:focus-within .s-menu { display:block }
  div.s-menu a { color:#333132; }
  div.ss-menu > span { padding:0 1em; font-size:.9em; color:#333132 }
  button.btnOpen { display:none }
  #menulang { top:50%; transform:translate(0,-50%); }
  #menulang li.btn-menu a { font-size: 0.9em; }

  .monthBloc h1 { width: 13%; min-width: 260px; font-size: 1.6em; }
  #content ul.list-dates { width:77%; margin:1em 0 1em 23%; padding:0.5em 0 2em; list-style:none; }

  form input[type="text"], form input[type="password"], form textarea, form select { width: 100% }
  #footer { line-height: 1.4em; }
  .blks-footer .column { width: 33.33% }

  .fullscreen { min-height: 94vh; }

  /* Affichage fullscreen de la section événements */
  .title_calendriercomplet { display: block; margin: 1.5em 0; }
  .title_calendriercomplet span { font: normal 1.5em/1.4em "Brown Bold Italic",helvetica, Arial, sans-serif; text-transform: uppercase; }
  .title_calendriercomplet .btGoBottom { position: relative; }
  /*
  .section-events { min-height: 100vh; }
  .section-events .wrapper-inner { padding-bottom: 0; }
  .section-events .item img { width: auto; height: 60%; }
  .section-events .grid-items .item { margin-bottom: 2%; height: 48%; }
  .highlightEvents { height: 65vh; }
  */
  #agenda.wrapper-inner { padding-top: 1.5em; }
}


/**=====================================================
   ECRANS + grands
====================================================== */
@media (min-width:1280px) {
  body { font-size: 1.2em; }
  .wrapper-inner { padding: 4em 0; max-width: 1080px; }
  #content.page-standard h1 { margin: 0 0 0 -22%; width:19%; }
  #content.page-standard .wrapper-inner { margin-left: 25%; margin-right: 25%; }
  #content .parallax { min-height: 650px; }
  .blk-menu { right: 160px; }
  #menu li.btn-menu a { font-size: 0.8em; }
  #menulang li.btn-menu a { font-size: 0.8em; }
  div.ss-menu > span { font-size:.8em }
  #content .list-kids li { margin: 0.4em; height: 72px; }
  form { font-size: 0.8em; }
  .blk-pastors { min-height: 500px; padding-top: 10%; }
}