SASS Variables
==============

Gallery
--------

Filename: _gallery.scss, _gallery.light.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $galleryBackground
     - Color
     - #111
     - Gallery background color
   * - $galleryBorder
     - Border specs
     - 1px solid #333
     - Default gallery border
   * - $galleryMinHeight
     - Number
     - 650px
     - Gallery minimum height
   * - $galleryMaxWidth
     - Number
     - 984px
     - Gallery maximum width

Media Viewer
-----------

Filename: _mediaviewer.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $mvBarBackground
     - Color
     - #191919
     - The thumbnail bar background color
   * - $mvBarPadding
     - Number
     - 6px
     - The thumbnail bar padding
   * - $mvDesBackground
     - Color
     - #191919
     - The description bar background color
   * - $mvDesTextColor
     - Color
     - #ddd
     - The description text color
   * - $mvDesFontSize
     - Number
     - 16px
     - The description font size
   * - $mvDialogBackground
     - Color
     - #333
     - Modal dialog background color
   * - $mvThumbnailFontSize
     - Number
     - 16px
     - Thumbnail font size
   * - $mvThumbnailBackground
     - Color
     - #333
     - Thumbnail background color
   * - $mvThumbnailColor
     - Color
     - #ccc
     - Thumbnail text color
   * - $mvThumbnailBackgroundHover
     - Color
     - #ccc
     - Background hover color
   * - $mvThumbnailColorHover
     - Color
     - #111
     - Text hover color
   * - $mvThumbnailBorder
     - Border specs
     - 1px solid #111
     - Thumbnail border style
   * - $mvThumbnailBorderHover
     - Border specs
     - 2px solid #eee
     - Thumbnail hover border style


Audio Player
------------

Filename: _audioplayer.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $ppBtnColor
     - Color
     - white
     - Play and pause button color
   * - $ppBtnBackground
     - Color
     - #555
     - Play and pause button background color
   * - $ppBtnBorder
     - Border specs
     - 1px solid black
     - Play and pause button border style
   * - $apBarBackground
     - Color
     - #111
     - Progress bar background color
   * - $apBarInnerBackground
     - Color
     - #efefef
     - Inner progress bar background color
   * - $apTitleFontSize
     - Number
     - 16px
     - Title font size
   * - $apTitleColor
     - Color
     - #aaa
     - Title text color
   * - $visBg
     - Color
     - #3333
     - Visual background color

Button Navigator
----------------

Filename: _buttonnav.scss, _buttonnav.light.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $buttonNavColor
     - Color
     - #eee
     - ButtonNavigator color
   * - $buttonNavBgColor
     - Color
     - black
     - ButtonNavigator background color
   * - $buttonNavSize
     - Number
     - 40px
     - ButtonNavigator size in pixels
   * - $buttonNavDistance
     - Number
     - 20px
     - Distance from the buttons to left and right edge

Category Menu
-------------

Filename: _categorymenu.scss, _categorymenu.light.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $topLabelBgColor
     - Color
     - #f52c65 
     - Top label background color
   * - $topLabelColor
     - Color
     - #fff
     - Top label text color
   * - $topLabelBorderRadius
     - Number
     - 4px
     - Top label border radius
   * - $categoryMenuBackgroundColor
     - Color
     - rgba(25, 25, 25, 0.85)
     - Category menu background color
   * - $categoryMenuFontFamily
     - String
     - 'Roboto'
     - The font-family for category menu
   * - $categoryMenuBackgroundColor
     - Color
     - rgba(25, 25, 25, 0.85)
     - Background color for category menu

Components
----------

Filename: _components.scss, _components.light.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $componentContainerBottom
     - Number
     - 0%
     - Distance from component group to container bottom edge

Zoom Button
------------

Filename: _zoombtn.scss, _zoombtn.light.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $zoombtnColor
     - Color
     - #ddd
     - Foregrount color of zoom button
   * - $zoombtnBgColor
     - Color
     - #111
     - Background color of zoom button
   * - $zoombtnSize
     - Number
     - 42px
     - Zoom Button size

Fullscreen Button
-----------------

Filename: _fsbtn.scss, _fsbtn.light.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $fsbtnColor
     - Color
     - #eee
     - Fullscreen Button text color
   * - $fsbtnBgColor
     - Color
     - black
     - Fullscreen Button background color
   * - $fsbtnSize
     - Number
     - 18px
     - Fullscreen Button size
   * - $fsbtnBottom
     - Number
     - 20px
     - Distance to container bottom edge
   * - $fsbtnRight
     - Number
     - 15px
     - Distance to container right edge


Sidebar Controls
----------------

Filename: _sbcontrols.scss, _sbcontrols.light.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $sbcTop
     - Number
     - 16px
     - Distance to container top edge
   * - $sbcRight
     - Number
     - 10px
     - Distance to container right edge

Text Display
-------------

Filename: _textdisplay.scss, _textdisplay.light.scss

.. list-table:: 
   :widths: 30 22 25 50
   :header-rows: 1

   * - Name
     - Type
     - Default
     - Description
   * - $textFont
     - String
     - 'Open Sans'
     - Base text font for title and description components
   * - $desColor
     - Color
     - #999
     - Description text color
   * - $desPadding
     - Padding specc
     - 8px 2px
     - Padding around description component
   * - $desHeight
     - Number
     - 90px
     - Description height
   * - $desBackground
     - Color
     - rgba(0, 0, 0, 0.0)
     - Description background color
   * - $desFontFamily
     - String
     - 'Open Sans'
     - Description font family
   * - $desFontSize
     - Number
     - 14px
     - Description front size
   * - $titleColor
     - Number
     - #fff
     - Title text color
   * - $titleFontSize
     - Number
     - 18px
     - Title font size
   * - $titleFontFamily
     - String
     - 'Open Sans'
     - Title font family
   * - $titleTextTransform
     - String
     - uppercase
     - Text transform for title

Preloader
----------

Filename: _ringpreloader.scss 

cf3d
----

Fiilename: cf3d.dark.scss, cf3d.light.scss

Responsive
----------

Filename: _responsive.scss