﻿@charset "UTF-8";
/*------------------------------------*\
  INUIT.CSS
\*------------------------------------*/
/*
Author:             Harry Roberts
Twitter:            @inuitcss
Author URL:         csswizardry.com
Project URL:        inuitcss.com
Version:            3.0.a
Date:               30 June 2011

Copyright 2011 Harry Roberts

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

*/





/*------------------------------------*\
  RESET
\*------------------------------------*/
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
  margin:0;
  padding:0;
}
article,aside,details,figcaption,figure,footer,
header,hgroup,menu,nav,section{
  display: block;
}

table{
  border-collapse:collapse;
  border-spacing:0;
}
fieldset,img{ 
  border:0;
}
address,caption,cite,dfn,th,var{
  font-style:normal;
  font-weight:normal;
}
caption,th{
  text-align:left;
}
h1,h2,h3,h4,h5,h6{
  font-size:100%;
  font-weight:normal;
}
q:before,q:after{
  content:'';
}
abbr,acronym{
  border:0;
}


/*------------------------------------*\
  MAIN
\*------------------------------------*/
html{
  overflow-y:scroll; /* Force scrollbars 100% of the time */
  font-size:100%; /* Use 16px as per http://www.informationarchitects.jp/en/100e2r/ and http://www.wilsonminer.com/posts/2008/oct/20/relative-readability/ */
  font-family:Calibri, "Helvetica Neue", Arial, sans-serif; /* Swap these two lines around to switch between serif and sans */
  font-family:Cambria, Georgia, "Times New Roman", serif; /* Swap these two lines around to switch between serif and sans */
  line-height:1.5;
  color:#333;
}
body{
  min-height:100%;
}

/*------------------------------------*\
  CLEARFIX
\*------------------------------------*/
/*
Fix clearing issues as per: http://nicolasgallagher.com/micro-clearfix-hack/
*/
.cf,
.grids{
  zoom:1;
}
.cf:before,
.grids:before,
.cf:after,
.grids:after{
  content:"";
  display:table;
}
.cf:after,
.grids:after{
  clear:both;
}


/*------------------------------------*\
  TYPE
\*------------------------------------*/
/*--- HEADINGS ---*/
h1{
  font-size:2em;      /* 32px */
  margin-bottom:0.75em;  /* 24px */
  line-height:1.5;    /* 48px */
}
h2{
  font-size:1.5em;    /* 24px */
  margin-bottom:1em;    /* 24px */
  line-height:1;      /* 24px */
}
h3{
  font-size:1.25em;    /* 20px */
  margin-bottom:1.2em;  /* 24px */
  line-height:1.2;    /* 24px */
}
h4{
  font-size:1.125em;    /* 18px */
  margin-bottom:1.333em;  /* 24px */
  line-height:1.333;    /* 24px */
}
h5{
  font-weight:bold;
}
h5,
h6{
  font-size:1em;      /* 16px */
  margin-bottom:1.5em;  /* 24px */
  line-height:1.5;    /* 24px */
}

/*--- PARAGRAPHS ---*/
p,
address{
  margin-bottom:1.5em;
}
/*
Mo’ robust paragraph indenting: http://csswizardry.com/2010/12/mo-robust-paragraph-indenting/
Uncomment to activate
p+p{
  text-indent:2em;
  margin-top:-1.5em;
}
*/

/*--- FIGURES ---*/
figure{
  margin-bottom:1.5em;
}
figure img{
  display:block;
  margin-bottom:0;
}
figcaption{
  font-size:0.75em;
}

/*--- LINKS ---*/
/*
Say no to negative hovers: http://csswizardry.com/2011/05/on-negative-hovers/
A negative hover is one whose appearance is subtracted from on hover rather than added to.
*/
a{
  text-decoration:none;
}
a:visited{
  opacity:0.8; /* A bit basic, but it’s a bare minumum... */
}
a:hover{
  text-decoration:underline;
}
a:active,
a:focus{
}

/*--- LISTS ---*/
ul,
ol{
  margin:0 0 1.5em 60px;
}
ul li {
  list-style: disc;
}
ol li {
  list-style: decimal;
}
ul ul,
ol ol,
ul ol,
ol ul{
  /* Let’s take care of lists in lists */
  margin:0 0 0 60px;
}

/*
A numbered list is NOT the same as an ordered one.
Use this class when you want a list to be numbered but it has no order.
See http://jsfiddle.net/csswizardry/sdrth/
*/
ul.numbered{
  list-style:decimal outside;
}
dl{
  margin-bottom:1.5em;
}
dt{
  font-weight:bold;
}
dt:after{
  content:":";
}
dt::after{
  content:":";
}
dd{
  margin-left:60px;
}

/*--- QUOTES ---*/
blockquote{
  text-indent:-0.4em; /* Hang that punctuation */
}
blockquote b,
blockquote .source{
  /* Mark the source up with either a <b> or another element of your choice with a class of source. */
  display:block;
  text-indent:0;
}

/*--- GENERAL ---*/
q,
i,
em,
cite{
  font-style:italic;
  font-weight:inherit;
}
b,
strong{
  font-weight:bold;
  font-style:inherit;
}
mark{
  background:#ffc;
}
s,
del{
  text-decoration:line-through;
}
small{
  font-size:0.75em;
  line-height:1;
}

/*--- CODE ---*/
pre,
code{
  font-family:monospace;
  font-size:1em;
}
pre{
  overflow:auto;
  margin-bottom:1.5em;
  line-height:24px; /* Having to define explicit pixel values :( */
}
code{
  line-height:1;
}

/*------------------------------------*\
  IMAGES
\*------------------------------------*/
img{
  max-width:100%;
  height:auto;
  /* Give it some text styles to offset alt text */
  font-style:italic;
  color:#c00;
}
img.left  { margin:0 20px 0 0; }
img.right  { margin:0 0 0 20px; }

/*--- FLASH/VIDEO ---*/
object,
embed,
video{
  max-width:100%;
}

/*------------------------------------*\
  FORMS
\*------------------------------------*/
/*
Unfortunately, and somewhat obviously, forms don’t fit the baseline all too well. Perhaps in a later version...
*/
fieldset{
  padding:10px;
  border:1px solid #ccc;
  margin-bottom:1.5em;
}
label{
  cursor:pointer;
}
input,
textarea{
  font-family:inherit;
  font-size:1em;
  line-height:1.5;
}

/*
Nice UI touch for placeholders. To get placeholders working cross-browser see @dan_bentley’s jQuery plugin: https://github.com/danbentley/placeholder
*/
[placeholder]{
  cursor:pointer;
}
[placeholder]:active,
[placeholder]:focus{
  cursor:text;
}
.check-list{
  width:100%;
  overflow:hidden;
  list-style:none;
  margin:0 0 1.5em 0;
}
.check-list li{
  width:25%;
  float:left;
}
.check-label{
  display:inline;
}
.check-label:after{
  content:normal;
}
.check-label::after{
  content:normal;
}
.button{
  cursor:pointer;
}
fieldset > :last-child{
  /* Remove the margin from the last element in the fieldset--this makes our padding more consistent. */
  margin:0;
}

/*------------------------------------*\
  TABLES
\*------------------------------------*/
/*
Unfortunately, and somewhat obviously, tables don’t fit the baseline all too well. Perhaps in a later version...
*/
table{
  margin-bottom:1.5em;
  width:100%;
  max-width:100%;
}
thead tr:last-of-type th{
  /* Thicker border on the table-headers of the last row in the table head */
  border-bottom-width:2px;
}
tbody th{
  /* Thicker right border on table-headers in the table body */
  border-right-width:2px;
}
th:empty{
  /* Hide the borders on any empty table-headers */
  border:none;
}
th,td{
  vertical-align:top;
  padding:0.75em;
  border:1px solid #ccc;
}
th{
  font-weight:bold;
  text-align:center
}
table [colspan]{
  /* This looks lovely, trust me... */
  text-align:center;
}
table [rowspan]{
  /* ...as does this. */
  vertical-align:middle;
}
/*
Assuming IE has an 'implied' colspan of one on cells without an explicit colspan attribute, fix/undo it.
See http://jsfiddle.net/csswizardry/UJJay/
*/
[colspan="1"]{
    text-align:left;
}
[rowspan="1"]{
    vertical-align:top;
}
tbody tr:nth-of-type(odd){
  background:rgba(0,0,0,0.05);
}
tfoot{
  text-align:center;
}
tfoot td{
  border-top-width:2px;
}


/*------------------------------------*\
  MISC
\*------------------------------------*/
hr{
  margin:0 0 1.5em 0;
}


/*------------------------------------*\
  CLASSES
\*------------------------------------*/
/*
Some not-too-pretty and insemantic classes to do odd jobs.
*/
.left  { float:left!important; }
.right  { float:right!important; }
.clear  { clear:both; float:none; }

.text-left    { text-align:left; }
.text-right    { text-align:right; }
.text-center,
.text-centre  { text-align:center; }


@media (max-width: 720px){
/*------------------------------------*\
  MAIN
\*------------------------------------*/
html{
}
body{
  -webkit-text-size-adjust:none;
}

/*------------------------------------*\
  TYPE
\*------------------------------------*/
/*--- LISTS ---*/
ul,
ol{
  margin:0 0 1.5em 25px;
}
ul ul,
ol ol,
ul ol,
ol ul{
  /* Let’s take care of lists in lists */
  margin:0 0 0 25px;
}
dd{
  margin-left:25px;
}


/*------------------------------------*\
  IMAGES
\*------------------------------------*/
img.left,
img.right  { max-width:50%; height:auto; }
}
/*--- END MOBILE ---*/


/*------------------------------------*\
  PRINT
\*------------------------------------*/
/*
Good ol’ fashioned paper...
*/

@media print{
/*------------------------------------*\
  MAIN
\*------------------------------------*/
/*
Give everything some decent contrast.
*/
*{
  background:#fff;
  color:#000;
  text-shadow:none!important;
}
/*
Set a nice measure and take the font down to print-acceptable sizes.
*/
body{
  font-size:0.75em; /* 12px (if base font-size was 16px) */
}
/*
Don’t let images break anything.
*/
img{
  max-width:100%;
  height:auto;
}
/*
Try to avoid tables spanning multiple pages. Not failsafe, but a good start.
*/
table{
  page-break-before:always;
}
}
/*--- END PRINT ---*/