html,body {
	min-width:100%;
	width: 100%;
	margin:0;
	padding: 0;
	overflow-y:auto;
	height:100%;
}
body {
	font-family:var(--site_font_family);
	background-color:var(--background-color);
	color: var(--font-color);
	/* background-image:url(../../images/backgrounds/wigglycubes.jpg);
	background-repeat: repeat;
	background-size: 50px;  */
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.container {
	background-color:white;
	padding:2em;
	flex: auto;
}

h1 {}

/* behaviors */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	background-color:white;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
}

/* CONTAINERS */

.container-full {
	width:100%;
	margin:auto;
	padding:2em;
	padding-top: 5%;
}

.card {box-shadow:0px 0px 5px var(--shadow_color);margin: auto;padding: 1.5em;margin-top: 1em;text-align: center;}
.ad-card {width:100%;padding: .75rem;background-color:var(--lightest_color);margin:0px;}
.wrapper .ad-card:nth-child(even) {background-color: #242424;color: var(--lightest_color);}
.wrapper .ad-card:nth-child(even) .steptitle {color:var(--lightest_color);text-align: left;margin-left: 10%;}
.wrapper .ad-card:nth-child(odd) { background-color:#242424; }
.wrapper .ad-card:nth-child(odd) .steptitle {color:dimgray;text-align: left;margin-left: 10%;}

.container-login input[type='text'], .container-login input[type='password'], textarea {
	background-color:var(--lightest_color) !important;
	border-radius: 11px;
	border: 1px solid transparent;
	border-top: none;
	border-bottom: 1px solid #DDD;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.39), 0 -1px 1px #FFF, 0 1px 0 #FFF;
	width: 85%;
	margin: auto;
}

.container-contact input[type='text'], .container-contact input[type='password'], textarea {
	background-color:var(--lightest_color) !important;
	border-radius: 11px;
	border: 1px solid transparent;
	border-top: none;
	border-bottom: 1px solid #DDD;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.39), 0 -1px 1px #FFF, 0 1px 0 #FFF;	
	margin: auto;
}

.sign-up-success,
.sign-up-container,
.pricing-container,
.checkout-container,
.container-public-events,
.container-events,
.container-login,
.container-your-truths,
.container-brainstormer,
.container-urges,
.container-charging,
.container-error,
.container-charge-success {	
	height:100%;
}

.container-your-truths {
	position:relative;
	top:-120px;
}

.container-index {
  margin-top:-10px;
  padding: 0px;
}

.container-charging {
  background:none;
  display:none;
}

.container-error {
  padding-top:20pt;
  background-color: var(--background-color);	
  margin:auto;
  font-size: 2em !important;
  color:white;
  text-align:center;
  text-shadow: 0px 2px 5px dimgray;
  font-weight: bold;
}
.container-error a {
  color:white;
}

.container-login {
	background-color: var(--background-color);	
}

.sign-up-success {
	padding-top:10%;
}

.sign-up-container {
	background-color: var(--background-color);
	padding-top: 0%;
}

.sign-up-container form {
	padding: 3em;
}

.pricing-container {
	width: 1300px;
	background: none;	
}

.checkout-container {
	
}

.container-public-events {
	
}

.container-events {	
	margin-top:5px;
	padding-top:5px;
}

.container-add-event {
	background: whitesmoke;
}

.container-urges {
    padding-top:.5em;
}

.container-brainstormer {
    padding-top:2em;
}

.container-public-events .cards {
	padding-top:10px;
	margin-top:0em;
}

#payment-form {
	width: 50%;
	background-color:white;
	padding:20pt;
	border-radius:5px;
	box-shadow:0px 2px 5px dimgray;
	height:640px;
	margin:auto;
	margin-top: 20px;
}

.container-charge-success *, .sign-up-success * {
	width:50%;
	margin:auto;
	font-size: 72pt;
	color:white;
	text-align:center;
	text-shadow: 0px 2px 5px dimgray;
	font-weight: bold;
  padding-top:30pt;
}

.sign-up-success a:hover {
	color:white;
}

.sign-up-success-top-title {
	margin-bottom:50pt;
}

#login, 
#signup-form, 
.sign-up-success-box,
#contact-us-form
 {
	padding:20px;
	padding-bottom:10px;
	margin: auto;
	background: #fff;
	border-radius: 20px;
	width: 550px;
	text-align: center;
	box-shadow: 0px 0px 5px var(--shadow_color);
}

#contact-us-form {
	width:800px
}

.sign-up-success-box {
	padding-top:2em;	
	width:700px;
	height:450px;
}
.sign-up-success-box a {
	display:block;
	color:steelblue;	
	font-size:1.25em;	
}

#signup-form {
	padding:2em 4em;
}

.logo-top {
	margin-left:10px;
	font-size: 2.5em;
	font-family: 'Inter Tight';
	color:var(--darkest_color);
	letter-spacing: 2px;
	font-weight: 800;
}
.logo-bottom {
	color:white;
}
.logo-emoji {
	font-size:.75em;
}
.logo-emoji-reversed {
	color:white;
}

#logo-wrapper *:hover {
	text-decoration:none;
}

#logo-image {height: 43px;}
#menu-header { color:#333333; width:40%;margin-top:1.5em;font-size: 2.25em;margin-left:1em;}
#name {}
#logo-wrapper {border-radius: 24px;width: 293px;float:left;background-color:white;}

#signup-form input[type='text'],
#signup-form input[type='password'],
#login input[type='text'],
#login input[type='password'] {
	padding:.5em;
	height:2em;
	font-size: 1.5em;
	margin-bottom:1em;
	background-color:white;
	text-align: center;
}

#signup-form input[type='password'],
#login input[type='password'] {
	margin-bottom:10px;
}

#signup-form input[type='text'] {
	margin-bottom:10px;
}

#page-title {
	z-index: 99;
	background: white;
	width: 100%;
	text-align: center;
	font-size: 1.75em;
	padding: 5px;
	font-weight: bold;
	color: var(--primary_color);
	border-top: 1px solid gainsboro;
	border-bottom: 1px solid gainsboro;
}

/* BANNERS */
.banner {
	background-position: center center;
	background-color:#242424;	
	font-size:1.5em;
	color:white;	
	text-align: center;
	padding:1em;
}
.banner div {
	text-align:center;
}

.banner-1, .banner-3, .banner-5, .banner-7, .banner-9 {
	background-color:white;
	color:#242424;
}	
.banner-2, .banner-4, .banner-6, .banner-8, .banner-10 {
	background-color:#242424;
	color:white;
}	

.how-it-works {font-size: 3rem !important;padding:10px;color: var(--primary_color);text-align: center;font-weight: bold;font-family: 'Poppins';border-bottom: 2px solid #0F0F0F;}
.aboutus-banner {  font-size:4em;}
.medium-text-banner {font-size:2em;text-align:left;}

.eventdate {color:dimgray;margin-bottom:2em;font-size: 1.2em;}
.eventname {color: var(--primary_color);font-size: 2em;font-weight: bold;text-transform: uppercase;width: 60%;padding: 0pt;border-radius: 7px;text-shadow: 0px 0px 1px #dc3545;}
.eventdata {border-bottom: 1px solid whitesmoke;font-size: 1em;}
.eventdata span {font-size: 1em;padding-left: 1em;}
.eventdata label {width: 100%;display:inline-block;font-weight: bold;font-size: 1.25em;}

.menu {
	border-bottom:1px solid gainsboro;
	padding:1em;
	background-color: white;
	z-index:999;
	height: 76px;
}

#progress-bar {padding-top: 13px;}

/*** CONTROLS ***/

input[type=checkbox], input[type=radio] {
 width: 30px;
 height: 30px;
 -webkit-border-radius: 22px;
 -moz-border-radius: 22px;
 border-radius: 15px;
 border: 1px solid black;
 cursor: pointer;
}

input[type=radio].radio-large {
	width: 54px;
	height: 54px;
	border-radius: 27px;
}

input[type=radio].radio-medium {
	width: 40px;
	height: 40px;
	border-radius: 20px;
}

input[type=radio].radio-small {
	width: 30px;
	height: 30px;
	border-radius:20px;
}

.container-login input[type=checkbox] {
	width: 24px;
	height: 24px;
	border-radius: 10px;
	border: 1px solid #bbb;
	position:relative;
	top:6px;
	left:2px;
}

.remember-me  {
	position:relative;	
}

.submenu { font-size:.5em;}
.form-group label {font-size:2em;position: relative;top: -0.15em;left: .45em;border-bottom: 1px solid gainsboro;width: 96%;}

/** buttons styles */
.btn {}
#btn-signup,
#btn-login {
	width: 50%;
	margin: auto;
	font-size: 1.25em;
}
.btn-delete,.btn-edit {
	position:absolute;
	top: 1.2em;
	right: 2em;
	font-size: 1em;
	text-align: center;
	padding: 5px;
	width:34px;
	height:34px;
	border-radius: 17px;
}
.btn-convert { 
	background-color:steelblue;border:1px solid steelblue;
}
.btn-convert:hover { 
	background-color:DarkSlateGray; color:gray;border:1px solid steelblue;
}
.btn-convert { 
	border-radius:7px;
}
.btn-convert a { color:white;}
.btn-convert a:hover {text-decoration:none;}
.btn-edit a { color:white;}
.btn-edit {top: 3.85em;background-color:#007bff;border:1px solid #007bff;}
.btn-edit:hover { background-color:#62aeff;border-color:gray;}
.btn-round {border-radius: 50%;}
.btn-add-item {width: 50px;height: 50px;font-weight:bold;line-height: 28pt;font-size: 4em;z-index: 999;}
.btn-add-urge, .btn-add-event {font-weight:bold;border-radius: 60px;z-index: 1;margin: auto;margin-bottom: 5px;width: 172px;height: 51px;}
.btn-add-instructions {font-size: 1.45em;}

.btn-primary {color: #fff;background-color:  var(--primary_color);border-color:dimgray;font-size: 1em;}
.btn-menu {cursor:pointer;}
.btn-menu .button-line {width: 40px;height: 6px;background-color: black;margin: 6px 0;}

.links a {
	padding: 0px;
	font-size: 1.25em;
	float:right;
	margin: 0.25em;
	padding: 0px;
	color: var(--primary_color);
	margin-right: 1em;
	font-family: 'Raleway';
}

.logo-image {padding: 4px !important;height: 40px;overflow: hidden;}

.number {
  font-size:30pt;
  color:forestgreen;
  font-weight:700;
  width: 80px;
  display:inline-block;
  margin-left: 10px;
}
.large-number {padding:.5em;height:2em;font-size: 1.25em;}

/** URGES **/
.resisted { border:2px solid green;}
.gave-in { border:2px solid var(--danger_color);}
.resisted-text,.gave-in-text {font-weight:bold;font-size: 2em;text-align: center;display: block;width: 100%;}
.resisted-text { color:green;}
.gave-in-text { color:var(--danger_color);}
#resisted { position:relative;left:20px;top:10px;}

/*** tagcloud **/
#tagcloud { width:40%;margin:auto;}
#tagcloud a {
	background-color: white;
	color:var(--darkest_color);
	padding:8px;
	border-radius:15px;
	margin:5px;
	display: inline-block;
	text-align:center;
	width:400px;
	height: 100px;
	float: left;
	vertical-align: middle;
	padding-top: 27px;
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
}
#tagcloud a:hover { 
	text-decoration:none;
	background-color: var(--primary_color);
	color:white;
	box-shadow:0px 2px 4px black;
}
#publicly_visible {position:relative;top: 8px;z-index: 99999;left: -53px;}
.sorry-no-subscription {
	font-size:1.25em;
	margin:auto;
	margin-top: 1em;
	width:1000px;
	text-align:center;;
	color:white;
	padding:15px;		
}
.subscription-selected-indicator-visible {
	display:block;
	position:absolute;
	top: -7px;
	right: -14px;
	background-color: var(--secondary_color);
	color:white;
	padding:20px;
	border-radius: 20px;
	font-size:20pt;
	 /* IE 9 */
	 /* Safari */
	z-index: 99;
}
.subscription-selected-indicator-hidden { display:none; }
/*** mobile friendly checkboxes **/

.form-group.numerical-card  label {
    font-size: 2em;
    position: relative;
    top: -11px;
    left:0px;
    border-bottom:none;
    width: 96%;
}

.yourtruth {padding-left:2em;border-bottom: none;}
#savesuccess, #erroroverlay, #autocompletewindow {
	position:absolute;
	top: 50%;
	left: 50%;
	width: 250px;
	background-color: cadetblue;
	color:white;
	opacity: 1;
	z-index: 999;	
	text-align: center;
	font-size: 1rem;
	display:none;
	border: none;
	font-family:var(--site_font_family);
}

.parent {
	height: 100%;
	background-color: lightgray;
	display:none;
	position:absolute;
	right:17px;
	top:77px;
	z-index:9999;
}

.menu-links {
	width: 390px;
    height: 91%;
    padding: 20px;
    background-color: white;
    /* position: relative;
    top: 77px;
    right: 17px; */
    z-index: 999999;
    padding-left: 3em;
    border-radius: 15px 0px 0px 15px;
    box-shadow: 1px 3px 6px dimgray;	
}

.menu-links a {display:block;width: 100%;font-size: 1.75em;color: #0F0F0F;}

/** ERROR LABELS **/

.error-label {
	display:none;
	color:#a64747;
	font-weight:bold;
	position:relative;
	top:-40px;
}

.top-error-label {
  color: #F64745;
  font-weight:bold;
  font-size: 26pt;
  margin-bottom: 14pt;
}

.error-label-pricing {
	color:#a64747;
	font-weight:bold;
	font-size:22pt;
	position:relative;
	left:50px;
	margin-bottom:10px;
}

/** PUBLIC EVENTS **/

.public-event {
	margin-bottom: 7px;
}

.public-event .eventname {
	font-size:14pt;
}

.public-event .eventdate {
	font-size:14pt;
	margin-bottom:.5em;
}

.public-event .col {
	font-size:12pt;
}

#public-events-filter {
	height:50px;
	font-size:14pt;
	padding:5px;
}

#trial-time {
	color: seagreen;
}


/** SUBSCRIPTIONS **/

.subscription-type {
	border-radius:10px;
	box-shadow:0px 0px 5px dimgray;
	padding: 2em;
	background-color:white;
	min-height: 550px;
}

.subscription-type img {
	height:45px;
	position:relative;
	left:10px;
	top:-2px;
}

.subscription-type .row .description {
	margin-bottom: 1em;
	display:block;
	margin-left: 2px;
}

.subscription-type .row .monthly,
.subscription-type .row .annual {
	font-size: 1.25em;
	font-weight: 300;
	display:inline-block;
	border-radius:10px;
	padding:10px;
	margin-left: 15px;
	background-color:#1976d2;
	color:white;
	cursor:pointer;
	margin-bottom:1em;
	text-align:center;
	box-shadow:0px 0px 3px black;
}

.subscription-type .row .subscription-trial {
	width:75%;
}

.subscription-type .row a:hover {
	text-decoration: none;
}

.subscription-type .row .monthly:hover,
.subscription-type .row .annual:hover {
	background-color:black;
	color:white;
	cursor:pointer;
}

.subscription-type .pricing {
	font-size: 1.25em;
	font-weight: bold;
	width:100%;	
}

.subscription-type .pricing a {
	width:100%;
}

.features-title {
	font-size:18pt;
	font-weight:bold;
	margin-left:2px;
	margin-bottom:10px;
	border-bottom:1px solid whitesmoke;
}

.feature-name {
	font-weight:bold;
}

.subscription-types .features-list {
	border-radius:6px;
	background-color:whitesmoke;
	padding:15px;
}
.subscription-types .features-list .feature {
	margin-bottom:10px;
}

.subscription-type .name {
	font-size: 40pt;
	font-weight:bold;
	color:black;
	margin-bottom:10px;
}

.event-attribute {
	width: 75%;
	margin:auto;
}

.event-attribute label {
	font-size: 1.25em;
	color: #0F0F0F;
	position: relative;
	top: 7px;
}



.btn-close-event {
	font-size:20pt;
}

.text-banner {font-size: 38pt!important;background-color:steelblue;text-align: center;}

#main-hook-text {
	height: 250px;
	font-size: 4.5em;
}

.home-banner {
	background:none;
	height: 650px;
}

.home-banner .home-image {
	height:100%;
	width:100%;
	object-fit: fill;
	opacity: .85;
}

.home-video {
	opacity:.8;
	object-fit: fill;  
	position: relative;
	top: 0;
	left: 0;
	height:100%;
	width:100%;
}

.home-title, .home-issues {
	position:relative;
	top: -640px;
	padding: 72px;
	padding-top: 15px;
}

.home-title label {
	font-weight:bold;
	font-size:7em;
	color:white;
	text-shadow: 0px 0px 9px black;
	font-family:Poppins;
}

.home-issues div {
	color:white;
	font-size:2em;
	font-weight: 900;
	margin-bottom:1em;
	text-shadow: 0px 0px 3px black;	
	font-family: 'Poppins';
}

.home-issues ul {
	list-style: none;
	color:white;
}

.home-issues p {
	color:white;
	font-weight:bold;
	font-size:3em;	
	text-shadow: 0px 0px 9px black;
	color:white;
}

.home-issues li a {	
	font-weight:bold;
	font-size:2em;	
	text-shadow: 0px 0px 9px black;
	color:white;
}

/*Cabin|Arimo|Montserrat|Nunito|Open+Sans|Oxygen|Raleway|Poppins*/

.personal-story {
	font-size: 0.7em;
	font-family: Lato;
	font-weight: 300;
	color: black;
	line-height: 1.2em;
}

input[type="text"].answer {
	font-size: 1em;
	height:50px;
	padding:5px;
	color:#0F0F0F;
	width:100%;
}

#quizholder .answers {
	border-bottom:1px solid gainsboro;
	margin:10px;
}

.answerlabel {
	font-size: 1em;
	color:#0F0F0F;
	position:relative;
	display:inline-block;
	margin:30px;
	margin-left:20px;
	top: -13px;
	text-align:left;
}

.darkbg {
	background-color: #242424;
	width:100%;
	height:100%;
	opacity:.5;
	position:absolute;
	top:0;
	left:0;
	display:none;
	z-index:1;
}

#result {
	font-size: 2em;
	padding:40px;
	background-color:white;
	color:dimgray;
	text-align: center;
	position:absolute;
	left:50%;
	margin-left:-350px;
	width:700px;
	top:20%;
	border:2px solid var(--primary_color);
	border-radius:10px;
	z-index:99;
	display:none;
}

.features-list h3 {
	font-size: 1.2em;
	font-weight: 200;
	background-color: white;
	width:355px;
	color:black;
	padding:19px;
}
.features-list p {
	font-size: .7em;
}

.features-list * {
	text-align: left;
}

.index-features-list {
	width:60%;
	margin:auto;
}

.index-features-list h3,
.index-features-list p {
	text-align:left;
}

.index-features-list p {
	font-size:.9em;
}

.banner-2 .index-banner-title {
	font-size: 1.7em;
	font-weight: bold;
	color: white;
	font-family: Poppins;
	border-bottom:1px solid white;
	margin:auto;
	margin-bottom: 20px;
	width: 60%;
}

#score-bar {
	height:30px;
}

#scorebarwrapper {
	width: 100%;
	margin: auto;
	height:40px;
	padding:5px;
	border:1px solid dimgray;
	border-radius: 5px;;
}

.btn-delete-event {
	color:white !important;
}


.content2 {
	font-size: 1.5em;
	width:50%;
	margin:auto;
}
.content3 {
	font-size: 1.25em;
	width:50%;
	margin:auto;
}

#tblAllEvents th:first-child,
#tblAllEvents td:first-child {
	width: 100px;
}

.container-quiz {
	width:50%;
}

.dt-paging button {
	border:1px solid gray;
	font-weight:bold;
	box-shadow: 0px 0px 2px gray;
	margin:3px 3px;
	border-radius:2px;
	padding-top:-1px;
}