@font-face { font-family: "Ostrich"; src: url("../fonts/ostrich-bold.ttf"); } @font-face { font-family: "Belgika"; src: url("../fonts/Belgika-8th.otf"); font-weight: normal; font-style: normal; } /* -------------------------------------------- VARIABLES ----------------------------------------- */ @font-size: 15px; @line-height: 19.5px; /* -------------------------------------------- FLOW ----------------------------------------- */ .main { -webkit-flow-from: TextFlow; flow-from: TextFlow; } #flow-text { -webkit-flow-into: TextFlow; flow-into: TextFlow; } /* -------------------------------------------- GENERIC CLASSES ----------------------------------------- */ html, body { width: @page-width - (@page-margin-inside + @page-margin-outside); } body{ font-family: serif; font-size: @font-size; line-height: @line-height; } #main { width: @page-width - (@page-margin-inside + @page-margin-outside); } h1, h2 { //margin-top: @line-height * 3; //-webkit-region-break-before: always; } p { margin: 0px; } p + p { text-indent: @line-height * 2; } a { text-decoration: none; color: inherit; } em { font-style: italic; } .column100 { top: (@page-height/9)*1; width: (@page-width/9)*6; height: 70%; box-sizing: border-box; } div.column50 { top: (@page-height/9)*1; height: 70%; width: 42%; float: left; padding: 0 2%; } /* -------------------------------------------- HEADER ----------------------------------------- */ /* -------------------------------------------- IMAGES ----------------------------------------- */