/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://opensource.org/licenses/mit-license.php	*/
/*	



/*		Default Layout: 992px. 
		Gutters: 24px.
		Outer margins: 48px.
		Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */
/* Vars ----------------------------------------------------*//* Mixins ----------------------------------------------------*/
#comboNav {
  display: none;
}
.wrapper {
  width: 940px;
}
/* CAROUSEL Default ----------------------------------------------------*/
#ch-holder {
  display: block;
}
#cv-holder {
  display: none;
}
/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  /* GENERAL TABLET ----------------------------------------------------*/
  .wrapper {
    width: 712px;
  }
  /* NAV TABLET ----------------------------------------------------*/
  #nav {
    display: block;
  }

  /* CAROUSEL TABLET ----------------------------------------------------*/
  #ch-holder {
    display: block;
  }
  #cv-holder {
    display: none;
  }
  /* SLIDER TABLET ----------------------------------------------------*/
  
  #loader {
	height:454px;
  }
  #home-slider {
    margin-bottom: 0px;
    padding-top: 50px;
  }
  body.home #main {
  padding-top: 30px;
  }
  .lof-slidecontent,
  .main-slider-content {
    width: 712px;
  }
  .lof-slidecontent .sliders-wrapper,
  .main-slider-content .sliders-wrapper {
    width: 712px;
  }
  .lof-slidecontent .navigator-content .button-next,
  .main-slider-content .navigator-content .button-next,
  .lof-slidecontent .navigator-content .button-previous,
  .main-slider-content .navigator-content .button-previous,
  .lof-slidecontent .navigator-content .button-control,
  .main-slider-content .navigator-content .button-control {
    opacity: 1;
    bottom: 0px;
    left: 0px;
    z-index: 199;
  }
  .lof-slidecontent .navigator-content .button-next,
  .main-slider-content .navigator-content .button-next {
    left: 682px;
  }
  .lof-slidecontent .navigator-wrap-inner,
  .main-slider-content .navigator-wrap-inner {
    display: none;
  }
  .lof-slidecontent .navigator-wrapper,
  .main-slider-content .navigator-wrapper {
    width: 712px;
  }
  /* FILTERED ITEMS TABLET ----------------------------------------------------*/
  #filter-container {
    width: 652px;
	margin-left: 60px;  
  }
  #filter-container figure {
    width: 160px;
    margin-right: 50px;
	margin-bottom: 50px;
  }

  /* CAROUSEL TABLET ----------------------------------------------------*/
  .jcarousel-skin-folder .jcarousel-container-horizontal {
    width: 585px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 63px;
    padding-right: 63px;
  }
  .jcarousel-skin-folder .jcarousel-clip-horizontal {
    width: 585px;
    height: 100px;
  }
  .jcarousel-skin-folder .jcarousel-item {
    width: 195px;
    height: 100px;
  }
  .jcarousel-skin-folder .jcarousel-prev-horizontal,
  .jcarousel-skin-folder .jcarousel-next-horizontal {
    width: 63px;
    height: 100px;
  }
  /*  PAGE TABLET----------------------------------------------------*/
  #page-content-sb {
    width: 460px;
    margin-right: 60px;
  }
  /* PORTFOLIO TABLET ----------------------------------------------------*/
  #portfolio-content {
  margin-bottom: 0px;
  }
  #portfolio-content #project-box .info {
    width: 140px;
    /* 160 - 20 */
  
    padding-left: 20px;
    margin-right: 24px;
  }
  #portfolio-content #project-box .entry-content {
    width: 100%;
    margin-bottom: 40px;
  }
  #portfolio-content #project-box .entry-content .multicolumn .column * {
	width: 100%;
  }
}
/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */
@media only screen and (max-width: 767px) {
  .wrapper {
    width: 252px;
  }
  /* LOGO MOBILE ----------------------------------------------------*/
  #logo {
    margin-left: 0px;
  }
  #logo a {
    display: block ;
    width: 252px;
  }
  #logo img {
    display: block;
    margin: 0 auto;
  }
  /* HEADLINE MOBILE ----------------------------------------------------*/
  #headline {
    font-size: 36px;
  }
  /* CAROUSEL MOBILE ----------------------------------------------------*/
  #ch-holder {
    display: none;
  }
  #cv-holder {
    display: block;
  }
  .carousel-holder .carousel-heading span {
    margin: 0px 0px 22px 0px;
  }
  /* SLIDER MOBILE ----------------------------------------------------*/
  #loader {
	height:161px;
  }
  #home-slider {
  margin-bottom: 0px;
  padding-top: 50px;
  }
  body.home #main {
  padding-top: 20px;
  }
  .lof-slidecontent,
  .main-slider-content {
    width: 252px;
  }
  .lof-slidecontent .sliders-wrapper,
  .main-slider-content .sliders-wrapper {
    width: 252px;
  }
  .lof-slidecontent .navigator-content .button-next,
  .main-slider-content .navigator-content .button-next,
  .lof-slidecontent .navigator-content .button-previous,
  .main-slider-content .navigator-content .button-previous,
  .lof-slidecontent .navigator-content .button-control,
  .main-slider-content .navigator-content .button-control {
    opacity: 1;
    bottom: 0px;
    left: 0px;
    z-index: 199;
  }
  .lof-slidecontent .navigator-content .button-next,
  .main-slider-content .navigator-content .button-next {
    left: 222px;
  }
  .lof-slidecontent .navigator-wrap-inner,
  .main-slider-content .navigator-wrap-inner {
    display: none;
  }
  .lof-slidecontent .navigator-wrapper,
  .main-slider-content .navigator-wrapper {
    width: 252px;
  }
  .lof-slidecontent .slider-description,
  .main-slider-content .slider-description {
    top: 0px;
    left: 0px;
    width: 232px;
    height: 100%;
  }
  /* Description MOBILE ----------------------------------------------------*/
  .main-slider-content:hover .slider-description {
    opacity: 1;
  }
  /* FILTERED ITEMS MOBILE ----------------------------------------------------*/
  #filter-container {
    width: 252px;
    margin-left: 0px;
    }
  #filter-container figure {
    width: 160px;
    margin-left: 0px;
  }
  #filter-container figure figcaption .heading {
    font-size: 28px;
  }
  #filter-buttons li a {
  font-size: 12px;
  }
  /*  PAGE MOBILE ----------------------------------------------------*/
  #page-content-sb {
    width: 252px;
    margin-right: 0px;
  }
  /* PORTFOLIO MOBILE ----------------------------------------------------*/
  #portfolio-content {
  margin-bottom: 0px;
  }
  #portfolio-content #project-box .info {
    width: 212px;
    padding-left: 20px;
    margin-right: 24px;
    margin-bottom: 0px;
  }
  #portfolio-content #project-box .entry-content {
    margin-bottom: 0px;
  }
  #portfolio-content #project-box .entry-content .multicolumn .column * {
    width: 100%;
    padding-right: 0px;
  }
  #portfolio-content #project-box .entry-content .multicolumn .column.last {
    margin-right: 0px;
  }
}
/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .wrapper {
    width: 436px;
  }
  /* LOGO WIDE MOBILE ----------------------------------------------------*/
  #logo, #logo a {
  width: 98px;
  height:49px;
  margin-left:0px;
  margin-bottom: 0px;
  margin-top: 20px;
  display:block;
  }
  #logo img {
  width: 98px;
  height:49px;
  }
  /* NAV WIDE MOBILE ----------------------------------------------------*/
  #nav {
	display: block;
	padding-top:50px;
	margin-left:0;
	margin-right:0px;
    float: right;
  }
  /* CAROUSEL WIDE MOBILE ----------------------------------------------------*/
  #ch-holder {
    display: none;
  }
  #cv-holder {
    display: block;
  }
  .carousel-holder .carousel-heading span {
    margin: 0px 0px 22px 0px;
  }
  /* SLIDER WIDE MOBILE ----------------------------------------------------*/  
  #loader {
	height:278px;
  }
  #home-slider {
  margin-bottom: 0px;
  padding-top: 50px;
  width:100%;
  }
  .lof-slidecontent,
  .main-slider-content {
    width: 436px;
  }
  .lof-slidecontent .sliders-wrapper,
  .main-slider-content .sliders-wrapper {
    width: 436px;
  }
  .lof-slidecontent .navigator-content .button-next,
  .main-slider-content .navigator-content .button-next,
  .lof-slidecontent .navigator-content .button-previous,
  .main-slider-content .navigator-content .button-previous,
  .lof-slidecontent .navigator-content .button-control,
  .main-slider-content .navigator-content .button-control {
    opacity: 1;
    bottom: 0px;
    left: 0px;
    z-index: 199;
  }
  .lof-slidecontent .navigator-content .button-next,
  .main-slider-content .navigator-content .button-next {
    left: 406px;
  }
  .lof-slidecontent .navigator-wrap-inner,
  .main-slider-content .navigator-wrap-inner {
    display: none;
  }
  .lof-slidecontent .navigator-wrapper,
  .main-slider-content .navigator-wrapper {
    width: 436px;
  }
  .lof-slidecontent .slider-description,
  .main-slider-content .slider-description {
    top: 0px;
    left: 0px;
    width: 232px;
    height: 100%;
  }
  /* FILTERED ITEMS WIDE MOBILE ----------------------------------------------------*/
  #filter-container {
    width: 390px;
	margin-top:40px;
	margin-bottom: 0px;
	margin-left:38px;
	margin-right: 0px;
	padding:0;
  }
  #filter-container figure {
    width: 100px;
    margin-right: 30px;
	margin-bottom: 30px;
  }
  /*  PAGE WIDE MOBILE ----------------------------------------------------*/
  #page-content-sb {
    width: 436px;
    margin-right: 0px;
  }
  /* PORTFOLIO WIDE MOBILE ----------------------------------------------------*/
  #portfolio-content {
  margin-bottom: 0px;
  }
  #portfolio-content #project-box .info {
    width: 396px;
    padding-left: 20px;
    margin-right: 24px;
    margin-bottom: 0px;
  }
  #portfolio-content #project-box .entry-content {
    margin-bottom: 40px;
	width: 100%;
  }
  #portfolio-content #project-box .entry-content .multicolumn .column * {
    width: 100%;
  }
  #portfolio-content #project-box .entry-content .multicolumn .column.last {
    margin-right: 0px;
  }
}
@media only screen and (max-width: 479px) {
  #logo, #logo a {
  width: 98px;
  height:49px;
  margin-left:0px;
  margin-bottom: 0px;
  margin-top: 20px;
  display:block;
  }
  #logo img {
  width: 98px;
  height:49px;
  }
  #nav {
	padding-top:50px;
  }
  #nav > li > a {
  font-size: 9px;
  line-height: 20px;
  }
  #filter-container {
  margin-top:25px;
  margin-bottom: 0px;
  margin-left:0px;
  margin-right: 0px;
  padding:0;
  }
  #filter-container figure {
    width: 65px;
    margin-right: 0px;
	margin-left: 15px;
	margin-bottom: 20px;
	float:none;
  }
  #portfolio-content {
  margin-bottom: 0px;
  }
  #filter-buttons li a {
  font-size: 9px;
  }
}