rails_pitfall 1.0.5 → 1.0.6

data/vendor/assets/stylesheets/style.less

@@ -0,0 +1,1974 @@
+/*!
+Description: A ruby-ready theme packed as a gem.
+Version: 0.0.2
+*/
+/* =Imports
+We import bootstrap.less in order to takeui.totop.png advantage of its classes and mixins.
+AFTER THAT we import the custom_variables.less which is Bootstrap variables.less 
+that we copied and altered in order to override the original variables and make our custom bootstrap skin.
+This way we leave Bootstrap unharmed.
+--------------------------------------------------------------*/
+@import "twitter/bootstrap/bootstrap";
+@import "twitter/bootstrap/responsive";
+
+@import "custom_variables";
+
+// Theme Mixins
+//-------------------------------------------------------------- 
+.theme-box-shadow(@shadow:  0px 0px 2px 0px rgba(0, 0, 0, 0.1)) {
+  -webkit-box-shadow: @shadow;
+  -moz-box-shadow: @shadow;
+  box-shadow: @shadow;
+}
+
+.theme-transition(@theme-transition: 500ms) {
+  .transition(all @theme-transition linear);
+}
+
+.black_alpha(@alpha_percentage: 0.6) {
+  background: rgb(0, 0, 0);
+  background: rgba(0, 0, 0, @alpha_percentage);
+}
+
+.blue_alpha (@alpha_percentage: 0.6) {
+  background: rgb(0, 133, 200);
+  background-color: rgba(0, 133, 200, @alpha_percentage);
+}
+
+/*!
+Theme Name: style1
+THEME STYLES
+================================================================= 
+*/
+
+/* =General
+-------------------------------------------------------------- */
+body {
+  -webkit-font-smoothing: antialiased;
+  background: asset-url("backgrounds/wild_oliva_light.png");
+}
+
+h1, h2, h3, h4, h5, h6 {font-weight: normal;}
+
+a:hover, a:active, a:focus {text-decoration: none;}
+
+a:focus {outline: none;}
+
+.border-box {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.img-left {
+  float: left;
+  margin: 0 10px 0px 0;
+}
+
+.show {
+  .opacity(100) !important;
+}
+
+.background_cover {
+  background: no-repeat center center;
+  -webkit-background-size: cover;
+  -moz-background-size: cover;
+  -o-background-size: cover;
+  background-size: cover;
+}
+
+.columns_2 {
+  .content-columns(2, 40px);
+  .hyphens;
+}
+
+.center-block {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.no-box-shadow {
+  .box-shadow(0 0px 0px rgba(0, 0, 0, 0.067));
+}
+
+/* =Header
+-------------------------------------------------------------- */
+header{
+  background: asset-url("backgrounds/wild_oliva_light_head.png");
+    position: relative;
+          span.logo_title {
+        font-size: 36px;
+        font-weight: 300;
+        display: block;
+        padding: 10px 0 0px 0;
+        line-height: 42px;
+        text-shadow: 1px 1px 0px #ffffff;
+      }
+      span.logo_subtitle {
+        font-size: 13px;
+        font-weight: 300;
+        display: block;
+        text-shadow: 1px 1px 0px #ffffff;
+      }
+      a.brand {
+      margin: 0px 0;
+      padding: 0px;
+      overflow: hidden;
+      width: 215px;
+      img {
+        float: left;
+        margin: 0 6px 0 0;
+        width: 90px;
+        height: 90px;
+      }
+  }
+
+.navbar {
+margin:0px 0px 15px 0px;
+font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif;
+  }
+
+  .navbar-inner > .container{
+  
+width:940px;
+}
+
+.navbar-inner{
+border-radius:0px;
+background-image: asset-url("menu.png") no-repeat;
+background: #363638 asset-url("menu.png")  0 0 repeat-x;
+}
+  .nav {
+    margin: 27px 0 0 0;
+    li a {
+      margin: 0 3px;
+      text-transform: uppercase;
+      background-color: none;
+    }
+    li a:hover, li a:active {
+      background-color: transparent;
+      .no-box-shadow;
+      border-bottom: solid 1px @linkColor;
+    }
+    li.active a, li.active a:hover {
+      background-color: transparent;
+      .no-box-shadow;
+      border-bottom: solid 1px @linkColor;
+    }
+  }
+}
+
+.lt-ie9 .navbar {
+  .nav {
+    li a {
+      margin: 0px;
+      padding: 10px;
+      font-size: 14px;
+    }
+    .dropdown-menu > li > a {
+      padding: 3px 20px;
+    }
+  }
+}
+
+.navbar .btn{
+font-size:13px;
+padding:4px 10px;
+color:#fff !important;
+text-shadow:none !important;
+}
+
+.navbar .btn:hover{
+  color: #fff !important;
+} 
+
+.in .nav {
+  li {
+    text-align: center;
+  }
+  li a {
+    margin: 0 0 6px 0px;
+    background: @black;
+  }
+  li a:hover, li a:active {
+    background: @black;
+    color: @white;
+    text-shadow: 0px 0px 0 transparent;
+    border-bottom: solid 0px @linkColor;
+  }
+  li.active a, li.active a:hover {
+    background: asset-url("backgrounds/wild_oliva_dark.png");
+    color: @white;
+    text-shadow: 0px 0px 0 transparent;
+    border-bottom: solid 0px @linkColor;
+  }
+}
+
+.nav-collapse a{
+font-weight:normal !important;
+text-shadow:none !important;
+}
+
+.dropdown-menu{
+border-radius:0px !important;
+box-shadow:none !important;
+border-bottom:none !important;
+padding:0px 0px;
+margin:0px;
+text-shadow:none !important;
+z-index: 2000;
+}
+
+.dropdown-menu a{
+padding:8px 10px !important;
+color:#fff !important;
+-webkit-transition:background 1s ease;
+-moz-transition:background 1s ease;
+-o-transition:background 1s ease;
+transition:background 1s ease;
+font-size:13px !important;
+text-shadow:none !important;
+}
+
+.dropdown-menu a:hover,.dropdown-menu a:focus{
+filter:none !important;
+-webkit-transition:background 1s ease;
+-moz-transition:background 1s ease;
+-o-transition:background 1s ease;
+transition:background 1s ease;
+}
+
+.dropdown-menu::after, .dropdown-menu::before{
+border:none !important;
+}
+
+
+#social_media_wrapper {
+  background: @blue;
+  .border-bottom-radius(@baseBorderRadius);
+  display: inline-block;
+  position: absolute;
+  top: 0px;
+  right: 0px;
+  overflow: hidden;
+  padding: 10px;
+  a {
+    text-align: center;
+    display: block;
+    float: left;
+    margin: 0 3px;
+    background: asset-url("backgrounds/wild_oliva_light.png");
+    .img-circle;
+    font-size: 18px;
+    width: 18px;
+    height: 18px;
+    padding: 6px;
+    .theme-transition(100ms);
+  }
+  a i {}
+  a:link, a:visited {}
+  a:hover, a:active {
+    text-decoration: none;
+    color: @white;
+    background: asset-url("backgrounds/wild_oliva_blue_light.png");
+  }
+}
+
+#sign {
+  position: absolute;
+  top: 7px;
+  right: 150px;
+  font-size: 12px;
+  i {
+    margin-right: 0px;
+    font-size: 18px;
+    width: 18px;
+    height: 18px;
+    padding: 8px;
+    display: inline-block;
+    text-align: center;
+    position: relative;
+    left: 0px;
+    top: 2px;
+  }
+}
+
+/* =Slider and Large Photo headers
+-------------------------------------------------------------- */
+
+.flexslider {
+  margin-bottom: 0px;
+  .container {
+    position: relative;
+    z-index: 9;
+    text-align: left;
+    height: 480px;
+    .carousel-caption {
+      .theme-transition;
+      position: absolute;
+      bottom: 0;
+      .opacity(10);
+      margin: 0 20% 0 0;
+      padding: 60px 0px;
+      background: none;
+      h1 {
+        display: inline-block;
+        margin: 0 0 0px 0;
+        padding: 16px;
+        .black_alpha(0.6);
+        line-height: 1.1em;
+        color: @bodyBackground;
+        text-shadow: 0 1px 1px rgba(0,0,0,.4);
+        font-size: 50px;
+        font-weight: 300;
+        border-bottom: solid 1px @blue;
+      }
+      h1.inverse {
+        .blue_alpha;
+      }
+      .lead {
+        display: inline-block;
+        margin: 0;
+        padding: 16px;
+        .black_alpha(0.8);
+        line-height: 1.25;
+        color: #fff;
+        text-shadow: 0 1px 1px rgba(0,0,0,.4);
+        font-size: 18px;
+        font-weight: 300;
+        border-bottom: solid 1px @blue;
+      }
+      .lead.inverse {
+        .blue_alpha(0.8);
+        a:link, a:visited {
+          color: yellow;
+        }
+      }
+      .btn {
+        margin-top: 15px;
+      }
+      .round_badge {
+        display: block;
+        width: 70px;
+        height: 70px;
+        padding: 20px;
+        text-align: center;
+        position: absolute;
+        top: 0px;
+        right: 140px;
+        background-color: #ff0000;
+        .border-radius(60px);
+        color: #ffffff;
+        font-weight: 300;
+        font-size: 16px;
+        line-height: 20px;
+        strong {
+          font-weight: 700;
+          font-size: 22px;
+          margin-top: 4px;
+          display: block;
+        }
+      }
+    }
+  }
+  a.carousel-control {
+    height: 80px;
+    margin-top: 0;
+    font-size: 120px;
+    text-shadow: 0 1px 1px rgba(0,0,0,.4);
+    background-color: transparent;
+    border: 0;
+  }
+  .item {
+    height: 480px;
+    width: 100%;
+    .background_cover;
+  }
+}
+
+.full_page_photo {
+  height: 400px;
+  width: 100%;
+  .background_cover;
+  section.call_to_action {
+    margin: 0;
+    max-width: 960px;
+    padding: 0px 0px;
+    text-align: left;
+    color: @white;
+    position: absolute;
+    bottom: 10px;
+    img {display: block;}
+    h3 {
+      font-weight: 300;
+      font-size: 50px;
+      line-height: 55px;
+      padding: 10px;
+      .black_alpha(0.6);
+      display: inline-block;
+      clear: both;
+    }
+    h4 {
+      font-weight: 300;
+      font-size: 26px;
+      line-height: 30px;
+      margin: 0 0 20px 0;
+      padding: 10px;
+      .black_alpha(0.6);
+      display: inline-block;
+      clear: both;
+    }
+  }
+}
+
+/* =Collapsing Header Effect
+(To use, assign "collapsing_header" class to the body tag)
+-------------------------------------------------------------- */
+
+.collapsing_header {
+  header {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 162px;
+    z-index:10;
+    &.absolute {
+      position: absolute !important;
+      top: 400px !important;
+      left: 0px;
+    }
+  }
+  .full_page_photo {
+    position: fixed;
+    top: 162px;
+  }
+  #main {
+    position: relative;
+    top: 562px;
+  }
+}
+
+/* =Main, Homepage
+-------------------------------------------------------------- */
+#main {
+  background: asset-url("backgrounds/wild_oliva_light.png");
+}
+
+section.call_to_action {
+  text-align: center;
+  padding: 35px 0 45px 0;
+  h3 {
+    font-weight: 300;
+    font-size: 50px;
+    line-height: 55px
+  }
+  h4 {
+    font-weight: 300;
+    font-size: 26px;
+    line-height: 30px;
+    margin: 0 0 20px 0;
+  }
+}
+
+section#features_teasers_wrapper {
+  margin: 35px 0 45px 0;
+  .feature_teaser {
+    text-align: center;
+    img {
+    }
+    h3 {
+      font-size: 16px;
+      font-weight: 600;
+    }
+    p {}
+  }
+}
+
+h2.section_header {
+  font-size: 18px;
+  line-height: 22px;
+  font-weight: 400;
+  border-bottom: dotted 1px #cccccc;
+  margin: 0 0 26px;
+  padding: 0 0 16px 0;
+}
+
+section#portfolio_teasers_wrapper {
+  margin: 35px 0 45px 0;
+  .porfolio_teaser {
+    text-align: center;
+    .theme-transition;
+    padding: 0 0 10px 0;
+    border-bottom: solid 2px @bodyBackground;
+    &:hover {
+      border-bottom: solid 2px @linkColor;
+    }
+    img {}
+    h3 {
+      font-size: 16px;
+      font-weight: 600;
+      line-height: 18px;
+      margin: 10px 0 0px 0;
+      a:link, a:visited {
+        color: @textColor;
+      }
+      a:hover, a:active {
+        color: darken(@textColor, 20%);
+        text-decoration: none;
+      }
+    }
+    p {
+      font-size: 13px;
+      font-weight: 400;
+      a:link, a:visited {
+        color: @grayLight;
+      }
+      a:hover, a:active {
+        color: darken(@grayLight, 20%);
+        text-decoration: none;
+      }
+    }
+  }
+}
+
+/* =General Page elements
+-------------------------------------------------------------- */
+
+figure {
+  margin: 14px 0 28px 0;
+}
+
+.hgroup {
+  border-bottom: 1px solid #cccccc;
+  margin: 26px 0px;
+  padding: 17px 0;
+  h1 {
+    font-size: 30px;
+    font-weight: 300;
+    line-height: 1em;
+    margin: 0 0 0.3em 0;
+    padding: 0;
+  }
+  h2 {
+    font-size: 14px;
+    font-weight: 300;
+    line-height: 1.5em;
+    margin: 0 20% 0 0;
+    padding: 0;
+    color: @gray;
+  }
+  .breadcrumb {
+    font-size: 12px;
+    background-color: @bodyBackground;
+    margin: 0 0 0px;
+    padding: 6px 15px;
+    border: solid 1px #cccccc;
+  }
+}
+
+/* =Our Team
+------------ */
+
+.team_member {
+  text-align: center;
+  background-color: @black;
+  background-color: @grayDarker;
+  background: asset-url("backgrounds/wild_oliva_dark.png");
+  color: #cccccc;
+  padding: 40px;
+  .theme-transition;
+  .border-box;
+  .img-rounded;
+  &:hover {}
+  figure {
+    margin: 0;
+    padding: 0;
+    .img-circle;
+    background-size: cover;
+    img {
+      .theme-transition(250ms);
+      .border-radius(100px);
+      &:hover {
+        .opacity(0);
+        .scale(1.2);
+      }
+    }
+  }
+  h5 {
+    margin: 24px 0px 6px 0;
+    font-size: 20px;
+    font-weight: 600;
+  }
+  small {
+    font-size: 13px;
+    font-weight: 300;
+  }
+  hr {
+    margin: 14px 0;
+    border: #cccccc;
+  }
+  p.short_bio {
+    font-weight: 300;
+  }
+  .team_social {
+    margin: 0 0px 12px 0;
+    a {
+      margin: 0 6px 12px 0;
+      font-size: 18px;
+      background-color: @linkColor;
+      padding: 6px;
+      width: 22px;
+      height: 22px;
+      line-height: 22px;
+      display: inline-block;
+      .img-circle;
+    }
+    a:link, a:visited {color:#ffffff;}
+    a:hover, a:active {
+      color: @linkColor;
+      text-decoration: none;
+      background-color: #ffffff;
+    }
+  }
+}
+
+/* =Service Page elements
+-------------------------------------------------------------- */
+
+.service_teaser {
+  .border-box;
+  overflow: hidden;
+  margin: 0 0 60px 0px;
+  padding: 0 0px 0 0;
+  .teaser_photo {
+    padding: 30px;
+    .border-box;
+    img {
+      .img-circle;
+    }
+  }
+}
+
+.service {
+  margin-bottom: 40px;
+  figure {
+    text-align: center;
+    margin: 0;
+    padding: 0;
+    i {
+      font-size: 90px;
+      color: @blue;
+      &.blue {color: @blue;}
+    }
+  }
+  .desc {
+    h4 {font-weight: 600;}
+    p {}
+  }
+}
+
+/* =Pricing Tables
+------------------ */
+
+.pricing_wrapper {
+  padding: 40px 0;
+  .pricing_plan {
+    &.special {
+      border: solid 20px @blue;
+      position: relative;
+      left: 0px;
+      top: -20px;
+    }
+    .theme-box-shadow;
+    .border-box;
+    .border-radius(6px);
+    text-align: center;
+    border: solid 1px #e7e7e7;
+    h3 {
+      background-color: @grayLighter;
+      padding: 30px 5px;
+      margin: 0 0 10px 0;
+      color: @blue;
+      font-size: 30px;
+      .border-top-radius(6px);
+      border-bottom: solid 1px #cccccc;
+      small {
+        display: block;
+      }
+    }
+    .the_price {
+      padding: 15px;
+      font-size: 50px;
+      margin: 30px auto;
+      width: 60%;
+      color: @green;
+      text-shadow: 1px 1px 0px #ffffff;
+      border-bottom: dotted 1px #cccccc;
+      span {
+        font-size: 30px;
+      }
+      small {
+        font-size: 14px;
+      }
+    }
+    .the_offerings {
+      padding: 0 30px;
+      color: @gray;
+      p {}
+    }
+    a.btn {
+      margin: 30px;
+      .img-circle;
+    }
+  }
+}
+
+/* =Portfolio Page elements
+-------------------------------------------------------------- */
+
+ul#portfolio_filters {
+  margin: 0 0 24px 0;
+  padding: 0;
+  list-style: none;
+  overflow: hidden;
+  li {
+    float: left;
+    a {
+      display: block;
+      padding: 6px 6px 6px 0;
+      margin: 0 3px;
+      text-transform: uppercase;
+    }
+    a:hover, a:active {
+      border-bottom: solid 0px @linkColor;
+      text-decoration: none;
+    }
+    .active a, .active a:hover {
+      border-bottom: solid 1px @linkColor;
+    }
+  }
+}
+
+.portfolio_strict {
+  .portfolio_item {
+    text-align: center;
+    background-color: #ffffff;
+    padding: 8px;
+    border: solid 1px #e7e7e7;
+    height: 290px;
+    overflow: hidden;
+    margin-bottom: 24px;
+    .border-box;
+    .theme-box-shadow;
+    .theme-transition(500ms);
+    .border-radius(3px);
+    &:hover {
+      background: asset-url("backgrounds/wild_oliva_blue_light.png");
+      a {
+        color:@white;
+        text-decoration: none;
+        .opacity(100) !important;
+      }
+    }
+    .portfolio_photo {
+      height: 220px;
+      .background_cover;
+      .border-radius(3px);
+      a {
+        display: block;
+        width: 100%;
+        height: 100%;
+        color: #ffffff;
+        text-decoration: none;
+        .black_alpha(0.6);
+        .opacity(0);
+        .theme-transition(500ms);
+        position: relative;
+        .border-radius(3px);
+        i {
+          background: asset-url("backgrounds/wild_oliva_blue_light.png");
+          .img-circle;
+          padding: 10px;
+          margin: 20% 0;
+          line-height: 30px;
+          height: 30px;
+          border: solid 5px;
+        }
+        p {
+          padding: 10px;
+          position: absolute;
+          bottom: 0;
+          left: 0;
+        }
+      }
+    }
+    .portfolio_description {
+      padding: 10px;
+      margin-bottom: 20px;
+      h3 {
+        margin: 0;
+        padding: 0;
+        font-size: 15px;
+        line-height: 18px;
+        font-weight: 700;
+      }
+      p {
+        margin: 0;
+        padding: 0;
+        font-size: 13px;
+        color: #888888;
+      }
+    }
+  }
+}
+
+.portfolio_masonry {
+  .portfolio_item {
+    text-align: center;
+    .theme-box-shadow;
+    .border-radius(6px);
+    margin-bottom: 24px;
+    a {
+      display: block;
+      width: 100%;
+      height: 100%;
+      position: relative;
+      img {
+        .border-radius(6px);
+      }
+      .overlay {
+        .opacity(0);
+        .border-box;
+        padding: 10px;
+        .border-radius(6px);
+        width: 100%;
+        height: 100%;
+        .black_alpha(0.6);
+        .theme-transition(500ms);
+        position: absolute;
+        top: 0px;
+        left: 0px;
+        .desc {
+          position: absolute;
+          top: 0;
+          bottom: 0;
+          left: 0;
+          right: 0;
+          width: 90%;
+          height: 35%;
+          margin: auto;
+        }
+        h3 {
+          font-size: 20px;
+          line-height: 22px;
+        }
+        i {
+          background: asset-url("backgrounds/wild_oliva_blue_light.png");
+          .img-circle;
+          padding: 10px;
+          line-height: 33px;
+          height: 30px;
+          width: 30px;
+          border: solid 5px;
+        }
+      }
+      &:hover {
+        .overlay {
+          color:@white;
+          text-decoration: none;
+          .opacity(100) !important;
+        }
+      }
+    }
+  }
+}
+
+#portfolio_slider_wrapper {
+  padding: 10px 0;
+  #portfolio_slider {
+    .container {
+      a {
+        display: block;
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+  #carousel {
+    padding: 10px 0;
+    margin: 0 0 10px 0;
+    ul.slides {
+      li {
+        height: 140px;
+        overflow: hidden;
+        margin-right: 10px;
+      }
+    }
+  }
+}
+
+article.portfolio_details {
+  h3 {
+    line-height: 1.2em;
+  }
+  p {}
+  a.btn {}
+}
+
+/* =Blog Page elements
+-------------------------------------------------------------- */
+
+article.post {
+  padding: 0 0 40px 0;
+  margin: 0 0 40px 0;
+  border-bottom: dotted 2px #cccccc;
+  .post_header {
+    h3.post_title {
+      line-height: 1.2em;
+    }
+    .post_sub {}
+  }
+  .post_content {
+    figure {
+      max-height: 400px;
+      overflow: hidden;
+    }
+    p {}
+    .btn {margin-top: 10px;}
+  }
+}
+
+#post_comments {
+  padding: 0 0 30px 0;
+  margin: 0 0 40px 0;
+  border-bottom: dotted 2px #cccccc;
+  h4 {}
+  .comment {
+    padding: 10px 0;
+    figure {}
+    .comment_name {
+      font-weight: 600;
+      padding-top: 10px;
+      a.reply {
+        font-size: 12px;
+        padding: 0 6px;
+      }
+    }
+    .comment_date {
+      font-size: 12px;
+    }
+    .the_comment {}
+  }
+}
+
+/* =Sidebar
+----------- */
+
+#sidebar {
+  .border-box;
+  padding: 0px 0 0 30px;
+  aside.widget {
+    margin: 0 0 40px 0px;
+    h4 {
+      padding: 7px 0;
+    }
+  }
+}
+
+.ads {
+  a {
+    display: block;
+    float: left;
+    margin: 0 10px 10px 0;
+  }
+}
+
+#tags {
+  a {
+    display: block;
+    padding: 10px;
+    margin: 0 10px 10px 0;
+    float: left;
+    font-weight: 300;
+  }
+}
+
+#sidebar li.media {
+  .media-photo {
+    .square(60px);
+  }
+  h5.media-heading {
+    font-weight: 600;
+    line-height: 1.2em;
+    font-weight: 300;
+  }
+  p {
+    font-weight: 300;
+    font-size: 13px;
+    line-height: 1.2em;
+  }
+  a.media-date {
+    .square(40px);
+    .img-circle;
+    .pull-left;
+    .blue_alpha(0.8);
+    text-align: center;
+    font-size: 20px;
+    font-weight: 600;
+    padding: 15px;
+    margin: 0 10px 0 0;
+    color: @white;
+    &:hover {.black_alpha(0.1);}
+    span {
+      font-size: 13px;
+      font-weight: 400;
+    }
+  }
+}
+
+/* =Register or Sign in Page
+-------------------------------------------------------------- */
+
+.signin {
+  text-align: center;
+  background-color: #ffffff;
+  padding: 40px;
+  border: solid 1px #e7e7e7;
+  margin-bottom: 24px;
+  .border-box;
+  .theme-box-shadow;
+  .border-radius(3px);
+  form {
+    .forgot {
+      padding: 0 0 20px 0;
+      font-weight: 300;
+      label.checkbox {
+        font-weight: 300;
+        input[type="checkbox"] {
+          float: none;
+          position: relative;
+          left: 0;
+          top: -3px;
+        }
+      }
+    }
+  }
+}
+
+.social_sign {
+  h3 {
+    font-weight: 300;
+    font-size: 20px;
+    margin-bottom: 30px;
+    line-height: 22px;
+  }
+  a {
+    background-color: @blue;
+    color: #ffffff;
+    text-align: center;
+    display: inline-block;
+    margin: 0 8px;
+    .img-circle;
+    font-size: 30px;
+    width: 30px;
+    height: 30px;
+    padding: 18px;
+    .theme-transition(100ms);
+    &.fb {
+      background-color: #3B5998;
+    }
+    &.tw {
+      background-color: #00ACEE;
+    }
+    &.gp {
+      background-color: #E44B39;
+    }
+    &:link, &:visited {
+      color: #ffffff;
+    }
+    &:hover, &:active {
+      -moz-transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
+      -webkit-transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
+      -o-transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
+      -ms-transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
+      transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
+    }
+  }
+}
+
+.or {
+  overflow: hidden;
+  text-align: center;
+  padding: 30px 0 0 0;
+  .or_l, .or_r {
+    width: 40%;
+    border-bottom: solid 1px #cccccc;
+    display: inline-block;
+    position: relative;
+    left: 0px;
+    top: -4px;
+  }
+  span {
+    width: 8%;
+    display: inline-block;
+  }
+}
+
+p.sign_title {
+  font-weight: 300;
+  padding: 30px 0 20px 0;
+}
+
+.signup {
+  text-align: center;
+  background-color: #ffffff;
+  padding: 40px;
+  border: solid 1px #e7e7e7;
+  margin-bottom: 24px;
+  .border-box;
+  .theme-box-shadow;
+  .border-radius(3px);
+  form {
+    label.checkbox {
+      font-weight: 300;
+      input[type="checkbox"] {
+        float: none;
+        position: relative;
+        left: 0;
+        top: -3px;
+      }
+    }
+    .btn {
+      margin-top: 50px;
+    }
+  }
+}
+
+/* =Footer
+-------------------------------------------------------------- */
+
+footer {
+  margin-top: 40px;
+  color: @white;
+  border-top: solid 2px @white;
+  background-color: @grayDarker;
+  background: asset-url("backgrounds/wild_oliva_dark.png");
+  a {
+    &:link, &:visited {}
+    &:hover, &:active {color:@linkColorHover;text-decoration: none;}
+  }
+}
+
+#twitter_feed_wrapper {
+  padding: 14px;
+  background-color: hsla(hue(@black), saturation(@black), lightness(@black), 0.1);
+  border-bottom: solid 1px @black;
+  border-top: solid 1px @black;
+  margin-top: 48px;
+  .twitter_feed_icon a {
+    padding: 7px 0;
+    font-size: 70px;
+    display: block;
+    text-align: center;
+  }
+  blockquote {
+    margin: 11px 0;
+    min-height: 60px;
+    p {
+      font-size: 16px;
+      margin-bottom: 3px;
+
+    }
+    a {
+    }
+  }
+}
+
+#footer_teasers_wrapper {
+  padding: 55px 0;
+  .footer_teaser {
+    h3 {
+      font-size: 18px;
+      font-weight: 700;
+      line-height: 18px;
+      padding: 0 0 16px 0;
+      margin: 10px 0 20px 0;
+      border-bottom: solid 1px @gray;
+    }
+    p {
+      font-size: 13px;
+    }
+  }
+}
+
+li.media {
+  position: relative;
+  .media-photo {
+    position: absolute;
+    left: 0;
+    top: 0;
+    .square(70px);
+    margin: 5px;
+    .img-circle;
+    overflow: hidden;
+    .background_cover;
+  }
+  h5.media-heading {
+    font-weight: 600;
+    padding: 0px;
+    margin: 0;
+  }
+  a.media-date {
+    .square(40px);
+    .pull-left;
+    .black_alpha(0.85);
+    .img-circle;
+    text-align: center;
+    font-size: 20px;
+    font-weight: 600;
+    padding: 20px;
+    margin: 0 10px 0 0;
+    position: relative;
+    z-index: 2;
+    color: @white;
+    .theme-transition(300ms);
+    &:hover {.blue_alpha(0.4);}
+    span {
+      clear: both;
+      display: block;
+      font-size: 13px;
+      font-weight: 400;
+    }
+  }
+}
+
+#latest-flickr-images {
+  ul {
+    margin: 0;
+    overflow: hidden;
+    li {
+      list-style: none;
+      display: block;
+      float: left;
+      margin: 3px;
+      a {
+        display: block;
+        width: 60px;
+        height: 60px;
+        border: solid 1px #33333;
+        overflow: hidden;
+        .img-rounded;
+        img {
+          min-width: 60px;
+          min-height: 60px;
+        }
+      }
+    }
+  }
+}
+
+#block-toolbar {
+  border-top: solid 1px @black;
+  padding: 5px 0;
+  background-color: @blue;
+  font-weight: 300;
+  color: @grayLight;
+}
+
+#copyright {
+  border-top: solid 1px @black;
+  padding: 15px 0;
+  background-color: hsla(hue(@black), saturation(@black), lightness(@black), 0.5);
+  font-weight: 300;
+  color: @grayLight;
+}
+
+/* =Boxed Layout
+-------------------------------------------------------------- */
+
+.boxed {
+  #slider_wrapper {
+    margin-top: 30px;
+    margin-bottom: 20px;
+    .flexslider .item {
+      .border-radius(6px);
+      img {.border-radius(6px);}
+    }
+  }
+  section#features_teasers_wrapper .feature_teaser {
+    margin-top: 30px;
+    h3 {
+      margin: 0;
+      padding: 0;
+      margin-top: 10px;
+      font-weight: 300;
+      font-size: 18px;
+      line-height: 1.2em;
+    }
+    p {
+      padding: 10px 0;
+      font-weight: 300;
+    }
+  }
+}
+
+
+/* =Buttons Overrides
+-------------------------------------------------------------- */
+.btn-primary {
+  .buttonBackground(@btnPrimaryBackground, @btnPrimaryBackground);
+  &:hover {
+    .buttonBackground(@btnPrimaryBackground, @btnPrimaryBackgroundHighlight);
+  }
+}
+.btn-warning {
+  .buttonBackground(@btnWarningBackground, @btnWarningBackground);
+  &:hover {
+    .buttonBackground(@btnWarningBackground, @btnWarningBackgroundHighlight);
+  }
+}
+.btn-danger {
+  .buttonBackground(@btnDangerBackground, @btnDangerBackground);
+  &:hover {
+    .buttonBackground(@btnDangerBackground, @btnDangerBackgroundHighlight);
+  }
+}
+.btn-success {
+  .buttonBackground(@btnSuccessBackground, @btnSuccessBackground);
+  &:hover {
+    .buttonBackground(@btnSuccessBackground, @btnSuccessBackgroundHighlight);
+  }
+}
+.btn-info {
+  .buttonBackground(@btnInfoBackground, @btnInfoBackground);
+  &:hover {
+    .buttonBackground(@btnInfoBackground, @btnInfoBackgroundHighlight);
+  }
+}
+.btn-inverse {
+  .buttonBackground(@btnInverseBackground, @btnInverseBackground);
+  &:hover {
+    .buttonBackground(@btnInverseBackground, @btnInverseBackgroundHighlight);
+  }
+}
+
+// Blockquotes
+blockquote {
+  border-left: 5px solid @grayLight;
+  p {
+    font-size: @baseFontSize * 1.25;
+    font-weight: 300;
+    line-height: 1.43;
+  }
+}
+
+
+/* =UItoTop jQuery Plugin 1.2
+-------------------------------------------------------------- */
+#toTop {
+  display:none;
+  text-decoration:none;
+  position:fixed;
+  bottom:35px;
+  right:10px;
+  overflow:hidden;
+  width:51px;
+  height:51px;
+  border:none;
+  text-indent:100%;
+  background:asset-url("ui.totop.png") no-repeat left top;
+  .opacity(50);
+  z-index: 2;
+}
+
+#toTopHover {
+  background:asset-url("ui.totop.png") no-repeat left -51px;
+  width:51px;
+  height:51px;
+  display:block;
+  overflow:hidden;
+  float:left;
+  .opacity(0);
+}
+
+#toTop:active, #toTop:focus {
+  outline:none;
+}
+
+
+/* =Responsive: Large desktop and up
+-------------------------------------------------------------- */
+@media (min-width: 1200px) {
+  //------------------------------------------------------------
+
+
+  //------------------------------------------------------------
+}
+/* =Responsive: Desktop
+-------------------------------------------------------------- */
+@media (min-width: 980px) and (max-width: 1199px) {
+  //------------------------------------------------------------
+
+  .navbar {
+    .nav {
+      li a {
+        margin: 0px;
+        padding: 10px;
+        font-size: 14px;
+      }
+      .dropdown-menu > li > a {
+        padding: 3px 20px;
+      }
+    }
+  }
+
+  .flexslider {
+    .container {
+      height: 400px;
+      .carousel-caption {
+        padding: 30px 0px;
+        h1 {
+          font-size: 40px;
+        }
+        .lead {
+          font-size: 16px;
+        }
+        .round_badge {
+          top: -40px;
+          right: 100px;
+        }
+      }
+    }
+    .item {
+      height: 400px;
+    }
+  }
+
+
+
+  //------------------------------------------------------------
+}
+/* =Responsive: Tablet to desktop
+-------------------------------------------------------------- */
+@media (min-width: 768px) and (max-width: 979px) {
+  //------------------------------------------------------------
+
+  .flexslider {
+    .container {
+      height: 350px;
+      .carousel-caption {
+        padding: 20px 0px;
+        h1 {
+          font-size: 30px;
+        }
+        .lead {
+          font-size: 16px;
+        }
+        .round_badge {
+          top: -60px;
+          right: 70px;
+        }
+      }
+    }
+    .item {
+      height: 350px;
+    }
+  }
+
+  .full_page_photo {
+    height: 350px;
+    section.call_to_action {
+      max-width: 80%;
+      h3 {
+        font-weight: 300;
+        font-size: 40px;
+        line-height: 45px;
+      }
+      h4 {
+        font-weight: 300;
+        font-size: 20px;
+        line-height: 26px;
+      }
+    }
+  }
+
+  section.call_to_action {
+    padding: 35px 0;
+    h3 {
+      font-size: 40px;
+      line-height: 45px;
+      margin-bottom: 10px;
+    }
+    h4 {
+      font-size: 20px;
+      line-height: 26px;
+      margin: 0 0 20px 0;
+    }
+  }
+
+  section#features_teasers_wrapper {
+    margin: 25px 0 45px 0;
+    .feature_teaser {
+      h3 {
+        font-size: 15px;
+      }
+      p {
+        font-size: 13px;
+        line-height: 1.4em;
+      }
+    }
+  }
+
+  .portfolio_strict {
+    .portfolio_item {
+      .portfolio_photo {
+        a {
+          p {
+            font-size: 12px;
+            line-height: 1.3em;
+          }
+        }
+      }
+      .portfolio_description {
+        h3 {
+          margin: 0;
+          padding: 0;
+          font-size: 14px;
+          line-height: 16px;
+        }
+        p {
+          font-size: 12px;
+        }
+      }
+    }
+  }
+
+  .service figure i {
+    font-size: 70px;
+  }
+
+  //------------------------------------------------------------
+}
+/* =Responsive: Landscape Phone to Tablet
+-------------------------------------------------------------- */
+@media only screen and (max-width: 767px) {
+  //------------------------------------------------------------
+
+  body {
+    margin: 0;
+    padding: 0;
+  }
+
+  .container {
+    padding-left: 20px;
+    padding-right: 20px;
+  }
+
+  .navbar {}
+
+  .flexslider {
+    .container {
+      height: 350px;
+      .carousel-caption {
+        padding: 20px 0px;
+        h1 {
+          font-size: 30px;
+        }
+        .lead {
+          font-size: 16px;
+        }
+        .round_badge {display: none;}
+      }
+    }
+    .item {
+      height: 350px;
+    }
+  }
+
+  section.call_to_action {
+    padding: 35px 0;
+    h3 {
+      font-size: 40px;
+      line-height: 45px;
+      margin-bottom: 10px;
+    }
+    h4 {
+      font-size: 20px;
+      line-height: 26px;
+      margin: 0 0 20px 0;
+    }
+  }
+
+  .full_page_photo {
+    height: 300px;
+    section.call_to_action {
+      max-width: 90%;
+      h3 {
+        font-weight: 300;
+        font-size: 30px;
+        line-height: 35px;
+      }
+      h4 {
+        font-weight: 300;
+        font-size: 16px;
+        line-height: 20px;
+      }
+    }
+  }
+
+  section#features_teasers_wrapper {
+    .feature_teaser {
+      margin-bottom: 40px;
+    }
+  }
+
+  .team_member {
+    margin-bottom: 30px;
+    figure {
+      margin: 0 auto;
+      .square(250px);
+      img {
+        .square(250px);
+        .border-radius(150px);
+      }
+    }
+  }
+
+  article p {
+    font-size: 16px;
+    line-height: 1.5em;
+  }
+
+  .columns_2 {
+    .content-columns(1, 0px);
+    .hyphens;
+  }
+
+  #footer_teasers_wrapper {
+    .footer_teaser {
+      margin: 0 0 40px 0;
+    }
+  }
+
+  .collapsing_header {
+    header {
+      position: static;
+      height: auto;
+    }
+    .full_page_photo {
+      position: relative;
+      top: 0;
+    }
+    #main {
+      position: relative;
+      top: 0;
+    }
+  }
+
+  .collapsing_header header.absolute {
+    position: relative !important;
+    top: 0px !important;
+    left: 0px;
+  }
+
+  #sidebar {
+    padding: 0px 0 0 0px;
+  }
+
+  .pricing_wrapper {
+    padding: 0px 0 20px 0;
+    .pricing_plan {
+      margin: 20px 0;
+      &.special {
+        top: 0px;
+      }
+      h3 {
+        padding: 30px 0;
+        margin: 0 0 10px 0;
+      }
+    }
+  }
+
+  //------------------------------------------------------------
+}
+/* =Responsive: Portrait Phone
+-------------------------------------------------------------- */
+@media only screen and (max-width: 479px) {
+  //------------------------------------------------------------
+
+  .navbar {
+    margin-bottom: 0;
+    .navbar-inner {
+        
+    }
+  }
+
+  .navbar .btn-navbar {
+    margin-top: 0px;
+    position: relative;
+    top: 10px;
+    clear: both;
+  }
+
+  .hgroup {
+    h2 {
+      margin: 0 0 6px 0;
+    }
+  }
+
+  .flexslider {
+    .container {
+      height: 350px;
+      .carousel-caption {
+        padding: 20px 0px;
+        margin: 0;
+        h1 {
+          font-size: 30px;
+        }
+        .lead {
+          font-size: 16px;
+        }
+      }
+    }
+    .item {
+      height: 350px;
+    }
+  }
+
+  .team_member {
+    margin-bottom: 30px;
+    figure {
+      margin: 0 auto;
+      .square(150px);
+      img {
+        .square(150px);
+      }
+    }
+  }
+
+  #portfolio_slider_wrapper {
+    margin-bottom: 30px;
+    #carousel {
+      display: none;
+    }
+  }
+
+  //------------------------------------------------------------
+}
+
+
+
+
+/* ===== #sign in ===== */
+
+.section-sign{
+    position: relative; 
+}
+.section-sign form{
+    text-align: center;
+}
+.sign-align{
+}
+.section-sign .account{
+    margin-top: 5px;
+}
+.section-sign .section-wrapper{
+    padding: 100px 0;
+}
+.section-sign .cut{
+    position: absolute;
+    bottom: -15px; 
+    left: 400px;
+    color: #222222;
+}
+.sign-background .cut{
+    position: absolute;
+    bottom: -15px; 
+    left: 400px;
+    color: #fff;
+}
+.section-sign h2{  
+    text-align: center;
+}
+
+.sign-background {
+    background-image: url("../images/background/4.jpg");
+    background-position: left bottom;
+    background-repeat: no-repeat;
+    background-size: cover;
+    overflow: hidden;
+}
+
+.sign-background h2{
+    color: #FFF;
+    font-weight: 100;
+}
+.btn-sign {
+    margin-top: -10px;    
+}
+.account-avatar{
+    max-width: 150px;
+}
+.modern {
+  display: inline-block;
+  color: #FFF;
+  margin: 10px;
+  padding: 8px 15px;
+  border-radius: 0;
+  
+-webkit-transition: all 0.3s ease-out;
+-moz-transition: all 0.3s ease-out;
+-o-transition: all 0.3s ease-out;
+-ms-transition: all 0.3s ease-out;
+transition: all 0.3s ease-out;
+  text-decoration: none;
+}
+.modern .mordern-id{
+    font-family: 'Open Sans', sans-serif;
+}
+.section-sign a:hover, .section-sign a:active, .section-sign a:focus{
+   color: #FFFFFF;  
+   text-decoration: none;
+   font-family: 'Open Sans', sans-serif;
+}
+.sign-facebook{
+    background: #35528A;
+    font-family: 'Open Sans', sans-serif;  
+}
+.sign-facebook:hover{
+    background: #2c4371;  
+}
+.sign-twitter{
+    background: #00ADEF;    
+}
+.sign-twitter:hover{
+    background: #0094cd;   
+}
+.sign-google{
+    background: #CE1B21;  
+}
+.sign-google:hover{
+    background: #b0171c; 
+}
+.modern:active {
+box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3) inset;
+-webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3) inset;
+    color: #fff;
+}
+
+.openid{
+    float: none;
+    margin: 0 auto 28px;
+    text-align: center;
+}
+
+.section-sign .password a{
+    -webkit-transition: all 0.2s ease 0s;
+    -moz-transition: all 0.2s ease 0s;
+    -o-transition: all 0.2s ease 0s;
+    -ms-transition: all 0.2s ease 0s;
+    transition: all 0.2s ease 0s;
+    font-weight: bold;
+}
+.section-sign .password a:hover{
+    color:#222222;
+}
+.section-sign .account a{
+    -webkit-transition: all 0.2s ease 0s;
+    -moz-transition: all 0.2s ease 0s;
+    -o-transition: all 0.2s ease 0s;
+    -ms-transition: all 0.2s ease 0s;
+    transition: all 0.2s ease 0s;
+    font-weight: bold;
+}
+.section-sign .account a:hover{
+    color:#222222;
+}
+.btn-avatar{
+    text-align: center;
+    margin-bottom: 20px;
+}
+.btn-account { 
+   width: 82%;
+}
+
+/* ===== #sign up ===== */
+
+.section-sign .btn-avatar a:hover, .section-sign .btn-avatara:active, .section-sign .btn-avatar a:focus{
+   color: #fff;  
+}
+.section-sign .create-account{
+    margin-top: 30px;
+}
+
+.section-sign .form-password .pass{
+    margin-left: 50px;  
+}
+.form-password p{
+    text-align: center;
+    padding: 20px 0;
+}
+.section-sign .form-password .btn-password{
+     margin-top: -10px;
+}
+
+/* ===== #service ===== */
+
+
+
+.service {
+  overflow: hidden;
+  margin-bottom: 20px;
+}
+.service .well {
+  padding-top: 1px;
+}
+.service > .well {
+  margin-bottom: 1px;
+}
+.service .service-desc {
+  overflow: hidden;
+}
+.service .service-icon {
+  float: left;
+  padding: 10px 20px;
+  width: 100px;
+  height: 100px;
+  font-size: 100px;
+  line-height: 1;
+  color: #2673ec;
+}
+
+.service{
+  font-size: 13px;
+}
+
+.service .service-icon{
+  float: left;
+  width: 40px;
+}
+
+.service .service-icon i{
+  font-size: 30px;
+  display: block;
+  margin-top: 15px;
+}
+
+.service .service-content{
+  margin-top: 15px;
+  margin-left: 50px;
+}
+
+.service h5{
+  line-height: 15px;
+}
+
+.service .row-fluid hr{
+  margin: 10px 0px;
+}
+
+.service .row-fluid .grey{
+  color: #999;
+}