/**********************************************/
/*
This file contains all the classes that are 
responsible for the background- and font-colors 
of PS21.
Author: Will Stefan;
*********************************************/
/******************************************
/***            IN GENERAL              ***
*******************************************
- REPLACE COLOR SCHEME OF THEME
To do so just search for the colors this top
comment section and replace them with the color
you want. For instance you want to change the 
general primary color of the theme then go to
/search for the class "ps_color_one"-value: rgb(178, 5, 51)
and replace it with whatever color you want

- OPACITIES:
For hovering-effect, slight backgroundcolors
for instance in the side navigation)
are done in the app.css
******************************************/
/********************************************
***             Table colors:            ***
********************************************
border:                 @ps_color_one;
odd background-color:   @ps_lightercolor_two;
********************************************


********************************************
***             Division line            ***
********************************************
border-top: 3px solid @ps_darkcolor_two;
*******************************************/
/* red */
/* darkest grey */
/* middle grey */
/* lightest grey */
/* darkgreen in (header)*/
.site_content_bg {
  background-color: #ffffff;
}
.color_font {
  color: #ffffff;
}

.font_dark {
  color: #000000;
  font-weight: 700;
}

/*Body and footer color*/
.ps_darkgreen {
  background-color: #112d29;
}
.ps_lightercolor_two_bg {
  background-color: #e5e5e5;
}
.ps_lightercolor_two_font {
  color: #e5e5e5;
}
.ps_lightercolor_two_border {
  border: 2px solid #e5e5e5;
}
/*Left navigation*/
.ps_lightcolor_two_bg {
  background-color: #b3b3b4;
}
.ps_lightcolor_two_font {
  color: #b3b3b4;
}
.ps_lightcolor_two_border {
  border: 2px solid #b3b3b4;
}
/*
- User-icon header
- logo font PS
- start.html: THIRD menu item
*/
.ps_darkcolor_two_bg {
  background-color: #606164;
}
.ps_darkcolor_two_font {
  color: #606164;
}
.ps_darkcolor_two_border {
  border: 2px solid #606164;
}
/*
- Button hover
- Link hover
- Navigation left: button
- start.html: FIRST menu item
*/
.ps_darkcolor_one_bg {
  background-color: #861129;
}
.ps_darkcolor_one_font {
  color: #861129;
}
.ps_darkcolor_one_border {
  border-color: #861129;
}
a:hover {
  color: #861129;
}
.nav_left .btn-default,
.nav_left .btn {
  color: #ffffff;
  background-color: #b31737;
}
.btn:hover {
  color: #ffffff;
  background-color: #861129;
  border-color: #861129;
}
/*
- Button in content
- Link default
- Sub-Headlines content
- start.html: SECOND menu item
*/
.ps_color_one_bg {
  background-color: #b31737;
}
.ps_color_one_font {
  color: #b31737;
}
.ps_color_one_border {
  border-color: #b31737;
}
a {
  color: #b31737;
}
.btn-default,
.btn {
  color: #ffffff;
  background-color: #b31737;
  border-color: #b31737;
}
/*
- Table colors Bootstrap overwrite
*/
.table-bordered {
  border: 1px solid white;
}
.table-striped > tbody > tr,
.table-striped > tbody > tr:nth-child(odd) {
  background-color: #e5e5e5;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 5px solid white;
}
/*
- Division line
*/
hr {
  border-top: 3px solid #606164;
}
/*
- Hover and active colors
- Main-Headline Content
*/
.nav_left .btn:hover {
  color: #ffffff;
  background-color: #861129;
}
.login img:hover {
  background-color: #b31737;
}
/*END HOVER opacities*/
.active {
  background-color: #617a74;
}
.nav_left {
  border-left: 20px solid #606164;
}
.nav:hover {
  background-color: #617a74;
}
.nav_left:hover,
.active_left {
  background-color: #617a74;
  border-left: 20px solid #b31737;
}
.mask p {
  color: white;
}
.mask a {
  color: #861129;
}
.mask a h2:hover {
  /*color: rgba(@ps_color_one_opacity, 0.6);*/

  color: #617a74;
}
