1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
  
24
  
25
  
26
  
27
  
28
  
29
  
30
  
31
  
32
  
33
  
34
  
35
  
36
  
37
  
38
  
39
  
40
  
41
  
42
  
43
  
44
  
45
  
46
  
47
  
48
  
49
  
50
  
51
  
52
  
53
  
54
  
55
  
56
  
57
  
58
  
59
  
60
  
61
  
62
  
63
  
64
  
65
  
66
  
67
  
68
  
69
  
70
  
71
  
72
  
73
  
74
  
75
  
76
  
77
  
78
  
79
  
80
  
81
  
82
  
83
  
84
  
85
  
86
  
87
  
88
  
89
  
90
  
91
  
92
  
93
  
94
  
95
  
 
$breakpoints: ( 
  small:  414px, 
  medium: 768px, 
  large:  980px 
); 
 
// Font stuff 
$font-family:    /* MalmoSans, */ arial, sans-serif; 
$line-height:    1.6; 
$root-font-size: 100%; 
 
$body-font-size: ( 
  null:   16px, 
  small:  16px, 
  medium: 16px, 
  large:  16px 
); 
 
$h1-font-size: ( 
  null:   (28px, 1.1), 
  medium: (26px, 1.1) 
); 
 
$txtsize: ( 
   xs: (12px, 1.1), 
    s: (13px, 1.3), 
   sm: (14px, 1.3), 
   md: (16px, 1.3), 
   lg: (20px, 1.2), 
   xl: (38px, 1.2), 
  xxl: (44px, 1.1) 
); 
 
// Widths and paddings 
$site-width:   100%; 
$spacing-unit: 15px; 
$site-padding: $spacing-unit; 
$gutter-width: $spacing-unit * 2; 
 
// Roxen colors 
$rxn-red:        #e94c37; 
$rxn-blue:       #1e8ac4; 
$rxn-black:      #1d1d1b; 
$rxn-grey:       #7f91a4; 
$rxn-light-grey: #c5d0da; 
$rxn-dark-red:   #b42339; 
 
 
// Basic colors 
$brand-color: $rxn-red; 
$black:       darken($rxn-black, 5%); 
$dark-grey:   lighten($black, 10%); 
$grey:        $rxn-grey; 
$light-grey:  $rxn-light-grey; 
$blue:        $rxn-blue; 
$white:       #fff; 
 
// Element colors 
$body-bg: lighten($black, 10%); 
$body-color: #aaa; 
$header-bg: $black; 
$topmenu-bg: lighten($black, 5%); 
$topmenu-color: $brand-color; 
$topmenu-selected-bg: $body-bg; 
$topmenu-selected-color: $light-grey; 
$main-column-bg: lighten($body-bg, 5%); 
$footer-bg: $header-bg; 
$footer-color: $grey; 
$site-message-color: $rxn-dark-red; 
$link-color:  $blue; 
$button-bg: $topmenu-bg; 
$button-color: $grey; 
 
 
$input-focus-color: $grey; 
 
 
$notify-bg-color:      $rxn-blue; 
$notify-warn-bg-color: #B4A612; 
$notify-error-bg-color: $rxn-dark-red; 
$notify-ok-bg-color:    #A8DAB8; 
$border-color:         #ddd; 
$dotted-border-color:  #ccc; 
$th-bg-color:          $brand-color; 
$th-color:             white; 
 
$ok-color: #79BC89; 
 
$diff-red-color: $rxn-red; 
$diff-green-color: $ok-color; 
 
// Other 
$border-radius: 2px;