$brandTwitter = #1DA1F2
$brandFacebook = #133783
$brandVK = #5E81A8
$brandMicrosoft = #006CC2
$brandGoogle = #DB4437
$brandGithub = #24292E

// golden ratio
$PHI = 1.618


$ONE = (100vw / (1+$PHI))
$topicPanelWidth = $ONE * $PHI


$topicsPanelWidth = ($ONE / ($PHI))
$categoriesPanelWidth = $ONE / (1+$PHI)

$fastAnimationDuration = 100ms
$slowAnimationDuration = 300ms

$screen-xs ?= 480px
$screen-sm ?= 768px
$screen-md ?= 992px
$screen-lg ?= 1200px

$screen-xs-min ?= $screen-xs
$screen-sm-min ?= $screen-sm
$screen-md-min ?= $screen-md
$screen-lg-min ?= $screen-lg

$screen-xs-max ?=            ($screen-sm-min - 1)
$screen-sm-max ?=            ($screen-md-min - 1)
$screen-md-max ?= ($screen-lg-min - 1)

$blueDark = #303E4D
$blueRegular = #578FCC
$blueLight = #81A5D4
$orange = #EBA36F
$greenLight = #97A346
$greenDark = #808942
$greenBright = #65c178


$lightGrey = #D5D8DE
$normalGrey = #BCC9CE
$darkGrey = #8E949F
$lightColor = #F7FAFC

$red = #B2150A

$categoriesTopColor = rgb(36, 50, 64)
// $categoriesTopColor = rgb(36, 50, 64)
$categoriesTopColor = darken($blueDark, 3)
$categoriesBottomColor = rgb(49, 68, 87)
$categoriesBottomColor = lighten($blueDark, 1)