/* —————————– */ /* ==Base (basic styles) */ /* —————————– */

/* switching to border-box model for all elements */ html {

box-sizing: border-box;

}

}

html {

/* set base font-size to equiv "10px", which is adapted to rem unit */
font-size: 62.5%;
/* IE9-IE11 math fixing. See http://bit.ly/1g4X0bX */
/* thanks to @guardian, @victorbritopro and @eQRoeil */
font-size: calc(1em * 0.625);

}

body {

font-size: $base-font-size;
background-color: $base-background;
color: $base-color;
font-family: $font-stack-common;
line-height: $line-height;

}

a {

color: $base-color-link;
&:hover, &:focus, &:active {
  color: $base-color-link-hover;
}

}

ul, ol {

padding-left: 2em;

}

img {

vertical-align: middle;

}

blockquote, figure {

margin-left: 0;
margin-right: 0;

}

/* font-sizing for content */ p, .#{$kna-namespace}p-like, ul, ol, dl, blockquote, pre, td, th, label, textarea, caption, details, figure {

margin-top: 0.75em;
margin-bottom: 0;
line-height: $line-height;

}

h1, .#{$kna-namespace}h1-like {

font-size: $h1-size;
font-family: $font-stack-headings;

}

h2, .#{$kna-namespace}h2-like {

font-size: $h2-size;
font-family: $font-stack-headings;

}

h3, .#{$kna-namespace}h3-like {

font-size: $h3-size;

}

h4, .#{$kna-namespace}h4-like {

font-size: $h4-size;

}

h5, .#{$kna-namespace}h5-like {

font-size: $h5-size;

}

h6, .#{$kna-namespace}h6-like {

font-size: $h6-size;

}

/* alternate font-sizing */ .#{$kna-namespace}smaller {

font-size: 0.6em;

}

.#{$kna-namespace}small {

font-size: 0.8em;

}

.#{$kna-namespace}big {

font-size: 1.2em;

}

.#{$kna-namespace}bigger {

font-size: 1.5em;

}

.#{$kna-namespace}biggest {

font-size: 2em;

}

code, pre, samp, kbd {

/* IE fix */
white-space: pre-line;
white-space: pre-wrap;
font-family: $font-stack-monospace;
line-height: normal;

}

em, .#{$kna-namespace}italic, address, cite, i, var {

font-style: italic;

}

/* avoid top margins on first content element */ p, .#{$kna-namespace}p-like, ul, ol, dl, blockquote, pre, h1, .#{$kna-namespace}h1-like, h2, .#{$kna-namespace}h2-like, h3, .#{$kna-namespace}h3-like, h4, .#{$kna-namespace}h4-like, h5, .#{$kna-namespace}h5-like, h6, .#{$kna-namespace}h6-like {

&:first-child {
  margin-top: 0;
}

}

/* avoid margins on nested elements */ li p, li .#{$kna-namespace}p-like, li ul, li ol {

margin-top: 0;
margin-bottom: 0;

}

/* max values */ img, table, td, blockquote, code, pre, textarea, input, video, svg {

max-width: 100%;

}

img {

height: auto;

}