﻿/*=========================================================================================================================/


                                                                                      

@charset "utf8" /* Charset Encoding */
@import url("decoration-login.css") /* Fleet Event table etc .. */

/* Initialisation Marges a 0
 Resolve certain bug Opera */
*{margin:0; padding:0;}

html{overflow:auto;}
#info_user_pyro_e2pz th:hover
{
    background-image:url("img/images/bg1.gif"); 
}


#lang {
    width: 50%; /* Ajustez cette valeur selon vos préférences. 100% signifie qu'il occupera toute la largeur de la cellule de tableau. */
    height: 27px; /* Ajustez la hauteur selon vos besoins */
    box-sizing: border-box;
    border: 1px solid #ccc;
    font-size: 12px; /* Taille de la police. Ajustez selon vos besoins */
}
#signupPopup {
    display: none; /* cachée par défaut */
	min-width:800px; 
	width:50%; 
	position: absolute; 
	margin-top: 200px; 
	left: 50%; 
	transform: translateX(-50%);
    background-image:url("back_img/background_1920.jpg"); 
    background-repeat: no-repeat;
    background-size: cover;
    border: 1px solid black;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    z-index: 9999; /* pour s'assurer qu'elle s'affiche au-dessus d'autres éléments */
}
#signupPopup2 {
    display: none; /* cachée par défaut */
	min-width:800px; 
	width:50%; 
	position: absolute; 
	margin-top: 200px; 
	left: 50%; 
	transform: translateX(-50%);
    background-image:url("back_img/background_1920.jpg"); 
    background-repeat: no-repeat;
    background-size: cover;
    border: 1px solid black;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    z-index: 9999; /* pour s'assurer qu'elle s'affiche au-dessus d'autres éléments */
}

.popup table {
    width: 700px; /* comme spécifié dans votre code */
}

.popup th, .popup td {
    padding: 5px;
    text-align: center;
	border:1px solid black;
}

.popup input[type="text"], 
.popup input[type="password"], 
.popup input[type="email"] {
    width: 50%;
    padding: 5px;
    box-sizing: border-box; /* pour que le padding soit inclus dans la width */

}

.popup button {
    background-color: #f44336;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    color: white;
}

.popup button:hover {
    background-color: #e57373;
}

.popup {
    position: fixed;
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    width: 90%; /* Prend jusqu'à 90% de la largeur de l'écran */
    max-width: 780px; /* Largeur maximale */
    z-index: 1000;
    background-color: #43556c;
    border: 2px solid #43556c;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); /* Ajoute un effet visuel */
}

#info_user th:hover
{
    background-image:url("img/images/bg1.gif");
}
#info_user_av th:hover
{
    background-image:url("img/images/bg1.gif");
}
#info_user_pyro_e2pz
{
	position:absolute;
	top:20px;
	right:15px;
}
.fixed-footer {
    position: fixed;     /* Fixe le footer en bas de la page */
    bottom: 0;           /* Positionne le footer en bas de la fenêtre */
    left: 0;             /* Assure que le footer s'étend à partir de la gauche */
    width: 100%;         /* S'étend sur toute la largeur de la fenêtre */
    height: 25px;        /* Hauteur de 25px */
    
    color: #fff;         /* Couleur de texte blanche (à ajuster selon vos besoins) */
    text-align: center;  /* Centre le contenu (à ajuster selon vos besoins) */
    line-height: 25px;   /* Centre verticalement le texte dans le footer */
}

        .slider-container {
            width: 100%;
			height: 230px;
            position: relative;
            overflow: hidden;
        }

		.slide {
			position: relative;
			height: 100vh;  /* Utilisez 100vh pour une hauteur égale à la hauteur de la fenêtre du navigateur */
			width: 100%;    /* Assurez-vous que la diapositive occupe toute la largeur */
			overflow: hidden; /* Cela empêche tout débordement */
		}
		
		.centered-table {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}
		
		#slide1, #slide2, #slide3, #slide4, #slide5, #slide6 {
			font-family:Verdana; 
			background-image:url("img/images/bkbody.png"); 
			border:1px solid #000000; 
			background-color:transparent; 
			height: 230px;
			overflow: hidden; /* Important pour éviter que le contenu dépasse lors du zoom */
		}
		
		.slide img {
			width: 100%; /* Ajustez selon vos besoins */
			height: auto;
			transition: transform 0.3s, filter 0.3s;
			box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
			filter: brightness(1);
		}
		
		.slide:hover img {
			filter: brightness(1.2) contrast(1.1);
			transform: scale(1.05); /* Zoom de l'image */
		}
		
		button {
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			z-index: 10;
			width: 50px; /* Largeur du bouton carré */
			height: 50px; /* Hauteur du bouton carré */
			background-color: grey; /* Fond gris */
			border: none; /* Supprime les bordures */
			color: white; /* Couleur du texte */
			font-weight: bold; /* Texte en gras */
			font-size: 18px; /* Taille du texte */
			cursor: pointer; /* Le curseur devient une main lors du survol du bouton */
			box-shadow: 0px 2px 5px rgba(0,0,0,0.3); /* Ombre pour un peu de profondeur */
			transition: background-color 0.3s; /* Transition pour un effet de survol doux */
		}
		
		button:hover {
			background-color: darkgrey; /* Changement de couleur lors du survol */
		}
		
		#prevBtn {
			left: 0;
		}
		
		#nextBtn {
			right: 0;
		}
		


#info_user
{
	position:absolute; 
	top:12px;
	left: 73px;
}
#info_user_av
{
	position:absolute;
	top:14px;
	left:15px;
	border:1px solid grey;
}


#header_top_1::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 90px; /* La hauteur de la zone de "dissimulation". À ajuster selon vos besoins */
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.4)); /* Le gradient doit se fondre avec la couleur d'arrière-plan du header */
    pointer-events: none; /* Pour éviter toute interaction avec cette zone */
}
 #header_top_1 
 { 
	 background-color: rgba(0, 0, 0, 0.4); 
	 top:0; 
	 z-index:1; 
	 height:150px;  
	 position : fixed;  
	 scrollbars:none; 
	 overflow:visible; 
	 left:0;   
	 width:100%;  
	 border-bottom:2px solid #dfe8f3; 
	 border-top:3px solid #00a8ec;
	 box-shadow: 1px 1px 12px #fafafa;

 }
 #header_top_2 {
    top: 5px;
    height: 33px;
    position: relative;
	scrollbars:none; 
    left: 0;
    width: 100%;
    z-index: 10000; 
}
   #header_top_3
 { 
	 top:0px;  
	 z-index:11; 
	 position:absolute;  
	 right:0;   

 }
    #header_top_4
 { 
	 top:3px;  
	 z-index:11; 
	 position:absolute;  
	 left:600px;   

 }
  #header_top_menu 
 { 
	background-color:transparent;
	 top:85px;  
	 z-index:100; 
	 height:20px;  
	 position : fixed; 
	 scrollbars:none; 
	 overflow:visible; 
	 left:0;   
	 width:100%;  
	 
	 border-bottom:1px solid #434343; 

 }




th,td.b,td.c,input,select,td.k,td.l,textarea,table.s th images,menu
{
	font-family:Verdana; 
	background-image:url("img/images/bkbody.png"); 
	border:1px solid black; 
    background: transparent grey;
	
	/* -moz-border-radius:5px;  */ 
	/* -webkit-border-radius:5px;  */
	/* border-radius:5px;  */
	/* -khtml-border-radius:5px;  */
}

#table th
{
	font-family:Verdana; 
	background-image:url("img/images/bkbody.png"); 
	border:1px solid #434343; 
	background-color:transparent; 
	 -moz-border-radius:5px;
	 -webkit-border-radius:5px; 
	 border-radius:5px; 
	 -khtml-border-radius:5px; 
}

th,td.c,a,a.s,a.t {
	font-weight:normal; 
	text-decoration:none; 
	color:#FFFFFF;
}

a:hover {text-decoration:underline;}

input:hover,textarea:hover{
	moz-opacity:0.7;  
	opacity:0.7;
	filter:alpha(opacity=70);
}

td.b,td.c,input,select,textarea,td.k,td.l a,td.l a font,th{font-size:10px; text-shadow:1px 1px 1px #000000;}

td.b{text-align:center}
td.c{
	text-align:left; 
	height:15px; 
	background-image:url("img/background_loop.jpg"); 
	border-top: 1px solid skyblue;
	background-repeat: no-repeat;
	background-size: cover;
	background-position:top left; 
	text-shadow:1px 1px 1px #000000;
	padding: 10px;
	font-weight: bold;
	font-size: 7pt;
	text-transform:uppercase;
}
td.k {width:100px; text-align:center;}
td.l{text-align:left; padding:4px;font-size:9px}
td.l a{color:#FFFFFF;font-weight:bold}
td.x
{
	border-bottom-color: #669; 
	border-bottom-width: 1px; 
	border-bottom-style: dotted; 
}  
table.s th{
	padding:5px; 
	background-image:none; 
	text-align:left;
}
table,td{background-color:transparent}

input,select
{
	background-color:#333333; 
	color:#CCCCCC
}
input[type='text'] {
 background-color:grey;
 height          : 25px;
}
input[type='password'] {
 background-color:grey;
 height          : 25px;
}
input[type='text_top'] {
 border          : 1px white solid;
 background-color:grey;
 height          : 20px;
}
input[type='submit'] {
 min-width           :110px;
 background-color:skyblue;
 border:none;
 text-transform : uppercase;
}


th
{
	background-repeat:repeat;
	text-align:center; 
}



textarea{width:100%;color:#FFFFFF}

#texto_normal{font-weight: normal;} 

images {
	border-radius   : 5px; 
	-moz-border-radius   : 5px; 
	-webkit-border-radius:5px; 
	-khtml-border-radius:5px; 
}


/* Menu */
#NEWavatar
{
position:absolute;
z-index: 35;
top : 100px;
left: 23px;
}

#parent {
   position: absolute;
   top: 12px;
   left: -29px;
}
images.superpose {
   position: absolute;

}
#menu2
{
   z-index: 0;
   top: 105px;
   left: 0px;
}
#galaxie
{
	z-index: 1;
   top: 457px;
   left: 204px;
}
#images_batiments {
   z-index: 8;
   top: 95px;
   left: 212px;
}
#images_bunker {
   z-index: 7;
   top: 123px;
   left: 289px;
}
#images_flotte {
   z-index: 6;
   top: 165px;
   left: 312px;
}
#images_entrepot {
   z-index: 5;
   top: 225px;
   left: 285px;
}
#images_generale {
   z-index: 4;
   top: 165px;
   left: 225px;
}
#images_chantier {
   z-index: 3;
   top: 260px;
   left: 205px;
}
#images_defenses {
   z-index: 2;
   top: 215px;
   left: 145px;
}
#images_labo {
   z-index: 1;
   top: 120px;
   left: 140px;
}
#images_logout {
   z-index: 1;
   top: 165px;
   left: 55px;
}
#images_mess{
   z-index: 10;
   top: 303px;
   left: 54px;
   width:57px;
   height: 30px;
}
.Style5-mess {
	z-index:11;
    position:absolute;
    left: 123px;
    top: 317px;
    font-size: 12px;
}
.Style6-py {
	z-index:11;
    position:absolute;
    left: 35px;
    top: 177px;
    font-size: 10px;
}
.Style7-username {
	z-index:11;
    position:absolute;
    left: 35px;
    top: 119px;
    font-size: 10px;
}
.Style7-rank {
	z-index:11;
    position:absolute;
    left: 58px;
    top: 148px;
    font-size: 10px;
}



#menu{
	padding-top:35px; 
	background-repeat:no-repeat;
	overflow:auto; 
	top: 78px;
	left: 10px; 
	text-align:center;
	
	background-color: transparent;
	height:80%;
	z-index:100;
	width:162px; 
	position : fixed;

	overflow:visible;   
	 
}
#menu table {width:220px;margin: 0 auto;}

#menu th:hover
{
    background-image:url("img/images/bg1.gif");
}

#menu div a{color:#FFFFFF;text-decoration:none;}
#menu td{
	text-align:left; 
	height:15px; 
	background-image:url("img/images/bg2.gif"); 
	 background-repeat: no-repeat;
	 background-size: cover;
	background-position:top left; 
	text-shadow:1px 1px 1px #000000;
	padding: 10px;
	font-weight: bold;
	font-size: 7pt;
	text-transform:uppercase;
	letter-spacing: 1px;
}


#menu td:hover a 
{
	display:block; 
	width:100%; 
	height:100%;
	font-size:9px; 
	background-image:url(images/deco.menu2.png); 
	color:#347680; 
	text-decoration:none; 
}

/* JS Calling :: FIX IE ... again */
.menuhover{ /* #menu td:hover */
	display:block; 
	width:100%; 
	font-size:9px; 
	background-image:url(img/images/deco.menu2.png); 
	color:#347680; 
	text-decoration:none;
	padding: 0px;
}
.menuout{ /* #menu td */
	font-size:9px; 
	font-family:Verdana; 
	padding: 0px; 
	vertical-align	: middle; 
}
/* END FIX IE */

/* Exception for Copyright logo */
#menu table.copy td:hover a
{	
	text-decoration:underline;
	color:#FFFFFF;
	background-image: none;
}


/* General */
body
{
	background-image:url("back_img/background_1920.jpg"); 
	background-position:center top;
	background-attachment:fixed;
	background-repeat:no-repeat;
	margin: 0px;
	padding: 0px;
	background-color: #132344;
	background-size: cover;
	width:100%;
	height:100%;
	-webkit-background-size: cover; /* pour anciens Chrome et Safari */
	font-family:Verdana; 
	font-size:10px; 
	text-shadow:2px 2px 2px #000000;
}
body.style{background-image     : none;}
body form table th table input
{
	width:60px; 
	font-family:Arial; 
	font-size:10px;
	font-weight:normal; 
	border:none
}

table tbody tr th table tbody tr th center{
	text-align:left;
	font-size:8px; 
	font-family:Arial
}
table table td{
	font-family:Verdana;  
	font-size:9px;
}

table tbody tr td p{font-size:10px}

#Overdiv {background-color:#969696}



h2
{
	font-size            : 14px; 
	font-family          : Tahoma,sans-serif; 
	border-bottom        : 0px #344566 solid;
	width                : 98%; 
	text-align           : center; 
}

/* ENTETE */

#header_top{
	top:0; 
	z-index:10
	height:86px; 
	position:absolute; 
	scrollbars:none;
	overflow:visible;
	left:190px;  
	width:80%; 

	
}

/*Le tableau des ressources / liste planetes  */
#header_top table{
	
	
	/* -moz-border-radius-bottomright: 10px; /* MOZ : Mozilla */ 
	/* -moz-border-radius-bottomleft: 10px;  */
	/* -webkit-border-bottom-left-radius : 10px; /* WEBKIT : CHROME & SAFARI */ 
	/* -webkit-border-bottom-right-radius : 10px;  */
	/* -khtml-border-bottom-left-radius: 10px; /* KHTML : Konqueror */ 
	/* -khtml-border-bottom-right-radius: 10px;  */
	/* border-bottom-left-radius : 10px; /* Opera & IE(Allowed by IE only with DOCTYPE Declaration) */ 
	/* border-bottom-right-radius : 10px;  */
	/* background:black url('images/bgf.jpg') fixed no-repeat bottom right;  */
	/* filter:alpha(opacity=70); /*IE* */
	/* opacity:0.7;  */
	/* -moz-opacity:0.7;  */
	/* -khtml-opacity:0.7; */
	padding-bottom:0; 
	padding-left:30px; 
	padding-right:10px; 
}
#header_top table table,#resources
{
	background:transparent !important; 
	opacity:1.0 !important; 
	filter:aplha(opacity=100); /*FIX IE */
	moz-opacity:1;
}

.header{font-size:7pt;} /* Taille du texte !important */

#metal_top, #crystal_top, #deut_top
{
	font-size:8pt;
}

/*Vous en allez pas les ressources !*/
#header_top table table{
	background-image:none; 
	padding:0; 
	width:0
}
#header_top table table td.header, th.header{
	padding-left: 20px;
	padding-right: 5px; 
}


/* EXTRA :: Decoration des flèches INPUT de la page galaxie */

td.l input[name="galaxyLeft"],
td.l input[name="systemLeft"]
{
	background-position  : right; 
	background-image     : url(images/lefthover.gif); 

}

td.l input[name="galaxyLeft"]:hover,
td.l input[name="systemLeft"]:hover
{
	background-position  : right; 
	background-image     : url(images/left.gif); 
}

td.l input[name="galaxyRight"],
td.l input[name="systemRight"]
{
	background-position  : left; 
	background-image     : url(images/righthover.gif); 
}

td.l input[name="galaxyRight"]:hover,
td.l input[name="systemRight"]:hover
{
	background-position  : left; 
	background-image     : url(images/right.gif); 
}

/* CSS CODE FROM EPIC BLUE XGP ARE BELOW */

#content {
	position:relative;
	top:112px;
	left:-10px;
	margin:auto;
	overflow:auto; 
	width:100%;
	
}
/* COMPATIBILITY Opera , IE */
#content table {margin:0 auto;}

/* Special DIV for Combat Rapport */
#RC{

	text-align:center; /*Comp Opera IE */
	scrollbars:none; 
	overflow:auto; 
	margin-left:auto; 
	height:100%;	
}
#RC table {margin:0 auto;}



#errorbox { /* Pour le mode debug */
	position:absolute; 
	left:190px; 
	top:80px; 
	border:3px solid #FF0000; 
	display:none; 
	width:78%; 
	margin:3px 0px; 
	padding:4px 3px; 
}
#messagebox {
	position:absolute; 
	left:190px; 
	top:80px; 
	border:1px solid #00FF00; 
	display:none; 
	width:78%; 
	margin:3px 0px; 
	padding:4px 3px; 
}

td.header, th.header, tr.header, table.header{
	border:0px; 
	background-color:transparent; 
}

#head{
	width:80%; 
	position:absolute; 
	left:200px; 
}


.Stil1 {
    color: lime
}
#siteFooter
{
    height: 15px;
	z-index:10;
	right:2px;
	padding-left:5px;
	padding: 10px;
	width:15%;
    position: fixed;
    bottom: 0;
	text-align:center;
	
	border:1px solid #434343;
}
 #effet_fun 
 { 
	 margin-top:55px; 
	 margin-left:173px; 
	 background-image: url(img/images/effet_fun.png) no repeat; 
	 z-index:20; */
	
 } 
 .Style_fun { */
	 text-align:center; 
	 position:absolute; 
     margin-left: -90px; 
     margin-top: 35px; 
 } 
 .Style_fun2 { 
 text-align:center; 
	 position:absolute; 
     margin-left: -130px; 
     margin-top: 130px; 
 } 
 
 
 @font-face {
 font-family: '01-Digitall';
    src:url('https://rageconquest.com/fonts/01-Digitall.ttf.woff') format('woff'),
        url('https://rageconquest.com/fonts/01-Digitall.ttf.svg#01-Digitall') format('svg'),
        url('https://rageconquest.com/fonts/01-Digitall.ttf.eot'),
        url('https://rageconquest.com/fonts/01-Digitall.ttf.eot?#iefix') format('embedded-opentype'); 
    font-weight: bold;
    font-style: normal;
}

.style_name_planet_overview
{
    font-family: '01-Digitall';
    letter-spacing: 2px;
}
.style_pos_planet_overview
{
    font-family: '01-Digitall';
    letter-spacing: 2px;
	font-size:16px;
}

/*
     This is the end ... my only friend the end ... 
*/
