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

ul{
  margin: 0;
  padding: 0;
  width: auto;
  display: inline-block;
}

header{padding-bottom: 3em;
    padding-top: 2em;}

div.container{display: flex;}

div.body{width: 95%; margin-left: 10px;}

footer {width: 100%; padding: 0;margin: 0;margin-top: 1em;}

footer div.copy{display: inline-block; margin-top: 15px;}

div.presentation {text-align: justify;width: 50%;margin: 1em;}
div.item.push-right{margin-left: auto; margin-top: 0.5em;margin-bottom: 1em;}

footer div.push-right{display: inline-block;
    position: absolute;
    right: 10px;}

div.container div.push-right a.boutton {margin-bottom: 2em;}


div.container div.push-right div.perso{margin: auto;vertical-align: middle;margin-left: 1em;}

div.container div.push-right div#allblocnotif{margin-bottom: 1em;}

div.perso{margin: auto;margin-top: 100px;}



body div.body table tbody tr td div.titre-box {width: 100%;}

body div.body table tbody tr td div.body-box {width: 100%;}

body div.body table.vrais-dofus tbody tr td{width: 30%;}


div.presentation div.block-bouttons div.lien-page {width: 200px;padding: 10px;}


h2.titre{margin: 20px;padding: 10px;margin-top: 60px; }

.delimitation , .delim{text-align:center;width: 100%;}

.delimitation li.types , .delim li.types{text-align:center;width: 200px;  display: inline-block;}

ul li.types.titregene{
  display: block;
  margin: auto;
}

li.types {
margin-right: 1em;
}


.body, .body::after, .body::before {
    box-sizing: border-box;
}

.delimitation li strong.generation , .delim li strong.generation {padding-bottom: 60px;padding-top: 40px;}

#block-attitude2{display: block;border: none;}

#block-attitude1 , #block-attitude2 {width: 98%;   margin: 0;padding: 0;}

#block-attitude1 tr td , #block-attitude2 tr td {width: 29%;}

#ssblock-objet {width: 29%;  }

#tableau {  widows: 80% ;margin:auto; margin-top: 60px;}

div.stuff{width: 80%; }

div.stuff div.quet {margin-top: 10px;margin-bottom: 20px;}

table.carac{width: 100%;}

div.alert div.msgattention { }

div.alert{left: 10%; width: 80%;}

a.next , a.prev , a.pre , a.nex {}

body ul.center{width: 100%; margin-top: 10%;}





.box-form {width: 70%; margin: auto;margin-top: 250px;margin-right: -50px;padding-bottom: 30px;}

div#retour a{ left : 50px;}


table.reliquat tr td#totalrune , table.reliquat tr td#totalreliquat {}


#avertissement {
				display: none;
			}


.social {
  position: relative;
  background-color: rgba(0,0,0,0.4);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%; 
  overflow: hidden;
  margin: auto;
  margin-top: 10px;
} 

.social img {z-index: 2; }

.fond_twi{
  top: 0px;
  z-index: 1;
  display: block;
  background-color: #55ACEE;
  position: absolute;
  transition: 0.5s;
}

.fond_tip{
  top: 0px;
  z-index: 1;
  display: block;
  background-color: #d64758;
  position: absolute;
  transition: 0.5s;
}

.fond_disc {
    top: 0px;
    z-index: 1;
    display: block;
    background-color: #7790E1;
    position: absolute;
    transition: 0.5s;
}


.box-filariane{display: none;}

.outilsgroupe , .outilsgroupecoffre{width: 300px;}

.outilsgroupecoffre div.addperso {width: 250px;text-align: center;margin-top: 50px;}


div.boxmembre{margin: auto;height: 500px;}


div#addunmembre a.fermer {    margin-right: -170px;    margin-top: 50px;}


div#addunmembre .blocint{height: 30em;}

.lienpage:hover {
    z-index: 1;
}

div#addmonperso div.blocint{width: 70%;text-align: center;}

p#imageaddpersogroupe{margin-bottom: 0;}

#box-addcoffre div.blocint {width: 70%;}

#parametregroupe{top: 130px;    margin-left: 10px;}


div#paramgroupe div.blocint{height: 20em;width: 70%;text-align: center;}

div#paramgroupe div.blocint a.fermer{margin-top: 50px;}

.box-indicearchi {
    width: 180px;
        margin-left: 300px;
  }

  .box-indicearchi span {
    margin-left: -64px;
    margin-top: -29px;
  }


.actionall , .recherchemob {
  margin-top: 20px;
}

button.body{margin-left:  2em;}
button.body.dern{margin-bottom:  2em;}

#eca2 , #zobal2  {margin-bottom: 0;}
#zobal{margin-top: -4em;}
#sacri3 , #hupper3{margin-left: 5px;margin-bottom: 0;}
#sacri4{margin-bottom: 0;}

#hupper2{margin-bottom: -7em;}

#sram2{margin-bottom: 0;margin-left: 5px;}

table {
    border-spacing: 1em 0em;
}

ul li ul {vertical-align: top;}

.body{text-align: left;}

}

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

/*.bull{margin-left: 150px;}
*/
.notification-box{margin-left: auto;}



  #parametregroupe{top: 150px;    margin-left: 10px;}

div.container{display: block;}
div.presentation {width: 88%;margin: auto;display: block;}
div.item.push-right{width: 100%;margin: auto;text-align: center; margin-bottom: 10px;margin-top: 20px;display: block;}


.membregroupe {width: 99%;display: block;}
.outilsgroupecoffre table a.lienpage {margin-left: 60px;}
#elio, #cra, #eca, #eni, #enu, #feca, #hupper, #iop, #iop3, #osa, #ougi, #panda, #panda3, #sram3, #sacri, #sacri3, #sacri4, #roub, #sadi, #sadi3, #sram, #steam, #xel, #zobal, #zobal3, #elio2, #cra2, #eca2, #eni2, #enu2, #feca2, #hupper2, #iop2, #osa2, #ougi2, #panda2, #sacri2, #roub2, #sadi2, #sram2, #steam2, #xel2, #zobal2 , #enu3 , #hupper3{display: none;}

button.body{
  width: 90%;
}

.tab-principale{
  width: 100%;
}

table {
    border-spacing: 0em 0em;
}


}



@media only screen and (max-width: 2023){
  .navigation {width: 98%;}
  body , div.container , table.tabmetier {width: 100%; padding: 0;margin: 0;}
}




@media only screen and (max-width: 550px){
  #parametregroupe{top: 125px;    margin-left: 10px;}
}

@media only screen and (max-width: 500px){
.box-indicearchi{display: none;}
}




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

footer div.copy{display: block; text-align: center;}

footer div.push-right{display: block;
    position: initial;
}

.actionall{width: 80%; margin: auto; margin-top: 20px;}

.actionall div.checkall input {margin: 5px;}

}