html{position:relative;min-height:100%;}
.container{
 /* background: url(Header.png) no-repeat scroll 17px 0px, center transparent;*/
  max-width:1024px;}
.logo a{display:block;margin-left:49px;margin-top:2px;}
.logo{float:left;height:100px;}
.header .right{float:right;height:100px;}
.header .right ul.menu li.last{border-right:0;}
.container .main{
  clear:both;
  padding-top:3em;
  padding-bottom:3em;
}

.containerEtat{
  
  max-width:1024px;}

.containerEtat .menu{clear:both;}

.containerEtat .main{
  clear:both;
  padding-top:3em;
  padding-bottom:3em;
}
body{background:linear-gradient(to bottom, rgba(0,0,0,0.137) 0%,rgba(0,0,0,0) 100%) no-repeat;
  background-position:0px 1px;
  background-size: 100% 78px;
  margin-bottom:60px;
}
.header .right{margin-top:9px;margin-right:29px;}
.header .right .social a{margin-left:6px;}
.header .search-form{margin-top:22px;}
.header .search-form input{background-color:rgba(255,255,255,0.5);}
footer{background-color:rgba(0,0,0,0.8);color:white;
  position:absolute;
  bottom:0px;
  height:50px;
  width:100%;
}
footer .container{background: none;max-width:948px;margin-top:15px;}
footer .containerEtat{background: none;max-width:948px;margin-top:15px;}
footer p{font-family:Arial;font-size:11px}
footer a{color:white;}
footer a.home_footer{margin-left:-25px;}
footer a span.glyphicon{font-size:17px;top:3px;}
footer ul.social{float:right;list-style:none;padding-left:5px;margin-bottom:0px}
footer ul.social li{display:inline-block;}
/*
body{background: url("../img/bg-body.jpg") repeat-x scroll 0px 0px transparent;}
.header .right ul.menu{float:left;list-style:none;}
.header .right ul.menu li{border-right:1px solid;padding-right:3px;color: grey;display:inline-block;}
.header .right ul.menu li a{
 color: #828282;
 font-family: Arial;
 font-size: 8px;
 text-transform: uppercase;
}
*/
p.field-error{color:red;font-size:smaller;font-style:italic}
.shadow{
box-shadow:0 0 5px gray;
-moz-box-shadow:0 0 5px gray;
-webkit-box-shadow:0 0 5px gray;
}
.arabic{float:right;margin-left:auto;text-align:right}


.logoxy
    {
      height:200px !important;width:300px !important;margin-top:-35px !important;
    }
    .logox
    {
     height:200px !important;margin-top:-20px !important;
    }

/* Media Queries */


/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) 
  {
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px!important;
      width: 100px!important;
    }
       
  }

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) 
  {
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

  }

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
    .logoxy
    {
      height: 100px;
      width: 100px;
      margin-top: -20px;
    }
    .logox
    {
      height: 100px;
      width: 100px;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 

    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }
    

}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 

    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* Portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 

    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* ----------- iPhone X ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
    .logoxy
    {
      height: 100px !important;
      width: 100px !important;
      margin-top: -20px !important;
    }
    .logox
    {
      height: 100px !important;
      width: 100px !important;
    }

}