body{
  overflow-x: hidden;
}

a, button{
  &:hover, &:active, &:focus{
    outline: none;
    @include transition(all 0.35s);
  } 
}
// images, video
//---------------------------------
img{
    border: 0;
    vertical-align: top;
    max-width: 100%;
    height: auto;
}

.video-responsive {
	height        : 0;
	padding-top   : 0;
	padding-bottom: 56.25%;
	margin-bottom : 10px;
	position      : relative;
	overflow      : hidden;
	embed,iframe,object,video{
		top     : 0;
		left    : 0;
		width   : 100%;
		height  : 100%;
		position: absolute;
	}
}

input[type="text"], 
input[type="tel"],
input[type="password"],
input[type="email"],
textarea, select{
  background-color: #fff;
  @include box-shadow(0 0 2px 2px rgba(0, 0, 0, 0.02) inset);
  border: 1px solid $border-color;
  padding: 5px 10px;
  max-width: 100%;
  &:focus, &:active, &:hover{
    outline: none;
  }
}

textarea{
  width: 100%; 
}


input, textarea, select{
  &:focus, &:active, &:hover{
    outline: none;
  }
}
.wp-caption{
  margin-top: 10px;
  margin-bottom: 10px; 
}
.aligncenter{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.alignleft{
  text-align: left;
  float: left;
  margin-right: 15px;
  margin-bottom: 10px;
}

.alignright{
  text-align: right;
  float: right;
  margin-left: 15px;
  margin-bottom: 10px;
}
.category-alignment{

}
.link-pages{
  float: left;
  width: 100%;
}
.page-links{
  font-family: $font-family-second;
  font-weight: 500;
  > a, > span:not(.page-links-title){
    padding: 2px 12px;
    background: $theme-color;
    line-height: 38px;
    text-align: center;
    color: $white;
    @include transition(all 0.35s);
    &:hover{
      background: lighten($theme-color, 15%);
    }
  }
  > span:not(.page-links-title){
    background: lighten($theme-color, 15%);
  } 
}
#wp-calendar{
  width: 100%;
  margin-bottom: 0;
  caption{
    font-weight: 600;
    font-family: $font-family-second;
  }
  td,th{
    padding: 5px;
    text-align: center;
  }
  caption{
    margin-bottom: 10px;
  }
  > thead > tr {
    > th,
    > td {
      border-bottom-width: 0px !important;
    }
  }
}

table {
  width: 100%;
  margin-bottom: $line-height-computed;
  border: 1px solid $table-border-color;
  > thead,
  > tbody,
  > tfoot {
    > tr {
      > th,
      > td {
        border-color: $table-border-color;
        border-width: 1px 1px 1px 0;
        border-style: solid;
      }
    }
  }
  > thead > tr {
    > th,
    > td {
      border-bottom-width: 2px;
    }
  }
}

.no-padding{
  padding: 0!important;
}

a.disable{
  pointer-events: none;
  cursor: default;
}
ul{
  li i{
    margin-right: 3px;
  }
  &.medium{
    list-style-type: none;
    padding-left: 0;
    > li{
      line-height: 24px;
      font-size: 13px;
      margin-bottom: 5px;
    }
  }
}
ul.feature-list{
  margin-top: 30px;
  padding-left: 20px;
  margin-top: 10px;
  > li{
    list-style-type: none;
    padding-left: 30px;
    position: relative;
    margin-bottom: 5px;
    &:after{
      content: "\e906";
      font-family: "gva-icon";
      position: absolute;
      top: 2px;
      left: 2px;
      z-index: 1;
      color: $theme-color;
    }
  }
}

ul.inline{
  > li{
    float: left;
    margin-left: 5px;
  }
}


/* Text meant only for screen readers. */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000; /* Above WP toolbar. */
}

/************************* Pagination ************************/
.pager{
  .paginations{
    border-radius: 5px;
    display: inline-block;
    padding: 4px 3px;
    a {
      border: 1px solid $border-color;
      font-weight: 600;
      display: inline-block;
      height: 35px;
      line-height: 35px;
      margin: 0 1px;
      text-align: center;
      width: 35px;
      margin-right: 10px;
      @include border-radius(50%);
      @include box-shadow(0 4px 6px rgba(0, 0, 0, 0.1));
      font-family: $font-family-second;
      &:last-child{
        margin-right: 0;
      }
      &.active, &:hover, &:focus{
        background: $theme-color;
        border-color: $theme-color;
        color: $white;
      }
    }
  }
}

.woocommerce .pager{
  .pages{
    > *{
      border: 1px solid $border-color;
      font-weight: 600;
      display: inline-block;
      @include size(36px, 36px);
      @include border-radius(6px);
      line-height: 36px;
      text-align: center;
      margin-right: 10px;
      font-size: 14px;
      color: #888888;
      &:last-child{
        margin-right: 0;
      }
      &:hover{
        color: #242424;
        border-color: #242424;
        text-decoration: -moz-anchor-decoration;
      }
    }
    span{
      color: #242424;
      text-decoration: -moz-anchor-decoration;
      border-color: #242424;
    }
  }
}

//Margin
.margin-1{
  margin-top: -60px;
  @media(max-width: $screen-sm-max){
    margin-top: 30px;
  }
}
.margin-bottom-0{margin-bottom: 0!important;}
.margin-bottom-10{margin-bottom: 10px!important;}
.margin-bottom-20{margin-bottom: 20px!important;}
.margin-bottom-30{margin-bottom: 30px!important;}
.margin-bottom-40{ margin-bottom: 40px!important;}
.margin-bottom-50{margin-bottom: 50px!important;}

.margin-top-0{margin-top: 0!important;}
.margin-top-10{margin-top: 10px!important;}
.margin-top-20{margin-top: 20px!important;}
.margin-top-30{margin-top: 30px!important;}
.margin-top-40{ margin-top: 40px!important;}
.margin-top-50{margin-top: 50px!important;}

//Padding
.padding-bottom-10{padding-bottom: 10px!important;}
.padding-bottom-20{padding-bottom: 20px!important;}
.padding-bottom-30{padding-bottom: 30px!important;}
.padding-bottom-40{padding-bottom: 40px!important;}
.padding-bottom-50{padding-bottom: 50px!important;}

.padding-top-10{padding-top: 10px!important;}
.padding-top-20{padding-top: 20px!important;}
.padding-top-30{padding-top: 30px!important;}
.padding-top-40{padding-top: 40px!important;}
.padding-top-50{padding-top: 50px!important;}


.padding-50{
  padding: 50px!important;
  @media(max-width: $screen-sm-max){
    padding: 30px!important;
  }
}
.padding-40{
  padding: 40px!important;
}
.padding-30{
  padding: 30px!important;
}
.padding-20{
  padding: 20px!important;
}

.padding-responsive{
  padding: 30px 120px;
  @media(max-width: $screen-sm-max){
    padding: 30px;
  }
}
  
.special-margin-top{
  margin-top: -100px; 
  @media(max-width: $screen-sm-max){
    margin-top: 30px;
  }
}

.special-margin-top-2{
  margin-top: -120px; 
  @media(max-width: $screen-sm-max){
    margin-top: 10px;
    margin-bottom: 30px;
  }
}

//background
.no-bg{
  background: transparent!important;
}
.bg-theme{
  background: $theme-color!important;
}
.bg-theme-2{
  background: $theme-color-2!important;
}
.bg-dark{
  background: #222!important;
}
.bg-white{
  background: $white!important;
}
.bg-center{
  background-position: center center!important;
  background-repeat: no-repeat;
}
.bg-left{
  background-position: center left!important;
  >.vc_column-inner{
    background-position: center left!important;
  }
}
.bg-right{
  background-position: center right!important;
  >.vc_column-inner{
    background-position: center right!important;
  }
}
.vc_wpb_row_inner.bg-bottom{
  background-position: bottom center!important;
  background-repeat: no-repeat!important;
}
//border
.no-border{
  border: none!important;
}
.radius-1x{
  @include border-radius(3px);
}
.radius-2x{
  @include border-radius(5px);
}
.radius-5x{
  @include border-radius(50%);
}
.border-1{
  border: 1px solid $border-color!important;
}
.border-2{
  border: 2px solid $border-color;
}
.border-3{
  border: 3px solid $border-color;
}
.border-4{
  border: 4px solid $border-color;
}
.border-5{
  border: 5px solid $border-color;
}

.over-hidden{
  overflow: hidden;
}

.pstatic{
  position: static!important;
}

.prelative{
  position: relative!important;
}

.text-white{
  color: $white!important;
  *{
    color: $white!important;
  }
}
.text-black{
  color: $black;
}
.text-theme{
  color: $theme-color!important;
}
.text-theme-2{
  color: $theme-color-2!important;
}
.text-green{
  color: #10b73b!important;
}

.text-medium{
  font-size: 18px;
  font-family: $font-family-second;
}

.letter-spacing-1{
  letter-spacing: -1px!important;
}
.letter-spacing-2{
  letter-spacing: -2px!important;
}

.btn-theme, button, .btn, .btn-white{
  font-size: 12px;
  text-transform: uppercase;
  background: $theme-color;
  color: #fff;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 6px 24px;
  line-height: 25px;
  position: relative;
  display: inline-block;
  @include transition(all 0.35s);
  border: 1px solid transparent;
  text-decoration: none;
  font-family: $font-family-second;
  @include border-radius(6px);
  &:hover, &:focus{
    color: $white;
    background: darken($theme-color, 10%);
  }
}

.btn-theme{
  padding-right: 36px;
  &:after{
    @include transition(all 0.35s);
    content: '\f178';
    font-family: "FontAwesome";
    position: absolute;
    top: 6px;
    right: 14px;
    color: $white;
    z-index: 1;
  }
}

.btn-inline{
  font-size: 12px;
  text-transform: uppercase;
  color: $theme-color;
  position: relative;
  @include transition(all 0.35s);
  font-weight: 600;
  padding-right: 18px;
  font-family: $font-family-second;
  &:after{
    content: '\f178';
    font-family: "FontAwesome";
    position: absolute;
    top: 3px;
    right: 0;
    color: $theme-color;
    z-index: 1;
    line-height: 1;
  }
  &:hover{
    color: $theme-color-2;
    &:after{
      color: $theme-color-2;
    }
  }
}

.btn-white{
  background: $white;
  color: $black;
  border-color: $white;
  &:hover, &:focus, &:active,{
    background: darken($white, 12%);
    color: $black;
  }
}

input[type*="submit"]:not(.fa){
  background: $theme-color;
  font-family: $font-family-second;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 600;
  color: $white;
  border: none;
  line-height: 36px;
  padding: 0 15px;
  @include transition(all 0.35s);
  &:hover{
    background: lighten($theme-color, 10%);
  }
}

.width-600{ max-width: 600px;margin: 0 auto!important; }
.width-700{ max-width: 700px;margin: 0 auto!important; }
.width-800{ max-width: 800px;margin: 0 auto!important; }
.width-900{ max-width: 900px;margin: 0 auto!important; }
.width-950{ max-width: 950px;margin: 0 auto!important; }
.width-1000{ max-width: 1000px;margin: 0 auto!important; }

.alert{
  position: relative;
  .alert_icon{
    display: inline-block;
    float: left;
    margin-right: 10px;
  }
  .close{
    position: absolute;
    top: 20px;
    right: 15px;
  }
  .alert_wrapper{
    padding: 0 30px;
  }
}
.pagination{
  width: 100%;
  margin: 0;
  .pager{
    margin: 0 0 30px;
  }
  .pager_wrapper{
    border: none;
  }
}

.max-width-600{
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.max-width-500{
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}

.list-socials{
  text-align: center;
  a{
    @include transition(all 0.35s);
    float: left;
    margin-right: 25px;
    &:last-child{
      margin-right: 0;
    }
    i{
      font-size: 17px;
      color: #9E9E9E;
    }
  }
  &.white{
    a{
      &:hover{
        i{
          color: $white;
        }
      }
    }
  }
}

.socials {
  display: inline-block;
  text-align: left;
  width: 100%;
  a {
    color: $text-color;
    text-decoration: none;
    @include transition(all 0.5s ease 0s);
    margin-right: 12px;
    font-size: 14px;
    &:last-child{
      margin-right: 0;
    }
    &:hover, &:focus, &:active{
      @include opacity(0.7);
    }
    i{
      color: $white;
      @include size(32px, 32px);
      @include border-radius(50%);
      display: inline-block;
      text-align: center;
      line-height: 32px;
      font-size: 14px;
      background: $theme-color;
      @include transition(all 0.35s);
      border: 1px solid rgba(0, 0, 0, 0.06);
    }
    i.fa-facebook-square, i.fa-facebook {
      background: #3b5998;
    }
    i.fa-twitter, i.fa-twitter-square {
      background: #4099ff;
    }
    i.fa-skype {
      background: #12a5f4;
    }
    i.fa-dribbble {
      background: #ea4c89;
    }
    i.fa-linkedin-square, i.fa-linkedin {
      background: #0e76a8;
    }
    i.fa-apple {
      background: #f2f2f2;
    }
    i.fa-pinterest {
      background: #c92228;
    }
    i.fa-google-plus-square, i.fa-google-plus {
      background: #d34836;
    }
    i.fa-youtube-square, i.fa-youtube {
      background: #c4302b;
    }
    i.fa-vimeo-square, i.fa-vimeo {
      background: #4ebbff;
    }
    i.fa-tumblr-square, i.fa-tumblr {
      background: #35465c;
    }
    i.fa-xing-square, i.fa-xing {
      background: #126567;
    }
    i.fa-instagram {
      background: #e8e2d9;
    }
  }
}

.socials-2{ 
  display: inline-block;
  text-align: left;
  width: 100%;
  a {
    color: #828282;
    text-decoration: none;
    @include transition(all 0.5s ease 0s);
    margin-right: 12px;
    font-size: 14px;
    &:last-child{
      margin-right: 0;
    }
    i{
      color: #828282;
      @include size(32px, 32px);
      @include border-radius(50%);
      display: inline-block;
      text-align: center;
      line-height: 32px;
      font-size: 14px;
      background: $white;
      @include transition(all 0.35s);
      border: 1px solid rgba(0, 0, 0, 0.06);
      &:hover{
        background: $theme-color;
        color: $white;
      }
    }
    i.fa-facebook-square, i.fa-facebook {
      &:hover{
        background: #3b5998;
      }
    }
    i.fa-twitter, i.fa-twitter-square {
      &:hover{
        background: #4099ff;
      }
    }
    i.fa-skype {
      &:hover{
        background: #12a5f4;
      }
    }
    i.fa-dribbble {
      &:hover{
        background: #ea4c89;
      }
    }
    i.fa-linkedin-square, i.fa-linkedin {
      &:hover{
        background: #0e76a8;
      }
    }
    i.fa-apple {
      &:hover{
        background: #f2f2f2;
      }
    }
    i.fa-pinterest {
      &:hover{
        background: #c92228;
      }
    }
    i.fa-google-plus-square, i.fa-google-plus {
      &:hover{
        background: #d34836;
      }
    }
    i.fa-youtube-square, i.fa-youtube {
      &:hover{
        background: #c4302b;
      }
    }
    i.fa-vimeo-square, i.fa-vimeo {
      &:hover{
        background: #4ebbff;
      }
    }
    i.fa-tumblr-square, i.fa-tumblr {
      &:hover{
        background: #35465c;
      }
    }
    i.fa-xing-square, i.fa-xing {
      &:hover{
        background: #126567;
      }
    }
    i.fa-instagram {
      &:hover{
        background: #e8e2d9;
      }
    }
  }
}

.fa-stack {
  width: 2.4em!important;
  height: 2.4em!important;
  line-height: 2.4em;
} 
.fa-1x{
  font-size: 1.5em!important;
}

.tabs-list{
  text-align: center;
  margin-bottom: 10px;
  ul.nav-tabs{
    display: inline-block;
    width: auto;
    float: none;
    > li{
      margin-bottom: 10px;
    }
  }
}

.pieChart{
  position: relative;
  .pie-label{
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -5px;
    text-align: center;
    z-index: 1;  
    font-weight: 600;
    display: block;
    width: 100%;
    line-height: 1;
  }
}