//--------------------------------
// Reset
//--------------------------------
@include html5-boilerplate-reset;


//--------------------------------
// Fonts
//--------------------------------
@include html5-boilerplate-fonts;


//--------------------------------
// Page
//--------------------------------
body, select, input, textarea { color: $font-color; }

h1, h2, h3, h4, h5, h6 { @include bold-font; }

html {
  @include force-scrollbar;
}

a, a:active, a:visited { color: $link-color; }
a:hover { color: $link-hover-color; }

ul { margin-left: 30px; }
ol { margin-left: 30px; list-style-type: decimal; }

small { @include small-font; }
strong, th { @include bold-font; }

td, td img { vertical-align: top; }

sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }

input:valid {
  @include valid-input;
}
input:invalid {
  @include invalid-input;
}

@include accessible-focus;

@include quoted-pre;

@include align-input-labels;

@include hand-cursor-inputs;

@include selected-text;

@include webkit-tap-highlight;

@include ie-hacks;


//--------------------------------
// Helpers
//--------------------------------
.ir { @include image-replacement; }

.hidden { @include hidden; }

.visuallyhidden { @include visually-hidden; }

.clearfix {
  @include pie-clearfix; // Already defined by compass
}


//--------------------------------
// Media
//--------------------------------
@media print {
  @include media-print;
}

@media all and (orientation:portrait) { 
  // Style adjustments for portrait mode goes here
}

@media all and (orientation:landscape) {
  // Style adjustments for landscape mode goes here
}

@media screen and (max-device-width: 480px) {
  // Pass in false if you don't want iOS and WinMobile to mobile-optimize the text for you
  @include media-mobile(true);
}