/******************************
*** Default for full-screen ***
******************************/

html, body {
   margin: 1;
   padding: 1;
   overflow: hidden; /* Prevents scrollbars if content overflows */
}

body { /* background image */
   background-image: url('Pinto t75.png');
   background-position: center;
   background-repeat: no-repeat; /* Prevents image repetition */
   background-attachment: fixed; /* Fixes the background image during scrolling */
   background-size: contain;
}

h1 { /* the title */
   font-family: "Arial Rounded MT Bold";
   font-size: 3em;
   margin: 0;
   padding: 0;
}

#spicy { /* the word "Spicy" */
   color: red;
   font-style: italic;
}

h2 { /* the phone number */
   font-family: "Arial Rounded MT Bold";
   font-size: 3em;
   margin: 0;
   padding: 0;
}


h1, h2, p { /* Optional: Styling for your content to ensure readability over the background */
   color: black; /* Or any other color that contrasts with your background */
   text-align: center;
   margin: 1;
}

#content { /* the text */
   width: fit-content;
   font-family: "Arial Rounded MT Bold";
   font-size: 1.5em;
   margin: 0 auto;
}

#cost {
   font-size: 1em;
   color: blue;
   font-style: italic;
}

footer { /* copywrite */
   position: fixed;
   bottom: 0;
   width: 100%;
}

/*******************************
*** Changes for Mobile Phone ***
*******************************/
@media only screen and (max-width: 600px) {
   html, body  { overflow:  auto;  }
   h1          { font-size: 1.5em; }
   h2          { font-size: 1.5em; }
   #content    { font-size: 1em;   }
   #cost       { font-size: 1em;   }
   footer      { font-size: 0.8em; }
   #content br { display: none;    }
   }