
/* Tab Slider Login / Registrieren */

.reglogin_tab {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  
  input[type="radio"][name="reglogin"] {
    position: absolute;
    z-index: -1;
  }
  input[type="radio"][name="reglogin"]:checked + .tab-label-content label {
    color: #808284;
  }
  input[type="radio"][name="reglogin"]:checked + .tab-label-content .tab-content {
    display: block;
  }
  input[type="radio"][name="reglogin"]:nth-of-type(1):checked ~ .reglogin__slide {
    left: calc((100% / 2) * 0);
  }
  input[type="radio"][name="reglogin"]:nth-of-type(2):checked ~ .reglogin__slide {
    left: calc((100% / 2) * 1);
    border-top-right-radius: 4px;
  }


  input[type="radio"][name="reglogin"]:first-of-type:checked ~ .reglogin__slide {
    left: 0;
  }
  
  .reglogin_tab label {
    cursor: pointer;
    color: #808284;
    background-color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    box-sizing: border-box;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
    height: calc(50px - 1px);
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
    width: 100%;
  }
  
  .reglogin__slide {
    background: #03A9F4;
    width: calc(100% / 2);
    height: 4px;
    position: absolute;
    left: 0;
    top: calc(100% - 5px);
    -webkit-transition: left 0.3s ease-out;
    transition: left 0.3s ease-out;
  }
  
  .reglogin_tab-content {
    width: 100%;
  }
  .reglogin_tab-content .tab-content {
    position: absolute;
    top: 100px;
    left: 16px;
    line-height: 130%;
    display: none;
  }			

        
        /* Tab Slider 2 */
        
        .feed__tabs {
			width: 100%;
			border-top-left-radius: 6px;
			border-top-right-radius: 6px;
            position: relative;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
          }
          
          input[type="radio"][name="tabs"] {
            position: absolute;
            z-index: -1;
          }
          input[type="radio"][name="tabs"]:checked + .feed__tabs__content label {
			color: #03a9f4;
          }
          input[type="radio"][name="tabs"]:checked + .feed__tabs__content .tab-content {
            display: block;
          }
          input[type="radio"][name="tabs"]:nth-of-type(1):checked ~ .slide__2 {
			left: calc((100% / 2) * 0);
			border-top-left-radius: 6px;
          }
          input[type="radio"][name="tabs"]:nth-of-type(2):checked ~ .slide__2 {
			left: calc((100% / 2) * 1);
			border-top-right-radius: 6px;
          }
        
          input[type="radio"][name="tabs"]:first-of-type:checked ~ .slide__2 {
            left: 0;
          }
          
          .feed__tabs label {
            cursor: pointer;
            color: #808284;
            background-color: #fff;
            border-bottom: 1px solid rgba(0, 0, 0, 0.15);
            box-sizing: border-box;
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            text-align: center;
            height: calc(50px - 1px);
            -webkit-transition: color 0.2s ease;
            transition: color 0.2s ease;
			width: 100%;
			border-top-left-radius: 6px;
			border-top-right-radius: 6px;
          }
          
          .slide__2 {
            background: #03A9F4;
            width: calc(100% / 2);
            height: 4px;
            position: absolute;
            left: 0;
            top: calc(100% - 5px);
            -webkit-transition: left 0.3s ease-out;
            transition: left 0.3s ease-out;
          }
          
          
          .feed__tabs__content {
            width: 100%;
          }
          .feed__tabs__content .tab-content {
            position: absolute;
            top: 100px;
            left: 16px;
            line-height: 130%;
            display: none;
          }			
		









/* Tab Slider Gruppen und Seiten */

.tab-wrap {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  
  input[type="radio"][name="tabs"] {
    position: absolute;
    z-index: -1;
  }
  input[type="radio"][name="tabs"]:checked + .tab-label-content label {
    color: #808284;
  }
  input[type="radio"][name="tabs"]:checked + .tab-label-content .tab-content {
    display: block;
  }
  input[type="radio"][name="tabs"]:nth-of-type(1):checked ~ .slide {
    left: calc((100% / 3) * 0);
  }
  input[type="radio"][name="tabs"]:nth-of-type(2):checked ~ .slide {
    left: calc((100% / 3) * 1);
  }
  input[type="radio"][name="tabs"]:nth-of-type(3):checked ~ .slide {
    left: calc((100% / 3) * 2);
  }

  input[type="radio"][name="tabs"]:first-of-type:checked ~ .slide {
    left: 0;
  }
  
  .tab-wrap label {
    cursor: pointer;
    color: #808284;
    background-color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    box-sizing: border-box;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
    height: calc(50px - 1px);
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
    width: 100%;
  }
  
  .slide {
    background: #03A9F4;
    width: calc(100% / 3);
    height: 4px;
    position: absolute;
    left: 0;
    top: calc(100% - 5px);
    -webkit-transition: left 0.3s ease-out;
    transition: left 0.3s ease-out;
  }
  
  .tab-label-content {
    width: 100%;
  }
  .tab-label-content .tab-content {
    position: absolute;
    top: 100px;
    left: 16px;
    line-height: 130%;
    display: none;
  }			


  

/* admin Slider*/

.admin-wrap {
  width: 100%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

input[type="radio"][name="admins"] {
  position: absolute;
  z-index: -1;
}
input[type="radio"][name="admins"]:checked + .admin-label-content label {
  color: #FFA000;
}
input[type="radio"][name="admins"]:checked + .admin-label-content .admin-content {
  display: block;
}
input[type="radio"][name="admins"]:nth-of-type(1):checked ~ .slide {
  left: calc((100% / 3) * 0);
}
input[type="radio"][name="admins"]:nth-of-type(2):checked ~ .slide {
  left: calc((100% / 3) * 1);
}
input[type="radio"][name="admins"]:nth-of-type(3):checked ~ .slide {
  left: calc((100% / 3) * 2);
}

input[type="radio"][name="admins"]:first-of-type:checked ~ .slide {
  left: 0;
}

.admin-wrap label {
  cursor: pointer;
  color: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
  height: calc(50px - 0px);
  -webkit-transition: color 0.2s ease;
  transition: color 0.2s ease;
  width: 100%;
}

.slide {
  background: #FFA000;
  width: calc(100% / 3);
  height: 4px;
  position: absolute;
  left: 0;
  top: calc(100% - 5px);
  -webkit-transition: left 0.3s ease-out;
  transition: left 0.3s ease-out;
}

.admin-label-content {
  width: 100%;
}
.admin-label-content .admin-content {
  position: absolute;
  top: 100px;
  left: 16px;
  line-height: 130%;
  display: none;
}		


/*Suche Slider*/

.tab-search {
  width: 100%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  }

  input[type="radio"][name="search_tabs"] {
  position: absolute;
  z-index: -1;
}
input[type="radio"][name="search_tabs"]:checked + .tab-label-content label {
  color: #4CAF50;
}
input[type="radio"][name="search_tabs"]:checked + .tab-label-content .tab-content {
  display: block;
}
input[type="radio"][name="search_tabs"]:nth-of-type(1):checked ~ .slide_search {
  left: calc((100% / 4) * 0);
}
input[type="radio"][name="search_tabs"]:nth-of-type(2):checked ~ .slide_search {
  left: calc((100% / 4) * 1);
}
input[type="radio"][name="search_tabs"]:nth-of-type(3):checked ~ .slide_search {
  left: calc((100% / 4) * 2);
}
input[type="radio"][name="search_tabs"]:nth-of-type(4):checked ~ .slide_search {
  left: calc((100% / 4) * 3);
}

input[type="radio"][name="search_tabs"]:first-of-type:checked ~ .slide_search {
  left: 0;
}

.tab-search label {
cursor: pointer;
font-weight: 400;
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
text-transform: uppercase;
color: #808284;
  box-sizing: border-box;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
    -ms-flex-align: center;
        align-items: center;
  -webkit-box-pack: center;
    -ms-flex-pack: center;
        justify-content: center;
  text-align: center;
  height: calc(50px - 0px);
  -webkit-transition: color 0.2s ease;
  transition: color 0.2s ease;
  width: 100%;
}

.slide_search {
  background: #4CAF50;
  width: calc(100% / 4);
  height: 4px;
  position: absolute;
  left: 0;
  top: calc(100% - 4px);
  -webkit-transition: left 0.3s ease-out;
  transition: left 0.3s ease-out;
}

.tab-label-content {
  width: 100%;
}
.tab-label-content .tab-content {
  position: absolute;
  top: 100px;
  left: 16px;
  line-height: 130%;
  display: none;
}			


.friendshipp_add_button {
cursor: pointer;
text-transform: uppercase;
color: #03a9f4;
border-radius: 4px;
padding: 11px 16px 11px 16px;
background-color: #ebeff1;
}

.friendshipp_add_button:hover {
color: #03A9F4; 
}



