// Colors
@import 'colors.styl'
// Fonts
lightFont = Arial, sans-serif
regularFont = Arial, sans-serif
boldFont = Arial, sans-serif
mainFont = Arial, sans-serif
// Size
mainFontSize = 18px
mainLineHeight = 1.4
desktopWidth = 1280px
smDesktopWidth = 980px
tableWidth = 768px
phoneWidth = 480px
smPhoneWidth = 320px
// Animation
mainTransition = all .25s cubic-bezier(.02,.01,.47,1)
// Alert
alert-padding = .4em .6em
alert-margin-bottom = 1em
alert-border-radius = .4em
alert-opacity = .7
// Card
card-border-radius = rem(6)
card-padding = rem(30)
card-background-color = #fff
// Form Elements
form-el-width = 100%
form-el-height = rem(40)
form-el-padding = rem(10) rem(14)
form-el-border-radius = rem(4)
// Label
label-padding = rem(6) rem(18)
label-color = #fff
// Message
message-border-radius = rem(8)
message-padding = rem(10) rem(14)
// Message BOX
messageBox-wrapper-background-color = rgba(39, 39, 39, 0.48)
messageBox-background-color = #fff
messageBox-border-radius = rem(8)
messageBox-title-font-size = rem(24)
// Table
table-background-color = #fff
table-line-height = 1.5em
table-td-padding = 14px
// Sidebar
sidebar-height = 96vh
sidebar-width = 240px
sidebar-content-padding = 40px 0
sidebar-content-padding--mobile = 20px 30px
sidebar-list-margin = rem(20) auto
sidebar-item-font-size = rem(18)
sidebar-item-line-height = 2.1
// Navbar
navbar-background-color = #fff
navbar-height = 80px
navbar-item-color = #333
navbar-item-hover-color = #000
navbar-item-hover-background-color = transparent
navbar-fixed-z = 2
// Grid
grid-row-margin = rem(-10)
grid-col-padding = rem(10)