/* --------------------------------------------------------------------
Base Styles
Author:             Netmatter Ltd
Author URI:         http://www.netmatter.co.uk/

:: 	Typography, body font 100%/16px
:: 	font rem for root level em of body
::  font px as a fall back for old browsers
::	em for fluid margin, padding & line-height
-------------------------------------------------------------------- */

/**
html5doctor.com Reset Stylesheet v1.6.1
http://html5doctor.com/html-5-reset-stylesheet/
Richard Clark
http://richclarkdesign.com
http://cssreset.com
**/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, a,
blockquote, pre, abbr, address, cite,
code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, 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, main, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	background: transparent;
}

article, aside, details, figcaption,
figure, footer, header, main, menu, nav, section {
	display: block;
}

img {
	display: inline-block;
}

body {
	line-height: 1;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

input, select {
	vertical-align: middle;
}

/* -----------------------------------------------
:: 	Fonts
----------------------------------------------- */
@font-face {
    font-family: 'RobotoBlack';
    src: url('../fonts/roboto/Roboto-Black-webfont.eot');
    src: url('../fonts/roboto/Roboto-Black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-Black-webfont.woff') format('woff'),
         url('../fonts/roboto/Roboto-Black-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
   		font-family: 'RobotoBlack';
        src: url('../fonts/roboto/Roboto-Black-webfont.svg#roboto_black') format('svg');
	}
}

@font-face {
    font-family: 'RobotoBold';
    src: url('../fonts/roboto/Roboto-Bold-webfont.eot');
    src: url('../fonts/roboto/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-Bold-webfont.woff') format('woff'),
         url('../fonts/roboto/Roboto-Bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
   		font-family: 'RobotoBold';
        src: url('../fonts/roboto/Roboto-Bold-webfont.svg#roboto_bold') format('svg');
	}
}

@font-face {
    font-family: 'RobotoItalic';
    src: url('../fonts/roboto/Roboto-Italic-webfont.eot');
    src: url('../fonts/roboto/Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-Italic-webfont.woff') format('woff'),
         url('../fonts/roboto/Roboto-Italic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
   		font-family: 'RobotoItalic';
        src: url('../fonts/roboto/Roboto-Italic-webfont.svg#roboto_italic') format('svg');
	}
}

@font-face {
    font-family: 'RobotoLightItalic';
    src: url('../fonts/roboto/Roboto-Lightitalic-webfont.eot');
    src: url('../fonts/roboto/Roboto-Lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-Lightitalic-webfont.woff') format('woff'),
         url('../fonts/roboto/Roboto-Lightitalic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
   		font-family: 'RobotoLightItalic';
        src: url('../fonts/roboto/Roboto-Lightitalic-webfont.svg#roboto_lightitalic') format('svg');
	}
}

@font-face {
    font-family: 'RobotoLight';
    src: url('../fonts/roboto/Roboto-Light-webfont.eot');
    src: url('../fonts/roboto/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-Light-webfont.woff') format('woff'),
         url('../fonts/roboto/Roboto-Light-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
   		font-family: 'RobotoLight';
        src: url('../fonts/roboto/Roboto-Light-webfont.svg#roboto_light') format('svg');
	}
}

@font-face {
    font-family: 'RobotoMedium';
    src: url('../fonts/roboto/Roboto-Medium-webfont.eot');
    src: url('../fonts/roboto/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-Medium-webfont.woff') format('woff'),
         url('../fonts/roboto/Roboto-Medium-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
   		font-family: 'RobotoMedium';
        src: url('../fonts/roboto/Roboto-Medium-webfont.svg#roboto_medium') format('svg');
	}
}
@font-face {
    font-family: 'RobotoRegular';
    src: url('../fonts/roboto/Roboto-Regular-webfont.eot');
    src: url('../fonts/roboto/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto/Roboto-Regular-webfont.woff') format('woff'),
         url('../fonts/roboto/Roboto-Regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
   		font-family: 'RobotoRegular';
        src: url('../fonts/roboto/Roboto-Regular-webfont.svg#roboto_regular') format('svg');
	}
}

/* -----------------------------------------------
:: 	Root
----------------------------------------------- */
:lang(en) {
    quotes:"\201C" "\201D" "\2018" "\2019";
}

html {
	/*
	By default, iOS enlarges the text size so it reads more comfortably. Disable the adjustment
	*/
	-webkit-text-size-adjust: none;
	/*
	keep long text and urls wrapped in content
	*/
	word-wrap: break-word;
}

/* -----------------------------------------------
:: 	Sections
----------------------------------------------- */
body {
	/*
	font-size 100% 		(16px)
	line-height 1.625em (26px)
	*/
	font: 100%/1.5 'RobotoRegular', Arial, sans-serif;
	color: #000;
	overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 { line-height: 1.15em; }
h2, h3, h4, h5, h6 { line-height: 1.25em; }

h1, h2 {
	font-family: 'RobotoLight', Arial, sans-serif;
	color: #0e2d6d;
}

h3, h4, h5, h6 {
	font-family: 'RobotoRegular', Arial, sans-serif;
	color: #0e2d6d;
}

h3 {
	font-size: 24px;
	font-size: 1.5rem;
	color: #da1935;
}

h4 {
	font-size: 16px;
	font-size: 1rem;
	color: #0e2d6d;
}

h1 {
	margin-bottom: 0.75em;
}

h2, h3, h4, h5, h6 {
	margin-bottom: 0.75em;
    padding-top: 0.75em
}

h2.first,
h3.first,
h4.first,
h5.first,
h6.first {
	padding-top: 0;
}

h1,
h2 {
	font-size: 40px;
	font-size: 2.5rem;
}

h3, h4 {

}

h5, h6 {
	font-size: 20px;
	font-size: 1.25rem;
}

/* -----------------------------------------------
:: 	Grouping Content
----------------------------------------------- */
p, ul, ol {
	margin-bottom: 1.25em;
}

ul {
	list-style-type: none;
	list-style-position: outside;
}

ol {
	list-style-position: outside;
}

li {
	margin-bottom: 0.25em;
}

blockquote {
	position: relative;
	margin: 0 0 1.5em 0;
	padding: 1.5em;
	font-size: 12px;
	font-size: 0.75rem;
	font-style: italic;
	background-color: #e1e7f4;
}

blockquote, blockquote p {
	font-family: 'RobotoItalic', Arial, sans-serif;
}

/*blockquote:before,
blockquote:after {
	display: block;
	position:absolute;
	font-size:52px;
    font-size:3.25rem;
	font-style:normal;
	color: #999;
}

blockquote:before {
	top:-5px;
	left:10px;
	content: "\201C";
}

blockquote:after {
	right:10px;
	top:55%;
	content: "\201D";
}*/

blockquote footer {
	margin-top: 2.5em;
	font-size: 14px;
    font-size: 0.875rem;
    line-height: 1.125em;
}

figure {
	margin-bottom: 0.75em;
}


/* -----------------------------------------------
:: 	Text-level Semantics
----------------------------------------------- */
q::before {
	content: open-quote;
}

q::after {
	content: close-quote;
}

a {
	-webkit-transition-duration: 0.1s;
       -moz-transition-duration: 0.1s;
         -o-transition-duration: 0.1s;
        -ms-transition-duration: 0.1s;
            transition-duration: 0.1s;
}

a:hover,
a:focus {
	text-decoration: none;
}

small {
	font-size: 10px;
    font-size: 0.625rem;
}

em {
	font-family: 'RobotoItalic', Arial, sans-serif;
}

b, strong {
	font-family: 'RobotoBold', Arial, sans-serif;
	color: #3c3c3c;
}

time {
	font-size: 12px;
	font-size: 0.75rem;
}

sub {
    font-size: smaller;
    line-height: 90%;
    vertical-align: sub;
}

sup {
    font-size: smaller;
    line-height: 90%;
    vertical-align: super;
}


/* -----------------------------------------------
:: 	Embedded Content
----------------------------------------------- */
img {
	/*
	Flexible Images
	max-width:100% and height:auto make images responsive and flexible
	max-width:100% and height:auto works in IE7, but not in IE8
	fixing IE8 bug with width:auto/9
	*/
	max-width: 100%;
    height: auto;
    width: auto/9;
	-ms-interpolation-mode: bicubic;
}

.img {
	/*
	Flexible background images
	*/
	background-size: 100% auto;
 	-moz-background-size: 100% auto;
 	background-position: 50% 0;
	/*
	IE needs background:center;
	*/
}

video,
embed,
object,
iframe {
	/*
	Flexible Embedded Videos
	max-width:100% doesn't work i=on the embed element in Safari
	width:100% is a successful workaround
	*/
	width: 100%;
}


/* -----------------------------------------------
:: 	Tabular data
----------------------------------------------- */
table {
	width: 100%;
	margin: 0 0 1.5em 0;
  border-collapse: collapse;
  border-spacing: 0;
	border-top: 1px solid #eaeaea;
	/*border-right:1px solid #eaeaea;
	border-left:1px solid #eaeaea;*/
}

th {
	font-weight: normal;
	font-family: 'RobotoSemiBold', Arial, sans-serif;
	color: #222;
}

th,
td {
	display: table-cell;
	padding: 0.75em 0.5em 0.5em 0.5em;
	line-height: 1.25em;
	border-bottom: 1px solid #eaeaea;
	vertical-align: middle;
}

th {
	background: #eaeaea;
}

td {
	font-size: 14px;
	font-size: 0.875rem;
	background: white;
}

td input,
td select,
td textarea {
	font-size: 14px;
	font-size: 0.875rem;
}

/* -----------------------------------------------
:: 	Forms & Buttons
----------------------------------------------- */
:focus {
	outline: 0;
}

input, select, textarea {
	/*
	from elements, namely textarea do not
	inherit font styles, hence the repeat
	family and size declaration
	*/
	font-family: 'RobotoRegular', Arial, sans-serif;
	font-size: 16px;
	font-size: 1rem;
	color: #4a4a4a;
	overflow: hidden;
}

input[type=text]:focus,
input[type=email]:focus,
textarea:focus {
	border: 1px solid #0e2d6d;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
select,
textarea {
	width: 100%;
	padding: 0.85em 1em 0.85em 1em;
	border: 1px solid #ccc;
}

.button {
	margin-top: 1em;
}

.button,
input[type="submit"],
input[type="button"],
button,
button[type="submit"] {
	display: inline-block;
	width: auto;
	padding: 0.6em 2em 0.5em 2em;
	color: #fff;
	text-align: center;
	text-decoration: none;
	text-transform: normal;
	font-size: 16px;
	font-size: 1rem;
	border: none;
	background-color: #3772bd;
	cursor: pointer;
	outline: none;
	/*
	override ios buttons
	*/
	-webkit-transition-duration: 0.4s;
	   -moz-transition-duration: 0.4s;
         -o-transition-duration: 0.4s;
        -ms-transition-duration: 0.4s;
            transition-duration: 0.4s;
       -webkit-appearance: none;
}

.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button:hover,
button[type="submit"]:hover {
	background-color: #2e5d99;
}