@import 'open-sans-fonts.css';

html { overflow: auto; font-size: 11px; }

body {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
}

body, button, input, select, textarea, h1, h2, h3, h4,a, p, div, span, li, ul, ol { font-family:'Open Sans', sans-serif; }

.container-fluid{padding-right: 0 !important; padding-left: 0 !important; margin-right: 0; margin-left: 0; }

a { color: #00B7FF; }
.bluedotColor{ color: #429bd5 !important; }
.whiteColor{ color: #fff; }
.login-welcome{ margin-top: 9%; }
.signUpCompleteHeading{ color: darkgreen; }
.displayBlock { display: block; }
.displayNot { display: none;}
.uppercase { text-transform: uppercase; }
.capitalize { text-transform: capitalize; }

.portalFooter{ background-color: #2E2E2E; padding: 1% 0 1% 0;}
.footerStyles, .footerStyles a { font-size: 15px; font-weight: normal; color: #fff !important; margin-top: 10px;}
.footerStyles li{ margin-right: 4%; }
.footerStyles span { font-size: 12px; margin: 1%; }

#mainContent {
  height: 100vh;
  background-color: #f8f8f8;
  background: linear-gradient(0deg, rgba(201,207,215,1) 0%, rgba(249,249,249,1) 50%);
}
.mainContentBody > h1 { margin: 110px 0px 20px 0; font-weight: bold; font-size: 2em; }


.portalLogo { margin: 10px 10px 23px 10px; cursor: pointer; display: flex; align-items: center; }
.portalLogo h4 { margin: 7px 0 0 10px; color: #6b6b6b;  }

.forgot-password { margin: 3% 0; font-style: italic; cursor: pointer; text-decoration: underline; }
.confirmUser { cursor: pointer; }
.confirmUser input{ height: 15px !important; }

.navbar-default{ background-color: #fff !important; }

.user-forms { background-color: rgba(255, 255, 255, 0.6); width:45%;
  max-width:585px; margin:0 auto 75px; position:relative; padding: 15px 40px; top:50px;
  -webkit-box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.3); -moz-box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.3); box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.3);
}

.user-forms h2 {font-size: 2em; font-weight: bold; color: #545454; margin-bottom: 40px;}
.user-forms .form-group label {text-align: left; margin-bottom: 4px; color: #545454; font-weight: normal; font-size: 18px;}
.user-forms button {color: #fff; margin: 15px 0px; background-color: #0091df; height: 50px; width:100%; border-style: none; font-size: 18px;
-webkit-box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.3); -moz-box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.3);
box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.3); }
.user-forms .btn-cancel {background-color: #b1b1b1; }
.user-forms button:hover {color: #fff; -webkit-box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.5); box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.5); }
.user-forms a > p {margin: 15px 0px; font-style: italic; text-align: center; font-size: 16px;}
.user-forms a > p:hover {color: #079FF0; }
.user-forms input { height: 50px; font-size: 18px;}
.remember-me { height: auto !important; }

/*Main Div*/
.mainDiv { width: 100%; background-color: #e7e7e7; color: #000; min-height: 920px; z-index: 1; top: 67px; right: 0; position: absolute; padding-bottom: 2%; overflow-x: initial; }
.ssoMainDiv { top: -10px; z-index: 9; }
.mainDiv-iframe { width: 100%; background-color: #e7e7e7; color: #000; min-height: 920px; z-index: 1; right: 0; position: absolute; overflow-x: initial; }
.ssoMainDiv-iframe { z-index: 9; }
.mainDivHeading { padding: 2% 0 2% 2%; border-bottom:1px solid #a9a9a9; }
.mainDivHeading p { font-size: 24px; color: #429bd5;}
.mainDivBody { margin-top: 1%; }
.content-margin { padding: 1%; }
.dashboard-user { width: 97%; margin: 0 auto 75px; position: relative; top: 50px; }
.dashboard-sso-user { top: -50px; width: 100%; position: relative; }
.dashboard-sso-user-iframe { width: 100%; position: relative; }
.navbar-iframe { margin-bottom: 0 !important; }
.mainDivSubmit{ float: right; color: #fff; background-color: #429bd5; font-size: 16px; padding: 15px; }
.questionsDiv{ float: left; width: 100%; }
.questionLabel{ display: block; }
.resource-center-main-label { font-weight: 600; width: 100%; }

.errorMessage { color: #B22222; margin-bottom: 3%; text-align: center }
.errorMessageSmall { font-size:60% }
.noteMessage { color: #B22222; text-align: center; }
.successMessage { color: #fff; background-color: rgba(24, 142, 67, 0.8); padding-top: 10px; padding-bottom: 10px; border-radius: 5px; text-align: center; }
.header-button-styles { margin-right: 8%; float: right; }

.mainContentBody{overflow: hidden; padding-bottom: 20%; margin-top: 2%; }
.mainContentBody-iframe{overflow: hidden; padding-bottom: 20%; }

/*Admin Portal styles*/
.navbar-inverse { background-color: #454545 !important; border-color: #454545 !important; border-radius: 0 !important;}
.admin-portal-nav { background-color: #454545; }
.admin-portal-nav li { cursor: pointer; font-size: 12px; letter-spacing: 1.5px; }
.all-customers-search { font-size: 18px; background-color: #fff; padding: 20px; display: flex; align-items: center; justify-content: space-around; }
.all-customers-search label { color: #000; font-weight: 500; margin-right: 1%; }
.all-customers-search span { background-color: #cecece; padding: 10px; text-align: center; border-bottom-right-radius: 5px; border-top-right-radius: 5px; cursor: pointer; }
.all-customers-search input { font-size: 22px; display: inline; padding: 20px 10px; }
.all-customers-search button { margin-left: 1%; }

.mainDivBody { margin-top: 3%; margin-left: 1%; }
.mainDivBody-iframe { margin-left: 1%; }

.admin-top-nav { letter-spacing: 1.5px; border-radius: 0; background-color:#454545; margin-top:10px;}
.admin-top-nav ul { width: 100%; padding: 10px; }
.admin-top-nav span {margin-right: 5%; }
.admin-top-nav-iframe { letter-spacing: 1.5px; border-radius: 0; background-color:#454545; }
.admin-top-nav-iframe ul { width: 100%; padding: 10px; }
.admin-top-nav-iframe span {margin-right: 5%; }
.display-all-customers { display: flex; flex-direction: column; padding-inline-start: 0px; }
.display-all-customers ul { float: left; display: block; width: 99%; }
.display-all-customers li { background-color: #fff; border-bottom:1px solid #d9d9d9; padding: 25px; text-align: center; float: left; width: 100%; display: block; cursor: pointer; word-break: break-all;}
.display-inactive-customers { margin-left: 5px; }
.cust-info-heading { margin-top: 2%; }
.cust-info-heading div { color: #429bd5; font-size: 18px; background-color: #fff; text-align: center; cursor: pointer; }
#show-delete-container { color: #000000; font-size: 12px;}
.payment-history-date label { width: 20%; display: inline; }
.payment-history-date input { width: 70%; display: inline; }
.payment-history-details { float: left; width: 100%; }
.payment-history-search span { font-size: 22px; }

/*Each Customer*/

.customers-navbar { background-color: #ffffff; padding: 25px; float: left; width: 100%; font-size: 22px; height: 100px; margin-bottom: 1%; }
.customers-navbar label { display: inline-block; color: #454545; font-weight: 400; padding-top: 8px; }
.customers-navbar button { background-color: #4b88b1; border: none; border-radius: 5px; color: #ffffff; display: inline; font-size: 12px; letter-spacing: 2px; margin-right: 1.1%; padding: 1.5%; text-align: center; width: 18%; }
.customers-navbar button:hover { background-color: #429bd5; }
.customers-navbar p { display: inline;}
.customer-navbar_buttons { display: flex; justify-content: flex-end; }

.each-customer-info { background-color: #ffffff; float: left; width: 100%; padding: 25px; margin-bottom: 2%; }
.each-customer-info .accountActive { text-align: center; }
.each-customer-info > div { padding-right: 100px; }

.personal-info { border-right: solid 1px #f5f5f5; }
.personal-info label { color: #0968A6; font-weight: 600;}
.personal-info p { font-size: 20px; color: #828282;  word-break: break-all;}

/* Active and Inactive */
.active-inactive { width:20px; height:20px; /*padding: 3px;*/ border-radius: 100%; color: white; text-align:center; padding-right: 20px !important; }
.active-color { background: #7DB787; }
.inactive-color { background: #E87F72; }

/* Switch Button Starts Here */

.switch { margin-top: 20%; }
.cmn-toggle { position: absolute; margin-left: -9999px; visibility: hidden; }
.cmn-toggle + label { display: block; position: relative; cursor: pointer; outline: none; user-select: none; }
input.cmn-toggle-round + label { padding: 2px; width: 60px; height: 30px; background-color: #dddddd; border-radius: 30px;}
input.cmn-toggle-round + label:before, input.cmn-toggle-round + label:after { display: block; position: absolute; top: 1px; left: 1px; bottom: 1px; content: ""; }
input.cmn-toggle-round + label:before { right: 1px; background-color: #f1f1f1; border-radius: 30px; transition: background 0.4s; }
input.cmn-toggle-round + label:after { width: 30px; background-color: #fff; border-radius: 100%; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); transition: margin 0.4s; }
input.cmn-toggle-round:checked + label:before { background-color: #8ce196; }
input.cmn-toggle-round:checked + label:after { margin-left: 30px; }
/* Switch Button Ends Here */

.customer-statistics .row { margin-left: 0.1%; }
.customer-statistics .card { background-color: #ffffff; margin-bottom: 2%; margin-right: 4.98%; width: 21%; text-align: center; padding: 0px;}
.customer-statistics .card:last-child  { margin-right: 0px; }
.customer-statistics .card h4 { color: #8e8e8e; font-size: 30px; font-weight: 800; padding: 10% 5%; }
.customer-statistics .card label { color: #ffffff; font-size: 15px; padding: 15px 0px; }
.customer-statistics .card-label { background-color: #2CC5B6; width: 100%; }
.end-users-stats { background-color: #fff; margin: 0px 5px !important; padding-bottom: 50px;}
.end-users-graph { padding-left: 0 !important; }

.customer-rules-request-table { background-color: #ffffff; height: 100%; padding: 20px 50px !important;}
.customer-rules-request-table .row { margin: 0; }
.customer-rules-request-table h3 { text-align:  center; margin-bottom: 60px; }
.customer-rules-request-table h5 { border-bottom: solid 1px #8A8A8A; color: #8A8A8A; font-weight: 600; margin: 30px 0px; padding-bottom: 10px;  }
.customer-rules-request-table p { font-size: 16px;   }

.customer-mau .monthInput input { height: 34px; padding: 6px 12px; border-radius: 4px; }
.customer-mau .monthInput input::placeholder { color: white }

.box-label { color: #3b3b3b; padding: 2rem 0; font-size: 19px; font-weight: 600; }
.add-margin-bottom { margin-bottom: 1%; }
.add-more-margin-bottom { margin-bottom: 2%; }
.modal-content p {font-size: 18px; margin: 5px;}
.modal-content h4 { font-size: 24px; margin: 5px; font-weight: 400; text-align: center; }

.BlueConnectHeader { width: 100%; display: flex; align-items: center; float: left; }
.BlueConnectHeaderLogo { width: 49%; display: inline; padding-top: 10px; }
.BlueConnectHeaderMessage { width: 49%; display: flex; align-items: center; }
.BlueConnectHeaderMessage span { width: 79%; display: inline; float: left; font-size: 18px; text-align: end; text-transform: capitalize; }
.BlueConnectHeaderMessage div { width: 19%; display: inline; float: right; margin-top: 5px; }
.add-top-margin {margin-top: 10px; }

/*General Stats*/
.general-stats-charts { font-size: 22px; width: 100%; padding: 25px; color: #fff; font-weight: 400; background-color: #4da6c7; }
.general-stats-charts .chart-title { font-weight: 400; font-size: 14px; letter-spacing: 2px; width: 100%; margin-top: 15px;}
.general-stats-charts label { font-weight: normal; font-size: 12px; letter-spacing: 0px; width: 100%; white-space: nowrap;}
.general-stats-charts span { display: inline; margin-right: 10px; font-size: 16px; }
.general-stats-charts select { background: #4da6c7; color: #fff; border: 1px solid #fff;}
.general-stats-charts input  { background: #4da6c7; color: #fff; border: 1px solid #fff;}
.general-stats-charts select:focus, .general-stats-charts input:focus { outline-width: 0; box-shadow: none; border-color: #fff;}
.general-stats-charts input[type="date"]::before { content: attr(placeholder) !important; margin-right: 4000px; white-space: nowrap;}
.general-stats-charts input[type="date"]:focus::before, .general-stats-charts input[type="date"]:valid::before {  content: " " !important; margin-right: 5px; }
.general-stats-charts ::-webkit-calendar-picker-indicator:hover { background: rgba(0,0,0,0.1); }
.general-stats-charts ::-webkit-inner-spin-button { display: none; }
.general-chart-main { background-color: #fff; border: 1px solid #c4c4c4; padding-top: 29px;}
.general-stats-per-graph { font-size: 36px; color: #808080; }
.common-chart-stats { background-color: #fff; padding: 15px 0; }
.rulesRequest-chart { padding-top: 0; max-height: 340px;}
.rulesRequest-chart > div {max-height: 15px; padding-right: 10px;}

/* MAU Month selector styling */
.calendar-container { color: grey; }
.selected_date_mp { color: #429BD5; }
.selected-cell { background-color: #429BD5; }
.col_mp:hover { background-color: #429BD5; }
/* End of MAU Month selector styling */


/* Inactive Users Section & Button */
.inactive-customers { background-color: #f2f2f2; padding: 10px; margin-top: -55px; margin-right: 15px; float: right; width: 18%;}
.inactive-customers .switch { display: inline-block; margin-top: 0; vertical-align: middle; horiz-align: center; }
.inactive-customers p { display: inline; vertical-align: middle; margin: 0 10%; }
.cmn-toggle-1 { position: absolute; margin-left: -9999px; visibility: hidden; }
.cmn-toggle-1 + label { display: block; position: relative; cursor: pointer; outline: none; user-select: none; }
.monthEntryDate { font-weight: bold }
input.cmn-toggle-round-1 + label { padding: 2px; width: 44px; height: 22px; background-color: #dddddd; border-radius: 22px;}
input.cmn-toggle-round-1 + label:before, input.cmn-toggle-round-1 + label:after { display: block; position: absolute; top: 1px; left: 1px; bottom: 1px; content: ""; }
input.cmn-toggle-round-1 + label:before { right: 1px; background-color: #f1f1f1; border-radius: 22px; transition: background 0.4s; }
input.cmn-toggle-round-1 + label:after { width: 22px; background-color: #fff; border-radius: 100%; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); transition: margin 0.4s; }
input.cmn-toggle-round-1:checked + label:before { background-color: #8ce196; }
input.cmn-toggle-round-1:checked + label:after { margin-left: 22px; }
/* END of Inactive Users Section & Button */

/* Customer Projects */
.customer-projects-table { background-color: #ffffff; color: #434343; font-size: 20px; text-align: center; width: 100%; }
.customer-projects-table tbody tr td:last-child { font-size: 14px; text-transform: uppercase; letter-spacing: 2px; }
.customer-projects-table tbody tr td a { color: #0968A6;  padding: 0 10px;}
.customer-projects-table tbody tr td a:hover { text-decoration: none; color: #0B78A6; cursor: pointer; }
.customer-projects-table tr { border-bottom: solid 1px #e4e4e4; }
.customer-projects-table th { text-align: center; padding: 30px 0; font-size: 13px; text-transform: uppercase; letter-spacing: 2px; }
.customer-projects-table td { padding: 30px 10px; }
/* END Customer Projects */

/* Edit Project */
.edit-project-container { background-color: white; margin-top: 150px; padding: 25px; }
.edit-project-container h4 { width: 100%; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #e4e4e4;  }
.edit-project-container .use-case-type-section { display: flex; margin-bottom: 20px; }
.edit-project-container .use-case-type-section h5 { font-weight: 600; margin-right: 10px; }
.edit-project-container .submit-button { width: 100%; margin-top: 50px; padding-top: 20px; border-top: 1px solid #e4e4e4; }
.edit-project-confirmation-modal { margin: 10px 0; }
.edit-project-confirmation-modal .flex { display: flex; }
.edit-project-confirmation-modal p { text-transform: capitalize; }
/* END Edit Project */

/* Customer Reports */
.customer-reports .dates-container { background-color: white; margin-top: 10px; padding: 25px; display: flex; align-items: center; }
.customer-reports .dates-container h4 { margin-right: 100px; }
.customer-reports .select-projects { background-color: white; margin-top: 25px; padding: 25px; }
.customer-reports .projects-list {  display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; border-top: solid 1px #f4f4f4; padding-top: 25px; }
.customer-reports .project-item { margin-bottom: 20px; display: flex; cursor: pointer; align-items: center;}
.customer-reports .project-item:hover { color: #6E6E6E }
.customer-reports .project-item input[type=checkbox] { margin-right: 15px; margin-top: 0; }
.customer-reports .project-item p { font-size: 16px; margin: 0; }
.customer-reports .generate-report-button { float: right; margin-top: 15px; }

/* END Customer Reports */

.no-max-width{ max-width: none; }
.tfa-token { margin-top: 3%; }
.token-para { margin-top: 3%; }

.customer-logins-main-div { float: left; width: 100%; }
.add-login { margin-bottom: 1%; }
.bd-overlay { /*width: 600px; top: 25%; left: 25%; border: 1px solid #e5e5e5;*/ padding: 20px; }
.overlay-form { padding: 40px; }
.cursor-pointer { cursor: pointer; }

/* Spinner */
.spinner {
  display: inline-block;
  width: 25px;
  height: 25px;
  border: 3px solid rgba(66, 155, 213, .3);
  border-radius: 50%;
  border-top-color: rgba(66, 155, 213, 1);
  -webkit-animation: spin 1s ease-in-out infinite;
  animation: spin 1s ease-in-out infinite;
}

/* SSO Iframe */
.iframe-styles {
    border: none;
    height: calc(100vh - 80px);
    width: 100vw;
}

@keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}

.spinner-wrapper { display: flex; align-content: center; justify-content: center; padding: 12.5rem 0; background-color: white }

/* END Spinner */


@media screen and (max-width:1850px){
    .personal-info p { font-size: 18px;}
    .inactive-customers { width: 20%;}
}

@media screen and (max-width: 1740px){
    .general-stats-charts input, select > option { font-size: 12px;}
    .general-stats-charts input::-webkit-input-placeholder { font-size: 14px; /* Chrome/Opera/Safari */ }
    .general-stats-charts input::-moz-placeholder { font-size: 14px; /* Firefox 19+ */ }
    .general-stats-charts input:-ms-input-placeholder { font-size: 14px; /* IE 10+ */  }
    .general-stats-charts input:-moz-placeholder { font-size: 14px; /* Firefox 18- */}
}

@media screen and (max-width:1560px){
    .customers-navbar button { font-size: 12px; padding: 1%;}
    .personal-info p { font-size: 15px;}
    .personal-info label { font-size: 12px;}
    .inactive-customers { width: 25%;}
}

@media screen and (max-width:1400px){
    .user-forms {width: 100%;}
}

@media screen and (max-width: 1300px){
    .customers-navbar button { font-size: 10px; padding: 1%; height: 41px;}
    .customer-statistics .card h4 { font-size: 26px;}
    .customer-statistics .card label { font-size: 13px;}
    .inactive-customers { width: 28%;}
}

@media screen and (max-width:1260px){
   .user-forms {width: 100%;}
   .user-forms h2 {font-size: 1.6em;}
   .user-forms input {height: 40px; font-size: 14px;}
   .user-forms button {height: 40px; font-size: 14px;}
   .user-forms .form-group label {font-size: 14px;}
   .user-forms a > p  {font-size: 12px;}
   .footerStyles, .footerStyles a {font-size: 12px;}
   .footerStyles span {font-size: 10px;}
   .admin-portal-nav li { cursor: pointer; font-size: 10px; letter-spacing: 1.3px; }
   .all-customers-search label { width: 10%;}
   .all-customers-search input { width: 75%;}
   .all-customers-search span { width: 7%; }
   .general-stats-charts .chart-title { margin: 0px 0px 20px 0px }
}

@media screen and (max-width: 1100px){
  .user-forms {width: 100%; padding: 12px 32px; margin: 0 auto 10px; margin-bottom: 100px}
  .mainDivSubmit { margin-bottom: 18%;}
  .inactive-customers { width: 33.3333%;}
  .general-stats-charts .chart-title { font-size: 12px; }
}

@media screen and (max-width: 1090px){
   .customers-navbar button { font-size: 10px; padding: 0.7%; height: 41px; margin-right: 0.5%;}
   .BlueConnectHeaderMessage span { font-size: 16px; }
   .btn-group-lg>.btn, .btn-lg { font-size: 14px }
   .header-button-styles { font-size: 14px !important }
}

@media screen and (max-width: 990px){
   .switch { margin-top: 2%;}
   .customers-navbar { height: 120px;}
   .customers-navbar label { text-align: center; }
   .all-customers-search label { width: 12%;}
   .all-customers-search input { width: 70%;}
   .all-customers-search span { width: 10%; }
   .inactive-customers { width: 40%;}
   .general-stats-charts select , input { margin-bottom: 20px;}
}

@media screen and (max-width: 768px){
    body {background-size: 2000px;}
    .container {width: 100%;}
    .mainContentBody > h1 {font-size: 1.6em; margin: 40px 0 10px 0;}
    .mainDivSubmit { margin-bottom: 18%;}
    .portalLogo{ margin: 5px 30px; }
    .customer-statistics .card h4 { font-size: 16px;}
    .customer-statistics .card label { font-size: 10px; font-weight: 600;}
    .cust-info-heading div { font-size: 15px; }
    .each-customer-info > div { padding-right: 3px;}
    .all-customers-search label { font-size: 18px;}
    .all-customers-search label { width: 15%;}
    .all-customers-search span { width: 13%;}
    .all-customers-search input { width: 67%;}
    .all-customers-search input::-webkit-input-placeholder { font-size: 18px; /* Chrome/Opera/Safari */ }
    .all-customers-search input::-moz-placeholder { font-size: 18px; /* Firefox 19+ */ }
    .all-customers-search input:-ms-input-placeholder { font-size: 18px; /* IE 10+ */  }
    .all-customers-search input:-moz-placeholder { font-size: 18px; /* Firefox 18- */}
    .BlueConnectHeaderMessage { padding-top: 2%; }
    .BlueConnectHeaderMessage span { text-align: center; }
    .inactive-customers { left: 0px; text-align: center;}
    .inactive-customers { width: 100%; margin-right: 0px;}
}

@media screen and (max-width: 768px){
 .BlueConnectHeaderMessage { width: 100%; }
 .BlueConnectHeaderMessage span { text-align: left; }
 .admin-top-nav ul { margin-top: 60px; }
 .portalLogo { background-size:contain; width: 35%; margin-left: 0px; }

}

@media screen and (max-width: 567px){
   .all-customers-search input::-webkit-input-placeholder { font-size: 14px; /* Chrome/Opera/Safari */ }
   .all-customers-search input::-moz-placeholder { font-size: 16px; /* Firefox 19+ */ }
   .all-customers-search input:-ms-input-placeholder { font-size: 16px; /* IE 10+ */  }
   .all-customers-search input:-moz-placeholder { font-size: 16px; /* Firefox 18- */}
}

@media screen and (max-width: 450px){
  body { padding: 50px 0px; background-size: cover;}
  .mainContentBody > h1 {font-size: 1.6em; margin: 40px 0 10px 0;}
  .user-forms {width: 100%; padding: 12px 32px; top: 20px; margin-bottom: 80px;}
  .mainDivSubmit { margin-bottom: 35%; font-size: 12px;}
  .mainDivHeading p { font-size: 18px; margin-top: 7px;}
  .dashboard-user-forms h2 {font-size: 1.6em; margin: 0 auto 20px; top: 10px; text-align: center;}
  .dashboard-user-forms label{ font-size: 12px;}
  .customer-statistics .card h4 { font-size: 12px;}
  .customers-navbar p { visibility: hidden; display: none;}
  .customers-navbar span { font-size: 15px; text-align: center; }
  .all-customers-search input::-webkit-input-placeholder { font-size: 12px; /* Chrome/Opera/Safari */ }
  .all-customers-search input::-moz-placeholder { font-size: 12px; /* Firefox 19+ */ }
  .all-customers-search input:-ms-input-placeholder { font-size: 12px; /* IE 10+ */  }
  .all-customers-search input:-moz-placeholder { font-size: 12px; /* Firefox 18- */}
  .portalLogo { background-size:contain; width: 45%; margin-left: 0px; }
  .admin-top-nav ul { margin-top: 60px; }
}

@media screen and (max-width: 330px){
  .all-customers-search label { width: 17%;}
  .all-customers-search span { width: 15%; font-size: 12px;}
  .all-customers-search input { width: 64%;}
}