@font-face { font-family: "GothicA1 Black"; src: url("fonts/GothicA1-Black.ttf") format("truetype"); }
@font-face { font-family: "GothicA1 Light"; src: url("fonts/GothicA1-Light.ttf") format("truetype"); }
@font-face { font-family: "GothicA1 Regular"; src: url("fonts/GothicA1-Regular.ttf") format("truetype"); }
@font-face { font-family: "GothicA1 Bold"; src: url("fonts/GothicA1-Bold.ttf") format("truetype"); }
.g-black { font-family: 'GothicA1 Black', sans-serif; }
.g-light { font-family: 'GothicA1 Light', sans-serif; }
.g-regular { font-family: 'GothicA1 Regular', sans-serif; }
.g-bold { font-family: 'GothicA1 Bold', sans-serif; }
.fond-gris { background-color: #e7ebed; }
h1, h2, p { color: #3b4262; margin: 0; }
strong { font-weight: normal; }
/* HEADER */
header { text-transform: uppercase; text-align: center; height: 120px; }
header .container > p { margin: 20px 0; font-size: 2rem; }
header .container > p a { color: #3b4262; }
header .container > p a:hover { text-decoration: none; }
#navbar-top { margin-top: 70px; transition: margin-top ease 0.1s; }
#navbar-top.scroll { margin-top: 0; background-color: white; }
#navbarSupportedContent .navbar-nav .nav-item .nav-link { color: #3b4262; font-family: 'GothicA1 Regular', sans-serif; }
#navbar-top.scroll #navbarSupportedContent .navbar-nav .nav-item .nav-link.active { color: #7580b7; }
/* NOM */
#nom { position: relative; }
#nom .h1-side h1 { text-transform: uppercase; }
#nom img { width: 100%; }
#devis-gratuit { background-color: #3b4262; border-color: #3b4262; text-transform: uppercase; position: absolute; }
#devis-gratuit:hover { background-color: #586290; border-color: #586290; }
#devis-gratuit:focus { box-shadow: 0 0 0 .2rem #586290; }
/* DESCRIPTION */
#description { text-align: center; }
#description p { color: #212121; margin-top: 50px; }
/* PRESTATIONS */
#prestations { height: auto; }
#prestations h2 { text-align: center; margin-bottom: 30px; }
#prestations .overlay { position: relative; }
#prestations .overlay img { transition: opacity ease-out 0.3s; }
#prestations .overlay:hover img { opacity: 0.2; }
#prestations .overlay .text-overlay { opacity: 0; text-align: center; width: 75%; transition: opacity ease-out 0.2s; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#prestations .overlay .text-overlay .g-bold { text-transform: uppercase; font-size: 1.2rem; }
#prestations .overlay .text-overlay .g-regular { font-size: 0.8rem; }
#prestations .overlay:hover .text-overlay { opacity: 1; }
/* CONTACT */
#contact { position: relative; }
#contact h2 { text-align: center; margin-bottom: 30px; }
#contact button { background-color: #3b4262; border-color: #3b4262; }
#contact button:hover { background-color: #586290; border-color: #586290; }
#contact button:focus { box-shadow: 0 0 0 .2rem #586290; }
#contact .toast { min-width: 300px; max-width: 500px; }
/* FOOTER */
footer { padding: 20px; background-color: #3b4262; color: white; }
footer h3 { color: white; text-transform: uppercase; }
footer p { color: white; }
footer a { color: white; text-decoration: none; }
footer a:hover { color: #7580b7; }