/*//////////////////////////////////////////////////////////////////
[ FONT ]*/

@font-face {  font-family: Poppins-Regular;   src: url('/fonts/poppins/Poppins-Regular.ttf'); }
@font-face {  font-family: Poppins-Medium;    src: url('/fonts/poppins/Poppins-Medium.ttf'); }
@font-face {  font-family: Poppins-Bold;      src: url('/fonts/poppins/Poppins-Bold.ttf'); }


/*//////////////////////////////////////////////////////////////////
[ RESTYLE TAG ]*/

* {	margin: 0px; 	padding: 0px; 	box-sizing: border-box;}

body, html {	height: 100%;   font-size: 12px;	font-family:Calibri, Poppins-Regular, sans-serif, Arial,Tahoma,Verdana;  margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; /*letter-spacing: 1px ;*/ /*espace entre lettre */  }


  /* body {   text-align:center; font-weight: bold;;  */
   /* overflow-y: hidden;*/
  /* } */


/*---------------------------------------------*/
a {
	font-family: Poppins-Regular;
	font-size: 14px;
	line-height: 1.7;
	color: #666666;
	margin: 0px;
	transition: all 0.4s;
	-webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
}

a:focus {	outline: none !important; }

a:hover {	text-decoration: none;	color: #57b846; }

/*---------------------------------------------*/
h1,h2,h3,h4,h5,h6 {	margin: 0px; }

p {	font-family: Poppins-Regular;	font-size: 14px;line-height: 1.7;	color: #666666;	margin: 0px; }

.menu-items ul, .menu-items li {	margin: 0px;	list-style-type: none; }


/*---------------------------------------------*/
input {	outline: none;	border: none; }

textarea {  outline: none;  border: none; }

textarea:focus, input:focus {  border-color: transparent !important; }

input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder { color:transparent; }
input:focus:-ms-input-placeholder { color:transparent; }

textarea:focus::-webkit-input-placeholder { color:transparent; }
textarea:focus:-moz-placeholder { color:transparent; }
textarea:focus::-moz-placeholder { color:transparent; }
textarea:focus:-ms-input-placeholder { color:transparent; }

input::-webkit-input-placeholder { color: #999999; }
input:-moz-placeholder { color: #999999; }
input::-moz-placeholder { color: #999999; }
input:-ms-input-placeholder { color: #999999; }

textarea::-webkit-input-placeholder { color: #999999; }
textarea:-moz-placeholder { color: #999999; }
textarea::-moz-placeholder { color: #999999; }
textarea:-ms-input-placeholder { color: #999999; }

/*---------------------------------------------*/
button {	outline: none !important;	border: none;	background: transparent; }

button:hover {	cursor: pointer; }

iframe {	border: none !important; }


/*//////////////////////////////////////////////////////////////////
[ Contact 2 ]*/
.bg-contact2 { height: 100%; width: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; }

.container-contact2 {
  width: 100%;  
  /*min-height: 100vh;*/
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  /* padding-top: 100px ; 
  background: rgba(219,21,99,0.8);
  background: -webkit-linear-gradient(45deg, rgba(213,0,125,0.8), rgba(229,57,53,0.8));
  background: -o-linear-gradient(45deg, rgba(213,0,125,0.8), rgba(229,57,53,0.8));
  background: -moz-linear-gradient(45deg, rgba(213,0,125,0.8), rgba(229,57,53,0.8));
  background: linear-gradient(45deg, rgba(213,0,125,0.8), rgba(229,57,53,0.8));*/
}

.wrap-contact2 { width: 450px; background: #fff; border-radius: 10px; overflow: hidden; padding: 10px 30px 20px 30px; border-color: red; border-width: 5px; border-style: solid; }


/*------------------------------------------------------------------
[  ]*/

.contact2-form {  width: 100%; padding: 5px 15px 5px 15px; }

.contact2-form-title {  display: block;  font-family: Poppins-Bold;  font-size: 25px;
  color: #333333;
  line-height: 1;
  text-align: center;
  padding-bottom: 5px;
}



/*------------------------------------------------------------------
[  ]*/

.wrap-input2 {  width: 100%;  position: relative;  border-bottom: 2px solid #adadad;  margin-bottom: 37px; }

.input2 {  display: block;  width: 100%;  font-family: Poppins-Regular;  font-size: 15px;  color: #555555;  line-height: 1.2; }

.focus-input2 { position: absolute; display: block; width: 100%; height: 100%; top: 0; left: 0; pointer-events: none; }

.focus-input2::before { content: ""; display: block; position: absolute; bottom: -2px; left: 0; width: 0; height: 2px;
  -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s;

  background: rgba(219,21,99,1);
  background: -webkit-linear-gradient(45deg, #d5007d, #e53935);
  background: -o-linear-gradient(45deg, #d5007d, #e53935);
  background: -moz-linear-gradient(45deg, #d5007d, #e53935);
  background: linear-gradient(45deg, #d5007d, #e53935);
}

.focus-input2::after { content: attr(data-placeholder); display: block; width: 100%; position: absolute; top: 0px; left: 0;
  font-family: Poppins-Regular;
  font-size: 13px;
  color: #999999;
  line-height: 1.2;
  
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}

/*---------------------------------------------*/
input.input2 {  height: 45px; }

input.input2 + .focus-input2::after { top: 16px; left: 0; }

textarea.input2 { min-height: 115px; padding-top: 13px; padding-bottom: 13px; }

textarea.input2 + .focus-input2::after { top: 16px; left: 0; }

/*.input2:focus + .focus-input2::after { top: -7px; }*/
.input2:focus + .focus-input2::before { width: 100%; }
.has-val.input2 + .focus-input2::after { top: -13px; }
.has-val.input2 + .focus-input2::before { width: 100%; }

/*------------------------------------------------------------------
[ Button ]*/
.container-contact2-form-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 5px;
}

.wrap-contact2-form-btn { display: block; position: relative; z-index: 1; border-radius: 30px; width: auto; overflow: hidden; margin: 0 auto; }

.contact2-form-bgbtn {
  position: absolute;
  z-index: -1;
  width: 300%;
  height: 100%;   
  background: rgba(219,21,99,1);
  background: -webkit-linear-gradient(-135deg, #ff8f8f, #f00, #ff8f8f, #f00);
  background: -o-linear-gradient(-135deg, #ff8f8f, #f00, #ff8f8f, #f00);
  background: -moz-linear-gradient(-135deg, #ff8f8f, #f00, #ff8f8f, #f00);
  background: linear-gradient(-135deg, #ff8f8f, #f00, #ff8f8f, #f00);
  top: 0;
  left: -100%;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}

.contact2-form-btn { 
  display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex;
  justify-content: center; align-items: center; padding: 0 20px; min-width: 244px; height: 50px;

  font-family: Poppins-Medium; font-size: 14px; color: #fff; line-height: 1.2; 
}

.wrap-contact2-form-btn:hover .contact2-form-bgbtn { left: 0; }





/*------------------------------------------------------------------
[ Alert validate ]*/

.validate-input { position: relative; }

.alert-validate::before {
  content: attr(data-validate); position: absolute; max-width: 70%; background-color: white; border: 1px solid #c80000; border-radius: 2px; padding: 4px 25px 4px 10px; top: 50%; 
  -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);
  right: 0px; pointer-events: none;

  font-family: Poppins-Regular; color: #c80000; font-size: 13px; line-height: 1.4; text-align: left; visibility: hidden; opacity: 0;

  -webkit-transition: opacity 0.4s; -o-transition: opacity 0.4s; -moz-transition: opacity 0.4s; transition: opacity 0.4s; }

.alert-validate::after {
  content: "\f12a"; font-family: FontAwesome; display: block; position: absolute; color: #c80000; font-size: 16px; top: 50%;
  -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);
  right: 8px;
}

.alert-validate:hover:before { visibility: visible; opacity: 1; }

    /* DivTable.com */
    .divTable{ 	display: table;  /*	width: 100%;*/   }  
    .divTableBody {   	display: table-row-group;     }
    .divTableRow {  	display: table-row;   }
   
    .divTableCellule {    	border: 0px solid #999999;   	display: table-cell;   font-family:Arial,Tahoma,Verdana,sans-serif;  font-weight: bold; padding:4px 0px 4px 0px  }
    .text_bas { font-family: "glacial_indifferenceregular","Helvetica Neue",Helvetica,Arial,sans-serif; text-transform: uppercase; font-size: 85px; font-weight: 300; color: #aaa; line-height: 1; }
  
    .logo {  /*width:100%;*/ text-align:center; margin:0 auto;  }  


    #deco {
      position: absolute;
      top: 0px;
      right: 3px;
      width: auto;
      z-index: 50;
      color: white;
      font-weight: bold;
      cursor: pointer;
    }

    div.sideBar {
      position: static; 
     /* top: 10px; */
     /* right: 0px; */
      float: right; 
     height: 80%;
     width: 80%;
     margin: 5px 10px 5px 0px;
     padding: 4px;
     background: #FFFCF9;
     border: 2px solid #F00;
     border-radius: 5px;
     box-shadow: 5px 5px 5px #888;
     z-index: 10;
     overflow: hidden;
   }

   .three-columns {  display: grid;  grid-template-columns: 100%; margin-top: 0em; }
   .menu-head{ z-index: 2 !important; }

    @media screen and (min-width: 1000px){
      #deco { position:absolute;	top:10px; left:330px;  width:200px; z-index: 50; color: white; font-weight: bold;  cursor:pointer;}

        div.sideBar {         width: 450px;       }
        .three-columns {  grid-template-columns: 33% 39% 31%;	grid-column-gap: 3%; }  

       
    }


/*------------------------------------------------------------------
[ Responsive ]*/

@media (max-width: 576px) {    .wrap-contact2 { padding: 5px 5px 5px 5px; }     }

@media screen and (max-width: 1150px)   /*pour les portable*/
      {        .non_visible { display:none; }     }

@media (max-width: 992px) { 
  .alert-validate::before { visibility: visible; opacity: 1; }
}

  
@media screen and (max-width: 3000px) and (min-width: 1851px) {
  #div_1 {position:absolute;	top:45px; left:25px;  width:400px; height:200px; font-weight: bold; }
  #div_2 {position:absolute;	top:75px; left:25px;  width:400px ;  } 
  #div_3 {position:absolute;	top:45px; right:25px;  width:400px; height:200px; font-weight: bold; } 
  #div_4 {position:absolute;	top:75px; right:25px; width:400px ;  }  
  form#rdv_syndicalisation { width:465px; } 
}

@media screen and (max-width: 1850px) and (min-width: 1651px) {
  #div_1 {position:absolute;	top:45px; left:25px;  width:300px ; height:200px; }
  #div_2 {position:absolute;	top:75px; left:25px;  width:300px ;  }
  #div_3 {position:absolute;	top:45px; right:25px;  width:300px; height:200px;  } 
  #div_4 {position:absolute;	top:75px; right:25px; width:300px ;  }
  form#rdv_syndicalisation { width:465px; } 
}

@media screen and (max-width: 1650px) and (min-width: 1431px) {
  #div_1 {position:absolute;	top:45px; left:25px;  width:200px; height:200px; }
  #div_2 {position:absolute;	top:75px; left:25px;  width:200px ;  } 
  #div_3 {position:absolute;	top:45px; right:25px;  width:200px ; height:200px; } 
  #div_4 {position:absolute;	top:75px; right:25px; width:200px ;  }  
  form#rdv_syndicalisation { width:465px; } 
}

@media screen and (max-width: 1430px) and (min-width: 1151px) {
  #div_1 {position:absolute;	bottom:250px; left:5px;  width:400px ; font-weight: normal;  }
  #div_2 {position:absolute;	bottom:0px; left:0px;  width:350px  } 
  #div_3 {display:none; } 
  #div_4 {display:none; }
  form#rdv_syndicalisation { width:465px; margin: 0 0 0 500; } 
}

@media screen and (max-width: 1150px)   /*pour les portable*/
{  
  .non_visible { display:none; } 
  form#rdv_syndicalisation { width:100%; } 
}