body {
 background-color: #000;
}

body, h1, h2, h3, h4, h5, h6 {
 font-family: 'Roboto', sans-serif;
}

h4 {
 letter-spacing: 0.03em;
}

h1, h2 {
 text-transform: uppercase;
 font-weight: 300;
 letter-spacing: 0.05em;
}

p {
 line-height: 1.8em;
}

ul.k-dash {
 list-style-type: "\2014";
 padding: 0px;
 margin: 0px;
 margin-left: 1em;
}

ul.k-dash li {
 padding-left: 0.7em;
}

li {
 line-height: 1.8em;
}


strong {
 font-size: 1.2em;
 font-weight: 500;
}

.k-logo {
 width: 80px;
}

.k-suisse {
 width: 32px;
 margin-bottom: 10px;
}

.vcard .photo,
.vcard .url,
.vcard .country-name {
 display: none;
}

.k-navigation_mobile {
 padding-top:5px;
 color: #ddd;
}

.k-navigation_mobile a {
  text-decoration: none;
  padding-top: 2px;
  padding-bottom: 2px;
  color: #ddd;
}

.k-navigation_mobile a:hover,
.k-navigation_mobile a.k-active {
  color: #fff;
}

.k-navigation_mobile ul {
 list-style: none;
}

.k-navigation_mobile li {
  padding-top: 6px;
  padding-bottom: 6px;
}

a {
 color: #666;
}
a:hover {
 color: #000;
}

a.bouton {
 background-color: darkred;
 padding: 1rem;
 color: #FFF;
}

a.bouton:hover, a.bouton:active {
 background-color: #A45C09;
}

.k-bg-gray {
 background-color: #eee;
 padding-top: 20px;
 padding-bottom: 20px;
}

.k-bg-gray .fa {
 color: #000;
}

.k-margin-bottom-40 {
 margin-bottom: 40px;
}

.k-header {
	background-color: #000;
	padding-top: 20px;
	padding-bottom: 20px;
	z-index: 10;
}


.k-contenu {
 background-color: #fff;
}

.k-menu {
 background-color: #fff;
}

.k-footer {
       background-color: #000;
       padding-top: 20px;
       padding-bottom: 20px;
       color: #fff;
}

.k-footer a {
       color: #ddd;
}

.k-footer a:hover {
       color: #fff;
}

#k-menu li {
	display: inline;
	padding-left: 2rem;
	padding-right: 2rem;
}
#k-menu a {
	font-size: 1.2rem;
	color: #666; 
}

#k-menu a:hover,
#k-menu a.k-active {
	color: #000;
}

.k-service {
 display: none;
 font-size: 1.2rem;
}

.k-show-service {
 display: block;
}

.k-phone {
 font-size: 1.6rem;
}

.k-email {
 font-size: 1.2rem;
}

.k-big-text {
 font-size: 3.5rem;
 font-weight: 300;
 line-height: 4.2rem;
}

.k-medium-text {
 font-size: 2rem;
 line-height: 2.4rem;
}

.k-small-text {
 font-size: 1.2rem;
 line-height: 1.44rem;
}

.k-contact {
 width: 260px;
 height: 260px;
 padding: 50px;
 border-radius: 50%;
 background-color: darkred;
 display: inline-block;
 color: #fff;
}

.k-contact a {
 color: #ddd;
}

.k-contact a:hover {
 color: #fff;
}

.k-contact p {
 line-height: 1.2em;
 font-size: 1.2em;
}

.k-box {
border-top: 1px solid #000000;
}

.k-element {
 padding-bottom: 20px;
 padding-top: 20px;
 border-top: 1px solid #ddd;
}

.k-element-2 {
 padding-top: 20px;
 border-top: 1px solid #ddd;
}

#taquin {
 margin-right: auto;
 margin-left: auto;
 position: relative;
 width: 100%;
 max-width: 600px;
}

#taquin:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.k-icon-text {
 cursor: pointer;
}

.k-icon-text:hover {
 color: #fff;
}

.k-redo-taquin-icon {
 transition: transform 0.3s ease-in-out;
 cursor: pointer;
}

@media (hover: hover) {
 .k-redo-taquin-icon:hover {
  transform: rotate(360deg);
  color: #000;
 }
}

.k-carre {
 width: 100%;
 padding: 20px;
 color: #fff;
 border-radius: 10px;
 font-size: 1.5em;
}


.k-bg-1-alt-1 { background-color: #760; }
.k-bg-2-alt-1 { background-color: #a60; }
.k-bg-3-alt-1 { background-color: #d60; }

.k-bg-1-alt-2 { background-color: #082143; }
.k-bg-2-alt-2 { background-color: #1E6D9E; }
.k-bg-3-alt-2 { background-color: #2688ED; }

.k-bg-1-alt-3 { background-color: #8b0000; }
.k-bg-2-alt-3 { background-color: #8b0038; }
.k-bg-3-alt-3 { background-color: #74235d; }

.k-bg-1-alt-4 { background-color: #082143; }
.k-bg-2-alt-4 { background-color: #004d74; }
.k-bg-3-alt-4 { background-color: #007d8f; }

.k-bg-1 { background-color: #432108; }
.k-bg-2 { background-color: #9E6D1E; }
.k-bg-3 { background-color: #EDB826; }


.chiffre-tuile {
 font-size: 1.5rem;
 line-height: 2rem;
}

.tuile {
 line-height: 1rem;
 font-size: 0.8rem;
 position: absolute;
 width: 25%;
 height: 25%;
 top: 50%;
 left: 50%;
 box-sizing: border-box;
 border: 4px solid white;
 padding: 0.3rem;
 border-radius: 10px;
 cursor: pointer;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
}

.tuile[data-numero="1"] {
 background-color: #1E0C06;
 color: #FFF;
}

.tuile[data-numero="2"] {
 background-color: #432108;
 color: #FFF;
}

.tuile[data-numero="3"] {
 background-color: #6D3A05;
 color: #FFF;
}

.tuile[data-numero="4"] {
 background-color: #A45C09;
 color: #FFF;
}

.tuile[data-numero="5"] {
 background-color: #7A4A0B;
 color: #FFF;
}

.tuile[data-numero="6"] {
 background-color: #BE740E;
 color: #FFF;
}

.tuile[data-numero="7"] {
 background-color: #9E6D1E;
 color: #FFF;
}

.tuile[data-numero="8"] {
 background-color: #B9892D;
 color: #FFF;
}

.tuile[data-numero="9"] {
 background-color: #8F7339;
 color: #000;
}

.tuile[data-numero="10"] {
 background-color: #CFA13E;
 color: #000;
}

.tuile[data-numero="11"] {
 background-color: #CCA956;
 color: #000; 
}

.tuile[data-numero="12"] {
 background-color: #EDB826;
 color: #000;
}

.tuile[data-numero="13"] {
 background-color: #E7C86D;
 color: #000;
}

.tuile[data-numero="14"] {
 background-color: #EFD679;
 color: #000;
}

.tuile[data-numero="15"] {
 background-color: #F4E695;
 color: #000;
}

#message-taquin {
 z-index: 20;
 background-color: #000000;
 opacity: 0.8;
 border: 2px solid #ccc;
 color: #ddd;
 border-radius: 10px;
 padding: 40px;
}

#message-taquin .close-button span {
 color: #ddd;
}

#message-taquin .close-button span:hover {
 color: #fff;
}

@media screen and (min-width: 620px) {
  .tuile {
	  font-size: 0.9rem;
	  line-height: 1.2em;
	  padding: 0.5em; 
  }
}

@media screen and (max-width: 799px) {
  .k-header {
   position: sticky;
	  top: 0px;
  }
}

@media screen and (max-width: 360px) {
  .prestation-tuile {
    display: none;
  }
}