@charset "utf-8";

/*
Theme Name: Mindful Creative
*/

/* Structure */
*, *:after, *:before {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;position:relative;outline:none;}
.container {width:100%;padding:0 25px;}
.row {width:100%;max-width:800px;margin:0 auto;zoom:1;}
.row:before, .row:after {content:"";display:table;}
.row:after {clear:both;}

/* Transitions */
.btn, #showcase li::after {-webkit-transition:all 0.5s;transition:all 0.5s;}

::-webkit-input-placeholder {color:#6a6b6d;opacity:.65;user-select:none;-moz-user-select:none;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}
::-moz-placeholder {color:#6a6b6d;opacity:.65;user-select:none;-moz-user-select:none;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}
:-ms-input-placeholder {color:#6a6b6d;opacity:.65;user-select:none;-moz-user-select:none;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}
:-moz-placeholder {color:#6a6b6d;opacity:.65;user-select:none;-moz-user-select:none;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}

body, html {width:100%;height:100%;font-family:'Avenir Next LT Pro',sans-serif;font-size:16px;color:#6a6b6d;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
a {text-decoration:none;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}
a:hover {text-decoration:none;}
ul {list-style:none;}
img {max-width:100%;height:auto;display:block;}

main {background-color:#FFF;}
main h1, main h2 {text-align:center;font-weight:normal;user-select:none;-moz-user-select:none;}

main p {line-height:1.5;margin-top:20px;text-align:center;}
main p:first-child {margin-top:0!important;}
.page-id-5 main p {margin-top:40px;}

main a {color:#FFF;}

.embed-container {position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%;}
.embed-container iframe, .embed-container object, .embed-container embed {position:absolute;top:0;left:0;width:100%;height:100%;}

.anchor {display:block;height:82px;margin-top:-82px;visibility:hidden;position:absolute;top:0;}

/* Buttons */
.button, .mobile .button:hover {text-align:center;cursor:pointer;display:block;font-size:18px;user-select:none;-moz-user-select:none;background-color:#3BA4DC;color:#FFF;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;pointer-events:all!important;padding:0 22px 0 53px;border-radius:4px;line-height:60px;height:57px!important;}
.button:hover {background-color:#1a87c1;}
.button i {font-size: 23px;
    top: 2px;
    bottom: 0;
    margin: auto;
    position: absolute;
    height: 23px;
    left: 22px;}

.buttons .button:nth-of-type(2) {padding-left:55px;}
.button i.fa-comments {left:20px;top:0;}

.buttons {display:table;margin:20px auto 0;}
.buttons .button {float:left;}
.buttons .button:nth-of-type(2) {margin-left:20px;}


.btn {display:block;float:left;text-align:center;font-size:15px;color:#FFF;pointer-events:all!important;height:52px;line-height:48px;width:170px;font-weight:700;letter-spacing:1.25px;border-radius:4px;z-index:1;border-width:2px;border-style:solid;text-transform:uppercase;border-color:#3BA4DC;background-color:#3BA4DC;box-shadow:0 0 10px rgba(0,0,0,.15);}
.btn:hover {background-color:#1a87c1;border-color:#1a87c1;}

/* Header */
header {position:fixed;z-index:3;width:100%;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;user-select:none;-moz-user-select:none;}
.scrolled header {background-color:#FFF;}

header .cta {z-index:1;display:block;position:absolute;font-size:30px;color:#3BA4DC;cursor:pointer;opacity:0;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;user-select:none;-moz-user-select:none;pointer-events:none;transform:scale(1.5);-webkit-transform:scale(1.5);-ms-transform:scale(1.5);}
header .cta:hover {color:#1a87c1;}
.mobile header .cta:hover {color:#3BA4DC;}
header .cta.work {left:28px;top:25px;}
header .cta.contact {right:30px;top:24px;}

header.show .cta {opacity:1;pointer-events:all;transform:scale(1);-webkit-transform:scale(1);-ms-transform:scale(1);}

header .logo {display:table;position:relative;z-index:1;margin:15px auto;}
header .logo svg {cursor:pointer;width:80px;top:2px;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}
header .logo svg polyline {-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}
header .logo svg:hover polyline {fill:#3BA4DC;}
.mobile header .logo svg:hover polyline {fill:#FFF;}

.scrolled header .logo {margin:10px auto;}
.scrolled header .logo svg {width:60px;}
.scrolled header .logo svg polyline, .scrolled.mobile header .logo svg:hover polyline {fill:#3BA4DC;}
.scrolled header .logo svg:hover polyline {fill:#1a87c1;}

/* Hero */
figure#hero {z-index:1;height:75%;display:table;width:100%;}
figure#hero.e404 {height:100%;}
#hero .container {height:100%;text-align:center;color:#FFF;user-select:none;-moz-user-select:none;pointer-events:none;background-color:rgba(0,0,0,.435/*.3*/);display:table-cell;vertical-align:middle;padding-top:28.5px;}
figure#hero.hosting-ssl .container {background-color:rgba(1,45,74,.7);}
#hero .container .row {padding-top:28.5px;}

#hero .container h1 {font-weight:bold;display:block;font-size:30px;line-height:1.3;}
#hero .container p {display:block;font-size:25px;font-weight:normal;line-height:1.3;}

.page-template-seo-video .parallax-mirror img {opacity:.5;}
.page-template-seo-video .parallax-mirror {background-color:#000;}
figure#hero.seo .container {background-color:transparent;}
.mobile figure#hero.seo .container {background-color:rgba(0,0,0,.25);}

.page-template-seo-video figure#hero {z-index:1;height:550px;}
.page-template-seo-video #hero .container h1 {font-weight:bold;font-size:30px;margin:0 auto 5px;max-width:600px;line-height:1.3;}
.page-template-seo-video #hero .container p {display:block;font-size:22px;font-weight:normal;max-width:775px;margin:0 auto;line-height:1.3;}

.embed-container {position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%;margin:0 auto 35px;}
.embed-container iframe {position:absolute;top:0;left:0;width:100%;height:100%;}

#video {padding:65px 0 60px;}
#video h3 {font-size:23px;color:#2791ca;text-align:center;line-height:1.45;}
#video h3 a {color:#2791ca;}
#video h3 span a, #video h3 a:hover {color:#3BA4DC;}
#video h3 span a:hover, #video a.link:hover {text-decoration:underline;}
#video h3 span {display:block;font-size:20px;}

#video h4 {font-size:19.25px;text-align:center;margin-top:10px;font-weight:600;line-height:1.5;color:#2791ca;text-transform:capitalize;}
#video h4 span {display:block;color:#6a6b6d;margin-top:5px;font-size:17.75px;text-transform:none;}
#video h4 span b {color:#3BA4DC;}
#video a.link {color:#2791ca;display:table;margin:20px auto 0;cursor:pointer;}

/* Showcase */
#showcase .row {max-width:100%;}
#showcase li {width:25%;float:left;display:block;overflow:hidden;}

#showcase li::after {pointer-events:none;position:absolute;right:15px;bottom:-10px;font-size:30px;z-index:1;opacity:0;text-shadow:0 0 2px rgba(28,38,52,.5),0 0 5px rgba(28,38,52,.25),0 0 5px rgba(28,38,52,.35);content:"\f065";font-family:"Font Awesome 5 Pro";color:#FFF;}
#showcase li:hover::after {bottom:12px;opacity:1;}

#showcase li .btn {position:absolute;left:-35px;bottom:10px;font-size:12px;opacity:0;line-height:31px;height:31px;width:auto;padding:0 20px;font-weight:500;}
#showcase li:hover .btn {opacity:1;left:10px;}

.mobile #showcase li.active::after {bottom:12px;opacity:1;}
.mobile #showcase li.active .btn {opacity:1;left:10px;}

/* Contact Form */
#ninja-form {background-color:#3BA4DC;padding:60px 25px 20px;color:#FFF;}
#ninja-form h2 {margin-bottom:20px;}
.nf-form-cont {width:100%;max-width:500px;margin:0 auto;}
.nf-form-cont .nf-field-container {margin-bottom:15px;}
.nf-form-cont .nf-form-fields-required {display:none!important;}
.nf-form-cont .ninja-forms-req-symbol {position:absolute;top:0;left:-11px;color:#FFF;}
.nf-form-cont .nf-error-msg {color:#FFF;}
.nf-after-form-content .nf-error-msg {text-align:center;}
.nf-form-cont nf-field {margin:20px 0 0;}
.nf-form-cont nf-field:first-child, .nf-form-cont .hidden-container, .nf-form-cont .nf-input-limit {margin-top:0;}
.nf-form-cont .nf-after-field .nf-error-msg {margin:5px 0 0;}
.nf-form-cont nf-field i {position:absolute;right:15px;bottom:12px;z-index:1;font-size:26px;pointer-events:none;}
.nf-form-cont nf-field input, .nf-form-cont nf-field select, .nf-form-cont nf-field textarea {-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;width:100%;padding:22px 20px 18px;font-size:17px;font-family:'Avenir Next LT Pro',sans-serif;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;background-color:#FFF;border:0;color:#6a6b6d;border:4px solid #FFF;}
.nf-error .ninja-forms-field {border:4px solid #e80000!important;}
.nf-form-cont nf-field input:hover, .nf-form-cont nf-field select:hover, .nf-form-cont nf-field textarea:hover, .nf-form-cont nf-field input:focus, .nf-form-cont nf-field select:focus, .nf-form-cont nf-field textarea:focus {border-color:#1a87c1;}
.nf-form-cont nf-field .listselect-container .nf-field .nf-field-element::before {font-family:"Font Awesome 5 Pro";color:#444;}
.nf-form-cont nf-field select {color:#6a6b6d;}
.nf-form-cont nf-field .listselect-container .nf-field .nf-field-element::before {font-family:"Font Awesome 5 Pro";color:#444;content:"\f107";position:absolute;top:20px;z-index:9;right:15px;pointer-events:none;font-size:26px;opacity:.35;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.nf-form-cont nf-field textarea {resize:none;height:150px;}
.nf-form-cont nf-field input[type="button"] {background-color:#1a87c1;margin:0;width:inherit;height:auto;font-size:17px;border:0;color:#FFF!important;cursor:pointer;}
.nf-form-cont nf-field input[type="button"]:hover {background-color:#2791ca;}
.nf-form-cont nf-field.hide {display:none!important;}
.nf-form-cont .nf-field-label label {font-weight:normal;margin-left:11px;}

.nf-form-cont nf-field input:focus::-webkit-input-placeholder {color:#FFF;opacity:1;user-select:none;-moz-user-select:none;}
.nf-form-cont nf-field textarea:focus::-webkit-input-placeholder {color:#FFF;opacity:1;user-select:none;-moz-user-select:none;}
.nf-form-cont nf-field input:focus::-moz-placeholder {color:#FFF;opacity:1;user-select:none;-moz-user-select:none;}
.nf-form-cont nf-field textarea:focus::-moz-placeholder {color:#FFF;opacity:1;user-select:none;-moz-user-select:none;}
.nf-form-cont nf-field input:focus:-ms-input-placeholder {color:#FFF;opacity:1;user-select:none;-moz-user-select:none;}
.nf-form-cont nf-field textarea:focus:-ms-input-placeholder {color:#FFF;opacity:1;user-select:none;-moz-user-select:none;}
.nf-form-cont nf-field input:focus:-moz-placeholder {color:#FFF;opacity:1;user-select:none;-moz-user-select:none;}
.nf-form-cont nf-field textarea:focus:-moz-placeholder {color:#FFF;opacity:1;user-select:none;-moz-user-select:none;}

/* Footer */
footer {user-select:none;-moz-user-select:none;padding:15px 0 20px;color:#FFF;background-color:#3BA4DC;margin-top:-1px;}
.error404 footer {display:none;}
footer ul.social {display:table;margin:15px auto 20px;}
footer ul.social li {position:relative;font-size:24px;color:#FFF;margin-left:20px;display:block;float:left;text-align:center;transition:all 0.5s linear 0s;-webkit-transition:all 0.5s linear 0s;-moz-transition:all 0.5s linear 0s;cursor:pointer;}
footer ul.social li:first-child {margin-left:0;}
footer ul.social li:hover {opacity:.5;}
footer ul.social li a {font-size:0;display:block;position:absolute;top:0;left:0;color:#FFF;opacity:.25;width:100%;height:100%;}

footer .copyright {font-size:13px;padding:15px 0;text-align:center;line-height:1.5;cursor:default;}

/* Responsive */
@media handheld, only screen and (max-width:1440px) {
#showcase li {width:33.33%;}
}

@media handheld, only screen and (max-width:1024px) {
#showcase li {width:50%;}
}

@media handheld, only screen and (max-width:700px) {
#showcase li {width:100%;}
#showcase li.active::after {bottom:12px;opacity:1;}
#showcase li.active .btn {opacity:1;left:10px;}
}

@media handheld, only screen and (max-width:650px) {
header .logo, .scrolled header .logo {margin:20px auto;}
.scrolled header .logo {margin:7.5px auto;}
header .logo svg, .scrolled header .logo svg {width:60px;}
.scrolled header .logo svg {width:40px;}

header .cta {font-size:25px;}
header .cta.work {left:15px;top:19px;}
header .cta.contact {right:18px;top:17px}

figure#hero {height:100%;}
#hero .container h1 {font-size:30px!important;}
#hero .container p {font-size:20px!important;}

#video h3 {font-size:22px;}
#video h3 span {font-size:17px;}
#video h4 {font-size:16px;line-height:1.45;}

.anchor {height:59px;margin-top:-59px;}

#video {padding:40px 0 35px;}

#ninja-form {padding:40px 25px 15px;}
}

@media handheld, only screen and (max-width:450px) {
#hero .container {padding:0 20px;}
.button, .mobile .button:hover {padding:0 20px 0 48px;font-size:16.5px;}
.buttons .button:nth-of-type(1) {padding-left:45px;}
.buttons .button:nth-of-type(2) {padding-left:50px;margin:0 0 0 10px;}
.button i {left:15px!important;}
}