/*a {
    position: relative;
    transition: .5s
}

a:before, a:after {
    position: absolute;
    bottom: -2px;
    content: "";
    display: inline-block;
    width: 0;
    height: 2px;
    background: #000;
    transition: .5s
}

a:before {
    left: 50%
}

a:after {
    right: 50%
}

a:hover {
    text-decoration: none
}

a:hover:before, a:hover:after {
    width: 50%
}
*/
    .card-container {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 20px;
    }


.center {
    display: flex;
    justify-content: center;
    align-items: center;
  }
        
.btn2 {
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
    font-weight: bold;
    border: 1px solid #007BFF;
    border-radius: 5px;
    color: #fff;
    background-color: #007BFF;
    cursor: pointer;
    transition: background-color 0.3s;
  }
  
  .btn2:hover {
    background-color: #0056b3;
  }

  /* Button-Aktiver Effekt */
.btn2:active {
    background-color: #003d7a;
    border-color: #003d7a;
  }
  
    
.blink {
    -webkit-animation: 1s blink step-end infinite;
    -moz-animation: 1s blink step-end infinite;
    -ms-animation: 1s blink step-end infinite;
    -o-animation: 1s blink step-end infinite;
    animation: 1s blink step-end infinite;
  }
  
  @keyframes "blink" {
    from, to {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
  }
  
  @-moz-keyframes blink {
    from, to {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
  }
  
  @-webkit-keyframes "blink" {
    from, to {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
  }
  
  @-ms-keyframes "blink" {
    from, to {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
  }
  
  @-o-keyframes "blink" {
    from, to {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
  }
  
.private {
    display: none
}

.private-inner {
    display: table-cell
}

.portfolio .portfolio-inner {
    display: flex;
    align-items: stretch;
}

.portfolio .portfolio-inner .portfolio-image {
	align-items: center;
    margin-right: 5%;
    width: 45%
}

.portfolio .portfolio-inner .portfolio-content {
    flex: 1
}

#privateTrigger {
    cursor: pointer
}

#privateTrigger:hover:before, #privateTrigger:hover:after {
    width: 0
}

.fixed-bar {
    position: fixed;
    bottom: 0;
    margin: 0;
    height: 65px;
    width: 100%;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    background: #fefefe
}

.fixed-bar .container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 65px
}


.sns-shares {
    display: flex;
    align-items: center;
    justify-content: space-around;
    position: absolute;
    right: 0
}

.sns-shares .sns-share {
    display: flex;
    align-items: center;
    justify-content: space-around;
    height: 56px;
    width: 56px;
    text-decoration: none
}

.sns-shares .sns-share:hover:before, .sns-shares .sns-share:hover:after {
    width: 0
}

.sns-shares .twitter-share .fa-twitter {
    font-size: 24px
}

.sns-shares .fb-share .fa-facebook-f {
    font-size: 24px
}

.sns-shares .hatena-share img {
    width: 32px
}

.sns-shares .line-share img {
    width: 32px
}

.sp-sns-shares {
    display: none
}

@media(max-width:920px) {
    .pc-sns-shares {
        display: none
    }
    .sp-sns-shares {
        display: flex;
        position: relative;
        justify-content: space-around;
        width: 100%
    }
    .portfolio .portfolio-inner {
        display: block
    }
    .portfolio .portfolio-inner .portfolio-image {
        width: 100%
    }
}

.chroma {
    color: #e3e3e3;
    background-color: #364549
}

.chroma .err {
    color: #ddd;
    border-bottom: 2px dotted #c01b1b
}

.chroma .lntd {
    vertical-align: top;
    padding: 0;
    margin: 0;
    border: 0
}

.chroma .lntable {
    border-spacing: 0;
    padding: 0;
    margin: 0;
    border: 0;
    width: auto;
    overflow: auto;
    display: block
}

.chroma .hl {
    display: block;
    width: 100%;
    background-color: #ffc
}

.chroma .lnt {
    margin-right: .4em;
    padding: 0 .4em 0 .4em
}

.chroma .ln {
    margin-right: .4em;
    padding: 0 .4em 0 .4em
}

.chroma .k {
    color: #ebd247
}

.chroma .kc {
    color: #ebd247
}

.chroma .kd {
    color: #ebd247
}

.chroma .kn {
    color: #ff8095
}

.chroma .kp {
    color: #ebd247
}

.chroma .kr {
    color: #ebd247
}

.chroma .kt {
    color: #ebd247
}

.chroma .na {
    color: #8bdf4c
}

.chroma .nc {
    color: #8bdf4c
}

.chroma .no {
    color: #ebd247
}

.chroma .nd {
    color: #8bdf4c
}

.chroma .ne {
    color: #8bdf4c
}

.chroma .nf {
    color: #8bdf4c
}

.chroma .nx {
    color: #8bdf4c
}

.chroma .nt {
    color: #ff8095
}

.chroma .l {
    color: #a980f5
}

.chroma .ld {
    color: #41b7d7
}

.chroma .s {
    color: #41b7d7
}

.chroma .sa {
    color: #41b7d7
}

.chroma .sb {
    color: #41b7d7
}

.chroma .sc {
    color: #41b7d7
}

.chroma .dl {
    color: #41b7d7
}

.chroma .sd {
    color: #41b7d7
}

.chroma .s2 {
    color: #41b7d7
}

.chroma .se {
    color: #a980f5
}

.chroma .sh {
    color: #41b7d7
}

.chroma .si {
    color: #41b7d7
}

.chroma .sx {
    color: #41b7d7
}

.chroma .sr {
    color: #41b7d7
}

.chroma .s1 {
    color: #41b7d7
}

.chroma .ss {
    color: #41b7d7
}

.chroma .m {
    color: #a980f5
}

.chroma .mb {
    color: #a980f5
}

.chroma .mf {
    color: #a980f5
}

.chroma .mh {
    color: #a980f5
}

.chroma .mi {
    color: #a980f5
}

.chroma .il {
    color: #a980f5
}

.chroma .mo {
    color: #a980f5
}

.chroma .o {
    color: #ff8095
}

.chroma .ow {
    color: #ff8095
}

.chroma .c {
    color: #9dabae
}

.chroma .ch {
    color: #9dabae
}

.chroma .cm {
    color: #9dabae
}

.chroma .c1 {
    color: #9dabae
}

.chroma .cs {
    color: #9dabae
}

.chroma .cp {
    color: #9dabae
}

.chroma .cpf {
    color: #9dabae
}

.chroma .gd {
    color: #ff8095
}

.chroma .ge {
    font-style: italic
}

.chroma .gi {
    color: #8bdf4c
}

.chroma .gs {
    font-weight: bold
}

.chroma .gu {
    color: #9dabae
}