/*

Theme Name: X – Child Theme
Theme URI: http://theme.co/x/
Author: Themeco
Author URI: http://theme.co/
Description: Make all of your modifications to X in this child theme.
Version: 1.0.0
Template: x

*/

html {
  font-size: 12px!important;
}

p {
    margin: 0 0 1.5em;
}

#cs-content .x-container.max {
  max-width: 1360px!important;
}

#cs-content .x-container.width {
  width: 95%!important;
}

*{
  letter-spacing: 0!important;
  line-height: 1.35em!important;
}

body, .page-template-template-blank-4-php .x-main{
  background: #F5F5F5!important;
  color: #35393D!important;
}

#cs-content .e2-8.x-text, #cs-content .e2-15.x-text, #cs-content .e2-23.x-text {
  color: #35393D!important;
}
/* Header */

.x-navbar {
  border-bottom: 6px solid #000000!important;
}

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {
  box-shadow: 0 6px 0 0 rgb(0,140,204)!important;
}

.x-brand img {
width: 589px!important;
}

/* Header topbar phone numebr  */
.x-topbar {
  display:inline-block;
  position:absolute;
  top:0;
  right:0;
  width:28em;
  margin-right:2em;
  }

.x-topbar .p-info {
  float:none;
  font-size:1.5em;
  padding: 0 1em;
  color:white;
  font-style:italic;
}

.x-topbar .p-info a{
  color:white;
  font-weight: bold;
  font-style:normal
}

/* Services Grid */

.tg-bottom-holder::before {
  content: "";
  width: 4em;
  height: 4em;
  background: #008CCC;
  display: block;
  transform-origin: 0 100%;
  transform: rotate(45deg);
}

/* Services page */

#services-list .x-container .x-container div > div:last-child p {
  display:inline;
}

#services-list .x-container .x-container div > div:last-child p::after {
  content:"";
  width:1em;
  height:1em;
  background-image:url('img/pip-green-next.png');
  display: inline-block;
  position: relative;
  left: .3em;
  top: .1em;
  background-size: cover;
}

.services-h2-container h2 {
    font-size:2.7em;
}

/* Button styling */
.x-anchor,
[type="submit"]{
  border-radius: 0px!important;
  background-color: #59ba42!important;
  box-shadow: 0px 6px 0px 0px rgb(59, 131, 40)!important;
}

.x-anchor:hover,
[type="submit"]:hover{
  background-color: rgb(96, 216, 70);
  box-shadow: 0px 6px 0px 0px rgb(79, 171, 40)!important;
}

/* Navbar */
.x-navbar .desktop .x-nav > li > a {
  font-size:2em!important;
  text-transform:none!important;
  font-weight: normal!important;
  color:#C4C4C4!important;
  padding-bottom:1em;
}

.x-navbar .desktop .x-nav>li>a {
  border-right: 0px!important;
}

.x-navbar .desktop .x-nav>li:first-child>a {
  border-left: 0px!important;
}

.x-navbar .desktop .x-nav > li > a:not(.x-btn-navbar-woocommerce) {
  padding-left: 1em!important;
  padding-right: 1em!important;
}

nav.desktop span {
  position:relative;
  bottom:-2em
}

/* Pre-footer */
.pre-footer-pip-inverted{
  position:relative;
}
.pre-footer-pip-inverted::before,
.pre-footer-pip-inverted::after {
  content:"";
  width:100%;
  position:absolute;
  background:#008CCC;
  height:92px;
  display:block;
  z-index:99;
  bottom:0;
  left:-99.9%;
}

.pre-footer-pip-inverted::after {
  right:-99.9%;
  left:auto;
}

/* Sidebar */
.x-global-block-135 li a{
  font-size:1.8em!important;
}

/* Sidebar free-quote button  */

.x-anchor-button {
  display: block;
}

.x-anchor-button .x-anchor-content,
 {
  justify-content: left!important;
  align-items: left!important;
  padding: 0.5em 0.5em 0.4em 0.85em!important;
  margin-top:2em!important;
}

.x-anchor-button::after,
[type="submit"]::after {
  content: "";
  background-image: url('img/pip-next-white.png');
  background-repeat: no-repeat;
  background-position: center;
  height: 1em;
  width: 1em;
  position: absolute;
  top: 0.68em;
  right: 0.8em;
  z-index: 1;
  transition: 0.2s;
}

.x-anchor-button:hover::after {
    right: 0.5em;
}

/* Contact-firm button  */
[type="submit"]{
  float:right;
  text-transform: uppercase;
  text-shadow:none!important;
  font-size:2em!important;
  position:relative!important;
  margin-bottom:2em;
  margin-top:2em;
}

[type="submit"]:hover{
  margin-bottom:2em!important;
  margin-top:2em;
}


/* Sidebar checklist  */
.e135-6.x-text {
    font-size: 2em!important;
    padding-top: 1.5em!important;
}

.e135-6.x-text li,
#home-checklist-special li {
    margin-bottom: 1em;
    line-height: 1em!important;
    list-style:none;
    position:relative;
    margin-left: 1em;
}

.e135-6.x-text li::before,
#home-checklist-special li::before {
    content:"";
    display:inline-block;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    height:2em;
    width:2em;
    background: url('img/check-mark-green.png');
    position:absolute;
    left:-3.5em;
    top:0.2em;
}

#home-checklist-special {
  padding-top: 1em!important;
  padding-bottom: .5em!important;
  padding-right: 1em!important;
  margin-top:0.8em!important;
}

#home-checklist-special::after {
  content: "";
  background: url(img/pip-grey-v.png);
  height: 78px;
  width: 37px;
  display: inline-block;
  position: absolute;
  right: -37px;
  top: 0.8em;
}

.x-global-block-135 .widget.widget_nav_menu .menu-item,
.x-global-block-135 .widget.widget_nav_menu .current-menu-item {
  border:0!important;
}

.x-global-block-135 .widget.widget_nav_menu .menu-item a{
  background:white;
  position:relative;
  margin-bottom: 0.8em;
  padding:0.6em 1em;
  /*height:2.4em;*/
  display:block;
  transition: 0.2s;
  text-decoration: none!important;
}

.x-global-block-135 .widget.widget_nav_menu .current-menu-item a{
  background:#008CCC;
  margin-bottom: 0.8em!important;
  /*height:2.4em;*/
  text-decoration: none!important;
  display:block;
  transition: 0.2s;
  color: white!important;
  font-weight:bold;
}

.x-global-block-135 .widget.widget_nav_menu .menu-item a::before{
  content: "";
  width: 2em;
  position: absolute;
  display: block;
  z-index: 99;
  right: 100%;
  top: 0;
  height: 60px;
  border-top: 36px solid transparent;
  border-right: 36px solid white;
  border-bottom: 36px solid transparent;
  font-weight: bold;
  color:white!important;
  z-index:-1;
  margin-right:-36px;
  transition: 0.2s;
}

.x-global-block-135 .widget.widget_nav_menu .current-menu-item a::before,
.x-global-block-135 .widget.widget_nav_menu .menu-item a:hover::before{
  margin-right:0em;
  border-right: 1.2em solid #008CCC;
}

.x-global-block-135 .widget.widget_nav_menu .menu-item a:hover{
  background:#008CCC;
  color: white!important;
  font-weight:bold;
}

/* Homepage checklist */

#home-checklist-special{
  background:#35393D;
  padding:1em;
}

/* Services list */
#services-list h2{
  color:white;
}

.services-h2-container{
  position:relative;
}

.services-h2-container::before{
  content: "";
  width: 4em;
  height: 4em;
  background: #008CCC;
  display: inline-block;
  transform-origin: 0 0;
  transform: rotate(-45deg);
  position: absolute;
  top: 100%;
  left: 0%;
  z-index: -1;
}

/* MObile header */
.x-btn-navbar {
  margin-top: 3em!important;
}

.x-navbar .mobile .x-nav .current-menu-item > a {
  color:white!important;
  background-color: #008CCC;
}


/* Footer */
.x-colophon .widget:before {
  content: none!important;
}

.x-colophon .widget{
  font-size:1.5em;
  color:#AFADAD!important;
}

.x-colophon .widget a{
  color:#AFADAD!important;
    transition:0.2s;
}

.x-colophon .widget a:hover{
  color:#f5f5f5!important;
}

.x-colophon .widget h4{
  font-size:1.5em!important;
}

.business-badge {
  display:inline-block;
}

.i-choose-sa{
  width:6em
}

.business-sa {
  width: 11em;
  margin-left: 1em;
  margin-right: 1em;
}

.onkaparinga {
  width: 11em;
  margin-top: 1.5em;
}

footer.x-colophon.top #custom_html-4 {
  margin-top:2em;

}

footer.x-colophon h4{
  margin-bottom:0.8em;
}

footer.x-colophon p{
  margin-bottom:1.5em;
}

img.smt-footer-logo {
  margin-top: 0.5em;
  margin-bottom: 1.25em;
}

.x-colophon-content.left {
  font-size: 2em;
  text-transform: none;
}

footer.x-colophon.bottom {
  background: rgb(33,33,33);
}

.footer-facebook,
.footer-insta{
  text-decoration: none!important;
}

.footer-facebook i,
.footer-insta i{
  font-size:1.8em;
  color:white;
  transform:translateY(0.15em);
  margin-right: 0.3em;
}


/* Contact us block  */

#cs-content .e101-11.x-anchor {
  margin: 1em 0em 0em 0em!important;
}

#cs-content .e101-11.x-anchor-button::after{
  top: 0.46em;
}

.contact-page-social-icons a{
  color:#333333;
  transition:0.2s;
}

.contact-page-social-icons i{
  font-size:1.8em;
  transform:translateY(0.15em);
  margin-right: 0.3em;
}

/* Contact form  */
input.half-size {
  width: calc(50% - 1.1em)!important;
  display: inline-block!important;
}

span.wpcf7-form-control-wrap.your-name {
  margin-right: 2.2em;
}

.wpcf7 *{
  font-size:1.1em!important;
}

.wpcf7 input{
 margin-bottom:2em;
}

/*Special intext links on the service page */
.intext-line-link a{
  color:#59ba42;
}
.intext-line-link a:hover{
  color:#338811;
}

.intext-line-link a::after{
  content:"";
  width:1em;
  height:1em;
  background-image:url('img/pip-green-next.png');
  display: inline-block;
  position: relative;
  left: .3em;
  top: .1em;
  background-size: cover;
}

/*Header scrolly behaviour*/
@media (min-width: 979px){
  .masthead .x-brand img,
  .masthead .x-brand,
  .masthead .x-navbar .desktop .x-nav > li > a,
  .masthead .x-navbar .desktop .x-nav > li > a span,
  .x-navbar-inner,
  .x-topbar{
    transition: 0.3s ease-in-out;
  }

  .masthead.scrolled .x-brand {
    margin-top: 15px;
  }

  .masthead.scrolled .x-brand img{
    width:300px!important;
  }

  .masthead.scrolled .x-navbar .desktop .x-nav > li > a{
    padding-bottom:0.5em;
    padding-top:0em;
    height:80px;
  }

  .masthead.scrolled .x-navbar .desktop .x-nav > li > a span{
    bottom:-30px;
  }

  .masthead.scrolled .x-navbar-inner {
    min-height: 80px;
  }

  .masthead.scrolled .x-topbar {
    top: -50px;
  }
}

/* RESPONSIVE */


@media (max-width: 1200px){
  html {
      font-size: 12px!important;
  }
  .x-brand img {
    width: 450px!important;
  }
}

@media (max-width: 979px){
  html {
    font-size: 10px!important;
  }
  .x-colophon-content.left {
    font-size: 1.2em;
  }
}

@media (max-width: 767px){
  html {
    font-size: 8px!important;
  }
  .x-brand img {
    width: 350px !important;
  }
  .e2-23.x-text {
    margin: -50px 0em 0em 0em!important;
  }
  .e101-7.x-text {
    font-size: 3.7em!important;
  }
  .e101-3.x-column {
    padding: 20px 0em 0em 0em!important;
  }
  .pre-footer-pip-inverted::before, .pre-footer-pip-inverted::after {
    height: 31px!important;
  }
  .x-global-block-135 .widget.widget_nav_menu .menu-item a::before{
    display:none;
  }
}

@media (max-width: 480px){
  html {
    font-size: 8px!important;
  }
  .x-brand img {
    width: 250px !important;
  }
  .masthead.masthead-inline {
    height: 100px!important;
  }
  .x-navbar-inner {
    min-height: 100px!important;
  }
  .x-topbar{
    width: 105%!important;
    margin: 0!important;
    left: -2.5%!important;
    min-height: 24px!important;
  {
}
