/** RESPONSIVE break points */

// @max-480  : ~"screen and (max-width: 479px)";
// @min-480  : ~"screen and (min-width: 480px)";

// @480-768  : ~"screen and (min-width: 480px) and (max-width: 767px)";

// @max-768  : ~"screen and (max-width: 767px)";
// @min-768  : ~"screen and (min-width: 768px)";

// @768-980  : ~"screen and (min-width: 768px) and (max-width: 979px)";

// @max-980  : ~"screen and (max-width: 979px)";
// @min-980  : ~"screen and (min-width: 980px)";

// @980-1200  : ~"screen and (min-width: 980px) and (max-width: 1199px)";

// @max-1200 : ~"screen and (max-width: 1199px)";
// @min-1200 : ~"screen and (min-width: 1200px)";
// change this

html, body{
  // position:relative;
  // overflow:hidden;
  // width:100%;
  // height:100%;
}
body{
  overflow-y:scroll; top:0;
}

$rootminwidth : 320px;

/** NIVEAU 0 */
#root{
  min-width:$rootminwidth;

  .ie8 &{min-width:1024px;}
}

/** NIVEAU 1 */
#container{ 
  margin:0 auto; position:relative; 
  @include transition(padding-top 0.5s ease-out); // change this
}

/** NIVEAU 2 */
@mixin padded(){ $p:2%; width:100%-2*$p; padding-left:$p; padding-right:$p; }

$header-z-index:1000;
#header{
  // @media @min-768{
  //   position:fixed; top:0; margin:0 auto; @include bgc(#fff); min-width:@rootminwidth*0.97;
  // } //change this
  z-index:$header-z-index;
  @include padded;
  .editmenu-enabled &{ @include mt(30px); }
  .admin-menu &{ @include mt(35px); }
}

#utilities{
  // @media @min-768{
  //   html.no-touch &{
  //     position:fixed; top:0; margin:0 auto; min-width:@rootminwidth*0.97;
  //     @include mt(60px);
  //   }
  //   html.no-touch .editmenu-enabled &{ @include mt(80px); }
  //   html.no-touch .admin-menu &{ @include mt(85px); }
  // }
  // @media @max-768{
  //   >.region{@include pt(5px); @include pb(5px);}
  // } change this
  z-index:999;
  @include bgc(#fff);
  @include padded;

}

#main{@include padded; overflow-x:hidden;}

#footer{@include padded;}

/** NIVEAU 3 */

.js #content-top{}

// .js #content{ overflow-y:hidden; }


// #container, #header-blocks, #center{.transition(width, 0.5s, ease-out); }

// .footer-block .region, .header-block{ @include inlineblock();} change this

/** NIVEAU 4 */
#center{ padding:5px; }

/** Z-INDEX */
#block-feedback-form{z-index:1001;}
#admin-menu{z-index:1002;}
#admin-toolbar{z-index:1003;}