:root {
     --color-primary: #c2e8ff;
     --color-secondary: #393989;
     --container-width: 128rem;
     --font-light: "AntennaCond-Light",arial,helvetica,sans-serif;
     --font-medium: "AntennaCond-Medium",arial,helvetica,sans-serif;
     /* 62.5% of 16px base font size is 10px */
     font-size: 62.5%;
     font-family: var(--font-light);
   }
 
   body {
      color: var(--color-secondary);
      background-color: var(--color-primary);
   }
 
   * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
 
    /* Navigation Menu styles */
    .mainNav {
      top: 0;
      height: 7vh;
      max-height: 7vh;
      left: 0;
      width: 100%;
      color: var(--color-primary);
      background-color: var(--color-secondary);
      z-index: 1000;
    }
 
    .mainNav-container {
      color: inherit;
      background-color: inherit;
      height: 7vh;
      max-height: 7vh;
      width: 100%;
      margin: 0 auto;
      display: flex;
      align-items: center;
      padding: 0 1.5rem;
      position: relative;
    }
 
    .mainNav-page {
        display: flex;
        flex-grow: 1;
    }
 
    .mainNav-page a {
        color: var(--color-primary);
        font-family: var(--font-medium);
        font-size: 2vh;
        text-decoration: none;
    } 
 
    .mainNav-page a:hover {
        color: #fff;
    }
       
    .mainNav-logo {
      height: 7vh;
      width: 100%;
      margin-right: 1.5rem;
      z-index: 0;
    }
 
    /* General styles */
    .page-container {
      padding: 6.23rem 2rem;
      width: calc(100% - 2rem);
      max-width: var(--container-width);
      margin-left: auto;
      margin-right: auto;
      margin-top: 4rem;
    }
 
    .page-header {
        display: block;
        position: relative;
        background: #fff;
        border-radius: 50%;
        padding: 3rem;
        max-width: 20rem;
        max-height: 20rem;
        margin: auto;

	strong {
		font-size: 3rem;
		text-align: center;
	}
    }
    
    .page-container_image {
        display: block;
        margin: auto;
    }
 
    .page-container__header h1, p {
      color: var(--color-secondary);
      text-align: center;
    }
 
    .page-container__header h1 {
      font-family: var(--font-medium);
	font-size: 5rem;
     }
 
    .page-container__header p {
      font-size: 2.1rem;
      text-align: center;
    }
 
    .page-container__body {
      margin-top: 4.85rem;
      width: 100%;
      display: block;
      gap: 3.7rem;
    }
  
    .page-image_banner {
    	display: block;
    	position: absolute;
    	top: 7rem;
    	max-height: 50vh;
    	max-width: 70vw; 
    	margin: 0 auto;
    	left: 5rem;
    	right: 5rem;
    }
    
    .page-image_banner div {    
        position: relative;
        margin-top: 10rem;
        background: #fff;
        padding: 2rem;
        border-radius: 50%;
        width: 30rem;
        margin-left: auto;
        margin-right: auto;
    	margin-bottom: 15rem;
     }
	
    .page-image__container {
      position: relative;
      max-width: 45.2rem;
      max-height: 37.6rem;
      margin: 0 auto;
    }
 
    .page-container__body .page-image img {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
 
    .page-content {
      padding: 2rem;
    }
 
    .page-content .page-content__description ul, p {
      font-family: var(--font-medium);
      font-size: 2.5rem;
      line-height: 4rem;
      margin-bottom: 1rem;
      font-weight: lighter;
      letter-spacing: 0;
      text-align: center;
    }

.page-content .page-content__description h2 {
      font-family: var(--font-medium);
      font-size: 2.3rem;
      line-height: 4rem;
      font-weight: lighter;
      letter-spacing: 0;
      text-align: center;
    }

.page-content .page-content__description h3 {
      font-family: var(--font-medium);
      font-size: 2rem;
      line-height: 4rem;
      font-weight: lighter;
      letter-spacing: 0;
      text-align: center;
    }
  
    .page-content .page-content__page-notice {
      text-align: left;
    }
 
    .page-content .page-content__page-notice strong {
      font-size: 2rem;
      line-height: 3.3rem;
      color: #1473e6;
      font-style: normal;
      font-weight: normal;
    }
 
    .page-footer {
        position: fixed;
        bottom: 0;
        background-color: var(--color-secondary);
        width: 100%;

	p {
	   line-height: 2.5rem;
	}
    }
 
    .page-footer p {
        color: var(--color-primary);
        font-family: var(--font-medium);
        font-size: 1.5rem;
    }

    .page-content_buttons {
        display: inline-flex;
        justify-content: center;
        width: 100%;
    }

    .page-content_buttons button {
        max-width: 10rem;
        margin: 1rem;
        padding: 2px;
    }
 
    @media (max-width: 200px) { 
	.mainNav {
    	    height: 9vh;
            max-height: 9vh;
    	}
    	.mainNav-container {
	    height: 9vh;
            max-height: 9vh;  	
    	}	

  	.page-container__header h1 {
  	  font-size: 2vh;
    	}
    
    	.page-container__body {
	  margin-top: 10vh;
      	}

      .price-list_group p {
	  font-size: 2.5vh;
      }

      .page-container {
	padding-inline: 9.7rem;
      }

      .page-header h1 {
	font-size: 3rem;
      }

      .page-container__body {
	gap: 7.7rem;
      }

      .page-content {
	padding: 1rem 6.6rem 4rem 6.6rem;
      }

      .page-content .page-content__page-notice strong {
	font-size: 2.5vh;
      }

	.page-header {
	    margin-top: 5rem;
	}

      .page-image_banner {	  
	// max-height: 25vw;
	  height: 45rem;
	 // max-width: 60vw;
	  width: 95rem;
	  margin: 0 auto;
	  left: 0;
	  top: auto;
	  right: 0;
      }
    }

    @media (max-width: 576px) {
    	.mainNav {
    	    height: 9vh;
            max-height: 9vh;
    	}
    	.mainNav-container {
	    height: 9vh;
            max-height: 9vh;  	
    	}
    	
        .page-container__header h1 {
        	font-size: 2vh;
    	}
    	
       .page-container__body {
      	  	margin-top: 10vh;
        }
      
        .price-list_group p {
      	  	font-size: 2vh;
      	  	margin-bottom: 0;
         }
               
        .page-container {
      		padding-inline: 9.7rem;
        }
      
       .page-header h1 {
      		font-size: 5rem;
        }
      
       .page-container__body {
      		gap: 7.7rem;
        }
      
        .page-content {
      		padding: 1rem 6.6rem 4rem 6.6rem;
        }
      
        .page-content .page-content__page-notice strong {
      		font-size: 2.5rem;
         }
      
      	.page-header {
      	    margin-top: 5rem;
	}
      
      .page-image_banner {
        // max-height: 25vw;
	  height: 45rem;
	 // max-width: 60vw;
	  width: 95rem;
	  margin: 0 auto;
	  left: 0;
	  top: auto;
	  right: 0;
      }
    }

    @media (max-width: 1920px) {
    	.mainNav {
	    height: 7vh;
	    max-height: 7vh;
	}
	.mainNav-container {
	    height: 7vh;
	    max-height: 7vh;  	
    	}
    	
    	.page-container__header h1 {
	   font-size: 5rem;
    	}
    
      .page-container__body {
          margin-top: 25vh;
      }
      
      .price-list_group p {
      	  font-size: 3.5vh;
      }
      
      .page-container {
        padding-inline: 9.7rem;
      }
 
      .page-header h1 {
      	font-size: 5rem;
      }
 
      .page-container__body {
        gap: 7.7rem;
      }
 
      .page-content {
        padding: 1rem 6.6rem 4rem 6.6rem;
      }
 
      .page-content .page-content__page-notice strong {
        font-size: 2.5rem;
      }
              
       	.page-header {
       	    margin-top: 5rem;
	}
       
      .page-image_banner {
	 // max-height: 25vw;
	  height: 45rem;
	 // max-width: 60vw;
	  width: 95rem;
	  margin: 0 auto;
	  left: 0;
	  top: auto;
	  right: 0;
      }
    }
	
    /* Gallery Page Styles */
    .gallery-image {
	margin: 1px;
	height: 20rem;
	width: 27rem;
    }


    /* Price Page Styles */
    .appointment-form, .price-calculator {
        display: none;
        text-align: center;
    }

    .appointment-form input {
        min-height: 2rem;
        min-width: 10rem;
        border-radius: 1rem;
        padding: 0.5rem;
    }

    .appointment-form p, .price-calculator p {
        display: inline-block;
        font-size: 2rem;
        margin-right: 1rem;
    }

    .form-button {
        padding: 0.5rem;
    }

    .form-button:hover {
        color: #ff0000;
    }

    .appointment-form select, .price-calculator select {
        background-color: #fff;
        display: inline-block;
        min-width: 10rem;
        min-height: 3rem;
        border-radius: 1rem;
        padding: 0.5rem;
    }

    .price-header {
      color: var(--color-secondary);
      text-align: center;
      margin-bottom: 2rem;
    }

    .price-list {
	flex-direction: column;
    	display: flex;
	 align-items: center;
    }

    .price-list_description {
    	font-size: 2vh;
    	margin-bottom: 2vh;
    }

    .price-list:hover p {
        cursor: default;
    }

    .price-list:hover p .price-list_description {
        display: block;
    }

    .price-list_group {
        display: inline-flex;
    }

     .price-list_group p {
        margin-right:  1rem;
    }

    /* Contact Page Styles */
    .contact-form {
        padding: 0rem;
        align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        font-size: 1.5rem;
    }
 
    .contact-form h1 {
        text-align: center;
    }
 
    .contact-form_control {
        display: flex;
        flex-grow: 2;
        flex-shrink: 1;
    }
 
    .contact-form_label {
        display: flex;
        flex-grow: 1;
        flex-shrink: 2;
    }
 
    .contact-form_group {
        display: inline-flex;
        margin-bottom: 1.5rem;
        min-width: 500px;
    }
 
    #map {
        height: 400px; /* The height is 400 pixels */
        width: 100%; /* The width is the width of the web page */
    }