* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  line-height: inherit;

}

body{
  font-family: 'Source Sans Pro', sans-serif;
  background-color: white;
}

  nav{
  background-color: #ee7555;
  text-transform: uppercase;
  font-family: 'Ubuntu', sans-serif;
  font-weight: lighter;
  color: white;
  font-size: 14px;
  padding: 16px;
}
nav li a{
  text-decoration: none;
  color: white;
}
nav li{
    list-style: none;

}
nav li :hover, nav .active{
  font-weight: 500;


}

nav ul{
  display: flex;
justify-content: space-between;
}

.fildariane{
  padding-top: 16px;
  color: #ee7555;
}
.fildariane a{
  color: #ee7555;
}
.content{
    max-width: 1080px;
  margin: 0 auto;
  padding: 16px;
}

.bandeau{
  font-family: 'Ubuntu', sans-serif;
  background-image: url("/img/bandeau-cpts.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 250px;

}
.bandeau-titre{
  color: white;
  padding: 32px 96px;
  margin-bottom: 32px;
}
.cpts .bandeau-titre{
  background-color: #085da8;


}
.pourquoi .bandeau-titre{
background-color: #ee7555;
}

.cpts37 .bandeau-titre{
    background-color: #fdc333
}
.cpam .bandeau-titre{
    background-color: #86cac1
}
h1{
  padding: 48px 0;
  color: white;
  padding: 32px;
  line-height: 48px;
}
h1 span{
  color: #085da8

}

h2{
    font-family: 'Ubuntu', sans-serif;
    padding: 16px 0 32px 0;

}

/*Menu burger*/
nav
{

    background: #EE7555;
}

nav .main_pages
{
    display: flex;
    justify-content:space-between;
    align-items: center;
}

nav .main_pages a
{

    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-family: Arial, sans-serif;
    color: white;

}


label, #toggle
{
    display: none;
}
.main_pages .active{
 font-weight: 600;
}

 a:hover{
  font-weight: 600;
}

iframe{max-width: 100%;}



.sous{
  position: absolute;
  display: none;
  padding-top: 32px;
}

.sous a{
  padding: 16px 32px;

  background-color:  #EE7555;
  border-top: 1px solid white;
}

.main_pages > .deroulant:hover .sous{
  display: block;
}
.deroulant > a::after{
  content: "  ▼";
  font-size: 16px;
}


.logos .content{
  display: flex;
  justify-content: space-between;
  padding: 32px 16px;
}

.logos img{
  height: 75px
}

.cpam .blocs-cpts h3{

  top: -18px;
font-size: 16px;
color: white;
padding: 8px 19px;
display: inline-flex;
}
body .interlocuteurs strong{
  display: inline;
line-height: 24px;
}
.blocs-cpts strong{
  margin: 12px 0;
  display: block;
}
.blocs-cpts h3{
  background-color: #3ab5a3;
  padding: 8px 16px;
  border-radius: 50px;
  text-transform: uppercase;
  color: white;
  text-align: center;
  position: relative;
top: -117px;
left: 0px;

}
.sites-utiles{
  background-color: #e5f1f8;
  padding: 32px 48px 64px 48px;
  color: #085da8;
  margin: 32px 0;
}
.sites-utiles p{
  padding: 10px 0;
}
.sites-utiles a{
  color: #085da8;
  font-weight: 600;
}
.blocs-cpts{
  display: flex;
  justify-content: space-around;
    flex-wrap: wrap;
    text-align: center;
}
.cpts1, .cpts2, .cpts3, .cpts4, .cpts5, .cpts6{
  background-color: #e5f1f8;
  padding: 16px;
  margin: 8px;
  width: 31%;
  position: relative;

}
.cpts37 .contenu, .cpam .contenu{
  background-color: white;
}

.cpts .contenu, .pourquoi .contenu {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}
.contenu{

  background-color: #e5f1f8;

  margin-top: 48px;
  margin-bottom: 48px;
  padding: 32px 16px;

}
.cpts37 .contenu{
  margin-top: 0;

}
.cpts37 .bandeau-titre{
  margin-bottom: 0;
}
.cpts37 .blocs-cpts h3{
  top: -21px

}
.contenu .blocs-cpts div{
  padding: 0 16px 32px 16px;
  margin-top: 48px;
}
.cpst .contenu div, .adherer .contenu div{
  padding: 96px 16px 32px 16px ;
}
.contenu .obj{
  text-align: center;
  color: #085da8;
  width: 26%;
  padding: 128px 0 48px 0;
}
.contenu .obj0::after{
  content:url("/img/icone0.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 26px;
}
.contenu .obj1::after{
  content:url("/img/icone1.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 26px;
}
.contenu .obj2::after{
  content:url("/img/icone2.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}
.contenu .obj3::after{
  content:url("/img/icone3.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}
.contenu .obj4::after{
  content:url("/img/icone4.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}
.contenu .obj5::after{
  content:url("/img/icone5.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}
.contenu .obj6::after{
  content:url("/img/icone6.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}
.contenu .obj7::after{
  content:url("/img/icone7.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}
.contenu .obj8::after{
  content:url("/img/icone8.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}
.contenu .obj9::after{
  content:url("/img/icone9.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}
.contenu .obj10::after{
  content:url("/img/icone10.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
top: 0;
}

.last {
  padding-top: 14px;
}
ul li:first-child{
  margin-top: 7px;}
.contenu .obj11::after{
  content:url("/img/icone11.svg") ;
   position:absolute;
   left: calc(50% - 42px);
width: 84px;
margin: auto;
padding-top: 12px;
}
.obj0, .obj1, .obj2, .obj3, .obj4, .obj5, .obj6, .obj7, .obj8, .obj9, .obj10, .obj11{
  position: relative;
}
.cpam h3{color: #085da8;
font-size: 31.84px;
padding: 16px 0;
  font-family: 'Ubuntu', sans-serif;
}
.cpam h4{
  color: #ee7555;
  font-size: 24px;
  padding: 48px 0 16px 0;

}
.cpam h5{

  font-size: 20px;
  padding: 16px 0;
}

.sites-utiles h5{
  font-size: 23px;

}
.sites-utiles p{
  font-size: 16px;
}
.cpam .contenu ul{
  padding-left: 32px;
}
footer{
  background-color: #085da8;
  color: white;
  text-align: right;
  min-height: 50px

}

footer a{
  color: white;
  padding: 8px;

}
.interlocuteurs h3{
  text-transform: none;

}


@media (max-width: 991px)
{
    nav
    {
        height: 100%;
        width: 100%;
        background: #EE7555;
    }

    nav .main_pages
    {
        display: none;
        flex-direction: column;
        background: #EE7555;
        /*height: 220px;*/
    }

    nav .main_pages a {
        width: 50%;
        padding: 32px 0;
  font-size: 32px;
    }
    .bandeau{
      height: auto;
    }



    label
    {
        width: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 auto 32px auto;
        font-size: 85px;
        color: white;
        cursor: pointer;
    }

    #toggle:checked + .main_pages {
        display: flex;
    }

    body .bandeau{
      background-image: none;
      background-color: #86cac1;
    }
    nav .main_pages a{
      width: 100%;
    }
    h1{
      line-height: 80px;
    font-size: 44px;
    }

}


@media (max-device-width: 780px){
  body .contenu .obj{
    width: 56%;
  }
body{
  font-size: 43px;
}

    body .bandeau-titre{
      padding: 32px 32px;

  }

  .fildariane{display: none}
  .cpts1, .cpts2, .cpts3, .cpts4, .cpts5, .cpts6{
    width: 100%;

  }
.bandeau-titre h2{font-size: 45px;}

.cpam .blocs-cpts h3{
  font-size: 32px;
}

}

@media (max-device-width: 500px){

    body .contenu .obj{
    width: 100%;
  }


}