Template:Portal flex/styles.css

/**Portalpage with flex EN ****/
.flexbox-portal {display: flex; flex-wrap: wrap; justify-content:space-between;}
.flexbox-portal > div {flex:1; padding:10px 20px 20px 20px}
.flexbox-portal > div img  {max-width:100%; height:auto;}
.flexbox-portal.col2 > div {flex-basis:47%; margin: 0 15px 15px 0;}
.flexbox-portal.col3 > div {flex-basis:31%; margin: 0 15px 15px 0;}
.flexbox-portal.fullfirst div:first-child {flex-basis:100%}
.flexbox-portal.fulllast div:last-child {flex-basis:100%}

.flexbox-portal.border.p-blue > div {border: 1px solid #95bff4;}
.flexbox-portal.border.p-green > div {border: 1px solid #c9e08f;}
.flexbox-portal.border.p-grey > div {border: 1px solid #d8d8d9;}
.flexbox-portal.border.p-orange > div {border: 1px solid #f8c57f;}
.flexbox-portal.border.p-purple > div {border: 1px solid #ca8dc0}
.flexbox-portal.border.p-red > div {border: 1px solid #dd8c8c;}
.flexbox-portal.border.p-yellow > div {border: 1px solid #fee17f;}
.flexbox-portal.border.p-white > div {border: 1px solid #d8d8d9}

div.flexbox-portal.border, .flexbox-portal.border > div.emptybox {border: none !important}

.flexbox-portal.background-hd.p-blue div > h2 {background: #c9dffa;}
.flexbox-portal.background-hd.p-green div > h2  {background: #e5f0c5;}
.flexbox-portal.background-hd.p-grey div > h2 {background:  #fdf0bd;}
.flexbox-portal.background-hd.p-orange div > h2 {background: #fce2be;}
.flexbox-portal.background-hd.p-purple div > h2 {background: #e0c2dd;}
.flexbox-portal.background-hd.p-red div > h2 {background: #ecc1c0;}
.flexbox-portal.background-hd.p-yellow div > h2 {background: #fdf0bd;}
.flexbox-portal.background-hd.p-white div > h2 {background: #f1f3f9;}


.flexbox-portal.background.p-blue > div {background: #dfecfc;}
.flexbox-portal.background.p-green > div {background: #eff6dd;}
.flexbox-portal.background.p-grey > div {background: #f1f3f9;}
.flexbox-portal.background.p-orange > div {background: #fdeed9;}
.flexbox-portal.background.p-purple > div {background: #e9d9e9;}
.flexbox-portal.background.p-red > div {background:  #f2d7d5;}
.flexbox-portal.background.p-yellow > div {background: #fef6d8;}
.flexbox-portal.background.p-white > div {background: #ffffff;}

.flexbox-portal > div.box.p-blue {background: #dfecfc;}
.flexbox-portal > div.box.p-green {background: #eff6dd;}
.flexbox-portal > div.box.p-grey {background: #f1f3f9}
.flexbox-portal > div.box.p-orange {background: #fdeed9;}
.flexbox-portal > div.box.p-purple {background: #e9d9e9;}
.flexbox-portal > div.box.p-red {background:  #f2d7d5;}
.flexbox-portal > div.box.p-yellow {background: #fef6d8;}
.flexbox-portal > div.box.p-white  {background: #ffffff;}

.flexbox-portal.background  div.emptybox {background: none}
.flexbox-portal div > h2 {font-size: 1.1em; border-bottom: none;margin-top: 0; margin-bottom: 0; padding: 10px 10px 10px 0; font-weight: bold;}
.flexbox-portal.underline-hd div > h2 {border-bottom:1px solid 	#747474; padding-left:0;}
.flexbox-portal.hide-hd div > h2 {display:none;}
.flexbox-portal h1 .mw-editsection, .flexbox-portal h2 .mw-editsection, .flexbox-portal h3 .mw-editsection, .flexbox-portal h4 .mw-editsection, .flexbox-portal h5 .mw-editsection, .flexbox-portal h6 .mw-editsection
{display:none;}
.mw-parser-output .bs-layout-container.intro-text {font-size: 1.2em;}
h3 {font-size: 1.6em;}
.ve-ce-surface-enabled .ve-ce-branchNode-blockSlug {visibility: hidden;display: none;}
.thumbborder {border: 1px solid #e5e5e5;}
@media only screen and (max-width: 768px) { .flexbox-portal > div {width: 98%;}}
/**Formular **/
#pfForm section.ve-ce-branchNode a img {max-width:100% !important; height:auto !important;}/**im Formular **/
.formtable th {text-align:right; padding:10px; background:#efefef; font-weight:normal;}
.formtable td {padding:10px;}
.bs-mwvisualeditor-field-container {max-width:850px;}
.bs-mwvisualeditor-field-container img {max-width:100%; height:auto;}

@media only screen and (max-width: 768px) {.flexbox-portal, .flexbox-portal.col2, .flexbox-portal.col3 > div {flex-basis: 98%;}}
/**Formular **/
#pfForm section.ve-ce-branchNode a img {max-width:100% !important; height:auto !important;}/**im Formular **/
.formtable th {text-align:right; padding:10px; background:#efefef; font-weight:normal;}
.formtable td {padding:10px;}
.bs-mwvisualeditor-field-container {max-width:850px;}
.bs-mwvisualeditor-field-container img {max-width:100%; height:auto;}

.bi::before, [class^="bi-"]::before, [class*=" bi-"]::before { display: inline-block;font-family: bootstrap-icons !important;line-height: 1;margin-right:0.3em;vertical-align: -0.125em;}