@charset "utf-8";
/* CSS Document */

/**
 * Cette feuille de styles gère XXXXX
 */

/*
==================================================
    Table of Contents / Sommaire
==================================================
    #Mobile (Portrait)  // 320px
    #Mobile (Landscape) // 576px
    #Tablet (Portrait)  // 768px
    #Tablet (Landscape) // 992px
    #Computer           // 1200px+ > 1250 avec scrollbar 
*/

/*
==================================================
    Mobile (Portrait)   // 320px
==================================================
    Pas besoin de déclarer de média queries
*/

.daccueil section {
    margin: 5rem 0;
}

.daccueil section.container {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
}

.daccueil section.container > .row {
    margin-left: 15px;
    margin-right: 15px;
}

/**
 * SECTION EDITO
 */
.daccueil .edito strong{
    color:#FFF;
    background-color: var(--focus-main);
}

.daccueil .jumbotron {
    background-image: url(/templates/masterA/design/responsivePublic/images/headerHome.jpg);
    height: 30vh;
    background-size: cover;
    background-position: center center;
}

/**
 * SECTION FOCUS
 */

.focus p:last-child{
    margin-bottom: 0;
}
/**
 * SLIDER ACCUEIL
 */
.daccueil .flexslider .slides > li {
    background: var(--neutral-dark);
}

.daccueil .flexslider .slides > li .slideText h2 {
    font-weight: 800;
    padding: 0;
}

.daccueil .flexslider .slides > li .slideText {
    color:var(--color-main);
    text-align: center;
    padding: 1rem;
}

.daccueil .flexslider .slides > li .slideText h2:before {
    display:none;
}

.daccueil .flexslider .slides > li .slideText .description strong {
    color:#FFF;
    font-size: 1.313rem;
}

.daccueil .flexslider .slides > li .slideText a {
    color:#FFF;
    background-color: var(--focus-main);
    padding: .688rem .813rem;
    border-radius:var(--radius-lg);
    text-transform: uppercase;
    font-weight: 600;
    float: none;
    display: inline-block;
}

/**
 * ACTU TF
 */
.actuContent {}

.actuContent > div {
     height: 320px;
     margin-bottom: 2rem;
}

.actuContent .one {
    position: relative;
    border-radius:5px;
    overflow: hidden;
    height: 100%;
}

.actuContent .one .photo  {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 0;
}
.actuContent .one .photo:after  {
    content:"";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 0;
    background: #0DA5C5;
    opacity: .35;
    transition:all ease .3s .15s;
}

.actuContent .one .photo img {
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    max-width: none;
    z-index: 0;
}

.actuContent .one .content  {
    position: absolute;
    z-index: 1;
    color:#FFF;
    padding: 1rem;
    bottom: 0;
}

.actuContent .one .date  {
    display:block;
}

.actuContent .one .title  {
    display:block;
    font-weight: 800;
    font-size: 1.2rem;
    line-height: 1.2;
}

.actuContent .one .desc  {
    font-size: .813rem;
    margin-bottom: 0;
}

.actuContent .one .link  {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
}

.actuContent .one .link:after {
    content: "\f08e";
    font-family: "Font Awesome 5 Pro";
    font-weight: 300;
    color:#FFF;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1;
    height: 20px;
    width: 20px;
    transition: all ease .2s;
}

/**
 * BLOG
 */
.blogContent {}

.blogContent .one {}

.blogContent .one .photo {}
.blogContent .one .photo img {}

.blogContent .one .title {
    color: var(--color-main);
    margin: 1rem 0;
    display: block;
    font-size: 150%;
    line-height: 130%;
    font-weight: 800;
}

.blogContent .one .text {
    font-size: .813rem;
    margin-bottom: 1rem;
}

.blogContent .one .date {
    font-size: .813rem;
    font-style: italic;
    color: var(--color-main);
}

.blogContent .one .date span {
    color:var(--neutral-main);
}


/*
==================================================
    Mobile (Landscape)  // 576px
==================================================
*/
@media screen and (min-width: 576px) {


}/*/mediaquery*/


/*
==================================================
    Tablet (Portrait)   // 768px
==================================================
*/
@media screen and (min-width: 768px) {

.daccueil header {
    background: transparent !important;
    box-shadow: none  !important;
}

.daccueil header.OFF {
    background: #FFF  !important;
    box-shadow: 0 6px 20px rgba(0,0,0,.2) !important;
}

/**/
.daccueil section {
    margin: 4rem 0;
}

/**
 * CONTENT MAIN
 */
.daccueil .container-main {
    margin-top: 85px;
    padding-left: 0;
    padding-right: 0;
}

/**
 * ACTU TF
 */
.actuContent > div:nth-of-type(2n) {
    height: 250px;
}

.actuContent > div:nth-of-type(5) {
    margin-top: -70px;
}

}/*/mediaquery*/


/*
==================================================
    Tablet (Landscape)  // 992px
==================================================
*/
@media screen and (min-width: 992px) {

/**
 * JUMBOTRON
 */
.daccueil .jumbotron {
    height: 50vh;
}

/**
 * FLEXSLIDER
 */
.daccueil .flexslider .slides > li .slideText {
    text-align: left;
}

.daccueil .flexslider .slides > li .slideText {
    padding-left: 3rem;
    padding-right: 3rem;
}

.daccueil .flexslider .slides > li .slideText .description strong {
    display: block;
    margin-top: 2rem;
}

.daccueil .flexslider .slides > li .slideText a {
    float: right;
    margin-top: 2rem;
}


}/*/mediaquery*/


/*
==================================================
    Computer    // 1200px+ > 1250 avec scrollbar 
==================================================
*/
@media screen and (min-width: 1200px) {

/**
 * ACTU TF
 */
.actuContent .one:hover .photo:after  {
    background: #000;
    transition:all ease .2s;
}

.actuContent .one .content .desc  {
    overflow:hidden;
    height:0;
    transition: all ease .35s;
    opacity: 0;
}

.actuContent .one:hover .content .desc  {
    display:block;
    height:120px;
    opacity: 1;
}

.actuContent > div:nth-of-type(2n) .one:hover .content .desc  {
    height:80px;
}

.actuContent .one:hover .link:after {
    color:var(--focus-main);
    transform: scale(1.2);
}


}/*/mediaquery*/

/*
==================================================
    Computer    // 1366px
==================================================
*/
@media screen and (min-width: 1366px) {

.daccueil .jumbotron {
    height: 70vh;
}

}/*/mediaquery*/

/*
==================================================
    Computer    // 1400px
==================================================
*/
@media screen and (min-width: 1400px) {

.daccueil .jumbotron {
    height: 60vh;
}

}/*/mediaquery*/
