/*YT+ Green = #8fb847 */
/*YT+ Blue = #1ea0a2*/
/*YT+ Black = #231f20*/

@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:400&subset=latin,latin-ext);
/* Want Google Fonts to import display=swap so FF doesn’t render with a fallback font that has different metrics
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400&display=swap'); */

/* Base Styles */
/* html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } *//* &&&Normalize vertical rhythm */

html, body {
    margin: 0;
    padding: 0;
    font-family: 'Roboto Condensed', serif;
    min-height: 100vh;
}

body {
    display: flex;
    flex-direction: column;
}

/* &&&consistent baseline */
/*body { line-height: 1; }
*, *::before, *::after { box-sizing: border-box; }*/

/* &&&Reusable spacing token */
/*:root {
  --vpad: clamp(10px, 1.8vw, 20px); *//* adjusts per viewport */
}

/* Layout Containers */
.main-wrapper {
    flex: 1;
    width: 100%;
    position: relative;
}

.body__content,
.body__content_mile,
.body__content_expo,
.body__content_shop,
.courses_container,
.register_container,
.login_container,
.my_page_container {
    margin-top: 175px;
    width: 100%;
    padding-bottom: 50px;
    position: relative;
}

/* Specific Page Backgrounds */
.body__content {
    background: url("/images/landing_bg.jpg") no-repeat fixed center;
    background-size: 100%;
}

.register2{
         border:#666666 solid 2px;
         font-size:2vw;
         border-radius: 5vw 0 5vw 0;
         background-color:#ffffff;
         width:50vw;
         padding:5vw;
         margin-left:25vw;
         margin-top:5vh;
  }
  
  .courses_container{
      position:relative;
      margin:0 2.5vw;
      background-color:#ffffff;
      background:none;
      z-index:0;
      top:180px;
      width:95vw;
      min-height: calc(100vh - 180px);
      padding-bottom: 50px;
  }
  
  .new_container{
              position:absolute;
              background:url("/images/login_bg.jpg") no-repeat fixed center;
              background-size:110%;
              margin:0;
              background-color:#ffffff;
              z-index:0;
              top:160px;
              width:100vw;
              height:75vh;
          }
          
          .register_container{
              position:relative;
              margin:0;
              background-color:#1ea0a2;
              z-index:0;
              top:160px;
              width:100vw;
              min-height: calc(100vh - 160px);
              padding-bottom: 50px;
          }

.body__content_expo{
    margin-top:200px;
    padding:0 5vw 0 5vw;
    z-index:0;
}

.body__content_shop{
    margin-top:130px;
    background-color:#ffffff;
    z-index:0;
}

.body__content_mile{
    margin-top:200px;
    padding:0 5vw 0 5vw;
    background:white;
    z-index:0;
}

.cancel_container{
              position:absolute;
              /*background-size:110%;*/
              margin:0;
              background-color:#1ea0a2;
              z-index:0;
              top:130px;
              width:100vw;
              bottom:0;
}
          
          .cancel_text{
              border:5px solid #231f20;
              border-radius:5vw;
              width:50vw;
              font-size:2vw;
              height:10vw;
              background-color:#ffffff;
              color:#8fb847;
              margin-left:25vw;
              margin-top:200px;
              text-align:center;
              padding:20px;
          }


.credits_container{
    border-radius:20px;
    border: 5px solid #1ea0a2;
}

/*
.learn_row{
    display: flex;
    flex-wrap: wrap;
    position: relative;
   align-items: center;
  justify-content: center;
}

.learn_container{
    position:absolute;
    top:175px;
    left:0;

}

.learning_header{
    font: 18px 'Nunito', serif;
    text-align: center;
}
*/
       .table_container1{
                background-image:url("/images/yt10credits.png");
                border: 5px solid #454545;
                border-radius:25px;
            }
            
            .table_container1:hover{
                transform: scale(1.25);
                transition: 0.5s ease-in-out;
            }
            
            .table_container2{
                background-image:url("/images/yt30credits.png");
                border: 5px solid #454545;
                border-radius:25px;
            }
            
            .table_container2:hover{
                transform: scale(1.25);
                transition: 0.5s ease-in-out;
            }
            
            .table_container3{
                background-image:url("/images/yt50credits.png");
                border: 5px solid #454545;
                border-radius:25px;
            }
            
            .table_container3:hover{
                transform: scale(1.25);
                transition: 0.5s ease-in-out;
            }


.main_page_text1{
    color:#ffffff;
    font-weight:900;
    font-family:'Roboto Condensed', serif;
    font-size:3.6vw; 
    text-shadow: 1px 1px 2px black, 0 0 25px #4c9ea1, 0 0 5px darkblue;
}

.main_page_text2{
    color:#ffffff;
    font-weight:900;
    font-family:'Roboto Condensed', serif;
    font-size:2vw; 
    text-shadow: 1px 1px 2px black, 0 0 25px #4c9ea1, 0 0 5px darkblue;
}

.main_page_text3{
    color:#ffffff;
    font-weight:900;
    font-family:'Roboto Condensed', serif;
    font-size:2.8vw; 
    text-shadow: 1px 1px 2px black, 0 0 25px #4c9ea1, 0 0 5px darkblue;
}

.bright-orange{
    /*color: #e04941;*/
    /*color: #e06d4d;*/
    color: #e05422;
    font-weight:900;
    font-family:'Roboto Condensed', serif;
    font-size:3.5vw; 
    text-shadow: 1px 1px 2px black, 0 0 25px #4c9ea1, 0 0 5px yellow;
}

.yfont{
    color:#4c9ea1;
    font-family:'Roboto Condensed', serif;
    font-weight:900;
    font-size:5vw;
    text-shadow: 1px 1px 2px #000000, 0 0 25px #ffffff, 0 0 5px #4c9ea1;
}

.tfont{
    color:#231f20;
    font-weight:900;
    font-size:5vw;
    font-family:'Roboto Condensed', serif;
    text-shadow: 1px 1px 2px #000000, 0 0 25px #ffffff, 0 0 5px #4c9ea1;
}

.imgSet{
    width:94vw;
}

a {
    text-decoration:none;
/*    font-family:'Roboto Condensed', serif;
    font-size:2em;
    color: #555;*/
}

/* * { box-sizing: border-box; }*/


  
  .whitediv{
      position:fixed;
      top:0;
      height:50px;
      width:100%;
      z-index:4;
      background-color:white;
  }
  
  nav {
    height:130px;
    background-color: #ffffff;
    color: #231f20;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    margin-top:0;
    z-index:5;
    position:fixed;
    width:100%;
  }
  
    /*********************/
  /*This styles the logo for computer screen sizes*/
.logo1 {
        top:10px;
        z-index:10;
        position:fixed;
        left:30px;
        max-width:200px;
    }
    /*********************/
   /*.logo {
    font-size: 1.5rem;
  }*/
  
  ul {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    z-index:3;
  }
  
  ul li {
    margin-right: 50px;
  }
  
  ul li a {
    color: white;
    text-decoration: none;
    transition: color 0.3s;
    font-family:"Roboto Condensed",serif;
    font-size:10px;
  }
  
  ul li a:hover {
    color: #1ea0a2;
  }
  
  .checkbtn {
    font-size: 30px;
    color: white;
    cursor: pointer;
    display: none;
  }
  
  #check {
    display: none;
  }
  
  /******************/
    .login{
        color: #565656;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
        margin: 25px 25px;
        background-color:#f2f2f2;
        border-radius:15px;
        font-size:20px;
        border: 2px solid #1ea0a2;
    }
    
    .login:hover{
        color:white;
         background-color:#1ea0a2;
         border:2px solid #333333;
    }
    
    .navmenu{
        font-size:1.5vw;
        font-family: 'Roboto Condensed', serif;
        color:#231f20;
    }
    
    .register{
        background-color:#565656;
        padding: 14px 16px;
        margin: 25px 25px;
        border-radius:15px;
        font-size:20px;
        border: 2px solid #565656;
    }
    .register:hover{
        background:white;
    }
    
    .login_container {
        position: relative;
        margin-top: 175px;
        width: 100%;
        z-index: 1; /* Higher than footer */
        min-height: calc(100vh - 225px);
        display: flex;
        flex-direction: column;
        background: url("images/login_bg.jpg") no-repeat fixed center;
    }

    .login_box {
        margin: 50px auto;
        width: 50vw;
        border: solid 1px #231f20;
        border-radius: 3vw 0 5vw 0;
        background-color: #ffffff;
        z-index: 1;
    }

    .footer {
        background-color: #231f20; /* Set to YT+ Black */
        color: #fff;
    }

    .footer-content {
        display: flex;
        justify-content: space-around;
        padding: 0 20px;
    }
    
    .footer-section {
        flex: 1;
        margin: 0 15px;
    }
    
    .footer-section h4 {
        color: #8fb847; /* YT+ Green */
        margin-bottom: 20px;
        font-family: 'Roboto Condensed', serif;
        font-size: 1.8em;
    }
    
    .footer-section ul {
        list-style: none;
        padding: 0;
    }
    
    .footer-section ul li {
        margin-bottom: 15px;
    }
    
    .footer-section a {
        color: #fff;
        text-decoration: none;
        font-family: 'Roboto Condensed', serif;
        transition: color 0.3s ease;
        font-size: 1.2em;
        letter-spacing: 0.5px;
    }
    
    .footer-section a:hover {
        color: #1ea0a2; /* YT+ Blue */
        text-decoration: underline;
    }
    
    .footer-section p {
        font-family: 'Roboto Condensed', serif;
        line-height: 1.6;
        font-size: 1.2em;
    }
    
    .footer-bottom {
        text-align: center;
        margin-top: 20px;
        padding-top: 20px;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    /* Responsive adjustments */
    @media screen and (max-width: 768px) {
        .footer-section {
            min-width: 100%;
            text-align: center;
            margin: 10px 0;
        }
        
        .footer-content {
            padding: 0 10px;
        }
    }
  
  
        .profile_container{
          position:absolute;
          top:175px;
          width:100vw;
        }
        
        .my_page_container {
            position: relative;
            margin-top: 175px;
            width: 100%;
            z-index: 1;
            min-height: calc(100vh - 225px);
            display: flex;
            flex-direction: column;
            background: #fff;
        }
            
        label {
            font-weight:bold;
            width:100px;
            font-size:2vw;
            font-family: 'Roboto Condensed', serif;
            color:#4d4d4d;
        }
        
        .box {
            border:#666666 solid 2px;
            font-size:2vw;
            border-radius: 7px 0 7px 0;
        }
  
          .login_contents{
              overflow:hidden;
              position:relative;
              margin:50px;
              height:40vh;
              width:100%;
          }
         
        .logintop{background-color:#231f20; color:#FFFFFF; padding:10px 10px 10px 20px; border-radius:3vw 0 0 0;font-family: 'Roboto Condensed', serif;font-size:3vw;
        }
         
         
         
        .main_home_button{
            border: 2px solid #ffffff;
            border-radius:2vw;
            padding:10px 20px 10px 20px;
            /*margin-left:50px;*/
            color:#ffffff;
            text-decoration:none;
            background-color:#1ea0a2;
            transition: 0.2s ease-in-out;
            font-size:4vw;
            font-family: 'Roboto Condensed', serif;
            cursor:pointer;
        }

        .main_home_button:hover {
            background-color: #8fb847;
            color: #231f20;
        }
        
        
        .main_home_button1{
            border: 2px solid #ffffff;
            border-radius:15px;
            padding:15px;
            /*margin-left:50px;*/
            color:#ffffff;
            text-decoration:none;
            background-color:#1ea0a2;
            transition: 0.2s ease-in-out;
            font-size:3vw;
            font-family: 'Roboto Condensed', serif;
            cursor:pointer;
        }

        .main_home_button1:hover {
            background-color: #8fb847;
            color: #231f20;
        }
    /******************/
  
    .footer-content {
        width: 100%;
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
        padding: 0 20px;
    }
    
    .footer-section {
        flex: 1;
        min-width: 250px;
        margin: 20px;
    }
    
    .footer-section h4 {
        color: #8fb847; /* YT+ Green */
        margin-bottom: 20px;
        font-family: 'Roboto Condensed', serif;
        font-size: 1.8em;
    }
    
    .footer-section ul {
        list-style: none;
        padding: 0;
    }
    
    .footer-section ul li {
        margin-bottom: 15px;
    }
    
    .footer-section a {
        color: #fff;
        text-decoration: none;
        font-family: 'Roboto Condensed', serif;
        transition: color 0.3s ease;
        font-size: 1.2em;
        letter-spacing: 0.5px;
    }
    
    .footer-section a:hover {
        color: #1ea0a2; /* YT+ Blue */
        text-decoration: underline;
    }
    
    .footer-section p {
        font-family: 'Roboto Condensed', serif;
        line-height: 1.6;
        font-size: 1.2em;
    }
    
    .footer-bottom {
        text-align: center;
        margin-top: 40px;
        padding-top: 20px;
        border-top: 1px solid rgba(255,255,255,0.1);
        font-family: 'Roboto Condensed', serif;
        font-size: 1.1em;
    }

    /* Responsive adjustments */
    @media screen and (max-width: 768px) {
        .footer-section {
            min-width: 100%;
            text-align: center;
            margin: 10px 0;
        }
        
        .footer-content {
            padding: 0 10px;
        }
    }
  
  
        .profile_draw{
    	    width:10vw;
    	    height:10vw;
    	    right:10vw;
    	    float:right;
    	    position:relative;
    	    top:0;
    	    z-index:2;
    	    cursor: pointer;
	    }
	    
	    #profileid{
	        fill:#231f20;
	        enable-background:new 0 0 50 50;
	    }
	    #profileid:hover{
	        fill:#ffffff;
	    }
	       #profileid2{
	        fill:#231f20;
	        enable-background:new 0 0 50 50;
	    }
	    #profileid2:hover{
	        fill:#1ea0a2;
	    } 

	    .profile_class{
            background-color: #8fb847;
            color: #444;
            width: 80%;
            min-height:8vw;
            border: none;
            text-align: left;
            outline: none;
            transition: 0.4s;
            position:relative;
            left:10vw;
            font-size: 2.5vw;
            font-weight: 900;
            border-radius:15px;
            margin-bottom:10px;
            /* &&&For areas that looked tight in FF */
            /*padding: var(--vpad);
            display: flex;
            align-items: center;
            line-height: 1.2;*/
	    }
  
  .profile_interior{
      margin-top:5vh;
      width:45vw; 
      border: solid 1px #333333; 
      border-radius:3vw 0 3vw 0; 
      background-color:#ffffff; 
      margin-bottom:15vh;
  }
  
  img {
  max-width: 100%;
  height: auto;
}
  
  
  
  
  
  
  
  
  /* Style the buttons that are used to open and close the accordion panel */
.accordion {
  background-color: #1ea0a2;
  color: #ffffff;
  cursor: pointer;
  padding: 18px;
  width: 70vw;
  margin-left:15vw;
  margin-top: 10px;
  text-align: left;
  outline: none;
  transition: 0.4s;
  border:3px solid #231f20;
  border-radius: 5vw;
  font-weight:900;
  font-size: 1.1em; /* Conform to headings */
  /* &&& Don't let things get out of hand */
  /*line-height: 1.2;
  padding-block: var(--vpad);*/
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active2, .accordion:hover {
  background-color: #8fb847;
  /*background-color: red;*/
  color:#231f20;
}

/* Adjust the fonts on my_page */


/* Style the accordion panel. Note: hidden by default */
.panel {
  border-radius: 0 0 2vw 2vw;
  padding: 0 18px;
  background-color: #4d4d4d;
  max-height: 0;
  width:62vw;
  margin-left:17.5vw;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  font-size:1.5vw;
  text-decoration:none;
  color:white;
}
  
  .product{
      color:white;
  }
  
  
.accordion:after {
  content: '\02795'; /* Unicode character for "plus" sign (+) */
  font-size: 13px;
  color: #777;
  float: right;
  margin-left: 5px;
}

.active2:after {
  content: "\2796"; /* Unicode character for "minus" sign (-) */
}
  
  
  .notin{
      font-family: 'Roboto Condensed', serif;
      font-size:3vw;
  }
  
  .notin2{
      font-family: 'Roboto Condensed', serif;
      font-size:2vw;
  }
  
  .overlay_div{
      position:absolute;
      top:30vh;
      left:25vw;
      background-color:#d4d4d4dd;
      padding:5vw;
      z-index:501;
      width:50vw;
      height:50vh;
      border-radius:5vw;
  }
  
  .overlay_font{
      font-family:'Roboto Condensed', serif;
      font-size:2.5vw;
      background-color:#ffffff;
      padding:2vw;
      border-radius:3vw;
  }
  
  
  .arow{
      display:flex;
      flex-wrap:wrap;
  }
  
  .frow{
      display:flex;
      flex-wrap:wrap;
      padding-top:30px;
  }
  .fleft{
      flex:50%;
      padding-bottom:25px;
  }
  .fright{
      flex:50%;
      padding-bottom:25px;
  }
  
    .srow{
      display:flex;
      flex-wrap:wrap;
      margin-top:0px;
  }
  .sleft{
      flex:30%;
      
  }
  
  .smiddle{
      flex:30%;
  }
  
  .sright{
      flex:30%;
      
  }
  
  
    .erow{
      display:flex;
      flex-wrap:wrap;
      margin-top:0px;
    }
    .eleft{
      flex:50%;
    }
    .eright{
      flex:50%;
    }
  
  
  .big_blue{
      color:#1ea0a2;
      font-weight:900;
      font-size:50px;
  }
  
  .small_green{
      color: #8fb847;
      font-weight:normal;
      font-size:15px;
  }
  
  .big_green{
      color: #8fb847;
      font-weight:600;
      font-size:25px;
  }
  
  .lil_blue{
      color: #1ea0a2;
      font-size:25px;
      font-weight:600;
  }
  
  .lil_black{
      color: #231f20;
      font-size:25px;
      font-weight:600;
  }
  
  
  .expo_big{
      color: #8fb847; font-weight:800; font-size:5vw;
  }
  
  
  .aCourses{
            
            color:#1ea0a2;
            text-decoration:none;
            transition: 0.2s ease-in-out;
            font-size:2.5vw;
            cursor:pointer;
        }

        .aCourses:hover {
            color: #231f20;
        }
        
  .credits_class{
      position:relative;
      top:2.5vw;
      left:20px;
      text-decoration:none;
      color:#231f20;
      font-size:3vw;
      border: 2px solid #231f20;
      padding:10px;
      border-radius:10px;
  }      

    .credits_class:hover{
      background-color:#231f20;  
      color:#1ea0a2;
    }
        
  
  
    .crow{
      display:flex;
      flex-wrap:wrap;
      /*padding-top:30px;*/
  }
  .cleft1{
      flex:10%;
      padding-left:15px;
  }
  .cleft2{
      flex:55%;
      padding-left:15px;
  }
  
  .courseButton{
      margin-left:15px;
      
            border: 2px solid #ffffff;
            border-radius:1.5vw;
            padding:10px 20px 10px 20px;
            color:#ffffff;
            text-decoration:none;
            background-color:#1ea0a2;
            transition: 0.2s ease-in-out;
            font-size:1vw;
            
            cursor:pointer;
  }
  .courseButton:hover{
      background-color: #8fb847;
            color: #231f20;
  }
  
  .courseInput{
      border:#666666 solid 2px;
            font-size:1.5vw;
            border-radius: 7px 0 7px 0;
  }
  .oldTime{
      border:#666666 solid 2px;
            font-size:1.5vw;
            border-radius: 7px 0 7px 0;
  }
  
  





  
        
  /******************************************************************/
  /* Change settings based on screen size                           */
  /******************************************************************/
  @media screen and (max-width: 768px) {

.bright-orange{
    
    font-size:7vw; 

}

  .fleft{
      
      padding-bottom:0px;
  }
  .fright{
   
      padding-bottom:0px;
  }
  
  .courseInput{font-size:4.5vw;}
  .courseButton{font-size:5vw;}
  .oldTime{font-size:4.5vw;}
  
  .accordion{
      width: 90vw;
      margin-left: 5vw;
  }
  
  .panel{
      width:70vw;
        margin-left:10vw;
        font-size:5vw;
  }
  
  .crow{
    flex-direction:column;  
  }
  
  
  .credits_class{
      top:20px;
      font-size:5vw;
  }
  
  .aCourses{
            font-size:9vw;

        }

  
  .expo_big{
      font-size:9vw;
  }
  
    .register2{
   
         font-size:4vw;
         width:75vw;
         padding:5vw;
         margin-left:7.5vw;
         margin-top:3vh;
  }

  .srow{
    flex-direction:column;  
  }
  
  .frow{
    flex-direction:column;  
  }
  
  .arow{
    flex-direction:column;  
  }
  
  .main_page_text1{
    font-size:5vw; 
    }

    .main_page_text2{
    font-size:4vw; 
    }

    .main_page_text3{
    font-size:5vw; 
    }

    .yfont{
        font-size:8vw;
    }

    .tfont{
    font-size:8vw;
    }
  
  
  
   ul li a {
    color: white;
    font-size:20px;
  }
  
  ul li a:hover {
    color: #ffffff;
    background-color:#231f20;
  }
  
  .navmenu{
        font-size:5vw;
        font-family: 'Roboto Condensed', serif;
        color:#231f20;
        background-color:white;
        padding:20px;
        border: 3px solid #231f20;
    }
  /*
    .footer{
     display:block;
    }*/
    
    .notin{
      font-family: 'Roboto Condensed', serif;
      font-size:6vw;
    }

.notin2{
      font-family: 'Roboto Condensed', serif;
      font-size:5vw;
  }

  .profile_interior{
      margin-top:-10vh;
      width:75vw; 
  }


    .profile_class{
        min-height:9vh;
    }
    
    #profileid{
        width:200%;
        height:200%;
    }
    
    #profileid2{
        width:200%;
        height:200%;
    }
    
    .login_contents{
      height:30vh;
      margin:10px;
    }
   
    .new_container{
      margin:0 2.5vw;
      background-color:#ffffff;
      background:none;
      z-index:0;
      top:120px;
      width:95vw;
      height:60vh;
  }
    
    .cancel_container{
        top:130px;
    }
    
    .checkbtn {
      display: block;
      order: 1;
      margin-right: 20px;
    }
  
    ul {
      position: fixed;
      top: 120px;
      /*right: -100%;*/
      left: -115%;
      background-color: #1ea0a2;
      width: 100%;
      /*height: 70vh;*/
      bottom: 80px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      transition: all 0.3s;
    }
  
    ul li {
      margin: 20px 0;
    }
  
    /*ul li a {
      font-size: 12px;
    }*/
  
    #check:checked ~ ul {
      /*right: 0;*/
      left:0;
    }
    
               label{font-size:3vw;}
            
            .login_box{top:175px; width:80vw; border-radius:3vw 0 5vw 0; margin-left:10vw;}
            
            .logintop{border-radius:3vw 0 0 0; font-size:5vw;}
            
            .box {
                border:#666666 solid 2px;
                font-size:3.5vw;
                width:75%;
            }
            
            .wavy_draw{
                display:none;
            }
            
            .footer_text{
                font-size:3vw;
            }
            
            .logo1{max-width:150px;}
            
            nav {
                height:65px;
                /*padding: 10px 20px;*/
                margin-top:35px;
                
              }
             
            .register_container{
                margin-top:-40px;
                padding-top: 50px;
                bottom:0;
            } 
             
            .body__content{
                top:120px;
                padding-top: 20px; 
                padding-right:0px;
            }
            
            .body__content_expo{
                margin-top: 150px;
                padding:0;
            }
            
            .box {
                /*display:none;*/
            }
}

/* This is done for the time input field on forms */
.time-input{
  box-sizing: border-box;   /* consistent sizing across browsers */
  width: 8ch;               /* ~7 character cells (MM:SS + a little room) */
  padding: 0.25rem 0.5rem;  /* optional: tighten padding if needed */
}

/* force is if the theme applies a big default width */
.time-input{ width: 8ch !important; }

/* Style text on my_page in conformance with size and placement with the accordian buttons */
.my_page_hdgs{
  width:66vw;
  margin-left:17vw;
  text-align: left;
  transition: 0.4s;
  font-size: 1.1em;
  /* &&&Don't let things get too crazy */
  /*line-height: 1.35;
  margin-block: clamp(12px, 2vw, 24px);*/
}

  .lilYP{
    font-weight: bold;
    color: #1ea0a2;
  }

  .lilT{
    font-weight: bold;
    color: black;
  }

  /*.output, .output2 { min-height: 1.2em; display: inline-block; }*/