body
{
  padding: 0;
  margin: 0;
  font-family: arial;
  background: #333333 url(elitcreat_formation.jpg) no-repeat;
  color: #fff;
  border:0;
}
#banner
{
  width: 100%;
  height: 100px;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0,0,0,0.5);
  display: table;
}

#baner-in
{
  width:90%;
  height: 100px;
  margin: 0 auto;
  background: url(elitecrea-logo.svg) no-repeat;
  background-size: 24%;
  display: table;
}

#baner-in a
{
  width: 25%;
  height: 100px;
  float: left;
  display: block;
}

#solflogo
{
  width: 14%;
  height: 100px;
  float: left;
  background: #333 url(logo_solf2.svg) no-repeat;
  background-size: 100%;
}

#solflogo a
{
  width: 100%;
  height: 100px;
  display: block;
}
#vous
{
  width: 25%;
  height: 100px;
  float: left;
  color: #000;
  margin: 0 0 0 10%;
  text-align: right;
}

#vous p:nth-child(1)
{
  font-size: 39px;
font-weight: bold;
margin: 14px 0 0 0;
}
#vous p:nth-child(2)
{
margin: 2px 0 0 0;
}
#date
{
float: left;
font-size: 52px;
color: #00a99d;
font-weight: bold;
padding: 15px 0 0 2%;
}

#blok-form
{
  width: 87%;
  height: 500px;
  margin: 40px auto 130px auto;
  display: table;

}
#blok-form-1
{
  width: 53%;
  height: 500px;
  float: left;
  padding: 0 2% 0 0;

}
#blok-form-2
{
  width: 45%;
  height: 500px;
  background: #fff url(elitcreat_formation2.jpg) no-repeat;
  background-size: cover;
  float: left;
  position: relative;

}

#blok-form-1 .accroche
{
 font-size: 50px;
font-weight: bold;
margin: 0;
}
#blok-form-1 .geni
{
 font-size: 20px;
font-weight: bold;
margin: 0;
color: #29abe2;
}

#forma
{
  position: absolute;
bottom: -5px;
width: 100%;
height: 228px;

}
#place
{
  width: 20%;
  height: 167px;
  float: left;
  background: #00a99d;
  padding: 5%;
  text-align:center;
}
#dates
{
  width: 60%;
  height: 167px;
  float: left;
  background: #ed1e79;
  padding: 5%
}
#dates p:nth-child(1)
{
font-size: 31px;
margin: 0 0 5px 0;
font-weight: bold;
}
#dates p:nth-child(2)
{

margin: 0 0 5px 0;
}
#dates p:nth-child(3)
{
font-size: 40px;
font-weight: bold;
margin: 0 ;
}
#dates p:nth-child(4)
{

margin: 5px 0 0 0;
}

#place p:nth-child(1)
{
font-size: 114px;
font-weight: bold;
margin: 0 ;
text-shadow: 0 0 3px #000;
}
#place p:nth-child(2)
{
margin: 0 ;
}

#modules
{
  width: 87%;
  height: 400px;
  margin: 0 auto;
  display: table;
}

#modules-1
{
  width: 100%;
  height: 400px;
  margin: 0 auto;
  display: table;
}
#modules-2
{
 width: 30%;
height: 226px;
margin: 24px auto 0 auto;
background: url(elitcreat_logiciel.png) no-repeat;
    background-size: auto;
background-size: 81%;
float: left;
}
#modules-1 p:nth-child(1)
{
 font-size: 50px;
 margin-top: 0;
}
.list
{
  font-size: 20px;
}

.list2
{
  font-size: 30px;
  float: left;
  width: 68%;
display: block;
padding: 0;
margin: 0;
}

.list2 li
{
  font-size: 30px;
float: left;
width: 27%;
display: table;
background: #666;
margin: 0 2% 44px 0;
padding: 2%;
height: 205px;
border-radius: 3px;
position: relative;
}

.list2 li span:nth-child(1)
{
position: absolute;
top: -23px;
display: block;
background: #111;
padding: 13px;
border-radius: 5px;
font-size: 15px;
left: 73px;
}

.list2 li span:nth-child(2)
{
  font-size: 30px;
  display: block;
  clear: left;
  text-align: center;
  margin: 20px 0 0 0;
}
.list2 li span:nth-child(3)
{
  font-size: 14px;
line-height: 18px;
display: block;
margin: 20px 0 0 0;
text-align: center;
color: #cccccc;
}


.list3
{
  font-size: 20px;
  float: left;

}
.plus
{
 font-size: 91px;
float: left;
text-align: center;
width: 30%;
}

#motiv
{
  width: 87%;
  height: 50px;
  margin: 0 auto;
  font-size: 22px;
  display: table;
}

#conditions
{
  width: 87%;
  height: 400px;
  display: table;
  margin: 50px auto 0 auto;
  background: #555;
}

#admi{
  width: 29%;
  height: 400px;
  float: left;
  padding: 2%;
  display: table;
}
#admi2{
  width: 30%;
  height: 400px;
  float: left;
  padding: 2%;
  background: #176d84;
  display: table;
}
#admi span, #admi2 span{
display: block;
margin: 0 0 10px 0;
font-size: 30px;
}

#admi p, #admi2 p {
margin: 5px 0;
font-size: 14px;
}
.noirr
{
  color: #000;
}

#choix
{
  width: 87%;
 height: 518px;
margin: 0 auto;
background: #fff url(elitecrea-forma.jpg) no-repeat;
    background-size: auto;
background-size: 100%;
}

#footer
{
  width: 87%;
  height: 150px;
  margin: 50px auto 0 auto;
}

#logbas {
    width: 10%;
    height: 114px;
    background: url(elitecrea_min.svg) no-repeat;
        background-size: auto;
    background-size: 99%;
    float: left;
}

#becrea {
    width: 88%;
    height: 30px;
    color: #fff;
    font-size: 11px;
    text-align: left;
    padding: 83px 0 0 12%;
    bottom: 0;
}

#adres {
    width: 22%;
height: 114px;
float: left;
font-size: 11px;
line-height: 12px;
padding: 4px 0 0 1%;
color: #9b9b9b;
}

.social a

{

display: block;

height: 30px;

width: 30px;

font-size: 18px;

color: #fff;

text-align: center;

line-height: 32px;

float: left;

margin-right: 10px;

}

.social
{
  display: block;
float: left;
width: 20%;
padding: 13px 0 0 2%;
}
.social p
{
clear: left;
margin: 49px 0 0 0;
color: #9b9b9b;
font-size: 11px;
}

.social h3
{
margin: 0 0 5px 0;
}

.social a:hover

{

color: #8BB73E;

font-size: 19px;

}

/*-----------------------------------------------------------*/

 @media screen and (max-width: 769px)
 {


#baner-in {
    width: 100%;
    height: 66px;
    background-size: 70%;
}
#banner {
    height: 66px;
}
#baner-in a {
    width: 72%;
    height: 66px;
}

#solflogo {
    width: 28%;
    height: 66px;
    background: #333 url(logo_solf2.svg) no-repeat 3px;
  }
#vous {
    width: 62%;
    height: 83px;
    margin: 0 0 0 4%;
}
#vous p:nth-child(1) {
    font-size: 27px;
}
#vous p:nth-child(2) {
    font-size: 13px;
}
#date {
     font-size: 16px;
    padding: 30px 0 0 7%;
}
#blok-form {
    width: 87%;
    margin: 21px auto 32px auto;
}
#blok-form-1 .accroche {
    font-size: 40px;
}
#blok-form-1 > p:nth-child(2) {
text-align: justify;
}
body
{
  background-size: 409%;
}

#blok-form-1 {
    display: table;
    width: 100%;
    padding: 0;
}
#blok-form-2 {
    width: 100%;
}
#dates p:nth-child(1) {
    font-size: 19px;
}
#dates p:nth-child(3) {
    font-size: 33px;
}
#modules-1 p:nth-child(1) {
    font-size: 24px;
    margin-bottom: 43px;
}
.list2 {

    width: 100%;
    display: table;
}

.list2 li {
    width: 95%;
}
.list2 li span:nth-child(1) {
    left: 85px;
}

.plus {
    width: 100%;
}
#modules-2 {
    width: 100%;

}

#motiv {
    width: 87%;
    font-size: 15px;
    text-align: justify;
}

#admi, #admi2 {
    width: 90%;
    padding: 5%;
    display: table;
}

#choix {
    height: 124px;
}
#footer {
    width: 87%;
    height: 91px;
    margin: 31px auto 0 auto;
}
#logbas {
    width: 30%;
    height: 91px;
}
#becrea {
    padding: 58px 0 0 12%;
    font-size: 7px;
}

#adres {
    width: 69%;
    height: 114px;

}
.social {

    width: 98%;
    padding: 13px 0 9% 2%;
}




}

/*-----------------------------------------------------------*/


@media (min-width:375px) and (max-width:769px)

 {
.list2 li span:nth-child(1) {
    left: 95px;
}
}


/*-----------------------------------------------------------*/


@media (min-width:412px) and (max-width:769px)

 {
.list2 li span:nth-child(1) {
    left: 100px;
}
}




/*-----------------------------------------------------------*/


@media (min-width:414px) and (max-width:769px)

 {
.list2 li span:nth-child(1) {
    left: 113px;
}
}


/*-----------------------------------------------------------*/


@media (min-width:640px) and (max-width:769px)

 {

#baner-in a {
    width: 72%;
    height: 127px;
}
#solflogo {
    width: 28%;
    height: 112px;
}
#vous {
    width: 47%;
}
#date {
    font-size: 37px;
    padding: 17px 0 0 3%;
}
#dates p:nth-child(1) {
    font-size: 34px;
}

.list2 li span:nth-child(1) {
    left: 210px;
}
#motiv {
    margin: 48px auto 0 auto;
}

#modules-2 {
    height: 325px;
}




}



/*-----------------------------------------------------------*/


@media (min-width:740px) and (max-width:769px)

 {

#baner-in a {
    width: 72%;
    height: 150px;
}
#solflogo {
    width: 28%;
    height: 128px;
}
#vous {
    width: 47%;
}
#date {
    font-size: 37px;
    padding: 17px 0 0 3%;
}
#dates p:nth-child(1) {
    font-size: 34px;
}

.list2 li span:nth-child(1) {
    left: 254px;
}
#motiv {
    margin: 48px auto 0 auto;
}

#modules-2 {
    height: 366px;
}
#logbas {
    width: 30%;
    height: 140px;
}
#becrea {
    padding: 107px 0 0 12%;
    font-size: 11px;
}



}


/*-----------------------------------------------------------*/


@media (min-width:800px) and (max-width:1023px)

 {

#banner {
    width: 100%;
    height: 94px;
}
#baner-in {
    width: 90%;
    height: 94px;
    background-size: 34%;
}
#baner-in a {
    width: 35%;
    height: 94px;
}
#solflogo {
    width: 14%;
    height: 94px;
    background: #333 url(logo_solf2.svg) no-repeat 2px 12px;

}
#vous p:nth-child(1) {
    font-size: 23px;
}
#vous {
    width: 27%;
    height: 94px;
    margin: 0 0 0 3%;

}
#date {
    font-size: 24px;
    padding: 15px 0 0 2%;
}
#blok-form-1 .accroche {
    font-size: 29px;
}
#dates p:nth-child(1) {
    font-size: 20px;
}
#dates p:nth-child(3) {
    font-size: 32px;
}
#modules-1 p:nth-child(1) {
    font-size: 29px;
    margin-bottom: 53px;
}
.list2 {
    width: 100%;
}
.list2 li {
    height: 240px;
}

.list2 li span:nth-child(1) {
    left: 46px;
}
.plus {
    width: 8%;
}
.list3 {
    font-size: 16px;
}
#modules-2 {
    width: 39%;
    height: 147px;
    background: url(elitcreat_logiciel.png) no-repeat 42px 0px;
    background-size: 61%;
    margin: 12px auto 0 auto;
}
#motiv {
    width: 87%;
    height: 50px;
    font-size: 18px;
}
#admi, #admi2 {
    width: 96%;

}

#choix {
    height: 280px;
}

#logbas {
    width: 20%;
}
#adres {
    width: 46%;
}
.social {
    width: 31%;

}




}


/*-----------------------------------------------------------*/


@media (min-width:1024px) and (max-width:1280px)

 {

  #baner-in {
    width: 90%;
    background: url(elitecrea-logo.svg) no-repeat;
    background-size: 37%;
 }
#baner-in a {
    width: 38%;
}

#solflogo {
    width: 14%;
    background: #333 url(logo_solf2.svg) no-repeat 2px 15px;
    background-size: 100%;
}
#solflogo a {
    width: 100%;
}
#vous {
    width: 29%;
    margin: 0 0 0 2%;
}
#vous p:nth-child(1) {
    font-size: 25px;
    margin: 14px 0 0 0;
}
#date {
    font-size: 24px;
    padding: 19px 0 0 2%;
}
#blok-form-1 .accroche {
    font-size: 37px;
}
#dates p:nth-child(1) {
    font-size: 25px;
}
#modules-1 p:nth-child(1) {
    font-size: 32px;
    margin-bottom: 50px;
}
.list2 {

    width: 78%;
}
.list2 li {

    height: 240px;
}
.list2 li span:nth-child(1) {
    left: 44px;
}
.list2 li span:nth-child(2) {
    font-size: 22px;
}
.plus {
     width: 22%;
}
.list3 {
    font-size: 15px;
    width: 17%;
}
#modules-2 {
    width: 22%;
}

#admi, #admi2 {

    display: table;
}
#choix {

    height: 353px;
}
#logbas {
    width: 16%;
    background-size: 100%;

}
#adres {
    width: 37%;

}
.social {

    width: 24%;
}




}


/*-----------------------------------------------------------*/


@media (min-width:1366px) and (max-width:1439px)

 {
#vous p:nth-child(1) {
    font-size: 37px;
}
.list3 {
    font-size: 19px;
}
.list2 li span:nth-child(1) {
    left: 62px;
}

#choix {

    height: 472px;
}
#adres {
    width: 44%;
}

}