#bootstrap-overrides{
	background-color: white;
	overflow-y: scroll;
	overflow-x: hidden;
	font-family: 'Rubick', sans-serif;
	display: none;
}

.navbar{
	background-color: #3399ff;
}

#bootstrap-overrides .btn {
	border-radius: 20px;
	padding: 10px 30px;
}

#bootstrap-overrides .rectbar {
	border-radius: 0px;
	padding: 6px 12px;
}

#bootstrap-overrides .btn.dropdown-toggle.btn-default {
	border-radius: 4px;
	padding: 6px 12px;
}

#bootstrap-overrides #sendButton {
	border-radius: 4px;
	padding: 6px 12px;
}

#bootstrap-overrides #removeFile {
	border-radius: 20px;
	padding: 5px 10px;
}

#bootstrap-overrides .planBtnActual {
	border-radius: 20px;
	padding: 5px 20px;
}

#bootstrap-overrides #changeplanLink {
	font-weight: 700;
}

#bootstrap-overrides #updatePaymentLink {
	font-weight: 700;
}

#bootstrap-overrides .navbar-inverse{
	border: 1px solid #3399ff;
}

.navbar-inverse .navbar-brand{
	color: white;
	font-family: 'Rubick', sans-serif;
	font-weight: 900;
}

.navbar-inverse .navbar-nav>li>a{
	color: white;
	font-family: 'Rubick', sans-serif;
	font-weight: 900;
}

.intro{
  	text-align: center;
}

#bootstrap-overrides .titleHeader1{
	font-size: 36px;
	font-weight: 800;
	margin:0;
	padding-bottom: 10px;
}

#bootstrap-overrides .titleHeader2{
	font-size: 18px;
	margin:0;
}

#bootstrap-overrides .section{
	padding-top: 20px;
	padding-bottom: 20px;
	width: 100%;
 	display: table;
 	margin: 0;
 	max-width: none;
}

#bootstrap-overrides #sectionHeader{
	padding-top: 100px;
	background-color: #eef2f8;
	height: 80vh;
	text-align: center
}

#bootstrap-overrides #sectionPlan{
	background-color: #eef2f8;
}

#bootstrap-overrides .creditCards{
	max-width: 100%;
    height: auto;
}

#bootstrap-overrides #appstoreImage{
	padding-top: 10px;
}

#bootstrap-overrides #googlePlayImage{
	padding-top: 10px;
}


#bootstrap-overrides #tabletImage{
	max-width: 100%;
    max-height: 100%;
    width:auto;
    height:auto;
}

#bootstrap-overrides .iconImage{
	max-width: 200px;
    max-height: 60px;
    width:auto;
    height:auto;
}

#bootstrap-overrides #iconCamera{
	max-width: 60px;
    max-height: 50px;
    width:auto;
    height:auto;
}

#bootstrap-overrides #titleRow{
	padding-bottom: 50px;
	text-align: center;
}

#bootstrap-overrides #titleDiv{
	padding-top: 50px;
}

#bootstrap-overrides #imageDiv{
	padding-top: 0px;
}

#bootstrap-overrides #submitReminderBtn{
	text-align: center;
}

#bootstrap-overrides #reminderSuccess{
	text-align: center;
}

#contactUsDiv{
	text-align: center;
	padding-top: 60px;
	font-size: 16px;
}

#contactUsSignupDiv{
	text-align: center;
	padding-top: 0px;
	font-size: 16px;
}

#bootstrap-overrides #seeMoreDiv{
	text-align: center;
	padding-top: 40px;
}

#seeMore:before{
    border-top: 1px solid black;
    display: block;
    height: 1px;
    content: " ";
    width: 40%;
    position: absolute;
    left: 0;
    top: 1.2em;
}

#seeMore:after {
    border-top: 1px solid black;
    display: block;
    height: 1px;
    content: " ";
    width: 40%;
    position: absolute;
    right: 0;
    top: 1.2em;
}

#bootstrap-overrides .iconRow {
	padding-top: 20px;
	display: flex;
}

#bootstrap-overrides .iconText {
	padding-left: 20px;
	text-align: left;
	font-size: 16px;
}

footer{
	text-align: center;
	font-size: 14px;
    padding-top: 50px;
    padding-bottom: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

#bootstrap-overrides .privacy{
	text-decoration: none;
}

#bootstrap-overrides .header1{
	font-size: 36px;
	font-weight: 800;
	margin:0;
}

#bootstrap-overrides .headerup{
	padding-bottom: 40px;
	padding-top: 100px;
}

#bootstrap-overrides #segmentRow{
	padding-bottom: 10px;
	padding-top: 80px;
}

#bootstrap-overrides #helperRow{
	padding-bottom: 10px;
	padding-top: 10px;
}

#bootstrap-overrides #titleRow{
	padding-bottom: 40px;
}

#bootstrap-overrides .modal{
	text-align: center;
	top: 30%;
	overflow-y: auto;
}

#bootstrap-overrides .modal-open {
	overflow: inherit;
	padding-right: 0 !important
}

#bootstrap-overrides .modal-title{
	font-weight: 800;
}

#bootstrap-overrides .modal-footer{
	text-align: center;
}

#modalbodyinstruc{
	text-align: left;
}

#bootstrap-overrides #fileModalBody{
	text-align: left;
}

#bootstrap-overrides #remindersrow{
	padding-bottom: 5px;
}

.savedreminders{
	padding:0;
}

#welcome, #welcome2{
	color: inherit;
	text-decoration: none;
}

#bootstrap-overrides a {
	cursor: pointer;
}

#bootstrap-overrides .custominput{
	width: 100%;
}

#bootstrap-overrides #loginrow{
	padding-top: 10px;
}

#bootstrap-overrides #closeRow{
	padding-top: 50px;
}

#bootstrap-overrides .row{
	padding-top: 20px;
}

#bootstrap-overrides .formelement{
	padding-bottom: 20px;
	padding-right: 0px;
	padding-left: 0px;
}

.altlogins{
	display: inline;
	padding: 10px;
	cursor: pointer;
	color: white;
}

#bootstrap-overrides .platformLogin{
	vertical-align: middle
}

#bootstrap-overrides .googlelogin{
	background: #ffffff;
	border: 1px solid gray;
    color: gray;
    text-align: left;
	border-radius: 25px;

}

#bootstrap-overrides .googleloginCalendar{
	background: #ffffff;
	border: 1px solid darkgray;
    color: black;
    text-align: center;
	border-radius: 25px;
}

#bootstrap-overrides .applelogin{
	background: #000000;
	border: 1px solid #000000;
    color: white;
    text-align: left;
	border-radius: 25px;
}

#bootstrap-overrides #appleicon {
	max-width: 35px;
	max-height: 35px;
}

#bootstrap-overrides #googleicon {
	max-width: 35px;
	max-height: 35px;
}

.logo{
	padding-right: 10px;
}

#bootstrap-overrides ::placeholder{
	color: rgba(0, 0, 0, 0.4);
}

#instructionsbold{
	font-weight: bold;
}

#instructionstext{
	font-style: italic;
}

#savedreminderslabel{
	padding: 0;
	font-weight: bold;
}

#instructionslink{
	font-weight:bold;
}

#newreminderlink{
	font-weight:bold;
}

#bootstrap-overrides #notoppadding{
	padding-top:0;
}

@media (min-width: 992px){
	#bootstrap-overrides #planDetailsPadding{
		padding-top:0;
	}
}

#bootstrap-overrides .alert, .alert-success{
	margin: 0;
}

#savedlist{
	width: 205px;
}

#bootstrap-overrides .nopadding{
	padding-left:0;
	padding-right:0;
	padding-top:0;
	padding-bottom:10px;
}

#bootstrap-overrides .actuallynopadding{
	padding-left:0;
	padding-right:0;
	padding-top:0;
	padding-bottom:0;
}

#bootstrap-overrides .newreminderpadding{
	padding-left:0;
	padding-right:0
	padding-top:0;
	padding-bottom:20px;
}

#bootstrap-overrides .smsLimits{
	font-size: 9px;
	padding-right: 26px;
	text-align: right;
}

#bootstrap-overrides .smsLimitsChat{
	font-size: 9px;
	text-align: right;
	padding-right: 15px;
}

#bootstrap-overrides #chatRow {
	padding-top: 0px;
}

#bootstrap-overrides .nobottompadding{
	padding-bottom:35px;
}

#bootstrap-overrides .center{
	text-align: center;
}

#bootstrap-overrides #nopadding{
	padding-left:0;
	padding-right:0;
	padding-top:0;
	padding-bottom:0;
}

#bootstrap-overrides #nextFileRow{
	padding-left:0;
	padding-right:0;
	padding-top:10px;
	padding-bottom:0;
}

#fileError{
	color: red;
}

#fileError2{
	color: red;
}

#bootstrap-overrides .fileRemove{
	padding-top: 15px;
}

#bootstrap-overrides #removeFile{
	background-color: #b72828;
	border-color: #b72828;
}

#bootstrap-overrides #toppadding{
	padding-left:0;
	padding-right:0;
	padding-top:20px;
	padding-bottom:0;
}

.bootstrap-overrides .nomargin{
	margin:0;
}

#message{
	overflow-x: hidden;
}

#hide{
	display: none;
}

#dontshow{
	display: none;
}

#errorCode{
	color: red;
	font-size: 10px;
	padding-bottom: 10px;
}

#errorCode1{
	color: red;
	font-size: 10px;
	padding-bottom: 10px;
}

#errorCode2{
	color: red;
	font-size: 10px;
	padding-bottom: 10px;
}

#policies{
	font-size: 10px;
	padding-bottom: 25px;
}

#errorCode3{
	color: red;
	font-size: 10px;
	padding-bottom: 10px;
}

#resetPass{
	text-align: center;
	font-weight: bold;
	padding-top: 0px;
	font-size: 16px;
	padding-bottom: 20px;
}

#closeBtn{
	background-color: #b72828;
	border-color: #b72828;
}

#deleteButtonConfirmed{
	background-color: #b72828;
	border-color: #b72828;
}

#btnDelete{
	background-color: #b72828;
	border-color: #b72828;
}

#bootstrap-overrides .btn.dropdown-toggle.bs-placeholder.btn-default{
	color: #555;
}

@media (min-width: 992px){
#bootstrap-overrides #divTimezone {
	padding-left: 10px;
	}
}

#signUpOr{
	text-align: center;
}

#signUpEmail{
	width: 100%;
}

#signUpPassword{
	width: 100%;
}

#signUpPassword2{
	width: 100%;
}

.box {
	border: thin gray solid;
}

#bootstrap-overrides .boxStyle {
	border: 0;
	background-color: #f9f9f9;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important;
	border-radius: 10px;
}

.headerRow {
	background-color: #3399ff;
	color: white;
	height: 50px;
	display: flex;
    align-items: center;
    justify-content: center;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

#bootstrap-overrides .monthly{
	font-size: 18px;
}

#bootstrap-overrides .annually{
	font-size: 12px;
	color: #615959;
}

#bootstrap-overrides .planTitle{
	margin: 0;
	font-weight: 800;
}

#bootstrap-overrides .planBtn{
	padding-bottom: 10px;
}

#bootstrap-overrides .footerRow{
	padding-bottom: 25px;
}

@media (min-width: 992px){
#bootstrap-overrides .breaker {
	display: none;
	}
}

@media (max-width: 992px){
#bootstrap-overrides .breaker {
	display: show;
	padding-bottom: 25px;
	}
}

#formborder{
	background-color: #f9f9f9;
	border-radius: 15px;
	border: 1px solid transparent;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important;
}

#bootstrap-overrides #cardName, #cardEmail{
    color: #32325d;
}

#bootstrap-overrides #cardName::placeholder, #cardEmail::placeholder{
    color: #32325d;
}

#planTitle{
	font-weight: bold;
}

#card-errors{
	color: red;
}

#bootstrap-overrides .thankyou, .thankYouText{
	padding-bottom: 25px;
}

#bootstrap-overrides #changeText, #changePaymentText, #thankyouContact{
	text-align: center;
}

#bootstrap-overrides .leftText{
	padding-bottom: 25px;
	text-align: left;
}

#processingError{
	padding-bottom: 25px;
	color: red;
}

#currentCardRow{
	padding-bottom: 25px;
}

#emailLabel{
	float: left;
	padding-left: 5px;
}

.bottompad{
	padding-bottom: 20px;
}

.toppad{
	padding-top: 20px;
}

#bootstrap-overrides #accountDropdown{
	width: 100%;
	background-color: #3399ff;
}

#bootstrap-overrides #accountDropdown>li>a{
	font-family: 'Rubick', sans-serif;
	color: white;
}

#bootstrap-overrides #accountDropdown > li > a:hover, #accountDropdown> li > a:focus {
	background-color: #3399ff;
 }

#hiText{
	background-color: #3399ff;
}

#bootstrap-overrides .navbar-inverse .navbar-toggle {
	border: none;
}

#bootstrap-overrides .navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
	background-color: #3399ff;	
}

#bootstrap-overrides .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
	border: 1px solid #3399ff;
}

#bootstrap-overrides .navbar-brand{
	padding: 0;
}

#bootstrap-overrides #logo, #logo2{
	max-width:43px;
	max-height:43px;
	padding-bottom: 6px;
	padding-left: 10px;
}

#bootstrap-overrides #logoText, #logoText2{
	display: inline-block;
	padding-left: 8px;
	margin: 0;
	padding-top: 15px;
}

#bootstrap-overrides #helper{
	max-width:20px;
	max-height:20px;
	float: right;
	cursor: pointer;
}

#bootstrap-overrides #subheader{
	text-align: center;
	padding-top:10px;
	font-style: italic;
	font-size:12px;
}

#bootstrap-overrides .planDetails{
	font-size: 12px;
}

#bootstrap-overrides .planDetailsPayment{
	font-size: 14px;
}

@media (min-width: 768px) and (max-width: 992px) {  
    #bootstrap-overrides .planDetailsPayment{
    	font-size: 12px;
    }
  }

@media (max-width: 768px) {  
	#bootstrap-overrides .planDetailsPayment{
		text-align: center;
	}
}

.switch {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 24px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(16px);
  -ms-transform: translateX(16px);
  transform: translateX(16px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 24px;
}

.slider.round:before {
  border-radius: 50%;
}

#emailNotificationLabel {
	display: inline-block;
	vertical-align: middle;
	margin-left: 10px;
	padding-top: 2px;
}

@media (max-width: 992px){
#bootstrap-overrides #saveNotifications {
	display: block;
	width: 100%;
	}
}

#bootstrap-overrides #planToggleRow, #planToggleRowChange {
	padding-bottom: 40px;
}

#monthlyLabel, #monthlyLabelChange {
	font-weight: bold;
	font-size: 14px;
	color: #3399ff;
	display: inline-block;
	vertical-align: middle;
	margin-right: 10px;
	padding-top: 2px;
}

#annualLabel, #annualLabelChange {
	font-size: 14px;
	color: gray;
	display: inline-block;
	vertical-align: middle;
	margin-left: 10px;
	padding-top: 2px;
}

div.g-recaptcha {
  margin: 0 auto;
  width: 304px;
}

#messageWindow{
	border-left: thin gray solid;
	border-top: thin gray solid;
	border-bottom: thin gray solid;
	border-right: thin gray solid;
	padding: 0;
	overflow-y: auto;
	overflow-x: hidden;
	background-color: #f9f9f9;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important;
}

#bootstrap-overrides .organizingDiv:hover .deleteConversation{
	display: block;
}

 @media (min-width: 768px) and (max-width: 1000px) {  
    #bootstrap-overrides .organizingDiv{
    	font-size: 12px;
    }
  }

#bootstrap-overrides .organizingDiv{
	border-bottom: thin gray solid;
	border-top: thin gray solid;
	padding-top: 5px;
	background-color: #f9f9f9;
}

#bootstrap-overrides .messageText{
	display: inline;
}

#bootstrap-overrides .messageAuthor {
	float: left;
	font-weight: bold;
}

#bootstrap-overrides .messageDateWindow {
	text-align: right;
	float: right;
}

#textChatWindow{
	border: thin gray solid;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-top: 0;
	background-color: #f9f9f9;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important;
}

#chatWindow{
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	display: -webkit-flex;
	flex-direction: column-reverse;
	-webkit-flex-direction: column-reverse;
	height: 88%;
	padding-bottom: 25px;
	padding-top: 25px;
}

#textWindow{
	display: table;
	flex-direction: column;
	height: 12%;
	padding: 0;
	border-top: thin gray solid;
	position: absolute;
	bottom: 0;
}

#divTextField{
	display: table-cell;
	position: absolute;
	bottom: 0;
	width: 75%;
}

#divSendField{
	display: table-cell;
}

#sentMessage{
	border: thin gray solid;
	border-radius: 20px;
	padding: 8px 15px;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
	display: inline;
	outline-width: 0;
	overflow-y: hidden;
	resize: none;
}

#sendButton{
	width: 20%;
	margin: 5px;
	margin-left: 0;
	margin-top: 8px;
	margin-bottom: 12px;
	float: right;
	position: absolute;
	bottom: 0;
	right: 0;
}

#bootstrap-overrides .chatMessage {
	border-radius: 20px;
	padding: 8px 15px;
	margin-top: 5px;
	margin-bottom: 5px;
	display: inline-block;
	width: max-content;
	max-width: 60%;
}

#bootstrap-overrides .theirMessage  {
	align-items: flex-start;
	background-color: #eee;
	position: relative;
}

#bootstrap-overrides .myMessage  {
	align-items: flex-end;
	color: white;
	background: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
	background-attachment: fixed;
	position: relative;
	float: right;
}

#bootstrap-overrides .messageImage  {
	max-height: 200px;
	max-width: 200px;
	cursor: pointer;
}

#bootstrap-overrides .messageImageBox  {
	max-height: 60px;
	max-width: 60px;
}

#bootstrap-overrides .messageDate {
	text-align: center;
	font-size: 12px;
}

#backButton{
	font-size: 35px;
	height: 50px;
	display: flex;
    align-items: center;
    justify-content: center
}

#recipientPhone{
	font-size: 16px;
	height: 50px;
	font-weight: bold;
	display: flex;
    align-items: center;
    justify-content: center;
}

#bootstrap-overrides .messageBody {
	text-overflow: ellipsis;
	overflow: hidden;
	width: 80%;
	white-space: nowrap;
}

#bootstrap-overrides .notificationDot {
  height: 8px;
  width: 8px;
  background-color: blue;
  border-radius: 50%;
  display: none;
  position: absolute;
  bottom: 50%;
  right: 5%;
}


#bootstrap-overrides .deleteConversation {
	position: absolute;
	bottom: 30%;
	right: 5%;
	display: none;
}

#bootstrap-overrides .xSpan {
	color: red;
	font-weight: bold;
}

@media (min-width: 768px) {
	#mobileMenu{
		display: none;
	}
	#backButton{
		display: none;
	}
	#recipientPhone{
		display: none;
	}

	#messageWindow {
		border-bottom-left-radius: 15px;
		border-top-left-radius: 15px;
	}

	#textChatWindow {
		border-bottom-right-radius: 15px;
		border-top-right-radius: 15px;	
	}
}

@media (max-width: 768px) {
	#messageWindow {
		border-radius: 15px;
	}

	#textChatWindow {
	    display: none;
		border-radius: 15px;
	}

	#mobileMenu{
		display: block;
	}
	#backButton{
		display: none;
	}
	#recipientPhone{
		display: none;
	}
}

#bootstrap-overrides .tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

#bootstrap-overrides .tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
}

#bootstrap-overrides .tooltip:hover .tooltiptext {
  visibility: visible;
}

#bootstrap-overrides .tooltip-inner {
    /*max-width: 100% !important;*/
}

#bootstrap-overrides #asterickRow1 {
	padding-top: 30px;
	font-size: 10px;
}

#bootstrap-overrides #asterickRow2 {
	padding-top: 10px;
	font-size: 10px;
}