Your IP : 216.73.216.147


Current Path : /home/lejardintz/www/templates/as002085/less/
Upload File :
Current File : /home/lejardintz/www/templates/as002085/less/responsive.less

// Core variables and mixins
@import "variables.less"; // Custom for this template
@import "../../../media/jui/less/mixins.less";


/*== 1200px and beyond ===================================================
========================================================================*/

/* Large desktop */
@media (max-width: 1600px) {
  .mod-custom__devices .lazy_container{
    max-width: 100%;
    margin-right: 0;
  }
}

@media (max-width: 1400px) {
  h1{
    font-size: 100px;
    line-height: 100px;
  }
  .sequence-prev{
    left: 20px !important;
  }
  .sequence-next{
    right: 20px !important;
  }
  .sequence-slider > .sequence-canvas li > .info{
    width: auto !important;
    margin-left: 0 !important;
    left: 100px !important;
    right: 100px;
  }
  .caroufredsel_prev{
    left: 20px !important;
  }
  .caroufredsel_next{
    right: 0px !important;
  }
  .gallery-item.gallery-grid .view .item_title{
    margin-bottom: 0;
  }
  .gallery-grid .view p{
    padding-bottom: 0;
  }
} 

/*== Up to 1200px =====================================================
========================================================================*/

/* Large desktop */
@media (max-width: 1200px) {

  #contact_map{
    height: 376px;
  }
  .row-fluid{
    margin-left: -@gridGutterWidth;
    [class*="itemSpan"],
    [class*="span"]{
      padding-left: @gridGutterWidth;
    }
  }
  .fluid{
    margin-left: -@gridGutterWidth;
  }

  .navigation ul.sf-menu > li > a, .navigation ul.sf-menu > li > span{
    padding: 0 14px;
  }
  h1{
    font-size: 80px;
    line-height: 80px;
  }
  .sequence-slider > .sequence-canvas li > .info .camera_caption{
    font-size: 80px !important;
    line-height: 80px !important;
  }
  #logo{
    margin-left: 20px;
  }
  .navigation{
    margin-right: 20px;
  }
  .sequence-slider > .sequence-canvas li > .info .btn-info{
    line-height: 60px !important;
    padding: 0 20px !important;
    height: 60px !important;
  }
  .radial-progress{
    width: 220px;
    height: 220px;
  }
  .radial-progress .circle .mask{
    clip: rect(0px, 220px, 220px, 110px);
    height: 220px;
    width: 220px;
  }
  .radial-progress .circle .mask .fill{
    width: 204px;
    height: 204px;
    clip: rect(0px, 110px, 220px, 0px);
  }
  .radial-progress .inset{
    height: 204px;
    width: 204px;
  }
  .radial-progress .inset .percentage{
    left: 42px;
    top: 80.5px;
  }
  .caroufredsel_prev, .caroufredsel_next{
    top: 140px !important;
    margin-top: 0 !important;
  }
  .page-category__team{
    .social_team li{
      margin: 0 1px;
    }
  }

} 

/*== Up to 980px ======================================================
========================================================================*/

/* Narrow desktop */
@media (max-width: 979px) {
  
  .thumbnails {
    margin-left: -12px;
  }
  .thumbnails > li {
    margin-left: 12px;
  }

  /*footer*/
  #back-top{
    display: none !important;
  }

  .row-fluid{
    margin-left: -@gridGutterWidth768;
    [class*="itemSpan"],
    [class*="span"]{
      padding-left: @gridGutterWidth768;
    }
  }
  .fluid{
    margin-left: -@gridGutterWidth768;
  }
  h1{
    font-size: 60px;
    line-height: 60px;
  }
  .sequence-slider > .sequence-canvas li > .info .camera_caption{
    font-size: 60px !important;
    line-height: 60px !important;
  }

  .navigation ul.sf-menu > li > a, .navigation ul.sf-menu > li > span{
    padding: 0 5px;
    font-size: 16px;
  }
  .radial-progress{
    width: 173px;
    height: 173px;
  }
  .radial-progress .circle .mask{
    clip: rect(0px, 173px, 173px, 86px);
    height: 173px;
    width: 173px;
  }
  .radial-progress .circle .mask .fill{
    width: 157px;
    height: 157px;
    clip: rect(0px, 86px, 173px, 0px);
  }
  .radial-progress .inset{
    height: 157px;
    width: 157px;
  }
  .radial-progress .inset .percentage{
    left: 18.5px;
    top: 57px;
  }
  .team .item_container .social_team li a{
    font-size: 20px;
    line-height: 37px;
    width: 37px;
  }
  .pricing .row-fluid .item_container .price{
    font-size: 50px;
  }
  .blog .item .item_content .item_introtext{
    font-size: @baseFontSize;
    text-transform: none;
    line-height: @baseLineHeight;
    left: 10px;
    right: 10px;
    bottom: 30px;
  }
  .blog .item .item_content .item_title{
    top: 10px;
    left: 10px;
    margin-right: 10px;
  }
  .blog .item .item_content .item_info{
    left: 10px;
    bottom: 5px;
  }
  .gallery-grid .view p{
    font-size: 14px;
    line-height: 14px;
  }
  .page-category__team{
    .social_team li{
      a{
        width: 46px;
        line-height: 46px;
      }
    }
  }

}

/*== Up to 980px and beyond 768px ======================================
========================================================================*/

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {



}


/*== Up to 767px ======================================================
========================================================================*/

/* Landscape phone to portrait tablet */
@media (max-width: 767px){

  body{
    padding: 0;
    .row-container{
      padding: 0 20px;
    }
  }

  // Stick to bottom footer styles
  #wrapper{
    margin: 0;
  }

  #footer-wrapper{
    height: auto;
  }

  #push{
    display: none;
  }

  #logo{
    float: none;
    margin-left: 0;
    text-align: center;
    a{
      margin: 0;
    }
  }

  .blog .item .item_content .item_introtext{
    font-size: 14px;
    line-height: 17px;
  }

  .moduletable.devices{
    margin-bottom: 40px;
  }

  .team{
    font-size: 0;
    line-height: 0;
    .item{
      font-size: @baseFontSize;
      line-height: @baseLineHeight;
      display: inline-block !important;
      width: 50% !important;
      vertical-align: top;
      .item_img a,
      .lazy_container{
        width: 100% !important;
      }
    }
  }

  .pricing .row-fluid .item + .item .item_container{
    border-left-color: #c3c3c3;
  }

  .priorities{
    font-size: 0;
    line-height: 0;
    .item{
      font-size: @baseFontSize;
      line-height: @baseLineHeight;
      display: inline-block !important;
      width: 50% !important;
      vertical-align: top;
    }
  }

  .gallery {
    .mix{
      width: 50% !important;
    }
  }

  .blog{
    .item{
      width: 50% !important;
      float: left !important;
    }
  }

  .pricing{
    .item{
      width: 50% !important;
      float: left !important;
    }
  }

  .body__home #header-row{
    background: #fff;
    position: static;
  }
  .sequence-prev, .sequence-next{
    width: 25px !important;
  }
  .sequence-slider > .sequence-canvas li > .info{
    left: 50px !important;
    right: 50px;
  }

  .navigation{
    float: none;
    margin-right: 0;
    padding: 20px 20px;
  }

  .nav.menu.pull-right.nav-pills{
    float: none;
    text-align: center;
    li{
      float: none;
      display: inline-block;
    }
  }

  .social{
    text-align: left;
    padding: 10px 0;
  }


  /*content*/

    [class*="cols"]{
      [class*="span"]{
        width: 100%;
      }
    }

  .item-image.blog-image{
    float: none;
    margin: 0 0 20px 0;
  }

  .row-fluid{
    [class*="itemSpan"],
    [class*="span"]{
      display: block;
      float: none;
      margin-left: 0;
      width: auto;
    }
  }

  /*gallery*/
  .page-gallery{
    ul.gallery{
      .gallery-grid{
        width: 49.99%;
        max-width: 49.99%;
      }
    }
  }

  .page-gallery ul.gallery .gallery-grid .view .item_img{
    max-width: 100%;
    a{
      display: block;
    }
  }

  .img-full__left.span5{
    width: 50%;
  }

  /*contact*/
  .contact_details{
    .contact_details_item{
      width: 30%;
      float: left;
    }
  }

  .page-gallery ul.gallery .gallery-grid .view{
    margin: 0 auto;
    .item_img{
      float: none;
      margin: 0 !important;
    }
  }

  /*Modules*/

  /*search*/
  .mod-search__aside{
    .mod-search_searchword{
      width: 50%;
    }
  }

  /*login*/
  .mod-login__aside{
    .mod-login_username,
    .mod-login_passwd{
      width: 50%;
    }
  }

  #back-top{
    display:none !important;
  }
  .scrolled #logo h1 span{
    font-size: 60px;
    line-height: 60px;
  }
  .scrolled #logo{
    margin-top: 0px;
    padding-top: 10px;
  }
  #logo{
    margin-top: 0px;
    padding-top: 10px;
  }

}

/*== Up to 640px ==================================================
====================================================================*/

@media (max-width: 640px) {

  /*contact*/

  .contact_details{
    margin-bottom: @baseLineHeight;
    .contact_details_item{
      width: 100%;
      float: none;
    }
  }

  h3{
    font-size: 59px;
    line-height: 70px;
  }

  .layout-mode{
    float: none;
  }
  h1{
    font-size: 28px;
    line-height: 28px;
  }
  .sequence-slider > .sequence-canvas li > .info .camera_caption{
    font-size: 28px !important;
    line-height: 28px !important;
  }
  .sequence-slider > .sequence-canvas li > .info .btn-info{
    line-height: 28px !important;
    height: 28px !important;
    font-size: 18px !important;
  }
  .mod-custom__video .module-content .module-content-inner h3{
    margin-bottom: 5px;
  }
  .caroufredsel_prev, .caroufredsel_next{
    top: 170px !important;
    margin-top: 0 !important;
  }
  .btn-primary, .btn-small,
  btn-info{
    width: auto;
  }

}

/*== Up to 480px ==================================================
====================================================================*/

/* Landscape phones and down */
@media (max-width: 479px) {

  /*contact*/

  .contact_form{
    width: 100%;
  }

  .team,
  .priorities,
  .blog,
  .pricing{
    .item{
      width: 100% !important;
    }
  }
  .gallery .filters a{
    margin: 0 3px;
  }
  .gallery{
    .item{
      width: auto !important;
      max-width: 100%;
    }
  }
  .blog{
    .item{
      .lazy_container{
        width: 100% !important;
      }
    }
  }

  .caroufredsel_prev, .caroufredsel_next{
    top: 150px !important;
    margin-top: 0 !important;
  }

  /*registration*/

  .page-registration,
  .page-remind,
  .page-reset,
  .page-login,
  .page-login,
  .page-profile__edit{
    form{
      input,
      select{
        width: 100%;
      }
      label{
        display: inline-block;
      }
    }
  }

  /* pagination */

  .pagination{
    ul{
      li{
        display: none;
        &.pagination-prev,
        &.pagination-next{
          display: inline-block;
        }
      }
    }
  }

  /*gallery*/

  .page-gallery{
    .item_img.img-intro{
      float: none;
      margin: 0 0 @baseLineHeight 0;
    }
    ul.gallery{
      .gallery-item{
        text-align: center;
        max-width: 100% !important;
        width: 100% !important;
        .item_img{
          float: none;
          margin: 0 auto @baseLineHeight !important;
          max-width: 100%;
          .lazy_container{
            width: 100% !important;
          }
        }
        a.zoom{
          display: block;
        }
      }
    }
  }

  .img-full__left.span5{
    width: 100%;
    margin-right:0;
  }

  /*blog*/

  .item_img{
    float: none;
     margin: 0 0 @baseLineHeight 0;
     max-width: 100%;
  }

  /*archive*/

  .page-archive_filters{
    select{
      display: block;
      width: 100%;
    }
  }

  h3{
    font-size: 37px;
    line-height: 44px;
  }

  /*contact*/

  .contact_details{
    .contact_details_item{
      width: 100%;
      float: none;
    }
  }

  /*Modules*/

  /*search*/

  .mod-search__aside{
    .mod-search_searchword{
      width: 100%;
    }
  }

  /*login*/

  .mod-login__aside{
    .mod-login_userdata{
      width: 100%;
      overflow: hidden;
    }
    .mod-login_username,
    .mod-login_passwd{
      width: 100%;
    }
  }

  div.modal{
    position:absolute;
  }
  
  #error{
    input{
      width: 200px;
    }
  }
  .mod-custom__video .module-content .module-content-inner{
    font-size: @baseFontSize;
    line-height: @baseLineHeight;
    p{
      padding-bottom: 0;
    }
  }
}

/*== Up to 340px =====================================================
========================================================================*/

/* Portrait phones */
@media (max-width: 380px) {

.caroufredsel_prev, .caroufredsel_next{
  top: 180px !important;
  margin-top: 0 !important;
}
  
}