          @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
          *{
                    font-family: 'Poppins', sans-serif;
          }
          body{
              min-width: 320px;
          }
         
.sideBar-c::-webkit-scrollbar,html::-webkit-scrollbar {
    width: 10px;
    background: #000;
    border-radius: 10px;
}.sideBar-c::-webkit-scrollbar-thumb,html::-webkit-scrollbar-thumb {
    background: #fff;
    border-radius: 10px;
    border: 2px solid #000; 
}
.Img-prdt-100per{
    overflow:hidden;
}
          .navigation-bars{
                    display: flex;
                    padding: 20px;
                    width: -webkit-fill-available;
                    position:sticky;
                    top:0;
                    left:0;
                    width:100%;
                    background:#fff;
                    z-index:9;
          }
          p.item-kingsconcept-rating {
    font-size: 12px;
    margin: 0;
}
           .menubarT{
            position:fixed;
            top:50%;
            left:0%;
            border:none;
            outline:none;
            background:#000;
            color:#fff;
            padding:10px;
            transform: rotate(90deg);
            border-top-right-radius:10px;
            border-top-left-radius:10px;
            z-index:998;
        }
        .sideBar-container{
            display:none;
            
        }
        .sideBar-container{
            position:fixed;
            z-index:999;
           width: 100%;
    height: 100%;
    top: 0;
    left: 0; font-size:small; text-align:initial;
        }
        .sideBar-container a{
            text-decoration:none;color:#000;
        }
        .sideBar-container a:hover{
            text-decoration:none;color:#000;
        }
        .sideBar-c{
            background:#fff;
            
    overflow: hidden;
    overflow-y: auto;
    overflow-x: hidden;
        }
        .side-c-r{
            height:100%;
        }
        .side-c-d{
    background: #000;
            
        }
        /*.side-categories,*/.side-sc-p{
            padding:10px;
        }
        .side-categories ul,.side-sc-p ul{
        text-decoration:none;
        list-style-type:none;
        user-select:none;
    margin: 0; 
    padding: 0;
    margin-top:5px;
        }
        .side-categories ul>li>a,.side-sc-p ul>li>a{
        padding:10px;
        text-decoration:none;
        color:#000;
    display: contents;
    text-transform:capitalize;
        }
        .side-categories ul>li,.side-sc-p ul>li{
            padding:10px;
    /*margin-bottom: 10px;*/
            
        }
        .close-toggle{
            border:none;
            outline:none;
            background:transparent; 
            font-size:20px; font-weight:600;
            
            margin:0 10px;
        }
        .close-toggle:hover{
            border:none;
            outline:none;
            background:transparent; color:#000;
        }
        .close-toggle:focus{
            border:none;
            outline:none;
            background:transparent; color:#000;
        }
          .carousel-inner {
    border-radius: 10px;
}
          .place-nav-ul{
              display: flex;
          }
          .lh-1{
              line-height: 1.0;
          }
          .all-prdt-king-show h6{
              padding: 10px;
              background: #000;
              color:#fff;
          }
          .all-prdt-king-show h6 >a{
              text-decoration: none;
              color:#fff;
          }
          .main-casehow{
                    overflow: hidden;
    width: 100%;
    height: 100vh;
    background: #f8f9fa;
    background: url(img/bg1.png);
    background-size: cover;
    background-repeat: round;
    background: #f8f9fa;
    position: relative;
          }
          .available-variations label{
    font-size: x-small;
              
          }
          .closeadd{
                    cursor:pointer;
          }
          .kingsconcept-name{
                    width:27%;
                    cursor:pointer;
    user-select: none;
    letter-spacing: 2px;
    font-size: xx-large;
          }
          .bars-bar-kc{
                    width: 70%;
    user-select: none;
          }
          
.addwishList{
  position: absolute;
    user-select: none;
    top: 2%;
    left: 2%;
    outline: none;
    border: none;
    padding: 10px;
    background: no-repeat;
    font-size: large;
}
.addwishList:focus{
    outline: none;
    border: none;
    
}
.addwishList:hover{
    outline: none;
    border: none;
    
}
button.Wadded{
  color:#000;
}
button.Wadded:hover{
  color:#000;
}
button.wishlist:hover{
color:#000
}
          .colony-kc-pdt p:nth-child(3){
              width:70%;
              font-size:small;
          }
          a{
                    text-decoration: none;
          }
          p[title="Order placed"]{
              color:#ffc107!important;
          }
          .bars-bar-kc ul>li{
    list-style: none;
    display: inline-block;
    padding: 10px 20px;
          }
          .bars-bar-kc ul>li>a{
                    
    color: #1d1d24;
    position: relative;
    padding: 5px 0;
    font-size: smaller;
          }
          .bars-bar-kc>ul>li>a:after {
    content: "";
    position: absolute;
    left: 0;
    width: 0;
    height: 3px;
    background: #000;
    transition: .3s;
    bottom: 0;
}
          
          .bars-bar-kc ul>li>a:hover:after{
                    width: 100%;
          }
          .bars-bar-kc ul>li>a:hover{
                    text-decoration: none;
                    color:#000;
          }
          .kingsconcept-place-bar{
                    width: 20%;
                    z-index: 7;
                    display:flex;
    justify-content: space-evenly;
    align-items: center;
          }
          .place-nav-ul button{
                    background: transparent;
                    outline: none;
                    border: none;
    user-select: none;
                    color: var(--dark);
                    display: inline-flex;
          }
          .place-nav-ul button:hover{
                    outline: none;
                    border: none;
            
    color: var(--secondary);
    background: transparent;
          }
          .place-nav-ul button:focus{
                    outline: none;
                    border: none;
            
    color: var(--secondary);
    background: transparent;
          }
          .check{
                    color:#000;

          }
          .colony-kc-pdt{
    position: absolute;
    top: 30%;
    left: 8%;
    display: none;
          }
          .cart{
              position: relative;
          }
          .cart .badge{
            position: absolute;
            top: -6px;
            right: -4px;
        
          }
          .cart span.badge:hover{
            background:#000
          }

.colony-kc-pdt h1{
          
    color: #1f1f25;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 4px;
    display: inline-block;
    margin: 0;
    background: linear-gradient(120deg, #dc3545 20.69%, #212529 50.19%, #000 79.69%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.colony-kc-pdt p.body-text{
          margin: 0;
    letter-spacing: 4px;
          text-transform: uppercase;
          
          font-size: 37px;
}
.buy-btn{
          
    color: #fff;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding: 16px 40px;
    display: inline-block;
    
    transition: all .4s ease-in-out;
    background-size: 152% 100%;
    background: #000;
    border: 2px solid #000;
}
.buy-btn:hover{
text-decoration: none;
background: transparent;
border: 2px solid #000;
color: #000;
}
.span-col-socials{
          position: absolute;
          bottom: 7%;
          left: 7%;
}
.slider{
          position: absolute;
    bottom: 0%;
    right: 4%;
    width: 40%;

}
.float-social{
    margin:0 10px
}
.product-col{
          display: none;
}
.product-col img{
width:100%
}
.slide-dots{
          position: absolute;
          bottom:7%;
          right: 3%;
          display: inline-block;
          width: 30%;
    z-index: 9;
}
span.dots{
          width:40px;
          height: 10px;
          display: inline-block;
          margin: 0 3px;
          border: 2px solid #000;
          border-radius: 4px;
    transition: background-color 0.6s ease;
}
.active{
          background:#000;
}
.price{
    font-size: 18px;
    font-weight: 500;
}
.discontprice{
    text-decoration: line-through;
    color: silver;
    font-size: 17px;
}
    a.--fgj{
    color: #000;
    text-decoration: none;
    /*line-break: anywhere;*/
}
.prdt-proncing{
    text-align:left;
    padding:10px;
}
/*<!------important------------------------------>*/
.row-categories-cat {
    display: flex;
    flex-wrap: wrap;
}
.categories-cat {
    user-select: none;
    background: #fff;
    padding: 8px;
    text-align: center;
    border-radius: 5px;
    font-size: small;
    cursor: pointer;
    min-width: 100px;
    margin: 10px;
}
.top-picks,.sub-cate-container{
    /* margin: 6px; */
    overflow: hidden;
    overflow-x: auto;
    overflow-y: hidden;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.sub-cate-container::-webkit-scrollbar,.top-picks::-webkit-scrollbar{
    display: none;

}
.categories-cat:hover {
    background: #000;
    color: #fff;
}
/*----------------------------------------------*/
.title-text-me-kw-l {
    text-transform: uppercase;
    padding: 10px;
}
.container-company-tree-memo {
    display: flex;
    flex-wrap: wrap;
}
.container-curve-kw-l {
    width: calc(100% / 5 - 10px);
    margin: 5px;
    padding: 10px;
    cursor: pointer;
}
.contain-minu-conta:hover{
    box-shadow: 0px 1px 1px 1px rgb(0 0 0 / 45%);

}
.contain-minu-conta {
    display: flex;
    flex-direction: row;
    border-radius: 5px;
    box-shadow: 0px 1px 1px 1px rgb(0 0 0 / 25%);
}
.conta-img-l {
    width: 40%;
    height: 100px;
}
.conta-img-l img {
    width: 100%;
    height: 200px;
    object-fit: contain;
}
.contact-product-text-conta {
    width: 60%;
    margin-left: 10px;
    position: relative;
}
.title-prdt-conta, .price-prdt-conta {
    
    margin: 0;
    font-size: small;
}
.title-prdt-conta, .price-prdt-conta {
    
    margin: 0;
    font-size: small;
}
.product-type-catg {
    color: #fff;
    
    font-size: small;
    position: absolute;
    border-radius: 3px;
    top: 0;
    right: 0;
    padding-left: 3px;
    padding-right: 3px;
    background: #000;
}
            /*<!------------------------------------>*/
            .container-kings-showc {
    display: flex;
    flex-wrap: wrap;
} 
.container-one-onm {
    width: calc(100% / 5 - 10px);
    margin: 5px;
    cursor: pointer;position: relative;
    padding: 10px;
    border-radius: 5px;
    text-align: center;
    justify-content: space-between;
    display: flex;
    flex-direction: column;
    background:#fff;
}
.container-one-onm:hover {
    border: 2px solid silver;

}
.container-one-onm:hover .addwishList{
    animation:blud .5s ease infinite;
    transition:.5s ease;
}
@keyframes blud{
    100%{
        color:#000;
    }
    0%{
        color:#000;
    }
}
.Img-prdt-100per img {
    width: 100%;
    
    max-height: 200px;
    min-height: 200px;
    object-fit: scale-down;
    /*padding:10px;*/
}.TprdtNam {
    font-size: small;
    margin-bottom: 5px;
    line-height: 1;
    text-align: initial;
}
.checked{
    color: #ca2340;
}
.product-price-tag {
    margin: 0;
    color: #000;font-weight:600;
}
.discount-per-prt {
    color: gray;
    text-decoration: line-through;
    font-size: 10px;
}
.side-categories{
    padding:10px;
}
.percent-discount-per-prt {
   
    color: #fff;
    position: absolute;
    top: 5%;
    right: 10%;
    background: #000a3;
    padding: 2px;
    border-radius: 2px;
}.buy-btn-btn {
    visibility:hidden;
    transition: visibility 0s;
    outline: none;
    border: none;
    display: block;
    width: -webkit-fill-available;
    padding: 5px;
    margin-top: 8px;
    background: transparent;
    color: #fff;
    margin-bottom: 2px;
    border-radius: 3px;
    position:relative;
    overflow:hidden;
    z-index:0;
}
.buy-btn-btn::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    min-width:0%;
    min-height:100%;
    color:#fff;
    z-index:-1;
}
.container-one-onm:hover .buy-btn-btn{
        background:#000;
    visibility:visible;
}
.container-one-onm:hover .buy-btn-btn::before{
    transition:1.5s ease;
    animation:loading 1.5s ease;
    
}
a,a:hover,a:focus{
    text-decoration:none;
}
@keyframes loading{
    100%{
        min-width:100%;
        background:#fff;
        opacity:1;
    }
    70%{
        opacity:0.7;
    }
    30%{
        background:#000;
        color:#fff;
        opacity:0.3;
    }
    
    0%{
        min-width:0%;
        background:#fff;
        color:#000;
        opacity:0;
    }
}
.buy-btn-btn:hover,.buy-btn-btn:focus{
    outline: none;
    border: none;
}


@keyframes wipe-enter {
    0%{
            transform: rotate(0deg);
    }
    40%{
            transform: rotate(45deg);
    }
    100%{
            transform: rotate(-45deg);
    }
}
@media(prefers-reduced-motion:no-preference){
.notify{
animation:wipe-enter 1s infinite;
}
} 
    .carousel-item{
        border-radius:5px;
    }
.displayless{
    border:none;
    background:transparent;
    color: #000;
    outline:none;
}
    .--yyyed{
        
    display: flex;
    flex-direction: column;
    justify-content: center;
    }
    .--ggd, .hehege{
        
    cursor: pointer;
    display: table-row;
    }
.displayless:hover{
    border:none;
    background:#000;
    color:#fff;
    outline:none;

    border-radius: 3px;
}
.displayless:focus{
    border:none;
    background:transparent;
    color:black;
    outline:none;

}
.all-prdt-king-show h6{
    font-size: small;
    user-select: none;
}
 /* helps style the hint content */
.hint {
    position: relative; /* helps position the hint content */
    border-bottom: 1px solid black;
 }
 .hint-content {
    color: #fff;
    background: #000;
    padding: 3px;
    border-radius: 5px;
    visibility: hidden; /* hides the hint content */
    
    /* positions the hint content */
    position: absolute;
    z-index: 1;
    text-align: center;
    width: 110px;
    margin-left: -55px; /* (width / 2) x -1 */
    left: 50%;
    top: 150%; /* to the top */
 }
 
 .orderinformation > .row > div.col-6,.orderinformation > .row > div.col-12 {
    color: #000;
}
.orderinformation>.row p{
  color: #000;
}
 .visible{
   visibility:visible;
 }
 .hint:hover > .hint-content {
    visibility: hidden; /* shows the hint content on mouse over */
 }
 .hint > .hint-content::after {
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 50%;
    z-index:10;
    margin-left: -5px;
    border: 5px solid transparent;
    border-bottom-color: #000;
 }
    .sideBar-c {
    background: #fff;
    border-radius: 8px;
    position: absolute;
    width: 80% !important;
    top: 2%;
    z-index: 9999; 
    height: 88%;
    left: 10%;
}
.side-c-d {
    background: rgb(0 0 0 / 63%);
    width: 100% !important;
    position: absolute !important;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 9998;
    
    min-width: 100% !important;
    max-width: 100% !important;
}
.side-categories ul, .side-sc-p ul {
    text-decoration: none;
    list-style-type: none;
    user-select: none;
    margin: 0;
    padding: 0;
    margin-top: 5px;
    min-height: 150px;
    max-height: 150px;
    overflow: hidden;
    overflow-y: auto;
    overflow-x: hidden;
   -ms-overflow-style: none;
    scrollbar-width: none;
}
.side-sc-p ul::-webkit-scrollbar,.side-categories ul::-webkit-scrollbar{
    display: none;

}
            /*<!------------------------------------>*/
            @media(max-width:1025px){
                .main-casehow{
                    height:66vh;
                }
            }
@media  (max-width:992px) {
    .span-col-socials {
        position: absolute;
        bottom: 3%;
        left: 15%;
    }
.main-casehow {
    height: 400px;
}
    .continer-fluid{
    overflow: hidden;
    overflow-y: hidden;
    overflow-x: auto;
}
.row-categories-cat {
    display: inline-flex;
    flex-wrap: nowrap;
    margin-bottom: 1rem;
    margin-top: 1rem;
    -ms-overflow-style: none;
    scrollbar-width: none;
}.row-categories-cat::-webkit-scrollbar{
    display: none;
}
.kingsconcept-name {
    width: 47%;}
    
.bars-bar-kc {
    width: 90%;
}
.slider {
    width: 31%;
}
.categories-cat {
    width: max-content;
    margin:0 4px;
    
    font-size: small;
}
.container-one-onm {
    width: calc(100% / 4 - 8px);
    margin: 4px;
}
.container-curve-kw-l {
    width: calc(100% / 4 - 8px);
    margin: 4px;
    padding: 10px;
}

    .category-kc-sub{
     flex-wrap:nowrap;  
     
    overflow: hidden;
    overflow-y: hidden;
    overflow-x: auto;
    
    padding-top: 2rem;
    padding-bottom: 2rem;
    }
    
.category-kc-sub::-webkit-scrollbar{
    display: none;
}
.category-kc-sub{
    -ms-overflow-style: none;
    scrollbar-width: none;
}
    .category-kc-sub>article>div.Img-prdt-100per img {
    width: 200px !important;
    height: auto !important;
    max-height: 200px;
    min-height: 200px;
}
    
    .category-kc-sub article{
    min-width: 210px;
    max-width: 210px;
    /*width: 430px;*/
    margin: 0 2px;
    }
}

@media  (max-width:768px) {
       .sideBar-c {
        top: 2%;
        width: 70% !important;
    }
    p.removeP a{
        font-size: large;
        padding: 10px;
        background: #000;
        color: #fff;
        text-decoration: none;
    }
.buy-btn-btn{
    visibility:visible;
    background:#000;
}
.kingsconcept-name {
    width: 33%;
    
    letter-spacing: 2px;
    font-size: x-large;
}
       span.discount-p-h{
           font-size:10px;
       } 
    .bars-bar-kc {
        width: 100%;
    }
    .slider {
        width: 31%;
    }
    

.colony-kc-pdt p.body-text {
    font-size: 25px;
}
.slide-dots {
    position: absolute;
    bottom: 3%;
    right: 0%;
    display: inline-block;
    width: 33%;
    z-index: 999;
}

    }
    
    @media (max-width: 600px) {
        
        .sideBar-c{
    -ms-overflow-style: none;
    scrollbar-width: none;
        
    }
        .sideBar-c::-webkit-scrollbar{
    display: none;

}
    .container-one-onm {
        width: calc(100% / 3 - 6px);
        margin: 3px;
    }
}
@media  (max-width:576px) {
 
    .carousel-control-next, .carousel-control-prev{
        display:none !important;
    }
.container-curve-kw-l,.container-one-onm{
    width: calc(100% / 2 - 4px);
    margin: 2px;

}

.main-casehow {
    padding: 0;
}
    .navigation-bars {
        display: flex;
        padding: 7px;
        flex-wrap: wrap;
}
    .kingsconcept-name {
        width: 100%;
        text-align: center;
    }
            
        .bars-bar-kc {
            width: 100%;
            
    text-align: center;

        }
        .slider {
            width: 31%;
        }
        .kingsconcept-place-bar{
    width: 100%;
    position: initial;
    display: flex;
    right: 10px;
    justify-content: space-evenly;
    align-items: center;}
.bars-bar-kc ul>li {
    padding: 0px 4px;
}.slide-dots {
    bottom: 2%;
    right: 3%;
}.span-col-socials {
    position: absolute;
    bottom: 11%;
    left: 7%;
}
span.dots {
    width: 24px;
    height: 9px;}
.slider {
    bottom: 7%;}
    .span-col-socials {
        position: absolute;
        bottom: 7%;
        left: 7%;
    }
.buy-btn {
    font-size: 12px;
    padding: 9px 25px;}
    .colony-kc-pdt p.body-text {
        font-size: 17px;
    }
    
.colony-kc-pdt h1 {
    font-size: 12px;}
    

   /* //////////////////////////////////////*/
   
   .main-casehow {
    overflow: hidden;
    width: 100%;
    height: 350px;
    padding: 0;
}
    .place-nav-ul{
        
    width: 100%;
    justify-content: space-around;
    display: flex;
    position: fixed;
    bottom: 0;
    padding: 3px;
    background: #f8f9fa;
    }
    .place-nav-ul button {
        padding:10px;
        margin: 5px;
        font-size: x-large;
        background: transparent;
        outline: none;
        border: none;
        justify-content: center;
        text-align: center;
        width: calc(100% / 5 - 10px);
        color: var(--dark);
        display: inline-flex;
    }
    .cart .badge {
        position: absolute;
        top: 4px;
        right: 13px;
    }
    .hint-content{
        display: none;
    }
    /*//////////////////////////////////////*/
    
    /*HHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH*/
    button.buy-btn-btn{

        font-size: initial;
    }.product-price-tag {
        margin: 0;
    /*display: inline-flex;*/
        line-height: normal;
    }.TprdtNam {
        font-size: small;
    }
    /*.prdt-proncing{*/
    /*    font-size: x-small;*/
    /*}*/
    .Img-prdt-100per img {
        width: 100%;
        height: 80px;}
    /*HHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH*/
        }




        @media  (max-width:425px) {
                .sideBar-c {
        width: 80% !important;
    }
            .Img-prdt-100per img {
    width: 100%;
    height: auto;
    object-fit: contain;
}
            footer{
                margin-bottom: 4rem;
            }
            .colony-kc-pdt p:nth-child(3) {
                width: 63%;
            }
.conta-img-l img {
    width: 100%;
    height: 120px;
    object-fit: contain;
}
            .container-one-onm {
    width: calc(100% / 2 - 4px);
    margin: 2px;
}
.container-curve-kw-l{
    width:100%;
}
            .main-casehow {
    overflow: hidden;
    width: 100%;
    height: 330px;
    padding: 0;
}
.span-col-socials{
    display: none;
}
.colony-kc-pdt {
    position: absolute;
    top: initial;
    bottom: 12%;
    left: 8%;
    display: none;
}
.colony-kc-pdt p.body-text {
    font-size: 8px;
    line-break: anywhere;
}.slider {
    right: 7%;
}
span.dots {
    text-align: right;
    bottom: 4%;
    right: 3%;
    width: 30px;
    }
    .slide-dots {
        bottom: 4%;
        width: 31%;
    }
    .bars-bar-kc>ul{
        padding:0
    }
    span.dots {
        text-align: right;
        bottom: 4%;
        right: 3%;
        width: 12px;
        height: 7px;
    }
.span-col-socials {
    bottom: 2%;
    left: 15%;
}
.kingsconcept-place-bar{
    top: 8%;
}
.buy-btn {
    font-size: 12px;
    padding: 10px 30px;}
.colony-kc-pdt h1 {
    color: #1f1f25;
    font-size: 11px;}
    }
        @media  (max-width:300px) {
            .buy-btn {
    font-size: 12px;
    padding: 8px 3px;
}
            .colony-kc-pdt p.body-text {
    font-size: 14px;
}
.colony-kc-pdt h1 {
    color: #1f1f25;
    font-size: 9px;
}
.colony-kc-pdt p:nth-child(3) {
    width: 78%;
    font-size: small;
    margin: 0;
}
.span-col-socials {
    bottom: 8%;
    left: 15%;
}
.slide-dots {
    bottom: 15%;
    width: 31%;
}
span.dots {
    text-align: right;
    bottom: 4%;
    right: 3%;
    width: 11px;
    height: 8px;
}     

.conta-img-l img {
    width: 100%;
    height: 130px;
    object-fit: contain;
}
.main-casehow {
    overflow: hidden;
    width: 100%;
    height: 235px;
    padding: 0;
}   
}

/* Trigger  */
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
  }

/* Optional Delays, change values here  */
.one { animation-delay: 0.2s; }
.two { animation-delay: .6s; }
.three { animation-delay: 1s; }
.four { animation-delay: 1.4s; }

/* Animations start here  */

/* FADE IN  */

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; } }
.fadeIn { animation-name: fadeIn; }


/* FADE IN DOWN */

@keyframes fadeInDown {
  from { opacity: 0; transform: translate3d(0, -100%, 0); }
  to { opacity: 1; transform: none; } }
.fadeInDown { animation-name: fadeInDown; }

/* FADE IN UP */

@keyframes fadeInUp {
  from { opacity: 0; transform: translate3d(0, 20px, 0); }
  to { opacity: 1; transform: none; } }
.fadeInUp { animation-name: fadeInUp; }

/* FADE IN UP BIG */

@keyframes fadeInUpBig {
  from { opacity: 0; transform: translate3d(0, 100px, 0); }
  to { opacity: 1; transform: none; } }
.fadeInUpBig { animation-name: fadeInUpBig; }

/* FADE IN LEFT */

@keyframes fadeInLeft {
  from { opacity: 0; transform: translate3d(-30px, 0, 0)rotateZ(30deg); }
  to { opacity: 1; transform: none; } }
.fadeInLeft { animation-name: fadeInLeft; }

/* FADE IN LEFT BIG */

@keyframes fadeInLeftBig {
  from { opacity: 0; transform: translate3d(-100px, 0, 0); }
  to { opacity: 1; transform: none; } }
.fadeInLeftBig { animation-name: fadeInLeftBig; }

/* FADE IN RIGHT */

@keyframes fadeInRight {
  from { opacity: 0; transform: translate3d(100%, 0, 0); }
  to { opacity: 1; transform: none; } }
.fadeInRight { animation-name: fadeInRight; }

/* @end standaard animaties  */


.callout {
  max-width: 500px;
  margin:0 auto;
  padding-bottom:100px
}

.in-view {
  animation: fadeInUp 2s;
  }

.in-view {  
   animation: fadeInLeftBig;
    animation-duration: 1s;
   animation-delay: 0s;
  animation-fill-mode: both;
   backface-visibility: hidden;
}