/*================================================================================
	Item Name: Materialize - Material Design Admin Template
	Version: 4.0
	Author: PIXINVENT
	Author URL: https://themeforest.net/user/pixinvent/portfolio
================================================================================

NOTE:
------
PLACE HERE YOUR OWN CSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */


/* Media queries */


  .widefat tfoot td input[type=checkbox]:before, .widefat th input[type=checkbox]:before, .widefat thead td input[type=checkbox]:before, input[type=checkbox]:checked:before {
      width: 1.73rem;
      height: 1.73rem;
  }

@media only screen and (max-width: 992px) {
  ul.side-nav.leftside-navigation {
    top: 75px !important;
  }
}


.insignia-blue {
  background-color: #32435a;
}
.insignia-blue-text {
  color: #32435a;
}
.insignia-blue-border-bottom {
  border-bottom: 3px solid #32435a !important;
}

.online-lime {
  background-color: #4b8740;
}
.online-lime-text {
  color: #4b8740;
}
.online-lime-border-bottom {
  border-bottom: 3px solid #4b8740 !important;
}

.autumn-glory {
  background-color: #ff8400;
}
.autumn-glory-text {
  color: #ff8400;
}
.autumn-glory-border-bottom {
  border-bottom: 3px solid #ff8400 !important;
}

.red-border-bottom {
  border-bottom: 3px solid #e23333 !important;
}
.grey-border-bottom {
  border-bottom: 3px solid #717171 !important;
}

.white-blue {
  background-color: #798ba0;
}
.silver {
  background-color: #fafafa;
}

html,
body {
  height: 100%;
}

body{
  display: flex;
    flex-direction: column;
}

.login form {
  border: none !important;
}
.js.login input.password-input {
  padding-right: 0px !important;
}
.hide-on-large-only.notifications-icon {
  margin-top: 10px;
  margin-right: 15px;
}
.profile-image-login {
  width: 65%;
  height: auto !important;
}

.card-panel.circool-login {
  transition: box-shadow 0.25s;
  padding: 24px;
  margin: 0.5rem 0 1rem 0;
  border-radius: 10px;
  background-color: #fff;
}

/* Header Styling */
header .brand-logo img {
  height: 42px;
}
header .brand-logo {
  margin: 1px 0;
  padding: 20px 53px;
  line-height: 0;
}
nav {
  color: #fff;
  background-color: #32435a !important;
  width: 100%;
  height: 75px;
  line-height: 65px;
  box-shadow: none;
}
.collection {
  border: none;
}
.admin-tabs-container {
  margin-top: -14px;
}
.admin-tabs-container .admin-tabs {
  background-color: #32435a;
  padding-bottom: 10px;
}
.admin-tabs-container .admin-tabs .tab a.active {
  color: #f9f9f9;
}
.admin-tabs-container .admin-tabs .indicator {
  background-color: #f9f9f9;
}
#main {
  margin-top: 25px;
  position: relative;
  /* z-index: 2; */
}
.navbar-fixed {
  /* z-index: 1 !important; */
}
/* ######################## */

/* User Profile Section Styling */
ul.side-nav.leftside-navigation li:not(.no-padding).user-details {
  background: url(../../images/misch/user-profile-bg-white.jpg) no-repeat center
    center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  margin-bottom: 15px;
  padding: 15px 0 0 15px;
}
ul.side-nav.leftside-navigation li:not(.no-padding) {
  line-height: 55px;
}
.profile-btn .material-icons {
  margin-right: 0px !important;
}
#profile-dropdown-nav .material-icons {
  color: #757575 !important;
  float: right !important;
}
/* ######################## */

/* Sidbar Menu Styling */
.side-nav.leftside-navigation {
  border-top-right-radius: 0px;
}
.btn-floating {
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 0px;
}
.btn-floating:hover {
  background-color: #f5f5f554;
}

.sidebar-collapse {
  position: absolute;
  left: -163px;
}
ul.side-nav.leftside-navigation {
  top: 75px;
  overflow: hidden;
  height: 100%;
}
.side-nav.leftside-navigation {
  background-color: #627692;
}
.side-nav li > a {
  color: #f5f5f5;
}
.side-nav.leftside-navigation li > a > i,
.side-nav.leftside-navigation li > a > [class^="mdi-"],
.side-nav.leftside-navigation li > a li > a > [class*="mdi-"],
.side-nav.leftside-navigation li > a > i.material-icons {
  color: #f5f5f5;
}
.side-nav .collapsible-body,
.side-nav.fixed .collapsible-body {
  background-color: #0003;
}
/* ######################## */

/* Login Styling */
.circool-login .btn:hover,
.circool-login .btn-large:hover {
  background-color: #ffb232;
}

.circool-login input:not([type]):focus:not([readonly]),
.circool-login input[type="text"]:not(.browser-default):focus:not([readonly]),
.circool-login
  input[type="password"]:not(.browser-default):focus:not([readonly]),
.circool-login input[type="email"]:not(.browser-default):focus:not([readonly]),
.circool-login input[type="url"]:not(.browser-default):focus:not([readonly]),
.circool-login input[type="time"]:not(.browser-default):focus:not([readonly]),
.circool-login input[type="date"]:not(.browser-default):focus:not([readonly]),
.circool-login
  input[type="datetime"]:not(.browser-default):focus:not([readonly]),
.circool-login
  input[type="datetime-local"]:not(.browser-default):focus:not([readonly]),
.circool-login input[type="tel"]:not(.browser-default):focus:not([readonly]),
.circool-login input[type="number"]:not(.browser-default):focus:not([readonly]),
.circool-login input[type="search"]:not(.browser-default):focus:not([readonly]),
.circool-login textarea.materialize-textarea:focus:not([readonly]) {
  border-bottom: 1px solid #ff8400 !important;
  box-shadow: 0 1px 0 0 #ff8400 !important;
}

.circool-login .input-field .prefix.active {
  color: #ff8400 !important;
}

.circool-login input:not([type]):focus:not([readonly]) + label,
.circool-login
  input[type="text"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="password"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="email"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="url"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="time"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="date"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="datetime"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="datetime-local"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="tel"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="number"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login
  input[type="search"]:not(.browser-default):focus:not([readonly])
  + label,
.circool-login textarea.materialize-textarea:focus:not([readonly]) + label {
  color: #ff8400;
}

.circool-login [type="checkbox"]:checked + label:before {
  top: -4px;
  left: -5px;
  width: 12px;
  height: 22px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #ff8400;
  border-bottom: 2px solid #ff8400;
  transform: rotate(40deg);
  backface-visibility: hidden;
  transform-origin: 100% 100%;
}

#resetpass-button {
  color: white !important;
}
/* ######################## */

.tabs .tab a:hover,
.tabs .tab a.active {
  background-color: transparent;
  color: #ffbe0d;
}
.tabs .tab a {
  color: #ababab;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 24px;
  font-size: 14px;
  text-overflow: ellipsis;
  overflow: hidden;
  transition: color 0.28s ease;
}
.tabs .indicator {
  position: absolute;
  bottom: 0;
  height: 2px;
  background-color: #ffbe0d;
  will-change: left, right;
}
/*----------------------------------------
    Pre-loader
------------------------------------------*/
#loader-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
}

#loader-wrapper .loader-section {
  position: fixed;
  top: 0;
  width: 51%;
  height: 100%;
  background: #eceff1;
  z-index: 1000;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

#loader-wrapper .loader-section.section-left {
  left: 0;
}

#loader-wrapper .loader-section.section-right {
  right: 0;
}

#loader {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #4b874000 !important;
  background: url("../images/logo/circool-icon.png") no-repeat 50% !important;
  background-size: 95px !important;
  box-shadow: 0px 21px 68px -48px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
  z-index: 1001;
}

#loader:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #4b874000;
  -webkit-animation: spin 3s linear infinite;
  animation: spin 3s linear infinite;
}

#loader:after {
  content: "";
  position: absolute;
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #4b874000;
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}

#loader-logo {
  display: block;
  position: absolute;
  left: 48%;
  top: 46%;
  background: url("images/avatar/avatar-2.png") no-repeat center center;
  z-index: 1001;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.loaded #loader-wrapper {
  visibility: hidden;
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 0.3s 1s ease-out;
  transition: all 0.3s 1s ease-out;
}

.loaded #loader-wrapper .loader-section.section-left {
  -webkit-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.loaded #loader-wrapper .loader-section.section-right {
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.loaded #loader {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.progress {
  background-color: rgba(255, 64, 129, 0.22);
}

/* JavaScript Turned Off */
.no-js #loader-wrapper {
  display: none;
}

/* Right Side Bar */
.right-sidebar-nav .chat-out {
  top: 75px;
}

.tabs.admin-navigation {
  background-color: #fff0;
}

.tab-containers {
  margin-top: 40px;
}

.admin-navigation .tabs .tab a:hover,
.admin-navigation .tabs .tab a.active {
  background-color: transparent;
  color: #32435a;
}

/* Grid adjustments */
.add-col-borders {
  border: 5px solid #fafafa;
}

/* Dropdowns */
.dropdown-content li > a,
.dropdown-content li > span {
  font-size: 16px;
  color: #32435a;
  display: block;
  line-height: 22px;
  padding: 14px 16px;
}

/* Form Elements */
.switch label input[type="checkbox"]:checked + .lever:after {
  background-color: #4b8740;
}
.switch label .lever:before {
  background-color: #4b874052;
}
.switch label input[type="checkbox"]:checked + .lever {
  background-color: #aed0a8;
}
input[type="checkbox"]:checked:not(:disabled) ~ .lever:active::before,
input[type="checkbox"]:checked:not(:disabled).tabbed:focus ~ .lever::before {
  transform: scale(2.4);
  background-color: #4b874052;
}
[type="checkbox"]:checked + label:before {
  top: -4px;
  left: -5px;
  width: 12px;
  height: 22px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #32435a;
  border-bottom: 2px solid #32435a;
  transform: rotate(40deg);
  backface-visibility: hidden;
  transform-origin: 100% 100%;
}

[type="radio"]:checked + label:after,
[type="radio"].with-gap:checked + label:after {
  background-color: #32435a;
}

[type="radio"]:checked + label:after,
[type="radio"].with-gap:checked + label:before,
[type="radio"].with-gap:checked + label:after {
  border: 2px solid #32435a;
}

/* Tables */
td,
th {
  border-radius: 0px;
}
table.dataTable thead th,
table.dataTable thead td {
  padding: 10px 18px;
  border-bottom: 1px solid #686868;
}
table.dataTable.display tbody td {
  border-top: 15px solid #f9f9f9 !important;
  padding: 30px;
}

/* Send Invites Modal */
#sendinvites .invite-form {
  background: white;
  padding-top: 30px;
  padding-bottom: 30px;
}

#sendinvites .chip-group {
  background: rgb(255, 255, 255);
  padding: 15px 0px 10px 15px;
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
  margin-bottom: 10px;
}

#sendinvites .chip .material-icons {
  height: 24px;
  width: 24px;
  float: left;
  margin: 3px 0px 0px -8px;
}

#sendinvites .recipient-added {
  color: #00bcd4;
  float: right;
  margin: 5px 5px 0px 5px;
}

.valign-wrapper-grid {
  display: grid !important;
  align-items: center !important;
}
.valign-wrapper-flex {
  display: flex !important;
  align-items: center !important;
}
.seperator-autumn-glory {
  border-right: 1px solid #ff8400;
}

.bottom-sheet .btn {
  background-color: #32435a;
  display: block;
}
.modal {
  background: #f5f5f5 !important;
}
.modal.bottom-sheet {
  max-height: 60%;
}
a.modal-trigger.event-options {
  color: inherit !important;
}

.circle.user-selfie {
  border: 9px solid #ff8400;
}

.container.login-registration {
  margin-top: 24px;
  width: 90%;
}

.btn.fullwidth {
  display: block;
}

.more-btn-circle {
  border: 1px solid;
}

.user-event-card {
  margin-bottom: 15px;
}

/* Modified Modal Screens */
.bottom-sheet.user-event-modal {
  top: 0;
  max-height: 100%;
}
.bottom-sheet.guest-invitation-modal {
  top: 0;
  max-height: 100%;
}
.bottom-sheet.event-code-scanner {
  top: 0;
  max-height: 100%;
}
.bottom-sheet.user-attendance-response-modal {
  max-height: 65%;
}

.tab-containers .row.item-cards {
  margin-bottom: 0px;
}
.user-event-card .modal-close,
#user-ticket-modal .modal-close {
  font-size: 40px;
}

.user-event-tabs-container {
  margin: 15px auto;
}
.user-event-tabs-container .user-event-tabs {
  padding: 0;
}
.user-event-tabs-container .user-event-tabs .user-event-tabs-navigation .tab a {
  font-size: 12px;
  padding: 0;
}
.user-event-tabs-container .tab-containers {
  margin-top: 20px;
}
.user-event-tabs-container .tab-containers .btn {
  padding: 0;
}
.user-event-tabs-container .post-container {
  margin-bottom: 10px;
}
.user-event-tabs-container .activity-post {
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  margin-bottom: 0;
}
.user-event-tabs-container .activity-comment {
  padding-left: 4% !important;
  padding-right: 4% !important;
  margin-bottom: 0;
  background: white;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.user-event-tabs-container .activity-comment .col {
  margin-bottom: 10px;
}
.user-event-tabs-container .activity-comment p {
  margin: 0;
}
.user-event-tabs-container .activity-comment .social-actions {
  margin: 0;
}
.user-event-tabs-container .activity-comment .social-actions .col {
  border-top: 1px solid #f5f5f5;
}
.user-event-tabs-container .activity-comment .social-actions .col p {
  color: #6b6b6b;
  margin: 10px 0 0 0;
}
.user-event-details-icon {
  margin: 0 auto;
  line-height: 40px;
  font-size: 18px;
  width: 40px;
  height: 40px;
  text-align: center;
}

#user-ticket-modal {
  max-height: 85%;
}
#user-ticket-modal .user-selfie {
  margin-bottom: 0;
}
#user-ticket-modal .user-selfie img {
  margin-bottom: 20px;
}
.user-account-form {
  margin: 24px 15px;
}
.attendance-response-icons {
  font-size: 50px;
}

.guest-invitation-modal .event-location-details,
.guest-invitation-modal .event-contact-details,
.guest-invitation-modal .event-calendar-details,
.guest-invitation-modal a {
  color: #666b71;
}

.guest-invitation-modal .row-btn,
.user-event-modal .row-btn {
  border-radius: 8px;
  background-color: white;
  color: #666b71;
  /* valign-wrapper */
  display: flex !important;
  align-items: center !important;
  /* padding-2 */
  padding: 2% !important;
  /* z-depth-1 */
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12),
    0 3px 1px -2px rgba(0, 0, 0, 0.2);
}

.row-btn.demo-portal-btn {
  border-radius: 8px;
  background-color: white;
  color: #666b71;
  /* valign-wrapper */
  display: flex !important;
  align-items: center !important;
  /* padding-2 */
  padding: 7% !important;
  /* z-depth-1 */
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12),
    0 3px 1px -2px rgba(0, 0, 0, 0.2);
}

.row-btn.invitation-btn {
  border-radius: 8px;
  background-color: #949494;
  color: white;
  /* valign-wrapper */
  display: flex !important;
  align-items: center !important;
  /* padding-2 */
  padding: 4% !important;
}

.print-scan-btn {
  padding: 7% !important;
}

.card-panel.attendees-status {
  padding: 24px 0;
  margin: 0.5rem 0 1rem 0;
  border-radius: 2px;
  background-color: #fff;
  display: inline-block;
  width: 100px;
  text-align: center;
}

.card-panel.attendees-status span {
  font-size: 1.5em;
}

.card-panel.attendees-status.sent {
  border-bottom: 7px solid #32435a !important;
}
.card-panel.attendees-status.yes {
  border-bottom: 7px solid #4b8740 !important;
}
.card-panel.attendees-status.maybe {
  border-bottom: 7px solid #ff8400 !important;
}
.card-panel.attendees-status.no {
  border-bottom: 7px solid #e23333 !important;
}
.card-panel.attendees-status.pending {
  border-bottom: 7px solid #717171 !important;
}

/* ################################################################### */

#login h1 a {
  background-image: url("../images/logo/full_logo.png");
  background-size: contain;
  width: 200px;
  margin: 0 auto 0;
}
.login form {
  box-shadow: none;
  padding: 20px;
  margin: 0px;
}
#login {
  background: #fff;
  border-radius: 10px;
  /* margin: 50px auto; */
  padding: 40px 20px;
  width: 350px;
  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
    0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.3);
}
.login label {
  color: #555;
  font-size: 14px;
}
.login form .forgetmenot {
  float: none;
}
#login form p.submit {
  margin-top: 15px;
}
.login.wp-core-ui .button-primary {
  background: #32435a;
  border-color: #32435a;
  box-shadow: 0 1px 0 #32435a;
  color: #fff;
  text-shadow: none;
  float: none;
  clear: both;
  display: block;
  width: 100%;
  padding: 7px;
  height: auto;
  font-size: 15px;
}
.login #login_error,
.login .message,
.login .success {
  border-left: 4px solid #32435a;
}

/* p#backtoblog {
  display: none;
} */

.login-action-checkemail #backtoblog,
.login-action-checkemail .message{
    display:block;
}

.login form input[type="checkbox"] {
  position: relative !important;
  opacity: 100% !important;
}

#login-page.row {
  max-width: 350px !important;
}

input[type="checkbox"],
input[type="radio"] {
  border: 1px solid #b4b9be;
  background: #fbfbfb;
  color: #555;
  clear: none;
  cursor: pointer;
  display: inline-block;
  line-height: 0;
  height: 20px;
 
  outline: 0;
  padding: 0 !important;
  text-align: center;
  vertical-align: middle;
  width: 20px;
  min-width: 20px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  transition: 0.05s border-color ease-in-out;
}

.login .forgetmenot label, .login .pw-weak label {
    line-height: 2.2;
}


.tag span {
  padding-left: 25px !important;
  font-size: 0.85rem !important;
}

.tag label {
  padding-left: 10px;
  font-size: 14px;
  color: #000;
}

#divCheckPassword {
  padding-left: 45px;
}
#divCheckPasswordLength {
  padding-left: 45px;
}
.add-button {
  position: absolute;
  top: 1px;
  left: 1px;
}
#ios-download-container{
  opacity:0;
  max-width: 370px;
  border-radius:10px;
  background-color:#f2f8ff;
  padding:15px;
  margin:15px auto;
  margin-bottom:25px;
  display: flex;
  align-items: center;
  justify-content: center; 
  text-align: center; 
  -webkit-box-shadow: 0px 5px 15px 5px rgba(0,0,0,0.16); 
box-shadow: 0px 5px 15px 5px rgba(0,0,0,0.16);
}

#ios-download-container img {
  margin: 0 3px;
  position: relative;
  top: 9px;
}
.arrow-down {
  width: 0; 
  height: 0;
  margin:0 auto;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 20px solid #f2f8ff;
  position: absolute;
  left: 48%;
  margin-top: 95px;
}

[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    /* position: absolute; */
    /* opacity: 0; */
     pointer-events: initial !important; 
}

.input-field .prefix {
    position: absolute;
    width: 3rem;
    font-size: 1.5rem;
    -webkit-transition: color .2s;
    transition: color .2s;
    top: -7px;
	  left: 0px;
}

#registration_notice{
  box-shadow: 1px 0px 3px 0px rgb(0 0 0 / 25%) !important;
}