/* Think Web Design, Think Matrix. https://thinkmatrix.uk */

body {background: #141215;}

/* Typography */

body, button, input, optgroup, select, textarea {
   font-family: soleil,sans-serif;
   font-weight: 500;
   font-size: 15px;
   line-height: 24px;
   color:#acacac;
 }

h1, h2, h3, h4, h5, h6 {
  color:#ffffff;
  font-weight: 300;
}

p {
  margin: 0px 0px 14px;
}

strong {
    font-weight: 700;
}

html a { color:#acacac; }
html a.lined {text-decoration: underline;}
html a:hover { color:#ffffff; }

h1, h2, html .main-header {
   font-size: 45px;
   line-height: 48px;
   letter-spacing: -1.5px;
}

h3 {
  font-size: 35px;
  line-height: 37px;
  letter-spacing: -0.5px;
}

h4 {
  font-size: 18px;
  line-height: 24px;
  letter-spacing: -0.2px;
}

/* Text Lines */

span[class*="line"] {border-bottom: 4px solid;}
span.line-yellow { border-color: #FFBD31; }
span.line-green { border-color: #58EFAF; }
span.line-blue { border-color: #00D8FF; }
span.line-pink { border-color: #FF4266; }
span.line-orange { border-color: #FF6533; }
span.line-purple { border-color: #6C63FF; }

/* Custom Colours */

html .c-white {color:#ffffff!important;}
html .c-black {color:#222222!important;}
html .c-dark-grey {color:#555555!important;}
html .c-grey {color:#acacac!important;}
html .c-lite-grey {color:#cccccc!important;}

/* Custom Backgrounds */

html .bg-grey { background-color:#d2d2d2!important;}
html .bg-black { background-color:#222222!important;}
html .bg-lite-grey { background-color:#eeeeee!important;}


/* Custom Buttons */

html .btn, html .gform_button.button, .paging-box .page-numbers {
    font-size: 16px;
    line-height: 18px;
    padding: 14px 24px;
    border-radius: 999px;
}

html .btn.btn-primary, html .gform_button.button, .mtx-pagination > .page-numbers.current {
  background: #222222!important;
  color: #ffffff!important;
}

html .btn.btn-primary:hover, html .gform_button.button:hover, .socials .social:hover {
  background: #767676!important;
  color:#ffffff!important;
}

html .bg-black .btn.btn-primary, html .bg-black .gform_button.button, .bg-black .mtx-pagination > .page-numbers.current, html .btn.btn-white {
	color:#222222!important;
  background: #ffffff!important;
}

html .bg-black .btn.btn-primary:hover, html .bg-black .gform_button.button:hover, .bg-black .socials .social:hover, html .btn.btn-white:hover {
  background: #767676!important;
  color:#ffffff!important;
}

html .btn.btn-large, html .gform_button.button {
  font-size: 18px!important;
  line-height: 18px!important;
  padding: 18px 30px!important;
}

html .btn.btn-small {
    font-size: 12px;
    line-height: 18px;
    padding: 8px 14px;
}

.project-meta .btn {margin: 10px 0px 0px;}


/* Site Wide */

html .mtx-separator {border-color:#cccccc;}
html .bc-black {border-color:#141414;}

#the-page {
  overflow: hidden;
  padding-top: 50px;
  padding-bottom: 40px;
}

#the-page.sidebar-layout {
  padding-top:0px;
  padding-bottom: 0px;
}

#to-top {color: #666;}
#to-top:hover {color: #444;}


.divi {
    margin: 0px 10px;
    opacity: 0.3;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
}

.overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background: #000000;
  opacity: 0.7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

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

/* Password Protected */

.lockout-form {padding: 80px 0px;}
.lockout-form form {padding: 40px 0px;}

.lockout-form form input {
    width: 100%;
    max-width: 500px!important;
}

/* Header */

#header-container-background {background-color: #141215;}

header #logo {
    margin-top: 30px;
    margin-bottom: 30px;
}


/* Sidebar */

.sidebar-layout #sidebars {
    margin-top: 60px;
    margin-bottom: 20px;
}

.widget_categories .sidebar-widget-title {
    display: none;
}

.widget_categories ul li {
  list-style: none;
  padding: 0px;
  margin: 0px;
}

.widget_categories li:before {display: none;}

.widget_categories ul li a {
    margin: 0px 0px 4px;
    padding: 0px;
    font-size: 20px;
    line-height: 24px;
    font-weight: bold;
}

/* Footer */

#footer-items {
  background: #141215;
  padding-top: 70px;
  padding-bottom:10px;
}

#footer-items .footer-section, #footer-items h1, #footer-items h2, #footer-items h3, #footer-items h4, #footer-items h5, #footer-items h6 {color: #ffffff;}
#footer-items .footer-section a {
  color: #ffffff;
  font-weight: 600;
}
#footer-items .footer-section a:hover {color: #8c8989;}


#footer-items .footer-section .main-header {margin: 0px 0px 50px;}

#footer-items .footer-section .foot-link {
    margin: 0px 0px 20px;
    color:#ffffff;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}

#footer-items .footer-section .foot-link:hover {color:#8c8989;}

#bottom-bar {
  background: #141215;
  padding-top: 0px;
  padding-bottom: 60px;
}

#bottom-bar, #bottom-bar a {color:#6c6c6c;}
#bottom-bar a:hover {color:#ffffff;}


#bottom-text {
  font-size: 10px;
  line-height: 14px;
  margin: 0px;
  max-width: 1090px;
}

#menu-footer li {padding: 0px;}
#menu-footer li:before {display: none;}

/* Visuals */

#visuals {
    padding-top: 100px;
}

.visual-block {
    margin-bottom: 50px;
}

.visual-block .title-row {
  display: block;
  margin: 0px 0px 20px;
}
.visual-block .title-row a, .visual-block .title-row span {
  display: inline-block;
  vertical-align: top;
}
.visual-block .title-row h4 { margin: 0px;}

.visual-block .title-row span {
  margin-left: 12px;
  opacity: 0.6;
  font-size: 18px;
  line-height: 24px;
}

.visualiser-wrap-link {
    display: block;
    margin: 0px auto 30px;
    position: relative;
    width: 100%;
}

.visualiser-wrap-link:before {
    content: "";
    position: absolute;
    bottom: -25px;
    height: 25px;
    background: #eee;
    width: 100%;
    border-radius: 6px 6px 0px 0px;
    background: -moz-linear-gradient(top, rgba(204,204,204,1) 0%, rgba(204,204,204,0) 100%);
    background: -webkit-linear-gradient(top, rgba(204,204,204,1) 0%,rgba(204,204,204,0) 100%);
    background: linear-gradient(to bottom, rgba(204,204,204,1) 0%,rgba(204,204,204,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#00cccccc',GradientType=0 );
    opacity: 0.25;
}

.visual-block.mobile .visualiser-wrap-link {max-width: 200px;}
.visual-block.tablet .visualiser-wrap-link {max-width: 280px;}

.visualiser-wrap {
    height: 0px;
    padding-bottom: 60%;
    position: relative;
    display: block;
    background: #b2b2b2;
    overflow: hidden;
    border-radius: 6px;
    border: 4px solid #ccc;
    box-sizing: border-box;
}

.visual-block.mobile .visualiser-wrap {padding-bottom: 170%;}
.visual-block.tablet .visualiser-wrap {padding-bottom: 130%;}

.visual-block.mobile .visualiser-wrap, .visual-block.tablet .visualiser-wrap {border-radius: 12px;}

.visual-block.mobile .visualiser-wrap-link:before,
.visual-block.tablet .visualiser-wrap-link:before {
  border-radius: 12px 12px 0px 0px;
}

.visualiser-inner {
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
}

.vis-header {
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    height: 19px;
    background: #b2b2b2;
    z-index: 99;
    padding: 0px 6px;
}

.vis-header > span {
    display: block;
    float: left;
    margin: 7px 3px;
    width: 6px;
    height: 6px;
    border-radius: 99px;
    background: #cccccc;
}

.visual-block.mobile .vis-header {
    background: none;
}

.visual-block.mobile .vis-header span.mid {
    position: absolute;
    top: 0px;
    bottom: 4px;
    width: 40%;
    left: 50%;
    margin: 0px 0px 0px -20%;
    height: auto;
    border-radius: 0px 0px 10px 10px;
}

.visual-block.mobile .vis-header span:last-child {
    right: 7px;
    left: auto;
    position: absolute;
    border-radius: 2px;
    width: 14px;
}

.visual-block.mobile .vis-header span:first-child {
    left: 7px;
    right: auto;
    position: absolute;
    border-radius: 2px;
    width: 14px;
}

.visualiser {
    position: absolute;
    left: -1px;
    right: -1px;
    height: 0px;
    transition: bottom 0.6s linear;
    -moz-transition: bottom 0.6s linear;
    -webkit-transition: bottom 0.6s linear;
    -o-transition: bottom 0.6s linear;
}



.visualiser:hover {
    bottom: 0px!important;
    transition: bottom 3s linear;
    -moz-transition: bottom 3s linear;
    -webkit-transition: bottom 3s linear;
    -o-transition: bottom 3s linear;
}

.visual-block.tablet .visualiser:hover {
  transition: bottom 6s linear;
  -moz-transition: bottom 6s linear;
  -webkit-transition: bottom 6s linear;
  -o-transition: bottom 6s linear;
}
.visual-block.mobile .visualiser:hover {
  transition: bottom 8s linear;
  -moz-transition: bottom 8s linear;
  -webkit-transition: bottom 8s linear;
  -o-transition: bottom 8s linear;
}

.the-visual {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
}

.vis-text-wrapper {
  text-align: left;
  width: 100%;
}
.vis-text-wrapper .btn {margin-top: 20px;}

#client-nav {padding-top: 60px;}

#client-nav > ul {
  list-style: none;
  padding: 0px;
  margin: 0px;
}

#client-nav > ul > li {
  float: left;
  display: block;
  margin-left: 20px;
}

#client-nav > ul > li:first-child {margin-left: 0px;}

#client-nav > ul > li > a, #client-nav > ul > li > span {
  display: block;
  padding: 4px 0px;
  font-size: 18px;
  line-height: 24px;
}

#docs .info-text {
    padding-bottom: 80px;
    padding-top: 60px;
}

#docs .doc-part {
    opacity: 0.2;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
    pointer-events: none;
    margin-bottom: 30px;
}

#docs .doc-part.active {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    pointer-events: all;
}

.loading {
    position: absolute;
    top: 50%;
    left: 0px;
    right: 0px;
    margin-top: -20px;
    opacity: 0.1;
}

.loading .spinner {
    height: 40px;
    width: 40px;
    background: #fff;
    border-radius: 999px;
    display: block;
    margin: auto;
    -webkit-animation: mtx-spin .6s infinite ease-in-out;
    animation: mtx-spin .6s infinite ease-in-out;
}
.visualiser-wrap .loading .spinner {background: #000;}

@-webkit-keyframes mtx-spin {
  0% { opacity:1; -webkit-transform: perspective(120px); }
	20% { opacity:1; }
	50% { opacity:0.5; }
	80% { opacity:1; }
  100% { opacity:1; -webkit-transform: perspective(120px) rotateY(180deg); }
}

@keyframes mtx-spin {
  0% {
		opacity:1;
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
	} 20% {
	   opacity:1;
	} 50% {
    opacity:0.5;
	} 80% {
	  opacity:1;
	} 100% {
		opacity:1;
	  transform: perspective(120px) rotateX(0deg) rotateY(180deg);
	  -webkit-transform: perspective(120px) rotateX(0deg) rotateY(180deg);
	}
}

/* Single Visuals */

.single-visuals #page-header, .single-visuals footer {display: none;}

.single-visuals #the-visual {position: relative;}
.single-visuals #the-visual.desktop.vis-wide {padding-bottom: 0px!important;}
.single-visuals #the-visual.vis-fill {height: 0px!important;}

.single-visuals #the-visual .visual-image {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-repeat:no-repeat;
  background-position:center top;
  padding:0px;
  margin:0px;
}
.single-visuals #the-visual.desktop .visual-image { background-repeat:repeat-x; }

.single-visuals #the-visual.vis-fill .visual-image {background-size: 100%!important;}

.single-visuals #to-top {display: none!important;}

.actions {
  position: fixed;
  bottom: 0px;
  right: 0px;
  height: 40px;
  padding: 20px;
  opacity:0.3;
  mix-blend-mode: exclusion;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
}

.actions:hover {opacity:1;}

.back-to-vis {
  position:relative;
  float: left;
  margin-left:10px;
  height:40px;
  width: 40px;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
}

.switcher {
  position:relative;
  float: left;
  height:40px;
  width: 40px;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
}

.switcher:hover {width: 84px;}

.switcher > a {
    position: absolute;
    top: 0px;
    height: 40px;
    width: 40px;
    display: block;
    opacity:0;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    cursor: pointer;
}

.switcher:hover > a {opacity:0.3;}
.switcher > a:hover {opacity:0.5;}
.switcher > a.active {
  opacity:1!important;
  cursor: default;
}

.switcher > a.s-wide {left:0px;}
.switcher > a.s-fill {right:0px;}

.mtx {
  position:fixed;
  bottom:0px;
  left:0px;
  padding: 20px;
  width:auto;
  height:84px;
  color:#ffffff;
  mix-blend-mode: exclusion;
  z-index: 99999;
}
.mtx img {
  display:inline-block;
  margin-right:10px;
  opacity:1;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
}
.mtx img:hover {opacity:0.7;}
.mtx .copy {
  display:inline-block;
  vertical-align: top;
  margin-top: 20px;
  font-family: 'Open Sans', sans-serif;
  font-size:12px;
  line-height:16px;
}
.mtx .copy span.bottom {opacity:0.6;}
.mtx .copy span {display:block;}

@media (max-width: 1717px) { .mtx .copy {display: none;} }


/* Forms */

#main-wrap input[type=email], #main-wrap input[type=number], #main-wrap input[type=password], #main-wrap input[type=search], #main-wrap input[type=tel], #main-wrap input[type=text], #main-wrap input[type=time], #main-wrap input[type=url], #main-wrap select,
#main-wrap textarea, #main-wrap .gfield.ticker ul.gfield_checkbox li label:before, #main-wrap .gfield.ticker .gform_wrapper ul.gfield_radio li label:before, #main-wrap .label-click .gfield_checkbox li label, #main-wrap .label-click .gfield_radio li label {
  border-color:#eee;
}

#main-wrap .gform_wrapper .gsection_title {
    font-weight: bold;
    margin-bottom: 20px!important;
    font-size: 22px;
    line-height: 26px;
}

.ginput_container.ginput_recaptcha {
    margin-bottom: 30px!important;
}

/* Black Forms */

#main-wrap .bg-black .gform_wrapper div.validation_error,
#main-wrap .bg-black .gform_wrapper .validation_message { color: #9b9b9b; }


/* Cookie Bot */

html #CybotCookiebotDialog {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

html #CybotCookiebotDialog * {border-radius: 0px;}

html #CybotCookiebotDialogBody, html #CybotCookiebotDialogDetailBody {
    padding: 0px 30px;
    max-width: 1230px;
    box-sizing: border-box;
}
html div#CybotCookiebotDialogDetail {margin-top: 20px;}
html a#CybotCookiebotDialogBodyLevelButtonAccept {
    border: none;
    background: #222222;
    padding: 4px 10px;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 20px;
    font-weight: bold;
    margin: 0px 0px 10px;
}

html div#CybotCookiebotDialogPoweredbyLink {display: none;}
html #CybotCookiebotDialogBodyContent {padding: 15px 0px 10px;}


html #CybotCookiebotDialog {color:#555555;}
html #CybotCookiebotDialog h1, html #CybotCookiebotDialog h2, html #CybotCookiebotDialog h3, html #CybotCookiebotDialog h4, html #CybotCookiebotDialog h5, html #CybotCookiebotDialog h6 {color:#222222;}

html #CybotCookiebotDialog a, html #CybotCookiebotDialog div, html #CybotCookiebotDialogBodyContentTitle {
  font-family: "aktiv-grotesk",Helvetica, sans-serif;
  font-size: 12px;
  line-height: 18px;
}
html #CybotCookiebotDialogBodyContentTitle {
  font-size: 16px;
  line-height: 22px;
}



/* Widescreen */
@media (min-width: 1200px) {

  h4 {
    font-size: 22px;
    line-height: 26px;
  }

  h5 {
    font-size: 18px;
    line-height: 23px;
  }

}

/* Desktop */
@media (max-width: 1199px) and (min-width: 990px) {

  h1 {
    font-size: 42px;
    line-height: 45px;
  }

  h2, html .main-header {
    font-size: 38px;
    line-height: 40px;
    letter-spacing: -1px;
  }

  #tweets .tweet p {
    font-size: 30px;
    line-height: 46px;
    letter-spacing: -0.7px;
  }

  h3 {
    font-size: 26px;
    line-height: 30px;
  }

  h4 {
    font-size: 20px;
    line-height: 24px;
  }

  h5 {
    font-size: 16px;
    line-height: 18px;
  }

  #main-wrap .gform_wrapper .gform_button.button[type="submit"] {
    font-size: 28px;
    line-height: 36px;
  }

  .fl-row-content-wrap.project-intro .fl-col[frac="3"] {width: 48%!important;}
  .fl-row-content-wrap.project-intro .fl-col[frac="3"].tab-clear {
    clear: both;
    margin-left: 0%!important;
  }

  .fl-row-content-wrap.home-services .fl-col[frac="3"] {width: 48%!important;}
  .fl-row-content-wrap.home-services .fl-col[frac="3"].tab-clear {
    clear: both;
    margin-left: 0%!important;
  }

}

/* Tablet & Below */
@media (max-width: 990px) {

  .single-visuals #the-visual.tablet .visual-image {
    background-size: 100%!important;
  }

  .single-visuals #the-visual.tablet {
    height: 0px!important;
  }

}

/* Desktop & Above */
@media (min-width: 990px) {

  #header-container.stuck #header-container-background {background: #ffffff;}
  .absolute-header #header-container #header-container-background {background: transparent;}
  .absolute-header #header-container.stuck #header-container-background {background: #ffffff!important;}

  html #header-container.stuck #mtx-navigation #menu-main .menu-item > a {
    padding-top: 8px;
    padding-bottom: 8px;
  }

  #header-container.stuck #mtx-navigation {margin-top: -18px;}
  #header-container.stuck #mtx-navigation.sub-opened {margin-top: -36px;}

  .single-visuals #the-visual.tablet {padding-bottom: 0px!important;}

}

/* iPad & Above */
@media (min-width:768px) {

  .flex-blocks, .fl-mtx-slider .owl-stage {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
  }

  .flex-blocks, .flex-blocks > div, .flex-blocks > div > div, .flex-blocks > div > a,
  .fl-mtx-slider .owl-stage, .fl-mtx-slider .owl-stage > div, .fl-mtx-slider .owl-stage > div > div,
  .flex-slider .owl-stage, .flex-slider .owl-stage > div, .flex-slider .owl-stage > div > div,
  .fl-tabs-labels, .fl-tabs-labels .fl-tabs-label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }

  .flex-blocks > div, .flex-blocks > div > div, .flex-blocks > div > a,
  .fl-mtx-slider .owl-stage > div, .fl-mtx-slider .owl-stage > div > div,
  .flex-slider .owl-stage > div, .flex-slider .owl-stage > div > div {
    -webkit-box-flex: 0 1 auto;
    -moz-box-flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
  }

  .fl-tabs-labels .fl-tabs-label {
    -webkit-box-flex: 1 1 auto;
    -moz-box-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
  }

  .flex-blocks > div > div, .flex-blocks > div > a,
  .fl-mtx-slider .owl-stage > div > div,
  .flex-slider .owl-stage > div > div {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    flex-shrink: 1;
    min-width: 1px;
    max-width: 100%;
    width: 100%;
  }

  .flex-blocks.flex-blocks-centered > div > div,
  .flex-blocks.flex-blocks-centered > div > a,
  .flex-slider.flex-slider-centered .owl-stage > div > div {
    align-items: center;
    justify-content: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-align: center;
    -ms-flex-pack: center;
  }

  .flex-blocks.flex-blocks-bottom > div > div,
  .flex-blocks.flex-blocks-bottom > div > a {
    align-items: end;
    justify-content: end;
    -webkit-align-items: end;
    -webkit-box-align: end;
    -webkit-box-pack: end;
    -webkit-justify-content: end;
    -ms-flex-align: end;
    -ms-flex-pack: end;
  }

}


/* Mobile */
@media (max-width: 989px) and (min-width: 768px) {

  h1 {
    font-size: 35px;
    line-height: 40px;
  }

  h2, html .main-header {
    font-size: 32px;
    line-height: 38px;
    letter-spacing: -0.5px;
  }

  h3 {
    font-size: 26px;
    line-height: 30px;
  }

  h4 {
    font-size: 20px;
    line-height: 24px;
  }

  h5 {
    font-size: 16px;
    line-height: 18px;
  }

  #home-slider .main-slide-text {
    font-size: 22px;
    line-height: 26px;
  }

  #home-slider-navigation .slide-nav-title {
    font-size: 50px;
    line-height: 56px;
  }

  #tweets .tweet p {
    font-size: 24px;
    line-height: 38px;
    letter-spacing: -0.5px;
  }

  #main-wrap .gform_wrapper .gform_button.button[type="submit"] {
    font-size: 26px;
    line-height: 34px;
  }

  .fl-row-content-wrap.project-intro .fl-col[frac="3"] {width: 48%!important;}
  .fl-row-content-wrap.project-intro .fl-col[frac="3"].tab-clear {
    clear: both;
    margin-left: 0%!important;
  }
  .fl-row-content-wrap.home-services .fl-col[frac="3"] {width: 48%!important;}
  .fl-row-content-wrap.home-services .fl-col[frac="3"].tab-clear {
    clear: both;
    margin-left: 0%!important;
  }

  .mtx-project {
      width: 50%;
      padding-bottom: 35.7%;
  }

  .mtx-project.first {clear: none;}
  .mtx-project.mob-first {clear: both;}

  .team-feed .team-member {width: 48%;}
  .team-feed .team-member.first {
    margin-left: 4%;
    clear:none;
  }
  .team-feed .team-member.tab-first {
    margin-left: 0px;
    clear:both;
  }

}

@media (max-width: 767px) {

  body {
    font-size: 13px;
    line-height: 21px;
  }

  header #logo {
    margin-top: 20px;
    margin-bottom: 20px;
  }

  h1 {
    font-size: 30px;
    line-height: 36px;
  }

  h2, html .main-header {
    font-size: 26px;
    line-height: 30px;
    letter-spacing: -0.5px;
  }

  h3 {
    font-size: 26px;
    line-height: 30px;
  }

  h4 {
    font-size: 16px;
    line-height: 20px;
  }

  #footer-contact {
    padding-left: 30px;
    padding-right: 30px;
  }

  .post-type-archive-projects #the-page {
    padding-left: 0px;
    padding-right: 0px;
  }

  #home-slider-navigation .cap-box-wrap {
    max-width: 460px;
    padding: 0px 30px;
    box-sizing: border-box;
  }

  #home-slider-navigation .slide-nav-title {
    font-size: 30px;
    line-height: 38px;
  }

  #home-slider .slide-item .slide-text-wrap .main-slide-text {
    font-size: 18px;
    line-height: 24px;
  }

  #tweets {
      padding: 70px 0px 50px;
  }

  #tweets .tweet p {
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.5px;
    word-break: break-word;
  }

  .fl-col-content.restrict-right, .fl-col-content.restrict-left {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .mtx-entrance-spill {
    position: relative;
    display: block;
    height: 300px;
    width: 100%!important;
    margin-bottom: 60px;
  }

  #main-wrap .gform_wrapper .gform_button.button[type="submit"] {
    font-size: 24px;
    line-height: 32px;
  }

  .project-name {margin: 0px 0px 30px;}

  .mtx-project-overview {padding: 40px 0px;}

  .project-metas ul li {display: inline-block;}
  .project-metas ul li:before {content:", ";}
  .project-metas ul li:first-child:before {content:"";}

  .fl-row-content-wrap.project-image .fl-row-content {
    padding-top: 10px!important;
    padding-bottom: 20px!important;
  }

  .fl-row-content-wrap.aspire-ani {display: none;}

}

@media (max-width: 767px) and (min-width: 521px) {

  #logo {
    padding: 0px;
    display: inline-block;
  }

  #mtx-navigation {right:-15px;}
  html #header-container #mtx-navigation #menu-main .menu-item > a {padding: 18px 15px;}
  #mtx-navigation #menu-main .menu-item.menu-item-has-children > .sub-menu {right:10px;}
  html #header-container #mtx-navigation #menu-main .sub-menu > .menu-item > a {
    padding: 12px 5px;
    font-size: 11px;
    line-height: 14px;
  }

  #words .words-inner h4 {
    transform: scale(0.7);
    -o-transform: scale(0.7);
    -moz-transform: scale(0.7);
    -webkit-transform: scale(0.7);
  }

  .mtx-project {
      width: 50%;
      padding-bottom: 35.7%;
  }

  .mtx-project.first {clear: none;}
  .mtx-project.mob-first {clear: both;}

  .mtx-head-image .fl-row-content {
    padding-top: 180px!important;
    padding-bottom: 140px!important;
  }

  .team-feed .team-member, .team-feed .team-member.first {
    width: 48%!important;
    float: left!important;
    margin-left: 4%!important;
    clear:none!important;
  }
  .team-feed .team-member.mob-first {
    margin-left: 0px!important;
    clear:both!important;
  }

}

/* Mobile Wide & Above */
@media (min-width: 520px) {
  .single-visuals #the-visual.mobile {padding-bottom: 0px!important;}
}

/* Mobile Portrait */
@media (max-width: 520px) {

  .about-top .mtx-row-overlay {opacity: 0.6!important;}
  .mtx-head-image .fl-row-content {
    padding-top: 160px!important;
    padding-bottom: 100px!important;
  }

  #header-container {text-align: center;}

  header #logo {
      padding-left: 0px!important;
      padding-right: 0px!important;
      text-align: left!important;
      display: inline-block;
      margin-left: 30px!important;
      margin-right: 30px!important;
  }

  #mtx-navigation {display: none;}

  #the-menu-switch {
    display: inline-block;
    position: relative;
  }

  .mtx-mob-menu.showit {
  	position: fixed;
    	top: 0;
    	left: 0;
    	width: 100%;
    	height: 100%;
  	opacity: 1;
  	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
      transition: opacity 0.4s ease-in-out;
      -ms-transition: opacity 0.4s ease-in-out;
      -moz-transition: opacity 0.4s ease-in-out;
      -webkit-transition: opacity 0.4s ease-in-out;
  	}

  	.mtx-mob-menu.removeit {
  	position: fixed;
    	top: 0;
    	left: 0;
    	width: 100%;
    	height: 100%;
  	opacity: 0;
  	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
      transition: opacity 0.4s ease-in-out;
      -ms-transition: opacity 0.4s ease-in-out;
      -moz-transition: opacity 0.4s ease-in-out;
      -webkit-transition: opacity 0.4s ease-in-out;
  	}

  #words .words-inner h4 {
    font-size: 30px!important;
    line-height: 32px!important;
  }

  .mtx-project {
      width: 100%;
      padding-bottom: 71%;
  }

  .mtx-project, .mtx-project.first, .mtx-project.mob-first {clear: both;}

  .single-visuals #the-visual.mobile .visual-image {
    background-size: 100%!important;
  }

  .single-visuals #the-visual.mobile {
    height: 0px!important;
  }

}

/*               _        _
 _ __ ___   __ _| |_ _ __| |_  __
| '_ ` _ \ / _` | __| '__| \ \/ /
| | | | | | (_| | |_| |  |_|>  <
|_| |_| |_|\__,_|\__|_|  (_)_/\_\

*/