/* main.css */

html, body {height: 100%; color: black;}
body {margin: 0; padding: 0; min-height: 100%; min-width: 360px; position: relative;}
.container, .row {box-sizing: border-box;}
img {max-width: 100%;}
.image_cover {position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
.image_cover * {width: 100%; height: 100%; object-fit: cover;}
a, a:visited {color: #93422f; text-decoration: underline;}
a:hover {color: #6c757d;}

h1 {font-size: 40px; margin: 0 0 40px;}
h1 .subtitle {font-size: 24px; margin: 30px 0 0px;}
h1 span {display: block;}
h2 {margin: 0.5em 0 1.2em; color: #7b7f83;}
h3 {font-size: 24px; margin: 0 0 0.5em;}
h4 {font-weight: bold; color: #839259; text-align: center; font-size: 18px;}

.btn, a.btn {background: #839259; border-color: #839259; color: white; text-decoration: none;}

.nav a {color: black; font-weight: 500; font-size: 18px; color: black; text-decoration: none;}
.header {min-height: 60vh; padding: 80px 0 60px; position: relative;}
.about {padding-top: 30px; padding-bottom: 30px;}
.about img {border-radius: 20px; margin-bottom: 25px;}
.about h2 {margin: 0 0 20px;}
.massage h2 {text-align: center;}
.price {background: #f6f5f3; padding: 1px 0 20px; margin: 30px 0 0; text-align: center;}
.price h3 {text-align: center;}
.price table {margin: 20px auto 45px;}
.price table td {padding: 5px 20px; font-size: 20px; font-weight: bold;}
.contact {padding: 40px 0 60px;}
.contact h3 {margin-bottom: 1em;}
.contact img {border-radius: 20px;}
.footer {min-height: 30vh; font-size: 15px; padding: 40px 0;}
.footer, .footer a {color: #999999;}


/* responsive design */

@media only screen and (min-width: 992px) 
{
  .mobile {display: none;}
}
@media only screen and (max-width: 991px) 
{
  .desktop {display: none;}
  
  .header {height: auto; padding: 30px 0 45px; min-height: 0;}
  h1 span {display: inline;}
  .about h2 {text-align: center;}
}