* {
    margin: 0px;
}
body {
    background-color: #222;
    font-family: "Play", sans-serif;
}

.ad {
    border: solid 1px #a4ff2b;
}
.container {
 margin-top: 10px;
 overflow: hidden;
}

.space {
    margin-top: 5px;
    margin-bottom: 5px;
}
.contain {
    background: #333;
    padding: 4px;
    overflow: hidden;
}
.contain2 {
    background: #9bc;
}
.contain3 {
    margin: 10px;
}
.containred {
    background: rgba(140, 10, 20, 0.5);
    border: solid 1px #a00;
}

.boton {
    padding: 5px;
    color: #5af;
    background-color: #444;
    text-decoration: none;
    border: #777 solid 1px;
    box-sizing: border-box;
    clear: both;
    overflow: hidden;
    margin-top: 100px;
}

.subcontent {
    background-image: linear-gradient(#644, #222, #111, #000);
    font-family: Kode Mono;
}
.titlesubc {
    padding: 10px;
    color: #fff;
    font-size: 32px;
}
.textsubc {
    color: #fff;
    padding: 10px;
    font-size: 16px;
    margin-left: 10%;
    border-left: 1px solid #fa0;
}
.title-fr {
    font-size: 26px;
    color: #fff;
    font-family: Orbitron;
    padding: 25px;
    background-image: linear-gradient(to bottom right, #750, #705);
}
.titlenoticias {
    padding: 20px;
    font-size: 40px;
    text-align: center;
    font-family: Orbitron;
    color: #acf;
    text-shadow: #3af 1px 1px 15px;
}
.title {
    background-image: url("https://cppthc2.simdif.com/images/public/sd_69288c83bec8f.jpg?no_cache=1764269180");
    background-size: cover;
    background-position: 100%;
    padding: 50px 10px;
    font-size: 34px;
    text-align: center;
    color: #fff;
    text-shadow: 0px 0px 8px #f00;
    font-variant: small-caps;
    letter-spacing: 5px;
    box-shadow: 0px 0px 10px #c00;
}
.title2 {
    background: #222;
    padding: 50px 10px;
    font-size: 34px;
    text-align: center;
    color: #999;
    text-shadow: 0px 0px 8px #49e;
    font-variant: small-caps;
    letter-spacing: 5px;
    box-shadow: 0px 0px 10px #c00;
}
.title3 {
    background: #7cc;
    font-size: 22px;
    color: #000;
    padding: 10px;
    font-weight: bold;
}
.title5 {
    background: #111;
    padding: 50px 10px;
    font-size: 26px;
    text-align: center;
    color: #fff;
    text-shadow: 0px 0px 8px #c00;
    font-variant: small-caps;
    letter-spacing: 5px;
    box-shadow: 0px 0px 10px #c09;
}
.title4 {
    padding: 12px;
    background-image: linear-gradient(to bottom right, #efeffe, #223);
    font-size: 28px;
}
.titleblack {
    color: #000;
    padding: 6px 16px;
    font-size: 32px;
    margin-top: 20px;
}
.titlehsbc {
    font-size: 36px;
    color: #000;
    padding: 6px 16px;
    margin-top: 12px;
    border-left: solid 4px #b00;
}
.titulo {
    padding: 15px;
    color: #fff;
    background: #777;
    font-size: 22px;
}
.titlemisoworld {
    background-image: url("https://www.hsbc.com.mx/content/dam/hsbc/mx/images/Digital/img-hb-digital.sttl.jpg/jcr:content/renditions/cq5dam.web.490.1000.jpeg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 70px 20px;
    text-align: Center;
    font-size: 42px;
    color: #fff;
    text-shadow: 1px 1px 5px #000;
}
.text {
    border-left: solid 3px #000;
    margin-left: 30px;
    background: #fff;
    padding: 5px 20px;
}
.texthsbc {
    background: #c6d6ef;
    padding: 22px;
    border: solid 2px #000;
}

.alt {
    font-size: 10px;
    text-decoration: overline underline;
    letter-spacing: 2px;
}
.textkodemono {
    font-family: "kode mono", arial;
    
}
.textorbitron {
    font-family: Orbitron;
    
}

.textblue {
    background: #057;
    padding: 10px;
    margin-left: 10%;
    color: #fff;
}
.textmidl {
    text-align: center;
    padding: 12px;
    background: #fff;
    margin-left: 10%;
}
.textwhite {
    color: #000;
    padding: 8px 16px;
    line-height: 1.8;
}

.textdark {
    background: #5c6464;
    color: #d5ffbf;
    padding: 10px;
    
}
.msg {
    border: solid 1px #000;
    border-radius: 10px;
    background: #7f9;
    width: 80%;
    float: left;
    padding: 10px;
}
.msg2 {
    border: solid #000 1px;
    border-radius: 10px;
    background: #5bf;
    width: 80%;
    float: right;
    padding: 10px;
}

.redfirm {
    color: #ff153f;
    float: right;
    display: block;
}
.firm {
    padding: 5px 20px;
    float: right;
    color: #fab;
    width: 80%;
    margin-left: 0px;
    border-left: #000 3px solid;
    text-align: right;
    background-image: linear-gradient(#fafafa, #eee,  #444);
}
.firm2 {
    padding: 5px 20px;
    float: right;
    color: #abf;
    width: 80%;
    margin-left: 0px;
    border-left: #000 3px solid;
    text-align: right;
    background-image: linear-gradient(#fafafa, #eee #444);
    
}
.atencion{
    background: #171717;
    color: #742;
    padding: 8px;
    font-size: 12px;
    letter-spacing: 3px;
    border: solid 2px #742;
}
.menu {
padding: 14px 0px;
color: #7cc;
}
.menu span {
    display: none;
}
.menu:hover span {
    display: block;
    
}
.menu span a {
    background: #5c606e;
    color: #aaa;
    text-decoration: none;
    padding: 15px;
    display: block;
    border-bottom: solid 1px #b60;
}
.menu a {
    background: #800;
    text-decoration: none;
    margin-bottom: 1px;
    padding: 15px;
    border: solid 1px #f00;
    border-bottom: #400;
    color: #fff;
    display: block;
}
.menufotoflog {
    background: #444;
    box-sizing: border-box;
    overflow: hidden;
}
.menufotoflog a {
    text-decoration: none;
    color: #ddf;
    padding: 8px;
    display: in-line-block;
    border-left: solid 1px #05a;
    border-right: solid 1px #05a;
    float: right;
}
firm {
    text-align: right;
    padding: 5px;
    border-bottom: solid 1px #000;
    display: block;
    font-family: Edu QLD Hand;
    font-weight: bold;
    text-shadow: 1px 1px 1px #a00;
}

.pink {
    background: #502;
    border-bottom: solid 1px #f0a;
    border-top: solid 1px #f7d;
    margin-bottom: 10px;
    
}
.blue {
margin-top: 10px;
    background: #025;
    border-bottom: solid 1px #0af;
    border-top: solod 1px #0af;
}
.titletext {
    font-size: 22px;
    color: #fff;
    padding: 15px;
    border-bottom: solid 1px #fff;
    background: rgba(180, 180, 180, 0.5);
}
.content {
    background: rgba(250, 250, 250, 0.7);
    padding: 6px;
    margin-left: 50px;
    border-left: solid 2px #fff;
}

.link {
    background: #7af;
    padding: 20px;
    text-decoration: none;
    display: block;
    margin-bottom: 2px;
    color: #000;
    font-size: 22px;
}

.img {
    margin: auto;
    width: 100%;
}
.img2 {
    
    width: 70%;
}
.marqueeyellow {
    background: #000;
    color: #aa0;
}

footer {
    background-image: url("https://cppthc2.simdif.com/images/public/sd_69288e55b7420.jpg?no_cache=1764269180");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: Center;
    padding: 5px;
    border-top: #a90 solid 1px;
}
footer p {
    color: #000;
    padding: 20px;
    text-shadow: 1px 1px 0px #fff;
    text-align: center;
}




<style>
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24
}
</style>






.kode-mono-<uniquifier> {
  font-family: "Kode Mono", monospace;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.orbitron-<uniquifier> {
  font-family: "Orbitron", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


.kode-mono-<uniquifier> {
  font-family: "Kode Mono", monospace;
  font-optical-sizing: auto;
  font-weight: 22px;
  font-style: normal;
}


.edu-qld-hand-<uniquifier> {
  font-family: "Edu QLD Hand", cursive;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
