/**
 * @link http://www.materialui.co/colors
 * @link http://fontawesome.io/icons/
 *
 * @todo zaviest SASS/LESS aby sa lahsie zaobalovali definicie. Alebo do komponentov vclenit css? 
 */

* {
  box-sizing: border-box;
}

body {
  font-family: Roboto, sans-serif;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  margin: 0;
  padding: 0;
  background: #ddd;
}

a {
  color: inherit;
  text-decoration: none;
}

a:hover {
  color: #388E3C;
}

/* okraje celej appky */
.Application {
  max-width: 700px;
  margin: 0 auto 35px;
  padding: 0 20px;
  padding-bottom: 10px;
  background: white;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.22);
}

form {
  margin: 0;
}

h3 {
  font-weight: 500;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

/**
 * @link http://www.bestcssbuttongenerator.com/#/15
 */
button,
.Collapsible .header .Header {
  -moz-box-shadow: inset 0px 1px 0px 0px #9acc85;
  -webkit-box-shadow: inset 0px 1px 0px 0px #9acc85;
  box-shadow: inset 0px 1px 0px 0px #9acc85;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #74ad5a), color-stop(1, #68a54b));
  background: -moz-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
  background: -webkit-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
  background: -o-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
  background: -ms-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
  background: linear-gradient(to bottom, #74ad5a 5%, #68a54b 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#74ad5a', endColorstr='#68a54b', GradientType=0);
  outline: none;
  background-color: #74ad5a;
  border-radius: 3px;
  border: 1px solid #3b6e22;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-weight: bold;
  padding: 6px 12px;
  text-decoration: none;
  letter-spacing: 1px;
}

button:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #68a54b), color-stop(1, #74ad5a));
  background: -moz-linear-gradient(top, #68a54b 5%, #74ad5a 100%);
  background: -webkit-linear-gradient(top, #68a54b 5%, #74ad5a 100%);
  background: -o-linear-gradient(top, #68a54b 5%, #74ad5a 100%);
  background: -ms-linear-gradient(top, #68a54b 5%, #74ad5a 100%);
  background: linear-gradient(to bottom, #68a54b 5%, #74ad5a 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#68a54b', endColorstr='#74ad5a', GradientType=0);
  background-color: #68a54b;
}

button.warn {
  -moz-box-shadow: inset 0px 1px 0px 0px #ef9a9a;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ef9a9a;
  box-shadow: inset 0px 1px 0px 0px #ef9a9a;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f44336), color-stop(1, #ef5350));
  background: -moz-linear-gradient(top, #f44336 5%, #ef5350 100%);
  background: -webkit-linear-gradient(top, #f44336 5%, #ef5350 100%);
  background: -o-linear-gradient(top, #f44336 5%, #ef5350 100%);
  background: -ms-linear-gradient(top, #f44336 5%, #ef5350 100%);
  background: linear-gradient(to bottom, #f44336 5%, #ef5350 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f44336', endColorstr='#ef5350', GradientType=0);
  background-color: #f44336;
  border: 1px solid #d50000;
}

button.warn:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ef5350), color-stop(1, #f44336));
  background: -moz-linear-gradient(top, #ef5350 5%, #f44336 100%);
  background: -webkit-linear-gradient(top, #ef5350 5%, #f44336 100%);
  background: -o-linear-gradient(top, #ef5350 5%, #f44336 100%);
  background: -ms-linear-gradient(top, #ef5350 5%, #f44336 100%);
  background: linear-gradient(to bottom, #ef5350 5%, #f44336 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef5350', endColorstr='#f44336', GradientType=0);
  background-color: #f44336;
}

button.secondary {
  -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
  box-shadow: inset 0px 1px 0px 0px #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
  background: -moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  background: -webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  background: -o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  background: -ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  background: linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9', GradientType=0);
  background-color: #f9f9f9;
  border: 1px solid #dcdcdc;
  color: #666666;
}

button.secondary:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
  background: -moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  background: -webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  background: -o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  background: -ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  background: linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9', GradientType=0);
  background-color: #e9e9e9;
}

button:active {
  position: relative;
  top: 1px;
}

.myButton:active {
  position: relative;
  top: 1px;
}


.DownloadXls--inline {
  display: inline-block;
}

button.fileDownload--processing {
  background: #f1c232;
}

button.fileDownload {
  box-shadow: none;
  background: #f9f9f9;
  border: 1px solid #aaa;
  color: #333;
  padding: 1px 2px;
  margin: 2px;
  font-size: 11px;
  font-weight: 200;
}

button.fileDownload:hover {
  border: 1px solid #1B5E20;
  color: black;
}

.fileDownload__icon {
  padding: 3px;
  font-size: 12px;
}

input[type=text], input[type=password], textarea, select {
  font-size: 20px;
  width: 100%;
  border: none;
  /*border-top: 1px solid silver;*/
  /*border-left: 1px solid silver;*/
  /*border-right: 1px solid silver;*/
  border-bottom: 3px solid silver;
  border-radius: 0; /* ios reset */
  padding: 7px;
  font-family: Roboto, sans-serif; /* kvoli textarea/Chrome */
}

/* Chrome & Safari */
.crmForm select {
  height: 40px;
}

input[type=text]:focus, textarea:focus {
  border-bottom-color: #388E3C;
}

.hidden {
  display: none;
}

.clear {
  clear: both;
}

.red {
  color: red;
}

.orange {
  color: #FFC107;
}

.green {
  color: #2E7D32;
}

.lightGreen {
  color: #8BC34A;
}

.status-alert {
  background-color: #ff8a80;
  color: white;
  font-weight: 500;
  border-radius: 3px;
  padding: 6px 10px;
}

.status-ok {
  background-color: #81C784;
  color: white;
  border-radius: 3px;
  padding: 6px 10px;
}

.UserFilter,
form {
  background-color: #efefef;
}

.form-group {
  margin-top: 10px;
  padding: 0;
  border: 0px solid silver;
  border-radius: 10px;
}

form.crmForm {
  padding: 0 20px 20px;
  padding-top: 5px;
  margin-top: 10px;
  /*overflow: auto;*/ /* nesmie byt auto kvoli pickerom */
}

.crmForm h3 {
  margin: 0;
  padding: 12px 20px;

  color: white;
  font-weight: 400;
  font-size: 18px;

  background-color: #388E3C;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.12);
}

.crmForm label {
  font-size: 14px;
  font-weight: 300;
}

.crmForm label:not(.inline) {
  margin: 5px 0 5px;
  display: block;
}

.crmForm div.fieldError {
  color: red;
  background-color: #FFCCBC;
  padding: 5px 10px;
  border-radius: 3px;
  margin-top: 5px;
  font-weight: 300;
}

.crmForm > div.fieldError {
  margin-top: 15px !important;
}

.crmForm button {
}

.crmForm button.buttonSubmit {
  padding: 15px;
  margin: 0px;
  margin-top: 20px;
  margin-right: 10px;
  margin-left: 10px;
  float: right;
  min-width: 120px;
  font-size: 16px;
  font-weight: normal;
}

.crmForm button.buttonSubmit:hover {
  color: yellow;
}

.crmForm button.buttonSubmit:focus {
}

.crmForm button.buttonSubmit:focus i {
  color: red;
  text-shadow: 1px 2px black;
}

.crmForm button.buttonSubmit.right {
  float: right;
  margin-right: 0px;
}

.crmForm button.buttonSubmit:disabled {
  color: gray;
  background: none;
  background-color: silver;
  border-color: darkgray;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  cursor: not-allowed;
}

/* tlacitko zrus v headery formularu */
.crmForm h3 .buttonCancel {
  float: right;
  color: silver;
  font-weight: 300;
  letter-spacing: 0;
  cursor: pointer;
}

.crmForm h3 .buttonCancel:hover {
  color: white;
}

.crmForm textarea {
  width: 100%;
}

/* Veleke Plus Button */
.btnAdd {
  margin-left: 5px;
  margin-top: 10px;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.22), 0 1px 4px rgba(0, 0, 0, 0.22);
}

/* add button na addActivityPage */
.buttonAdd {

  display: inline-block;
  min-width: 80px;

  margin: 10px 2px;
  padding: 5px;

  color: white;
  font-weight: 400;
  font-size: 14px;
  text-align: center;

  background-color: #388E3C;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.12);
}

.buttonAdd.active {
  background-color: #1B5E20;
  color: yellow;
}

.buttonAdd.narrow {
  min-width: inherit;
}

.buttonAdd:hover {
  color: yellow;
}

.buttonAdd > span.arrow {
  float: right
}

/* Tabs--accountStatuses */

.Tabs--accountStatuses .buttonAdd {
  margin-right: 8px !important;
}

.Tabs--accountStatuses .buttonAdd i {
  display: block;
  font-size: 32px;
  margin: 8px;
}

.Tabs--accountStatuses .buttonAdd {
  margin-top: 0px;
  margin-bottom: 10px !important;
  border: 5px solid transparent;
}

.Tabs--accountStatuses .buttonAdd.active {
  border: 5px solid #1B5E20;
}

/* /Tabs--accountStatuses */

/* len na formatovanie veci na objektoch (Aktivita...) */
.objectMeta {
  margin: 10px;
  display: flex;
}

.objectMetaInfo {
  flex: 8;
}

.objectMetaButtons {
  flex: 2;
  text-align: right;
}

.ButtonDelete {
  padding: 4px 8px;
  font-size: 16px;
}

.ButtonDelete:hover {
  color: red;
}

/* tlacitko spat pri editovacich formularoch */
.buttonBack {
  display: block;
  margin: 15px 0;
  padding: 10px 20px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.12);
}

/* === MainMenu === */

.MainMenu {
  margin-top: 0px;
  margin-left: -20px;
  margin-right: -20px;
  padding-left: 5px;
  background-color: #1B5E20;
  margin-bottom: 15px;
}

.MainMenu i {
  font-size: 64px;
}

.MainMenu .title {
  margin-top: 8px;
  font-size: 12px;
}

.MainMenu__rest .title {
  margin: 0;
  font-size: 11px;
}

.MainMenu > ul,
.MainMenu__rest > ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
}

.MainMenu__rest > ul {
  justify-content: flex-end;
}

.MainMenu > ul > li {
  display: inline-block;
  text-align: center;
  padding: 10px;
  cursor: pointer;
  flex: 1;
}

.MainMenu > ul > li.MainMenu__rest {
  flex: 8;
  text-align: right;
}

.MainMenu__rest > ul > li {
  display: inline-block;
  text-align: center;
  padding: 10px;
  cursor: pointer;
  flex: 1;
}

.MainMenu__rest > ul > li {
  padding: 0 4px;
  flex: 0;
  white-space: nowrap;
}

.MainMenu__rest > ul > li i {
  display: none;
}

.MainMenu > ul > li a {
  color: #ddd;
  display: inline-block;
}

.MainMenu > ul > li a.active {
  color: yellow;
}

.MainMenu > ul > li:hover > a {
  color: yellow;
}

.MainMenu > ul > li.MainMenuItem--secondary > a {
  opacity: 0.5;
}

.MainMenu > ul > li.MainMenuItem--secondary > a.active,
.MainMenu > ul > li.MainMenuItem--secondary > a:hover {
  opacity: 1;
}

/* === /MainMenu === */

.Contact, .UnitDetails {
  padding-left: 10px;
  margin-bottom: 15px;
}

.CompanyInfoNews {
  margin-bottom: 15px;
}

.CompanyInfoContacts {
  margin-bottom: 15px;
}

.CompanyInfoContacts .Contact {
  margin-bottom: 5px;
}

.CompanyInfoDepartments {
  margin-bottom: 15px;
}

.CompanyInfoDepartments > div {
  margin-left: 5px;
  margin-bottom: 5px;
}

.Contact .position {
  font-size: smaller;
}

.Contact button {
  padding: 0;
  margin-left: 6px;
  font-size: 11px;
}

a.enterNew, .AppearOnClick > button {
  font-style: italic;
  color: #999;
  line-height: 25px;
}

a.enterNew:hover, .AppearOnClick > button:hover {
  color: #333;
}

/* reset button props */
.AppearOnClick > button {
  background: inherit;
  border: inherit;
  box-shadow: none;
  font-weight: inherit;
  font-size: inherit;
  letter-spacing: inherit;
  margin: 0;
  padding: 0;
}

.OwnershipWarning {
  clear: both;
  font-weight: 500;
  color: white;
  padding: 14px 24px;
  background-color: red;
  margin-top: 0;
  margin-bottom: 15px;
}

.GoogleCalendarSyncInfo > .CalendarInfo {
  clear: both;
  font-weight: normal;
  padding: 10px 24px;
  background-color: #ddd;
  margin-top: 0;
  font-size: 12px;
}

.OwnershipWarning div.gCalAuthError button.secondary {
  display: block;
  margin: 0px 0 10px 0;
}

/* === GmailAccessCheck === */

.GmailAccessCheck__Button--warn {
  background: red;
  margin-top: 10px;
}

.GmailAccessCheck span.info {
  display: block;
  font-size: 13px;
}

.GmailAccessCheck span.info a {
  color: blue;
  text-decoration: underline;
}

/* === /GmailAccessCheck === */

/* === GmailAccessModal === */
.GmailAccessModal__Info {
  margin: 10px;
  font-size: 17px;
  padding: 20px;
  padding-top: 0px;
}

ol.GmailAccessModal__List {
  margin: 0 10px 0 10px;
  padding: 0px;
  padding-right: 10px;
  list-style-type: decimal;
  counter-reset: item;
}

li.GmailAccessModal__ListItem {
  margin: 0;
  margin-top: 10px;
  padding-left: 20px;
  text-indent: 0px;
  list-style-type: none;
  counter-increment: item;
}

li.GmailAccessModal__ListItem:before {
  display: inline-block;
  padding-right: 10px;
  margin-left: -26px;
  font-weight: bold;
  font-size: 20px;
  text-align: right;
  content: counter(item) ".";
}

.GmailAccessModal__Image {
  margin: 5px 0;
  height: 350px;
  width: auto;
  dipslay: block;
  border: 1px solid silver;
}

.GmailAccessModal__Image:after {
  content: "";
  display: table;
  clear: both;
}

.GmailAccessModal__Link {
  color: blue;
  text-decoration: underline;
}

.GmailAccessModal__Button {
  display: inline-block;
  margin: 20px;
  height: 40px;
  width: 260px;
  font-size: 14px;
}

/* === /GmailAccessModal === */

/* === Header === */

.Header {
  clear: both;

  font-weight: 400;
  color: white;
  padding: 14px 14px;

  background-color: #388E3C;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.12);

  margin-top: 0;
  margin-bottom: 15px;

}

.Header a {
  color: white;
}

.Header.tertiary {
  font-size: 16px;
  font-weight: normal;
  color: silver;
  background-color: transparent;
  text-align: center;
  padding: 0;
  margin: 0 10px;
  box-shadow: none;
  display: table;
  white-space: nowrap;
}

/* https://codepen.io/ericrasch/pen/Irlpm/ */
.Header.tertiary:before, .Header.tertiary:after {
  border-top: 1px dotted silver;
  content: '';
  display: table-cell;
  position: relative;
  top: 0.5em;
  width: 47%;
}

.Header.tertiary:before {
  right: 1.5%;
}

.Header.tertiary:after {
  left: 1.5%;
}

.Header > .subTitle {
  float: right;
  font-weight: normal;
  font-size: 85%;
  line-height: 33px;
}

.Header > .iconsLeft > i.fa,
.Header > .icons > i.fa {
  float: right;
  font-size: 24px;
  cursor: pointer;
  margin-left: 10px;
  margin-top: -14px; /* toto je padding headeru */
  height: 56px; /* toto je vyska headeru, pri danom paddingu a vyske pisma... */
  line-height: 55px;
  padding-right: 10px;
  padding-left: 10px;
}

.Header > .iconsLeft > i.fa:hover,
.Header > .icons > i.fa:hover {
  background-color: #3b9b3f;
}

.Header > .icons > i.fa:last-child {
  margin-right: -24px; /* toto je padding headeru */
  padding-right: 20px;
  padding-left: 20px;
}

.Header > .iconsLeft > i.fa {
  float: left;
  margin: 0 10px;
}

/*ak je prva ikonka iconBack, tak nech je nacapena vlavo (header ma padding-left 24px) */
.Header > .iconsLeft > i.fa:first-child.iconBack {
  margin-left: -24px;
  margin-right: 2px;
}

/* iconBack styles */
.Header > .iconsLeft > i.fa.iconBack {
  margin-top: -14px; /* toto je padding headeru */
  padding-left: 18px;
  padding-right: 18px;
  font-size: 30px;
  line-height: 55px;
}

.Header > .iconsLeft > i.fa.iconBack:hover {
  color: yellow;
  background-color: #3b9b3f;
}

.Header > .icons > i.fa.warn:hover {
  color: red;
}

.Header > .icons > i.fa:hover {
  color: yellow;
}

.Header .badge {
  font-size: 70%;
  font-weight: 300;
  margin-left: 5px;
}

.Header .orange {
  color: #FFECB3;
}

.Header .red {
  color: #FFCCBC;
}

.Header a.button {
  position: relative;
  top: -3px;
  display: inline-block;
  margin: 0 10px;
}

/* select filtre (v agende) */
.Header select {
  width: auto;
  padding: 0;
  font-size: 18px;
  margin: 0 8px;
  color: gray;
  border: none;
}

.Header select.active {
  background-color: #FFF59D;
  color: black;
}

/* === /Header === */

.FinstatRecommendedContacts label,
.FinstatAddresses label {
  color: gray;
}

/*
.Account .AccountInfoContacts.noContacts {
  margin-top: -15px; !* prirazit "zadat kontakty" vyssie k "zadat Web" *!
}

.Account .AccountInfoContacts .Header {
  margin-top: 30px; !* odrazit viac od "zadat Web" *!
}
*/

/* === /OwnershipInfo === */
.OwnershipInfo {
  margin: 10px 0;
}

.OwnershipInfo div.title {
  float: left;
  margin-right: 10px;
}

.OwnershipInfo div.UserListItem {
  display: inline-block;
  padding: 0;
  border: 0;
  margin-right: 10px;
}

.OwnershipInfo div.UserListItem div.flexContainer {
  display: block;
}

.OwnershipInfo div.UserListItem div.flexIcon,
.OwnershipInfo div.UserListItem div.flexMenu {
  display: none;
}

.OwnershipInfo div.UserListItem div.flexContent:after {
  content: ', ';
}

.OwnershipInfo div.List div.UserListItem:last-child div.flexContent:after {
  content: '';
}

/* === /OwnershipInfo === */

.Tabs {
  margin-bottom: 10px;
}

.companies {
  margin-bottom: 15px;
}

/* na stranke MyAccountsByTypePage su pod Header Tabs (filtre), ktore maju byt blizsie k Headru */
.MyAccountsByTypePage > .Header {
  margin-bottom: 0;
}

.PanelHeader {
  background-color: rgb(232, 232, 232);
  color: rgba(0, 0, 0, 0.4);
  font-weight: 500;
  margin: 0;
  padding: 10px 15px;
}

.PanelHeader .badge {
  font-size: 80%;
  font-weight: 300;
  margin-left: 5px;
}

/* momentalne sa nepouziva */
.PanelHeader > i.fa {
  font-size: 30px;
  line-height: 0.7em;
}

/* === Labels === */

.Labels > .label,
.flexContent__label {
  font-size: 90%;
  font-weight: 100;
  margin-left: 6px;
  padding: 2px 4px;
  letter-spacing: 1px;
  background-color: #8fdf82;
  color: #444;
  border-radius: 3px;
}

.Labels > .label--account-free {
  background-color: #8fdf82;
  color: #444;
}

.Labels > .label--new {
  background-color: #8fdf82;
  color: #fff;
}

.Labels .label--deleted {
  background-color: #FF0000 !important;
  color: #fff;
}

.Labels > .label--account-assigned,
.Labels > .label--bonita,
.Labels > .label--salesTeam {
  background-color: silver;
  color: black;
}

/* posunut vyssie labely v headeri */
.Header .Labels {
  display: inline-block;
  transform: translateY(-2px);
  margin: 6px 0;
}

.Header .Labels > .label {
  font-size: 16px;
  letter-spacing: 0;
  padding: 3px 4px;
  border: 1px solid gray;
  margin: 4px;
  font-weight: normal;
}

.AccountListItem .Labels > .label {
  font-size: 11px;
}

/* === /Labels === */

.List {
  margin-bottom: 15px;
}

.List .List {
  margin-bottom: 0;
}

.List > div {
  border-bottom: 1px solid #e0e0e0;
}

.List > div:last-of-type {
  border-bottom: none;
}

.List__NextItemsButton {
  margin: 10px auto;
  display: block;
}

.ListItem {
  padding: 10px;
  position: relative;
}

.ListItem.selected {
  background: #9acc85;
}

.ListItem .flexContainer {
  display: flex;
  align-items: center;
}

.ListItem .flexIcon {
  flex: 1;
}

.ListItem .flexContent {
  flex: 100;
  display: flex;
  align-items: center;
  font-size: 95%;
}

.ListItem .flexMenu {
  flex: 1;
}

/* kopia ListItem-u zobrazena absolutne nad overlayom */
.ListItem .absoluteWrapper > .ListItem {
  background-color: #FFF9C4;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.6), 0 1px 2px rgba(0, 0, 0, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2000;
  border-radius: 5px;
}

.ListItem .menuIcon {
  margin-top: 2px;
  display: block;
  float: right;
  color: #555;
  font-size: 32px;
  width: 35px;
  text-align: center;
  cursor: pointer;
}

.ListItem .menuIcon:hover {
  color: #388E3C;
}

.ListItem .menuIcon.oneAction {
  color: #aaa;
}

.ListItem .subMenu {
  position: absolute;
  z-index: 2010;
  border-radius: 4px;
  top: 50px;
  right: 10px;
  width: 95%;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.6), 0 1px 2px rgba(0, 0, 0, 0.6);
  background-color: white;
}

.ListItem .subMenu textarea.menuNote {
  margin: 8px;
  width: 95%;
  border: 4px solid silver;
}

.ListItem .subMenu .action {
  padding: 10px 8px;
  color: #444;
  border-bottom: 1px dotted silver;
  cursor: pointer;

  /* reset */
  font-style: normal;
  font-weight: 400;

  /* len na 1 riadok nazov akcie, useknuty */
  /* todo: fade gradient na konci riadku */
  white-space: nowrap;
  overflow: hidden;
}

.ListItem .subMenu .action.default {
  font-weight: 500;
}

.ListItem .subMenu .action.default i.fa {
  font-weight: 900 !important;
}

.ListItem .subMenu .action:last-of-type {
  border-bottom: none;
}

.ListItem .subMenu .action i.fa {
  margin-right: 5px;
  width: 30px;
  text-align: center;
  font-size: 18px;
}

.ListItem .subMenu .action:hover {
  color: yellow;
  background-color: #388E3C;
}

.ListItem .ListItemIcon {
  color: #388E3C;
  background-color: #ddd;
  border-radius: 30%;
  width: 28px;
  height: 28px;
  text-align: center;
  font-size: 18px;
  line-height: 28px;
  margin-right: 10px;
}

.ListItem.hasDefaultAction {
  cursor: pointer;
}

.ListItem.hasDefaultAction:hover {
  background-color: #f0f0f0;
}

.ListItem .subTitle {
  font-size: smaller;
  margin-left: 5px;
}

/*
 * vnorene do seba
 */
div.ListItem.ListItemIncluded,
div.ListItem > div.List > div.ListItem,
div.ListItem > div.AccountListItemWrapper > div.ListItem,
div.ListItem > div.ListItem {
  padding: 4px 10px 4px 38px;
  font-size: 13px;
}

div.ListItem.ListItemIncluded .ListItemIcon,
div.ListItem > div.List > div.ListItem .ListItemIcon,
div.ListItem > div.AccountListItemWrapper > div.ListItem .ListItemIcon,
div.ListItem > div.ListItem .ListItemIcon {
  padding: 0;
  height: auto;
  width: auto;
  min-width: 12px;
  margin-right: 5px;
  line-height: 14px;
  font-size: 14px;
  color: #777;
  background-color: transparent;
}

.DefaultListItem.warn {
  color: inherit;
}

.DefaultListItem.italic {
  font-style: italic;
}

div.ListItem > div.List > div.ListItem.DefaultListItem.warn .ListItemIcon,
div.ListItem > div.ListItem.DefaultListItem.warn .ListItemIcon {
  color: red;
}

div.ListItem.ListItemIncluded .menuIcon,
div.ListItem > div.ListItem .menuIcon {
  line-height: 14px;
  font-size: 14px;
}

/* === ContactListItem === */
.ListItem.ContactListItem li.action {
  margin-left: 35px;
  margin-top: 5px;
  list-style: none;
  cursor: pointer;
}

.ListItem.ContactListItem li.action:hover {
  color: #1B5E20;
}

.ListItem.ContactListItem li.action i {
  margin: 0 5px;
}

/* === AccountListItem === */

.AccountListItemWrapper button.addActivity {
  margin-left: 45px;
  padding: 5px 10px;
}

.List > .AccountListItemWrapper > *:last-of-type {
  margin-bottom: 15px;
}

div.AccountListItem--status-client div.flexIcon i,
.status-client,
.Labels .label--client,
.AccountListItem .label--client {
  background-color: #388E3C !important;
  color: white;
}

div.AccountListItem--status-potential div.flexIcon i,
.status-potential,
.Labels .label--potential,
.AccountListItem .label--potential {
  background-color: orange !important;
  color: #333;
}

div.AccountListItem--status-potential div.flexIcon i,
.status-potential,
.Labels .label--upSlovensko,
.AccountListItem .label--upSlovensko {
  background-color: orange !important;
  color: #fff;
  opacity: 0.5;
}

div.AccountListItem--status-lost div.flexIcon i,
.status-lost,
.Labels .label--lost,
.AccountListItem .label--lost {
  background-color: #97eb8a !important;
  color: white;
}

div.AccountListItem--status-blacklist div.flexIcon i,
.status-blacklist,
.Labels .label--blacklist,
.AccountListItem .label--blacklist {
  background-color: red !important;
  color: white;
}

div.AccountListItem--status-potential div.flexIcon i,
.status-terminated,
.Labels .label--terminated,
.AccountListItem .label--terminated {
  background-color: silver !important;
  color: #333;
}

div.AccountListItem--status-lead {
  margin-bottom: 0px !important;
  padding-top: 3px;
  padding-bottom: 3px;
}

div.AccountListItem--status-lead div.flexContent {
  color: #999;
  font-size: 13px;
  font-style: italic;
}

div.AccountListItem--status-lead div.flexIcon i,
div.AccountListItem--status-lead .label--account-free,
.status-lead,
.Labels .label--lead,
.AccountListItem .label--lead {
  background-color: #ccc !important;
  color: #777;
}

div.AccountListItem--status-lead div.flexIcon i {
  font-size: 17px;
  height: 25px;
  width: 25px;
  line-height: 25px;
  color: #ccc;
}

div.AccountListItem--removable:hover i.menuIcon {
  color: red;
}

.flexContent__assignedUser {
  font-size: 11px;
  flex-grow: 100;
  text-align: right;
}

.assignedUser__img {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  border-radius: 3px;
  background-color: silver;
}

.AccountListItem .AccountOverviewInfo__Text {
  font-size: 11px;
  margin-left: 5px;
}

.AccountListItem .AccountOverviewInfo__Text--empty {
  color: gray
}

.AccountListItem .AccountOverviewInfo__Icon {
  color: #222;
  font-size: 11px;
  margin-left: 5px;
}

.AccountListItem .AccountOverviewInfo__Icon i {
  margin: 0 1px;
}


.AccountListItem span.ListItem__TitleAlternate{
  color: gray;
  font-style: italic;
  display: block;
  font-size: 12px;
}



.LeadSwitch {
  box-shadow: none;
  border: 1px solid #444;
}

.AccountListItem .LeadSwitch {
  margin: 0px 5px;
  height: auto;
  padding: 2px 3px;
  line-height: 12px;
  font-weight: 200;
}

.LeadSwitch--isLead:hover {
  color: yellow
}

/* daktivovat firmu na led cheme cervenym */
.LeadSwitch--isNormal {
  background: red !important;
}

.LeadSwitch--isNormal:hover {
  color: yellow;
}

.Account .LeadSwitch {
  text-transform: capitalize;
  margin: 10px 0;
}

.AccountListItem button.ButtonDelete {
  padding: 2px 3px;
  margin-right: 4px;
  line-height: 12px;
  font-size: 14px;
  background: red;
  box-shadow: none;
  border: 1px solid #444;
}

.AccountListItem button.ButtonDelete:hover {
  color: yellow;
}

/* vnoreny ListItem */
div.ListItem div.ListItem .assignedUser__img {
  width: 15px;
  height: 15px;
}

/* === /AccountListItem === */

/* === OpportunityListItemWrapper === */

.OpportunityListItemWrapper button.addActivity {
  margin-left: 45px;
  padding: 5px 10px;
}

.OpportunityListItemWrapper span.name {
  font-weight: 500;
}

.OpportunityListItemWrapper span.value {
  display: inline-block;
  font-weight: 500;
}

.OpportunityListItemWrapper > *:last-of-type {
  margin-bottom: 15px;
}

.OpportunityListItemWrapper div.flexMenu {
}

.OpportunityListItemWrapper button.addActivity {
  padding: 3px;
  font-weight: 200;
  box-shadow: none;
}

/* aby subtitle bol na novom riadku (kvoli prehladnosti) */
.OpportunityListItemWrapper span.subTitle {
  display: block;
  padding: 0;
  margin: 3px 5px;
}

/* === /OpportunityListItemWrapper === */

.CompanyHeader {
  margin-bottom: 15px;
}

.SearchGlobal {
  margin: 30px 0;
}

/* ==== SearchBox === */

.SearchBox {
  margin-bottom: 15px;
  position: relative;
}

.SearchBox i.fa {
  color: #ddd;
  top: 6px;
  position: absolute;
  font-size: 25px;
}

.SearchBox i.fa.search {
  left: 8px;
}

.SearchBox.hasSearchValue i.fa.search {
  color: #888;
}

.SearchBox i.fa.clear {
  right: 8px;
  color: #888;
}

.SearchBox i.fa.clear:hover {
  color: #555;
}

.SearchBox input {
  padding-left: 40px;
}

.SearchBox input[type="text"] {
  border-top: 1px solid silver;
  border-left: 1px solid silver;
  border-right: 1px solid silver;
}

.SearchBox input[type="text"]::-webkit-input-placeholder {
  font-style: italic;
}

.SearchBox.hasSearchValue input {
  background-color: #FFF59D;
}

/* ==== /SearchBox === */

.DashboardPage .SearchResults > .List {
  border: 1px dotted silver;
}

.DashboardPage .SearchResults > .List > div {
  border-bottom: 1px dotted silver;
}

.DashboardContent {
  padding-top: 5px;
}

.DashboardContent-agenda .SearchGlobal {
  margin-top: 0;
}

/* zabezpecit rovnaku vysku vnorenym veciam */
.Logs .waitAndNoResultsWrapper,
.Deals .waitAndNoResultsWrapper,
.SearchResults .waitAndNoResultsWrapper {
  min-height: 80px;
}

.Logs .wait,
.Deals .wait,
.SearchResults .wait {
  padding: 20px;
  color: silver;
  text-align: center;
  font-size: 30px;
}

.Logs .noResults,
.Deals .noResults,
.SearchResults .noResults {
  padding: 25px;
  text-align: center;
  color: gray;
}

.SearchResults .noResults i.fa {
  margin-left: 5px;
}

.SearchAddButtons button.buttonAdd {
  padding-top: 10px;
  padding-bottom: 10px;
  display: block;
}

.SearchAddButtons button.buttonAdd i {
  font-size: 18px;
}

.SearchAddButtons button.buttonAdd .query {
  padding-left: 5px;
  padding-right: 5px;
  font-style: italic;
  font-size: 12px;
  color: silver;
  letter-spacing: 0;
}

/* === SearchPage === */

.SearchPage > .SearchBox {
  margin-top: 20px;
  margin-bottom: 0;
}

.SearchPage > .Tabs {
  margin: 8px 0;
}

.SearchPage > .Tabs .buttonAdd {
  background-color: white;
  box-shadow: none;
  color: #555;
  min-width: inherit;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-right: 8px;
  border-bottom: 4px solid transparent;
}

.SearchPage > .Tabs .buttonAdd.active {
  color: #388E3C;
  border-bottom-color: #388E3C;
}

.SearchPage > .Tabs .buttonAdd:hover {
}

/* === /SearchPage === */

/* ==== Picker === */

.Picker {
}

.Picker div.searchAndResults {
  position: relative;
}

.Picker div.searchAndResultsInputWrapper {
  position: relative;
}

.Picker div.searchAndResults input {
  padding-right: 40px;
}

.Picker div.searchAndResults i.clearValue {
  position: absolute;
  top: 11px;
  right: 7px;
}

.Picker div.searchAndResults.hasSearchValue input {
  background-color: #FFF59D;
}

.Picker div.searchAndResults.hasSearchValue i.clearValue {
  color: #444;
}

.Picker div.searchAndResults input[type="text"]::-webkit-input-placeholder {
  font-style: italic;
}

.Picker i.optionIcon {
  margin-right: 10px;
  color: gray;
}

.Picker div.asInputField {
  color: #555;
  cursor: text;
  display: flex;
  align-items: center;
}

.Picker div.asInputField .flexIcon {
  flex: 1;
}

.Picker div.asInputField .flexContent {
  flex: 100;
}

.Picker div.asInputField .flexMenu {
  flex: 1;
  white-space: nowrap;
}

.Picker.isExpanded div.asInputField {
  display: none;
}

.Picker i.clearValue {
  color: silver;
  font-size: 18px;
  cursor: pointer;
}

.Picker i.clearValue:hover {
  color: red !important;
}

.Picker .List {
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
  position: absolute;
  z-index: 100;
  width: 100%;
  background-color: white;
  border: 1px solid silver;
  margin-bottom: 100px; /* kvoli spodnemu okraju celej stranky */
}

.Picker .List i.menuIcon {
  display: none;
}

.Picker .ListItem {
  padding: 5px;
  font-size: 90%;
}

.Picker .ListItem.hasDefaultAction:hover {
  background-color: #d7f3d3;
}

.Picker .ListItem.newOption {
  font-style: italic;
  color: #1B5E20;
}

.Picker .List .ListItem.newOption i.ListItemIcon {
  color: #1B5E20;
}

.Picker .ListItem i.ListItemIcon {
  font-size: 150%; /* zaujimave ze 150% na dosiahnutie mensej velkosti */
  color: gray;
  background-color: transparent;
  margin-right: 0;
}

.Picker .Recommended {
  margin-top: 5px;
}

/* zobrazuje sa adminovi */
/* todo: vymysliet lepsi sposob ako adminovi odstranit .OwnershipInfo z .ListItem-u v .Picker-i  */
.Picker .OwnershipInfo {
  display: none;
}

/* ==== /Picker === */

/* ==== StreetPicker === */

.Picker.PositionPicker div.asInputField,
.Picker.StreetPicker div.asInputField {
  color: black;
}

.Picker.PositionPicker div.searchAndResults.hasSearchValue input,
.Picker.StreetPicker div.searchAndResults.hasSearchValue input {
  background-color: #FFF;
}

/* ==== /StreetPicker === */

/* ==== ContactsPicker === */

.ContactsPicker {
  margin-bottom: 20px;
}

.ContactsPicker > .List {
  margin-bottom: 0;
}

/* ==== /ContactsPicker === */

/* ==== ContactSocialInfo=== */
.ContactSocialInfo {
  margin: 10px 10px;
  overflow: auto;
}

.ContactSocialInfo__button {
  display: block;
  float: left;
  background: white;
  box-shadow: none;
  border: 1px solid silver;
  color: black;
  margin: 2px;
  padding: 5px;
  width: 45px;
  height: 45px;
  overflow: hidden;
}

.ContactSocialInfo__button:hover {
  background: white;
  border-color: #3b9b3f;
}

.ContactSocialInfo__header {
  font-size: 14px;
  font-style: italic;
}

/* ==== /ContactSocialInfo=== */

/*.KPIs {
  overflow: auto;
  margin-bottom: 15px;
}
.KPI {
  width: 18%;
  float: left;
  text-align: center;
  margin: 5px;
  background-color: #eee;
  border-radius: 50%;
  height: 90px;
  padding: 10px;
  box-sizing: border-box;
}
.KPI .percent {
  font-weight: 500;
  font-size: 125%;
}*/

.Opportunities {
  margin-bottom: 15px;
}

.Opportunities > form {
  margin: 15px;
}

/* na stranke MyOpportunitiesPage su pod Header Tabs (filtre), ktore maju byt blizsie k Headru */
.MyOpportunitiesPage > .Opportunities > .Header {
  margin-bottom: 0;
}

.ListItem.opportunity-status-closed-won .ListItemIcon {
  color: white;
  background-color: #8BC34A;
}

.ListItem.opportunity-status-closed-lost .ListItemIcon {
  color: white;
  background-color: #ff8a80;
}

.ListItem.opportunity-status-blacklist .ListItemIcon {
  color: white;
  background-color: red;
}

.Activities {
  margin-bottom: 25px;
}

.Activities > form {
  margin: 15px;
}

/* na stranke MyActivitiesPage su pod Header Tabs (filtre), ktore maju byt blizsie k Headru */
.MyActivitiesPage > .Header,
.MyOpportunitiesPage > .Header {
  margin-bottom: 0;
}

.MyActivitiesPage .Tabs {
  margin-bottom: 20px;
}

.StatusBoardPage .TabsList .Tabs:first-child,
.ListsPage .TabsList .Tabs:first-child,
.MyActivitiesPage .TabsList .Tabs:first-child,
.MyOpportunitiesPage .TabsList .Tabs:first-child {
  margin-bottom: 0px;
}

.StatusBoardPage .TabsList,
.ListsPage .TabsList {
  margin-bottom: 20px;
}

/* pravy okraj filter tabov, aby neboli natlacene */
.StatusBoardPage .Tabs a,
.ListsPage .Tabs a,
.MyActivitiesPage .Tabs a,
.MyOpportunitiesPage .Tabs a {
  margin-bottom: 0px;
  margin-right: 2px;
}

.StatusBoardPage .Tabs a:last-child,
.ListsPage .Tabs a:last-child,
.MyActivitiesPage .Tabs a:last-child,
.MyOpportunitiesPage .Tabs a:last-child {
  margin-right: 0px;
}

/* icona filtra v tabe napr. znak eura */
.MyOpportunitiesPage .Tabs a span.icon,
.MyActivitiesPage .Tabs a span.icon {
  font-size: 110%;
  margin-left: 5px;
  display: inline-block;
}

/* sipka dole alebo hore  */
.MyOpportunitiesPage .Tabs a span.sortIcon,
.MyActivitiesPage .Tabs a span.sortIcon {
  font-size: 80%;
  margin-left: 2px;
  display: inline-block;
}

/* pocet zaznamov pre fiter zobrazeny v tabe */
.MyOpportunitiesPage .Tabs a span.count,
.MyActivitiesPage .Tabs a span.count {
  color: #ddd;
  display: inline-block;
  float: right;
  padding-right: 2px;
  padding-left: 4px;
}

/* textovy popis filtra */
.MyOpportunitiesPage > div.filterDescription,
.MyActivitiesPage > div.filterDescription {
  margin: 25px 0;
  color: #999;
}

.ListItem.activity-missed,
.ListItem.activity-missed .ListItemIcon {
  color: red;
}

.ListItem.activity-missed {
}

.ListItem.activity-status-completed,
.ListItem.activity-status-rescheduled {
  color: gray;
}

/*preplánovaná aktivita italikom */
/*hotová aktivita italikom */
.ListItem.activity-status-completed,
.ListItem.activity-status-rescheduled {
  font-style: italic;
}

.ListItem.activity-status-completed > .ListItemIcon,
.ListItem.activity-status-rescheduled > .ListItemIcon {
  color: silver;
  background-color: #eee;
}

.ListItem.activity-status-completed > .menuIcon,
.ListItem.activity-status-rescheduled > .menuIcon {
  color: #388E3C;
}

.ListItem.activity-status-cancelled {
  color: gray;
  font-style: italic;
}

.ListItem.activity-status-cancelled > .menuIcon {
  color: gray;
}

.ListItem.activity-status-cancelled > .ListItemIcon {
  color: silver;
  background-color: #eee;
}

.radioLabelsAsButtons.flex,
.ActivityForm .activityTypes,
.ActivityForm .activityStatuses,
.ActivityForm .googleCalendarsList {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  flex-direction: row;
}

.radioLabelsAsButtons label,
.ActivityForm .activityTypes label,
.ActivityForm .activityStatuses label,
.OpportunityForm .opportunityStatuses label,
.DeleteAccountForm .reasonsDeactivate label,
.ActivityForm .googleCalendarsList label {
  font-weight: 400;
  font-size: 15px;
  padding: 3px 12px;
  display: block;
  cursor: pointer;
  margin-top: 0 !important;
  margin-right: 8px;
  border-radius: 15px;
  -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
  box-shadow: inset 0px 1px 0px 0px #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
  background: -moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  background: -webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  background: -o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  background: -ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  background: linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9', GradientType=0);
  background-color: #f9f9f9;
  border: 1px solid #dcdcdc;
  color: #333;
  white-space: nowrap;
}

.radioLabelsAsButtons label:hover,
.ActivityForm .activityTypes label:hover,
.ActivityForm .activityStatuses label:hover,
.OpportunityForm .opportunityStatuses label:hover,
.DeleteAccountForm .reasonsDeactivate label:hover,
.ActivityForm .googleCalendarsList label:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
  background: -moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  background: -webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  background: -o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  background: -ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  background: linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9', GradientType=0);
  background-color: #e9e9e9;
}

.radioLabelsAsButtons label:active,
.ActivityForm .activityTypes label:active,
.ActivityForm .activityStatuses label:active,
.OpportunityForm .opportunityStatuses label:active,
.DeleteAccountForm .reasonsDeactivate label:active,
.ActivityForm .googleCalendarsList label:active {
  position: relative;
  top: 1px;
}

.radioLabelsAsButtons label.selected,
.ActivityForm .activityTypes label.selected,
.ActivityForm .activityStatuses label.selected,
.OpportunityForm .opportunityStatuses label.selected,
.DeleteAccountForm .reasonsDeactivate label.selected,
.ActivityForm .googleCalendarsList label.selected {
  -moz-box-shadow: inset 0px 1px 0px 0px #9acc85;
  -webkit-box-shadow: inset 0px 1px 0px 0px #9acc85;
  box-shadow: inset 0px 1px 0px 0px #9acc85;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #74ad5a), color-stop(1, #68a54b));
  background: -moz-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
  background: -webkit-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
  background: -o-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
  background: -ms-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
  background: linear-gradient(to bottom, #74ad5a 5%, #68a54b 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#74ad5a', endColorstr='#68a54b', GradientType=0);
  background-color: #74ad5a;
  border: 1px solid #3b6e22;
  color: #ffffff;
}

.radioLabelsAsLink {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

.radioLabelsAsLink__label {
  flex: 0;
  display: block;
  text-decoration: underline;
  padding: 6px;
  font-size: 16px !important;
  cursor: pointer;
  line-height: 16px;
  font-weight: 300;
  white-space: nowrap;
}

.radioLabelsAsLink__label--selected {
  font-weight: 600 !important;
  text-decoration: none;
  font-size: 17px !important;
  line-height: 14px;
}

.opportunityCategories .radioLabelsAsLink__label {
}

.ActivityForm .activityTypes .activityIcon,
.ActivityForm .activityStatuses .activityIcon,
.ActivityForm .GoogleCalendarPicker .activityIcon {
  margin-left: -5px;
  margin-right: 5px;
}

.ActivityForm .activityTypes label {
  padding-left: 17px;
  padding-right: 17px;
}

/* vnoreny opportunity "form" v activity forme */

.opportunityInActivity {
  margin-top: 15px;
  margin-bottom: 0;
}

.opportunityInActivity > .Header {
  margin-bottom: 0;
}

.ActivityForm .OpportunityForm .OpportunityFormFields {
  border: 1px solid silver;
  padding: 15px;
}

.OpportunityFormFields .opportunityValue {
  min-width: 90px;
}

/* zobrazit zarovnane vpravo */
label.label--withoutOppChange {
  float: right;
}

/* /vnoreny opportunity "form" */

.DateDisplayComponent {
  cursor: pointer;
}

.DateDisplayComponent,
.asInputField {
  font-size: 20px;
  width: 100%;
  border: none;
  border-bottom: 3px solid silver;
  padding: 7px;
  background-color: white;

}

.DateDisplayComponent:hover {
  color: #388E3C;
}

/*Od do DateTimePicker */
.DateTimePickerRange {
  border-radius: 5px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  background-color: white;
}

.DateTimePickerRange div.separator {
  font-size: 30px;
  font-weight: 100;
  color: silver;
}

/*DateTimePicker s velkym casom a malym datumom nad casom*/
.DateTimePickerBigTime:hover {
  color: #1B5E20;
  cursor: pointer;
}

.DateTimePickerBigTime div.time {
  text-align: center;
  font-size: 42px;
  font-weight: 300;
}

/* Datum OD prilezitosti vysedeny */
.DateTimePicker.currentDay div.DateDisplayComponent {
  background-color: #ddd;
  color: #555;
}

.GoogleCalendarPicker,
.GoogleCalendarSatus {
  overflow: auto;
  margin-top: 15px;
}

.GoogleCalendarPicker > div,
.GoogleCalendarStatus > div {
  font-size: 14px;
  font-weight: 300;
  margin-top: 2px;
}

.GoogleCalendarStatus > div {
  font-size: 16px;
  font-weight: bold;
}

.GoogleCalendarPicker div.status,
.GoogleCalendarStatus div.status {
  color: #1B5E20;
}

.GoogleCalendarPicker div.status.warn,
.GoogleCalendarStatus div.status.warn {
  color: #ff0000;
}

.DictateArea {
  display: flex;
  align-content: flex-start;
  margin: 5px 0;
}

.DictateArea > textarea {
  min-height: 70px; /* ako vyska mic-icon*/
}

.DictateArea--with-label > textarea {
  min-height: 100px; /* ako vyska mic-icon*/
}

.DictateArea.DictateArea--activity-description > textarea {
  min-height: 150px; /* kvoli prehladnosti */
}

.DictateArea__mic {
  width: 60px;
  height: 55px;
  text-align: center;
  background-color: #ffffff;
  padding: 3px;
  margin: 0px 0 0 5px;
  border: 4px solid #ff0000;
  border-radius: 50px;
  cursor: pointer;
}

.DictateArea__mic--with-label {
  border: none;
  background: none;
  margin: 0 auto;
}

.DictateArea__mic--with-label:active > i,
.DictateArea__mic--with-label:hover > i {
  color: #1B5E20;
  background: none;
}

.DictateArea__mic > i {
  font-size: 30px;
  color: black;
  line-height: 42px;
  padding: 0;
  margin: 0;
}

.DictateArea__mic:active {
  background-color: black;
}

.DictateArea__mic:active > i {
  color: white;
}

div.dictationModalContent {
  text-align: center;
  color: white;
}

div.dictationModalContent div.micIcon {
  position: relative;

  width: 110px;
  height: 110px;

  margin-right: auto;
  margin-left: auto;

  cursor: pointer;
  margin-top: 10px;
}

div.dictationModalContent div.micIcon div.border {
  position: absolute;

  width: 100%;
  height: 100%;

  border-radius: 90px;
  border: 4px solid silver;

}

div.dictationModalContent div.micIcon.isDictating div.border {
  animation: 1s blinker linear infinite;
  border-color: red;
}

@keyframes blinker {
  0% {
    transform: scale(1.0);
  }
  50% {
    transform: scale(1.07);
  }
  100% {
    transform: scale(1.0);
  }
}

div.dictationModalContent div.micIcon > i {
  position: absolute;
  top: 23px;
  left: 35px;
  color: silver;
  font-size: 65px;
  animation: none;
}

div.dictationModalContent div.micIcon.isDictating > i {
  color: red;
}

/* rozpoznany text */
div.dictationModalContent div.result {
  margin: 25px 0;

  min-height: 150px;

  font-style: normal;
  font-size: 23px;
  font-weight: 100;
  color: yellow;
  letter-spacing: 1px;
  line-height: 32px;
}

div.dictationModalContent button {
  height: 40px;
  width: 150px;
  margin: 10px 5px;
  font-size: 14px;
}

div.dictationModalContent button.accept:active {
  background-color: #1B5E20;
}

div.dictationModalContent button.cancel {
  background-color: #880000;
}

div.dictationModalContent button.cancel:active {
  background-color: #ff0000;
}

/* overlay na celu obrazovku */
.backgroundOverlay {
  z-index: 1000;
  position: fixed;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.8);
  width: 100%;
  height: 100%;
}

/*formular na vyber datumu, casu - modal window - zarovanie na stred obrazovk */
div.m-input-moment {
  z-index: 2000;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

div.m-input-moment div.m-calendar td.weekend {
  background-color: #f5f5f5;
}

div.m-input-moment div.m-calendar td.weekend:hover {
  background-color: gray;
}

div.m-input-moment div.m-calendar td.today {
  background-color: #ccc;
}

div.m-input-moment div.m-calendar td.current-day {
  background-color: red;
  color: white;
}

div.m-input-moment div.m-calendar div.toolbar button > i {
  font-size: 18px;
  display: block;
}

div.m-input-moment div.m-time {
  padding-top: 5px;
}

div.m-input-moment div.dateInfo {
  margin-left: 10px;
  padding-bottom: 10px;
}

div.m-input-moment div.time-text {
  margin-left: 10px;
}

div.m-input-moment div.showHours,
div.m-input-moment div.showMinutes {
  margin-bottom: 10px;
}

div.m-input-moment div.showHours a.more,
div.m-input-moment div.showMinutes a.more {
  display: block;
  width: 70px;
  margin: 5px;
  background-color: white;
  color: gray;
  box-shadow: none;
  float: right;
  text-align: right;
}

div.m-input-moment div.showHours {
  margin-bottom: 20px;
}

div.m-input-moment div.showHours span.time.small,
div.m-input-moment div.showMinutes span.time.small {
  width: 35px;
  height: 35px;
  margin: 1px;

  background-color: white;
  border: 1px solid dimgray;

  line-height: 35px;
  font-size: 20px;
  color: black;

  cursor: pointer;
}

div.m-input-moment div.showHours span.time.small.active,
div.m-input-moment div.showMinutes span.time.small.active {
  background-color: silver;
}

.crmForm div.existingOpportunities {
  margin: 30px 0;
}

.crmForm div.existingOpportunities li, ul {
  margin: 0;
  padding: 0;
}

.crmForm div.existingOpportunities ul {
  margin-bottom: 10px;
}

.crmForm div.existingOpportunities li {
  list-style: none;
  padding-left: 10px;
  background-color: #ddd;
  line-height: 40px;
  height: 40px;
  margin-bottom: 5px;
}

.crmForm div.existingOpportunities li.related {
  background-color: #fff;
}

.crmForm div.existingOpportunities li > strong {
  font-size: 18px;
  font-weight: 500;
}

.crmForm div.existingOpportunities li > span {
  font-size: 12px;
}

.crmForm div.existingOpportunities button {
  float: right;
  margin-top: 5px;
  margin-right: 5px;
}

.crmForm div.existingOpportunities label {
  font-size: 22px;
}

.CompanyDepartmentForm form.crmForm {
  padding: 0;
  margin: 0;
  padding-bottom: 10px;
}

.CompanyDepartmentForm form.crmForm div.row {
  padding: 10px 20px;
}

.CompanyDepartmentForm.GroupNewForm {
}

.CompanyDepartmentForm.GroupNewForm .List .AccountListItem {
  margin-bottom: 0px;
}

.CompanyDepartmentForm form.crmForm h2.Header.secondary.contact {
  color: #373;
  font-size: 18px;
  border-bottom: 2px solid #373;
  background-color: transparent !important;
  box-shadow: none;
  padding: 0px;
  padding-bottom: 0px;
  margin: 10px 20px;
  margin-bottom: 0px;
}

.CompanyDepartmentForm form.crmForm .FinstatRecommendedContacts {
  margin: 10px 20px;
}

.AddressFormFields div.postalCode-country {
  width: 100%;
  margin-top: 10px;
  overflow: auto;
}

.AddressFormFields div.postalCode-country div.postalCode {
  width: 30%;
  float: left;
}

.AddressFormFields div.postalCode-country div.country {
  width: 65%;
  float: right;
}

.AddressComplete div.suggestedAddress {
  font-size: 12px;
  padding: 3px;
  background-color: #fff;
  cursor: pointer;
}

.AddressComplete div.suggestedAddress:hover {
  background-color: #ddd;
}

.AddressComplete div.suggestedAddress:active {
  color: red;
}

.Footer {
  padding-top: 35px;
  font-size: 12px;
  color: gray;
}

/* logout btn */
.Footer button {
  font-size: 12px;
  font-weight: 300;
  letter-spacing: 0;
  padding: 2px 8px;
  margin-right: 8px;
  margin-bottom: 4px;
}

.LoginForm.crmForm {
  padding-top: 20px;
  margin-bottom: 10px;
  overflow: auto; /* quick&dirty, treba nieco lepsie vymysliet, aby nefloatoval button */
}

/* login btn */
.LoginForm.crmForm button.buttonSubmit {
  margin-top: 25px;
}

.notImplemented {
  color: silver;
  font-size: smaller;
  border-style: dashed;
  border-width: 1px;
  padding: 5px;
}

/* google mapa */
.GoogleMap {
  margin-top: 10px;
}

div.map {
  border: 1px solid silver;
  height: 250px;
  width: 100%;
}

.MapPage div.map {
  height: 560px;
}

.mapLegend ul, .mapLegend li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mapLegend ul {
  paddin-bottom: 20px !important;
}

.mapLegend li {
  padding-bottom: 15px;
}

.mapLegend li > img {
  display: block;
  float: left;
}

.mapLegend li > span {
  line-height: 32px;
}

/* === full calendar === */

.fc {
  margin-bottom: 15px;
}

.fc button {
  font-weight: 300;
}

.fc h2 {
  font-size: 18px;
  font-weight: 500;
  margin: 8px 0;
}

.fc th {
  font-weight: 500;
  background-color: #ECEFF1;
}

.fc .fc-today {
  background-color: #E8F5E9;
}

.fc .fc-past {
  background-color: #FAFAFA;
  color: silver;
}

.fc .fc-state-highlight {
  background-color: #FFF59D;
}

.fc .fc-event {
  border-color: #66BB6A;
  background-color: #66BB6A;
  cursor: pointer;
}

.fc .fc-event:hover {
  border-color: #388E3C;
  background-color: #388E3C;
  color: yellow;
}

.fc-basic-view .fc-body .fc-row {
  min-height: 6em;
}

.fc-day-grid-event .fc-time {
  color: #ddd;
  font-family: arial, sans-serif;
  font-weight: 300;
  font-size: 12px;
}

/* === /full calendar === */

/* DateTimePicker */
.m-input-moment {
  background-color: white;
}

/* growler */

.growler {
  min-height: 55px;
  height: auto !important;
}

.growler ul {
  margin: 15px 0;
}

.growler ul > li {
  line-height: 170%;
}

/* /growler */

/*
 * Google gmail notifier css
 * http://stackoverflow.com/questions/19512507/google-gmail-notifier-css
 */
.notification-container {
  left: 0;
  top: 0;
  margin: 0;
  font-family: arial, sans-serif;
  font-weight: bold;
  visibility: hidden;
  z-index: 1000000; /* growler ma 999999 */
  position: fixed;
  text-align: center;
  width: 100%;
  height: 100%;
}

.notification-message {
  position: relative;
  display: inline-block;
  visibility: visible;
  font-size: 13px;
  padding: 3px 6px;
  min-width: 150px;
  background-color: #f9edbe;
  border: 1px solid #f0c36d;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  margin-top: 2px;
}

.notification-message > span {
  margin: 0 5px;
}

.notification-message small {
  color: gray;
  font-weight: normal;
}

.Notification {
  margin: 0 -20px;
  position: relative;
  z-index: 9999;
}

.Notification .warn {
  padding: 10px;
  background-color: yellow;
}

.Notification .error {
  background-color: red;
  color: white;

  position: relative;
  padding: 20px 10px;

  border: 1px solid black;
  border-bottom: 0px;
}

.Notification div.error:last-child {
  border-bottom: 1px solid black;
}

.Notification .explain {
  margin-top: 5px;
  font-style: italic;
  font-size: 14px;
}

.Notification .explain p {
  margin: 0;
  padding: 0;
  margin-top: 5px;
}

.Notification a.button {
  display: inline-block;
  background-color: red;
  color: white;
  padding: 10px 18px;
  text-align: center;
  font-size: 20px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.22);
}

.Notification a.button i {
  font-size: 120%;
  margin-right: 5px;
}

.Notification a.button span {
  padding-left: 5px;
}

.Notification a.button:hover {
  background-color: #ff3c3c;
}

.Notification div.explain a:hover {
  color: yellow;
}

.Notification div.content {
  padding-right: 20px; /* kvoli close buttonu */
}

.Notification div.closeButton {
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 10px;
}

.Notification div.closeButton i {
  font-size: 14px;
  font-weight: 100;
  font-style: normal;
}

.Notification div.closeButton i:hover {
  color: yellow;
}

.ApiRequestList {
  margin-top: -10px;
  font-size: 12px;
  padding: 3px;
  color: darkgray;
  margin-right: auto;
  margin-left: auto;
  max-width: 600px;
}

.ApiRequestList span.time {
  border-radius: 3px;
  margin: 1px;
  padding: 1px;
  display: inline-block;
  min-width: 60px;

}

.Collapsible {

}

.Collapsible .header {
  cursor: pointer;
}

/* styly ako button, toto resetuje zdedene styly buttonu*/
.Collapsible .header .Header {
  display: block;
}

.Collapsible .header .Header:hover {
  color: yellow;
}

.Collapsible .header .Header i {
  float: right;
  display: block;
}

.Collapsible .header.expanded .Header i {
  transform: rotate(180deg);
}

.Collapsible div.content {
}

.Collapsible div.content.expanded {
}

/* Stranka pridvania Firmy a Prevadzky */
.CompanyDepartmentForm__form {
  display: flex;
}

@media screen and (max-width: 900px) {
  .CompanyDepartmentForm__form {
    display: block;
  }

  .CompanyDepartmentForm__Company {
    flex: 0;
    margin-right: 0px;
    margin-bottom: 20px;
  }
}

.CompanyDepartmentForm__Company {
  flex: 1;
  margin-right: 10px;
}

.CompanyDepartmentForm__Department {
  flex: 1;
}

.CompanyDepartmentForm form.crmForm.accountContainer {
  background: none;
}

.CompanyDepartmentForm form.crmForm.accountContainer div.content {
  margin-top: -15px;
  background: #efefef;
}

.Duplicities {
  display: flex;
  margin-left: -2px;
  margin-right: -2px;
}
@media screen and (max-width: 700px) {
  .Duplicities {
    display: block;
  }
}

.Duplicities__Accounts {
  flex: 1;
}

.Duplicities__Finastats {
  flex: 1;
}

.DuplicitiesSearchResults {
  margin-top: 15px;
  border: 1px solid silver;
  min-height: 85px;
  margin-left: 2px;
  margin-right: 2px;
}

.DuplicitiesSearchResults .SearchResults .LinkItem {
  display: block;
  padding: 5px;
  padding-left: 10px;
  margin: 8px 4px;
  color: #444;
  font-weight: normal;
  font-size: 14px;
  background-color: #ddd;
  border-radius: 4px;
  text-decoration: none;
}

.DuplicitiesSearchResults .SearchResults .LinkItem:hover {
  background-color: #eee;
  border-radius: 4px;
  border-color: #ddd;
  color: #1B5E20;
}

.DuplicitiesSearchResults .SearchResults .noResults {
  padding: 0;
}

.DuplicitiesSearchResults .SearchResults .wait {
  padding: 0;
  margin-top: -8px;
}

.DuplicitiesSearchResults .SearchResults .waitAndNoResultsWrapper {
  min-height: 0;
}

.CompanyDepartmentForm__button {
  margin: 20px auto;
  display: block;
  min-width: 180px;
  min-height: 50px;
  font-size: 19px;
  font-weight: 200;
}

.DepartmentRecommendedContacts{
  padding-left: 10px;
}

.DepartmentRecommendedContacts .Recommended li{
  padding: 8px 8px !important;
  border-radius: 10px;
  background: #fff;
  display: inline-block;
}

.DepartmentRecommendedContacts .Recommended li.selected{
  background: #2E7D32;
  color: white;
  text-decoration: none;
}

.DepartmentRecommendedContacts .Recommended li.selected::before{
}

/* /Stranka pridvania Firmy a Prevadzky */

div.OpportunityStatusDetail {
  margin-left: 20px;
  overflow: hidden;
}

div.OpportunityStatusDetail span.description {
  font-size: 14px;
  color: gray;
  display: inline-block;
  padding: 5px 0;
}

div.opportunityStatuses div.OpportunityStatusDetail label {
  display: block;
  border-radius: 7px;
  font-size: 13px;
  padding: 4px 10px;
  border: 1px solid #2E7D32;
  min-width: 130px;
}

/* OpportunityStatuses */
div.OpportunityStatuses {
  display: flex;
  overflow: hidden;
}

div.OpportunityStatuses div.col1 {
  flex: 1;
}

div.OpportunityStatuses div.col2 {
  align-self: right;
  flex: 1;
}

/* /OpportunityStatuses */

/* Recommended */

ul.Recommended > li {
  display: inline-block;
  text-decoration: underline;
  margin-right: 8px;
  cursor: pointer;
  color: gray;
}

ul.Recommended > li:hover {
  color: inherit;
}

ul.Recommended > li:active {
  color: #3b6e22;
  position: relative;
  top: 1px;
}

/* /Recommended */

/* UserFilter */

.UserFilter {
  padding: 15px;
  margin-bottom: 15px;
}

.UserFilter.active {
  background-color: #FFF59D;
}

/* /UserFilter */

/* AccountForm (add account) */
.AccountForm h3 {
  background: none;
  border: none;
  box-shadow: none;
  color: black;
  padding: 0;
  margin: 5px 0;
  font-weight: bold;
  font-size: 16px;
}

/* /AccountForm (add account) */

/* EditAccountForm */
.EditAccountForm .editAccountForms form.crmForm {
  margin-top: 0px;
  margin-bottom: 15px;
}

.EditAccountForm .editAccountForms .Header {
  margin-bottom: 0px;
}

/* /EditAccountForm */

/* === ModalPage === */

.Application.modalPage {
  max-width: 670px;
  margin-top: 20px;
  padding: 0;
}

.ModalPageWrapper > .Header {
  margin-bottom: 0;
}

.ModalPageContent form.crmForm:first-of-type {
  margin-top: 0;
}

/* zakazat headre v Add-pages
   cez CSS a nie pomocou stavu, aby neprichadzalo k flickeru PO zmene stavu a tesne PRED redirektom */
.Application.modalPage .AddActivityPage > .Header,
.Application.modalPage .AddContactPage > .Header,
.Application.modalPage .AddAddressPage > .Header,
.Application.modalPage .AddDepartmentPage > .Header,
.Application.modalPage .AddCompanyPage > .Header,
.Application.modalPage .AddOpportunityPage > .Header {
  display: none;
}

/* === /ModalPage === */

/* === Finstat === */
button.FinstatInfoButton {
  font-size: 11px;
  font-style: normal;
  margin-bottom: 10px;

  outline: none;
  background-color: #74ad5a;
  border-radius: 3px;
  border: 1px solid #3b6e22;

  display: inline-block;
  cursor: pointer;
  color: #ffffff;

  padding: 0px 4px;
  text-decoration: none;
  letter-spacing: 1px;
}

button.FinstatInfoButton:hover {
  color: #fff;
}

div.FinstatInfo span.status {
  margin: 0 10px;
  padding-bottom: 10px;
  display: inline-block;
}

div.FinstatInfo div.Collapsible > div.header h2.Header {
  font-size: 16px;
  padding: 5px 0px;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #1B5E20;
  border-bottom: 2px solid #1B5E20;
}

div.FinstatInfo {
  margin: 0 0px;
  margin-bottom: 20px;
}

div.FinstatInfo table td {
  white-space: pre-wrap;
  word-break: break-all;
}

div.FinstatContacts,
div.FinstatAddresses {
  padding-bottom: 10px;
  margin-top: -5px;
}

div.FinstatContacts ul.Recommended li,
div.FinstatAddresses ul.Recommended li {
  display: block;
  margin-bottom: 5px;
}

/* === /Finstat === */

/* === formattedObject (finstat) === */
table.formattedObject {
  margin: 0;
  padding: 0;
  font-size: 11px;
}

table.formattedObject {
  margin-bottom: 15px;
}

table.formattedObject td {
  vertical-align: top;
}

/* === /formattedObject === */

/* === Agenda === */

.MyAgendaPage .Header.tertiary {
  margin-bottom: 10px;
}

.tableList,
.AgendaList {
  display: table;
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
}

.tableListItem,
.AgendaListItem {
  display: table-row;
}

.tableListItem.tableListItem--header > .col,
.AgendaListItem.AgendaListItem--header > .col {
  background-color: #eee !important;
  color: gray;
  font-size: 12px !important;
  line-height: 16px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  /* pre sort ikonku: */
  position: relative;
  padding-right: 14px;
}

.tableListItem.tableListItem--header > .col--sorted {
  background-color: rgba(255, 0, 0, 0.2) !important;
}

.tableListItem.tableListItem--header .sortIconWrapper {
  color: red;
  font-size: 165%;
  margin-left: 3px;
  top: 1px;
  position: absolute;
}

.tableListItem > .col,
.AgendaListItem > .col {
  display: table-cell;
  border: 1px solid #ddd;
  /*min-width: 60px;*/
  /*min-height: 25px;*/
  padding: 3px;
  font-size: 14px;
}

.tableListItem > .col--wide,
.AgendaListItem > .col--wide {
  width: 20%;
}

.tableListItem > .col--medium,
.AgendaListItem > .col--medium {
  width: 10%;
}

.tableListItem > .col--narrow,
.AgendaListItem > .col--narrow {
  width: 4%;
}

.tableListItem > .col a,
.AgendaListItem > .col a {
  text-decoration: underline;
  cursor: pointer;
}

.tableListItem > .col--futureActivity a,
.AgendaListItem > .col--futureActivity a {
  color: red;
  font-weight: bold;
}

.tableListItem:hover > .col,
.AgendaListItem:hover > .col {
  background-color: #eeFFee;
}

.tableListItem__icon,
.AgendaListItem__icon {
  color: #388E3C;
  background-color: #ddd;
  border-radius: 30%;
  width: 18px;
  height: 18px;
  text-align: center;
  font-size: 13px;
  padding-top: 2px;
}

/* === /Agenda === */

/* === Add Departmnent === */
.AddDepartmentPage {

}

/* === /Add Departmnent === */

/* === AccountDeleteOverview === */
.AccountDeleteOverview {
  margin-top: 15px;
}

.AccountDeleteOverview__Departments-Header {
  margin-top: 10px;
  margin-bottom: 0px;
  font-weight: bolder;
}

.AccountDeleteOverview__Departments-Content {
  border: 0px solid silver;
  margin-left: 10px;
}

/* === /AccountDeleteOverview === */

.DeleteAccountForm__Status {
  min-height: 300px;
  text-align: center;
  margin-top: 30px;
  font-size: 24px;
}

.DeleteAccountForm button.buttonSubmit {
  background: red;
  text-shadow: 1px 2px black;
}

.AddressInfoInline__action {
  display: inline-block;
  margin: 0 0 0 10px;
  text-decoration: underline;
}

.ContactInfoInline {
  display: block;
  margin-right: 20px;
}

.ContactInfoInline__action {
  margin-right: 10px;
}

@media screen and (max-width: 500px) {
  .ContactInfoInline__action {
    display: block;
    margin: 5px 0;
  }

  .AddressInfoInline a {
    display: block;
  }
}

.ContactInfoInline__icon {
  font-size: 20px;
  margin-right: 3px;
}

.ContactInfoInline__number {
  text-decoration: underline;
}

.ContactInfoInline__name,
.ContactInfoInline__name:hover {
  background: none;
  display: inline-block;
  color: black;
  padding: 0;
  margin: 0;
  border: none;
  box-shadow: none;
  text-decoration: underline;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: normal;
  margin-right: 10px;
}

.ContactInfoInline__name:hover {
  color: #2ea91a;
}

/* === poor man's bootstrap === */

.col-sm-2 {
  float: left;
  width: 19.99%;
}

.col-sm-3 {
  float: left;
  width: 29.99%;
}

.col-sm-4 {
  float: left;
  width: 39.99%;
}

.col-sm-5 {
  float: left;
  width: 49.99%;
}

.col-sm-6 {
  float: left;
  width: 59.99%;
}

.col-sm-8 {
  float: right;
  width: 79.99%;
}

.col-sm-2r {
  float: right;
  width: 19.99%;
}

.col-sm-4r {
  float: right;
  width: 39.99%;
}

.col-sm-5r {
  float: right;
  width: 49.99%;
}

.col-sm-7r {
  float: right;
  width: 69.99%;
}

.row,
.flex-row,
.form-group {
  clear: both;
}

.row:after,
.flex-row:after,
.form-group:after {
  content: "";
  display: table;
  clear: both;
}

.flex-row {
  display: flex;
}

.flex-auto {
  flex: auto;
}

/* === /poor man's bootstrap === */

/* === Test Info === */

.IsTestInfo {
  border: 3px solid red;
  background: yellow;
  color: red;
  margin-left: -20px;
  margin-right: -20px;
  padding: 10px;
}

/* === /Test Info === */

/* desktop size */
@media screen and (max-width: 980px) {
}

/* menej ako desktop size */
@media screen and (max-width: 979px) {
  .MainMenu > ul > li.MainMenu__rest {
    display: none;
  }
}

@media screen and (max-width: 500px) {
  .Application {
    padding-left: 5px;
    padding-right: 5px;
  }

  .MainMenu > ul > li {
    padding: 5px 8px;
  }

  .MainMenu {
    padding: 0;
    margin: 0 -5px;
  }

  .MainMenu i {
    font-size: 45px;
  }

  .MainMenu div.title {
    font-size: 14px;
  }

  .Tabs i {
  }

  .Tabs i {
    display: none
  }

  .Tabs a.buttonAdd {
    min-width: 70px;
    margin: 5px 2px 0px 2px;
    padding: 5px;
    font-weight: 400;
    font-size: 13px;
  }

  h2.Header {
    font-size: 20px;
  }

  div.AddPage h2.Header {
    display: none;
  }

  div.AddPage div.CompanyDepartmentForm h2.Header {
    display: block;
  }

  .OpportunityForm .opportunityTypes {
    display: block;
  }

  .OpportunityForm .opportunityTypes label,
  .OpportunityForm div.opportunityStatuses label {
    margin-right: 0;
  }

  .Notification {
    margin: 0;
  }

  .no-float-mobile {
    float: none;
  }
}

@media screen and (max-width: 600px) {

  .Tabs--accountStatuses .buttonAdd {
    margin-right: 2px !important;
  }

  .Tabs--accountStatuses .buttonAdd i {
    font-size: 26px;
    margin: 3px;
  }

  /* === poor man's bootstrap === */
  .col-sm-2,
  .col-sm-8 {
    float: none;
    width: auto;
  }

  /* === /poor man's bootstrap === */

}

/* mobil na vysku */
@media screen and (max-width: 320px) {

  .MainMenu > ul > li {
    padding: 5px 8px;
  }

  .MainMenu div.title {
    font-size: 12px;
  }

  .Tabs a.buttonAdd {
    min-width: 40px;
    padding: 4px;
  }

  .SearchGlobal {
    margin: 10px 0;
  }

  .SearchPage > .SearchBox {
    margin-top: 10px;
  }

  h2.Header {
    font-size: 17px;
  }

  .Notification {
    margin: 0;
  }

  form.crmForm {
    padding: 8px;
  }

}


.crmid{
  font-size: 12px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: start;
}
label.crmid__label{
 align-self: center;
}

input.crmid__input:focus,
input.crmid__input::selection,
input.crmid__input:disabled,
input.crmid__input{
  align-self: center;
  display: inline-block;
  font-size: 12px;
  border: 0;
  box-shadow: none;
  flex: 0;
  min-width: 235px;
  background: white;
  color: #333333;
  padding: 4px;
  margin: 0;
  outline: none;
}

button.crmid__btnCopy{
  border: 0;
  box-shadow: none;
  background: none;
  display: inline-block;
  padding: 0;
  margin: 0;
  align-self: center;
}

button.crmid__btnCopy i {
    color: #1B5E20;
    padding: 0;
    border: 0;
}

button.crmid__btnCopy i:hover{
  color: black;
}