burger-quizz/style/global.css

360 lines
6.6 KiB
CSS

html
{
position: absolute;
background-color: black;
color: white;
width: 100%;
height : 100%;
}
/********************************************************************/
/* Divers/général */
a
{
transition-property: color;
-moz-transition-property: color;-webkit-transition-property: color;-o-transition-property: color;
transition-duration: 300ms;
-moz-transition-duration: 300ms;-webkit-transition-duration: 300ms;-o-transition-duration: 300ms;
color: #CAC063;
text-decoration: none;
}
a:hover
{
color: #CACACA;/* Miam :) */
text-decoration: underline;
}
fieldset
{
width:auto;
border-width: 6px;
border-color: #3E3E3E;
border-radius: 15px;
border-style: solid;
padding: 15px;
}
.bigbutton
{
width:120px;
height:50px;
margin: 10px;
}
/********************************************************************/
/********************************************************************/
/* Bandeau superieur */
#header
{
position : absolute;
left: 0%;
right: 0%;
top: 0%;
height: 150px;
text-align: center;
}
#logo_center
{
background-image: url('../img/logo.png');
background-repeat: no-repeat;
background-position: center;
background-size: contain;
position: absolute;
left: 20%;
width : 60%;
top : 5%;
height : 80%;
}
#logo_left
{
background-image: url('../img/burger_left.png');
background-repeat: no-repeat;
background-position: center;
background-size: contain;
position: absolute;
left: 5%;
width : 20%;
top : 25%;
height : 40%;
}
#logo_right
{
background-image: url('../img/burger_right.png');
background-repeat: no-repeat;
background-position: center;
background-size: contain;
position: absolute;
right: 5%;
width : 20%;
top : 25%;
height : 40%;
}
#moto
{
position : absolute;
text-align: center;
width : 100%;
bottom: 0%;
}
/********************************************************************/
/********************************************************************/
/* Bloc principal */
#core
{
position: absolute;
left : 180px;
right: 180px;
top : 160px;
background-color: #2E2E2E;
border-style:solid;
border-color: #555555;
border-radius: 40px;
box-shadow:0px 0px 40px #492A13;
}
#content
{
margin: 30px;
}
#content h1
{
text-align: center;
}
#content h4, #content h5, #content input, #content label,#content button, #content form, #content fieldset, .center_item
{
text-align: center;
}
/********************************************************************/
/********************************************************************/
/* Menus */
#menu_left
{
position:absolute;
top : 160px;
left: 0%;
width: 140px;
text-align: center;
padding: 15px 15px 15px 0px;
border-style: solid hidden solid hidden;
border-color: #2E2E2E;
border-radius: 0px 40px 40px 0px;
padding-bottom: 10px;
}
#menu_left a
{
font-size: 20px;
color: #CACACA;
text-decoration: none;
}
#menu_left a:hover
{
color: #CAC063;
}
#menu_right
{
position:absolute;
top : 160px;
right: 0%;
width: 140px;
text-align: center;
padding: 15px 0px 15px 15px;
transition-property: border-color, box-shadow;
-moz-transition-property: border-color, box-shadow, background-color;
-webkit-transition-property: border-color, box-shadow, background-color;
-o-transition-property: border-color, box-shadow, background-color;
transition-duration: 500ms;
-moz-transition-duration: 500ms;-webkit-transition-duration: 500ms;-o-transition-duration: 500ms;
border-style: solid hidden solid hidden;
border-color: #2E2E2E;
border-radius: 40px 0px 0px 40px;
box-shadow:0px 0px 0px #492A13;
background-color: #000000;
padding-bottom: 10px;
}
.menu_title
{
width : 100%;
height : 10%;
top : 0%;
left : 0%;
padding: 0px 0px 10px 0px;
font-family:"Times New Roman",Georgia,Serif;
font-size: 30px;
}
#burger
{
transition-property: height;
-moz-transition-property: height; -webkit-transition-property: height; -o-transition-property: height;
transition-duration: 500ms;
-moz-transition-duration: 500ms; -webkit-transition-duration: 500ms; -o-transition-duration:500ms;
}
.burger_image
{
transition-property: top;
-moz-transition-property: top; -webkit-transition-property: top; -o-transition-property: top;
transition-duration: 500ms;
-moz-transition-duration: 500ms; -webkit-transition-duration: 500ms; -o-transition-duration: 500ms;
position: absolute;
left:10px;
z-index: 10;
}
.burger_text_cont
{
transition-property: opacity, top;
-moz-transition-property: opacity, top; -webkit-transition-property: opacity, top; -o-transition-property: opacity, top;
transition-duration: 500ms;
-moz-transition-duration: 500ms; -webkit-transition-duration: 500ms; -o-transition-duration: 500ms;
font-size: 20px;
text-decoration: none;
text-shadow: 5px;
color: white;
vertical-align: central;
position: absolute;
left:10px;
width:125px;
height:30px;
z-index: 9;
}
.burger_text
{
font-size: 20px;
text-decoration: none;
text-shadow: 5px;
color: white;
vertical-align: central;
text-align: center;
width:100%;
height:100%;
}
/********************************************************************/
/* Formulaire de connexion */
.form
{
width : 100%;
height : 10%;
left : 0%;
text-align: center;
}
.form_input
{
width: 100%;
height : 100%;
}
.form_input input
{
width : 90%;
}
/********************************************************************/
/********************************************************************/
/* Propriété des tableaux */*
table
{
position: relative;
width: 80%;
left : 10%;
border-width: 3px;
border-color: #3E3E3E;
border-radius: 15px;
border-style: solid;
padding: 15px;
margin: 20px 0px 20px 0px;
}
/********/
th {
text-align: center;
border : 1px solid #bababa;
background-color: #3E3E3E;
}
/********/
tr.selected {
text-align: center;
border : 1px solid #bababa;
background-color: #9C391E;
}
tr.selected:hover {
background-color: #C54826;
}
/********/
tr {
text-align: center;
border : 1px solid #bababa;
background-color: #2E2E2E;
}
tr:hover {
background-color: #404040;
}
/********************************************************************/