:root {
  --blue: #37517e;
  --indigo: #6610f2;
  --purple: #6f42c1;
  --pink: #e83e8c;
  --red: #eb4680;
  --orange: #fd7e14;
  --yellow: #f6c23e;
  --green: #1cc88a;
  --teal: #20c9a6;
  --cyan: #26d7cf;
  --white: #fff;
  --gray: #858796;
  --gray-dark: #5a5c69;
  --primary: #203a86; /*changed*/
  --primary-hover: #283a5a; /*added*/
  --westnetzshop: #5a5c69;
  --salmon: #ec9f9f; /*added, delete?*/
  --salmon-hover: #d99191;
  --secondary: #858796;
  --success: #1cc88a;
  --info: #10bab9; /*changed*/
  --warning: #f6c23e; /*changed*/
  --danger: #eb4680; /*changed*/
  --light: #f8f9fc;
  --dark: #5a5c69;
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  --font-family: "innogyWEB-Regular", sans-serif;
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}


/*--------------------------------------------------------------
# Modals
--------------------------------------------------------------*/
.modal.privatPolicy,
.modal.termsOfUse{
    font-size: 12px !important;
}



/*--------------------------------------------------------------
# typo animation
--------------------------------------------------------------*/
.txt-rotate > .wrap {
    border-right: 0.1em solid #666
}


/*--------------------------------------------------------------
# GENERAL BUTTONS
--------------------------------------------------------------*/

/* ---- action button --------------------------------------- */
.btn-filled-round-red{
    background: #fe6053;
    border: 2px solid #fe6053;
    padding: 12px 34px;
    color: #fff;
    transition: 0.4s;
    border-radius: 50px;
    font-size:16px;
}
.btn-filled-round-red:hover{
    background: rgba(255,255,255,0);
    color: #fe6053;
}
.btn-filled-round-red:disabled{
    background: #c1c1c1;
    border: 2px solid #c1c1c1;
    color: #a1a1a1;
}
/* ---- action button --------------------------------------- */


/* ---- normal button unfilled ------------------------------ */
.btn-unfilled-round{
    background: rgba(255,255,255,0);
    border: 2px solid #ec9f9f;
    padding: 8px 20px 10px 20px;
    color: #ec9f9f;
    transition: 0.4s;
    border-radius: 50px;
    font-size:15px;
    display: inline-flex;
    align-items: center;
}
.btn-unfilled-round i{
    line-height: 1;
    font-size: 1rem;
    padding-right: 5px;
}

.btn-unfilled-round:hover{
    background: #ec9f9f;
    color: #fff;
}
/* ---- normal button unfilled ------------------------------------- */


/* ---- normal button filled --------------------------------------- */
.btn-filled-round{
    background: #ec9f9f;
    border: 2px solid #ec9f9f;
    padding: 8px 20px 10px 20px;
    color: #fff;
    transition: 0.4s;
    border-radius: 50px;
    font-size:15px;
    display: inline-flex;
    align-items: center;
}
.btn-filled-round i{
    line-height: 1;
    font-size: 1rem;
    padding-right: 5px;
}

.btn-filled-round:hover{
    background: rgba(255,255,255,0);
    color: #ec9f9f;
}
/* ---- normal button filled --------------------------------------- */



/* ---- primary button --------------------------------------- */

.btn-primary {
  color: #fff;
  background-color: var(--primary);
  border-color: var(--primary);
}

.btn-westnetzorder {
  color: rgba(255, 255, 255, 1);
  background-color: rgb(112, 111, 107);
}

.btn-primary:hover {
  color: #fff;
  opacity:0.9;
}

.btn-primary:focus, .btn-primary.focus {
  color: #fff;
  opacity:0.9;
  outline:none;
}

.btn-primary.disabled, .btn-primary:disabled {
  color: #fff;
  background-color: var(--primary);
  border-color: var(--primary);
  opacity:0.5;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  opacity:0.9;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {

}

.btn-primary-hollow {
  color: var(--primary) !important;
  background-color: transparent !important;
  border-color: var(--primary);
  border: solid var(--primary) 2px;
}

.btn-primary-hollow:hover {
  color: #fff !important;
  background-color: var(--primary) !important;
  border-color: var(--primary);
}

/* ---- primary button --------------------------------------- */







/* ---- toggle switch --------------------------------------- */

.switch {
  position: relative;
  display: inline-block;
  width: 45px;
  height: 24px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .2s;
  transition: .2s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  -webkit-transition: .2s;
  transition: .2s;
}

input:checked + .slider {
  background-color: var(--primary);
}

input:disabled + .slider {
  background-color: var(--primary);
  opacity:0.5;
}

input:focus + .slider {
  box-shadow: 0 0 1px var(--primary);
}

input:checked + .slider:before {
  -webkit-transform: translateX(21px);
  -ms-transform: translateX(21px);
  transform: translateX(21px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 30px;
}

.slider.round:before {
  border-radius: 50%;
}

/* ---- toggle switch --------------------------------------- */




/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/

.validate{
  display: none;
  color: var(--danger);
  margin: 0 0 15px 0;
  font-weight: 400;
  font-size: 13px;
}

.error-message{
  display: none;
  color: var(--white);
  background: var(--danger);
  text-align: left;
  padding: 15px 30px;
  font-weight: 600;
}

.error-message br + br{
  margin-top: 25px;
}

.sent-message{
  display: none;
  color: var(--white);
  background: var(--success);
  text-align: center;
  padding: 15px 30px;
  font-weight: 600;
}

.loading{
  display: none;
  text-align: center;
  padding: 15px;
}

.loading:before{
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 10px -6px 0;
  border: 3px solid var(--info);
  border-top-color: #eee;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}

@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}