/**
 * Default screen stylesheets
 *
 * @copyright Copyright 2005-2012, Dirk Jesse
 * @license   CC-BY 2.0 (http://creativecommons.org/licenses/by/2.0/),
 *            YAML-CDL (http://www.yaml.de/license.html)
 * @link      http://www.yaml.de
 */

/**
 * Zikula BlankTheme Adaptation
 *
 * @author    Mateo Tibaquirá
 * @link      http://www.blanktheme.org
 */

/**
 * CSS Table of Contents
 *
 *  Global fixes (layout-global)
 *  Design of the layout (layout-basics)
 *     Skiplinks styles
 *     Miscelaneous
 *  Specific templates and zones (layout-templates)
 */

/* Google Font API */
@import url("http://fonts.googleapis.com/css?family=Droid+Serif");
@import url("http://fonts.googleapis.com/css?family=Droid+Sans:700");

@media screen
{
  /**
   * Global fixes
   *
   * @section layout-global
   */

  /* force vertical scrollbar */
  body {
    overflow-y: scroll;
  }

  /* layout Module Configuration & fallback for unsupported media queries */
  .ym-wrapper {
    min-width: 760px;
    max-width: 80em;
    margin: 0 auto;
  }

  .ym-wbox {
    margin: 1em 0;
    position: relative;
  }

  /* fullwidth layouts adjustments*/
  body[class~="bt-full2col"] .ym-wrapper,
  body[class~="bt-full3col"] .ym-wrapper {
    min-width: 0
  }
  /* fallback for missing media queries support*/
  body[class~="bt-full2col"] > header,
  body[class~="bt-full3col"] > header,
  body[class~="bt-full2col"] > nav,
  body[class~="bt-full3col"] > nav,
  body[class~="bt-full2col"] > main,
  body[class~="bt-full3col"] > main,
  body[class~="bt-full2col"] > footer,
  body[class~="bt-full3col"] > footer {
    min-width: 760px;
  }
  body[class~="bt-full2col"] .ym-wbox,
  body[class~="bt-full3col"] .ym-wbox {
    margin: 0;
    overflow: hidden;
  }



  /**
   * Design of the layout
   * Layout: width, background, borders of the main containers
   *
   * @section layout-basics
   */

  /******* Skiplinks styles *******/

  .ym-skiplinks a.ym-skip:focus,
  .ym-skiplinks a.ym-skip:active {
    background: #333;
    border-bottom: 1px solid #000;
    color: #fff;
    padding: 10px 0;
    text-align: center;
    text-decoration: none;
  }

  /******* Miscellaneous *******/

  /* default content paddings */
  .ym-col1 .ym-cbox,
  .ym-col2 .ym-cbox,
  .ym-col3 .ym-cbox {
    padding: 0 10px;
  }

  /* cool subcolumns style */
  .coolsubcol {
    background: #f9f9f9;
    border-top: 2px solid #efefef;
    color: #666;
    padding-top: 15px;
  }



  /**
   * Specific templates and zones
   *
   * @section layout-templates
   */

  /**
   * 2col template
   * x1 is the default distribution
   * @subsection layout-template-2col
   */

  /* .ym-col1 is the main column */
  .bt-2col .ym-col1 {
    float: right;
    width: 75%;
  }

  /* .ym-col2 and .ym-col3 contains side blocks */
  .bt-2col .ym-col2,
  .bt-2col .ym-col3 {
    float: none;
    width: auto;
  }


  /* 1X layouts */
  .bt-2col .bt-12 .ym-col1,
  .bt-2col .bt-13 .ym-col1 {
    float: left;
  }
  .bt-2col .bt-12 .ym-col2,
  .bt-2col .bt-13 .ym-col3 {
    margin-left: 75%;
    margin-right: 0;
  }


  /* X1 layouts */
  .bt-2col .bt-21 .ym-col1,
  .bt-2col .bt-31 .ym-col1 {
    margin-left: -5px;
  }
  .bt-2col .bt-21 .ym-col2,
  .bt-2col .bt-31 .ym-col3 {
    margin-left: 0;
    margin-right: 75%;
  }


  /* 1 layout */
  /* full main column */
  .bt-2col .bt-1 .ym-col1 {
    float: none;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }


  /* column boxes paddings */
  .bt-2col .ym-col1 .ym-cbox {
    padding: 0 15px 0 10px;
  }
  .bt-2col .ym-col2 .ym-cbox,
  .bt-2col .ym-col3 .ym-cbox {
    padding: 0 10px 0 15px;
  }
  .bt-2col .bt-12 .ym-col1 .ym-cbox,
  .bt-2col .bt-13 .ym-col1 .ym-cbox {
    padding: 0 10px 0 15px;
  }
  .bt-2col .bt-12 .ym-col2 .ym-cbox,
  .bt-2col .bt-13 .ym-col3 .ym-cbox {
    padding: 0 15px 0 10px;
  }
  .bt-2col .bt-1 .ym-col1 .ym-cbox {
    padding: 0 10px;
  }



  /**
   * 3col template
   * 123 is the default layout
   * @subsection layout-template-3col
   */

  /* fixed width container for fixed with columns */
  .bt-3col .ym-wrapper {
    width: 964px; /* cols widths + 4px .bordered .ym-box */
  }

  /* .ym-col1 is the main column */
  .bt-3col .ym-col1 {
    float: left;
    margin: 0;
    width: 520px;
  }

  /* .ym-col2 contains the left blocks */
  .bt-3col .ym-col2 {
    float: left;
    margin: 0;
    width: 220px;
  }

  /* .ym-col3 contains the right blocks */
  .bt-3col .ym-col3 {
    float: right;
    margin: 0;
    width: 220px;
  }


  /* 213 layout */
  .bt-3col .bt-213 .ym-col1 {
    margin-left: 220px; /* col2 width */
  }
  .bt-3col .bt-213 .ym-col2 {
    margin-left: -740px; /* col1 + col2 widths */
  }
  .bt-3col .bt-213 .ym-col3 {
    /*margin-left: -5px; Not needed for fixed widths */
  }


  /* 312 layout */
  .bt-3col .bt-312 .ym-col1 {
    margin-left: 220px; /* col3 width */
  }
  .bt-3col .bt-312 .ym-col2 {
    float: right;
    /*margin-left: -5px; Not needed for fixed widths */
  }
  .bt-3col .bt-312 .ym-col3 {
    float: left;
    margin-left: -740px; /* col1 + col2 widths */
  }


  /* 132 layout */
  .bt-3col .bt-132 .ym-col2 {
    float: right;
    /*margin-left: -5px; Not needed for fixed widths */
  }
  .bt-3col .bt-132 .ym-col3 {
    float: left;
  }


  /* XX1 layouts */
  .bt-3col .bt-231 .ym-col1,
  .bt-3col .bt-321 .ym-col1 {
    float: right;
    /*margin-left: -5px; Not needed for fixed widths */
  }
  .bt-3col .bt-321 .ym-col2 {
    float: right;
  }


  /* column boxes paddings */
  .bt-3col .ym-col1 .ym-cbox {
    padding: 0 10px;
  }
  .bt-3col .ym-col2 .ym-cbox {
    padding: 0 5px 0 10px;
  }
  .bt-3col .ym-col3 .ym-cbox {
    padding: 0 10px 0 5px;
  }
  .bt-3col .bt-123 .ym-col2 .ym-cbox,
  .bt-3col .bt-321 .ym-col2 .ym-cbox,
  .bt-3col .bt-132 .ym-col3 .ym-cbox,
  .bt-3col .bt-231 .ym-col3 .ym-cbox {
    padding: 0 5px;
  }
  .bt-3col .bt-132 .ym-col2 .ym-cbox,
  .bt-3col .bt-312 .ym-col2 .ym-cbox {
    padding: 0 10px 0 5px;
  }
  .bt-3col .bt-321 .ym-col3 .ym-cbox,
  .bt-3col .bt-312 .ym-col3 .ym-cbox {
    padding: 0 5px 0 10px;
  }



  /**
   * 3col231 template
   * 213 is the default layout
   * @subsection layout-template-3col231
   */

  /* .ym-col1 is the main column (static) */
  .bt-3col231 .ym-col1 {
    border-left: 1px solid #ddd; /* to-customize */
    border-right: 1px solid #ddd; /* to-customize */
    float: none;
    margin-left: 23%; /* leftcol width*/
    margin-right: 23%; /* rightcol width*/
    width: auto;
  }

  /* .ym-col2 contains the left blocks */
  .bt-3col231 .ym-col2 {
    float: left;
    margin: 0;
    width: 23%;
  }

  /* .ym-col3 contains the right blocks */
  .bt-3col231 .ym-col3 {
    float: right;
    margin: 0;
    width: 23%;
  }


  /* 312 layout */
  .bt-3col231 .bt-312 .ym-col2 {
    float: right;
    margin-left: -5px;
  }
  .bt-3col231 .bt-312 .ym-col3 {
    float: left;
  }


  /* column boxes paddings */
  .bt-3col231 .ym-col1 .ym-cbox {
    padding: 0 10px;
  }
  .bt-3col231 .ym-col2 .ym-cbox {
    padding: 0 5px 0 10px;
  }
  .bt-3col231 .ym-col3 .ym-cbox {
    padding: 0 10px 0 5px;
  }
  .bt-3col231 .bt-312 .ym-col2 .ym-cbox {
    padding: 0 10px 0 5px;
  }
  .bt-3col231 .bt-312 .ym-col3 .ym-cbox {
    padding: 0 5px 0 10px;
  }

  /******* Zones *******/

  .bt-zone {
    clear: both;
    margin-bottom: 1em;
  }
}

/* reset fallback values in modern browsers */
@media screen and ( min-width: 0px )
{
  .ym-wrapper {
    min-width: 0px;
  }
}

@media screen and ( max-width: 740px )
{
  nav .ym-hlist ul {
    padding-right: 10px;
  }

  .ym-searchform {
    display:block;
    float: none;
    padding-right: 10px;
    text-align: right;
    width: auto;
  }

  .ym-searchform input[type="search"] {
    width: 14%;
  }
}

@media screen and ( max-width: 480px)
{
  .ym-wbox {
    padding: 0;
  }

  header {
    padding: 0.75em 10px;
  }

  header h1 {
    font-size: 1.5em;
    line-height: 1em;
    margin: 0;
  }

  #main,
  footer,
  .ym-searchform,
  nav .ym-hlist ul {
    padding-left: 10px;
    padding-right: 10px;
  }

  .ym-searchform,
  nav .ym-hlist ul,
  nav .ym-hlist li {
    display: block;
    float: none;
    text-align: left;
    width: auto;
  }

  .ym-searchform input[type="search"] {
    width: 75%;
  }
}

/* reset fallback values in modern browsers */
@media screen and (min-width: 0px)
{
  body[class~="bt-full2col"] > header,
  body[class~="bt-full3col"] > header,
  body[class~="bt-full2col"] > nav,
  body[class~="bt-full3col"] > nav,
  body[class~="bt-full2col"] > main,
  body[class~="bt-full3col"] > main,
  body[class~="bt-full2col"] > footer,
  body[class~="bt-full3col"] > footer,
  .ym-wrapper {
    min-width: 0px;
  }
}

@media screen and (max-width: 740px)
{
  /* linearisation for grid- and column-module, based on CSS class .linearize-level-1 */
  .linearize-level-1, .linearize-level-1 > [class*="ym-c"], .linearize-level-1 > [class*="ym-g"] {
    /* linearization for grids and columns module */
    display: block;
    float: none;
    margin: 0;
    padding: 0;
    width: auto !important;
  }
  .linearize-level-1 > [class*="ym-c"] > [class*="ym-cbox"], .linearize-level-1 > [class*="ym-g"] > [class*="ym-gbox"] {
    /* reset defined gutter values */
    margin: 0;
    padding: 0;
    /* optional for containing floats */
    overflow: hidden;
  }

  nav .ym-hlist ul {
    padding-right: 10px;
  }

  .ym-searchform {
    display: block;
    float: none;
    padding-right: 10px;
    text-align: right;
    width: auto;
  }

  .ym-searchform input[type="search"] {
    width: 14%;
  }
}

@media screen and (max-width: 480px)
{
  /* linearisation for grid- and column-module, based on CSS class .linearize-level-2 */
  .linearize-level-2, .linearize-level-2 > [class*="ym-c"], .linearize-level-2 > [class*="ym-g"] {
    /* linearization for grids and columns module */
    display: block;
    float: none;
    margin: 0;
    padding: 0;
    width: auto !important;
  }
  .linearize-level-2 > [class*="ym-c"] > [class*="ym-cbox"], .linearize-level-2 > [class*="ym-g"] > [class*="ym-gbox"] {
    /* reset defined gutter values */
    margin: 0;
    padding: 0;
    /* optional for containing floats */
    overflow: hidden;
  }

  .ym-wbox {
    margin: 0;
  }

  header h1 {
    font-size: 1.5em;
    line-height: 1em;
    margin: 0;
  }

  footer,
  main,
  .ym-searchform,
  nav .ym-hlist ul,
  body[class~="bt-full2col"] footer .ym-wbox,
  body[class~="bt-full3col"] footer .ym-wbox,
  body[class~="bt-full2col"] .ym-wbox,
  body[class~="bt-full3col"] .ym-wbox {
    padding-left: 10px;
    padding-right: 10px;
  }

  body[class~="bt-full2col"] footer,
  body[class~="bt-full3col"] footer,
  body[class~="bt-full2col"] main,
  body[class~="bt-full3col"] main {
    padding-left: 0;
    padding-right: 0;
  }

  .ym-searchform,
  nav .ym-hlist ul,
  nav .ym-hlist li {
    display: block;
    float: none;
    text-align: left;
    width: auto;
  }

  .ym-searchform input[type="search"] {
    width: 75%;
  }
}