@import "elements/variables";

@import "elements/introduction";
@import "elements/metas";
@import "elements/newsletter";
@import "elements/other-articles";



.tag-list{
  margin-top: 15px;
  span{margin-bottom: 5px;display: block;}
  ul{
    padding-left: 0px;
    li{
      list-style: none;display: inline-block;background-color: @tagsBG;padding: 0 8px 0 18px;height: 30px;line-height: 30px;margin-bottom: 10px;.bgUrl('@{img}/bullet-white.png', no-repeat);.position(8px, center);.border-radius(3px);
      &:hover{
        background-color: @brand-primary;
        a{color: @white;}
      }
      a{color: #999999;display: block;}
    }
  }

  @media (min-width: 768px){
    ul, span{display: inline-block;}
    ul{
      padding-left: 5px;margin: 0;
      li{margin: 0}
    }
    span{margin-bottom: 0;}
  }
}

//FRAIS KM
.fraisKm{
  margin-top: 20px;
  .tab{
    .border-content{
      border: 1px solid @greycc;
      .nav-tabs{
        border-bottom: none;
        li{
          width: 50%;.opacity(0.5);
          &.active{
            .opacity(1);.bgUrl('@{img}/arrow-grey-bottom.png', no-repeat);.position(center, bottom);padding-bottom: 15px;
            a, a:hover{background-color: @greyf0;.border-radius(0);border: none;}
          }
          a{font-size: 21px;font-family: 'open_sansbold';color: @black1d;text-align: center;border: none;
            &:hover{background-color: transparent;border: none;.border-radius(0);}
            span{display: block;}
          }
        }
      }
      .tab-content{
        padding: 15px;
        .tab-pane{
          .form-group{
            clear: both;
            .error-content{right: 15px}
            @media(min-width: @screen-sm){display: table; width: 100%}
            p{clear: left;}
            p, .form-info{position: static;
              @media(min-width: @screen-sm){display: table-cell; vertical-align: middle; float: none; width: 50%}
            }
            .input-group{padding: 0 15px;}
            &.km{
              overflow: hidden;margin-bottom: 20px; z-index: 0;
              .form-control{width: 88%;float: left;padding: 0 0 0 5px;}
              .icoCharte-error, .icoCharte-check{right: 12%; margin-right: 25px}
              span{float: right;line-height: @input-height-base;}
            }
          }
          .alert-success{height: 0;padding: 0;}
          .btn-primary{display: block;width: 170px;}
          .calculate{
            font-size: 16px;text-align: center;
            p{.bgUrl('@{img}/calcul.png', no-repeat);.position(left, center);padding-left: 30px;margin-top: 25px;display: inline-block;}
            .somme{font-family: 'open_sansbold';}
          }
        }
      }
    }
  }
  .notice{
    margin: 20px auto;
    .title2{font-size: 16px;font-family: 'open_sansbold';text-align: center;margin-top: 20px;border: 1px solid #dddddd;margin-bottom: 0;background-color: @greyf0;padding: 10px 0;}
    .table-bordered{
      margin-top: 0;
      th{background-color: @greyf0;}
      th, td{padding: 10px 5px;text-align: center;}
      tr{background: none;}
      p{margin: 0}
    }
  }

  @media(min-width: 768px){
    .tab, table{margin: 0 auto;}
    .tab .border-content .tab-content .tab-pane{
      .form-group{
        label{font-size: 14px;line-height: 23px;}
      }
      p{margin-bottom: 10px;}
      .calculate{font-size: 21px;}
    }
  }

  @media(min-width: 992px){
    .tab{width: 80%;}
  }
}

.other-articles ul {
  @media (min-width: @screen-sm) {
    .content-columns(2; @grid-gutter-width);
  }
}