/******************************************************
  Style css is for giving style for of the website
  template including but not limited to

  - background-color
  - font color
  - font-family
*******************************************************/
/* Constants */
html,
body {
  background-color: #ededed;
  font-family: 'Roboto', Serif;
}
.page-header {
  border-bottom: solid 3px #c8c8c8;
}
.page-header h1 {
  color: #8f8f8f;
  font-weight: 300;
}
#header .app-header-nav {
  background-color: #363636;
}
#header .app-header-menu {
  background-color: #4a4a4a;
  border-top: 1px solid #808080;
  border-bottom: 1px solid #808080;
  font-weight: 300;
}
#header .app-header-menu .app-header-menu-list {
  border-left: 1px solid #808080;
}
#header .app-header-menu .app-header-menu-list .app-header-menu-list-item {
  text-transform: uppercase;
  text-decoration: none;
  border-left: 1px solid #5f5f5f;
  border-right: 1px solid #808080;
}
#header .app-header-menu .app-header-menu-list .app-header-menu-list-item.selected {
  background-color: #363636;
}
#header .app-header-menu .app-header-menu-list .app-header-menu-list-item.selected a {
  color: #ffd142 !important;
}
#header .app-header-menu .app-header-menu-list .app-header-menu-list-item a {
  color: #ffffff;
  text-decoration: none;
}
#header .app-header-menu .app-header-menu-list .app-header-menu-list-item a:hover {
  background-color: #363636;
}
#main {
  background-color: #ededed;
  color: #4a4a4a;
  font-family: 'Roboto', Serif;
}
#main a {
  color: #2aa386;
  font-weight: 500;
}
#main form .required:after {
  content: "*";
  color: #ff0000;
  top: -12px;
  right: 5px;
  position: relative;
}
#main .disabled-field {
  opacity: 0;
}
#main .account-page .account-page-title {
  color: #8f8f8f;
  font-weight: 300;
  border-bottom: 3px solid #c8c8c8;
}
#main .account-page .account-page-body .account-sub-settings {
  line-height: 24px;
}
#main .account-page .account-page-body .account-sub-settings .username-note {
  color: #000000;
  font-weight: 500;
}
#main .account-page .account-page-body form input {
  background-color: #ffffff !important;
  border: 1px solid #cacaca;
  color: #4a4a4a;
  font-family: "Open Sans", Sans-serif;
  text-shadow: 1px 1px 0px #ffffff;
}
#main .account-page .account-page-body form input:focus {
  outline: none;
}
#main .account-page .account-page-body form .submit-button {
  cursor: pointer;
  background-color: #ffd142;
  color: #363636;
  font-size: 17px;
  font-weight: 400 !important;
  border: none;
}
#main .account-page .account-page-body form .submit-button:hover {
  background-color: #ffc923;
}
#main .account-page .account-page-body form .error-field input {
  border: 1px solid #ff0000;
}
#main .account-page .account-page-body form .success-field input {
  border: 1px solid #5bb75b;
}
#main .account-page .account-page-body form .custom-error-message {
  color: #ff0000;
}
#main .account-page .account-page-body form .custom-success-message {
  color: #5bb75b;
}
#main #settings .settings-section .settings-content-header,
#main #settings .settings-section .linked-sites-content-header {
  color: #4a4a4a;
  border-bottom: solid 3px #c8c8c8;
}
#main #settings .settings-section .settings-subheading {
  color: #4a4a4a;
}
#main #settings .settings-section .settings-section-content .user-settings-field .user-settings-value {
  color: #3a3a3a;
}
#main #settings .settings-section .settings-section-content .user-settings-field .edit-user-settings {
  font-weight: 500;
  text-decoration: none;
}
#main #settings .settings-section .settings-section-content .user-settings-field .user-emails-status {
  color: #4a4a4a;
  font-weight: 300;
  font-style: italic;
}
#main #settings .settings-section .settings-section-content .user-settings-field .user-emails-status a {
  font-weight: 300 !important;
}
#main #settings .settings-section .settings-section-content .add-user-email form button {
  background: -webkit-linear-gradient(top, #ffffff 43%, #d7d7d7 100%);
  border: 1px solid #ededed;
  color: #363636 !important;
  text-shadow: 1px 1px 0px #ffffff;
}
#main #media_library .media-library-header {
  border-bottom: solid 3px #c8c8c8;
}
#main #media_library .media-library-header h1 {
  color: #8f8f8f;
  font-weight: 300;
}
#main #confirmation_page .confirmation-page-title {
  border-bottom: 3px solid #c8c8c8;
  color: #8f8f8f;
  font-weight: 300;
}
#footer {
  background-color: #363636;
  color: #dddddd;
}
#footer .app-footer-nav a {
  color: inherit;
  text-decoration: none;
}
#footer .app-footer-nav a:hover {
  color: #ffffff;
}