/**
 * BlankPlate | Yet another HTML5 Starter Kit
 *
 * BlankPlate Reset stylesheet
 *
 * Normally you don't have to make any changes in this file.
 * Your changes should be placed in styles.css file.
 *
 * @copyright	Copyright 2012, Dimitris Krestos
 * @license		Apache License, Version 2.0 (https://www.opensource.org/licenses/apache2.0.php)
 * @link		https://vdw.staytuned.gr/html5-starter-kit-blankplate/
 * @package		BlankPlate
 * @version		v1.2.3
 */

/**
 * GLOBAL
 * Reset margins and paadings for all
 * -------------------------------------------------------------------------------------------------
 */
* {
	margin: 0;
	outline: none;
	padding: 0
}

/**
 * COMMON
 * Based on Eric Meyer's reset (https://meyerweb.com/eric/tools/css/reset/index.html)
 * -------------------------------------------------------------------------------------------------
 */
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, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	background: transparent;
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	line-height: 100%;
	vertical-align: baseline
}

/**
 * HTML5 ELEMENTS
 * Handle the following as blocks
 * -------------------------------------------------------------------------------------------------
 */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block
}

/**
 * HEADINGS
 * Reset headings weight
 * -------------------------------------------------------------------------------------------------
 */
h1, h2, h3, h4, h5, h6 {
	font-weight: normal
}

/**
 * TABLES
 * Reset table borders
 * -------------------------------------------------------------------------------------------------
 */
table {
	border-collapse: collapse;
	border-spacing: 0
}

/**
 * LISTS
 * Reset list styles
 * -------------------------------------------------------------------------------------------------
 */
ol, ul {
	list-style: none outside none
}

/**
 * MORE RESET
 *
 * -------------------------------------------------------------------------------------------------
 */
hr {
	border: 0;
	border-top: 1px solid #CCC;
	display: block;
	height: 1px;
	margin: 1em 0
}

blockquote, q {
	quotes: none
}

/**
 * MORE FIXES
 *
 * -------------------------------------------------------------------------------------------------
 */
a {
	cursor: pointer
}

iframe, img {
	vertical-align: bottom
}

button, input[type="button"], input[type="reset"], input[type="submit"] {
	*overflow: visible;
	-webkit-appearance: button;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: "";
	content: none
}
/**
 * BlankPlate | Yet another HTML5 Starter Kit
 *
 * BlankPlate Basic Typography stylesheet
 *
 * Normally you don't have to make any changes in this file.
 * Your changes should be placed in styles.css file.
 *
 * @copyright	Copyright 2012, Dimitris Krestos
 * @license		Apache License, Version 2.0 (https://www.opensource.org/licenses/apache2.0.php)
 * @link		https://vdw.staytuned.gr/html5-starter-kit-blankplate/
 * @package		BlankPlate
 * @version		v1.2.3
 */

/**
 * FONTS
 * A font face implementation
 * -------------------------------------------------------------------------------------------------
 */
/*
@font-face {
	font-family: 'TheDummyFontID';
	src: url('fonts/dummyfont.eot'); /* IE6â€“8 */

	/* FF3.6+, IE9, Chrome6+, Saf5.1+ */
	/* Saf3â€”5, Chrome4+, FF3.5, Opera 10+ */
/*
	src: url('fonts/dummyfont.eot?#iefix') format('embedded-opentype'),
		 url('fonts/dummyfont.woff') format('woff'),
		 url('fonts/dummyfont.ttf') format('truetype'),
		 url('fonts/dummyfont.svg#TheDummyFontID') format('svg');
	font-weight: normal;
	font-style: normal;
}
*/
/**
 * DOCUMENT FONT
 * A basic declaration of document font and some font stacks
 * -------------------------------------------------------------------------------------------------
 */
BODY {
	color: #404040;
	font-family: Georgia, Palatino, "Palatino Linotype", Times, "Times New Roman", serif;

	/*
	Some basic font stacks from cssfontstack.com

	Sans Serif
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
	font-family: Helvetica, "Helvetica Neue", Arial, sans-serif;
	font-family: Tahoma, Verdana, Segoe, sans-serif;
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	font-family: Verdana, Geneva, sans-serif;

	Serif
	font-family: Georgia, Palatino, "Palatino Linotype", Times, "Times New Roman", serif;
	font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;

	Monospaced
	font-family: Consolas, monaco, monospace;
	font-family: "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
	font-family: "Lucida Sans Typewriter", "Lucida Console", Monaco, "Bitstream Vera Sans Mono", monospace;
	*/

	/* Ratio ~1.38 */
	font-size: 0.813em; 	/* ~13px */
	line-height: 1.385em; 	/* ~18px */
}

/**
 * LINKS
 *
 * -------------------------------------------------------------------------------------------------
 */
A {
	color: black;
	text-decoration: none
}

A:hover {
	text-decoration: underline
}

/**
 * HEADINGS
 *
 * -------------------------------------------------------------------------------------------------
 */
H1 {
	font-size: 2.308em; 	/* 30px */
	line-height: 1.500em; 	/* 44px */
}

H2 {
	font-size: 1.846em; 	/* 24px */
	line-height: 1.500em; 	/* 36px */
}

H3 {
	font-size: 1.538em; 	/* 20px */
	line-height: 1.500em; 	/* 27px */
}

H4 {
	font-size: 1.385em; 	/* 18px */
	line-height: 1.500em; 	/* 24px */
}

H5, H6 {
	font-size: 1.231em; 	/* 16px */
	line-height: 1.500em; 	/* 24px */
}

H1, H2, H3, H4, H5, H6 {
	color: #333
}

H1 A, H2 A, H3 A, H4 A, H5 A, H6 A {
	color: inherit;
	font-weight: inherit
}

/**
 * RULERS AND PARAGRAPHS
 *
 * -------------------------------------------------------------------------------------------------
 */
HR {
	background: #CCC;
	border-top-color: #CCC
}

P {
	line-height: 1.385em;
	margin-bottom: 1.077em;	/* ~ line-height * 0.75 */
}

P:empty { /* Hide empty paragraphs */
	display: none
}

/**
 * LISTS
 *
 * -------------------------------------------------------------------------------------------------
 */
UL, OL { /* Horizontal & vertical lists */
	margin: 1.077em 0 1.077em 1.538em; /*  14px 0 14px 20px */
}

UL LI, OL LI {
	line-height: 1.385em
}

UL.vertical { /* Vertical lists */
	margin: 0
}

UL.horizontal { /* Horizontal lists */
	display: inline;
	margin: 0
}

UL.horizontal > LI {
	display: inline-block;

	/* IE */
	*margin: 1px;
	zoom: 1;
	*display: inline;
}

/**
 * BLOCKQUOTES AND CODE BOXES
 *
 * -------------------------------------------------------------------------------------------------
 */
BLOCKQUOTE {
	border-left: 0.308em solid #EEE; /* 4px */
	color: #666;
	margin-bottom: 0.769em; /* 10px */
	margin-left: 1.538em; 	/* 20px */
	margin-top: 0.769em; 	/* 10px */
	padding-left: 0.769em; 	/* 10px */
}

PRE {
	color: #333;
	display: block;
	font-family: Courier, 'Courier New', monospace;
	margin: 0 0.154em; 			/* 0 2px */
	padding: 0.154em 0.308em; 	/* 2px 4px */
}

CODE {
	background-color: #F8F8F8;
	border: 1px solid #CCC;
	border-radius: 0.231em; 	/* 3px */
	color: #333;
	display: block;
	font-family: Courier, 'Courier New', monospace;
	margin: 0 0.154em; 			/* 0 2px */
	padding: 0.077em 0.308em; 	/* 2px 4px */
}

CODE.monokai { /* Based on Monokai scheme colors */
	background-color: #272822;
	color: #FB4383
}

/**
 * NESTING
 *
 * -------------------------------------------------------------------------------------------------
 */
P > CODE {
	display: inline-block
}

P B, LI B, P STRONG, LI STRONG {
	font-weight: bold
}

P I, LI I, P EM, LI EM {
	font-style: italic
}

ARTICLE.capitalise H2 + P:first-letter { /* Capitalise first letter of the paragraph */
	font-size: 2.769em; 	/* 36px */
	float: left;
	letter-spacing: 0.111em;/* 4px */
	margin-top: 0.167em; 	/* 6px */
}

ARTICLE UL {
	list-style: disc outside none;
	margin-left: 2.615em; 	/* 34px */
}

ARTICLE OL {
	list-style: decimal outside none;
	margin-left: 2.615em; 	/* 34px */
}

/**
 * PLACEHOLDERS
 *
 * -------------------------------------------------------------------------------------------------
 */
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
	color: #C0C0C0
}

input:-moz-placeholder, textarea:-moz-placeholder {
	color: #C0C0C0
}
/**
 * BlankPlate | Yet another HTML5 Starter Kit
 *
 * BlankPlate Main stylesheet
 *
 * @copyright	Copyright 2012, Dimitris Krestos
 * @license		Apache License, Version 2.0 (https://www.opensource.org/licenses/apache2.0.php)
 * @link		https://vdw.staytuned.gr/html5-starter-kit-blankplate/
 * @package		BlankPlate
 * @version		v1.2.3
 */

/**
 * WORLD
 *
 * -------------------------------------------------------------------------------------------------
 */
BODY {

	font-size: 13px; /* Override typography */
	font-family: "Open Sans", helvetica, arial, sans-serif;
}

#wrapper {
	/*margin: 0 auto;*/
	/*max-width: 960px;*/
	width: 100%;
}

H2 {
	font-weight: 300;
}

UL, LI {
	color: #c6c6c6;
	font-size: 15px;
	line-height: 24px !important;
}

LI A {
	color: inherit;
}

INPUT[type="text"] {
	background: #F1F1F1;
	border: 0;
	border-bottom: 1px solid #c6c6c6;
	margin-bottom: 10px;
	padding: 10px 0 10px 10px;
	width: 100%;
}

/* Clear fix */
.clear {
	clear: both;
	float: none;
	font-size: 1px;
	height: 0px;
	line-height: 0
}

/**
 * HEADER
 * Your header rules
 * -------------------------------------------------------------------------------------------------
 */
.top_bar {
	background: white;
	border-bottom: 1px solid #E5E5E5;
	color: #888;
	font-size: 16px;
	font-weight: 700;
	text-align: center;
	text-transform: uppercase;
	line-height: 80px;
	letter-spacing: 2px;
	width: 100%;
}

#header_wrapper {
	background: #3A3E3D;
	width: 100%;
}

HEADER {
	color: white;
	height: 400px;
	margin: 0 auto;
	max-width: 940px;
}

HEADER H1 {
	color: inherit;
	font-size: 48px;
	letter-spacing: 4px;
	line-height: 78px;
	padding-top: 120px;
	text-transform: uppercase;
}

HEADER H2 {
	color: inherit;
	font-size: 18px;
	letter-spacing: 5px;
	text-transform: uppercase;
}

/**
 * BODY
 * Your content rules
 * -------------------------------------------------------------------------------------------------
 */
#body_wrapper {
	background: white;
	width: 100%;
}

#body_wrapper H3 {
	background: white;
	border-bottom: 1px solid #E5E5E5;
	color: #888;
	font-size: 16px;
	text-align: center;
	text-transform: uppercase;
	line-height: 80px;
	letter-spacing: 2px;
	width: 100%;
}

SECTION#body {
	background: #f5a732;
}

SECTION#body H2 {
	color: white;
	font-size: 18px;
	font-weight: 300;
	letter-spacing: 1px;
	line-height: 34px;
}

SECTION {
	background: #F1F1F1;
	/*margin-top: 80px;*/
	width: 100%;
}

.stuck {
	position: fixed;
	top: 0;
}

ARTICLE {
	margin: 0 auto;
	padding: 30px 0 20px;
	max-width: 940px;
}

ARTICLE UL {
	list-style: none;
}

ARTICLE H2 {
	color: #E95855;
	margin-bottom: 10px;
}

ARTICLE LABEL {
	background: #F5A732;
	color: white;
	display: block;
	font-size: 16px;
	font-weight: 100;
	line-height: 20px;
	padding: 10px 0 10px 10px;
	width: 100%;
}

PRE {
	width: 400px;
}

/**
 * FOOTER
 *
 * -------------------------------------------------------------------------------------------------
 */
FOOTER {
	width: 100%
}

.footer_wrapper {
	color: #888;
	margin: 20px auto;
	width: 940px;
}

/**
 * SEARCH
 *
 * -------------------------------------------------------------------------------------------------
 */
.column {
	float: left;
	width: 50%;
}


.button {
	background: #f5a732;
	border-bottom: 4px solid #cd8722;
	color: #FFFFFF;
	display: block;
	float: left;
	font-size: 14px;
	letter-spacing: 2px;
	margin-top: 20px;
	margin-right: 26px;
	padding: 15px 20px;
	text-align: center;
	text-transform: uppercase;
	width: 150px;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}

.button:hover {
	background: #f4ac40;
	color: #FFF;
	text-decoration: none;
}

.link {
	color: white;
	display: block;
	float: left;
	font-size: 14px;
	font-weight: 300;
	letter-spacing: 1px;
	line-height: 48px;
	margin-top: 20px;
	text-decoration: none;
}

.link:hover {
	text-decoration: underline;
}

.anchorLink {
	border-bottom: 1px dashed white;
}

.anchorLink:hover {
	text-decoration: none;
}

.screenshot {
	position: absolute;
	clip: rect(0 0 0 0);
}

.selected {
	background: white;
	padding: 2px 8px;
}

.logo {
	margin-top: -6px;
	margin-right: 10px;
	vertical-align: middle;
}

/**
 * GitHub theme
 *
 * @author Craig Campbell
 * @version 1.0.4
 */
pre {
    border: 1px solid #ccc;
    word-wrap: break-word;
    padding: 6px 10px;
    line-height: 19px;
    margin-bottom: 20px;
}

code {
    border: 1px solid #eaeaea;
    margin: 0px 2px;
    padding: 0px 5px;
    font-size: 12px;
}

pre code {
    border: 0px;
    padding: 0px;
    margin: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}

pre, code {
    font-family: Consolas, 'Liberation Mono', Courier, monospace;
    color: #333;
    background: #f8f8f8;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

pre, pre code {
    font-size: 13px;
}

pre .comment {
    color: #998;
}

pre .support {
    color: #0086B3;
}

pre .tag, pre .tag-name {
    color: navy;
}

pre .keyword, pre .css-property, pre .vendor-prefix, pre .sass, pre .class, pre .id, pre .css-value, pre .entity.function, pre .storage.function {
    font-weight: bold;
}

pre .css-property, pre .css-value, pre .vendor-prefix, pre .support.namespace {
    color: #333;
}

pre .constant.numeric, pre .keyword.unit, pre .hex-color {
    font-weight: normal;
    color: #099;
}

pre .entity.class {
    color: #458;
}

pre .entity.id, pre .entity.function {
    color: #900;
}

pre .attribute, pre .variable {
    color: teal;
}

pre .string, pre .support.value  {
    font-weight: normal;
    color: #d14;
}

pre .regexp {
    color: #009926;
}