/**********************************************/
/*
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;
*******************************************/
/*@ps_color_one:               #4184af;   */
/* red -> light blue */
/* middle grey */
/* lightest grey */
/* white */
/* darkgreen in (header)*/
/* darkest grey -> almost black */
/* h2 bgcolor, table heads */
/* darkgrey green -> grey light */
/* headlines - almost block */
/* @ps_lightcolor_one_table:    rgb(229, 229, 229); */
/* used in documents .dochead"*/
/* head-data BOX */
.head-data-box {
  background-color: #B3B3B4 !important;
  margin-right: -60px !important;
  padding-right: 60px;
}
.head-data-box-sm {
  background-color: #B3B3B4 !important;
  margin-right: -0px !important;
  padding-right: 0px;
}
.content_el_list {
  background-color: #FFFFFF !important;
  width: 100%;
  height: 100%;
}
.list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover {
  background-color: #006596;
  border-color: #006596;
}
.selectpicker.ps_white_table + .btn-group > .btn {
  background-color: #ffffff !important;
  color: #006596 !important;
}
.selectpicker.active + .btn-group > .btn {
  background-color: #606061 !important;
  color: #ffffff !important;
}
.selectpicker.ps_lightcolor_one_table + .btn-group > .btn {
  background-color: #FFFFFF;
}
.border-content {
  border: 2px solid #B3B3B4;
}
.border-2-solid-white {
  border: 2px solid white!important;
}
.border-2-solid {
  border: 2px solid #B3B3B4 !important;
}

.border-2-left {
	border-left: 2px solid #B3B3B4 !important;
}


.site_content_bg {
  background: #39739e;
  background-image: url("../img/bg-pattern.png");
  background-repeat: round;
}
.ps_white_table {
  background-color: white;
}
.ps_gray_table {
  background-color: #E5E5E5;
}

.ps_lightcolor_one_table {
  background-color: #FFFFFF;
}
.color_font {
  color: #ffffff;
}
.color_font_nolink {
  color: #000000;
}

.scrollover_link {
	color: #ffffff;
}

.scrollover_link:hover {
	color: #ffffff;
	font-weight: 700;
}

.strong {
	font-weight: 700;
}

.red {
	color: red;
}

.selected-row:hover {
	background-color: #B3B3B4 !important;
	font-weight: 700;
}

.ps-border {
  border: #606164 4px solid;
}
/*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 !important;
}
.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: #004363;
}
.ps_darkcolor_one_font {
  color: #004363;
}
.ps_darkcolor_one_border {
  border-color: #004363;
}
.nav_left .btn-default,
.nav_left .btn,
.nav .btn-default,
.nav .btn,
button.btn.btn-default.btn-lg.pull-right.active {
  color: #ffffff;
  background-color: #004363;
  border: none;
}
.btn-default,
.btn {
  color: #ffffff;
  background-color: #006596;
  border-color: #006596;
}
a {
  color: #006596;
}
a:hover {
  color: #606061;
  text-decoration: none;
}
a:focus,
a:visited {
  text-decoration: none;
}
.btn:hover,
.btn-default:hover {
  color: #004363 !important;
  text-decoration: none!important;
  color: #ffffff!important;
  background-color: #004363 !important;
  border-color: #004363 !important;
}
.btn-default.active,
.btn-default:active,
.open > .dropdown-toggle.btn-default,
.btn.focus,
.btn:focus,
.btn-default.focus,
.btn-default:focus {
  color: #ffffff!important;
  background-color: #006596 !important;
  border-color: #006596 !important;
}
/*
- Button in content
- Link default
- Sub-Headlines content
- start.html: SECOND menu item
*/
.ps_color_one_bg {
  background-color: #006596;
}
.ps_color_one_font {
  color: #006596 !important;
}
.ps_color_one_border {
  border-color: #006596;
}
/*
- 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: #004363;
}
/*END HOVER opacities*/
.active {
  background-color: #606061;
}

.wizard-help {
/* 	margin-top: 20px; */
/* 	margin-bottom: 10px; */
/* 	background-color: #fff; */
	background-color: #B3B3B4;
	/* color: #000000; */
/* 	color: #606061; dark-grey */
	/* color: #fff;	 white */
	/*  color: #000;	black */
/* 	font-weight: 700; */
	border: 2px solid #B3B3B4;
}

.editable {
	background-color: #FFFFFF;
}

.non_editable {
	background-color: #DDD;
}

.headline {
  background-color: #383839;
}
.nav:hover {
  background-color: #606061;
}
.nav_left:hover::before,
.active_left:before {
  content: "\A";
  border-style: solid;
  border-width: 10px 0 10px 15px;
  border-color: transparent transparent transparent #ffffff;
  position: absolute;
  left: 6px;
  top: 50%;
  bottom: 50%;
  margin-top: -10px;
}
.mask p {
  color: white;
}
.mask a {
  color: #004363;
}
.mask a h2:hover {
  /* color: rgba(@ps_color_one_opacity, 0.6); */
  color: #fff;
}
.popover {
  /* 1. time use, indirect, through ps21_filter_directive.js  */
  border-radius: 3px;
  max-width: 450px;
}
.popover select {
  width: 98%;
}
.popover .close-btn {
  float: right;
  padding: 4px 0px;
}
/****************   Sandwich slide menu   *******************/
button[ng-slide-menu] {
  padding: 0px 5px;
}
.dropdown-menu {
  background: rgba(96, 97, 100, 0.95);
  z-index: 2000;
}
.dropdown-menu hr {
  margin-top: 10px!important;
  margin-bottom: 10px!important;
  border-top: 1px solid #E5E5E5 !important;
}
.dropdown-menu > li > a {
  display: block;
  color: #E5E5E5;
  font-weight: normal;
}
.collapse-sub-sandwich {
  background: rgba(179, 179, 180, 0.6);
  font-size: 14px;
  /*  position: absolute; */
  /*  width: 100%; */
  /*  left: -100%; */
}
.collapse-sub-sandwich a,
.collapse-sub-sandwich label,
.collapse-sub-sandwich input,
.collapse-sub-sandwich span,
.collapse-sub-sandwich p {
  font-size: 14px;
  font-weight: 300;
}
.dropdown-menu > li > a:hover {
  background: rgba(96, 96, 97, 0.9) !important;
  text-decoration: none;
  color: #E5E5E5 !important;
}

input:read-only { 
    color: black !important;
    background-color: #E5E5E5;
    outline: none;
    border: none;    
}

.confirm {
	color: black;
}


.plus {
  color: white;
  font-size: 14px;
}
a[aria-expanded="true"] + a {
  color: #606061;
}
a[aria-expanded="true"] .plus {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transition: all 200ms ease-in-out;
  -webkit-transition: all 200ms ease-in-out;
  -ms-transition: all 200ms ease-in-out;
}
a[aria-expanded="true"] .chev_down {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transition: all 200ms ease-in-out;
  -webkit-transition: all 200ms ease-in-out;
  -ms-transition: all 200ms ease-in-out;
}
.collapse-sub-sandwich .btn {
  background: transparent;
  border: none;
}
.navbar-default {
  border: none;
  background: transparent;
}
.border-top {
  border-top: 2px solid #E5E5E5;
}
#header .ps_color_one_font {
  /*color: lighten(@ps_color_one, 10%)!important;*/
}
.dochead {
  color: #868686;
}
.nav-tabs > li.active > a {
  cursor: default;
  background-color: white;
  border: none;
  border-bottom-color: transparent;
}
.nav-tabs {
  border-bottom: 1px solid #ddd;
}
.nav-tabs li.active {
  margin-right: 2px;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
}
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
  color: white;
  border: 0px solid transparent;
  border-radius: 4px 4px 0 0;
  background-color: #606061;
}
.nav-tabs > li > a:hover {
  color: white;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
  background-color: #606061;
}
.nav-tabs li.active a {
  color: white;
  border: 0px solid transparent;
  border-radius: 4px 4px 0 0;
  background-color: #606061 !important;
}
ul.nav.nav-tabs:hover {
  background-color: transparent;
}
.tab-content h4 {
  margin-top: 0px;
  margin-bottom: 0px;
}
.form-control:focus {
  border-color: #66afe9;
}

textarea {
   resize: none;
   padding-left: 5px !important;
}


.row_odd {
	background-color: #fff;
}

.row_even {
	background-color: #B3B3B4;
}

.validation {
	padding-left: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 0px;
	color: #BB0606;
}


.info {
	margin-left: 0px;
	margin-right: 5px;
	color: #FDFF7A;
	padding-top: 2px;
	font-style: bold;
}

.warning {
	margin-left: 0px;
	margin-right: 5px;
	color: #BB0606;
}

.error {
	maring-left: 0px;
	margin-right: 5px;
	color: #BB0606;		
}

.fatal {
	margin-left: 0px;
	margin-right: 5px;
	color: #BB0606;
}

.vresize {
  resize: vertical; 
}

.margin-bottom-10 {
	margin-bottom: 10px;
}

.lead_text {
	background-color: white;
	color: #006596;
	font-weight: 700;
}

.vertical {
	border-right: thick solid #606061;
	margin-right: 10px;
	margin-left: 10px;
}

.no_hover, .no_hover:hover {
	color: #ffffff !important;
}

span.online_enterprise_logo {
	margin-top: 12px;
	display: inline-block;
	width: 150px;
	height: 22px;
	background-image: url("../img/ui_logo.png");
	background-size: 100% 100%
}
span.dav_logo {
	margin-top: 12px;
	display: inline-block;
	width: 150px;
	height: 22px;
	background-image: url("../img/privacysoft_dav.png");
}
.blacklist-caption-border {
    border: 1px solid #006596;
    border-bottom-width: 0px;
}
.pso-risk-container {
    border: 1px solid #006596;
    padding: 0px 15px;
    background-color: #FFFFFF;
}
.pso-pia-risk-container {
    background-color: #b3b3b4;
}