@import url('./bulma.min.css');
@import url('https://fonts.googleapis.com/css?family=Indie+Flower|Josefin+Sans|Ubuntu|Poppins|Lato');

body, button, input, select, textarea {
    font-family: 'Poppins', sans-serif;

}

html, body {
    background-color: #080e19;
}

html {
    scroll-behavior: smooth;
}

.title, .subtitle {
    color: #ffffff;
}

.hero.is-global .title {
    text-shadow: 3px 3px 2px rgba(0, 0, 0, 0.5);
    font-size: 3rem;
}

.hero.is-global {
    margin-top: -8em;
    color: #ffffff;
    background: #4b6cb7;
    background: -webkit-linear-gradient(to right top, #182848, #4b6cb7);
    background: linear-gradient(to right top, #182848, #4b6cb7);
    transform: skewY(-5deg);
    margin-bottom: 3rem;
}

.hero.hero.is-global .title {
    vertical-align: center;
    margin: auto auto 1.5rem auto;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.36);
    font-size: 3rem;
}

.hero.hero.is-global .title .profile {
    height: 150px;
    width: auto;
    border-radius: 50%;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.36);
    display: block;
    margin: auto auto .5rem auto;
}

.hero.is-global .hero-body {
    margin-top: 10rem;
    transform: skewY(5deg);
    margin-bottom: 3rem;
}

@media screen and (min-width: 769px), print {
    .hero.is-global .subtitle {
        width: 550px;
        margin: auto;
    }
}

.hero.is-global .hero-body .button {
    margin: 1.5rem auto auto;
}

.button.is-primary {
    transition: 0.3s;
    background-color: #4b6cb7;
}

.button.is-primary.is-focused:not(:active), .button.is-primary:focus:not(:active), .button.is-primary.is-focused, .button.is-primary:focus, .button.is-primary.is-hovered, .button.is-primary:hover, .button.is-primary.is-active, .button.is-primary:active {
    background-color: #3d5592;
}

.hero.is-global .button, .hero.is-trusted .button {
    margin-top: 1rem;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.36);
}

.hero.is-global .button:not(:last-child) {
    margin-right: 1rem;
}

.hero.hero.is-global ul, .hero.hero.is-global ul li {
    display: inline-block;
}

.hero.hero.is-global ul li a {
    vertical-align: center;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.36);
    color: white;
}

.hero.hero.is-global ul li:not(:first-child)::before {
    content: ">";
    display: inline-block;
    margin: 0 1rem 0 1rem;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.36);
}

.hero.is-productions .title:after {
    content: "";
    width: 1.5rem;
    transition: 0.3s;
    display: block;
    border: solid #4b6cb7 1px;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.36);
    margin: auto;
}

.hero.is-productions .title:hover:after {
    width: 8rem;
}

.hero.is-productions .video-content video {
    width: 300px;
    transition: 0.3s;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.36);
}

.hero.is-productions .video-content video:hover {
    transform: scale(1.2);
}

.hero.is-productions .title {
    padding-bottom: 5rem;
}

.hero.is-productions .columns:not(:last-child) {
    padding-bottom: 8rem;
}

.hero.is-productions .video-description {
    width: 300px;
    color: #fff;
    font-weight: 500;
    margin: auto;
}

.hero.is-productions .columns {
    margin-bottom: 1rem;
}

@media screen and (min-width: 769px), print {
    .hero.is-productions .video-description {
        width: 450px;
    }
    .hero.is-productions .video-content video {
        width: 450px;
    }
}

.hero.is-footer {
    margin-top: 1rem;
    color: #ffffff;
}

.hero.is-footer .hero-body {
    padding: 1rem 1.5rem;
}

.hero.is-footer .subtitle {
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.36);
    font-weight: 900;
    font-size: 1rem;
}

.is-all-products .card {
    transition: 0.3s;
    display: flex;
    flex-direction: column;
    height: 100%;
    background-color: #4b6cb7;
    color: white;
}

.is-all-products .card-footer {
    margin-top: auto;
}

.is-all-products .card h1, .is-all-products .card h2 {
    color: white;
}

.is-all-products .card:hover {
    transform: scale(1.1);
}

.is-all-products .card .image img {
    padding-top: 1rem;
    margin: auto;
    width: auto;
    height: 8rem;
}

.hero.is-all-products .button {
    display: inline-flex;
    border: solid #fff 0.1rem;
    background-color: #4b6cb7;
    color: white;
}

.hero.is-all-products .buttons .button {
    flex: auto;
    font-weight: 600;
    width: auto;
}

.is-all-products .category-product {
    padding-top: 2rem;
}

.badge {
    vertical-align: middle;
    color: #ffffff;
    border-radius: 2.5px;
    padding: .5px .5rem;
    font-size: .7rem;
    background-color: #7c7a7a;
    border: solid 1px #7c7a7a;
    margin-bottom: 1em;
}

.badge.out {
    background-color: #c0392b;
    border: solid 1px #c0392b;
}

.badge.stock {
    display: inline-block;
    background-color: #48c774;
    border: solid 1px #48c774;
}

.hero.is-product-infos .video-content video {
    width: 300px;
    transition: 0.3s;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.36);
}

.hero.is-product-infos .video-content video:hover {
    transform: scale(1.2);
}

.hero.is-product-infos .columns:not(:last-child) {
    padding-bottom: 8rem;
}

.hero.is-product-infos .video-description {
    width: 300px;
    color: #fff;
    font-weight: 500;
}

.hero.is-product-infos .is-product-title {
    margin-bottom: 6rem;
    vertical-align: center;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.36);
    font-size: 3rem;
}

.hero.is-product-infos .video-description .text, .hero.is-product-infos .video-content .text {
    margin-bottom: 2rem;
    color: white;
}

.hero.is-product-infos .video-content video {
    margin-bottom: 2rem;
}

.hero.is-product-infos .video-content .text i {
    font-style: italic;
}

.hero.is-product-infos .video-description .title:after {
    content: "";
    width: 1.5rem;
    transition: 0.3s;
    display: block;
    border: solid #4b6cb7 1px;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.36);
}

.hero.is-product-infos .video-description .title:hover:after {
    width: 3rem;
}

.hero.is-product-infos .columns {
    margin-bottom: 1rem;
}

@media screen and (max-width: 768px), print {
    .hero.is-product-infos {
        margin: auto;
    }
}

@media screen and (min-width: 769px), print {
    .hero.is-product-infos .video-description {
        width: 450px;
    }
    .hero.is-product-infos .video-content video {
        width: 450px;
    }
}

.hero.is-trusted .title:after {
    content: "";
    width: 1.5rem;
    transition: 0.3s;
    display: block;
    border: solid #4b6cb7 1px;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.36);
    margin: auto;
}

.hero.is-trusted .title:hover:after {
    width: 8rem;
}

.hero.is-trusted img {
    height: 150px;
    width: auto;
    transition: 0.3s;
}

.hero.is-trusted img:hover {
    transform: scale(1.2);
}

.button.is-switch {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
}

@media screen and (max-width: 780px), print {
    .column.is-one-quarter, .column.is-one-quarter-tablet {
        flex: auto;
        width: 100%;
    }
}

#see-other {
    margin-top: 3rem;
}