Css/Infobox.css

.pi-item-spacing {

 padding-bottom: 9px;
 padding-top: 9px;
 padding: 0;
 column-gap: 2px;
 margin: 2px;

}

.pi-border-color {

 border-color:#FBF7DC;

}

.portable-infobox {

 background-color: #A6E3E9;
 width: 28em;
 font-size: 95%;
 padding: 0.25em;
 border: 1px solid #FBF7DC;
 border-radius: 10px;
 clear: right;
 float: right;
 margin: 0 0 18px 18px;
 display: block;

}

.portable-infobox .pi-title {

 text-align: center;
 font-size: 20px;
 font-weight: bolder;
 font-family: inherit;
 color: black;

 background-color: #b0edf3;
    
 line-height: 1.25;
 height: auto;

 overflow: hidden;
 overflow-wrap: break-word;

 padding: 12px 9px;
 border: 1px solid #FBF7DC;
 border-radius: 10px;
 margin: 0;

 clear: left;
 display: block;

}

.resp-tabs{

 border: none;
 margin: auto;
 text-align: center;
 font-size: 13px;
 color: white;
 font-weight: 700;
 width: 100%;
 padding: 8px;
 display: block;
 line-height:1.5;
 overflow-wrap: break-word;

}

.tabcontainer {

 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 margin-top: 4px;
 margin-bottom: 8px;

}

.tabcontainer .tab.active {

 background-color: #4f9494 !important;
 background-image: -webkit-linear-gradient(top, #8fe0e7, #4f9494);
 background-image: -moz-linear-gradient(top, #8fe0e7, #4f9494);
 background-image: -ms-linear-gradient(top, #8fe0e7, #4f9494);
 background-image: -o-linear-gradient(top, #8fe0e7, #4f9494);
 background-image: linear-gradient(top, #8fe0e7, #4f9494);

}

.tabcontainer .tab {

 background-color: #b0edf3 !important;
 background-image: -webkit-linear-gradient(top, #b0edf3, #6fb1b1);
 background-image: -moz-linear-gradient(top, #b0edf3, #6fb1b1);
 background-image: -ms-linear-gradient(top, #b0edf3, #6fb1b1);
 background-image: -o-linear-gradient(top, #b0edf3, #6fb1b1);
 background-image: linear-gradient(top, #b0edf3, #6fb1b1);

 border: 2px solid #FBF7DC;
 border-radius: 5px;

 cursor: pointer;
 float: left;
 margin: 0 1px 2px;
 padding: 3px;
 text-align: center;
 white-space: nowrap;
 flex: 1 0 100%;
 min-width: fit-content;
 box-sizing: border-box;
 display: flex;
 justify-content: center;
 align-items: center;

}

.resp-tabs-list li:last-child {

 border: 2px solid #FBF7DC;

}

.tabcontainer .explain {

 text-decoration: none;
 float: none;

}

.pi-data {

 -webkit-box-orient: horizontal;
 -webkit-box-direction: normal;
 border-top-width: 1px;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 display: flex;
 flex-direction: row;
 overflow: hidden;
 border: none;

}

.portable-infobox .pi-data-label {

 border-radius: 10px 0px 0px 10px;
 background-color: #b0edf3;
 flex-basis: 160px;
 text-align: right;
 display: flex;
 justify-content: right;
 margin: 0px;
 overflow: hidden;
 border: 1px solid #FBF7DC;
 column-gap: 2px;
 font-size: 15px;
 line-height: 1.5;
 padding: 8px;

}

.portable-infobox .pi-data-value {

 border-radius: 0px 10px 10px 0px;
 flex-basis: 257px;
 max-height: 175px;
 overflow: auto;
 overflow-wrap: break-word;
 font-size: 15px;
 line-height: 1.5;
 border: 1px solid #FBF7DC;
 padding: 8px;

}