/*
––––––––––––––––––––––––––––––––––––––––––––––––––
1. Common Styles & Initials
–––––––––––––––––––––––––––––––––––––––––––––––––– */

html,
body {
    overflow-x: hidden;
}

.gradient-bg {
    background: linear-gradient(90deg, white 50%, #4c2e56 50%);
}

.swap-bg {
    background: linear-gradient(90deg, #f8e2ef 50%, #4c2e56 50%);
    height: 150px;
}

@media (min-width: 0px) and (max-width: 992px){

.swap-bg {
    background: linear-gradient(90deg, #f8e2ef 50%, #eef4f4 50%);
    height: 150px;
}

}


hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 3px solid #4c2e56;
    max-width: 70px;
}

body:before {
    content: ' ';
    width: 0%;
    height: 100%;
    position: fixed;
    z-index: -1;
}

@media (min-width: 1200px) and (max-width: 2000px) {
    .container {
        width: 80%;
    }
}

@media (min-width: 2001px) and (max-width: 10000px) {
    .container {
        width: 1400px;
    }
}

body,
p {
    color: #888;
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 0px;
    font-weight: 300;
}

.container {
    margin-left: auto;
    margin-right: auto;
}

p {
    margin-bottom: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: 0;
}

a {
    text-decoration: none !important;
}

a:focus {
    outline: none;
}


/*
––––––––––––––––––––––––––––––––––––––––––––––––––
2 .Preloader
–––––––––––––––––––––––––––––––––––––––––––––––––– */

html.preloader-running,
body.preloader-running {
    overflow: hidden;
}

html.preloader-running .sticky-sidebar {
    display: block;
}

div#preloader {
    background: none repeat scroll 0 0 white;
    height: 100%;
    left: 0px;
    position: fixed;
    top: 0px;
    width: 100%;
    z-index: 99999;
}

div#preloader.fluidview {
    left: 0px;
}

#status {
    width: 151px;
    height: 52px;
    position: fixed;
    left: 50%;
    top: 50%;
    background-image: url(../images/logo-scroll-1.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 151px 52px;
    margin: -26px 0 0 -75px;
}


/*
––––––––––––––––––––––––––––––––––––––––––––––––––
3. Header
–––––––––––––––––––––––––––––––––––––––––––––––––– */

header.masthead {}

.logo-header {
    position: fixed;
    top: 0;
    left: 0;
    padding: 85px 40px;
    height: 100%;
    text-align: center;
    z-index: 9900;
}

.main-logo {
    margin-left: 10px;
}

.link-show-poster {
    display: none;
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 60px 40px;
    z-index: 9000;
}

.link-show-poster h1 {
    font-size: 72px;
    text-align: center;
}

.social-block {
    position: absolute;
    bottom: 60px;
}

.social-block ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.social-block ul li {
    margin-top: 10px;
}

.social-block ul li a span {
    font-size: 24px;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.social-block ul li a:hover span {
    opacity: 0.3;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}


/*
––––––––––––––––––––––––––––––––––––––––––––––––––
4. Navigations
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.standard-nav {
    font-family: 'proxima_novasemibold';
    position: fixed;
    padding-right: 20px;
    font-size: 10px;
    height: 100px;
    top: 0;
    left: 0%;
    z-index: 10;
    width: 100%;
    text-align: right;
    transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    -webkit-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
    -ms-transition: all .2s ease-in;
}

.standard-nav .logo {
    position: fixed;
    left: 0;
    top: 0;
    width: 150px;
    height: 60px;
    background: transparent;
    overflow: hidden;
    display: none;
    transition: all 1s ease-in;
    -moz-transition: all 1s ease-in;
    -webkit-transition: all 1s ease-in;
    -o-transition: all 1s ease-in;
    -ms-transition: all 1s ease-in;
}

.standard-nav .logo img {
    position: absolute;
    left: -100%;
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.logo-visible {
    left: 20px !important;
}

.fixed-logo {
    position: absolute;
    top: 9%;
    left: 0 !important;
    transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    -webkit-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
    -ms-transition: all .2s ease-in;
}

.fixed-logo-hide {
    display: none;
}

.header-fixed-nav {
    background: rgba(0, 0, 0, 0.9);
    position: fixed;
    padding-right: 30px;
    font-size: 14px;
    height: 60px;
    top: 0;
    left: 0;
    z-index: 15;
    width: 100%;
    text-align: right;
    transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    -webkit-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
    -ms-transition: all .2s ease-in;
}

.standard-nav ul {
    padding: 30px 0px;
    width: 100%;
}

.header-fixed-nav ul {
    padding: 18px 0px !important;
}

.standard-nav ul li {
    display: inline-block;
    list-style: none;
    margin-right: 10px;
    padding-right: 10px;
}

.standard-nav ul li:last-child {
    margin-right: 0;
    padding-right: 0;
}

.standard-nav ul li a {
    font-family: 'proxima_novasemibold';
    font-size: 13px;
    text-transform: uppercase;
    line-height: 21px;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding: 5px;
    opacity: .8;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}


/*menu bigslide*/


/*disabled for large screens*/

.sliding-menu-wrap {
    opacity: 0;
}

.logo-wrap {
    position: absolute;
    left: 33%;
    top: 12%;
}

.menu-wrap .panel {
    position: fixed;
    padding: 20px;
    left: -15.625em;
    /*left or right and the width of your navigation panel*/
    width: 15.625em;
    /*should match the above value*/
    margin-bottom: 20px;
    background-color: rgba(0, 0, 0, 0.9);
    border: none;
    border-radius: 0px;
    box-shadow: none;
}

.menu-wrap {
    position: relative;
    z-index: 50;
}

.menu-wrap a {
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: 2px;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.menu-wrap a:hover {
    opacity: .7;
}

.menu-wrap ul {
    padding: 0px;
    margin: 0px;
    padding-bottom: 10%;
    padding-top: 20%;
}

.menu-wrap li {
    list-style-type: none;
    padding: 8%;
    text-align: center;
}

.menu-icon-wrap {
    position: relative;
    z-index: 30;
}

.menu-icon-wrap a {
    font-size: 25px;
    position: fixed;
    margin-top: 10px;
    padding: 3px 10px;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.menu-close-icon-wrap a {
    font-size: 25px;
    position: absolute;
    right: 30px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.menu-close-icon-wrap a:hover {
    transform: rotate(90deg);
}

.menu-wrap .wrap {
    position: relative;
}

.menu-wrap .panel {
    position: fixed;
    left: -15.625em;
    /*left or right and the width of your navigation panel*/
    width: 15.625em;
    /*should match the above value*/
}


/*
––––––––––––––––––––––––––––––––––––––––––––––––––
5. Footer
–––––––––––––––––––––––––––––––––––––––––––––––––– */

footer.mastfoot {
    padding: 120px 0;
    background-position: center center;
    background-repeat: repeat-y;
}

.footnav ul {
    list-style-type: none;
    padding: 0 10px;
}

.footnav ul li a {
    font-size: 12px;
    line-height: 24px;
    letter-spacing: 0px;
    font-weight: normal;
    border-bottom: solid 2px;
}

.foot-logo {}

footer.mastfoot h3 {
    font-size: 24px;
    line-height: 31px;
    letter-spacing: 2px;
    margin-bottom: 13px;
    text-transform: uppercase;
}

footer.mastfoot h6 {
    font-size: 14px;
    line-height: 0px;
    color: #121212;
}


/*
––––––––––––––––––––––––––––––––––––––––––––––––––
6. Pages
–––––––––––––––––––––––––––––––––––––––––––––––––– */

section.mastwrap {
    background: linear-gradient(90deg, #f8e2ef 50%, #f8e2ef 50%);
}



.inner-pad {
    padding-left: 25px;
    padding-right: 25px;
}
.super-heading {
    font-size: 124px;
    line-height: 124px;
    letter-spacing: 4px;
    text-transform: uppercase;
}
.main-heading {
    font-size: 18px;
    line-height: 32px;
    letter-spacing: -0.2px;
}
.sub-heading {
    font-size: 18px;
    line-height: 24px;
    letter-spacing: -0.2px;
    text-transform: uppercase;
}
.super-text {
    font-size: 45px;
    line-height: 52px;
    margin-bottom: 10px;
}
.promo-text {
    font-size: 24px;
    line-height: 25px;
    /*margin-bottom: 30px;*/
    font-weight: 200;
    /*margin-bottom: 30px;*/
}
.tiny-caps {
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-top: 20px;
}
.tiny-caps:before {
    content: ' ';
    height: 5px;
    width: 40px;
    display: block;
    background-color: #222;
    margin-bottom: 5px;
}

/*STUDIO*/
.service-block img {
    max-width: 64px;
}
.service-icon {
    font-size: 64px;
    line-height: 64px;
    opacity: 0.2;
}
.service-block h3 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 25px;
    text-transform: uppercase;
}
.featured-project-block {
    padding: 0;
    padding-bottom: 30px;
    border-bottom: solid 2px #eee;
}
.featured-project-block h3 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 25px;
    text-transform: uppercase;
}
.counter-region .elements-counter .number {
    font-size: 72px;
    line-height: 72px;
}
.team-info {
    padding: 50px;
    text-align: left;
}
.team-info h3 {
    margin-bottom: 10px;
}
.team-info .team-social {
    list-style-type: none;
    padding: 0;
    margin: 0;
    margin-top: 15px;
}
.team-info .team-social li {
    display: inline-block;
    margin-right: 4px;
}
.team-info .team-social li a span {
    font-size: 24px;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -ms-transition: all .4s linear;
    -o-transition: all .4s linear;
    transition: all .4s linear;
}
.team-info .team-social li a:hover span {
    opacity: 0.4;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -ms-transition: all .4s linear;
    -o-transition: all .4s linear;
    transition: all .4s linear;
}
.testimonial-info {
    padding: 50px;
    text-align: center;
}
.testimonial-info h3 {
    margin-bottom: 40px;
    letter-spacing: 0px;
    line-height: 26px;
    font-size: 16px;
    color: #121212;
    text-transform:none;
}
.testimonial-info img {
    max-width: 119px;
    margin-bottom: 20px;
    border-radius: 50%;
    display: inline-block !important;
}
.testimonial-info .testimonial-social {
    list-style-type: none;
    padding: 0;
    margin: 0;
    margin-top: 15px;
}
.testimonial-info .testimonial-social li {
    display: inline-block;
    margin-right: 4px;
}
.testimonial-info .testimonial-social li a span {
    font-size: 24px;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -ms-transition: all .4s linear;
    -o-transition: all .4s linear;
    transition: all .4s linear;
}
.testimonial-info .testimonial-social li a:hover span {
    opacity: 0.4;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -ms-transition: all .4s linear;
    -o-transition: all .4s linear;
    transition: all .4s linear;
}
.testimonial-carousel .owl-controls {
    margin-top: 20px;
}

/*JOURNAL*/
.news-block h3 {
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 20px;
}
.news-block h4 {
    font-size: 36px;
    line-height: 43px;
    margin-bottom: 10px;
}
.news-post h3 {
    font-size: 24px;
    line-height: 31px;
    margin-bottom: 20px;
}
.news-post h4 {
    font-size: 48px;
    line-height: 55px;
    margin-bottom: 10px;

}
.news-post .sub-heading {
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 10px;
    padding: 2px 5px;
}
.news-post .content-list {
    list-style-type: none;
    padding: 0;
}

/*PROJECTS*/
.parallax-showcase .parallax-showcase-overlay {
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.8);
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -ms-transition: all .4s linear;
    -o-transition: all .4s linear;
    transition: all .4s linear;
}
.parallax-showcase:hover .parallax-showcase-overlay {
    opacity: 1;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -ms-transition: all .4s linear;
    -o-transition: all .4s linear;
    transition: all .4s linear;
}
.parallax-showcase h1 {
    font-size: 20px;
    line-height: 24px;
}
.fullscreen-video-wrap {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}

/*WORKS*/
.works-filter-wrap {
    display: none;
}
.filter-notification span,
.menu-notification span {
    font-size: 34px;
    float: right;
    margin-left: 20px;
}
.works-filter {
    list-style: none;
    padding: 0;
    margin: 0;
}
.works-filter li {
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
}
.works-filter li a {
    font-size: 12px;
    line-height: 19px;
}
.works-container {
    padding: 0;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}
.works-filter li:last-child:after {
    display: none;
}
.works-item {
    overflow: hidden;
}
.works-item a {
    opacity: 0;
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 100;
    text-align: center;
    text-decoration: none !important;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.works-item a:hover {
    text-decoration: none !important;
    opacity: 1;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.info a:hover {
    cursor: url("../images/plus.png") 40 40, crosshair;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.zoom a:hover {
    cursor: url("../images/zoom.png") 40 40, crosshair;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.works-item-inner {
    text-align: left;
    padding: 0 100px;
}
.works-item-inner:hover {
    background-color: rgba(0, 0, 0, 0.9) !important;
}
.works-thumbnails-view {
    margin-top: 0px;
}
.works-thumbnails-view .works-item-inner {
    text-align: left;
    padding: 40px;
}
.works-thumbnails-view .works-item-inner p > span {
    font-size: 24px;
    letter-spacing: normal;
    line-height: 31px;
    margin-top: 0;
}
.works-item a:hover .works-item-inner h3 {}
.works-item a:hover .works-item-inner p {}
.works-item-fade {
    opacity: 0.1;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.works-item-fade a {
    display: none !important;
}
.works-masonry-container {
    padding: 0;
}
.works-masonry-container .works-item-one-third {
    margin: 0;
    padding: 0;
    width: 33.3%;
}
.works-masonry-container .works-item-two-third {
    margin: 0;
    padding: 0;
    width: 66.6%;
}
.works-masonry-container .works-item-one-half {
    margin: 0;
    padding: 20px;
    width: 50%;
}
.works-masonry-container .works-item-one-fourth {
    margin: 0;
    padding: 0;
    width: 25%;
}
.works-masonry-container .works-item-one-sixth {
    margin: 0;
    padding: 0;
    width: 16.66%;
}
.works-masonry-container .works-item-full-width {
    margin: 0;
    padding: 0;
    width: 100%;
}
.works-masonry-container .works-item-one-third-spaced {
    margin: 1%;
    padding: 0;
    width: 31.3%;
}
.works-masonry-container .works-item-one-half-spaced {
    margin: 1%;
    padding: 0;
    width: 48%;
}
.works-masonry-container .works-item-two-third-spaced {
    margin: 1%;
    padding: 0;
    width: 64.6%;
}
.works-masonry-container .works-item-one-fourth-spaced {
    margin: 1%;
    padding: 0;
    width: 23%;
}
.works-masonry-container .works-item-one-sixth-spaced {
    margin: 1%;
    padding: 0;
    width: 14.66%;
}

/*CONTACT*/
.email-wrap {
    padding-top: 20px;
}
.contact-mail {
    font-size: 18px;
    line-height: 25px;
    font-weight: 300;
}
.contact-form-wrap {}
.contact-item {}
input {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 300 !important;
    margin-bottom: 30px !important;
    padding: 10px 0 !important;
    width: 100%;
    -webkit-transition: all .8s linear;
    -moz-transition: all .8s linear;
    -ms-transition: all .8s linear;
    -o-transition: all .8s linear;
    transition: all .8s linear;
}
input:focus,
textarea:focus {
    -webkit-transition: all .8s linear;
    -moz-transition: all .8s linear;
    -ms-transition: all .8s linear;
    -o-transition: all .8s linear;
    transition: all .8s linear;
}
textarea {
    background: url('../images/textarea.png') repeat !important;
    border: none !important;
    border-bottom: 1px solid !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 300 !important;
    margin-bottom: 0px !important;
    padding: 10px 0 !important;
    resize: none;
    width: 100%;
    -webkit-transition: all .8s linear;
    -moz-transition: all .8s linear;
    -ms-transition: all .8s linear;
    -o-transition: all .8s linear;
    transition: all .8s linear;
}
input,
textarea {
    border-color: #232323 !important;
    color: #999 !important;
}
input.send_message {
    cursor: pointer;
    float: left;
    font-size: 12px;
    font-weight: 400;
    margin: 0;
    width: 120px;
}
input.send_message:hover {}
fieldset {
    border: 0 none;
    float: left;
    padding: 0;
    position: relative;
    width: 100%;
}
fieldset h1 {
    font-size: 24px;
}
.contact-label-box {
    font-weight: 300;
    font-size: 24px;
    line-height: 31px;
    padding: 30px 20px;
    text-align: center;
}
.contact-label-box > span {
    display: block;
    margin-right: 10px;
}
.contact-label-box > span > img {
    height: 60px;
    width: 60px;
}
.contact-label-box a:hover {
    text-decoration: none;
}
.contact .alert {
    box-shadow: none;
    border: none;
    border-radius: 0;
    text-shadow: none;
    font-size: 12px;
    line-height: 19px;
    font-weight: 300;
    margin-bottom: 10px;
    padding: 10px;
    text-align: left;
}
.btn-wrap {
    margin-top: 30px;
}
.space-left {
    margin-left: 1%;
}
.alert {
    margin-top: 0px;
    border-radius: 0px;
    padding: 5px;
    -webkit-transition: all .8s linear;
    -moz-transition: all .8s linear;
    -ms-transition: all .8s linear;
    -o-transition: all .8s linear;
    transition: all .8s linear;
}
.alert > p {
    text-shadow: none;
    font-size: 14px;
    line-height: 21px;
    font-weight: 300;
}
.contact-address {
    font-size: 14px;
    font-weight: 200;
    line-height: 21px;
}
.email-wrap {
    font-size: 24px;
    line-height: 31px;
    margin-top: 10px;
    margin-bottom: 20px;
    padding: 0;
}
.video-center {
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 100vh;
}
.video-text {
    font-size: 78px;
    line-height: 78px;
}
.video-overlay {
    background: rgba(0, 0, 0, 0.7);
    width: 100%;
}

/*
––––––––––––––––––––––––––––––––––––––––––––––––––
7. Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Portfolio Isotope Transitions */
.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}
.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width;
}
.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -ms-transition-property: -ms-transform, opacity;
    -o-transition-property: -o-transform, opacity;
    transition-property: transform, opacity;
}
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -ms-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s;
}

/*Buttons*/
.btn-castle {
    font-family: 'proxima_novasemibold';
    border-radius: 50px;
    text-decoration: none;
    padding: 14px 40px;
    font-size: 18px;
    line-height: 18px;
    letter-spacing: 0px;
    text-transform: none;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.btn-castle-big {
    border-radius: 0px;
    text-decoration: none;
    padding: 15px 20px;
    font-size: 18px;
    line-height: 25px;
    text-transform: uppercase;
    letter-spacing: 0px;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.btn-castle:hover {
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.btn-castle-white {
    border: solid 2px #f8e2ef;
    background: transparent;
    color: #f8e2ef;
}
.btn-castle-white:hover {
    border: solid 2px #f8e2ef;
    background: #f8e2ef;
    color: #000 !important;
}
.btn-castle-dark {
    border: solid 2px #4c2e56;
    background: #4c2e56;
    color: #f8e2ef !important;
}
.btn-castle-dark:hover {
    border: solid 2px #4c2e56;
    background: #4c2e56;
    color: #f8e2ef !important;
}
.btn-castle-color {
    border: solid 2px;
    background: transparent;
}
.btn-castle-color:hover {
    border: solid 2px;
    color: #f8e2ef;
}
.btn-castle-green {
    color: #f8e2efFFF;
    padding: 15px;
    border: 2px solid #f8e2effff;
    border-radius: calc(15px*2);
    min-width: 6rem;
    background-size: calc(200% + 4px) 100%;
    background-image: linear-gradient(to right, #4c2e56 50%, transparent 50%);
    transition: all 0.33s;
}
.btn-castle-green:hover {
    border: solid 2px;
    color: #f8e2ef;
    outline: none;
}

/*Blog */
.blog-container {
    background-color: #4c2e56;
    padding: 50px;
    /*height: 450px;*/
    border-radius: 20px;
}
.blog-container h2 {
    margin-bottom: 15px;
}
.orange {
    background-color: #fb7976;
}
.blue {
    background-color: #10a6ce !important;
}
/*.blog-container.bg {
    background: url(../images/blog/ux-consultant-blog-img-overlay.jpg) center center no-repeat !important;
    background-size: cover !important;
}
.blog-container.bg-one {
    background: url(../images/blog/seo-opti-blog-img-overlay.jpg) center center no-repeat !important;
    background-size: cover !important;
}
.blog-container.bg-two {
    background: url(../images/photography-bg.jpg) center center no-repeat !important;
    background-size: cover !important;
}

.blog-para-fix {
    height: 240px;
}*/

/*Additional Helper Calsses*/
.add-top {
    margin-top: 120px;
}
.add-top-half {
    margin-top: 60px;
}
.add-top-quarter {
    margin-top: 20px;
}
.add-bottom {
    margin-bottom: 120px;
}
.add-bottom-half {
    margin-bottom: 60px;
}
.add-bottom-quarter {
    margin-bottom: 30px;
}
.pad {
    padding: 60px;
}
.pad-top {
    padding-top: 90px;
}
.pad-top-half {
    padding-top: 45px;
}
.pad-top-quarter {
    padding-top: 30px;
}
.pad-bottom {
    padding-bottom: 90px;
}
.pad-bottom-half {
    padding-bottom: 45px;
}
.pad-bottom-quarter {
    padding-bottom: 30px;
}
.remove-top {
    margin-top: 0 !important;
}
.ease {
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.ease:hover {
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.no-pad {
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-bottom: 0 !important;
    padding-right: 0 !important;
}
.valign {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
.overlay {
    position: absolute;
    top: 0;
    left: 0;
}
.img-bg {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
.parallax {
    background-attachment: fixed;
    background-size: cover;
    height: 100%;
    position: relative;
    width: 100%;
}

/*this class will be activated on mobile devices in order to switch off the parallax effect*/
.parallax-off {
    background-attachment: scroll !important;
    background-size: cover !important;
}
.no-scroll-xy {
    overflow: hidden !important;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

/*Responsive Video Embeds*/
.responsive-video-embed iframe {
    border: 0;
    width: auto;
}

/*Poster Image displayed instead BGVideo on mobile devices*/
.poster-img {
    background-size: cover !important;
    background: #f8e2ef;
}

/*LESS Compiled to CSS for Preview Purpose*/
.color {
    color: #4c2e56
}
.white {
    color: #f8e2ef
}
.silver {
    color: #f0f4f4
}
.grey {
    color: #aaa
}
.dark {
    color: #292929
}
.black,
a {
    color: #4c2e56;
}
a {
    color: #4c2e56;
    font-family: 'proxima_novasemibold';
}
a:hover {
    color: #4c2e56 !important;
}
.color-bg {
    background-color: #4c2e56;
}
.white-bg {
    background-color: #f8e2ef;
}
.silver-bg {
    background-color: #f8e2ef;
}
.grey-bg {
    background-color: #aaa;
}
.dark-bg {
    background-color: #292929;
}
.black-bg {
    background-color: #121212;
}
body {
    background-color: #f8e2ef;
}
body:before {
    background-color: #f8e2ef;
}
footer.mastfoot {
    background-color: #f8e2ef;
}
a:hover {
    color: #4c2e56;
}
::selection {
    background: #4c2e56;
    color: #f8e2ef
}
::-moz-selection {
    background: #4c2e56;
    color: #f8e2ef
}
.link-show-poster {
    background-color: #f8e2ef;
}
.btn-oscar-color {
    border-color: #ffe902;
    color: #ffe902
}
.btn-oscar-color:hover {
    border-color: #ffe902;
    background-color: #ffe902;
    color: #f8e2ef;
}
nav.mastnav ul li a {
    color: #121212;
}
nav.mastnav ul li a.activelink,
nav.mastnav ul li a:hover {
    color: #aaa;
}
.works-filter li a.active span {
    color: #121212!important;
}
.bxslider .bx-wrapper .bx-pager {
    background-color: #292929;
}
.footer-mobile {
    color: #f8e2ef;
}
.footnav ul li a {
    border-color: #121212;
}
.font1 {
    font-family: 'proxima_novalight';
}
.font2 {
    font-family: 'proxima_nova_rgregular';
}
.font2hairline {
    font-family: 'proxima_novathin';
}
.font2light {
    font-family: 'proxima_nova_rgregular';
}
.font2semibold {
    font-family: 'proxima_novasemibold';
    letter-spacing: -1px;
}
.font2bold {
    font-family: 'proxima_nova_rgbold';
    letter-spacing: -1px;
}
.font2extrabold {
    font-family: 'proxima_novaextrabold';
}
.font2ultralight {
    font-family: 'proxima_novalight';
}
.font2black {
    font-family: 'proxima_novablack';
    letter-spacing: -1px;
}
.font3 {
    font-family: 'proxima_novalight';
}
body,
p {
    font-family: 'proxima_nova_rgregular';
    line-height: 24px;
    letter-spacing: -0.2px;
    font-size: 16px;
}
.show {
  display: inherit !important;
}
/* =Header
-------------------------------------------------------------- */
header {
    width: 100%;
    height: 150px;
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    background-color: transparent;
    -webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    -ms-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s;
    font-family: 'proxima_novasemibold';
    font-size: 13px;
    text-transform: uppercase;
    line-height: 21px;
    font-weight: 700;
    letter-spacing: 0.1em;
}
header h1#logo {
    background: url(../images/logo.svg) no-repeat;
    display: inline-block;
    width: 160px;
    height: 90px;
    line-height: 150px;
    float: left;
    font-family: 'proxima_novasemibold';
    font-size: 60px;
    color: white;
    margin-top: 30px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
header nav {
    display: block;
    float: right;
    text-align: center;
    margin: 0 auto;
}
header nav a {
    text-transform: capitalize;
    line-height: 150px;
    margin-left: 20px;
    letter-spacing: 0px;
    color: #f8e2ef;
    font-size: 16px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
header nav a:hover {
    color: white;
}
header.smaller {
    height: 80px;
    background-color: #f8e2ef;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}
header.smaller h1#logo {
    background: url(../images/logo-scroll-1.svg) no-repeat;
    width: 160px;
    height: 90px;
    line-height: 75px;
    font-size: 30px;
    margin-top: -6px;
}
header.smaller nav a {
    line-height: 75px;
    color: #121212;
}
.header h1#logo {
    display: none;
}

/* =Footer
-------------------------------------------------------------- */

/* =Extras
-------------------------------------------------------------- */
.clearfix:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
}

/* =Media Queries
-------------------------------------------------------------- */
@media all and (max-width: 660px) {
    /* =Header
  -------------------------------------------------------------- */

    header h1#logo {
        display: block;
        float: none;
        margin: 0 auto;
        height: 100px;
        line-height: 100px;
        text-align: center;
    }

    header nav {
        display: block;
        float: none;
        height: 50px;
        text-align: center;
        margin: 0 auto;
    }

    header nav a {
        line-height: 50px;
        margin: 0 10px;
    }

    header.smaller {
        height: 75px;
        background-color: #f8e2ef;
    }

    header.smaller h1#logo {
        height: 40px;
        line-height: 40px;
        font-size: 30px;
    }

    header.smaller nav {
        height: 35px;
    }

    header.smaller nav a {
        line-height: 35px;
        color: #121212;
    }

   /* .blog-container {
        padding: 50px;
        height: auto;
    }

    .blog-para-fix {
        height: auto;
    }*/
    .video-text {
        font-size: 60px;
        line-height: 60px;
}
    .gradient-bg {
        background: linear-gradient(90deg, #f8e2ef 50%, #f8e2ef 50%);
}
}
@media all and (max-width: 600px) {
    .container {
        width: 100%;
    }

    #info-bar a {
        display: block;
    }

    #info-bar span.all-tutorials,
    #info-bar span.back-to-tutorial {
        width: 100%;
    }

    #info-bar span.all-tutorials,
    #info-bar span.back-to-tutorial {
        float: none;
        text-align: center;
    }

    #info-bar span.all-tutorials {
        border-bottom: solid 1px #0793e2;
    }

    /*.blog-container {
        padding: 50px;
        height: auto;
    }*/

    .pad-top-blog {
        padding-top: 100px !important;
    }

    .footer-mobile {
        color: #121212 !important;
    }

    /*.blog-para-fix {
        height: auto;
    }*/
    .video-text {
        font-size: 60px;
        line-height: 60px;
}
    .gradient-bg {
        background: linear-gradient(90deg, #f8e2ef 50%, #f8e2ef 50%);
}
    .hidden {
        display: none !important;
}
}

a:hover,
a:focus {
    color: #4c2e56;
    text-decoration: none;
}

a.filter:hover {
    color: #000;
    font-weight: bold;
    font-family: 'proxima_novasemibold';
}
a.filter {
    color: #f8e2ef;
    font-weight: bold;
    font-family: 'proxima_novasemibold';
}
a.filter:hover, a.filter:focus {
    color: #000 !important;
    text-decoration: none;
}
.what-wedo-text {
    font-family: 'proxima_novasemibold';
    font-size: 14px;
}
.title-wrapper {
    text-align: center;
    position: relative;
    font-family: 'proxima_novasemibold';
    font-size: 22px;
    color: #f8e2ef;
    margin-top: 60px;
}
.home-scroll {
    position: absolute;
    right: 22.22222%;
    top: 7%;
    width: 291px;
    height: 291px;
    z-index: 1;
    user-select: none;
}
#object {
    display: block;
    height: 180px;
    width: 180px;
    border-radius: 50%;
    border: 10px solid #4c2e56;
}
.scroll-arrow {
    position: absolute;
    left: 50%;
    margin-left: -10px;
    top: -54px;
    width: 2px;
    height: 103px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* GET ON SCROLL STYLES */
.Home-scroll {
    position: absolute;
    left: 50%;
    top: 60%;
    margin-top: 100px;
    margin-left: -100px;
    width: 200px;
    height: 200px;
    z-index: 1;
    user-select: none;
}
.Character-title,
.Home-scroll {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.u-table {
    display: table;
}
.HomeScroll-circle {
    left: -5px;
    top: -5px;
    border-radius: 50%;
    border: 5px solid #4c2e56
}
.u-fullParent {
    position: absolute;
    top: 0;
    left: 0;
}
.u-fullParent,
.u-fullSize {
    width: 100%;
    height: 100%;
}
.HomeScroll-titleWrapper {
    text-align: center;
    position: relative;
}
.u-table-cell--center,
.u-table-cell--middle {
    vertical-align: middle;
}
.u-table-cell,
.u-table-cell--center,
.u-table-cell--middle {
    display: table-cell;
}
.u-resestBtn--withoutOutline,
a,
button {
    outline: 0;
}
.u-resetBtn,
a {
    text-decoration: none;
}
.u-centerBg,
:not(body) {
    background-repeat: no-repeat;
}
.HomeScroll-arrow {
    position: absolute;
    left: 50%;
    margin-left: -5px;
    top: -54px;
    width: 2px;
    height: 103px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
/*.Home-scroll h2 {
    font-size: 24px;
    line-height: 28px;
    color: #f8e2ef;
    display: inline-block;
    margin-left: 10px;
    margin-top: 20px;
}*/

.Home-scroll h2 {
    font-size: 24px;
    line-height: 28px;
    color: #f8e2ef;
    display: inline-block;
    margin-left: 55px;
    margin-top: 60px;
}
.Home-scroll h2,
.Home-scroll p {
    text-align: left;
    text-transform: uppercase;
}
.Home-scroll .HomeScroll-label {
    position: absolute;
    display: inline-block;
    transform: translateY(-100%);
}
.Home-scroll p {
    font-size: 16px;
    line-height: 20px;
    color: #4c2e56;
    font-weight: bold;
    display: inline-block;
    margin-left: 3px;
}
.Home-scroll .line {
    display: block;
}
.HomeArrow-head {
    position: absolute;
    fill: none;
    stroke: #f8e2ef;
    stroke-width: 2px;
    bottom: 0;
    left: 3px;
    width: 6px;
    height: 12px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.HomeArrow-body {
    left: 5px !important;
    height: 101px;
    width: 2px;
    background-color: #f8e2ef;
    -webkit-transform-origin: bottom center;
    -ms-transform-origin: bottom center;
    transform-origin: bottom center;
}
.HomeArrow-body {
    top: 0;
    position: absolute;
}

/*--------------------*/
.relative-1 {
    position: relative;
    width: 100%;
    height: 100vh;
}
.pad-top-blog {
    padding-top: 200px;
}

/* =Header Inner
-------------------------------------------------------------- */
header.inner {
    width: 100%;
    /*height: 150px;*/
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    background-color: transparent;
    -webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    -ms-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s;
    font-family: 'proxima_novasemibold';
    font-size: 13px;
    text-transform: uppercase;
    line-height: 21px;
    font-weight: 700;
    letter-spacing: 0.1em;
    background-color: #f8e2ef;
}
header.inner h1#logo {
    background: url(../images/logo-scroll-1.svg) no-repeat;
    display: inline-block;
    width: 160px;
    height: 90px;
    line-height: 150px;
    float: left;
    font-family: 'proxima_novasemibold';
    font-size: 60px;
    color: white;
    font-weight: 400;
    margin-top: 24px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
header.inner nav {
    display: block;
    float: right;
    text-align: center;
    margin: 0 auto;
}
header.inner nav a {
    line-height: 150px;
    margin-left: 20px;
    color: #34373a;
    font-size: 16px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    font-family: "proxima_nova_rgregular" !important;
}
header.inner nav a:active {
    color: #3a3a3a !important;
    border-bottom: 2px solid #3a3a3a !important;;
    padding-bottom: 10px;
}

header.inner nav a:hover {
    color: white;
}
header.inner.smaller {
    height: 80px;
    background-color: #f8e2ef;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}
header.inner.smaller h1#logo {
    background: url(../images/logo-scroll-1.svg) no-repeat;
    width: 160px;
    height: 90px;
    line-height: 75px;
    font-size: 30px;
    margin-top: -6px;
}
header.inner.smaller nav a {
    line-height: 75px;
    color: #34373a;
    font-family: "proxima_nova_rgregular" !important;
}
.header.inner h1#logo {
    display: none;
}
.works-filter li a.active span {
    color: #121212!important;
}
.blog-text {
    margin-top: 30px;
    color: #000;
    line-height: 25px;
    letter-spacing: 0px;
    font-size: 14px;
}
.overlay-img {
    position: absolute;
    width: 95%;
    height: 100%;
    z-index: 2;
    background-color: #080d15;
    opacity: .7;
}
.two {
    width: 70%;
}
.team-quote {
    margin-top: 15px;
}
.no-gutter {
    padding-left: 0px;
    padding-right: 0px;
}

.full-screen{
    width: 100%;
}
.image-gap{
    margin-bottom: 30px;
}
.hash-tags{
    color: #4c2e56;
    font-weight: 800;
    font-size: 12px;
}
.footer-bottom{
    margin-bottom: 16px;
    font-size: 12px;
    line-height: 22px;
    letter-spacing: 0.3px;
        color: #121212;
}
.btn-castle-border {
    color: #f8e2efFFF;
    padding: 15px;
    border-radius: calc(15px*2);
    min-width: 6rem;
    background-color: #4c2e56;
    transition: all 0.33s;
}
.btn-castle-border:hover {
    color: #f8e2ef;
    outline: none;
    background-color: #3e98af;
}
.white :hover {
    color: #f8e2ef;
}

.black :hover {
    color: #000;
}

.mb-20{
  margin-bottom: 20px;
}

.mb-50{
  margin-bottom: 50px;
}

.mt-20{
  margin-top: 20px;
}

.vh100{
  height: 100vh !important;
}

.vh82{
    height: 82vh !important;
}

.title-style{
    text-transform: uppercase;
    font-size: 14px;
    color: #7f8598;
}

.title-style-2{
    font-size: 18px;
    color: #7f8598;
}

.dark-color{
    color: #4c2e56 !important;
}

.face{
    position: absolute;
    width: 150px;
}

@media screen and (max-width: 979px) {
    .hero-section-space{
        padding-top: 100px;
        padding-bottom: 120px;
    }
}

@media screen and (min-width: 978px) {
    .hero-section-space{
        padding-top: 230px;
        padding-bottom: 120px;
    }
}
