/* index.css */
body {
  font-family: "Comfortaa", sans serif;
}

/* Header */
header {
  display: inline-block;
  width: 60%;
  vertical-align: bottom;
}

header td:first-child {
  padding-right: 1em;
}

header h1 {
  margin: 0 0 0.1em 0;
  
  font-size: xxx-large;
  color: #4D77C0;
}

header h1 > span {
  color: rgb(102, 102, 102);
  font-size: 1.25em;
}

header h2 {
  font-size: large;
  margin: 0 0 1em 0;
  color: rgb(102, 102, 102);
}

header h2 > span {
  color: #4d77c0;
}

/* Nav */
nav {
  position: absolute;
  right: 0;
  margin-top: 0.5em;
  margin-right: 1em;
}

nav a {
  margin-right: 1em;
  color: #4D77C0; /* 100, 100, 250 */
}

nav a:hover {
  color: #2A4D7D;
}

nav > div.dropdown > a::before {
  content: "\25be\0020";
}

nav > div.dropdown {
  margin-right: 1em;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  border: 1px solid #4D77C0;
  text-align: center;
  display: inline-block;
}

nav > div.dropdown > a {
  margin-right: 0;
  padding: 0 1.5em 0 1.5em;
}

nav > div.dropdown > aside {
  display: none;
}

nav > div.dropdown:hover > aside.nav {
  position: absolute;
  display: block;
  z-index: 1;
  text-align: left;
}

nav > div.dropdown:hover > aside.nav > a {
  display: block;
  padding-top: 1em;
}

/* Temp */
section#welcome div {
  width: 33%;
  margin: auto;
  text-align: center;
}

/* Section */
section {
  clear: both;
  padding: 0.1em 1em 0.1em 1em;
}

section > h3 {
  font-size : x-large;
}

section.color {
  background-color: #6A8BC0;
  color: white;
  border-radius: 1em;
}

section > p, section > img, section > article, section > form {
  margin-left: 1em;
}

section > p {
  font-family: "Open Sans";
  text-align: justify;
  font-size: small;
}

/* Services */
section#slogan q {
  display: block;

  font-size: large;
  text-align: center;
  
  font-style: italic;
  color: #666666;
  
  margin-bottom: 1em;
}

section#services table {
  width: 100%;
  border-collapse: collapse;
}

section#services td {
  width: 50%;
  border: 1px solid #4d77c0;
}

section#services td img {
  height: 3em;
  padding: 0.5em;
}

section#services td h4 {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  padding: 0.5em;
}

section#services td.color {
  background-color: #4d77c0;
  color: white;
}

/* Contact */
section#contact {
  margin-bottom: 1em;
}

.status-success {
	background-color: #d4edda;
	color: #155724;
	border: 1px solid #c3e6cb;
}

.status-error {
	background-color: #f8d7da;
	color: #721c24;
	border: 1px solid #f5c6cb;
}

form > table {
  width: 100%;
}

form > table tr td:first-child {
 width: 10%; 
}

form > table input {
  width: 25%;
}

form > table span {
  color: red;  
}

/* Banner */
section#banner {
  padding: 0 0 0 0;
}

section#banner img {
  display: block;
  margin: auto;
}

section#banner {
  border-top: 2px solid #4D77C0;
}

/* Pied de page */
footer {
  border-top: 2px solid #4D77C0;
  color: rgb(102, 102, 102);
  text-align: center;
}