火环/style.css

/*

* Only used for 火环
*/

.Tabs {

   border: 1px solid;
   background-color: #fff;

}

.TabLabelText {

   padding: 0 !important;
   opacity: 0.5;
   background: none !important;

}

.TabLabelText.selected {

   opacity: 1;
   border: 0 !important;

}

.TabContent {

   background: none !important;
   border: 0 !important;

}

.hh-character {

   display: flex;

}

.hh-character-text {

   background-size: cover;
   background-repeat: no-repeat;
   color: #fff;

}

.hh-character-h1 {

   font-size: 1.2em;
   border-bottom: 2px solid #fff;

}

.hh-character-h2 {

   font-size: 1.2em;
   text-align: right;

}

.hh-character-h2 a {

   color: #fff;

}

.hh-character-talk {

   color: #999;

}

@media (min-width: 577px) {

   .hh-character {
       align-items: stretch;
   }

   .hh-character-text {
       flex: 1 0 15em;
       max-width: 30em;
       background-image: url('https://img.moegirl.org.cn/common/7/70/Patternc90350.png');
       background-position: right;
       padding: 1em 4em 0 2em;
   }

   .hh-character > img {
       align-self: flex-end;
   }

}

@media (max-width: 576px) {

   .hh-character {
       flex-direction: column;
   }
   
   .hh-character-text {
       background-image: url('https://img.moegirl.org.cn/common/1/13/Pattern257.png');
       background-position: top;
       padding: 4em 1em 1em 1em;
       margin-top: -3em;
       order: 1;
   }

}