body{
background:#000;
color:#ddd;
margin:0;
font-family:"Helvetica Neue",Helvetica;
}

.topbar{
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
border-bottom:1px solid #000;
padding:10px;
height:45px;
background:url(/img/phone/toolbar.png) #000 repeat-x;
position:relative;
}
.topbar h1{
position:absolute;
overflow:hidden;
left:50%;
top:10px;
line-height:1em;
margin:1px 0 0 -100px;
height:40px;
width:200px;
font-size:20px;
font-family:Helvetica;
font-weight:bold;
text-shadow:rgba(0,0,0,1) 0 -1px 1px;
text-align:center;
text-overflow:ellipsis;
white-space:nowrap;
color:#fff;
}
.btn{
margin:0;
border-width:0 5px;
padding:0 3px;
width:auto;
height:30px;
line-height:30px;
font-family:inherit;
font-size:12px;
font-weight:bold;
color:#fff;
text-shadow:rgba(0,0,0,0.5) 0 -1px 0;
text-overflow:ellipsis;
text-decoration:none;
white-space:nowrap;
background:none;
border-image:url(/img/phone/button.png) 0 5 0 5;
-moz-border-image:url(/img/phone/button.png) 0 5 0 5;
-webkit-border-image:url(/img/phone/button.png) 0 5 0 5;
cursor:pointer;
}
.leftbtn{float:left;}
.rightbtn{float:right;}

.back{
left:6px;
right:auto;
padding:0;
max-width:55px;
border-width:0 8px 0 14px;
border-image:url(/img/phone/back_button.png) 0 8 0 14;
-moz-border-image:url(/img/phone/back_button.png) 0 8 0 14;
-webkit-border-image:url(/img/phone/back_button.png) 0 8 0 14;
}

div.content{
padding:1px 0;
background: -moz-linear-gradient(top, #333333, #5e5e65);
background:-webkit-gradient(linear,0% 0,0% 100%,from(#333),to(#5e5e65));
}

/* liste des raids */
#raidlist .topbar .btn{padding:0 10px;}
#raidlist .topbar h1{cursor:pointer;}
#raidlist ul{
color:#aaa;
border:1px solid #333;
font:bold 18px Helvetica;
padding:0;
margin:15px 10px 17px 10px;
}
#raidlist ul.rounded{
border-radius:8px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
box-shadow:rgba(0,0,0,.3) 1px 1px 3px;
-moz-box-shadow:rgba(0,0,0,.3) 1px 1px 3px;
-webkit-box-shadow:rgba(0,0,0,.3) 1px 1px 3px;
}
#raidlist ul.rounded li:first-child,ul.rounded li:first-child a{
border-top:0;
border-top-left-radius:8px;
border-top-right-radius:8px;
-moz-border-radius-topleft:8px;
-moz-border-radius-topright:8px;
-webkit-border-top-left-radius:8px;
-webkit-border-top-right-radius:8px;
}
#raidlist ul.rounded li:last-child,ul.rounded li:last-child a{
border-bottom-left-radius:8px;
border-bottom-right-radius:8px;
-moz-border-radius-bottomleft:8px;
-moz-border-radius-bottomright:8px;
-webkit-border-bottom-left-radius:8px;
-webkit-border-bottom-right-radius:8px;
}
#raidlist ul.rounded li{
color:#666;
border-top:1px solid #333;
border-bottom:#555858;
list-style-type:none;
padding:10px 10px 10px 10px;
background: -moz-linear-gradient(top, #4c4d4e, #404142);
background:-webkit-gradient(linear,0% 0,0% 100%,from(#4c4d4e),to(#404142));
overflow:hidden;
}
#raidlist ul li.arrow{
background-image:url(/img/phone/chevron.png);
background-image:url(/img/phone/chevron.png), -moz-linear-gradient(top, #4c4d4e, #404142);
background-image:url(/img/phone/chevron.png), -webkit-gradient(linear,0% 0,0% 100%,from(#4c4d4e),to(#404142));
background-position:right center;
background-repeat:no-repeat;
cursor:pointer;
}
#raidlist ul li.arrow.portC{
background-color:#404162;
background-image:url(/img/phone/chevron.png), -moz-linear-gradient(top, #4c4d6e, #404162);
background-image:url(/img/phone/chevron.png), -webkit-gradient(linear,0% 0,0% 100%,from(#4c4d6e),to(#404162));
}
#raidlist ul li.arrow.portA{
background-color:#606142;
background-image:url(/img/phone/chevron.png), -moz-linear-gradient(top, #6c6d4e, #606142);
background-image:url(/img/phone/chevron.png), -webkit-gradient(linear,0% 0,0% 100%,from(#6c6d4e),to(#606142));
}
#raidlist ul li.arrow.portS{
background-color:#604142;
background-image:url(/img/phone/chevron.png), -moz-linear-gradient(top, #6c4d4e, #604142);
background-image:url(/img/phone/chevron.png), -webkit-gradient(linear,0% 0,0% 100%,from(#6c4d4e),to(#604142));
}

#raidlist ul li .l1{
color:#fff;
text-decoration:none;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
display:block;
padding:2px 0;
text-shadow:rgba(0,0,0,.2) 0 1px 1px;
}
#raidlist ul li small{
color:#64c114;
font:17px Helvetica;
text-align:right;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
display:block;
width:23%;
float:right;
padding:0;
}
#raidlist ul li small.counter{
font-size:17px;
line-height:13px;
font-weight:bold;
background:rgba(0,0,0,.15);
color:#fff;
border-radius:11px;
-moz-border-radius:11px;
-webkit-border-radius:11px;
padding:4px 10px 5px 10px;
display:block;
width:auto;
box-shadow:rgba(255,255,255,.1) 0 1px 0;
-moz-box-shadow:rgba(255,255,255,.1) 0 1px 0;
-webkit-box-shadow:rgba(255,255,255,.1) 0 1px 0;
}
#raidlist ul li.arrow small.counter{
margin-right:15px;
}
#raidlist ul li.arrow div.social{
padding-left:10px;
background-repeat:no-repeat;
background-position:left center;
}
#raidlist ul li.arrow div.so0{
background-image:url(/img/rp/raid0.png);
}
#raidlist ul li.arrow div.so1{
background-image:url(/img/rp/raid1.png);
}
#raidlist ul li.arrow div.so2{
background-image:url(/img/rp/raid2.png);
}
#raidlist ul li.arrow div.so3{
background-image:url(/img/rp/raid3.png);
}
#raidlist ul li.arrow div.so4{
background-image:url(/img/rp/raid4.png);
}
#raidlist ul li.arrow div.soP{
background-image:url(/img/rp/rp_pote.png);
}
#raidlist ul.rounded li .l2{
color:#999;
}
#raidlist ul.rounded li.portA .l2{
color:#333;
}

/* détail des raids */
#raiddetail fieldset legend{
text-align:center;
font-style:italic;
padding:0 5px;
}
#raiddetail fieldset{
padding:5px 0;
border:1px solid;
}
#raiddetail fieldset .ppl{
margin:0 2px;
float:left;
}
#raiddetail fieldset .ppl img{
vertical-align:text-top;
}
ul li small.counter .confirm,#raiddetail .rst0{
color:green
}
ul li small.counter .dispo, #raiddetail .rst1{
color:yellow;
}
ul li small.counter .may, #raiddetail .rst2{
color:orange;
}
#raiddetail .rst3{
color:red;
}
#raiddetail .rinfo,#raiddetail .rtxt2{
font-style:italic;
}
#raiddetail .rtxt1 span{
color:#808080;
float:right;
}
#raiddetail .rtxt2{
padding-bottom:1px;
border-bottom:1px solid #404040;
margin-bottom:1px;
}
#raiddetail .rtit,#raidins .rtit{
background: -moz-linear-gradient(top, #666666, #111111);  
background:-webkit-gradient(linear,0% 0,0% 100%,from(#666),to(#111));
border-bottom:1px solid #111113;
border-top:1px solid #666;
color:#3e9ac3;
font-size:16px;
margin:1px 0 0 0;
padding:2px 10px;
text-shadow:#000 0 1px 0;
}
#raiddetail .rbloc{
background: -moz-linear-gradient(top, #1e1f21, #272729);
background:-webkit-gradient(linear,0% 0,0% 100%,from(#1e1f21),to(#272729));
border-bottom:2px solid #000;
border-top:1px solid #4a4b4d;
font-size:16px;
margin-bottom:-1px;
}

/* page option */
#raidoption {
position:absolute;
top:0;
left:0;
background:black;
width:100%;
min-height:100%;
}
#raidoption .content .cal{
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
background:#000 url(/img/phone/calbg.png) repeat;
border:1px solid #555555;
padding:5px 5px 0;
margin:5px 10px;
clear:both;
}
#raidoption .content .cal .head{
border:1px solid #333333;
background:#888;
background: -moz-linear-gradient(top, #999999, #333333);
background:-webkit-gradient(linear,0% 0,0% 100%,from(#999),to(#333));
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
text-align:center;
line-height:24px;
}
#raidoption .content .cal .head img:first-child{
float:left;
padding:4px 10px 4px 5px;
}
#raidoption .content .cal .head img:last-child{
float:right;
padding:4px 5px 4px 10px;
}
#raidoption .content .cal table{
border-collapse:collapse;
font-size:0.9em;
width:100%;
color:#FFFFFF;
}
#raidoption .content .cal table thead td{
border:0 none;
font-weight:bold;
padding:7px 0;
text-align:center;
width:14.28%;
}
#raidoption .content .cal table tbody td{
border:0 none;
padding:1px;
line-height:26px;
}
#raidoption .content .cal table tbody td span{
background:#333;
background: -moz-linear-gradient(top, #444444, #222222);
background: -webkit-gradient(linear,0% 0,0% 100%,from(#444),to(#222));
border:1px solid #444;
color:#EEE;
display:block;
cursor:pointer;
}
#raidoption .content .cal table tbody td span.v1{
background:#336;
background: -moz-linear-gradient(top, #444477, #222255);
background: -webkit-gradient(linear,0% 0,0% 100%,from(#447),to(#225));
}
#raidoption .content .cal table tbody td span.v2{
background:#553;
background: -moz-linear-gradient(top, #666644, #444422);
background: -webkit-gradient(linear,0% 0,0% 100%,from(#664),to(#442));
}
#raidoption .content .cal table tbody td span.v3{
background:#733;
background: -moz-linear-gradient(top, #884444, #662222);
background: -webkit-gradient(linear,0% 0,0% 100%,from(#844),to(#622));
}
#raidoption .content .cal table tbody td span#today{
background:#AAA;
background: -moz-linear-gradient(top, #CCCCCC, #FFFFFF);
background: -webkit-gradient(linear,0% 0,0% 100%,from(#CCC),to(#FFF));
border:1px solid #CCCCCC;
color:#2E7DB2;
}
#raidoption .content .cal table tbody td.disabled{
background:none;
}
#raidoption .content .optfact,#raidoption .content .optserv{clear:both;}
#raidoption .content .optfact div,#raidoption .content .optserv div{
border-width:0 12px;
padding:10px;
text-align:center;
text-decoration:inherit;
color:inherit;
float:left;
margin:0 10px;
}
#raidoption .content .optfact,#raidoption .content .optserv{padding:0 12px;}

#raidoption .content .optfact div.sel,#raidoption .content .optserv div.sel{
border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
-moz-border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
-webkit-border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
margin:0 -2px;
text-shadow:rgba(255,255,255,0.7) 0 1px 0;
font-weight:bold;
}
#raidoption .bottombar .valid{
float:left;
margin-left:10px;
}
#raidoption .bottombar .cancel{
float:right;
margin-right:10px;
}
#raidoption .bottombar div{
width:30%;
}

/* black button */
div.blackbutton{
display:block;
border-width:0 12px;
padding:10px 0;
text-align:center;
font-size:20px;
font-weight:bold;
text-decoration:inherit;
border-image:url(/img/phone/grayButton.png) 0 12 0 12;
-moz-border-image:url(/img/phone/grayButton.png) 0 12 0 12;
-webkit-border-image:url(/img/phone/grayButton.png) 0 12 0 12;
color:#FFF;
cursor:pointer;
}

/* white button */
div.whitebutton{
display:block;
border-width:0 12px;
padding:10px;
text-align:center;
font-size:20px;
font-weight:bold;
text-decoration:inherit;
color:inherit;
border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
-moz-border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
-webkit-border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
text-shadow:rgba(255,255,255,0.7) 0 1px 0;
cursor:pointer;
}

/* login */
#login table{
margin:10px 0;
}
#login td{
padding:5px 0;
}
#login .error{
text-align:center;
font-weight:bold;
color:red;
margin-top:10px;
}

/* loading */
#loading_shadow{
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
opacity:0.5;
background:black;
z-index:110;
}
#loading{
position:fixed;
text-align:center;
background:black;
color:white;
z-index:120;
top:50%;
left:50%;
padding-top:20px;
width:160px;
height:60px;
margin-left:-80px;
margin-top:-30px;
border:1px solid #808080;
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
}

/* raiddetail action */
#raidaction{
position:fixed;
text-align:center;
background:#404040;
color:white;
/*height:200px;*/
width:240px;
left:50%;
top:50%;
margin-left:-120px;
margin-top:-100px;
z-index:115;
border:1px solid #808080;
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
}
#raidaction div{ margin:10px; }
#raidaction div.cancel{ margin-top:20px; }

/* raiddetail new msg */
#raidmsg .content #pcurr{
float:left;
margin-left:20px;
margin-bottom:10px;
margin-top:10px;
font-weight:bold;
}
#raidmsg .content .pchange{
float:right;
margin-right:20px;
margin-bottom:10px;
margin-top:10px;
}
#raidmsg .content .plist{
clear:both;
padding:5px 0;
margin:5px 10px;
border:1px solid #808080;
display:none;
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
}
#raidmsg .content .plist div{
float:left;
margin:10px;
}
#raidmsg .content .msg{
clear:both;
padding:5px;
text-align:center;
}
#raidmsg .content textarea{
width:98%;
margin:0 auto;
min-height:100px;
color:black;
font-weight:bold;
}
#raidmsg .bottombar .valid{
float:left;
margin-left:10px;
}
#raidmsg .bottombar .cancel{
float:right;
margin-right:10px;
}
#raidmsg .bottombar div{
width:30%;
}

/* raiddetail inscription */
#raidins .content .statut div.opt,#raidins .content .plist div.perso,#raidins .content .reroll div.opt{
border-width:0 12px;
padding:10px;
text-align:center;
text-decoration:inherit;
color:inherit;
float:left;
margin:0 10px;
}
#raidins .content .statut,#raidins .content .plist{
padding:0 12px;
clear:both;
margin-bottom:5px;
margin-top:5px;
}
#raidins .content .statut div.sel,#raidins .content .plist div.perso.main,#raidins .content .reroll div.sel{
border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
-moz-border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
-webkit-border-image:url(/img/phone/whiteButton.png) 0 12 0 12;
margin:0 -2px;
text-shadow:rgba(255,255,255,0.7) 0 1px 0;
font-weight:bold;
}
#raidins .content .plist div.perso.roll{
color:orange;
background:url(/img/rp/raid0.png) no-repeat left center;
}
#raidins .content .reroll{
margin:5px 10px;
}
#raidins .bottombar .valid{
float:left;
margin-left:10px;
}
#raidins .bottombar .cancel{
float:right;
margin-right:10px;
}
#raidins .bottombar div{
width:30%;
}

/* Cacher toutes les boites */
body>div{display:none;}