@import (reference) "../lib/bootstrap/less/bootstrap.less";
// Reset
//@import "../lib/bootstrap/less/normalize.less";
//@import "../lib/bootstrap/less/print.less";

//From "bootstrap_less/scaffolding.less";
// Clearfix
// --------

// For clearing floats like a boss h5bp.com/q
.vc_clearfix {
  *zoom: 1;
  &:before,
  &:after {
    display: table;
    content: "";
  }
  &:after {
    clear: both;
  }
}

.wpb_row {
  *,
  *:before,
  *:after {
    .box-sizing(border-box);
  }
}

// Variables 4.0
//When color is added it should be added to the VcSharedLibrary class too
@blue: #5472D2;
@turquoise: #00C1CF;
@pink: #FE6C61;
@violet: #8D6DC4;
@peacoc: #4CADC9;
@chino: #CEC2AB;
@mulled_wine: #50485B;
@vista_blue: #75D69C;
@black: #2A2A2A;
@grey: #EBEBEB;
@orange: #F7BE68;
@sky: #5AA1E3;
@green: #6DAB3C;
@juicy_pink: #F4524D;
@sandy_brown: #F79468;
@purple: #B97EBB; 
// End Variables 

// Mixins 4.0
//Button variants mixin
.vc_btn_variants(@selector, @color, @txt_color) {
  &@{selector} {
    //border-color: @color;
    background-color: @color;
    color: @txt_color !important; //TODO: WTF? why it is not rendering?
    .transition(all 0.5s);
    &:hover {
      background-color: darken(@color, 6%);
      color: darken(@txt_color, 3%) !important;
    }
    &.vc_btn_outlined,
    &.vc_btn_square_outlined {
      color: @color !important;
      &:hover {
        border-color: darken(@color, 6%);
      }
    }
    &.vc_btn_3d {
      .box-shadow(0 5px 0 darken(@color, 11%));
      margin-bottom: 5px;
      &.vc_btn_xs {
        //border-bottom-width: 3px;
        .box-shadow(0 3px 0 darken(@color, 11%));
        margin-bottom: 3px;
      }
      &.vc_btn_sm {
        //border-bottom-width: 4px;
        .box-shadow(0 4px 0 darken(@color, 11%));
        margin-bottom: 4px;
      }
    }
  }
}
// End Mixins
//Grid
.vc_container {
  .container-fixed();
  //
  @media (min-width: @screen-sm) {
    width: @container-sm;
  }
  @media (min-width: @screen-md) {
    width: @container-md;
  }
  @media (min-width: @screen-lg-min) {
    width: @container-lg;
  }
}
.wpb_row {
  .make-row();
  // remove margins in bootstrap 2
  .vc_span1, .vc_span2, .vc_span3, .vc_span4, .vc_span5, .vc_span6, .vc_span7, .vc_span8, .vc_span9, .vc_span10, .vc_span11, .vc_span12 {
    margin-left: 0;
  }
}

.vc_non_responsive {
  //If "Disable responsive content elements" is checked in VC Settings
  .wpb_row {
    .vc_span1 {  .make-xs-column(1); }
    .vc_span2 {  .make-xs-column(2); }
    .vc_span3 {  .make-xs-column(3); }
    .vc_span4 {  .make-xs-column(4); }
    .vc_span5 {  .make-xs-column(5); }
    .vc_span6 {  .make-xs-column(6); }
    .vc_span7 {  .make-xs-column(7); }
    .vc_span8 {  .make-xs-column(8); }
    .vc_span9 {  .make-xs-column(9); }
    .vc_span10 { .make-xs-column(10); }
    .vc_span11 { .make-xs-column(11); }
    .vc_span12 { .make-xs-column(12); }
  }
}

.vc_responsive {
  .wpb_row {
    .vc_span1 {  .make-sm-column(1); }
    .vc_span2 {  .make-sm-column(2); }
    .vc_span3 {  .make-sm-column(3); }
    .vc_span4 {  .make-sm-column(4); }
    .vc_span5 {  .make-sm-column(5); }
    .vc_span6 {  .make-sm-column(6); }
    .vc_span7 {  .make-sm-column(7); }
    .vc_span8 {  .make-sm-column(8); }
    .vc_span9 {  .make-sm-column(9); }
    .vc_span10 { .make-sm-column(10); }
    .vc_span11 { .make-sm-column(11); }
    .vc_span12 { .make-sm-column(12); }
  }
}

//Helper classes
.vc_txt_align_ {
  &left {
    text-align: left;
  }
  &right {
    text-align: right;
  }
  &center {
    text-align: center;
  }
  &justify {
    text-align: justify;
    text-justify: inter-word;
  }
}

&.vc_el_width_ {
  &50 {
    //width 50
    width: 50%;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  &60 {
    //width 60
    width: 60%;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  &70 {
    //width 70
    width: 70%;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  &80 {
    //width 80
    width: 80%;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  &90 {
    //width 90
    width: 90%;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  &100 {
    width: 100%;
  }
}

/* 1. Buttons
---------------------------------------------------------- */
.vc_btn {
  .btn;
  border: none;
  text-decoration: none !important;
  border-radius: 5px;
  //@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius
  .button-size(1em; 2em; 100%; 1em; 5px);
  //Size Variations
  &_xs {
    .button-size(0.5em; 0.8em; 80%; 1em; 5px);
  }
  &_sm {
    .button-size(0.8em; 1.2em; 85%; 1em; 5px);
  }
  &_lg {
    .button-size(1.1em; 2.5em; 115%; 1em; 5px);
  }
  //Button design variations
  &_rounded {
    //default style
  }
  &_square {
    border-radius: 0;
  }
  &_square_outlined {
    border-radius: 0;
    background: none !important;
    border: 2px solid;
  }
  &_round {
    border-radius: 25px;
  }
  &_outlined {
    background: none !important;
    border: 2px solid;
  }
  &_3d {
    //border-width: 1px 1px 5px 1px;
    //border-width: 1px 1px 1px 1px;
  }
  //Button colors variations
  .vc_btn_variants(_blue, @blue, #ffffff);
  .vc_btn_variants(_turquoise, @turquoise, #ffffff);
  .vc_btn_variants(_pink, @pink, #ffffff);
  .vc_btn_variants(_violet, @violet, #ffffff);
  .vc_btn_variants(_peacoc, @peacoc, #ffffff);
  .vc_btn_variants(_chino, @chino, #ffffff);
  .vc_btn_variants(_mulled_wine, @mulled_wine, #ffffff);
  .vc_btn_variants(_vista_blue, @vista_blue, #ffffff);
  .vc_btn_variants(_black, @black, #ffffff);
  .vc_btn_variants(_grey, @grey, #666666);
  .vc_btn_variants(_orange, @orange, #ffffff);
  .vc_btn_variants(_sky, @sky, #ffffff);
  .vc_btn_variants(_green, @green, #ffffff);
  .vc_btn_variants(_juicy_pink, @juicy_pink, #ffffff);
  .vc_btn_variants(_sandy_brown, @sandy_brown, #ffffff);
  .vc_btn_variants(_purple, @purple, #ffffff);
}

/* 2. Alerts (Message boxes)
---------------------------------------------------------- */
//@import "utils/_variables_common.less";
// Base alert styles
.wpb_alert {
  padding: 1em 35px 1em 25px;
  //margin-bottom: @baseLineHeight;
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
  background-color: @state-warning-bg;
  border: 1px solid @state-warning-border;
  border-radius: 5px;
  color: @state-warning-text;
  clear: both;
  .messagebox_text *:last-child {
    margin-bottom: 0;
  }
  &.vc_alert_rounded {
    //default style
  }
  &.vc_alert_square {
    border-radius: 0;
  }
  &.vc_alert_square_outlined {
    border-radius: 0;
    background: none !important;
    border-width: 2px;
  }
  &.vc_alert_round {
    border-radius: 50px;
  }
  &.vc_alert_outlined {
    background: none !important;
    border-width: 2px;
  }
  &.vc_alert_3d {
    //border-width: 1px 1px 5px 1px;
    border-width: 1px 1px 1px 1px;
  }
}

// Alternate styles
// ----------------
.vc_alert_variants(@bg, @border, @text) {
  border-color: @border;
  background-color: @bg;
  &.vc_alert_outlined,
  &.vc_alert_square_outlined {
    color: @text; //TODO: WTF? why it is not rendering?
  }
  &.vc_alert_3d {
    //border-bottom-color: darken(@bg, 10%);
    .box-shadow(0 5px 0 darken(@bg, 10%));
  }
}
.wpb_alert-success {
  background-color: @state-success-bg;
  border-color: @state-success-border;
  color: @state-success-text;
  .vc_alert_variants(@state-success-bg, @state-success-border, @state-success-text);
}
.wpb_alert-error,
.wpb_alert-danger {
  background-color: @state-danger-bg;
  border-color: @state-danger-border;
  color: @state-danger-text;
  .vc_alert_variants(@state-danger-bg, @state-danger-border, @state-danger-text);
}
.wpb_alert-info {
  background-color: @state-info-bg;
  border-color: @state-info-border;
  color: @state-info-text;
  .vc_alert_variants(@state-info-bg, @state-info-border, @state-info-text);
}

.wpb_alert .messagebox_text,
.wpb_alert-warning .messagebox_text {
  padding-left: 40px;
  background: url(../vc/alert.png) no-repeat left center;
}
.wpb_alert-info .messagebox_text {
  background: url(../vc/info.png) no-repeat left center;
}
.wpb_alert-success .messagebox_text {
  background: url(../vc/tick.png) no-repeat left center;
}
.wpb_alert-error .messagebox_text,
.wpb_alert-danger .messagebox_text {
  background: url(../vc/exclamation.png) no-repeat left center;
}

/* 3. Call to action
---------------------------------------------------------- */
.vc_call_to_action {
  background-color: @grey;
  border: 2px solid @grey;
  padding: 2em;
  border-radius: 5px;
  *:last-child {
    margin-bottom: 0;
  }
  &.vc_cta_ {
    &rounded {
      //default style
    }
    &square {
      border-radius: 0;
    }
    &square_outlined {
      border-radius: 0;
      background: none !important;
      //border-width: 2px;
    }
    &round {
      border-radius: 50px;
    }
    &outlined {
      background: none !important;
    }
  }
  hgroup {
    h2, h4 {
      margin: 0;
      clear: none;
    }
    + p {
      margin-top: 1em;
    }
  }
  &.vc_cta_btn_pos {
    &_right {
      .vc_cta_btn {
        float: right;
        margin-left: 2em;
      }
    }
    &_left {
      .vc_cta_btn {
        float: left;
        margin-right: 2em;
      }
    }
    &_bottom {
      //text-align: center;
    }
  }
  //Button colors variations
  // &.vc_cta_blue {
  //   .vc_cta_variants(@blue);
  // }
}
// .vc_cta_variants(@color) {
//   //border-color: rgba(red(@color), green(@color), blue(@color), 0.5);
//   //background-color: rgba(red(@color), green(@color), blue(@color), 0.05);
//   &.vc_cta_outlined,
//   &.vc_cta_square_outlined {
//     //color: @color;
//   }
// }

/* 4. Separators
---------------------------------------------------------- */
.vc_separator {
  display: table;
  h4 {
    line-height: 1em;
    font-size: 100%;
    display: table-cell;
    white-space: pre;
  }
  &.vc_separator_align_center {
    h4 {
      padding: 0 0.8em;
    }
  }
  &.vc_separator_align_left {
    margin-left: 0;
    h4 {
      padding: 0 0.8em 0 0;
    }
    .vc_sep_holder {
      width: 100%;
    }
    .vc_sep_holder.vc_sep_holder_l {
      display: none;
    }
  }
  &.vc_separator_align_right {
    margin-right: 0;
    h4 {
      padding: 0 0 0 0.8em;
      margin: 0 !important;
    }
    .vc_sep_holder {
      width: 100%;
    }
    .vc_sep_holder.vc_sep_holder_r {
      display: none;
    }
  }
  .vc_sep_holder {
    display: table-cell;
    height: 1px;
    position: relative;
    vertical-align: middle;
    width: 50%;
    .vc_sep_line {
      height: 1px;
      border-top: 1px solid @grey;
      display: block;
      position: relative;
      top: 1px;
      width: 100%;
    }
  }
  &.vc_sep_ {
    &double {
      height: 3px;
      .vc_sep_line {
        border-bottom: 1px solid @grey;
        border-top: 1px solid @grey;
        height: 3px;
      }
    }
    &dashed {
      .vc_sep_line {
        border-top-style: dashed;
      }
    }
    &dotted {
      .vc_sep_line {
        border-top-style: dotted;
      }
    }
  }
  //Color variations
  .vc_separator_variants(_blue, @blue);
  .vc_separator_variants(_turquoise, @turquoise);
  .vc_separator_variants(_pink, @pink);
  .vc_separator_variants(_violet, @violet);
  .vc_separator_variants(_peacoc, @peacoc);
  .vc_separator_variants(_chino, @chino);
  .vc_separator_variants(_mulled_wine, @mulled_wine);
  .vc_separator_variants(_vista_blue, @vista_blue);
  .vc_separator_variants(_black, @black);
  .vc_separator_variants(_grey, @grey);
  .vc_separator_variants(_orange, @orange);
  .vc_separator_variants(_sky, @sky);
  .vc_separator_variants(_green, @green);
  .vc_separator_variants(_juicy_pink, @juicy_pink);
  .vc_separator_variants(_sandy_brown, @sandy_brown);
  .vc_separator_variants(_purple, @purple);
}
.vc_separator_variants(@selector, @color) {
  &.vc_sep_color {
    &@{selector} {
      .vc_sep_line {
        border-color: @color;
      }
    }
  }
}

/* 5. Single image
---------------------------------------------------------- */
.wpb_single_image {
  img {
    height: auto;
    max-width: 100%;
  }
  &.vc_align_center {
    text-align: center;
  }
  &.vc_align_right {
    text-align: right;
  }
  &.vc_align_left {
    text-align: left;
  }
}
div .vc_box_ {
  &rounded {
    border-radius: 4px;
    .box-shadow(none);
  }
  &outline,
  &outline_circle {
    border-radius: 0px;
   .box-shadow(none); 
    padding: 6px;
    border: 1px solid @grey;
  }
  &border,
  &border_circle {
    border-radius: 0px;
   .box-shadow(none); 
    padding: 6px;
    border: none;
  }
  &shadow,
  &shadow_circle, {
    border-radius: 0px;
    .box-shadow(0 0px 5px rgba(0, 0, 0, 0.1));
    padding: 6px;
  }
  &shadow_3d {
    border-radius: 0px;
    .box-shadow(none);
    margin-bottom: 15px;
  }
  //
  &circle,
  &outline_circle,
  &border_circle,
  &shadow_circle {
    border-radius: 5000px;
    border-radius: 50%;
   .box-shadow(none);
   overflow: hidden;
  }
  &shadow_circle {
    .box-shadow(0 0px 5px rgba(0, 0, 0, 0.1));
  }
}
.vc_box_shadow_3d_wrap {
  position: relative;
  z-index: 0;
  display: inline-block;
  max-width: 100%;
  &:after,
  &:before {
    content: "";
    position: absolute;
    box-shadow: 0 15px 10px rgba(0, 0, 0, 0.5);
    left: 10px;
    bottom: 8%;//20px;
    width: 40%;
    height: 20%;
    max-height: 100px;
    max-width: 300px;
    z-index: -1;
    .rotate(-6deg);
  }
  &:after {
    left: auto;
    right: 10px;
    .rotate(6deg);
  }
}
.vc_box_border_variants(@selector, @color) {
  .vc_box_outline.vc_box_border@{selector},
  .vc_box_outline_circle.vc_box_border@{selector} {
    border-color: @color;
  }
  .vc_box_border.vc_box_border@{selector},
  .vc_box_border_circle.vc_box_border@{selector} {
    background-color: @color;
  }
}
.vc_box_border_variants(_blue, @blue);
.vc_box_border_variants(_turquoise, @turquoise);
.vc_box_border_variants(_pink, @pink);
.vc_box_border_variants(_violet, @violet);
.vc_box_border_variants(_peacoc, @peacoc);
.vc_box_border_variants(_chino, @chino);
.vc_box_border_variants(_mulled_wine, @mulled_wine);
.vc_box_border_variants(_vista_blue, @vista_blue);
.vc_box_border_variants(_black, @black);
.vc_box_border_variants(_grey, @grey);
.vc_box_border_variants(_orange, @orange);
.vc_box_border_variants(_sky, @sky);
.vc_box_border_variants(_green, @green);
.vc_box_border_variants(_juicy_pink, @juicy_pink);
.vc_box_border_variants(_sandy_brown, @sandy_brown);
.vc_box_border_variants(_purple, @purple);

/***************** OLD CSS *****************/
/* Content elements margins
---------------------------------------------------------- */
.wpb_alert p:last-child,
#content .wpb_alert p:last-child, /* for twenty ten theme */
.wpb_text_column p:last-child,
.wpb_text_column *:last-child,

#content .wpb_text_column p:last-child, /* for twenty ten theme */
#content .wpb_text_column *:last-child, /* for twenty ten theme */

.wpb_toggle_content p:last-child { 
  margin-bottom: 0;
}
.wpb_row,
.wpb_content_element,
ul.wpb_thumbnails-fluid > li,
.last_toggle_el_margin,
.wpb_button {
  margin-bottom: @vc_element_margin_bottom;
}

//.wpb_alert,
.fb_like,
.twitter-share-button, .entry-content .twitter-share-button,
.wpb_googleplus,
.wpb_pinterest,
.wpb_tab .wpb_content_element,
.wpb_accordion .wpb_content_element,
.wpb_toggle_content {
  margin-bottom: @vc_margin_bottom_gold;//@vc_element_margin_bottom/1.61; //1.61 - is golden ratio
}

.wpb_column {
  > .wpb_wrapper *:last-child,
  > .wpb_wrapper > .vc-element:last-child > .wpb_content_element,
  > .wpb_wrapper > .vc-element:last-child > .wpb_row {
    margin-bottom: 0; //remove margin bottom from last content elements in columns
  }
}

@import "utils/_vc_mixins.less";
//@import "_variables.less";
@import "utils/_variables_common.less";

@import "shortcodes/vc_social_btns.less";
@import "shortcodes/vc_toggle_faq.less";
@import "shortcodes/vc_widgetised_column.less";
@import "shortcodes/vc_button.less";
@import "shortcodes/vc_call_to_action.less";
@import "shortcodes/vc_google_maps.less";
@import "shortcodes/vc_tabs_tour_accordion.less";
@import "shortcodes/vc_teaser_grid.less";
@import "shortcodes/vc_image_gallery.less";
//@import "shortcodes/vc_alert.less";
@import "shortcodes/vc_flickr.less";
@import "shortcodes/vc_video_widget.less";
@import "shortcodes/vc_post_slider.less";
@import "shortcodes/vc_progress_bar.less";
@import "shortcodes/vc_pie.less";
@import "shortcodes/vc_carousel.less";
//@import "shortcodes/vc_responsive.less";

@import "css3_animations.less";