burger-quizz/web/css/main.css

body {
  padding:0px;
  margin:0px;
  font-family:'Open Sans';
  background: #fffdc6;
}

p a, #game a, p a:visited, p a:visited {
  text-decoration: underline;
  color:black;
}

a, a:visited {
  color: white;
  text-decoration: none;
}

a:active{
  background:transparent
}

#navbar a:hover {
  text-decoration:none;
}

header {
  height: 100px;
  background-color: white;
  background-image: url("../assets/burgerquizz.png");
  background-size: 400px;
  background-repeat: no-repeat;
  background-position: center;
  padding-bottom: 10px;
}

#responsive-navbar {
  display: none;
  margin-top:0px;
  color: white;
  background-color: #7e19ff;
  font-size: 25px;
}

#responsive-navbar ul {
  margin-top:0px;
  list-style-type:none;
  padding-left:0px;
  width:100%;
  margin-bottom:0px;
}

#responsive-navbar ul li {
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
  text-align:center;
  width:100%;
}

#responsive-navbar ul li a {
  display:block;
  width:100%;
}

#responsive-navbar ul li:last-child {
  background: #ff9619;
}

#responsive-navbar ul li:last-child.current {
  background: #ffab19;
}

#responsive-navbar ul li:last-child:hover {
  background: #ffab19;
}

#responsive-navbar ul li:hover, #responsive-navbar ul li.current {
  background: #9556f9;
}

#responsive-navbar ul li:first-child, #responsive-navbar ul li:first-child:hover, #responsive-navbar ul li:first-child:active {
  background-color: #7e19ff;
  background-image: url('../assets/burger-menu.png');
  background-size: 25px;
  background-repeat: no-repeat;
  background-position: 10px, 50%;
}

#responsive-navbar #score-responsive {
  text-align: right;
  float: right;
  left: 0px;
  padding-right: 10px;
  padding-left: 10px;
  background: #FFAB19;
}

#navbar {
  color: white;
  background-color: #7e19ff;
  height: 70px;
  font-size: 25px;
}

#navbar ul {
  padding-top: 35px;
  display: inline;
  vertical-align: middle;
}

#navbar li:first-child a {
  margin-left:20px;
}

#navbar a {
  padding-top:17px;
  padding-left:30px;
  padding-right:30px;
  padding-bottom:18px;
  margin-right: 10px;
}

#navbar li {
  display: block;
  float:left;
  padding-top:17px;
  height: 53px;
}

#navbar li:hover a, #navbar li.current a {
  background: #9556f9;
}

#navbar li:last-child a {
  margin-right:0px;
  padding-right:70px;
  padding-left:70px;
}

#navbar li:last-child {
  display: block;
  float: right;
  text-align:right;
  background: #ff9619;
}

#navbar li:last-child:hover a, #navbar li.current:last-child a {
  background: #ffab19;
}

#page {
  width: 60%;
  margin: auto;
}

h1 {
  text-align: center;
  font-size: 400%;
}

h2 {
  text-align: center;
  font-size: 200%;
}

#page p {
  text-indent: 30px;
}

#button_container
{
	text-align: center;
}

.button
{
	display: inline-block;
}

.button a {
  display:block;
  background: #09b22b;
  color: white;
  border: none;
  height: 70px;
  width: 200px;
  margin:auto;
  margin-right:15px;
  margin-left:15px;
  text-align:center;
  float: left;
}

.firstword {
  font-size:200%;
}

article#jouer {
  margin:auto;
}

#page ol {
  text-align:center;
  font-size: 120%;
}

@media all and (max-width: 799px) {
  header {
    background-size: 68%;
  }
  #responsive-navbar {
    display: block;
  }
  #navbar {
    display: none;
  }
}

@media all and (min-width: 800px) {
  #responsive-navbar {
    display: none;
  }
  #navbar {
    display: block;
  }
}