


/* korrekturen renasposa --------------- */
.intro-product-slider-entry slick-slide { 
opacity: 1 !important; 
background: none !important;
}
.intro-product-slider-entry--hersteller {
    font-weight: bold;
    text-align: center;
    margin-top: 10px;
    font-size: 14px;
    text-transform: uppercase;
    color: #fff !important;
    background: none !important;
    opacity: 1 !important;
}

.intro-product-slider-entry--product-name {
    text-align: center !important;
    color: #fff !important;
    background: none !important;
    opacity: 1 !important;
}

.svg-inline--fa {  vertical-align: -.525em; } 


#ramifi-page .sid1617097304398,
#ramifi-page .section-meta  { 
background: transparent !important;
background-color: transparent !important; 
}

#ramifi-page .section-title { color: #fff !important; } 
#sid1617097304398 .introaktionbutton   {
    padding: 15px 20px 13px 20px !important;
    background: #fff !important;
    border-bottom:  none !important; } 
#ramifi-page .textweiss { color: #fff !important; }



body { 
    color: #fff; 
    font-family: 'Raleway', sans-serif; 
    font-size: 15px; 
    background: #000;
/*  background: -webkit-linear-gradient(top left, #000 19%, #1a1a1a 32%, #626262 95%);
    background: -moz-linear-gradient(top left, #000 19%, #1a1a1a 32%, #626262 95%);
    background: linear-gradient(to top left, #000 19%, #1a1a1a 32%, #626262 95%); */
    background-image: url(https://renasposa.de/wp-content/uploads/renasposa-intro-neu-1024x678.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: top center;
    background-size: cover;
}
html { 
  box-shadow: inset 2000px 0 0 0 rgba(0, 0, 0, 0.65);
  border-color: rgba(0, 0, 0, 1);
  height: 300vh;
}

.fas { margin-right: 5px !important; }

.profile-picture {
    display: block;
    margin-top:5%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 25px;
    height: auto;
    max-width: 200px;
    border-radius: 0%;
}
.name { font-family: 'Raleway', cursive; text-align: center; font-size: 15px; margin: 0px auto 20px auto; }
.ramifi-link {
      font-family: 'Raleway', sans-serif;
      text-align: center;
      margin-top: 10px;
      padding: 10px;
      border: 1px solid white;
      border-width: 2px;
      width: 290px;
      display: block;
      margin-left: auto;
      margin-right: auto;
      border-radius: 100px;
}
a.normallink, a.normallink:link, a.normallink:active, a.normallink:visited, a.normallink:hover { 
    font-size: 10px;
    letter-spacing: 0.03em;
    background:transparent !important;
    color:#fff !important;
}
a { text-decoration: none; color: white; transition: color 0.5s;  }
a:hover { color: #000;  }

a.ramifi-link:link, a.ramifi-link:active, a.ramifi-link:visited { background: transparent; }
a.ramifi-link:hover { background: #fff }


.maincontent{ 
    position: relative;
    z-index: 3;
    text-align:center; 
}
.matrix-complete {
    width: 100%;
    max-width: 100% !important;
    overflow: hidden !important;
} 



/* ============= ANIMATION ZWEI FLIEGER ========= */
#bigBox {
position: absolute;
width: 300px;
height: 300px;
top: 50px;
left: calc(50% - 0px);
margin: -100px 0 0 -120px;
animation: bigBoxAnimation 6s linear infinite;
z-index: 2;
}
#box,#box2 {
  position:absolute;
  top:60%;
  left:50%;
  width:40px;
  height:40px;
  margin:-20px 0 0 -20px;
  animation:boxAnimation 2.95s cubic-bezier(0.02, 0.01, 0.31, 1) infinite;
}
#box2 {
  animation:boxAnimation 3.2s cubic-bezier(0.02, 0.01, 0.31, 1) infinite;
  transform:matrix(-1,0,0,1,0,0);
}
#box::after, #box2::after {
  content:'';
  position:absolute;
  top:0;
  left:0;
  width:6px;
  height:6px;
  background:#fff;
  border-radius:100%;
  animation:spanAnimation 3s cubic-bezier(0.3, 0.27, 0.07, 1.64) infinite;
  box-shadow:rgba(255,255,255,1) 0 0 20px 2px;
}
@keyframes bigBoxAnimation {
  100% {transform:rotate(360deg);}
}
@keyframes boxAnimation{
  50% {transform:translateY(-150px);}
}
@keyframes spanAnimation {
  50% {transform:translateX(-150px)}
}


.logorami {
margin: 28px;
width: 160px;
    height: auto;  
    background: transparent;
}

.logokreisrami img {
}
 
@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}