@import '/s/css/common.css';

@import '/s/css/fontdefs.css';


/* reset */
html,body,div,span,p {margin: 0; padding: 0; border: 0; outline: 0; 
   vertical-align: baseline; background: transparent; }
h2{font-size: 20px;}
h3{margin-top: 15px;}


@import '/s/css/asciidoc.css';


/* === COLORS === */
h1,h2,h3,h4,h5,h6 {
	color: #A4A4A4;
}
header::before, footer {
    background-color: #ff6900;
}
footer #footbar,
footer #footbar * {
	color:white;
}

a {
	color: #2e61b3;
	text-decoration: none;
	font-weight: bolder;
}

/* === FONTS === */
html {
	font-family: "Open Sans", sans-serif;";
	-webkit-text-size-adjust: 100%; 
	-ms-text-size-adjust: 100%; 
}
h1 {
	letter-spacing: 0.4em;
	font-weight: 600;
	font-size: 44px;
}
h2 {
	letter-spacing: 0.2em;
}
h3 {
	letter-spacing: 0.1em;
}
.title {
	font-weight: bold;
}

/* === STRUCTURE === */
h1 {
	margin-bottom: 1em;
}
.sidebarblock {
	margin-top: 1em;
	margin-bottom: 1em;
	border: 1px solid #ff6900;
	padding: 1em;
}
/* === RESPONSIVE STRUCTURE === */
main,h1,footer {
  max-width: 900px; 
  margin-right: auto; 
  margin-left:  auto; 
}
header::before {
    display: block;
	height: 100px;
    width: 100%;
    content: "";
}
@media only screen and (max-width: calc(900px + 2em)) {
    main,h1 {
        width: initial;
        margin: 0;
        padding: 0 9px;
    }
	h1 {
		font-size: 33px;
	}
	header::before {
		height: 60px;
	}
}

footer {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 1;
}
footer #footbar {
	margin-right: 1em;
	float: right;
	margin-top: 6px;
	margin-bottom: 5px;
}
.hero {
	margin-top: 2em;
}

/*
main {
  padding-right: 10px; 
  padding-left:  10px; 
  padding-bottom: 4px;
  padding-top: 20px;
}
#content > h1:first-child:not([class]), 
h1, 
#header > h1:first-child {
	font-weight: bold;
	color: #A4A4A4;
}
h3 a.link,
h4 a.link {
	color: #2e61b3;
	font-weight: bolder;
}
h4 {margin-left: -26px}
h3 {margin-left: -34px}
#footer {
	max-width: 60%;
}
*/
