:root{
    --purple: #44812c;
    --brown: #db9f45;
    --marinho: #289ecd;
    --green: #4ccd28;
    --deeppurple: #4e1570;
    --blue: #21539f;
    --lightblue: #2968c8;
    --orange: #FF8C00;
    --rosa: #fecddf;
    --red: #dd3b3b;

}
body{
    margin: 0;
    padding:0;
    box-sizing: border-box;
}

@media (max-width: 480px) {
    .arrow {
        position: fixed;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%) rotate(45deg);
        width: 40px;
        height: 40px;
        border-bottom: 2px solid #0c0c0c;
        border-right: 2px solid #070707;
        transition: transform 0.2s ease-in-out;
    }

    @media (max-width: 480px){
        p{
            font-size: 8px;
        }
    }
}

@media (max-width: 480px) {
    #mobile-div {
        display: none;
    }
}

.banner {
    background-color: #153E35;
    padding: 20px;
    text-align: center;
}
@media screen and (max-width: 900px) {
    .banner {
        padding:10px;
        margin-top: 0;
    }
}



.banner3 {
    padding: 20px;
    text-align: center;
}

.banner h1 {
    color: white;
    font-size: 24px;
}

@media screen and (max-width: 900px) {
    .banner h1 {
        font-size: 4vw;
        margin-top: 10px;
    }
}


.direction{
    text-align: center;
}

.direction button{
    font-family: cursive;
    font-weight: bold;
    background-color: #ffffff44;
    border: none;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    transition: 0.5s;
    margin: 0 10px;
}

.float-container {
    border: 3px solid #fff;
    padding: 20px;
}

.float-child {
    width: 50%;
    float: left;
    padding: 20px;
}

.green{
    background-color: #ddd;
    width: 500px;
    height: 400px;
}
.green h1{
    align-items: center;
    justify-content: center;
    display: flex;
}

.green img{
    width: 500px;
    height: 300px;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.item{
    border-radius: 15px;
    width: 300px;
    height: 130px;
    background-image: linear-gradient(to top,#AEC0CE, #ECECEC);
    transition: 0.5s;
    margin: 10px;
}

.item .avatar{
    display: block;
    margin: 50px auto 10px;
    width: 100px;
    height: 150px;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 10px 15px #7e878d ;

}

.item .content{
    padding:30px;
    font-family: monospace;

}

#list{
    display: flex;
    width: max-content;
}

#formlist {

    max-width: 100%;
    margin: 100px auto;
    scroll-behavior: smooth;
    overflow-scrolling: auto;


}
#formlist::-webkit-scrollbar{
    display: none;
}


.slider-area h2 {
    text-align: center;
    font-family: impact;
    font-size: 60px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 100px 0 30px 0;
    color: #fff;
}
.wrapper2 {
    display: flex;
    height: 200px;
    width: 1280px;
    overflow: hidden;
    padding: 2.5rem;
    background: #fff;
    margin-bottom: 30px;
}
.item {
    animation: animate 25s alternate linear infinite;
}
.container:hover .item {
    animation-play-state: paused;
}
@keyframes animate {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-1280px, 0, 0);
    }
}
@media (max-width:767px) {
    .slider-area h2 {
        font-size: 30px;
    }
    .wrapper2 {
        width: 95%;
        border-radius: 0;
        padding: 0;
    }
}

@import url(https://fonts.googleapis.com/css?family=Alegreya+Sans:300);

body {
    font-family: 'Alegreya Sans', sans-serif;
}

/* Sticky footer position and size
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}
body {
    /* Margin bottom by footer height */
    margin-bottom: 300px;
}
.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 300px;
}

/* Taller footer on small screens */
@media (max-width: 567em) {
    body {
        margin-bottom: 700px;
    }
    .footer {
        height: 700px;
    }
}

/* Sticky footer style and color
-------------------------------------------------- */
footer {
    padding-top: 30px;
    background-color: #292c2f;
    color: #bbb;
}

footer a {
    color: #999;
    text-decoration:none;
}

footer a:hover, footer a:focus {
    color: #aaa;
    text-decoration:none;
    border-bottom:1px dotted #999;
}

footer .form-control {
    background-color: #1f2022;
    box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.1);
    border: none;
    resize: none;
    color: #d1d2d2;
    padding: 0.7em 1em;
}

.inputnew{
    width: 33%; !important
    border: 1px solid #ccc;
    border-radius: 3px;
}

.dashed {
    border: 2px solid white;
}



@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');

.wrapper {
    max-width: 1280px;
    width: 100%;
    position: relative;
    justify-content: center;
    margin-top: 60px; !important
    align-content: center;
}
.wrapper i {
    top: 50%;
    height: 50px;
    width: 50px;
    cursor: pointer;
    font-size: 1.25rem;
    position: absolute;
    text-align: center;
    line-height: 50px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 3px 6px rgba(0,0,0,0.23);
    transform: translateY(-50%);
    transition: transform 0.1s linear;
}
.wrapper i:active{
    transform: translateY(-50%) scale(0.85);
}
.wrapper i:first-child{
}
.wrapper i:last-child{
    right: -22px;
}
.wrapper .carousel{
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% / 3) - 12px);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 16px;
    margin: auto;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    scroll-behavior: smooth;
    scrollbar-width: none;
}
.carousel::-webkit-scrollbar {
    display: none;
}
.carousel.no-transition {
    scroll-behavior: auto;
}
.carousel.dragging {
    scroll-snap-type: none;
    scroll-behavior: auto;
}
.carousel.dragging .card2 {
    cursor: grab;
    user-select: none;
}
.carousel :where(.card2, .img) {
    display: flex;
    justify-content: center;
    align-items: center;
}
.carousel .card2 {
    scroll-snap-align: start;
    height: 342px;
    list-style: none;
    background: #fff;
    cursor: pointer;
    padding-bottom: 15px;
    flex-direction: column;
    border-radius: 8px;
}
.carousel .card2 .img {
    height: 300px;
    width: 300px;
    border-radius: 50%;
}
.card2 .img img {
    width: 300px;
    height: 500px;
    object-fit: cover;
    border-radius: 30px;
    box-shadow: 4px 4px 4px 4px rgba(0, 0, 0, 0.56);
}
.carousel .card2 h2 {
    font-weight: 500;
    font-size: 1.56rem;
    margin: 30px 0 5px;
}
.carousel .card2 span {
    color: #6A6D78;
    font-size: 1.31rem;
}
@media screen and (max-width: 900px) {
    .wrapper .carousel {
        grid-auto-columns: calc((100% / 2) - 9px);
    }
}
@media screen and (max-width: 600px) {
    .wrapper .carousel {
        grid-auto-columns: 100%;
    }
}

@media screen and (max-width: 1024px){
    .item{
        width: calc(33.3vw - 20px);
    }
}

@media screen and (max-width: 768px){
    .item{
        width: calc(50vw - 20px);
    }
}



.direction button:hover{
    background-color: #fff;
}


.arrow1 {
    animation: slide1 1s ease-in-out infinite;
    margin-left: 9px;
    color: white;
}
@media (max-width: 480px){
    .two {
        display: flex;
        justify-content: center;
        align-items: center;
        object-fit: scale-down;
        background-size: cover;
        max-width: 100%;
        max-height: 100%;
        background-image: url(/img/wood.jpg);

    }
}
.two{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/wood.jpg);
}
.three{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/glass.jpg);
}
.four{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/lava.jpg);
}
.five{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/purple.jpg);
}
.six{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/e10.jpg);
}
.seven{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/fundo.jpg);
}
.eight{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/desen.jpg);
}
.nine{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/inodoro.jpg);
}
.ten{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/wcc.jpg);
}
.one{
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: scale-down;
    background-size: cover;
    max-width: 100%;
    max-height: 100%;
    background-image: url(/img/pavi.jpg);
}

@keyframes slide1 {
    0%,
    100% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(10px, 0);
    }
}


.sidebar{
    position: fixed;
    top: 50%;
    margin: 0;
    padding: 0;
    transform: translateY(-50%);
    z-index: 1;
    left: -160px;
}
.sidebar:hover{
    left: 0;
}
.sidebar2 {
    list-style: none;
}

.sidebar3{
    display: block;
    text-decoration: none;
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    background: #fff;
    width: 200px;
    color: #262626;
    margin: 4px 0;
    padding-left: 15px;
    text-transform: uppercase;
    border-bottom-right-radius: 15px;
    border-top-right-radius: 15px;
    scroll-behavior: smooth;
}

.sidebar3:hover{
    background: #262626;
    color: #fff;
    left: 0;
    text-decoration: none;
}

.section-container{
    scroll-snap-type: y mandatory;
    overflow-y:scroll ;
    height: 100vh;

}


.cartao{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--purple);
    filter: drop-shadow(0 0 10px var(--purple)) drop-shadow( 0 0 60px var(--purple) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--purple);
    transition-delay: 0.5s;
}

.cartao .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao .conteudo p {
    color: #fff;
}

.cartao .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}

.cartao2{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao2:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao2 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao2 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--brown);
    filter: drop-shadow(0 0 10px var(--brown)) drop-shadow( 0 0 60px var(--brown) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao2:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--brown);
    transition-delay: 0.5s;
}

.cartao2 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao2:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao2 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao2:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao2 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao2:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao2 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao2 .conteudo p {
    color: #fff;
}

.cartao2 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}

.cartao3{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao3:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao3 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao3 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--marinho);
    filter: drop-shadow(0 0 10px var(--marinho)) drop-shadow( 0 0 60px var(--marinho) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao3:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--marinho);
    transition-delay: 0.5s;
}

.cartao3 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao3:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao3 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao3:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao3 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao3:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao3 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao3 .conteudo p {
    color: #fff;
}

.cartao3 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}
.cartao4{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao4:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao4 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao4 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--green);
    filter: drop-shadow(0 0 10px var(--green)) drop-shadow( 0 0 60px var(--green) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao4:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--green);
    transition-delay: 0.5s;
}

.cartao4 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao4:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao4 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao4:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao4 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao4:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao4 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao4 .conteudo p {
    color: #fff;
}

.cartao4 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}
.cartao5{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao5:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao5 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao5 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--deeppurple);
    filter: drop-shadow(0 0 10px var(--deeppurple)) drop-shadow( 0 0 60px var(--deeppurple) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao5:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--deeppurple);
    transition-delay: 0.5s;
}

.cartao5 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao5:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao5 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao5:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao5 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao5:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao5 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao5 .conteudo p {
    color: #fff;
}

.cartao5 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}
.cartao6{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao6:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao6 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao6 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--blue);
    filter: drop-shadow(0 0 10px var(--blue)) drop-shadow( 0 0 60px var(--blue) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao6:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--blue);
    transition-delay: 0.5s;
}

.cartao6 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao6:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao6 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao6:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao6 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao6:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao6 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao6 .conteudo p {
    color: #fff;
}

.cartao6 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}
.cartao7{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao7:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao7 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao7 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--lightblue);
    filter: drop-shadow(0 0 10px var(--lightblue)) drop-shadow( 0 0 60px var(--lightblue) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao7:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--lightblue);
    transition-delay: 0.5s;
}

.cartao7 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao7:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao7 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao7:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao7 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao7:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao7 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao7 .conteudo p {
    color: #fff;
}

.cartao7 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}
.cartao8{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao8:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao8 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao8 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--orange);
    filter: drop-shadow(0 0 10px var(--orange)) drop-shadow( 0 0 60px var(--orange) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao8:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--orange);
    transition-delay: 0.5s;
}

.cartao8 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao8:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao8 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao8:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao8 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao8:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao8 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao8 .conteudo p {
    color: #fff;
}

.cartao8 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}
.cartao9{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao9:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao9 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao9 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--rosa);
    filter: drop-shadow(0 0 10px var(--rosa)) drop-shadow( 0 0 60px var(--rosa) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao9:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--rosa);
    transition-delay: 0.5s;
}

.cartao9 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao9:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao9 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao9:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao9 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao9:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao9 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao9 .conteudo p {
    color: #fff;
}

.cartao9 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}
.cartao10{
    position: relative;
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    transition: 0.5s;
    border-radius: 20px;
}
.cartao10:hover{
    width: 600px;
    transition-delay: 0.5s;
}
.cartao10 .circle{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cartao10 .circle:before{
    content: '';
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    width: 350px;
    height: 350px;
    border: 8px solid var(--red);
    filter: drop-shadow(0 0 10px var(--red)) drop-shadow( 0 0 60px var(--red) );
    transition:  0.5s background 0.5s ;
    transition-delay: 0.75s,1s;
}
.cartao10:hover .circle::before{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: var(--red);
    transition-delay: 0.5s;
}

.cartao10 .circle .imagem{
    position: relative;
    width: 150px;
    transition-delay: 0.5s;
    transition: 0.5s;

}

.cartao10:hover .circle .imagem{
    transform: scale(0);
    transition-delay: 0s;
}

.cartao10 .product_img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0) rotate(315deg);
    height: 300px;
    transition: 0.5s ease-in-out;
}

.cartao10:hover .product_img{
    transition-delay: 0.75s;
    top: 25%;
    left:72%;
    transform: translate(-50%,-50%) scale(1) rotate(15deg);

}

.cartao10 .conteudo{
    position: absolute;
    width: 50%;
    left: 20%;
    padding: 20px 20px 20px 40px;
    opacity: 0;
    transition: 0.5s;
    visibility: hidden;
}
.cartao10:hover .conteudo{
    transition-delay: 0.75s;
    opacity: 1;
    visibility: visible;
    left: 0;
}
.cartao10 .conteudo h2{
    color: #fff;
    text-transform: uppercase;
    font-size: 2.5rem;
    line-height: 1em;
}
.cartao10 .conteudo p {
    color: #fff;
}

.cartao10 .conteudo a{
    position: relative;
    color: #111;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    font-weight: 600;
}



.buy-button{

    background-color: white;
    text-align: center;
    justify-content: center;
    position: center;
    align-content: center;
    align-items: center;
    vertical-align: middle;
    border: 1px solid transparent;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.6;
    border-radius: 4px;
    user-select: none;

}

.buy-button :hover{
    margin-left: 60px;
    background-color: white;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    border: 1px solid transparent;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.6;
    border-radius: 4px;
    user-select: none;

}


.hey{
    justify-content: center;
    display: flex;
    align-items: center ;
    height: 60vh;

}
.hey1{
    justify-content: center;
    display: flex;
    align-items: center ;
    height: 70vh;

}

.section-container .hey .imagem{
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-container::-webkit-scrollbar {
    display: none;  /* Safari and Chrome */
}

section .foot {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    scroll-snap-align: start;
}


section {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    scroll-snap-align: start;
}


section .leaf{
    position: relative;
    display: -webkit-inline-flex;
    width:100%;
    height:15%;
    bottom: 0;
    margin-top: -100px;
}
.leaf div{
    position:absolute ;
    display:block ;
}
.leaf div:nth-child(1){
    left:20%;
    animation:fall 15s linear infinite ;
    animation-delay:-2s;

}
.leaf div:nth-child(2){
    left:70%;
    animation:fall 15s linear infinite ;
    animation-delay:-4s;
}
.leaf div:nth-child(3){
    left:10%;
    animation:fall 20s linear infinite ;
    animation-delay:-7s;

}
.leaf div:nth-child(4){
    left:50%;
    animation:fall 18s linear infinite ;
    animation-delay:-5s;
}
.leaf div:nth-child(5){
    left:85%;
    animation:fall 14s linear infinite ;
    animation-delay:-5s;
}
.leaf div:nth-child(6){
    left:15%;
    animation:fall 16s linear infinite ;
    animation-delay:-10s;
}
.leaf div:nth-child(7){
    left:90%;
    animation:fall 15s linear infinite ;
    animation-delay:-4s;
}

@keyframes fall{
    0%{
        opacity:1;
        top:-10%;
        transform:translateX(20px) rotate(0deg);
    }
    20%{
        opacity:0.8;
        transform:translateX(-20px) rotate(45deg);
    }
    40%{

        transform:translateX(-20px) rotate(90deg);
    }
    60%{

        transform:translateX(-20px) rotate(135deg);
    }
    80%{

        transform:translateX(-20px) rotate(180deg);
    }
    100%{

        top:110%;
        transform:translateX(-20px) rotate(225deg);
    }
}
.leaf1{
    transform: rotateX(180deg);
}






/*body{*/
/*    background:#000;*/
/*}*/
/*.wrap {*/
/*    height: 100px;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*}*/

/*.buy-button{*/
/*    background-color: #65ae4d;*/
/*    color: white;*/
/*    padding: 12px 20px;*/
/*    border: none;*/
/*    cursor: pointer;*/
/*    font-size: 16px;*/
/*    border-radius: 10px;*/
/*}*/

/*.buy-button:hover{*/
/*    background-color: #3e8e41;*/
/*}*/

/*!*.button {*!*/
/*!*    min-width: 300px;*!*/
/*!*    min-height: 60px;*!*/
/*!*    font-family: 'Nunito', sans-serif;*!*/
/*!*    font-size: 22px;*!*/
/*!*    text-transform: uppercase;*!*/
/*!*    letter-spacing: 1.3px;*!*/
/*!*    font-weight: 700;*!*/
/*!*    color: #313133;*!*/
/*!*    background: #58d14f;*!*/
/*!*    border: none;*!*/
/*!*    border-radius: 800px;*!*/
/*!*    box-shadow: 12px 12px 24px rgb(98, 209, 79);*!*/
/*!*    cursor: pointer;*!*/
/*!*    outline: none;*!*/
/*!*    position: relative;*!*/
/*!*    padding: 10px;*!*/
/*!*}*!*/

/*!*button::before {*!*/
/*!*    content: '';*!*/
/*!*    border-radius: 1000px;*!*/
/*!*    min-width: calc(300px + 12px);*!*/
/*!*    min-height: calc(60px + 12px);*!*/
/*!*    box-shadow: 0 0 60px rgb(32, 126, 11);*!*/
/*!*    position: absolute;*!*/
/*!*    top: 50%;*!*/
/*!*    left: 50%;*!*/
/*!*    transform: translate(-50%, -50%);*!*/
/*!*    opacity: 0;*!*/
/*!*    transition: all .3s ease-in-out 0s;*!*/
/*!*}*!*/

/*!*.button:hover, .button:focus {*!*/
/*!*    color: #313133;*!*/
/*!*    transform: translateY(-6px);*!*/
/*!*}*!*/

/*!*button:hover::before, button:focus::before {*!*/
/*!*    opacity: 1;*!*/
/*!*}*!*/

/*!*button::after {*!*/
/*!*    content: '';*!*/
/*!*    width: 30px; height: 30px;*!*/
/*!*    border-radius: 100%;*!*/
/*!*    border: 6px solid #11ff00;*!*/
/*!*    position: absolute;*!*/
/*!*    z-index: -1;*!*/
/*!*    top: 50%;*!*/
/*!*    left: 50%;*!*/
/*!*    transform: translate(-50%, -50%);*!*/
/*!*}*!*/

/*!*button:hover::after, button:focus::after {*!*/
/*!*    animation: none;*!*/
/*!*    display: none;*!*/
/*!*}*!*/

/*section.awSlider .carousel{*/
/*    display:table;*/
/*    z-index:2;*/
/*    -moz-box-shadow: 0 0 4px #444;*/
/*    -webkit-box-shadow: 0 0 4px #444;*/
/*    box-shadow: 0 0 15px rgba(1,1,1,.5);*/
/*}*/

/*section.awSlider{*/
/*    margin:30px auto;*/
/*    padding:30px;*/
/*    position:relative;*/
/*    display:table;*/
/*    -webkit-touch-callout: none;*/
/*    -webkit-user-select: none;*/
/*    -khtml-user-select: none;*/
/*    -moz-user-select: none;*/
/*    -ms-user-select: none;*/
/*    user-select: none;*/
/*}*/

/*section.awSlider:hover > img{*/
/*    -ms-transform: scale(1.2);*/
/*    -webkit-transform: scale(1.2);*/
/*    transform: scale(1.2);*/
/*    opacity:1;*/
/*}*/

/*section.awSlider img{*/
/*    pointer-events: none;*/
/*}*/

/*section.awSlider > img{*/
/*    position:absolute;*/
/*    top:30px;*/
/*    z-index:1;*/
/*    transition:all .3s;*/
/*    filter: blur(1.8vw);*/
/*    -webkit-filter: blur(2vw);*/
/*    -moz-filter: blur(2vw);*/
/*    -o-filter: blur(2vw);*/
/*    -ms-filter: blur(2vw);*/
/*    -ms-transform: scale(1.1);*/
/*    -webkit-transform: scale(1.1);*/
/*    transform: scale(1.1);*/
/*    opacity:.5;*/
/*}*/



/*.product-container {*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    flex-wrap: wrap;*/
/*    margin-bottom: 30px;*/
/*}*/

/*.product {*/
/*    padding: 10px;*/
/*    margin-top: 30px;*/
/*    width: 33%;*/
/*    cursor: pointer;*/
/*}*/

/*.product:hover{*/
/*    transform: scale(1.04);*/
/*    transition-duration: 0.3s;*/
/*}*/

/*.product:last-child,*/
/*.product:first-child {*/
/*    margin-right: auto;*/
/*}*/

/*.product-img {*/
/*    position: relative;*/
/*    width: 100%;*/
/*    height: 200px;*/
/*    background: no-repeat center center;*/
/*    background-color: #f8f5f0 ;*/
/*    background-size: 100%;*/
/*}*/

/*.product-img a {*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    display: block;*/
/*}*/

/*.product-img__price {*/
/*    position: absolute;*/
/*    right: -5px;*/
/*    top: 70%;*/
/*    color: #fff;*/
/*    font-weight: bold;*/
/*    background-color: #f8f5f0 ;*/
/*    padding: 5px 15px;*/
/*}*/

/*.product-desc {*/
/*    !*display: flex;*/
/*    flex-direction: column;*/
/*    height: 30px;*/
/*    justify-content: space-between;*!*/
/*    position: relative;*/
/*    width: 100%;*/
/*    background: no-repeat center center;*/
/*    background-size: contain;*/
/*    background-color: #f8f5f0 ;*/
/*}*/

/*.product-desc__title {*/
/*    padding-top: 10px;*/
/*    text-align: center;*/
/*    display: block;*/
/*}*/

/*.product-price {*/
/*    text-align: center;*/
/*    color: #0d3625;*/
/*    font-weight: bold;*/
/*    font-size: 12px;*/
/*    display: block;*/
/*}*/

/*.btn-add {*/
/*    margin: 15px 0;*/
/*    border: 2px solid var(--main-color);*/
/*    background-color: transparent;*/
/*    float: right;*/
/*}*/

/*.btn-add:hover {*/
/*    color: #fff;*/
/*    background-color: var(--main-color);*/
/*}*/

/*@media (max-width: 991px) {*/
/*    .product {*/
/*        width: 100%;*/
/*    }*/
/*}*/


/*.add-cart {*/
/*    font-size: 15px;*/
/*    background-color:#ffffff;*/
/*    border:0.1px solid rgba(13, 54, 37, 0.68);*/
/*    display: block;*/
/*    cursor:pointer;*/
/*    color:#0d3625;*/
/*    font-weight:bold;*/
/*    padding:10px 40px;*/
/*    text-decoration:none;*/
/*    width: 100%;*/
/*    text-align: center;*/
/*    margin-top: 4px;*/
/*}*/
/*.add-cart:hover {*/
/*    background-color: rgba(13, 54, 37, 0.68);*/
/*    color: white;*/
/*    text-decoration: none;*/
/*}*/
/*.add-cart:active {*/
/*    position:relative;*/
/*    top:1px;*/
/*}*/

/*.text{*/
/*    margin-left: 40px;*/
/*    margin-top: 100px;*/
/*    width: 373px;*/
/*    height: 40px;*/
/*    text-align: left;*/
/*    font: normal normal bold 40px/60px Axiforma;*/
/*    letter-spacing: 0px;*/
/*    color: #446E5F;*/
/*    text-transform: uppercase;*/
/*    opacity: 1;*/

/*}*/
/*.text-h1{*/
/*    margin-left: 40px;*/
/*    margin-top: 48px;*/
/*    width: 574px;*/
/*    height: 290px;*/
/*    text-align: left;*/
/*    font: normal normal bold 70px/100px Axiforma;*/
/*    letter-spacing: 0px;*/

/*}*/

/*.mainprod{*/

/*    float: right;*/
/*    width: 700px;*/
/*    height: 400px;*/
/*    opacity: 1;*/
/*}*/
/*.row{*/
/*    display: flex;*/
/*    align-items: center;*/
/*    flex-wrap: wrap;*/
/*    justify-content: space-around;*/
/*    width: 100%;*/
/*}*/
/*.row2{*/
/*    display: flex;*/
/*    align-items: center;*/
/*    flex-wrap: wrap;*/
/*    justify-content: space-around;*/
/*    background-color: #E3E6E0;*/
/*    width: 100%;*/
/*}*/
/*.row3{*/
/*    display: flex;*/
/*    align-items: center;*/
/*    flex-wrap: wrap;*/
/*    justify-content: space-around;*/
/*    background-color: #E3E6E0;*/
/*    width: 100%;*/
/*}*/
/*.row4{*/
/*    display: flex;*/
/*    align-items: center;*/
/*    flex-wrap: wrap;*/
/*    justify-content: space-around;*/
/*    background-color: #E3E6E0;*/
/*    width: 100%;*/
/*}*/
/*.col-2{*/
/*    flex-basis: 50%;*/
/*    min-width: 400px;*/
/*}*/
/*.col-2 img{*/
/*    max-width: 100%;*/
/*    padding: 50px 0;*/
/*}*/
/*.col-2 p{*/
/*    font-size: 40px;*/
/*    color: grey;*/
/*}*/
/*.col-2 h1{*/
/*    font-size: 60px;*/
/*    color: #446E5F;*/
/*}*/
/*.col-2b{*/
/*    flex-basis: 50%;*/
/*    min-width: 400px;*/

/*}*/
/*.col-2b img{*/
/*    max-width: 100%;*/
/*    padding: 50px 0;*/
/*}*/
/*.col-2b p{*/
/*    font-size: 18px;*/
/*    color: #446E5F;*/
/*    margin-left: 15px;*/
/*}*/
/*.col-2b h1{*/
/*    font-size: 30px;*/
/*    color: #446E5F;*/
/*    margin-left: 15px;*/
/*}*/
/*.col-2c{*/
/*    flex-basis: 50%;*/
/*    min-width: 500px;*/
/*}*/
/*.col-2c img{*/
/*    max-width: 100%;*/
/*    padding: 50px 0;*/
/*}*/
/*.col-2c p{*/
/*    font-size: 18px;*/
/*    color: #446E5F;*/
/*    margin-left: 60px;*/
/*}*/
/*.col-2c h1{*/
/*    font-size: 30px;*/
/*    color: #446E5F;*/
/*    margin-left: 60px;*/
/*}*/
/*.col-2d{*/
/*    flex-basis: 50%;*/
/*    min-width: 500px;*/
/*}*/
/*.col-2d img{*/
/*    max-width: 60px;*/
/*    padding: 30px 0;*/
/*    margin-left: 60px;*/
/*}*/
/*.col-2d li{*/
/*    font-size: 18px;*/
/*    color: #446E5F;*/
/*    margin-left: 60px;*/
/*}*/
/*.col-2d h1{*/
/*    font-size: 30px;*/
/*    color: #446E5F;*/
/*    margin-left: 60px;*/
/*}*/
/*.col-2e{*/
/*    flex-basis: 50%;*/
/*    min-width: 500px;*/
/*}*/
/*.col-2e img{*/
/*    max-width: 60px;*/
/*    padding: 30px 0;*/
/*    margin-left: 60px;*/
/*}*/
/*.col-2e li{*/
/*    font-size: 18px;*/
/*    color: #446E5F;*/
/*    margin-left: 60px;*/
/*}*/
/*.col-2e h1{*/
/*    font-size: 30px;*/
/*    color: #446E5F;*/
/*    margin-left: 60px;*/
/*}*/
/*.btn-new{*/
/*    display:inline-block;*/
/*    padding:0.35em 1.2em;*/
/*    border:0.1em solid black;*/
/*    margin:0 0.3em 0.3em 0;*/
/*    border-radius:0.12em;*/
/*    box-sizing: border-box;*/
/*    text-decoration:none;*/
/*    font-family:'Roboto',sans-serif;*/
/*    font-weight:300;*/
/*    color:forestgreen;*/
/*    text-align:center;*/
/*    transition: all 0.2s;*/
/*    margin-top: 20px;*/
/*}*/
/*.btn-new:hover{*/
/*    color:#000000;*/
/*    background-color:#FFFFFF;*/
/*}*/
/*@media all and (max-width:30em){*/
/*    .btn-new{*/
/*        display:block;*/
/*        margin:0.4em auto;*/
/*    }*/
/*}*/

/*.imgbreak{*/
/*    display: inline-block;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    overflow: auto;*/
/*    object-fit: cover;*/
/*    object-position: bottom;*/
/*}*/

/*.imgbreak2{*/
/*    display: inline-block;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    overflow: auto;*/
/*    background-color: #f8f5f0;*/
/*}*/
/*.container{*/
/*    width: 100%;*/
/*}*/

/*.imgnew h1{*/
/*    position: absolute;*/
/*    color: #fff;*/
/*    font-size: 40px;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*    display: flex;*/
/*    text-align:center;*/
/*}*/
/*.box{*/
/*    display: inline-block;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    overflow: auto;*/
/*}*/
/*.box2{*/
/*    display: inline-block;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    overflow: auto;*/
/*}*/
/*.texto h1{*/
/*    color: #fff;*/
/*}*/
/*.texto p{*/
/*    color: #fff;*/
/*}*/
/*.texto{*/
/*    position: absolute;*/
/*    margin: 0 auto;*/
/*    left: 0;*/
/*    right: 0;*/
/*    top: 140%; !* Adjust this value to move the positioned div up and down *!*/
/*    text-align: center;*/
/*    width: 60%; !* Set the width of the positioned div *!*/
/*}*/
/*.texto2{*/
/*    position: absolute;*/
/*    margin: 0 auto;*/
/*    left: 0;*/
/*    right: 0;*/
/*    text-align: center;*/
/*    width: 60%; !* Set the width of the positioned div *!*/
/*}*/
/*.texto3{*/
/*    position: absolute;*/
/*    margin: 0 auto;*/
/*    left: 0;*/
/*    right: 0;*/
/*    text-align: center;*/
/*    width: 60%; !* Set the width of the positioned div *!*/
/*}*/
/*.texto2 h1{*/
/*    color: #446E5F;*/
/*}*/

/*#panel {*/
/*    display: none;*/
/*}*/
/*#row3, .flip {*/
/*    text-align: center;*/
/*    color: #446E5F;*/
/*}*/

/*#row3 {*/
/*    display: none;*/
/*}*/

/*body {*/
/*    margin: 0;*/
/*    padding: 0;*/
/*}*/

/*!*!* Media Queries: Tablet Landscape *!*!*/
/*!*@media screen and (max-width: 1060px) {*!*/
/*!*    #primary { width:67%; }*!*/
/*!*    #secondary { width:30%; margin-left:3%;}*!*/
/*!*}*!*/

/*!*!* Media Queries: Tabled Portrait *!*!*/
/*!*@media screen and (max-width: 768px) {*!*/
/*!*    #primary { width:100%; }*!*/
/*!*    #secondary { width:100%; margin:0; border:none; }*!*/
/*!*}*!*/

/*!*@media (min-device-width:600px) {*!*/
/*!*    img[data-src-600px] {*!*/
/*!*        content: attr(data-src-600px, url);*!*/
/*!*    }*!*/
/*!*}*!*/

/*!*@media (min-device-width:800px) {*!*/
/*!*    img[data-src-800px] {*!*/
/*!*        content: attr(data-src-800px, url);*!*/
/*!*    }*!*/
/*!*}*!*/
/*!*@media (min-width: 640px) { body {font-size:1rem;} }*!*/
/*!*@media (min-width:960px) { body {font-size:1.2rem;} }*!*/
/*!*@media (min-width:1100px) { body {font-size:1.5rem;} }*!*/