/*****************************************
 *                                       *
 *   CUSTOM STYLESHEET FOR MEYERDEV.CH   *
 *                                       *
 *****************************************/



/*
    ---------- The following elements were added by meyerdev.ch
*/

/* Colors */
.white,
body.md .white {
    color: #fff;
}



/* Selection */
::selection {
    color: #fff;
    background: #27aae1;
}



/* Alignments */
.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }
.justify { text-align: justify; }

.text-content {
    text-align: justify;
}

.text-content h1,
.text-content h2,
.text-content h3,
.text-content h4,
.text-content h5,
.text-content h6,
.text-content ul,
.text-content ol {
    text-align: left;
}

@media (max-width: 767px) {
    .text-content {
        text-align: left;
    }
}



/* Accent colors */
.md-accent-color {
    color: #27aae1;
}
.md-accent-bg {
    background-color: #27aae1;
}

.md-accent-color2 {
    color: #47caff;
}
.md-accent-bg2 {
    background-color: #47caff;
}



/* Basic Formatting */
body.md i {
    font-style: italic;
}

body.md i.fa {
    font-style: normal;
}

.md-caps {
    text-transform: uppercase;
}

.md-caps-headings h1,
.md-caps-headings h2,
.md-caps-headings h3,
.md-caps-headings h4,
.md-caps-headings h5,
.md-caps-headings h6 {
    text-transform: uppercase;
}



/* Gradients & Shadows */
.md-gradient-band {
    background-image: linear-gradient(to top right, #006aa1, #27aae1);
    box-shadow: 0 0 10px rgba(0, 0, 0, .5);
}

.webpunch-gradient-band {
    background-color: #e1aa27;
    background-image: linear-gradient(30deg, #e1aa27, #e127aa);
    background-position: 0% 50%;
    box-shadow: 0 0 10px rgba(0, 0, 0, .3);
}

/* Fix js_composer's margin removal, but only in gradient/hero bands */
#content .md-gradient-band .wpb_text_column h2:last-child,
.md-gradient-band .wpb_text_column h2:last-child,
#content .webpunch-gradient-band .wpb_text_column h2:last-child,
.webpunch-gradient-band .wpb_text_column h2:last-child {
    margin-bottom: 20px;
}

.md-gradient-hero {
    background-image: linear-gradient(to top right, #345, #678);
    box-shadow: 0 0 10px rgba(0, 0, 0, .5);
}

.md-hero-text {
    text-shadow: 0 0 7px rgba(0, 0, 0, .5);
}



/* Buttons */
body.md .theme-button,
body.md .color-button,
body.md button,
body.md input[type="submit"],
body.md #footer-callout .theme-button {
    background-color: #27aae1;
    /* background-image: linear-gradient(0deg, #47caff, #006aa1, #47caff); */
    background-image: linear-gradient(0deg, #006aa1, #47caff);
    background-position: left top;
    background-size: 200% 200%;
    border-radius: 8px;
    /* box-shadow: 0 0 10px rgba(50, 50, 50, .2); */
    transition: background-color .2s ease, background-position .2s ease, box-shadow .2s ease, transform .2s ease;
    /* animation: md-hover 1.5s linear infinite; */
}

body.md .theme-button:hover,
body.md .theme-button:focus,
body.md .color-button:hover,
body.md .color-button:focus,
body.md button:hover,
body.md button:focus,
body.md input[type="submit"]:hover,
body.md input[type="submit"]:focus,
body.md #footer-callout .theme-button:hover,
body.md #footer-callout .theme-button:focus {
    color: #fff;
    background-color: #47caff;
    outline: none;
    /* box-shadow: 0 0 10px rgba(50, 50, 50, .3); */
    /* transform: translateY(-1px); */
}

body.md .theme-button:active,
body.md .color-button:active,
body.md button:active,
body.md input[type="submit"]:active,
body.md #footer-callout .theme-button:active {
    color: #fff;
    background-color: #27aae1;
    /* background-position: right bottom; */
    /* box-shadow: 0 0 10px rgba(50, 50, 50, .5); */
    /* transform: translateY(2px); */
    transform: scale(.95);
}

/* Buttons: Glow */
body.md .theme-button.glow:hover,
body.md .theme-button.glow:focus,
body.md #footer-callout .theme-button:hover,
body.md #footer-callout .theme-button:focus {
    box-shadow: 0 0 20px rgba(255, 255, 192, .2);
}

body.md .theme-button.glow:active,
body.md #footer-callout .theme-button:active {
    box-shadow: 0 0 10px rgba(255, 255, 192, .4);
}

/* Buttons: Dark */
body.md .theme-button.dark,
body.md #footer-callout .theme-button {
    background-image: linear-gradient(0deg, #222, #444);
}

body.md .theme-button.dark:hover,
body.md .theme-button.dark:focus,
body.md #footer-callout .theme-button:hover,
body.md #footer-callout .theme-button:focus {
    background-image: linear-gradient(0deg, #444, #666);
}

body.md .theme-button.dark:active,
body.md #footer-callout .theme-button:active {
    background-image: linear-gradient(0deg, #222, #444);
}

@keyframes md-hover {
    0% {
        transform: translateY(2px);
    }

    50% {
        transform: translateY(-2px);
    }

    100% {
        transform: translateY(2px);
    }
}



/* Reference images */
.md-ref-img img {
    box-shadow: 0 0 20px rgba(0, 0, 0, .4);
    margin: 20px 0;
}



/* Reference type label */
.wpb_content_element.md-ref-type {
    display: inline-block;
    padding: 5px 8px;
    margin-bottom: 5px;
    background-color: #27aae1;
    color: #fff;
    font-size: 14px;
    line-height: 1;
    cursor: default;
    border-radius: 3px;
    user-select: none;
    -webkit-transition: background-color .2s ease;
    -moz-transition: background-color .2s ease;
    transition: background-color .2s ease;
}

.wpb_content_element.md-ref-type:hover {
    background-color: #333;
}



/* WPB columns with bigger margin below */
.md-cols-mb .vc_column-inner {
    margin-bottom: 60px;
}



/* Emphasis */
body.md em {
    font-style: italic;
    color: #27aae1;
}



/*
    ---------- The following elements have their original styles updated
*/

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #222;
}



/* Miscellaneous tags */
body.md sup {
    font-size: smaller;
}



/* Lightbox headings */
body.md .ilightbox-holder.minimal .ilightbox-inner-toolbar .ilightbox-title {
    text-transform: none;
}



/*
    ----- Contact Form 7 -----
*/
.wpcf7 .col-6 {
    display: inline-block;
    width: 49%;
}

.wpcf7 .col-6:last-of-type {
    margin-left: 1%;
}

@media (max-width: 459px) {
    .wpcf7 .col-6:last-of-type {
        margin-left: .5%;
    }
}

.wpcf7 .row-top {
    display: table;
    width: 100%;
}

.wpcf7 .row-top .col-6 {
    display: table-cell;
    vertical-align: top;
}

.wpcf7 .row-top .col-6:last-of-type {
    margin-left: 0;
    padding-left: .5%;
}

.wpcf7 label {
    display: block;
}

.wpcf7-form-control-wrap,
.wpcf7-form-control-wrap > span {
    display: block;
}


.wpcf7 input,
.wpcf7 select,
.wpcf7 textarea {
    margin-bottom: 20px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="email"],
.wpcf7 select,
.wpcf7 textarea {
    width: 100%;
}

.wpcf7-list-item-label {
    cursor: pointer;
}

.wpcf7 input[type="checkbox"] {
    margin-bottom: 0;
}

.wpcf7 span.wpcf7-list-item {
    display: block;
}

.wpcf7 span.wpcf7-list-item.last {
    margin-bottom: 20px;
}

.wpcf7 input.wpcf7-not-valid,
.wpcf7 select.wpcf7-not-valid,
.wpcf7 textarea.wpcf7-not-valid {
    border-color: #f00;
}

.wpcf7 .wpcf7-not-valid {
    border: 1px solid #f00;
    border-radius: 3px;
}

.wpcf7 .wpcf7-not-valid span.wpcf7-list-item.last {
    margin-bottom: 0;
}

.wpcf7 span.wpcf7-not-valid-tip {
    margin-bottom: 20px;
}

/* WPCF7: Response/Validation */
body .wpcf7 form div.wpcf7-response-output,
body .wpcf7 form div.wpcf7-mail-sent-ok,
body .wpcf7 form div.wpcf7-validation-errors,
body .wpcf7 form div.wpcf7-acceptance-missing {
    margin: 15px 0;
    border-width: 1px;
    border-radius: 0;
    padding: 1em 2em;
    text-align: center;
}

body .wpcf7 form.sent div.wpcf7-response-output,
body .wpcf7 form.sent div.wpcf7-mail-sent-ok {
    background-color: #edfdd3;
    border-color: #c4dba0;
    color: #657e3c;
}

body .wpcf7 form.invalid div.wpcf7-response-output,
body .wpcf7 form.invalid div.wpcf7-validation-errors,
body .wpcf7 form.invalid div.wpcf7-acceptance-missing {
    background-color: #ffc;
    color: #c4690e;
    border-color: #f7e700;
}



/*
    ---------- The following elements are removed for aesthetics
*/

@media screen and (max-width: 767px) {
    .sm-hidden {
        display: none;
    }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
    .md-hidden {
        display: none;
    }
}

@media screen and (min-width: 960px) {
    .lg-hidden {
        display: none;
    }
}

.grecaptcha-badge {
    display: none;
}