|  |  |  | @ -4,7 +4,10 @@ | 
		
	
		
			
				|  |  |  |  | @border-stack: 1px solid @ci-color; | 
		
	
		
			
				|  |  |  |  | @text-padding-v: .2rem; | 
		
	
		
			
				|  |  |  |  | @text-padding-h: 1rem; | 
		
	
		
			
				|  |  |  |  | @accent-border-width: 1rem; | 
		
	
		
			
				|  |  |  |  | @accent-border-width: .3rem; | 
		
	
		
			
				|  |  |  |  | @accent-border: @accent-border-width solid @ci-color; | 
		
	
		
			
				|  |  |  |  | @element-margin: .6rem; | 
		
	
		
			
				|  |  |  |  | @element-background: #F0F0F0; | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  | body { | 
		
	
		
			
				|  |  |  |  |     font-family: sans-serif; | 
		
	
	
		
			
				
					|  |  |  | @ -33,6 +36,13 @@ h2 { | 
		
	
		
			
				|  |  |  |  |     border: @border-stack; | 
		
	
		
			
				|  |  |  |  | } | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  | .accent-border-element { | 
		
	
		
			
				|  |  |  |  |     border-left: @accent-border; | 
		
	
		
			
				|  |  |  |  |     background-color: @element-background; | 
		
	
		
			
				|  |  |  |  |     margin: @element-margin; | 
		
	
		
			
				|  |  |  |  |     padding: 1rem; | 
		
	
		
			
				|  |  |  |  | } | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  | .grid { | 
		
	
		
			
				|  |  |  |  |     display: grid; | 
		
	
		
			
				|  |  |  |  |     grid-template-columns: 20% 70% 10%; | 
		
	
	
		
			
				
					|  |  |  | @ -43,14 +53,15 @@ h2 { | 
		
	
		
			
				|  |  |  |  |     margin: auto; | 
		
	
		
			
				|  |  |  |  |     min-width: 900px; | 
		
	
		
			
				|  |  |  |  |     width: 80%; | 
		
	
		
			
				|  |  |  |  |     border-top: ; | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |     nav { | 
		
	
		
			
				|  |  |  |  |         grid-area: nav; | 
		
	
		
			
				|  |  |  |  |         .accent-border-element; | 
		
	
		
			
				|  |  |  |  |     } | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |     main { | 
		
	
		
			
				|  |  |  |  |         grid-area: main; | 
		
	
		
			
				|  |  |  |  |         .accent-border-element; | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |         .schema-title__name { | 
		
	
		
			
				|  |  |  |  |             font-weight: normal; | 
		
	
	
		
			
				
					|  |  |  | @ -59,14 +70,15 @@ h2 { | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |     aside { | 
		
	
		
			
				|  |  |  |  |         grid-area: sidebar; | 
		
	
		
			
				|  |  |  |  |         .accent-border-element; | 
		
	
		
			
				|  |  |  |  |     } | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |     footer { | 
		
	
		
			
				|  |  |  |  |         grid-area: footer; | 
		
	
		
			
				|  |  |  |  |         .accent-border-element; | 
		
	
		
			
				|  |  |  |  |     } | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |     header, footer, main, nav, aside { | 
		
	
		
			
				|  |  |  |  |         border-bottom: @border-stack; | 
		
	
		
			
				|  |  |  |  |         padding: @text-padding-v @text-padding-h; | 
		
	
		
			
				|  |  |  |  |     } | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
	
		
			
				
					|  |  |  | @ -75,8 +87,7 @@ h2 { | 
		
	
		
			
				|  |  |  |  |         display: grid; | 
		
	
		
			
				|  |  |  |  |         grid-template-columns: 40% 60%; | 
		
	
		
			
				|  |  |  |  |         align-items: center; | 
		
	
		
			
				|  |  |  |  |         border-top: @border-stack; | 
		
	
		
			
				|  |  |  |  |         border-left: @accent-border-width solid @ci-color; | 
		
	
		
			
				|  |  |  |  |         .accent-border-element; | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |         .app-title { | 
		
	
		
			
				|  |  |  |  |             grid-column: 1; | 
		
	
	
		
			
				
					|  |  |  | @ -96,8 +107,16 @@ h2 { | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |         .header-content__link { | 
		
	
		
			
				|  |  |  |  |             display: inline-block; | 
		
	
		
			
				|  |  |  |  |             padding: @text-padding-v @text-padding-h / 2; | 
		
	
		
			
				|  |  |  |  |             padding: @text-padding-v * 2 @text-padding-h; | 
		
	
		
			
				|  |  |  |  |             margin-right: @accent-border-width; | 
		
	
		
			
				|  |  |  |  |             background-color: #E0E0E0; | 
		
	
		
			
				|  |  |  |  |             border: 0; | 
		
	
		
			
				|  |  |  |  |             border-bottom: .3rem solid @ci-color; | 
		
	
		
			
				|  |  |  |  |             cursor: pointer; | 
		
	
		
			
				|  |  |  |  | 
 | 
		
	
		
			
				|  |  |  |  |             &:hover { | 
		
	
		
			
				|  |  |  |  |                 background-color: darken(#E0E0E0, 3%); | 
		
	
		
			
				|  |  |  |  |             } | 
		
	
		
			
				|  |  |  |  |         } | 
		
	
		
			
				|  |  |  |  |     } | 
		
	
		
			
				|  |  |  |  | } | 
		
	
	
		
			
				
					|  |  |  | 
 |