body  {
    padding:    5em;
    color:      #111;
    width:      55em;
}

h1  {
    color:    #0f0;
}


    .symbol::after {
      content: "\10900";
      font-size: 24px;
      color: #333;
    }

     .pha::after {
      content: "\10900";
      font-size: 24px;
      color: #333;
    }
    .phb::after {
      content: "\10901";
      font-size: 24px;
      color: #333;
    }

    .phg::after {
      content: "\10902";
      font-size: 24px;
      color: #333;
    }
    .phd::after {
      content: "\10903";
      font-size: 24px;
      color: #333;
    }
    .phh::after {
      content: "\10904";
      font-size: 24px;
      color: #333;
    }
    .phw::after {
      content: "\10905";
      font-size: 24px;
      color: #333;
    }

    .phz::after {
      content: "\10906";
      font-size: 24px;
      color: #333;
    }
    .phhh::after {
      content: "\10907";
      font-size: 24px;
      color: #333;
    }



    .phth::after {
      content: "\10908";
      font-size: 24px;
      color: #333;
    }
    .phy::after {
      content: "\10909";
      font-size: 24px;
      color: #333;
    }

    .phk::after {
      content: "\1090a";
      font-size: 24px;
      color: #333;
    }

    
    .phl::after {
      content: "\1090b";
      font-size: 24px;
      color: #333;
    }
    .phm::after {
      content: "\1090c";
      font-size: 24px;
      color: #333;
    }
    .phn::after {
      content: "\1090d";
      font-size: 24px;
      color: #333;
    }

    .phs::after {
      content: "\1090e";
      font-size: 24px;
      color: #333;
    }
    
    .pho::after {
      content: "\1090f";
      font-size: 24px;
      color: #333;
    }



    .php::after {
      content: "\10910";
      font-size: 24px;
      color: #333;
    }
    .phss::after {
      content: "\10911";
      font-size: 24px;
      color: #333;
    }
    .phq::after {
      content: "\10912";
      font-size: 24px;
      color: #333;
    }


    .phr::after {
      content: "\10913";
      font-size: 24px;
      color: #333;
    }
    .phsh::after {
      content: "\10914";
      font-size: 24px;
      color: #333;
    }
    .pht::after {
      content: "\10915";
      font-size: 24px;
      color: #333;
    }


    
    
    /* You can also use ::before */
    .prefix-symbol::before {
      content: "\10900 ";  /* Note the space after the character */
    }
    
    /* Or insert characters on both sides */
    .surrounded::before {
      content: "\10900 ";
    }
    .surrounded::after {
      content: " \10900";
    }

        .rotate-90 {
      transform: rotate(90deg);
    }


	
	
.sun {
    background-color:   #ffc;
    padding:             2em;
    width:              13em;
    border-radius:       2em;
    font-size:          200%;
    border:            solid;
}


		
	
.linkz {
    background-color:   #ddd;
    padding:             2em;
    width:              34em;
    border-radius:       2em;
		border:            solid;
}

.fedi {
    background-color:   #bbb;
    padding:             2em;
    width:              34em;
    border-radius:       2em;    
    border:            solid;
}


        .form-group {
            margin-bottom: 15px;
        }
        
        label {
            display: block;
            margin-bottom: 5px;
            font-weight: bold;
        }
        
        input[type="text"] {
            width: 100%;
            padding: 8px;
            border: 1px solid #ddd;
            border-radius: 4px;
            font-size: 14px;
        }
        
        button {
            background-color: #007cba;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-size: 14px;
        }
        
        button:hover {
            background-color: #005a87;
        }
        
        pre {
            background-color: #f4f4f4;
            padding: 15px;
            border-radius: 4px;
            border: 1px solid #ddd;
            overflow-x: auto;
            white-space: pre-wrap;
        }
        
        .output-section {
            margin-top: 20px;
        }


form  {
  border:  solid;
  padding:  1em;
}