/* EDITOR STYLE-DEFINITIONS - START */
/* ---------------------------- */
p {
    margin: 0px;
}
h1 {
    font-size: 14px;
    margin: 0px;
    font-weight: normal;
}
h2 {
    font-size: 13px;
    margin: 0px;
    font-weight: normal;
}
h3 {
    font-size: 12px;
    margin: 0px;
    font-weight: normal;
}
h4 {
    font-size: 11px;
    margin: 0px;
    font-weight: normal;
}
h5 {
    font-size: 10px;
    margin: 0px;
    font-weight: normal;
}
h6 {
    font-size: 9px;
    margin: 0px;
    font-weight: normal;
}

/* TEXT */
/* ---------------------------- */
.sweTitle1, span.sweTitle1 { /* Farbe1/groß */
    content: 'Farbe1/groß';
    color: #B10135;
    font-size: 20px;
}
.sweTitle2, span.sweTitle2 { /* Farbe1/mittel */
    content: 'Farbe1/mittel';
    color: #B10135;
    font-size: 18px;
}
.sweTitle3, span.sweTitle3 { /* Farbe1/normal */
    content: 'Farbe1/normal';
    color: #B10135;
    font-size: 15px;
}
.sweTitle4, span.sweTitle4 { /* Farbe2/groß */
    content: 'Farbe2/groß';
    color: #006699;
    font-size: 20px;
}
.sweTitle5, span.sweTitle5 { /* Farbe2/mittel */
    content: 'Farbe2/mittel';
    color: #006699;
    font-size: 18px;
}
.sweTitle6, span.sweTitle6 { /* Farbe2/normal */
    content: 'Farbe2/normal';
    color: #006699;
    font-size: 15px;
}
.sweTitle7, span.sweTitle7 { /* Standard/groß */
    content: 'Standard/groß';
    font-size: 20px;
}
.sweTitle8, span.sweTitle8 { /* Standard/mittel */
    content: 'Standard/mittel';
    font-size: 18px;
}
.sweTitle9, span.sweTitle9 { /* Copyright */
    content: 'Copyright';
    font-size: 10px;
}

/* TABLE */
/* ---------------------------- */
table.sweTable1 { /* Farbe1 Rahmen */
    content: 'Tabelle: Farbe1 Rahmen';
    border: 1px solid #B10135;
    border-collapse: collapse;
}
table.sweTable1 td {
    border: 1px solid #B10135;
    padding: 4px;
}
table.sweTable2 { /* Farbe2 Rahmen */
    content: 'Tabelle: Farbe2 Rahmen';
    border: 1px solid #006699;
    border-collapse: collapse;
}
table.sweTable2 td {
    border: 1px solid #006699;
    padding: 4px;
}

table.sweTable3 { /* Grau Rahmen */
    content: 'Tabelle: Grau Rahmen';
    border: 1px solid #AAAAAA;
    border-collapse: collapse;
}
table.sweTable3 td {
    border: 1px solid #AAAAAA;
    padding: 4px;
}

/* TABLE-ROW */
/* ---------------------------- */
tr.sweTableRow1 {
    content: 'Zeile: Farbe1 Hintergrund';
    background-color: #B10135;
}

.sweTableRow1 td {
    background-color: #B10135;
    color: #FFFFFF;
    padding: 4px;
}

tr.sweTableRow2, .sweTableRow2 td {
    content: 'Zeile: Farbe1 hell Hintergrund';
    background-color: #F7E5EA;
}

tr.sweTableRow3 {
    content: 'Zeile: Farbe2 Hintergrund';
    background-color: #006699;
}

.sweTableRow3 td {
    background-color: #006699;
    color: #FFFFFF;
    padding: 4px;
}

tr.sweTableRow4, .sweTableRow4 td {
    content: 'Zeile: Farbe2 hell Hintergrund';
    background-color: #E5EFF5;
}

tr.sweTableRow5 {
    content: 'Zeile: Grau Hintergrund';
    background-color: #AAAAAA;
}

.sweTableRow5 td {
    background-color: #AAAAAA;
    color: #FFFFFF;
    padding: 4px;
}

tr.sweTableRow6, .sweTableRow6 td {
    content: 'Zeile: Grau hell Hintergrund';
    background-color: #F5F5F5;
}

/* TABLE-CELL */
/* ---------------------------- */
td.sweTableCell1 { /* Farbe1 Hintergrund */
    content: 'Zelle: Farbe1 Hintergrund';
    background-color: #B10135 !important;
    color: #FFFFFF !important;
}
td.sweTableCell2 { /* Farbe1 hell Hintergrund */
    content: 'Zelle: Farbe1 hell Hintergrund';
    background-color: #F7E5EA !important;
    color: #000000 !important;
}
td.sweTableCell3 { /* Farbe2 Hintergrund */
    content: 'Zelle: Farbe2 Hintergrund';
    background-color: #006699 !important;
    color: #FFFFFF !important;
}
td.sweTableCell4 { /* Farbe2 hell Hintergrund */
    content: 'Zelle: Farbe2 hell Hintergrund';
    background-color: #E5EFF5 !important;
    color: #000000 !important;
}
td.sweTableCell5 { /* Grau Hintergrund */
    content: 'Zelle: Grau Hintergrund';
    background-color: #AAAAAA !important;
    color: #FFFFFF !important;
}
td.sweTableCell6 { /* Grau hell Hintergrund */
    content: 'Zelle: Grau hell Hintergrund';
    background-color: #F5F5F5 !important;
    color: #000000 !important;
}


/* BUTTONS */
/* ---------------------------- */

:root {
    --color-base: #2a3637;
    --color-primary: #B10135;
    --color-secondary: #006699;
    --color-white: #ffffff;
    --color-black: #000000;
}

[class*=sweButton] {
    cursor: pointer;
    text-transform: uppercase;
    text-align: center;
    font-weight: 700;
    display: inline-block;
    padding: 10px 30px 10px 30px;
    text-decoration: none;
    border-width: 1px;
    border-style: solid;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    box-sizing: border-box;
  }

  [class*=sweButton]:hover {
    text-decoration: none;
    opacity: 1 !important;
    color: var(--color-base);
  }

  [class*=sweButton][class*=Fullwidth] {
    width: 100%;
  }

  a.sweButtonPrimary {
    content: "Button Primär";
  }

  a.sweButtonPrimaryFullwidth {
    content: "Button Primär (breit)";
  }

  a.sweButtonPrimaryOutline {
    content: "Button Primär Outline";
  }

  a.sweButtonPrimaryOutlineFullwidth {
    content: "Button Primär Outline  (breit)";
  }

  [class*=sweButtonPrimary] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
  }

  [class*=sweButtonPrimary]:hover {
    background-color: var(--color-white);
    color: var(--color-primary);
  }

  [class*=sweButtonPrimary][class*=Outline] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: transparent;
  }

  [class*=sweButtonPrimary][class*=Outline]:hover {
    color: var(--color-white);
    background-color: var(--color-primary);
  }

  a.sweButtonSecondary {
    content: "Button Sekundär";
  }

  a.sweButtonSecondaryFullwidth {
    content: "Button Sekundär (breit)";
  }

  a.sweButtonSecondaryOutline {
    content: "Button Sekundär Outline";
  }

  a.sweButtonSecondaryOutlineFullwidth {
    content: "Button Sekundär Outline  (breit)";
  }

  [class*=sweButtonSecondary] {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
    color: var(--color-white);
  }

  [class*=sweButtonSecondary]:hover {
    background-color: var(--color-white);
    color: var(--color-secondary);
  }

  [class*=sweButtonSecondary][class*=Outline] {
    color: var(--color-secondary);
    border-color: var(--color-secondary);
    background-color: transparent;
  }

  [class*=sweButtonSecondary][class*=Outline]:hover {
    color: var(--color-white);
    background-color: var(--color-secondary);
  }

  a.sweButtonWhite {
    content: "Button Weiß";
  }

  a.sweButtonWhiteFullwidth {
    content: "Button Weiß (breit)";
  }

  a.sweButtonWhiteOutline {
    content: "Button Weiß Outline";
  }

  a.sweButtonWhiteOutlineFullwidth {
    content: "Button Weiß Outline  (breit)";
  }

  [class*=sweButtonWhite] {
    background-color: var(--color-white);
    border-color: var(--color-white);
    color: var(--color-black);
  }

  [class*=sweButtonWhite]:hover {
    background-color: var(--color-black);
    color: var(--color-white);
  }

  [class*=sweButtonWhite][class*=Outline] {
    color: var(--color-white);
    border-color: var(--color-white);
    background-color: transparent;
  }

  [class*=sweButtonWhite][class*=Outline]:hover {
    color: var(--color-black);
    background-color: var(--color-white);
  }

  a.sweButtonBlack {
    content: "Button Schwarz";
  }

  a.sweButtonBlackFullwidth {
    content: "Button Schwarz (breit)";
  }

  a.sweButtonBlackOutline {
    content: "Button Schwarz Outline";
  }

  a.sweButtonBlackOutlineFullwidth {
    content: "Button Schwarz Outline  (breit)";
  }

  [class*=sweButtonBlack] {
    background-color: var(--color-black);
    border-color: var(--color-black);
    color: var(--color-white);
  }

  [class*=sweButtonBlack]:hover {
    background-color: var(--color-white);
    color: var(--color-black);
  }

  [class*=sweButtonBlack][class*=Outline] {
    color: var(--color-black);
    border-color: var(--color-black);
    background-color: transparent;
  }

  [class*=sweButtonBlack][class*=Outline]:hover {
    color: var(--color-white);
    background-color: var(--color-black);
  }

  a.sweButtonBase {
    content: "Button Base";
  }

  a.sweButtonBaseFullwidth {
    content: "Button Base (breit)";
  }

  a.sweButtonBaseOutline {
    content: "Button Base Outline";
  }

  a.sweButtonBaseOutlineFullwidth {
    content: "Button Base Outline  (breit)";
  }

  [class*=sweButtonBase] {
    background-color: var(--color-base);
    border-color: var(--color-base);
    color: var(--color-white);
  }

  [class*=sweButtonBase]:hover {
    background-color: var(--color-white);
    color: var(--color-base);
  }

  [class*=sweButtonBase][class*=Outline] {
    color: var(--color-base);
    border-color: var(--color-base);
    background-color: transparent;
  }

  [class*=sweButtonBase][class*=Outline]:hover {
    color: var(--color-white);
    background-color: var(--color-base);
  }


/* IMAGES */
/* ---------------------------- */
.swartimg {
  border: none;
  margin: 7px !important;
}

.sweImgRight .swartimg, img.sweImgRight {
  content: 'Bild rechts';
  margin: 7px 0px 7px 7px !important;
}

.sweImgLeft .swartimg, img.sweImgLeft {
  content: 'Bild links';
  margin: 7px 7px 7px 0px !important;
}

/* ---------------------------- */
/* EDITOR STYLE-DEFINITIONS - END */

.sweAccordion *,
.sweTabs * {
  box-sizing: border-box;
}

.swEditor {
  font-size: 15px;
}

.cke_editable {
  font-family: "Open Sans", sans-serif;
  @include font-size($fontSizeBasic);
  @include line-height($lineHeightBasic);
  color: $colorBase;
}

.cke_editable table.sweAccordion {
  content: 'Markup: Akkordeon';
  border: 2px dashed #00b018 !important;
  width: 100%;
}

.cke_editable table.sweTabs {
  content: 'Markup: Tabs';
  border: 2px dashed #FF00FF !important;
  width: 100%;
}

.cke_editable img {
  max-width: 100%;
  height: auto;
}

.cke_editable * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}