/*	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;
}
.one-half,
.one-third,
.one-fourth {
  margin-top: 20px;
}
/* CAROUSEL Default ----------------------------------------------------*/#ch-holder {
  display: block;
}
#cv-holder {
  display: none;
}
/* tablet & desktop */
@media (min-width: 768px) {
  /* COLUMNS LAYOUT--------------------------------------------------*/
  .one-half,
  .one-third,
  .one-fourth {
    float: left;
    margin-right: 2.1276%;
    position: relative;
  }
  .one-half {
    width: 48.9361%;
  }
  .one-third {
    width: 31.9148%;
  }
  .one-fourth {
    width: 23.4042%;
  }
  .last {
    clear: right;
    margin-right: 0 !important;
  }
}
/* mobile & tablet */
@media (max-width: 991px) {
  #logo {
    width: 100%;
  }
  #logo a {
    display: block;
    margin: 0 auto;
  } 
  #logo img {
    display: block;
    margin: 0 auto;
    width: 50%;
  }
  #nav {
    display: none;
  }
  #comboNav {
    display: block;
  }
  #social-bar {
    margin-top: 0;
  }
  #main {
    padding-top: 98px;
  }
}
/*		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) {
  .wrapper {
    width: 712px;
  }
  #main .wrapper p,
  #main #about-us div {
    line-height: 1.8;
  }
  #main .wrapper #home-slider p {
    line-height: 1.2;
  }
  /* LOGO TABLET ----------------------------------------------------*/
  #logo img {
    width: 66%;
  }
  /* Home Page Positioning & Carousel TABLET ------------------------*/
  body.home #slider-block > .wrapper {
    height: 392px;
  }
  body.home #home-slider img {
    width: 712px;
    height: 356px;
  }
  body.home #home-slider h2 {
    margin-top: 2.75em;
  }
  body.home .slidesjs-pagination {
    width: 10em;
    /* 8em for 4 slides */
  
  }
  body.home .slidesjs-pagination li {
    margin: 0 0.5em;
  }
  body.home .anchor {
    top: -103px;
  }
  /*ANS*/
  body.home .anchor#contact,
  body.home .anchor#shows,
  body.home .anchor#welcome {
    top: -99px;
  }
  body.home #about-us {
    min-height: 575px;
  }
  body.home #about-us .bio.kevin .faux-wrap.tier-1 {
    width: 47%;
  }
  body.home #about-us .bio.kevin .faux-wrap.tier-2 {
    width: 15%;
  }
  body.home #about-us .bio.kevin .faux-wrap.tier-3 {
    width: 100%;
  }
  body.home #about-us .bio.kevin .head-shot {
    top: 193px;
    /* top: 126px; */
  
    left: 55px;
    /* left: 50px; */
  
  }
  body.home #about-us .bio.asako {
    margin-left: 5%;
  }
  body.home #about-us .bio.asako .faux-wrap.tier-1 {
    margin-left: 0;
    width: 100%;
  }
  body.home #about-us .bio.asako .faux-wrap.tier-2 {
    margin-left: 29%;
    width: 71%;
  }
  body.home #about-us .bio.asako .faux-wrap.tier-3 {
    margin-left: 38%;
    width: 62%;
  }
  body.home #about-us .bio.asako .head-shot {
    top: 213px;
    /* top: 146px; */
  
    left: -95px;
    /* left: -110px; */
  
  }
  body.home #contact-us {
    min-height: 530px;
  }
  body.home #shows-block li {
    margin-bottom: 1em;
  }
  body.home #splash-spacer {
    height: 15em;
  }

  /* Gallery Page Filtered Items TABLET -----------------------------*/
  #filter-container {
    width: 712px;
  }
  #filter-container figure {
    width: 230px;
    margin-bottom: 11px;
  }
  #filter-container figure img {
    width: 230px;
    height: 164px;
  }
  #filter-container figure.panorama {
    width: 471px;
  }
  #filter-container figure.panorama img {
    width: 471px;
    height: 195px;
  }
  #filter-container figure.vertical img {
    width: 164px;
    height: 230px;
  }
  #filter-container figure.vertical.tall img {
    width: 164px;
    height: 246px;
  }
  #filter-container figure.full img {
    height: 153px;
  }
  .gallery-tags a::after {
    margin-right: 0.8em;
  }
  .footer-cols .gallery-tags a {
    line-height: 2em;
  }
  /* ecard Page TABLET ----------------------------------------------------*/
  .ecard #main {
    padding-top: 129px;
  }
  /* PhotoBooth Page TABLET -------------------------------------------------*/#photobooth-imgs {
    width: 712px;
  }
  #photobooth-imgs img {
    width: 300px;
  }
  #photobooth-imgs .one-third.overlay {
    margin-left: -32px;
    margin-right: -35px;
  }
  /* footer TABLET -------------------------------------------------*/.footer-cols {
    list-style: none;
    margin-top: 40px;
    margin-bottom: 20px;
  }
  .footer-cols h4 {
    text-align: left;
  }
  .footer-cols > li.second-col {
    width: 25%;
  }
  .footer-cols > li.third-col {
    width: 35%;
  }
  .footer-cols p {
    line-height: 1.75;
  }
}
/*		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: 314px;
  }
  /* LOGO MOBILE ----------------------------------------------------*/
  #logo {
    margin-left: 0px;
  }
  #logo a {
    display: block ;
    width: 300px;
  }
  #logo img {
    width: 96%;
  }
  /*  HEADER MOBILE ----------------------------------------------------*/
  .fixed-header header #header {
    opacity: 1;
  }
  .fixed-header #main {
    padding-top: 83px;
    line-height: 1.65;
  }
  .fixed-header.gallery #main {
    padding-top: 155px;
  }
  /* Home Page Positioning & Carousel  MOBILE -----------------------*/
  body.home #slider-block > .wrapper {
    height: 192px;
  }
  body.home #slides .slidesjs-navigation {
    margin-top: -24px;
  }
  body.home .slidesjs-previous,
  body.home .slidesjs-next {
    display: none;
  }
  body.home .slidesjs-pagination {
    font-size: 18px;
    width: 10em;
    /* 8em for 4 slides */
  
  }
  body.home .slidesjs-pagination li {
    margin: 0 0.5em;
  }
  body.home #home-slider img {
    width: 314px;
    height: 157px;
  }
  body.home #home-slider h2 {
    margin-top: 1.25em;
    font-size: 1.75em;
  }
  body.home #home-slider p {
    margin-top: 1em;
    font-size: 1em;
  }
  body.home #home-slider #slide-4 p {
    font-size: 0.95em;
    margin-right: 1em;
    margin-left: 1em;
  }
  body.home #home-slider a {
    margin-top: 0.5em;
    font-size: 1.2em;
  }
  body.home .anchor {
    top: -83px;
  }
  body.home #about-us {
    min-height: 1250px;
  }
  body.home #about-us .bio {
    float: none;
    width: 100%;
  }
  body.home #about-us .bio .head-shot {
    position: absolute;
    z-index: 3;
  }
  body.home #about-us .bio.kevin {
    margin-top: 290px;
  }
  body.home #about-us .bio.kevin .faux-wrap.tier-1 {
    width: 100%;
  }
  body.home #about-us .bio.kevin .faux-wrap.tier-2 {
    width: 100%;
  }
  body.home #about-us .bio.kevin .faux-wrap.tier-3 {
    width: 100%;
  }
  body.home #about-us .bio.kevin .head-shot {
    top: -293px;
    left: 0;
    width: 314px;
    height: 284px;
  }
  body.home #about-us .bio.asako {
    margin: 300px 0 0 0;
  }
  body.home #about-us .bio.asako .faux-wrap {
    text-align: left;
  }
  body.home #about-us .bio.asako .faux-wrap.tier-1 {
    margin-left: 0;
    width: 100%;
    display: inline;
  }
  body.home #about-us .bio.asako .faux-wrap.tier-2 {
    margin-left: 0;
    width: 100%;
    display: inline;
  }
  body.home #about-us .bio.asako .faux-wrap.tier-3 {
    margin-left: 0;
    width: 100%;
  }
  body.home #about-us .bio.asako .head-shot {
    top: -285px;
    left: 0;
    width: 314px;
    height: 276px;
  }
  body.home #contact-us {
    min-height: 390px;
    background-image: url(../img/main/contact-us-sml.png);
    background-position: 0 157px;
  }
  body.home #shows-block {
    min-height: 700px;
  }
  body.home #shows-block li {
    margin-bottom: 1em;
  }
  body.home #shows-block li span::after {
    content: "";
  }
  body.home #shows-block li span {
    display: block;
  }
  body.home #splash-spacer {
    height: 6.5em;
  }
  /* NAV MOBILE ----------------------------------------------------*/
  #nav {
    display: none;
  }
  #comboNav {
    display: block;
  }
  #social-bar {
    margin-top: 0;
  }
  /* SLIDER MOBILE ----------------------------------------------------*/
  .lof-slidecontent,
  .main-slider-content {
    width: 300px;
    height: 220px;
  }
  .lof-slidecontent .sliders-wrapper,
  .main-slider-content .sliders-wrapper {
    width: 300px;
  }
  .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: 300px;
  }
  .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: 314px;
  }
  #filter-container figure {
    width: 314px;
    margin-right: 0px;
  }
  #filter-container figure img {
    width: 314px;
    height: 224px;
  }
  #filter-container figure.panorama {
    width: 314px;
  }
  #filter-container figure.panorama img {
    width: 314px;
    height: 131px;
  }
  #filter-container figure.vertical img {
    width: 224px;
    height: 314px;
  }
  #filter-container figure.vertical.tall img {
    width: 224px;
    height: 336px;
  }
  #filter-container figure.full img {
    height: 209px;
  }
  #filter-container figure figcaption .heading {
    font-size: 28px;
  }
  ul#gallery-filter-menu {
    font-size: 12px;
    padding: 5px 0;
  }
  ul#gallery-filter-menu a {
    padding: 5px 5px;
  }
  .gallery-tags a::after {
    margin-right: 0.8em;
  }
  .footer-cols .gallery-tags h4 {
    margin-bottom: 25px;
  }
  .footer-cols .gallery-tags a {
    line-height: 2em;
  }
  /* ecard Page TABLET ----------------------------------------------------*/
  .ecard #main {
    padding-top: 115px;
  }
  /*  PhotoBooth Page MOBILE ------------------------------------------*/.one-third.overlay {
    margin-left: 0;
    margin-right: 0;
  }
  .one-third img {
    width: 320px;
  }
  /* FOOTER MOBILE ----------------------------------------------------*/footer ul {
    margin: 0;
  }
  .footer-cols > li {
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  }
  .footer-cols > li:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }
  .footer-bottom {
    width: 90%;
  }
}
/*		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 a {
    display: block ;
    width: 436px;
  }
  /* NAV WIDE MOBILE -----------------------------------------------------*/
  #nav {
    display: none;
  }
  #comboNav {
    display: block;
  }
  /* Home Page Positioning & Carousel WIDE MOBILE ------------------------*/
  body.home #main {
    padding-top: 94px;
  }
  body.home #slider-block > .wrapper {
    height: 251px;
  }
  body.home #home-slider img {
    width: 436px;
    height: 218px;
  }
  body.home #home-slider h2 {
    margin-top: 2em;
    font-size: 2.2em;
  }
  body.home #home-slider p {
    font-size: 1.2em;
  }
  body.home #home-slider a {
    font-size: 1.5em;
  }
  body.home .slidesjs-previous,
  body.home .slidesjs-next {
    display: block;
  }
  body.home .anchor {
    top: -96px;
  }
  body.home .anchor#contact,
  body.home .anchor#shows {
    top: -94px;
  }
  body.home #about-us {
    height: 1080px;
  }
  body.home #about-us .bio.kevin .head-shot,
  body.home #about-us .bio.asako .head-shot {
    left: 60px;
  }
  body.home #contact-us {
    min-height: 500px;
    background-position: 0 176px;
  }
  body.home #splash-spacer {
    height: 9em;
  }
  /* SLIDER WIDE MOBILE ----------------------------------------------------*/.lof-slidecontent,
  .main-slider-content {
    width: 436px;
    height: 370px;
  }
  .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%;
  }
  /* Gallery Page Filtered Items WIDE MOBILE -------------------------------*/#filter-container {
    width: 436px;
  }
  #filter-container figure {
    width: 213px;
    margin-bottom: 10px;
  }
  #filter-container figure img {
    width: 213px;
    height: 152px;
  }
  #filter-container figure.panorama {
    width: 436px;
  }
  #filter-container figure.panorama img {
    width: 436px;
    height: 181px;
  }
  #filter-container figure.vertical img {
    width: 152px;
    height: 213px;
  }
  #filter-container figure.vertical.tall img {
    width: 152px;
    height: 228px;
  }
  #filter-container figure.full img {
    height: 142px;
  }
  /* ecard Page WIDE MOBILE ----------------------------------------*/
  .ecard #main {
    padding-top: 127px;
  }
  /* PhotoBooth Page WIDE MOBILE -----------------------------------*/
  .one-third img {
    width: 423px;
  }
  .footer-bottom { width: 100%; }
}
