@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100..900&display=swap');

/*
    font-family: 'Roboto', sans-serif;
*/

body {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    color: #263238
}

a:not([href]) {
    color: inherit;
    text-decoration: none;
    cursor: pointer
}

a {
    color: #3f51b5
}

a:hover {
    color: #1a237e
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-bottom: .5rem;
    font-weight: 700
}

.btn {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.125rem
}

.btn.active,
.btn.focus,
.btn:active,
.btn:focus {
    outline: 0;
    box-shadow: none
}

.btn-primary {
    color: #fff;
    background-color: #f44336;
    border-color: #f44336
}

.btn-primary:hover {
    background-color: #b71c1c;
    border-color: #b71c1c
}

.advertorial {
    padding: .375rem 0;
    background-color: #cfd8dc;
    text-align: center
}

.advertorial p {
    margin-bottom: 0;
    color: #546e7a;
    font-size: .875rem;
    text-transform: uppercase;
    letter-spacing: .5px
}

.site-header {
    padding: .5rem 0 0;
    background-color: #eceff1
}

.site-logo {
    margin-bottom: .5rem
}

.site-logo__image {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    margin-right: .5rem
}

.site-logo__title {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0;
    color: #263238
}

.navbar-wrapper {
    background-color: #263238;
    padding: .25rem 0
}

.navbar {
    padding: 0
}

.navbar-toggler {
    border: none;
    padding: 0 .25rem
}

.navbar-toggler:active,
.navbar-toggler:focus {
    outline: 0
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='%23ECEFF1' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}

.nav-link {
    color: #fff !important;
    font-weight: 700;
    font-size: .875rem;
    text-transform: uppercase;
    transition: all .25s ease-in-out
}

.nav-link.active,
.nav-link:hover {
    color: #cfd8dc !important
}

@media (min-width:768px) {
    .site-header {
        padding: .75rem 0 0
    }

    .site-logo {
        margin-bottom: .75rem
    }

    .site-logo__image {
        width: 80px;
        height: 80px;
        min-width: 80px;
        min-height: 80px;
        margin-right: 1rem
    }

    .site-logo__title {
        font-size: 1.5rem;
        font-weight: 700;
        margin-bottom: 0;
        color: #263238;
        max-width: 120px
    }

    .navbar-wrapper {
        padding: 0
    }

    .navbar-nav {
        width: 100%
    }

    .navbar-nav .nav-item {
        width: 100%;
        text-align: center
    }

    .navbar-nav .nav-link:hover {
        background-color: #546e7a;
        color: #fff !important
    }

    .navbar-expand-md .navbar-nav .nav-link {
        padding-left: .75rem;
        padding-right: .75rem
    }
}

@media (min-width:992px) {
    .container {
        max-width: 800px
    }
}

@media (min-width:1200px) {
    .container {
        max-width: 800px
    }
}

.post {
    padding: 1rem 0
}

.post__header {
    margin-bottom: 1rem
}

.post__title {
    margin-bottom: 0;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0
}

.post__author {
    background-color: #eceff1;
    padding: .5rem;
    margin-bottom: 1rem
}

.post__author img {
    display: block;
    margin: 0 auto .5rem
}

.post__author p {
    margin-bottom: 0
}

.post__author p span {
    font-style: italic
}

.post__content h3 {
    font-size: 1.25rem
}

.post__question {
    font-weight: 700
}

.post__cta {
    font-size: 1.25rem;
    font-weight: 700
}

.post__footer {
    margin-top: 1.5rem;
    text-align: right
}

.post__footer p {
    font-size: .875rem
}

.post__packshot {
    text-align: center
}

.post__packshot img {
    margin-bottom: 1.5rem
}

.breadcrumb {
    background-color: transparent;
    padding: 0;
    margin-bottom: .5rem
}

.breadcrumb-item a {
    color: #3f51b5;
    font-size: .875rem;
    font-weight: 700
}

.breadcrumb-item:hover a {
    color: #1a237e
}

.breadcrumb-item.active a {
    color: #607d8b
}

.post__comments {
    margin: 2rem 0 0
}

.post__comments h3 {
    font-size: 1.75rem
}

.comments-header h2 {
    display: none
}

.comments-meta {
    color: #607d8b;
    font-size: .875rem;
    margin-bottom: .5rem
}

.form-text {
    font-size: .875rem;
    color: #607d8b
}

.comments-header {
    border-bottom: 1px solid #cfd8dc
}

.comments-header h2 {
    font-size: 1.75rem;
    text-transform: uppercase
}

.comments .btn {
    float: right;
    font-size: 1rem
}

.comment {
    border-bottom: 1px solid #cfd8dc;
    padding: 1rem .5rem
}

.comment.waiting {
    background-color: #cfd8dc
}

.comment.waiting .comment-vote {
    display: none
}

.comment>.comment {
    margin-left: 4rem;
    border-bottom: 1px solid #cfd8dc;
    padding-bottom: 1rem
}

.comment:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none
}

.comment-header {
    margin-bottom: .25rem
}

.comment-name {
    font-size: .875rem;
    display: inline-block;
    margin-bottom: 0
}

.comment-time {
    color: #607d8b;
    margin-left: .5rem;
    font-size: .875rem
}

.comment-wait {
    color: #f44336;
    font-weight: 700;
    font-size: .875rem;
    margin-left: .5rem;
    text-decoration: underline
}

.comment-vote {
    color: #607d8b;
    font-size: .8125rem;
    display: none
}

.comment-vote strong {
    color: #4caf50
}

.comment-vote strong.red {
    color: #f44336
}

.comment-content {
    margin-bottom: 0;
    font-size: .875rem
}

.comment-vote i {
    margin-left: .5rem;
    font-size: .8125rem;
    cursor: pointer;
    transition: all .15s ease-in-out;
    color: #90a4ae !important
}

.comment-vote i.fa-thumbs-up:hover {
    color: #4caf50 !important
}

.comment-vote i.fa-thumbs-down:hover {
    color: #f44336 !important
}

@media (min-width:576px) {
    #new_comment .form-row {
        flex-wrap: nowrap
    }

    #new_comment .form-row .form-group {
        flex: 1 1 auto !important;
        max-width: none !important;
        width: auto
    }
}

@media (min-width:1200px) {

    #new_comment .form-row>.form-group:nth-child(1),
    #new_comment .form-row>.form-group:nth-child(2) {
        width: 40%
    }
}

@media (min-width:768px) {
    .site-main {
        background-color: #eceff1
    }

    .post {
        background-color: #fff;
        padding: 2rem 15px
    }

    .post__author {
        padding: 1rem
    }

    .post__author img {
        margin: 0 auto
    }
}

.site-footer {
    padding: 1rem 0;
    background-color: #eceff1
}

.site-footer__copy {
    font-size: .875rem;
    color: #607d8b;
    text-align: center;
    margin-bottom: .5rem
}

.site-footer__studies-title {
    color: #607d8b;
    font-size: .75rem;
    margin-bottom: .25rem;
    text-align: center
}

.site-footer__studies {
    list-style-type: decimal;
    list-style-position: inside;
    color: #607d8b;
    font-size: .75rem;
    padding: 0;
    margin-bottom: .5rem
}

.site-footer__studies li {
    margin-bottom: .25rem
}

.site-footer__studies a {
    color: #607d8b !important;
    text-align: left;
    margin-bottom: 0;
    text-transform: none;
    font-weight: 500;
    padding: 0;
    transition: all .25s ease-in-out
}

.site-footer__studies a:hover {
    color: #263238 !important
}

.site-footer__disclaimer {
    color: #607d8b;
    font-size: .75rem;
    text-align: center;
    margin-bottom: 0
}

.site-footer__copy img {
    display: block;
    margin: 0 auto;
}

.formbox {
    display: block;
    max-width: 400px;
    padding: 20px;
    margin: 50px auto 20px;
    box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.2);
}

/*form*/

.main_form input {
    border: 1px solid #bdbdbd;
    width: 100%;
    height: 52px;
    font-size: 16px;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    color: #747474;
    border-radius: 5px;
    margin-bottom: 15px;
    text-align: center;
}

.main_form input.error {
    background-color: #ffc8c8;
    margin-bottom: 2px;
}

.main_form label.error {
    color: #f00;
    display: block;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1;
    direction: ltr;
    text-align: left;
    margin: 0 auto 8px;
    padding: 0;
    width: 100%;
}

.main_form ::-webkit-input-placeholder {
    color: #333;
}

.main_form ::-moz-placeholder {
    color: #333;
}

.main_form :-moz-placeholder {
    color: #333;
}

.main_form :-ms-input-placeholder {
    color: #333;
}

.main_form :focus::-webkit-input-placeholder {
    color: transparent;
}

.main_form :focus::-moz-placeholder {
    color: transparent;
}

.main_form :focus:-moz-placeholder {
    color: transparent;
}

.main_form :focus:-ms-input-placeholder {
    color: transparent;
}

.main_form .link-button {
    width: 100%;
    margin-top: 0;
    padding: 10px 0;
    border: none;
}

.price {
    display: flex;
    justify-content: center;
    font-size: 16px;
    margin-bottom: 25px;
}

.price p {
    margin-bottom: 0;
    padding-bottom: 0;
}

.price .old p {
    font-size: 20px;
    line-height: 1.1em;
    text-decoration: line-through;
    padding-top: 5px;
}

.price .new {
    margin-left: 20px;
}

.price .new p {
    padding-top: 5px;
    font-size: 24px;
    line-height: 1.1em;
    font-weight: 700;
    color: #D14120;
}

.comment-content img {
    display: block;
    margin: 10px 0 0;
}

.ac_footer {
    text-align: center;
    margin: 10px 0 10px 0;
    font-size: 16px;
}