/*
* FONTS
*/

/* exo-2-100 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 100;
  src: local('Exo 2 Thin'), local('Exo2-Thin'),
       url('/fonts/exo-2-v4-latin-100.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-100.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-100italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 100;
  src: local('Exo 2 Thin Italic'), local('Exo2-ThinItalic'),
       url('/fonts/exo-2-v4-latin-100italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-100italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-200 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 200;
  src: local('Exo 2 Extra Light'), local('Exo2-ExtraLight'),
       url('/fonts/exo-2-v4-latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-200italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 200;
  src: local('Exo 2 Extra Light Italic'), local('Exo2-ExtraLightItalic'),
       url('/fonts/exo-2-v4-latin-200italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-200italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-300 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 300;
  src: local('Exo 2 Light'), local('Exo2-Light'),
       url('/fonts/exo-2-v4-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-300italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 300;
  src: local('Exo 2 Light Italic'), local('Exo2-LightItalic'),
       url('/fonts/exo-2-v4-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-regular - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 400;
  src: local('Exo 2'), local('Exo2-Regular'),
       url('/fonts/exo-2-v4-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 400;
  src: local('Exo 2 Italic'), local('Exo2-Italic'),
       url('/fonts/exo-2-v4-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-500 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 500;
  src: local('Exo 2 Medium'), local('Exo2-Medium'),
       url('/fonts/exo-2-v4-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-500italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 500;
  src: local('Exo 2 Medium Italic'), local('Exo2-MediumItalic'),
       url('/fonts/exo-2-v4-latin-500italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-500italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-600 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 600;
  src: local('Exo 2 Semi Bold'), local('Exo2-SemiBold'),
       url('/fonts/exo-2-v4-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-600italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 600;
  src: local('Exo 2 Semi Bold Italic'), local('Exo2-SemiBoldItalic'),
       url('/fonts/exo-2-v4-latin-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-700 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 700;
  src: local('Exo 2 Bold'), local('Exo2-Bold'),
       url('/fonts/exo-2-v4-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-700italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 700;
  src: local('Exo 2 Bold Italic'), local('Exo2-BoldItalic'),
       url('/fonts/exo-2-v4-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-800 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 800;
  src: local('Exo 2 Extra Bold'), local('Exo2-ExtraBold'),
       url('/fonts/exo-2-v4-latin-800.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-800.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-800italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 800;
  src: local('Exo 2 Extra Bold Italic'), local('Exo2-ExtraBoldItalic'),
       url('/fonts/exo-2-v4-latin-800italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-800italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-900 - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: normal;
  font-weight: 900;
  src: local('Exo 2 Black'), local('Exo2-Black'),
       url('/fonts/exo-2-v4-latin-900.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-900.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* exo-2-900italic - latin */
@font-face {
  font-family: 'Exo 2';
  font-style: italic;
  font-weight: 900;
  src: local('Exo 2 Black Italic'), local('Exo2-BlackItalic'),
       url('/fonts/exo-2-v4-latin-900italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/exo-2-v4-latin-900italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/*
* BASE FONT
*
* Color Palette
* http://paletton.com/#uid=5090u0kritSg+Dbm2vCugosyljn
*/

html, body, td, blockquote, input, select, button, textarea, code
{
	font-family: 'Exo 2', sans-serif;
	font-weight: 300;
    font-size: 16px;
    color: #333;
	outline: none;
	word-wrap: break-word;
}

body, .smooth-container { scroll-behavior: smooth; }

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.at-name {
	cursor: pointer;
}

input[type=text], input[type=password], textarea
{
	font-family: sans-serif;
	background: #ebebeb;
	border: none;
	border-radius: 4px;
	width: 100%;
	padding: 12px 15px 14px 15px;
	font-size: 15px;
	border: solid #fff 1px;
	font-weight: 200;
	outline: none;
	resize: none;
}

#pop .hint
{
	font-family: sans-serif;
	font-weight: 200;
}

/*
* BASE DOCUMENT
*/

html, body
{
	margin: 0;
	box-sizing: border-box;
	background: #fff;
}

*, *:before, *:after {
  box-sizing: inherit;
}

#countdown
{
	text-align: center;
	font-size: 35px;
	font-family: 'Bungee Hairline', cursive;
	color: #ee4a23;
	min-height: 50px;
}

/*
* BASE LINKS
*/

a { text-decoration: none; color: #606060;}
a:hover { color: #ee4a23; }
.orange { color: #ee4a23; }
.hide { display: none !important; }

#saving
{
	position: fixed;
	bottom: 0;
	left: 0;
	margin: 0 0 12px 12px;
	font-size: 14px;
	color: #999;
	display: none;
}

#sys-message
{
	position: fixed;
	justify-content: center;
	align-items: center;
	z-index: 1000000;
	background: #fdf7e9;
	padding: 55px 0;
	top: 0;
	left: 0;
	right: 0;
	text-align: center;
	font-size: 20px;
	font-weight: 300;
	border-bottom: solid #ddd 1px;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
	color: #d6421f;
	fill: #d6421f;
	display: none;
	word-wrap: break-word;
}

@media (max-width: 850px) { #sys-message { padding: 45px 0; } }
@media (max-width: 800px) { #sys-message { padding: 40px 0; } }

	#sys-message .icon
	{
		width: 70px;
		height: 70px;
		margin-top: 3px;
		margin-right: 15px;
		margin-left: 20px;
	}

	#sys-message .message
	{
		margin-right: 20px;
		font-size: 25px;
		line-height: 35px;
		font-weight: 200;
		max-width: 600px;
		text-align: left;
		letter-spacing: 1px;
	}

	#sys-message a
	{
		text-decoration: underline;
		color: #ee4a23;
	}

#error-message
{
	margin: 50px 50px 0 50px;
}

	#error-message h1
	{
		font-size: 36px;
		font-weight: 200;
		color: #ee4a23;
		letter-spacing: 2px;
		margin: 0;
	}

	#error-message p
	{
		font-weight: 200;
		margin: 20px 0 0 0;
	}

	#error-message a
	{
		text-decoration: underline;
	}

/*
* BASE ICON
*/

.icon
{
    width: 50px;
    height: auto;
}

.icon.help
{
    width: 20px;
    height: 20px;
	opacity: 0.2;
	vertical-align: middle;
}


/*
* BASE BUTTONS
*/

button, .button
{
	border: none;
	border-radius: 4px;
	padding: 10px;
	background: #ee4a23;
	color: #fff;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 1px;
	cursor: pointer;
	text-align: left;
	display: inline-block;
	padding-right: 15px;
	padding-left: 15px;
}

button:hover,a.button:hover {
	color: #fff;
	font-weight: 400;
}

/*
* BASE PANELS
*/

.light-panel
{
    background: #f5f5f5; /* fafafa f5f5f5  */
    border: solid #f5f5f5 1px; /* eee e5e5e5 */
	border-radius: 6px;
}

.note
{
    background: #fff1d7;
    padding: 18px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 200;
    color: #606060;
    line-height: 1.4em;
    letter-spacing: 0.2px;
}

	.note.info
	{
		display: flex;
		align-items: center;
		padding: 5px 10px 6px 6px;
		color: #8E7851;
		font-weight: 300;
	}

	.note.info .icon
	{
		width: 24px;
		vertical-align: middle;
		margin: 1px 5px 0 0;
		fill: #DBC6A0;
	}

.info-note
{
    font-size: 14px;
    font-weight: 300;
    color: #ee4a23;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
}

	.info-note .icon
	{
		margin-top: 4px;
		width: 23px;
		height: 23px;
		margin-right: 4px;
		fill: #d6d6d6;
	}

/*
* ROCKET LINES
*/

.rocket-line-right .line
{
    float: right;
    background: #ee4a23;
    height: 4px;
    width: 35%;
    margin-top: -2px;
}

.rocket-line-right .icon
{
    float: right;
    fill: #ee4a23;
    width: 31px;
    height: 31px;
    -ms-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    margin-top: -15px;
    margin-right: -10px;
}

.rocket-line-left .line
{
    float: left;
    background: #ee4a23;
    height: 4px;
    width: 35%;
    margin-top: -2px;
}

.rocket-line-left .icon
{
    float: left;
    fill: #ee4a23;
    width: 31px;
    height: 31px;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -16px;
    margin-left: -9px;
}

@media (max-width: 500px)
{
    #home .rocket-line-right .line { width: 200px; }
    #home .rocket-line-left  .line { width: 200px; }
}

/*
* TABLE
*/

table.styled { width: 100%; margin: 25px 0; border-radius: 4px;  }
table.styled td { border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; }
table.styled tr:nth-child(even) { background: #eee; }
table.styled td { vertical-align: top; padding: 10px; }
table.styled td.key { font-weight: 400; }
table.styled td.data { font-weight: 300; }
table.styled tr:first-of-type td { border-top: 1px solid #ddd; }
table.styled td:first-of-type { border-left: 1px solid #ddd; }
table.styled tr:first-of-type td:first-child { border-top-left-radius: 4px; }
table.styled tr:first-of-type td:last-child { border-top-right-radius: 4px; }
table.styled tr:last-child td:first-child { border-bottom-left-radius: 4px; }
table.styled tr:last-child td:last-child { border-bottom-right-radius: 4px; }

/*
* PAGE
*/

#page
{
	background: #fff;
	border-radius: 0;
}

	#page #content
	{
	    padding-bottom: 100px;
	}

/*
* FOOTER
*/

#page #footer
{
    padding: 35px;
    border-top: solid #eee 1px;
    text-align: center;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;

    background-color: #fafafa;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fafafa), to(#ffffff));
    background: -webkit-linear-gradient(top, #fafafa, #ffffff);
    background: -moz-linear-gradient(top, #fafafa, #ffffff);
    background: -ms-linear-gradient(top, #fafafa, #ffffff);
    background: -o-linear-gradient(top, #fafafa, #ffffff);
}

    #page #footer a
    {
        font-weight: 200;
        font-size: 14px;
        letter-spacing: 1px;
        margin-left: 30px;
    }

#page #footer-rocket .line
{
    background: #ee4a23;
    height: 4px;
    width: 35%;
    margin-top: -2px;
    float: right;
}

#page #footer-rocket .icon
{
    float: right;
    fill: #ee4a23;
    width: 31px;
    height: 31px;
    -ms-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    margin-top: -15px;
    margin-right: -10px;
}

/* This is the core CSS of Tooltipster */

/* GENERAL STRUCTURE RULES (do not edit this section) */

.tooltipster-base {
	/* this ensures that a constrained height set by functionPosition,
	if greater that the natural height of the tooltip, will be enforced
	in browsers that support display:flex */
	display: flex;
	pointer-events: none;
	/* this may be overriden in JS for fixed position origins */
	position: absolute;
}

.tooltipster-box {
	/* see .tooltipster-base. flex-shrink 1 is only necessary for IE10-
	and flex-basis auto for IE11- (at least) */
	flex: 1 1 auto;
}

.tooltipster-content {
	/* prevents an overflow if the user adds padding to the div */
	box-sizing: border-box;
	/* these make sure we'll be able to detect any overflow */
	max-height: 100%;
	max-width: 100%;
	overflow: auto;
}

.tooltipster-ruler {
	/* these let us test the size of the tooltip without overflowing the window */
	bottom: 0;
	left: 0;
	overflow: hidden;
	position: fixed;
	right: 0;
	top: 0;
	visibility: hidden;
}

/* ANIMATIONS */

/* Open/close animations */

/* fade */

.tooltipster-fade {
	opacity: 0;
	-webkit-transition-property: opacity;
	-moz-transition-property: opacity;
	-o-transition-property: opacity;
	-ms-transition-property: opacity;
	transition-property: opacity;
}
.tooltipster-fade.tooltipster-show {
	opacity: 1;
}

/* grow */

.tooltipster-grow {
	-webkit-transform: scale(0,0);
	-moz-transform: scale(0,0);
	-o-transform: scale(0,0);
	-ms-transform: scale(0,0);
	transform: scale(0,0);
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-ms-transition-property: -ms-transform;
	transition-property: transform;
	-webkit-backface-visibility: hidden;
}
.tooltipster-grow.tooltipster-show {
	-webkit-transform: scale(1,1);
	-moz-transform: scale(1,1);
	-o-transform: scale(1,1);
	-ms-transform: scale(1,1);
	transform: scale(1,1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}

/* swing */

.tooltipster-swing {
	opacity: 0;
	-webkit-transform: rotateZ(4deg);
	-moz-transform: rotateZ(4deg);
	-o-transform: rotateZ(4deg);
	-ms-transform: rotateZ(4deg);
	transform: rotateZ(4deg);
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-ms-transition-property: -ms-transform;
	transition-property: transform;
}
.tooltipster-swing.tooltipster-show {
	opacity: 1;
	-webkit-transform: rotateZ(0deg);
	-moz-transform: rotateZ(0deg);
	-o-transform: rotateZ(0deg);
	-ms-transform: rotateZ(0deg);
	transform: rotateZ(0deg);
	-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 1);
	-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
	-moz-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
	-ms-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
	-o-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
	transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
}

/* fall */

.tooltipster-fall {
	-webkit-transition-property: top;
	-moz-transition-property: top;
	-o-transition-property: top;
	-ms-transition-property: top;
	transition-property: top;
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-fall.tooltipster-initial {
	top: 0 !important;
}
.tooltipster-fall.tooltipster-show {
}
.tooltipster-fall.tooltipster-dying {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
	transition-property: all;
	top: 0 !important;
	opacity: 0;
}

/* slide */

.tooltipster-slide {
	-webkit-transition-property: left;
	-moz-transition-property: left;
	-o-transition-property: left;
	-ms-transition-property: left;
	transition-property: left;
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-slide.tooltipster-initial {
	left: -40px !important;
}
.tooltipster-slide.tooltipster-show {
}
.tooltipster-slide.tooltipster-dying {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
	transition-property: all;
	left: 0 !important;
	opacity: 0;
}

/* Update animations */

/* We use animations rather than transitions here because
 transition durations may be specified in the style tag due to
 animationDuration, and we try to avoid collisions and the use
 of !important */

/* fade */

@keyframes tooltipster-fading {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.tooltipster-update-fade {
	animation: tooltipster-fading 400ms;
}

/* rotate */

@keyframes tooltipster-rotating {
	25% {
		transform: rotate(-2deg);
	}
	75% {
		transform: rotate(2deg);
	}
	100% {
		transform: rotate(0);
	}
}

.tooltipster-update-rotate {
	animation: tooltipster-rotating 600ms;
}

/* scale */

@keyframes tooltipster-scaling {
	50% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1);
	}
}

.tooltipster-update-scale {
	animation: tooltipster-scaling 600ms;
}

/**
 * DEFAULT STYLE OF THE SIDETIP PLUGIN
 *
 * All styles are "namespaced" with .tooltipster-sidetip to prevent
 * conflicts between plugins.
 */

/* .tooltipster-box */

.tooltipster-sidetip .tooltipster-box {
	background: #444444;
	border: none;
	border-radius: 5px;
	padding: 12px 20px 15px 8px;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	max-width: 300px;
	font-weight: 200;
	letter-spacing: 0.3px;
}

	.tooltipster-sidetip .tooltipster-box a
	{
		color: #fff;
		font-weight: 200;
		display: block;
		margin-bottom: 13px;
		font-size: 16px;
		cursor: pointer;
	}

		.tooltipster-sidetip .tooltipster-box a:last-child
		{
			margin-bottom: 0;
		}

	.tooltipster-sidetip .tooltipster-box a:hover
	{
		color: #ee4a23;
	}

	.tooltipster-sidetip .tooltipster-box .separator
	{
		border-bottom: solid #fff 1px;
		margin-top: -2px;
		margin-bottom: 10px;
		opacity: 0.2;
		width: 10px;
	}

	.tooltipster-sidetip .tooltipster-box .text-separator
	{
		font-size: 12px;
		/* margin: 10px 0; */
		font-weight: 300;
		letter-spacing: 2px;
		opacity: 0.5;
		margin-top: -2px;
		margin-bottom: 10px;
	}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
	margin-top: 8px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-box {
	margin-right: 8px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-box {
	margin-left: 8px;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-box {
	margin-bottom: 8px;
}

/* .tooltipster-content */

.tooltipster-sidetip .tooltipster-content {
	color: white;
	line-height: 18px;
	padding: 6px 14px;
}

/* .tooltipster-arrow : will keep only the zone of .tooltipster-arrow-uncropped that
corresponds to the arrow we want to display */

.tooltipster-sidetip .tooltipster-arrow {
	overflow: hidden;
	position: absolute;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow {
	height: 10px;
	/* half the width, for centering */
	margin-left: -10px;
	top: 0;
	width: 20px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow {
	height: 20px;
	margin-top: -10px;
	right: 0;
	/* top 0 to keep the arrow from overflowing .tooltipster-base when it has not
	been positioned yet */
	top: 0;
	width: 10px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
	height: 20px;
	margin-top: -10px;
	left: 0;
	/* same as .tooltipster-left .tooltipster-arrow */
	top: 0;
	width: 10px;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow {
	bottom: 0;
	height: 10px;
	margin-left: -10px;
	width: 20px;
}

/* common rules between .tooltipster-arrow-background and .tooltipster-arrow-border */

.tooltipster-sidetip .tooltipster-arrow-background, .tooltipster-sidetip .tooltipster-arrow-border {
	height: 0;
	position: absolute;
	width: 0;
}

/* .tooltipster-arrow-background */

.tooltipster-sidetip .tooltipster-arrow-background {
	border: 10px solid transparent;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
	border-bottom-color: #444444;
	left: 0px;
	top: 3px;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
	border-left-color: #444444;
	left: -3px;
	top: 0px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
	border-right-color: #444444;
	left: 3px;
	top: 0px;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
	border-top-color: #444444;
	left: 0px;
	top: -3px;
}

/* .tooltipster-arrow-border */

.tooltipster-sidetip .tooltipster-arrow-border {
	border: 10px solid transparent;
	left: 0;
	top: 0;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border {
	border-bottom-color: #444444;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border {
	border-left-color: #444444;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
	border-right-color: #444444;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
	border-top-color: #444444;
}

/* tooltipster-arrow-uncropped */

.tooltipster-sidetip .tooltipster-arrow-uncropped {
	position: relative;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped {
	top: -10px;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped {
	left: -10px;
}

/*
* MOMENTUM PANEL
*/

#momentum-panel
{
    display: flex;
    align-items: center;
    margin: 0;
    height: 60px;
    padding: 10px;
}

    #momentum-panel .item
    {
    }

    #momentum-panel .item.tip
    {
        text-align: left;
        flex-basis: 55px;
        padding-left: 5px;
    }

    #momentum-panel .item.tip .icon
    {
        width: 22px;
        height: 22px;
        opacity: 0.2;
    }

    #momentum-panel .item.score
    {
        text-align: center;

    }

        #momentum-panel .item.score .title
        {
            color: #ee4a23;
            font-size: 26px;
            font-weight: 400;
            letter-spacing: 1px;
            line-height: 26px;
        }

        #momentum-panel .item.score .tag
        {
            color: #ee4a23;
            font-size: 10px;
            font-weight: 300;
            letter-spacing: 1px;
        }

    #momentum-panel .item.dots
    {
        text-align: left;
        flex-grow: 1;
        padding-left: 30px;
        line-height: 19px;
        white-space: nowrap;
    }

        #momentum-panel .item.dots b
        {
            display: inline-block;
            height: 12px;
            width: 12px;
            background: #d6d6d6;
            border-radius: 6px;
            margin-right: 6px;
        }

            #momentum-panel .item.dots b.punched
            {
                background: #ee4a23;
            }


    #momentum-panel .item.action
    {
        text-align: right;
        padding-right: 3px;
        white-space: nowrap;
    }

        #momentum-panel .item.action button
        {
            width: 120px;
            text-align: center;
        }

/*
* MOMENTUM - RESPONSIVE
*/

@media (max-width: 670px)
{
    #momentum-panel .item.dots
    {
        display: none;
    }

    #momentum-panel .item.score, #momentum-panel .item.action
    {
        flex-grow: 1;
    }
}

/*
* CHAT
*/

.chat-date-banner
{
    width: 100%;
    text-align: center;
    border-bottom: 2px dotted #eee;
    line-height: 0.1em;
    margin: 30px 0;
}

    .chat-date-banner span
    {
        background:#fff;
        padding:0 10px;
        color: #999;
        font-size: 14px;
        font-weight: 300;
    }

.chat
{
    display: flex;
    align-items: flex-start;
}

    .chat.L1
    {
        margin-bottom: 25px;
        margin-top: 25px;
    }

    .chat.L2, .chat.L3, .chat.L4, .chat.L5, .chat.L6, .chat.L7, .chat.L8, .chat.L9, .chat.L10
    {
        margin-bottom: 25px;
        margin-top: 25px;
        padding-left: 10px;
    }

    .chat.L2 { margin-left: 33px; }
    .chat.L3 { margin-left: 75px; }
    .chat.L4 { margin-left: 120px; }
    .chat.L5 { margin-left: 162px; }
    .chat.L6 { margin-left: 205px; }
    .chat.L7 { margin-left: 245px; }
    .chat.L8 { margin-left: 287px; }
    .chat.L9 { margin-left: 330px; }
    .chat.L10 { margin-left: 370px; }

    .chat .avatar img
    {
        width: 60px;
        height: 60px;
        border-radius: 60px;
    }

    .chat .avatar
    {
        text-align: center;
        padding-right: 0;
        margin-right: 5px;
        width: 90px;
        min-width: 90px;
        cursor: pointer;
    }

        .chat .avatar b
        {
            margin-top: -3px;
            font-size: 14px;
            color: #ee4a23;
            font-weight: 700;
            display: block;
            line-height: 18px;
            /* border: solid red 1px; */
            max-width: 90px;
            text-overflow: ellipsis;
            overflow: hidden;
        }

        .chat .avatar i
        {
            font-size: 11px;
            color: #ee4a23;
            font-weight: 400;
            letter-spacing: 0.3px;
            display: block;
            white-space: nowrap;
            /* border: solid red 1px; */
        }

    .chat .callout
    {
        padding-left: 2px;
    }
        .chat .callout i
        {
            position: absolute;
            margin: 21px 0 0 -14px;
            width: 0;
            height: 0;
            border-top: 10px solid transparent;
            border-bottom: 10px solid transparent;
            border-right: 17px solid #eee; /* f7f6f6 f5f5f5 eee f3f3f3 */
        }

            .chat.is-new .callout i
            {
                border-right: 17px solid #fff1d7;
            }

    .chat .bubble
    {
        background: #eee;
        border-radius: 6px;
        padding: 4px 15px 32px 15px;
        min-width: 220px;
    }

        .chat.is-new .bubble
        {
            background: #fff1d7;
        }

        .chat .bubble .text img
        {
            max-width: 100px;
            max-height: 50px;
            border-radius: 4px;
            cursor: pointer;
            margin: 0 5px 5px 5px;
            padding: 0;
            vertical-align: middle;
        }

        .chat .bubble .text img.pdf
        {
            max-height: 50px;
            border: none;
            border-radius: 0;
            padding: 0;
            opacity: 0.9;
            margin: 0 1px 5px 1px;
        }

        .chat .bubble .text .emoji
        {
            width: 25px;
            height: 25px;
            cursor: default;
            margin: 0;
        }

        .chat .bubble .text strong,
        .chat .bubble .text b,
        #nugget #submission strong,
        #nugget #analysis strong
        {
            font-weight: 600;
        }

        .chat .bubble .text a
        {
            text-decoration: underline !important;
            color: #000 !important;
        }

            .chat .bubble .text a:hover
            {
                color: #ee4a23 !important;
            }

            .chat .bubble .text p, .chat .bubble .text blockquote
            {
                color: #000;
                letter-spacing: 0;
                margin: 10px 5px;
                font-size: 15px;
                font-weight: 300;
                line-height: 20px;
            }

            .chat .bubble .text ol li, .chat .bubble .text ul li
            {
              margin-bottom: 7px;
            }

            .chat .bubble .text blockquote,
            #nugget #submission blockquote,
            #nugget #analysis blockquote
            {
                margin: 20px 0 20px 7px;
                border-left: solid #ee4a23 2px;
                padding-left: 5px;
                font-style: italic;
            }

            #nugget #analysis blockquote
            {
                color: #fff;
            }

            .chat .bubble .text code,
            #nugget #submission code,
            #nugget #analysis code
            {
                color: #ee4a23;
                background: #f9f9f9;
                padding: 0 5px 2px 5px;
                border: solid #ddd 1px;
                border-radius: 4px;
                font-size: 14px;
            }

            #nugget #analysis code
            {
                border: none;
                background: #ddd;
                color: #555;
            }

            .chat .bubble .text pre, #nugget #submission  pre
            {
                letter-spacing: 0.3px;
                line-height: 20px;
                background: #92999f;
                padding: 20px;
                border-radius: 4px;
                white-space: pre-wrap;       /* Since CSS 2.1 */
                white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
                white-space: -pre-wrap;      /* Opera 4-6 */
                white-space: -o-pre-wrap;    /* Opera 7 */
                word-wrap: break-word;       /* Internet Explorer 5.5+ */
            }

                .chat .bubble .text pre code, #nugget #submission  pre code
                {
                    color: #fff;
                    background: none;
                    padding: 0;
                    border: none;
                    border-radius: 0;
                }

            .chat .bubble .text a
            {
                color: #ee4a23;
                color: #000;
                font-weight: 300;
            }

                .chat .bubble .text a.name
                {
                    font-weight: 500;
                    color: #000;
                }

                    .chat .bubble .text a.name:hover
                    {
                        text-decoration: underline;
                    }

            .chat.right .bubble .text
            {
                text-align: right;
            }

        .chat .bubble .info
        {
            font-size: 12px;
            color: #ee4a23;
            font-weight: 300;
            height: 22px;
            line-height: 20px;
            margin-bottom: -15px;
            /* margin-top: -5px; */
        }

            .chat.right .bubble .info
            {
                /* text-align: right; */
            }

            .chat .bubble .info a, .chat .bubble .info span, .chat .bubble .info .icon
            {
                vertical-align: middle;
            }

                .chat .bubble .info .number
                {
                    display: inline-block;
                    margin-top: -3px;
                }

            .chat .bubble .info .icon.edit
            {
                fill: #ee4a23;
                width: 17px;
                margin: -2px 2px 2px 0;
            }

                .chat .bubble .info .icon.edit:hover
                {
                    fill: #000;
                }

            .chat .bubble .info .icon.reply
            {
                fill: #ee4a23;
                width: 17px;
                margin: -2px 2px 2px 0;
            }

                .chat .bubble .info .icon.reply:hover
                {
                    fill: #000;
                }

            .chat .bubble .info .icon.upvote
            {
                fill: #ee4a23;
                width: 28px;
                margin: -5px 0 0 -2px;
            }

                .chat .bubble .info .icon.upvote:hover
                {
                    fill: #000;
                }

            .chat .bubble .info a
            {
                color: #ee4a23;
            }

                .chat .bubble .info a:hover
                {
                    text-decoration: underline;
                }

/*
* CHAT - RESPONSIVE
*/

@media (max-width: 800px)
{
    .chat.L2, .chat.L3, .chat.L4, .chat.L5, .chat.L6, .chat.L7, .chat.L8, .chat.L9, .chat.L10 { border-left: none; }
    .chat .callout i { margin: 13px 0 0 -14px; }
    .chat .bubble .text a.name { display: inline; }
    .chat.L2 { margin-left: 20px; }
    .chat.L3 { margin-left: 40px; }
    .chat.L4 { margin-left: 60px; }
    .chat.L5 { margin-left: 80px; }
    .chat.L6 { margin-left: 100px; }
    .chat.L7 { margin-left: 120px; }
    .chat.L8 { margin-left: 140px; }
    .chat.L9 { margin-left: 160px; }
    .chat.L10 { margin-left: 180px; }
    .chat { display: block; }
    .chat .avatar { position: absolute; margin: 18px 0 0 20px; width: 150px;  }
    .chat .avatar img { display: none; }
    .chat .avatar i { display: none; }
    .chat .avatar b { max-width: 150px; text-align: left; }
    .chat .bubble .text { padding-top: 28px;}
}


@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.pulse {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: pulse;
    animation-name: pulse;
    border: dashed red 1px ! important;
}

.pulse-only
{
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: pulse;
    animation-name: pulse;
}

@keyframes sys-message-show {
  from {
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.sys-message-show {
    animation-timing-function: cubic-bezier(0, 0, 0.5, 0);
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: sys-message-show;
    animation-name: sys-message-show;
}

@keyframes sys-message-hide {
    from {
      transform: translate3d(0, 0, 0);
    }

    to {
      visibility: hidden;
      transform: translate3d(0, -100%, 0);
    }
}

.sys-message-hide {
    animation-timing-function: cubic-bezier(0, 0, 0.5, 0);
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: sys-message-hide;
    animation-name: sys-message-hide;
}

.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1s infinite ease-in-out;
  animation: load7 1s infinite ease-in-out;
}
.loader {
  display: none;
  color: #ee4a23;
  font-size: 10px;
  overflow: visible;
  margin: 0 auto;
  position: relative;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
.loader:before,
.loader:after {
  content: '';
  position: absolute;
  top: 0;
}
.loader:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader:after {
  left: 3.5em;
}
@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
@keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

/*
* POPUPS
*/

#blocker
{
    display: none;
	position: fixed;
    z-index: 3;
	top: 0;
	left: 0;
    width: 100%;
    height: 100%;
	background: #000;
	opacity:0.6;
}

#working
{
    position: fixed;
    z-index: 4;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
    display: flex;
    align-items: center;
}

    #working .loader
    {
        margin-top: -100px;
    }

/*
* POPUP FOUNDATION
*/

#pop
{
    display: none;
    position: absolute;
    z-index: 5;
	top: 0;
	right: 0;
	left: 0;
    justify-content: center;
    align-items: center;
    margin-bottom: 100px;
}

    #pop-content
    {
        background: #fff;
        border-radius: 5px;
        width: 550px;
        padding: 20px 25px;
    }

        #pop-content.thin
        {
            width: 300px;
        }

        #pop-content .checkin-hint
        {
            margin: 15px 0 7px 0;
            font-size: 14px;
        }

        #pop-content .action
        {
            text-align: center;
            margin-top: 15px;
        }

        #pop-content .stage-number
        {
            font-size: 14px;
            color: #ee4a23;
            letter-spacing: 1px;
            font-weight: 200;
            margin-bottom: 5px;
        }

        #pop-content .stage-title
        {
            font-size: 20px;
            color: #ee4a23;
            letter-spacing: 1px;
            font-weight: 400;
        }

        #pop-content .stage-overview
        {
            background: #eee;
            padding: 9px 11px 12px 11px;
            border: solid #ddd 1px;
            border-radius: 4px;
            margin-top: 20px;
            margin-bottom: -10px;
            color: #000;
            font-size: 14px;
            line-height: 16px;
            letter-spacing: 0.5px;
        }

            #pop-content .stage-overview.inside
            {
                border-bottom-left-radius: 0;
                border-bottom-right-radius: 0;
                margin-bottom: -14px;
                padding: 9px 11px 13px 11px;
            }

            #pop-content .stage-overview.inside.complete
            {
                border-bottom-left-radius: 4px;
                border-bottom-right-radius: 4px;
                margin-bottom: -14px;
                padding: 9px 11px 9px 11px;
            }

        #pop-content .next-step
        {
            text-align: center;
            margin: 11px 0 -12px 0;
            border: solid #ddd 1px;
            padding-top: 15px;
            padding-bottom: 17px;
            background: #f9f9f9;
            border-radius: 4px;
            border-top-left-radius: 0;
            border-top-right-radius: 0;
            border-top: none;
        }

            #pop-content .next-step a
            {
                font-size: 18px;
                color: #ee4a23;
                text-transform: uppercase;
                letter-spacing: 1px;
                display: inline-block;
            }

                #pop-content .next-step a .play
                {
                    width: 23px;
                    vertical-align: middle;
                    fill: #ee4a23;
                    margin: -5px 0 0 -5px;
                }

                #pop-content .next-step a:hover .play
                {
                    fill: #000;
                }

                #pop-content .next-step a:hover
                {
                    color: #000;
                    font-weight: 500;
                }

                #pop-content .next-step .lock
                {
                    fill: #FCAA4E;
                    width: 40px;
                }

                #pop-content .next-step .hint
                {
                    font-size: 14px;
                    color: #999;
                }


        #pop-content .close .icon
        {
            width: 24px;
            float: right;
            cursor: pointer;
            fill: #d6d6d6;
            margin: -5px -7px 0 0;
        }

        #pop-content .toc
        {
            margin-top: 30px;
        }

            #pop-content .toc .item
            {
                display: flex;
                justify-content: space-between;
                align-items: flex-start;
                margin-bottom: 7px;
                border-bottom: dotted #ddd 1px;
                padding-bottom: 7px;
            }

                #pop-content .toc .item:last-child
                {
                    border-bottom: none;
                }

                #pop-content .toc .item .symbol .icon
                {
                    width: 24px;
                    fill: #aaa;
                }

                    #pop-content .toc .item.complete .symbol .icon
                    {
                        fill: #ddd;
                    }

                    #pop-content .toc .item.doing .symbol .icon
                    {
                        fill: #000;
                        border-bottom: solid #000 2px;
                        padding-bottom: 2px;
                    }

                    #pop-content .toc .item .symbol .icon.chat
                    {
                        margin: 0;
                    }

                    #pop-content .toc .item .symbol .icon.book
                    {
                        margin: -2px 0 0 0;
                    }

                #pop-content .toc .item .title
                {
                    text-align: left;
                    flex-grow: 1;
                    color: #000;
                    font-size: 16px;
                    letter-spacing: 1px;
                    padding-left: 15px;
                    padding-right: 15px;
                    font-weight: 300;
                }

                    #pop-content .toc .item .title a
                    {
                    }

                    #pop-content .toc .item.complete .title a
                    {
                        text-decoration: line-through;
                    }

                    #pop-content .toc .item.complete .title a:hover
                    {
                        text-decoration: none;
                    }

                    #pop-content .toc .item.doing .title a
                    {
                        color: #000;
                        font-weight: 400;
                    }

                        #pop-content .toc .item.doing .title a:hover
                        {
                            color: #ee4a23;
                        }

                #pop-content .toc .item .status
                {
                    white-space: nowrap;
                    font-size: 12px;
                    color: #aaaaaa;
                    font-weight: 200;
                    padding-top: 3px;
                }

                    #pop-content .toc .item.doing .status
                    {
                        color: #000;
                        font-weight: 400;
                    }

                    #pop-content .toc .item .status .check
                    {
                        fill: #92d36e;
                        width: 30px;
                        position: absolute;
                        margin: -8px 0 0 -28px;
                    }


/*
* ALERT POPUP
*/

#pop-content .alert
{
    text-align: center;
    padding: 20px 0 10px 0;
}

    #pop-content .alert .message
    {
        font-size: 17px;
        margin-bottom: 30px;
        letter-spacing: 0.5px;
        font-weight: 300;
    }

    #pop-content .alert button
    {
        width: 100px;
        text-align: center;
    }

    #pop-content .alert button.cancel
    {
        margin-right: 10px;
        background: #999;
    }

/*
* LIST POPUP
*/

#list-popup .title
{
    color: #ee4a23;
    font-weight: 300;
    font-size: 40px;
    letter-spacing: 0.3px;
    margin: 0 0 0 10px;
}

#list-popup .body
{
    margin: 10px 0 30px 10px;
    font-size: 22px;
    letter-spacing: 0.3px;
    font-weight: 300;
}

#list-popup .email input
{
    background: #ebebeb;
    border: none;
    border-radius: 4px;
    width: 97%;
    padding: 12px 15px 14px 15px;
    font-size: 16px;
    border: solid #fff 1px;
    margin-left: 10px;
}

#list-popup .actions
{
    text-align: center;
    margin: 30px 0 15px 0;
}

    #list-popup .actions button
    {
        padding-left: 20px;
        padding-right: 20px;
    }

/*
* MOMENTUM POPUP
*/

#comment-popup .title
{
    color: #ee4a23;
    font-weight: 400;
    font-size: 20px;
    letter-spacing: 0.3px;
    margin: 0 0 20px 10px;
}

#comment-popup textarea
{
    border: none;
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    padding-bottom: 20px;
    min-height: 110px;
}

#comment-popup .hint
{
    font-size: 12px;
    margin: -3px 0 0 0;
    color: #aaa;
    text-align: left;
    background: #ebebeb;
    padding: 0 15px 10px 15px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

#comment-popup .icons
{
    position: absolute;
    cursor: pointer;
    fill: #ee4a23;
    margin-top: 24px;
}

    #comment-popup .icons .icon.upload2 { width: 32px; vertical-align: middle; margin: 0 0 0 0; }
    #comment-popup .icons .icon.delete { width: 28px; vertical-align: middle; margin: -3px 5px 0 0;}

        #comment-popup .icons .icon:hover { fill: #333; }

#comment-popup .actions
{
    text-align: center;
    margin: 25px 0 0 0;
    height: 39px;
}

    #comment-popup .actions .loader
    {
        position: absolute;
        margin: -20px 0 0 0;
    }

    #list-popup .actions button
    {
        padding-left: 20px;
        padding-right: 20px;
    }

/*
* PROFILE POPUP
*/

#profile-pop
{
    text-align: center;
}

    #profile-pop img
    {
        max-width: 250px;
        max-height: 250px;
        border-radius: 5px;
    }

    #profile-pop .username
    {
        color: #ee4a23;
        font-size: 24px;
        font-weight: 400;
        letter-spacing: 2px;
        line-height: 24px;
    }

        #profile-pop .username span
        {
            font-weight: 200;
            font-size: 10px;
            letter-spacing: 1px;
            background: #bbb;
            color: #fff;
            padding: 0 3px 4px 3px;
            border-radius: 2px;
            vertical-align: top;
        }

    #profile-pop .batch
    {
        margin: 10px 0 0 0;
        color: #000;
    }

        #profile-pop .batch-status
        {
            margin: 7px 0 0 0;
            font-size: 12px;
            color: #888;
        }

    #profile-pop .info
    {
        color: #777;
        font-size: 14px;
        margin: 3px 0 0 0;
        letter-spacing: 0.5px;
    }

    #profile-pop .bio
    {
        margin: 20px 0 0 0;
        padding: 3px 25px 5px 25px;
        font-size: 15px;
        letter-spacing: 0.5px;
        text-align: left;
        color: #333;
    }

        #profile-pop .bio a
        {
            color: #333;
            text-decoration: underline;
        }

        #profile-pop .bio .hint
        {
            text-align: center;
            color: #999;
            padding: 10px 0;
        }

/* TABLE AND STATS */
#profile-pop table
{
    margin: 0 0 20px 0;
}

    #profile-pop table.styled tr:nth-child(odd) { background: #eee; }
    #profile-pop table.styled tr:nth-child(even) { background: #fff; }

#profile-pop td.key
{
    text-align: right;
    border-right: none;
    padding-right: 0;
    font-size: 15px;
}

#profile-pop td.data
{
    text-align: left;
    padding-left: 5px;
    font-size: 15px;
}
    #profile-pop .action-links
    {
        margin: 15px 0 20px 0;
        padding-right: 15px;
    }

    #profile-pop .action-links a
    {
        font-size: 12px;
        background: #ee4a23;
        color: #fff;
        padding: 4px 10px 6px 10px;
        display: inline-block;
        border-radius: 4px;
        letter-spacing: 0.3px;
        text-transform: uppercase;
        margin: 0 5px;
    }

        #profile-pop .action-links a:hover
        {
            text-decoration: underline;
        }

    #profile-pop .action-links a:last-of-type
    {

    }

/*
* HEADER - SHARED
*/

#header
{
    background: #fafafa;
    padding: 50px 50px 40px 50px;
    border-bottom: solid #eee 1px;
    height: 145px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/*
* HEADER - ROCKET
*/

#header-rocket .line
{
    float: left;
    background: #ee4a23;
    height: 4px;
    width: 20%;
    margin-top: -2px;
}

#header-rocket .icon
{
    float: left;
    fill: #ee4a23;
    width: 31px;
    height: 31px;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -16px;
    margin-left: -9px;
}

.tooltip-templates { display: none; }

/*
* HEADER - PUBLIC
*/

.public #header .links
{
    float: right;
    margin-top: 12px;
}

    .public #header .links a
    {
        font-weight: 200;
        letter-spacing: 1px;
        margin-left: 30px;
    }

        .public #header .links a.selected
        {
            font-weight: 600;
            color: #000;
        }

    .public #header .links a:first-of-type
    {
        margin-left: 0px;
    }

    .public #header .robot
    {
        position: absolute;
        width: 50px;
        fill: #EE4A23;
        margin: -3px 0 0 -2px;
    }

    .public #header .nugget
    {
        position: absolute;
        width: 234px;
        fill: #a9a9a9;
        margin: -3px 0 0 59px;
    }

    @media (max-width: 900px)
    {
        .public #header { padding: 35px 50px 30px 35px; height: 120px; }
        .public #header img { margin-left: 60px; width: 270px; height: auto; }
        .public #header .robot { width: 46px; margin-left: 58px; }
        .public #header .nugget { width: 218px; margin-left: 115px; }
    }

    @media (max-width: 800px)
    {
        .public #header { padding: 30px 50px 25px 35px; height: 110px; }
        .public #header img { margin-left: 55px; width: 260px; height: auto; }
        .public #header .robot { width: 45px; margin-left: 53px; }
        .public #header .nugget { width: 208px; margin-left: 108px; }
    }

    @media (max-width: 700px)
    {
        .public #header { padding: 30px 50px 25px 35px; height: 105px; }
        .public #header img { width: 250px; height: auto; }
        .public #header .robot { width: 44px; margin-left: 53px; }
        .public #header .nugget { width: 202px; margin-left: 105px; }
    }

/*
* HEADER - PUBLIC MOBILE
*/

.public #header nav
{
    display: none;
}

.public #header nav
{
    position: absolute;
    margin-top: 10px;
}

.public #menuToggle
{

  display: block;
  position: relative;
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
}

.public #menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;

  cursor: pointer;

  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */

  -webkit-touch-callout: none;
}

.public #menuToggle span
{
    display: block;
    width: 33px;
    height: 2px;
    margin-bottom: 6px;
    position: relative;
    background: #ee4a23;
    border-radius: 3px;
    z-index: 1;
    transform-origin: 2px 0px;
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

.public #menuToggle span:first-child
{
    transform-origin: 0% 0%;
}

.public #menuToggle span:nth-last-child(2)
{
    transform-origin: 0% 100%;
}

.public #menuToggle input:checked ~ span
{
    opacity: 1;
    transform: rotate(45deg) translate(-2px, -1px);
    background: #fff;
}

.public #menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

.public #menuToggle input:checked ~ span:nth-last-child(2)
{
    transform: rotate(-45deg) translate(0, -1px);
}

.public #menu
{
    white-space: nowrap;
    position: absolute;
    margin: -84px 0 0 -50px;
    padding: 50px 50px 35px 50px;
    padding-top: 110px;
    background: #444444;
    list-style-type: none;
    -webkit-font-smoothing: antialiased;
    transform-origin: 0% 0%;
    transform: translate(-300%, 0);
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    border-bottom-right-radius: 10px;
    border-right: solid #ccc 1px;
    border-bottom: solid #ccc 1px;
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
}

.public #menu a
{
    color: #fff;
    font-weight: 300;
    letter-spacing: 1px;
}

.public #menu li
{
    padding: 5px 0;
    font-size: 19px;
}

.public #menu li.separator
{
    border-bottom: solid #fff 1px;
    margin-top: 0;
    margin-bottom: 10px;
    width: 10px;
    opacity: 0.2;
}


.public #menuToggle input:checked ~ ul
{
    transform: none;
}

/*
* HEADER NAV - RESPONSIVE
*/


@media (max-width: 900px)
{
    .public .links { display: none; }
    .public #header nav { display: inline-block; }
}

/*
* HEADER - LOGGED IN
*/

.authed #header
{
    display: flex;
    justify-content: space-between;
}

    .authed #header .item
    {
    }

        .authed #header .item.home
        {
            display: flex;
            align-items: center;
            margin-top: -3px;
        }

            .authed #header .item.home .symbol
            {
            }

            .authed #header .item.home .info
            {
                text-align: center;
                position: absolute;
                margin-left: 60px;

            }

                .authed #header .item.home .info .karma
                {
                    font-size: 18px;
                    font-weight: 300;
                    color: #bbb;
                    letter-spacing: 1.5px;
                    margin-bottom: 1px;
                    padding-top: 1px;
                }

                .authed #header .item.home .info .name
                {
                    font-size: 12px;
                    font-weight: 200;
                    color: #bbb;
                    letter-spacing: 1px;
                }


    .authed #header .item .icon
    {
        fill: #d6d6d6;
    }

        .authed #header .item.selected .icon
        {
            fill: #ee4a23;
        }

        .authed #header .icon:hover
        {
            fill: #bbb;
        }

        .authed #header .icon.robot { width: 54px; }
        .authed #header .icon.diamond { width: 39px; margin-top: 8px; }
        .authed #header .icon.momentum { width: 50px; margin-top: 3px; }
        .authed #header .icon.rocket2 { width: 47px; }
        .authed #header .icon.settings { width: 34px; margin-top: 11px; }
        .authed #header .icon.account { width: 43px; margin-top: 4px; margin-left: -10px;}

/*
* HEADER - LOGGED IN - RESPONSIVE
*/

@media (max-width: 650px)
{
    .authed #header .item.home .info
    {
        display: none;
    }
}

/*
* ROCKET STATUS
*/

#rocket-status
{
    display: flex;
    justify-content: space-evenly;
    align-content: stretch;
    margin-top: -2px;
}

    #rocket-status .step
    {
        flex-grow: 1;
        border-top: solid #d6d6d6 4px;
        font-size: 12px;
        padding-top: 5px;
        padding-left: 5px;
    }

        #rocket-status .step a.tooltip
        {
            display: block;
            position: absolute;
            color: #aaaaaa;
            font-weight: 300;
            padding: 0 3px;
            z-index: 2;
            height: 18px;
            text-align: center;
            margin: 2px 0 0 -12px;
        }

        #rocket-status .step.line
        {
            border-top: solid #ee4a23 4px;
        }

        #rocket-status .step.title
        {
            color: #ee4a23;
            font-weight: 400;
        }

        #rocket-status .step.number a.tooltip
        {
            color: #ee4a23;
            font-weight: 700;
        }

        #rocket-status .step.doing a.tooltip
        {
            /* color: #ee4a23; */
            /* font-weight: 700; */
            /* border-bottom: solid #ee4a23 1px; */
        }

        #rocket-status .step a.tooltip:hover
        {
            color: #000;
            font-weight: 700;
        }

        #rocket-status .step.selected a.tooltip
        {
            color: #000;
            font-weight: 700;
            border-bottom: solid #000 2px;
        }

        #rocket-status .step .rocket
        {
            position: absolute;
            fill: #ee4a23;
            width: 31px;
            height: 31px;
            -ms-transform: rotate(45deg);
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
            margin-top: -24px;
            margin-left: -26px;
            z-index: 1;
        }

        #rocket-status .step.complete .rocket
        {
            margin-top: -24px;
            right: -8px;
        }

        #rocket-status .step.check
        {
            text-align: center;
        }

            #rocket-status .step .check
            {
                position: absolute;
                fill: #d6d6d6;
                width: 22px;
                height: 22px;
                margin-top: -4px;
            }

            #rocket-status .step.complete .check
            {
                fill: #ee4a23;
            }

#header-rocket .line
{
    float: left;
    background: #ee4a23;
    height: 4px;
    width: 20%;
    margin-top: -2px;
}

.copy #content
{
    max-width: 750px;
    margin: 0 auto 0 auto;
    padding-top: 40px;
}

.copy h1
{
    color: #ee4a23;
    font-weight: 200;
    font-size: 54px;
    margin: 0;
}

.copy h2
{
    color: #ee4a23;
    font-weight: 200;
    font-size: 28px;
    margin: 30px 0 0 0;
}

.copy ol
{
    margin: 25px 0 0 0 ;
}

.copy li
{
    margin-bottom: 20px;
}

@media (max-width: 820px) { .copy #content { margin: 0 40px; padding-top: 20px; } }
@media (max-width: 500px) { .copy #content { margin: 0 20px; padding-top: 0; } }

#daily h1
{
    color: #ee4a23;
    font-weight: 200;
    font-size: 60px;
    line-height: 70px;
    text-align: center;
    max-width: 850px;
    margin: 70px auto 65px auto;
    padding: 0 50px;
}

    @media (max-width: 900px) { #daily h1 { font-size: 55px; line-height: 60px; margin-top: 60px; } }
    @media (max-width: 800px) { #daily h1 { margin-top: 55px; } }
    @media (max-width: 700px) { #daily h1 { font-size: 50px; line-height: 50px; margin-top: 55px; margin-bottom: 50px; } }
    @media (max-width: 500px) { #daily h1 { font-size: 45px; line-height: 45px; padding: 0 30px; } }
    @media (max-width: 400px) { #daily h1 { padding: 0 20px; } }

#daily h2
{
    color: #ee4a23;
    font-weight: 200;
    font-size: 46px;
    line-height: 52px;
    text-align: center;
    max-width: 900px;
    margin: 90px auto 30px auto;
    padding: 0 50px;
}

    @media (max-width: 500px) { #home h2 { font-size: 36px; line-height: 40px; } }

#daily h3
{
    color: #606060;
    font-weight: 200;
    font-size: 18px;
    line-height: auto;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    padding: 0 50px;
}

#daily h3 b
{
 font-weight: 500;
}

#daily #nugget-panel
{
    background: #fff;
    border: 0;
}

    #daily #nugget-panel .item
    {
        background: #fafafa !important;
        color: #000 !important;
    }

    #daily #nugget-panel h3
    {
        font-weight: 200;
        font-size: 22px;
        line-height: 28px;
        margin: 20px auto 50px auto;
    }

/*
* LEARN MORE
*/

#list-signup
{
	display: block;
	background: #fafafa;
    border: solid #eee 1px;
	border-radius: 5px;
	width: 325px;
	margin: 0 auto 0 auto;
	padding: 0;
	text-align: center;
}

	#list-signup .hint
	{
		color: #444444;
		margin: 15px 0 10px 0;
		font-size: 15px;
		letter-spacing: 1px;
	}

	#list-signup .hint b
	{
		font-weight: 600;
	}

	#list-signup button, #list-signup .button
	{
		font-size: 13px;
		padding: 10px 20px;
		margin: 5px 0 18px 0;
	}

/*
* LEARN MORE - RESPONSIVE
*/

@media (max-width: 900px)
{
	#list-signup { width: 325px; }
}

/*
* PLANS
*/

#plans
{
    margin-top: 50px;
    text-align: center;
}

    #plans .plan
    {
        display: inline-block;
        vertical-align: middle;
        background: #f7f6f6;
        border: solid #d6d6d6 1px;
        border-radius: 4px;
        width: 240px;
    }

    #plans .plan.left
    {
        border-right: none;
    }

    #plans .plan.right
    {
        border-left: none;
    }

    #plans .plan.middle
    {
        width: 290px;
        height: 460px;
    }

        #plans .plan.middle .features
        {
            height: 300px;
        }

    #plans .plan.right, #plans .plan.left
    {
        height: 390px;
    }

        #plans .plan .features
        {
            text-align: left;
            padding: 7px 20px;
            height: 240px;
        }

        #plans .plan .title
        {
            background: #ebebeb;
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
            font-size: 22px;
            color: #ee4a23;
            font-weight: 200;
            padding: 12px 0;
        }

            #plans .plan .title .small
            {
                font-size: 12px;
                letter-spacing: 2px;
            }

        #plans .plan.middle .title
        {
            font-size: 30px;
        }


            #plans .plan .features .feature
            {
                font-size: 14px;
                letter-spacing: 1px;
                padding: 10px 0;
                border-bottom: dotted #ddd 1px;
                font-weight: 300;
                color: #666;
            }

            #plans .plan .features .feature span
            {
                vertical-align: middle;
                margin-left: 5px;
            }

            #plans .plan .features .feature div
            {
                font-size: 12px;
                margin-left: 22px;
                font-weight: 200;
            }

            #plans .plan .features .feature:last-child
            {
                border-bottom: none;
            }

            #plans .plan.middle .features .feature
            {
                font-size: 15px;
            }

        #plans .plan .price
        {
            font-size: 13px;
            letter-spacing: 1px;
            margin-top: 5px;
            margin-bottom: 8px;
            font-weight: 300;
            color: #777;
        }

        #plans .plan button, #plans .plan .button
        {
            width: 167px;
            text-align: center;
            padding: 9px 0;
        }

#money-back
{
    text-align: center;
    margin-top: -25px;
    margin-bottom: -100px;
    background: #fafafa;
    padding-bottom: 60px;
}

    #money-back img
    {
        height: 100px;
        opacity: 0.9;
        transform: rotate(10deg);
    }


/*
* PLANS - RESPONSIVE
*/

@media (max-width:800px)
{
    #plans .plan.left,
    #plans .plan.middle,
    #plans .plan.right
    {
        display: block;
        vertical-align: middle;
        background: #f7f6f6;
        border: solid #d6d6d6 1px;
        border-radius: 4px;
        width: 70%;
        margin: 0 auto 50px auto;
    }
}

@media (max-width:400px)
{
    #plans .plan.left,
    #plans .plan.middle,
    #plans .plan.right
    {
        width: 80%;
    }
}

#join h1
{
    font-weight: 200;
    margin: 75px auto 40px auto;
}

#join h2
{
    max-width: 750px;
    margin: 0 auto 60px auto;
}


#signup-faq
{
    max-width: 780px;
    margin: 50px auto 0 auto;
    padding: 30px 50px 10px 50px;
    color: #777;
    list-style: none;
}

    #signup-faq .money-back
    {
        background: none;
        text-align: right;
        float: right;
        height: 100px;
        margin: 0 0 0 0;
    }

        #signup-faq .money-back img
        {
            margin: -5px -20px 0 0;
            height: 100px;
            opacity: 0.9;
            transform: rotate(10deg);
        }

    #signup-faq h3
    {
        color: #ee4a23;
        font-size: 28px;
        font-weight: 200;
        padding: 0;
        margin: 0 0 20px 0;
    }

    #signup-faq li
    {
        font-weight: 300;
        margin-bottom: 30px;
    }

        #signup-faq li .question
        {
            font-weight: 400;
            margin-bottom: 5px;
            color: #000;
        }

        #signup-faq li .answer
        {
            font-weight: 200;
            margin-bottom: 2px;
            color: #000;
        }

@media (max-width:800px)
{
    #signup-faq { max-width: 70%; padding-left: 30px; padding-right: 40px; }
}

@media (max-width:400px)
{
    #signup-faq { max-width: 80%; padding-left: 20px; }
}

/*
* HOME
*/

#home h1
{
    color: #ee4a23;
    font-weight: 200;
    font-size: 50px;
    line-height: 55px;
    text-align: center;
    max-width: 850px;
    margin: 70px auto 0 auto;
    padding: 0 50px;
}

    @media (max-width: 900px) { #home h1 { margin-top: 60px; } }
    @media (max-width: 800px) { #home h1 { margin-top: 50px; } }
    @media (max-width: 700px) { #home h1 { margin-top: 40px; font-size: 40px; line-height: 45px; } }
    @media (max-width: 500px) { #home h1 { margin-top: 30px; } }
    @media (max-width: 400px) { #home h1 { margin-top: 20px; } }

#home .tag
{
    margin: 25px auto 50px auto;
    max-width: 550px;
    text-align: center;
    font-size: 20px;
    letter-spacing: 0.3px;
    font-weight: 200;
    padding: 0 30px;
    color: #000;
}


@media (max-width: 800px)
{
    #money-back
    {
        margin-top: -90px;
    }
}

#home h2
{
    color: #ee4a23;
    font-weight: 200;
    font-size: 46px;
    line-height: 52px;
    text-align: center;
    max-width: 900px;
    margin: 90px auto 30px auto;
    padding: 0 50px;
}

    @media (max-width: 500px) { #home h2 { font-size: 36px; line-height: 40px; } }

#home h3
{
    color: #606060;
    font-weight: 200;
    font-size: 18px;
    line-height: auto;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    padding: 0 50px;
}

 #home h3 b
 {
     font-weight: 500;
 }

/*
* ROCKET LINES
*/

#home .rocket-line-right .line
{
    float: right;
    background: #ee4a23;
    height: 4px;
    width: 35%;
    margin-top: -2px;
}

#home .rocket-line-right .icon
{
    float: right;
    fill: #ee4a23;
    width: 31px;
    height: 31px;
    -ms-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    margin-top: -15px;
    margin-right: -10px;
}

#home .rocket-line-left .line
{
    float: left;
    background: #ee4a23;
    height: 4px;
    width: 35%;
    margin-top: -2px;
}

#home .rocket-line-left .icon
{
    float: left;
    fill: #ee4a23;
    width: 31px;
    height: 31px;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -16px;
    margin-left: -9px;
}

@media (max-width: 500px)
{
    #home .rocket-line-right .line { width: 200px; }
    #home .rocket-line-left  .line { width: 200px; }
}

/*
* FEATURE PANEL
*/

#home #feature-panel
{
    clear: both;
    text-align: center;
    padding: 50px 0 90px 0;
    max-width: 1000px;
    margin: 0 auto;
}

    #home #feature-panel .feature
    {
        display: inline-block;
        width: 200px;
        height: 260px;
        vertical-align: top;
        text-align: center;
        margin-right: 10px;
        margin-left: 10px;
    }

        #home #feature-panel .feature .title
        {
            font-size: 24px;
            color: #606060;
            font-weight: 200;
            margin-top: 15px;
        }

        #home #feature-panel .feature .text
        {
            font-size: 14px;
            color: #777;
            font-weight: 300;
            margin-top: 10px;
            line-height: 21px;
            letter-spacing: 0.3px;
        }

        #home #feature-panel .feature .circle
        {
            width: 130px;
            height: 130px;
            background: #f2f2f2;
            border-radius: 65px;
            display: flex;
            align-items: center;
            margin: 0 auto;
        }

        #home #feature-panel .feature .circle .icon
        {
            fill: #ee4a23;
            margin: 0 auto;
            display: block;
        }

            #home #feature-panel .feature .circle .icon.beaker { width: 45px; }
            #home #feature-panel .feature .circle .icon.momentum { width: 53px; }
            #home #feature-panel .feature .circle .icon.rocket2 { width: 60px; }
            #home #feature-panel .feature .circle .icon.community { width: 53px; }

/*
* FEATURE PANEL - RESPONSIVE
*/

@media (max-width: 900px)
{
    #home #feature-panel { max-width: 500px; padding-bottom: 40px; }
    #home #feature-panel .feature { margin-bottom: 30px; margin-right: 15px; margin-left: 15px; }
}

@media (max-width: 600px)
{
    #home #feature-panel { max-width: 250px; }
    #home #feature-panel .feature { margin-right: 0; margin-left: 0; }
}

/*
* SOCIAL BUTTONS
*/

#home .social-buttons
{
	display: block;
	background: #fafafa;
    border: solid #eee 1px;
	border-radius: 5px;
	width: 520px;
	margin: 0 auto 70px auto;
	padding: 0;
}

	#home .social-buttons .hint
	{
		color: #444444;
		margin: 10px 0 10px 30px;
		font-size: 15px;
		letter-spacing: 1px;
	}

	#home .social-buttons .hint b
	{
		font-weight: 600;
	}

	#home .social-buttons .buttons
	{
		text-align: center;
		padding-bottom: 20px;
	}

		#home .social-buttons .facebook
		{
			background: #3b5998;
		}

		#home .social-buttons .twitter
		{
			background: #1da1f2;
		}

		#home .social-buttons .google
		{
			background: #2962ff;
		}

		#home .social-buttons .account
		{
			background: #ee4a23;
		}

	#home .social-buttons .buttons a
	{
		width: 220px;
		margin: 5px;
		text-align: left;
		padding: 10px 15px;
		font-size: 13px;
	}

		#home .social-buttons .buttons a:hover
		{
			font-weight: 400;
		}

	#home .social-buttons .buttons a span
	{
		vertical-align: middle;
	}

		#home .social-buttons span.small
		{
			display: none;
		}

		#home .social-buttons .buttons a .icon
		{
			width: 20px;
			height: 20px;
			vertical-align: middle;
			fill: #fff;
		}

/*
* SOCIAL BUTTONS - RESPONSIVE
*/

@media (max-width: 700px)
{
    #home .social-buttons { width: 420px; }
    #home .social-buttons .buttons a { width: 170px; }
	#home .social-buttons span.small { display: inline; }
	#home .social-buttons span.big { display: none; }
}

@media (max-width: 550px)
{
    #home .social-buttons { width: 235px; }
}

/*
* NUGGET PANEL
*/

#nugget-panel
{
    background: #fafafa;
    border: solid #eee 1px;
    text-align: center;
    padding-bottom: 80px;
}

    #nugget-panel h3
    {
        padding-bottom: 20px;
    }

#nugget-panel #nugget-listing
{

    max-width: 1000px;
    margin: 0 auto;
    margin-top: 45px;
}

    #nugget-panel #nugget-listing .item
    {
        padding: 20px;
        text-align: left;
        display: inline-block;
        vertical-align: top;
        margin-right: 30px;
        margin-left: 30px;
        background: #fff;
        width: 380px;
        min-height: 460px;
        border: solid #ebebeb 1px;
        margin-bottom: 40px;
    }

        #nugget-panel #nugget-listing .item .robot
        {
            width: 30px;
            fill: #ddd;
        }

        #nugget-panel #nugget-listing .item .nugget
        {
            width: 110px;
            fill: #ccc;
            margin-left: 5px;
        }

        #nugget-panel #nugget-listing .item .text
        {
            padding-left: 10px;
            font-weight: 300;
            font-size: 14px;
            line-height: 19px;
            color: #555;
            height: 350px;
            letter-spacing: 0.3px;
        }

        #nugget-panel #nugget-listing .item .comments
        {
            text-align: right;
            font-size: 12px;
            color: #bbb;
            padding-right: 12px;
            margin-top: 10px;
        }

            #nugget-panel #nugget-listing .item .comments .comment
            {
                width: 18px;
                vertical-align: middle;
                margin-right: 2px;
                fill: #ddd;
            }

@media (max-width:500px)
{
    #nugget-panel #nugget-listing .item
    {
        margin-left: 0;
        margin-right: 0;
        width: 300px;
    }

    #nugget-panel #nugget-listing .item .text
    {
        height: auto;
    }
}

/*
* HOME - MOMENTUM PANEL
*/

#home #momentum-panel-home
{
    margin-bottom: 80px;
}

#home #momentum-panel-home .computer
{
    background: url(/img/computer.jpg);
    width: 800px;
    height: 619px;
    background-size: cover;
    margin: 40px auto;
}

    #home #momentum-panel-home .computer img
    {
        margin: 38px 0 0 32px;
        width: 740px;
    }

/*
* MOMENTUM PANEL - RESPONSIVE
*/


@media (max-width:900px)
{
    #home #momentum-panel-home .computer { width: 700px; height: 542px; }
    #home #momentum-panel-home .computer img { margin: 33px 0 0 28px; width: 650px; }
}

@media (max-width:800px)
{
    #home #momentum-panel-home .computer { width: 600px; height: 464px; }
    #home #momentum-panel-home .computer img { margin: 28px 0 0 25px; width: 555px; }
}

@media (max-width:700px)
{
    #home #momentum-panel-home .computer { width: 500px; height: 387px; }
    #home #momentum-panel-home .computer img { margin: 23px 0 0 21px; width: 465px; }
}

@media (max-width:600px)
{
    #home #momentum-panel-home .computer { width: 400px; height: 309px; }
    #home #momentum-panel-home .computer img { margin: 19px 0 0 17px; width: 370px; }
}

@media (max-width:500px)
{
    #home #momentum-panel-home .computer { width: 300px; height: 232px; }
    #home #momentum-panel-home .computer img { margin: 14px 0 0 12px; width: 279px; }
}

/*
* MOMENTUM SCORE
*/

#momentum-score
{
    width: 680px;
    margin: 60px auto 30px auto;
    background: #fafafa;
    border: solid #eee 1px;
	border-radius: 5px;
	padding: 25px 25px 35px 25px;
    text-align: center;
}

    #momentum-score .science
    {
        position: absolute;
        margin-left: 580px;
        -ms-transform: rotate(30deg);
        -webkit-transform: rotate(30deg);
        transform: rotate(30deg);
        font-size: 12px;
        font-weight: 700;
        color: #ee4a23;
        letter-spacing: 1px;
    }



    #momentum-score .title
    {
        font-size: 40px;
        color: #444444;
        font-weight: 300;
    }

    #momentum-score table
    {
        margin: 0 auto;
    }

        #momentum-score table .formula td
        {
            font-size: 72px;
            color: #ee4a23;
            font-weight: 100;
        }

        #momentum-score table .hint td
        {
            font-size: 12px;
            color: #ee4a23;
            font-weight: 400;
            letter-spacing: 1px;
        }

            #momentum-score table .hint td i
            {
                font-weight: 600;
            }

/*
* MOMENTUM SCORE - RESPONSIVE
*/


@media (max-width:900px)
{
    #momentum-score { width: 640px; }
    #momentum-score .science { margin-left: 540px; }
    #momentum-score .title { font-size: 36px; }
}

@media (max-width:800px)
{
    #momentum-score { width: 610px; }
    #momentum-score .science { margin-left: 510px; }
    #momentum-score .title { font-size: 34px; }
}

@media (max-width:700px)
{
    #momentum-score { width: 550px; }
    #momentum-score .science { margin-left: 460px; }
    #momentum-score .title { font-size: 32px; }
    #momentum-score table .formula td { font-size: 62px; }
}

@media (max-width:600px)
{
    #momentum-score { width: 500px; }
    #momentum-score .science { margin-left: 410px;  margin-top: -5px; font-weight: 500; }
    #momentum-score .title { font-size: 28px; }
    #momentum-score table .formula td { font-size: 60px; }
    #momentum-score table .hint td { font-size: 11px; }
}

@media (max-width:500px)
{
    #momentum-score { width: 400px; }
    #momentum-score .science { margin-left: 310px; margin-top: -5px; font-weight: 500; }
    #momentum-score .title { font-size: 22px; }
    #momentum-score table .formula td { font-size: 40px; }
    #momentum-score table .hint td { font-size: 10px; }
}

@media (max-width:400px)
{
    #momentum-score { width: 300px; }
    #momentum-score .science { margin-left: 220px; margin-top: -9px; font-weight: 500; }
    #momentum-score .title { font-size: 22px;  }
    #momentum-score table .formula td { font-size: 30px; font-weight: 200; }
    #momentum-score table .hint td { font-size: 10px; }
}

/*
* ACADEMY PANEL
*/

#home #academy-panel #stages-list { display: none; }

#home #academy-panel
{
    background: #fafafa;
    border: solid #eee 1px;
    padding-bottom: 80px;
}

    #home #academy-panel .toc
    {
        background: #fff;
        width: 720px;
        margin: 50px auto 0 auto;
        border-radius: 5px;
        border: solid #ebebeb 1px;
        padding-bottom: 30px;
    }


    #home #academy-panel .toc .rocket2
    {
        position: absolute;
        fill: #ee4a23;
        width: 50px;
        margin: 33px 0 0 161px;
    }


        #home #academy-panel .toc .title
        {
            text-align: center;
            color: #ee4a23;
            font-size: 24px;
            font-weight: 500;
            margin-top: 50px;
            letter-spacing: 1px;
        }

        #home #academy-panel .toc .tag
        {
            text-align: center;
            margin-top: 8px;
            font-size: 18px;
            font-weight: 200;
            color: #555;
        }

        #home #academy-panel .toc .stages
        {
            margin: 50px auto;
        }

            #home #academy-panel .toc .stages td
            {
                font-size: 20px;
                font-weight: 300;
                color: #ee4a23;
                padding-bottom: 5px;
            }

            #home #academy-panel .toc .stages td.data-l
            {
                padding-right: 20px;
            }

        #home #academy-panel .toc .social-buttons
        {
            background: none;
            border: none;
            margin-bottom: 0;
        }

            #home #academy-panel .toc .social-buttons .hint
            {
                text-align: center;
                margin: 0 0 10px 0;
                font-weight: 200;
            }

/*
* ACADEMY PANEL - RESPONSIVE
*/

@media (max-width:900px)
{
    #home #academy-panel .toc { width: 640px; margin: 50px auto 0 auto; }
    #home #academy-panel .toc .rocket2 { margin: 33px 0 0 123px; width: 50px; }
    #home #academy-panel .toc .stages td { font-size: 18px; }
}

@media (max-width:800px)
{
    #home #academy-panel .toc { width: 590px; margin: 50px auto 0 auto; }
    #home #academy-panel .toc .rocket2 { margin: 35px 0 0 113px; width: 45px; }
    #home #academy-panel .toc .title { font-size: 22px; }
    #home #academy-panel .toc .tag { font-size: 16px; }
    #home #academy-panel .toc .stages td { font-size: 16px; padding-bottom: 6px; font-weight: 400; }
}

@media (max-width:700px)
{
    #home #academy-panel .toc { width: 470px; margin: 50px auto 0 auto; }
    #home #academy-panel .toc .rocket2 { margin: 35px 0 0 55px; width: 45px; }
    #home #academy-panel .toc .title { font-size: 22px; }
    #home #academy-panel .toc .tag { font-size: 16px; }
    #home #academy-panel #stages-side-by-side { display: none; }
    #home #academy-panel #stages-list { display: table; margin-top: 30px; margin-bottom: 30px;}
}

@media (max-width:600px)
{
    #home #academy-panel .toc .rocket2 { margin: 10px 0 0 10px; width: 50px; }
    #home #academy-panel .toc { width: auto; margin: 50px 5% 0 5%; }
    #home #academy-panel .toc .title { font-size: 19px; margin-top: 30px;}
    #home #academy-panel .toc .tag { font-size: 14px; margin-top: 8px;}
}

/*
* COMMUNITY PANEL
*/

#home #community-panel
{
    text-align: center;
    margin-bottom: 100px;

}

    #home #community-panel #community-members
    {
        margin: 30px auto;
        max-width: 1100px;

    }

        #home #community-panel #community-members .member
        {
            display: inline-block;
            background: #fafafa;
            border: solid #eee 1px;
        	border-radius: 5px;
        	padding: 10px;
            margin: 15px;
            text-align: left;
            padding: 25px 30px 30px 30px;

        }

        #home #community-panel #community-members .member .avatar
        {
            display: inline-block;
            vertical-align: top;
            margin-right: 10px;
        }

            #home #community-panel #community-members .member .avatar img
            {
                height: 75px;
                width: 75px;
                border-radius: 75px;
            }

        #home #community-panel #community-members .member .info
        {
            display: inline-block;
            vertical-align: top;
            width: 300px;
        }

            #home #community-panel #community-members .member .info .title
            {
                font-size: 14px;
                letter-spacing: 1px;
                font-weight: 400;
                color: #000;
                margin-bottom: 10px;
            }

            #home #community-panel #community-members .member .info .text
            {
                margin-top: 5px;
                font-size: 14px;
                font-weight: 300;
                letter-spacing: 0.5px;
                line-height: 21px;
            }

/*
* COMMUNITY PANEL - RESPONSIVE
*/

@media (max-width:500px)
{
    #home #community-panel #community-members .member .avatar
    {
        display: block;
        text-align: center;
        padding-bottom: 10px;
    }

    #home #community-panel #community-members .member
    {
        margin: 10px 10px 30px 10px;
        padding: 20px 20px 30px 20px;
    }

    #home #community-panel #community-members .member .info
    {
        width: 230px;
    }
}

/*
* PRICING PANEL
*/

#home #pricing-panel
{
    text-align: center;
    padding-top: 4px;

}

    #home #pricing-panel h2
    {
        margin-top: 80px;
    }

/*
* REGISTER
*/

.register h1
{
    color: #ee4a23;
    font-weight: 100;
    font-size: 45px;
    line-height: 45px;
    text-align: center;
    max-width: 850px;
    margin: 40px auto 20px auto;
    padding: 0 20px;
	letter-spacing: 2px;
}

.register h2
{
    color: #606060;
    font-weight: 200;
    font-size: 18px;
    line-height: auto;
    max-width: 600px;
    margin: 0 auto 40px auto;
    text-align: center;
    padding: 0 50px;
}

#join h3
{
    color: #ee4a23;
    font-weight: 300;
    font-size: 16px;
    text-align: center;
    margin: 0 auto 20px auto;
    padding: 0 20px;
	letter-spacing: 2px;
}

/*
* SOCIAL BUTTONS
*/

.register .social-buttons
{
    text-align: center;
    margin: 50px 0 30px 0;
}

    .register .social-buttons a
    {
        background: none;
    }

    .register .social-buttons a
	{
		width: auto;
		margin: 0 20px 25px 20px;
		text-align: left;
		padding: 0 0;
		font-size: 14px;
        font-weight: 400;
	}

    .register .social-buttons a span
	{
		vertical-align: middle;
	}

		.register.social-buttons span.small
		{
			display: none;
		}

		.register .social-buttons a .icon
		{
			width: 22px;
			height: 22px;
			vertical-align: middle;
			fill: #fff;
		}

            .register .social-buttons .twitter .icon
            {
                width: 26px;
    			height: 26px;
            }

        .register .social-buttons .facebook, .register .social-buttons .facebook .icon
		{
			color: #3b5998;
            fill: #3b5998;
		}

		.register .social-buttons .twitter, .register .social-buttons .twitter .icon
		{
			color: #1da1f2;
            fill: #1da1f2;
		}

		.register .social-buttons .google, .register .social-buttons .google .icon
		{
			color: #2962ff;
            fill: #2962ff;
		}

/*
* FORM
*/

.register .form
{
    max-width: 380px;
    margin: 0 auto 0 auto;
    padding: 0 20px;
}


    .register .form .checkbox-wrapper
    {
        margin: 0 0 0 0;
        display: flex;
    }

        .register .form .checkbox-wrapper input[type=checkbox]
        {
            vertical-align: top;
            background: none;
            width: auto;
            cursor: pointer;
            margin-right: 8px;
        }

        .register .form .checkbox-wrapper label
        {
            vertical-align: top;
            cursor: pointer;
        }

        .register .form .checkbox-wrapper:hover label
        {
            color: #ee4a23;
        }

    #reset.register .form
    {
        margin-bottom: 50px;
    }

    .register .form input, .register .form textarea
    {
        width: 100%;
        margin-bottom: 20px;
    }

        .register .form textarea
        {
            outline: none;
            font-size: 15px;
            resize: none;
            padding: 15px 17px 18px 17px;
        }

    .remember-me
    {
        float: left;
        margin: -3px 0 0 0;
    }

        .register .form .remember-me input[type=checkbox]
        {
            vertical-align: top;
            background: none;
            width: auto;
            cursor: pointer;
        }

        .register .form .remember-me span
        {
            display: inline-block;
            margin: 2px 0 0 2px;
            vertical-align: top;
            font-size: 14px;
            cursor: pointer;
            color: #777;
        }

            .register .form .remember-me:hover span
            {
                color: #ee4a23;
            }

    .register .form a.forgot-password
    {
        float: right;
        margin: -3px 2px 0 0;
        font-size: 14px;
        letter-spacing: 0.5px;
        color: #777;
    }

        .register .form a.forgot-password:hover
        {
            color: #ee4a23;
        }

    .register .form button
    {

        width: 100%;
        text-align: center;
    }

    .register .form button.login
    {
        margin-top: 20px;
    }


    .register .form .signup
    {
        text-align: center;
        margin-top: 14px;
        font-size: 14px;
        letter-spacing: 0.5px;
        color: #ee4a23;
    }

        .register .form .signup a
        {
            color: #ee4a23;
        }

/*
* ACADEMY - INTRO
*/

#academy #content
{
    max-width: 900px;
    margin: 0 auto 0 auto;
}

@media (max-width: 940px)
{
    #academy #content { margin: 0 20px 0 20px; }
}

#wait-list-signup
{
    padding: 20px 20px;
    margin: 60px auto 0 auto;
    max-width: 400px;
}

    #wait-list-signup button
    {
        width: 100%;
        text-align: center;
    }

#academy h1
{
    font-size: 50px;
    font-weight: 400;
    color: #ee4a23;
    letter-spacing: 1px;
    font-style: italic;
    margin: 80px 0 30px 0;
}

@media (max-width: 1100px) { #academy h1 { margin-top: 60px; } }
@media (max-width: 1050px) { #academy h1 { margin-top: 40px; } }
@media (max-width: 1000px) { #academy h1 { margin-top: 20px; } }
@media (max-width: 700px) { #academy h1 {font-size: 45px; margin-top: 10px;  } }
@media (max-width: 600px) { #academy h1 {font-size: 40px; } }

#academy audio { max-width: 100%; width: 100%; border-radius: 4px; }
#academy audio::-webkit-media-controls-enclosure { overflow:hidden; }
#academy audio::-webkit-media-controls-panel { width: calc(100% + 30px); }

#academy .quote
{
    font-weight: 300;
    text-align: right;
    font-style: italic;
    margin-top: 10px;
}

    #academy .quote .text
    {
        display: inline-block;
        font-size: 18px;
        letter-spacing: 0.3px;
        color: #000;
        max-width: 400px;
    }

    #academy .quote .person
    {
        font-size: 16px;
        margin-top: 5px;
        color: #777;
    }

#academy h2
{
    font-size: 23px;
    font-weight: 400;
    color: #000;
    letter-spacing: 1px;
    font-style: italic;
    margin: 80px 0 15px 0;
}

    #academy h2 a
    {
        text-decoration: underline;
        color: #000;
        font-size: 12px;
    }

#academy table
{
    margin:  30px 0 30px 40px;

}

#academy .img
{
    width: 100%;
    height: auto;
    border-radius: 6px;
}

#academy p
{
    font-size: 17px;
    line-height: 24px;
    font-weight: 300;
    margin-bottom: 20px;
    letter-spacing: 0.3px;
    color: #000;
}

    #academy p b
    {
        font-weight: 500;
    }

    #academy p a
    {
        text-decoration: underline;
        color: #000;
    }

#academy #submit-button
{
    margin-top: 10px;
}

#academy .questions
{
    margin: 30px 20px;
}

    #academy .questions .question
    {
        margin-bottom: 6px;
    }

        #academy .questions .question input, #academy .questions .question label
        {
            vertical-align: middle;
        }

        #academy .questions .question input
        {
            margin-right: 5px;
        }

/*
* ACADEMY - TOC
*/

#academy-toc #tabs-academy
{
    max-width: 840px;
    margin-left: auto;
    margin-right: auto;
}

#academy-toc #batch-nav
{
    text-align: center;
    font-size: 14px;
}

    #academy-toc #batch-nav span
    {
        font-weight: 500;
    }

    #academy-toc #batch-nav a
    {
        margin-left: 15px;
    }

#academy-toc #content
{
    margin: 40px 60px;
}

    #academy-toc h1
    {
        font-size: 32px;
        font-weight: 300;
        color: #ee4a23;
        letter-spacing: 2px;
        max-width: 870px;
        margin: 0 auto;
    }

    #academy-toc h2
    {
        font-size: 16px;
        line-height: 20px;
        font-weight: 200;
        color: #606060;
        letter-spacing: 1px;
        max-width: 870px;
        margin: 20px auto 15px auto;
    }

    #academy-toc .info-note
    {
        max-width: 870px;
        margin: 0 auto;
        font-weight: 400;
    }
    .enroll-button
    {
        max-width: 870px;
        margin: 0 auto 0 auto;
        text-align: center;
        margin-bottom: 10px;
    }

        .enroll-button .button
        {
            font-size: 14px;
            padding: 10px 30px;
        }

#academy-toc #toc-panel
{
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-flow: row wrap;
    margin: 40px auto 0 auto;
    max-width: 900px;
}

    #academy-toc.toc #toc-panel { margin: 30px auto 0 auto; }

    #academy-toc #tip-panel { max-width: 844px; margin: 0 auto; }

    #academy-toc #toc-panel .stage
    {
        background: #f7f6f6;
        border: solid 1px #ebebeb;
        border-radius: 5px;
        flex-basis: 260px;
        height: 130px;
        margin: 0 15px 30px 15px;
        cursor: pointer;
    }

        #academy-toc #toc-panel .stage:hover
        {
            border: solid #fad2ca 1px;
        }

        #academy-toc #toc-panel .stage .num
        {
            font-size: 14px;
            color: #929292;
            font-weight: 200;
            letter-spacing: 1px;
            padding: 15px 15px 0 17px;
        }

            #academy-toc #toc-panel .stage:hover .num
            {
                color: #ee4a23;;
            }

        #academy-toc #toc-panel .stage .title
        {
            font-size: 20px;
            color: #444444;
            font-weight: 200;
            letter-spacing: 1px;
            padding: 8px 15px 18px 17px;
            height: 74px;
        }

            #academy-toc #toc-panel .stage:hover .title
            {
                color: #ee4a23;;
            }

        #academy-toc #toc-panel .stage .rocket-line .line
        {
            float: left;
            background: #ee4a23;
            height: 4px;
            width: 30px;
            margin-top: -2px;
        }

            #academy-toc #toc-panel .stage .rocket-line .icon
            {
                float: left;
                fill: #ee4a23;
                width: 31px;
                height: 31px;
                -ms-transform: rotate(45deg);
                -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
                margin-top: -16px;
                margin-left: -3px;
            }

        #academy-toc #toc-panel .stage .lock, #academy-toc #toc-panel .stage .play
        {
            float: right;
        }

            #academy-toc #toc-panel .stage .lock .icon
            {
                width: 22px;
                margin: 10px 10px 0 0;
                fill: #FCAA4E;
            }

            #academy-toc #toc-panel .stage .play .icon
            {
                width: 26px;
                margin: 9px 10px 0 0;
                fill: #ee4a23;
            }

                #academy-toc #toc-panel .stage .play .icon:hover
                {
                    fill: #000;
                }

@media (max-width: 1000px)
{
    #academy-toc #toc-panel .stage { flex-basis: 45%; }
    #academy-toc #tip-panel { max-width: 94%; }
    #academy-toc #tabs-academy { padding: 0 50px; }
}

@media (max-width: 800px)
{
    #academy-toc #toc-panel { margin-top: 20px; }
    #academy-toc #content { margin: 20px 20px; }
    #academy-toc #toc-panel .stage { flex-basis: 100%; margin-left: 0; margin-right: 0; }
    #academy-toc #tip-panel { max-width: 100%; }
    #academy-toc #tabs-academy { max-width: 700px; padding: 0 10px;}

}

/*
* ACADEMY - APPLY
*/

#academy-apply .form
{
    max-width: 750px;
}

    #academy-apply .form .question
    {
        margin-bottom: 5px;
        font-weight: 200;
    }

    #academy-apply .form .checkboxes
    {
        margin: 20px 0 25px 0;
    }

    #academy-apply .form .example
    {
        margin: -10px 2px 60px 2px;
        font-size: 14px;
        border-radius: 4px;
        padding: 15px 20px;
        border: dashed #ee4a23 1px;
        color: #ee4a23;
        letter-spacing: 0.5px;
        line-height: 18px;
    }

    #academy-apply .form button
    {
        width: 49%;
        display: inline-block;
    }

    #academy-apply .form button:first-of-type
    {
        margin-right: 2%;
    }

#batch-status-table
{
    width: 100%;
    border-collapse: collapse;
    margin-top: 40px;
}

    #batch-status-table #batch-dropdown
    {
        white-space: nowrap;
    }

        #batch-status-table #batch-dropdown:hover
        {
            color: #ee4a23;
        }


    #batch-status-table #batch-dropdown .icon
    {
        vertical-align: middle;
        width: 18px;
        height: 18px;
        margin: -2px 0 0 -2px;
        -ms-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        fill: #000;

    }

        #batch-status-table #batch-dropdown:hover .icon
        {
            fill: #ee4a23;
        }

    /* INFO PANEL */
    #batch-status-table tr.info td
    {
        padding-top: 0;
    }

        #batch-status-table tr.info td .light-panel
        {
            padding: 0 0 10px 0;
        }

            #batch-status-table tr.info td .light-panel .admin
            {
                margin: 0 0 -9px 0;
                padding: 10px;
            }

                #batch-status-table tr.info td .light-panel .admin a
                {
                    color: #ee4a23;
                    margin: 0 5px 0 0 !important;
                }

                #batch-status-table tr.info td .light-panel .admin .curStage
                {
                    margin: 0 5px 0 10px !important;
                    font-weight: 500;
                }

                #batch-status-table tr.info td .light-panel .admin .curStage:first-of-type
                {
                    margin: 0 5px 0 0 !important;
                }

            #batch-status-table tr.info td .light-panel .top-panel
            {
                display: flex;
                align-items: center;
            }

                #batch-status-table tr.info td .light-panel .top-panel .avatar
                {
                    padding-right: 20px;
                }

                    #batch-status-table tr.info td .light-panel .top-panel .avatar span
                    {
                        display: none;
                    }

                #batch-status-table tr.info td .light-panel .top-panel .status
                {
                    font-size: 24px;
                    font-weight: 300;
                    letter-spacing: 0;
                    color: #555;
                }

                #batch-status-table tr.info td .light-panel .top-panel .status a
                {
                    color: #ee4a23;
                    font-weight: 400;
                }

                    #batch-status-table tr.info td .light-panel .top-panel .status a:hover
                    {
                        text-decoration: underline;
                    }

                #batch-status-table tr.info td .light-panel img
                {
                    width: 75px;
                    height: 75px;
                    border-radius: 75px;
                }

            #batch-status-table tr.info td .light-panel .bottom-panel
            {
            }

                #batch-status-table tr.info td .light-panel .bottom-panel .hint
                {
                    margin-top: 30px;
                    font-size: 12px;
                    color: #999;
                    letter-spacing: 1px;
                }

                #batch-status-table tr.info td .light-panel .bottom-panel .title
                {
                    margin-top: 3px;
                    margin-bottom: 20px;

                }

                    #batch-status-table tr.info td .light-panel .bottom-panel .title a
                    {
                        font-size: 15px;
                        font-weight: 400;
                        color: #000;
                    }

                        #batch-status-table tr.info td .light-panel .bottom-panel .title a:hover
                        {
                            color: #ee4a23;
                        }

                #batch-status-table tr.info td .light-panel .bottom-panel .comment
                {
                    font-size: 15px;
                    letter-spacing: 1px;
                }

                    #batch-status-table tr.info td .light-panel .bottom-panel .comment strong
                    {
                        font-weight: 500;
                    }

                    #batch-status-table tr.info td .light-panel .bottom-panel .comment a
                    {
                        color: #ee4a23;
                    }

                        #batch-status-table tr.info td .light-panel .bottom-panel .comment a:hover
                        {
                            text-decoration: underline;
                        }

    /* TD */
    #batch-status-table tr td
    {
        text-align: left;
        border-bottom: solid #ebebeb 1px;
        padding-bottom: 12px;
        padding-top: 12px;
    }

        #batch-status-table tr.expanded td
        {
            border-bottom: none;
        }

        /* LABEL */
        #batch-status-table tr td.label
        {
            padding-right: 10px;
            width: 1%;
        }

            #batch-status-table tr td.label
            {
                color: #ee4a23;
                font-size: 18px;
                font-weight: 400;
                letter-spacing: 1px;
                cursor: pointer;
            }

            #batch-status-table tr:hover td.label
            {
                color: #000;
            }

            #batch-status-table tr.expanded:hover td.label
            {
                color: #ee4a23;
            }

        /* DATA */
        #batch-status-table tr td.data
        {
            vertical-align: middle;
            width: 99%;
            cursor: pointer;
        }

            /* FLEX */
            #batch-status-table tr td.data .flex
            {
                display: flex;
                justify-content: space-between;
                align-items: center;
            }

            #batch-status-table tr td.data .flex div.stage
            {
                vertical-align: middle;
                font-size: 15px;
                font-weight: 200;
                flex-basis: 100%;

            }

                #batch-status-table tr td.data .flex div.stage div.line
                {
                    display: block;
                    height: 4px;
                    background: #ee4a23;
                    width: 100%;
                    opacity: 0.4;
                    margin-top: 1px;
                }

                    #batch-status-table tr:hover td.data .flex div.stage div.line
                    {
                        background: #000;
                    }

                    #batch-status-table tr.expanded:hover td.data .flex div.stage div.line
                    {
                        background: #ee4a23;
                    }

                #batch-status-table tr td.data .flex div.stage .rocket
                {
                    margin-left: -8px;
                    fill: #ee4a23;
                    width: 27px;
                    -ms-transform: rotate(45deg);
                    -webkit-transform: rotate(45deg);
                    transform: rotate(45deg);
                    vertical-align: middle;
                }

                    #batch-status-table tr:hover td.data .flex div.stage .rocket
                    {
                        fill: #000;
                    }

                    #batch-status-table tr.expanded:hover td.data .flex div.stage .rocket
                    {
                        fill: #ee4a23;
                    }

                #batch-status-table tr td.data .flex div.stage .check
                {
                    width: 20px;
                    fill: #929292;
                }


/* HEADER */
#batch-status-table tr.header td
{
    padding-top: 0;
}

#batch-status-table tr.header td.label
{
    font-size: 15px;
    color: #444444;
    font-weight: 700;
    letter-spacing: 1px;
    padding-top: 3px;
    padding-right: 20px;
}

#batch-status-table tr.header td.data .flex
{
    margin-top: 5px;
}

/* SORT BAR */
.batch-status .sort-bar
{
    text-align: right;
}

    .batch-status .sort-bar span
    {
        font-size: 12px;
        letter-spacing: 1px;
        color: #606060;
        font-weight: 200;
        vertical-align: middle;
        margin-right: -3px;
    }

    .batch-status .sort-bar a
    {
        margin-left: 10px;
    }

    .batch-status .sort-bar .fire
    {
        width: 17px;
        vertical-align: middle;
        fill: #d6d6d6;
    }

        .batch-status .sort-bar a.selected .fire { fill: #ee4a23; }

    .batch-status .sort-bar .rocket
    {
        width: 24px;
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        vertical-align: middle;
        fill: #d6d6d6;
    }

        .batch-status .sort-bar a.selected .rocket { fill: #ee4a23; }

/*
* PROJECT - TABS
*/

#tabs-academy
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto 0 auto;
    padding: 0 10px;
    max-width: 840px;
}

    #tabs-academy .item
    {
    }

        #tabs-academy .item a span
        {
            vertical-align: middle;
            font-size: 20px;
            font-weight: 200;
            letter-spacing: 2px;
            color: #bbb;
        }

            #tabs-academy .item.selected a span, #tabs-academy .item.selected a:hover span
            {
                color: #ee4a23;
                font-weight: 500;

            }

        #tabs-academy .item .icon
        {
            fill: #ddd;
            vertical-align: middle;
        }

            #tabs-academy .item.selected .icon, #tabs-academy .item.selected:hover .icon
            {
                fill: #ee4a23;
            }

            #tabs-academy .item:hover a span, #tabs-academy .item:hover .icon
            {
                color: #444;
                fill: #444;
            }

            #tabs-academy .item .icon.toc { width: 41px; margin-top: 5px;}
            #tabs-academy .item .icon.learn { width: 32px; }
            #tabs-academy .item .icon.project { width: 30px; }
            #tabs-academy .item .icon.fire { width: 23px; }
            #tabs-academy .item .icon.rocket
            {
                width: 32px;
                -ms-transform: rotate(45deg);
                -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
            }
            #tabs-academy .item .icon.batch { width: 30px; }
            #tabs-academy .item .icon.slack { width: 30px; margin-top: 1px;}

            #tabs-academy .item .icon.founders { width: 34px; }
            #tabs-academy .item .icon.batches { width: 34px; }
            #tabs-academy .item .icon.leaderboard { width: 34px; }

/*
* IDEAS - TABS RESPONSIVE
*/

@media (max-width: 700px)
{
    #tabs-academy .item { text-align: center; }
    #tabs-academy .item a span { font-size: 14px; display: block;  }
}

/*
* LATEST
*/

#dashboard #content
{
    max-width: 900px;
    margin: 40px auto 0 auto;
}

    @media (max-width: 1090px) { #dashboard #content { margin: 40px 80px 0 80px; } }
    @media (max-width: 1030px) { #dashboard #content { margin: 30px 60px 0 60px; } }
    @media (max-width: 600px) { #dashboard #content { margin: 20px 40px 0 40px; } }
    @media (max-width: 400px) { #dashboard #content { margin: 10px 20px 0 20px; } }

#tip-panel
{
    border: solid 1px #ddd;
}

    #tip-panel .title
    {
        background: #ebebeb;
        padding: 7px 20px 9px 15px;
        color: #777;
        font-weight: 200;
        font-size: 14px;
        letter-spacing: 1px;
    }

    #tip-panel .tip
    {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
    }

        #tip-panel .tip .item
        {
            padding: 0 0 6px 0;
        }

            #tip-panel .tip .item.symbol
            {
                padding-left: 15px;
                vertical-align: middle;
            }

                #tip-panel .tip .item.symbol .icon
                {
                    width:22px;
                    fill: #cfcfcf;
                    margin-top: 10px;
                }

            #tip-panel .tip .item.text
            {
                font-size: 17px;
                letter-spacing: 1px;
                font-weight: 300;
                padding-top: 9px;
                padding-left: 8px;
                margin-bottom: 7px;
            }

                #tip-panel .tip .item.text a
                {
                    color: #ee4a23;
                }

                    #tip-panel .tip .item.text a:hover
                    {
                        color: #000;
                    }


#leaders-panel
{
    display: flex;
    justify-content: space-between;
    align-content: stretch;
    margin-top: 22px;
}

    .leader-panel
    {
        width: 100%;
        padding: 10px 15px 15px 15px;
    }

        .leader-panel.one { }
        .leader-panel.two { margin: 0 10px; }
        .leader-panel.three {  }


        @media (max-width: 900px)
        {
            .leader-panel.one { margin-right: 10px; }
            .leader-panel.two { margin-left: 0; }
            .leader-panel.three { display: none; }
        }

        @media (max-width: 700px)
        {
            .leader-panel.one { margin: 0;  }
            .leader-panel.two { display: none; }
            .leader-panel.thre { display: none;}
        }


        .leader-panel .title
        {
            font-size: 11px;
            color: #7a7a7a;
            letter-spacing: 1px;
            font-weight: 200;
            margin-bottom: 5px;
        }

            .leader-panel .title a
            {
                color: #7a7a7a;
            }

                .leader-panel .title a:hover
                {
                    color: #ee4a23;
                }

            .leader-panel .title .icon
            {
                width: 12px;
                vertical-align: middle;
                fill: #ccc;
                margin-left: 3px;
            }

                .leader-panel a:hover .icon
                {
                    fill: #ee4a23;
                    opacity: 0.9;
                }

        .leader-panel .flex
        {
            display: flex;
            text-align: left;
        }

            .leader-panel .flex .col
            {
                width: 50%;
            }

                .leader-panel .flex .col div
                {
                    margin-bottom: 0;
                    line-height: 16px;
                }

                    .leader-panel .flex .col i, .leader-panel .flex .col div a
                    {
                        font-style: normal;
                        font-size: 12px;
                        font-weight: 200;
                    }

                        .leader-panel .flex .col i
                        {
                            padding-right: 5px;
                        }


#feed-panel
{
    margin: 24px 0 0 0;
}

    #feed-panel .title
    {
        font-size: 12px;
        letter-spacing: 1px;
        color: #7a7a7a;
        margin: 10px 0 25px 14px;
        font-weight: 200;
    }

    #feed-panel .item
    {
        display: flex;
        align-items: flex-start;
        margin: 0 20px 30px 20px;
    }

        #feed-panel .item .symbol
        {
            flex-basis: 40px;
            min-width: 35px;
            text-align: left;
        }

            #feed-panel .item .symbol .icon { fill: #ccc; }
            #feed-panel .item .symbol .icon.slack { width: 25px; margin-top: 3px; }
            #feed-panel .item .symbol .icon.beaker { width: 25px; margin-top: 3px; }
            #feed-panel .item .symbol .icon.diamond { width: 26px; margin-top: 3px; }
            #feed-panel .item .symbol .icon.momentum { width: 35px; margin-top: 1px; margin-left: -7px; }
            #feed-panel .item .symbol .icon.trophy { width: 25px; margin-top: 5px;  }
            #feed-panel .item .symbol .icon.users { width: 26px; margin-top: 0;  margin-left: 3px; }
            #feed-panel .item .symbol .icon.chat { width: 26px; margin-top: 2px;  margin-left: 3px; }
            #feed-panel .item .symbol .icon.rocket2 { width: 36px; margin-top: 0;  margin-left: 0; }

            #feed-panel .item .text a
            {
                font-size: 18px;
                color: #ee4a23;
                letter-spacing: 1px;
                font-weight: 400;
            }

                #feed-panel .item .text a:hover
                {
                    text-decoration: underline;
                }

                #feed-panel .item.is-read .text a
                {
                    color: #777;
                    font-weight: 200;
                }

            #feed-panel .item .text .info
            {
                font-size: 12px;
                color: #ee4a23;
                margin: 7px 0 0 1px;
                font-weight: 300;
            }

                #feed-panel .item.is-read .text .info
                {
                    color: #777;
                    font-weight: 200;
                }

/*
* MOMENTUM
*/

.momentum-user .options
{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 10px 0 10px 5px;
}

    .momentum-user #bio-panel
    {
        border-radius: 5px;
        padding: 1px 15px 1px 15px;
        font-size: 14px;
        line-height: 14px;
        margin-top: 15px;
        background: #888;
        color: #fff;
    }

        .momentum-user #bio-panel a
        {
            color: #fff;
            text-decoration: underline;
        }

        .momentum-user #bio-panel a:hover
        {
            color: #000;
        }

        .momentum-user #bio-panel ul
        {
            margin-bottom: 20px;
        }
        .momentum-user #bio-panel li
        {
            margin-bottom: 5px;
        }

    .momentum-user .options .item
    {
        margin-right: 30px;
    }

    .momentum-user .options .item a
    {
        font-size: 12px;
        letter-spacing: 1px;
        color: #606060;
        font-weight: 200;
    }

        .momentum-user .options .item a:hover
        {
            color: #ee4a23;
        }

    .momentum-user .options .item  .arrow-up
    {
        float: right;
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom: 5px solid #c0c0c0;
        margin: 11px 0 0 3px;
    }

    .momentum-user .options .item .arrow-down
    {
        float: right;
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 5px solid #c0c0c0;
        margin: 10px 0 0 3px;
    }

#momentum #content
{
    max-width: 900px;
    margin: 40px auto 0 auto;
}

    @media (max-width: 1090px) { #momentum #content { margin: 40px 80px 0 80px; } }
    @media (max-width: 1030px) { #momentum #content { margin: 30px 60px 0 60px; } }
    @media (max-width: 600px) { #momentum #content { margin: 20px 40px 0 40px; } }
    @media (max-width: 400px) { #momentum #content { margin: 10px 20px 0 20px; } }

    #momentum #chat-title .icon
    {
        width: 24px;
        vertical-align: middle;
        margin-top: -4px;
        fill: #ddd;
        cursor: pointer;
    }

        #momentum #chat-title .icon:hover
        {
            fill: #ee4a23;
        }

        #momentum .back .icon
        {
            transform: rotate(180deg);
            margin-right: 4px;
        }

        #momentum .next .icon
        {
            margin-left: 1px;
        }

        #momentum #chat-title .disabled .icon
        {
            fill: #ddd;
            opacity: 0.5;
            cursor: default;
        }

    #momentum h1
    {
        font-size: 32px;
        font-weight: 300;
        color: #ee4a23;
        letter-spacing: 2px;
        margin: 0;
    }

    #momentum h2
    {
        font-size: 14px;
        line-height: 16px;
        font-weight: 200;
        color: #606060;
        letter-spacing: 2px;
        margin: 8px 0 20px 0;
    }

    @media (max-width: 800px)
    {
        #momentum h1 { font-size: 26px; }
        #momentum h2 { line-height: 18px; }
    }

    #chat-title
    {
        font-size: 20px;
        font-weight: 300;
        color: #555;
        letter-spacing: 2px;
        margin: 40px 0 0 0;
    }

#momentum #chat-panel
{
    margin-top: 40px;
}

/*
* Check Marks
*/

#momentum.momentum #chat-panel .chat.L1 ul
{
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

#momentum.momentum #chat-panel .chat.L1 ul li
{
  padding-left: 22px;
  text-indent: -22px;
  margin-bottom: 10px;
}

#momentum.momentum #chat-panel .chat.L1 ul:last-of-type
{
    margin-bottom: 0;
}

#momentum.momentum #chat-panel .chat.L1 ul li:before
{
  content: "✔️";
  padding-right: 5px;
  font-size: 10px;
  opacity: 0.5;
  vertical-align: middle;
}

#momentum.momentum #chat-panel .chat.L1 ul li p
{
    vertical-align: middle;
    display: inline;
    margin: 0 0 0 0;
}

/*
* LEADERBOARD
*/

#leaderboard #content
{
    max-width: 900px;
    margin: 40px auto 0 auto;
}

    @media (max-width: 1090px) { #leaderboard #content { margin: 40px 80px 0 80px; } }
    @media (max-width: 1030px) { #leaderboard #content { margin: 30px 60px 0 60px; } }
    @media (max-width: 600px) { #leaderboard #content { margin: 20px 40px 0 40px; } }
    @media (max-width: 400px) { #leaderboard #content { margin: 10px 20px 0 20px; } }

#leaderboard h1
{
    font-size: 40px;
    font-weight: 300;
    color: #ee4a23;
    letter-spacing: 2px;
    margin: 0 0 30px 0;
}


#leaderboard #leader-nav
{
    font-size: 16px;
    margin: 0 0 20px 0;
}

    #leaderboard #leader-nav a
    {
        margin-right: 30px;
        color: #ee4a23;
    }

    #leaderboard #leader-nav a.selected
    {
        margin-right: 30px;
        color: #000;
        font-weight: 500;
    }


#leaders
{
    display: flex;
    flex-wrap: wrap;
}

    #leaders .leader
    {
        width: 25%;
        overflow: hidden;
        cursor: pointer;
        max-height: 240px;
    }

    #leaders .leader img
    {
        width: 100%;
        height: 100%;
    }

    #leaders .leader .name
    {
        position: absolute;
        margin: -35px 0 0 10px;
        color: #fff;
        font-weight: 200;
        font-size: 11px;
        letter-spacing: 2px;
        background: #000;
        padding: 3px 5px 5px 6px;
        border-radius: 3px;
        white-space: nowrap;
    }

    @media (max-width: 800px)
    {
        #leaders .leader .name { max-width: 15%; overflow: hidden; text-overflow: ellipsis;}
    }

#welcome #content
{
    margin: 20px;
    padding: 20px;
    text-align: center;
}

    #welcome #content .light-panel
    {
        padding-bottom: 30px;
    }

    #welcome #content h1
    {
        color: #ee4a23;
        font-size: 20px;
        font-weight: 300;
        margin-top: 40px;
        letter-spacing: 2px;
    }

    #welcome #content p
    {
        font-size: 18px;
        font-weight: 300;
        letter-spacing: 1px;
        max-width: 500px;
        margin: 20px auto 30px auto;
        color: #000;
    }

    #welcome #content button
    {
        margin: 10px 0 10px 0;
    }

.page #content
{
    max-width: 750px;
    margin: 0 auto 0 auto;
    padding-top: 30px;
}

.page h1
{
    color: #ee4a23;
    font-weight: 400;
    font-size: 40px;
    margin: 0;
}

.page p
{
    margin-bottom: 0px;
}

.page p b
{
    font-weight: 500;
}

.page .hint, .page .larger
{
    font-size: 18px;
}

.page .description
{
    font-size: 18px;
    margin: 10px 0 -7px 0;
    font-weight: 500;
}

.page a
{
    color: #ee4a23;
}

    .page a:hover
    {
        text-decoration: underline;
    }

.page .icon
{
    width: 20px;
    vertical-align: bottom;
    margin-bottom: 2px;
    fill: #ee4a23;
}

.page h2
{
    color: #ee4a23;
    font-weight: 400;
    font-size: 28px;
    margin: 30px 0 0 0;
}

.page ol
{
    margin: 25px 0 0 0 ;
}

.page li
{
    margin-bottom: 8px;
}

    .page ol span, .page li span
    {
        font-size: 14px;
        color: #999;
    }

    .page li a .icon
    {
        width: 16px;
        margin: 0;
    }

@media (max-width: 820px) { .page #content { margin: 0 40px; padding-top: 20px; } }
@media (max-width: 500px) { .page #content { margin: 0 20px; padding-top: 0; } }

#mail-alert
{
    position: absolute;
    width: 21px;
    height: 21px;
    line-height: 21px;
    margin: 48px 0 0 2px;
    background: #ee4a23;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;

    color: #fff;
    text-align: center;
    cursor: pointer;
}

    #mail-alert a { color: #fff;}

#mail #content
{
    max-width: 900px;
    margin: 20px auto 0 auto;
    padding: 0 20px 60px 20px;
}

#new-mail
{
    max-width: 600px;
    margin: 30px auto 0 auto;
}

    #new-mail .item
    {
        margin-bottom: 5px;
    }

    #new-mail .item label
    {
        margin-bottom: 3px;
        display: inline-block;
        color: #777;
    }

    #new-mail .item textarea
    {
        min-height: 150px;
    }

#mail h1
{
    font-size: 36px;
    font-weight: 400;
    color: #ee4a23;
    margin: 0 5px 0 0;
}

#mail #info-panel
{
    font-size: 16px;
    font-weight: 200;
    color: #ee4a23;
    margin: 10px 5px 55px 0;
}

    #mail #info-panel a
    {
        color: #ee4a23;
    }

    #mail #info-panel .icon, #mail  h1 .icon
    {
        width: 30px;
        vertical-align: middle;
        fill: #ddd;
        cursor: pointer;
        transform: rotate(180deg);
        margin: -4px -5px 0 -10px;
    }

        #mail #info-panel .icon:hover, #mail h1 .icon:hover
        {
            fill: #ee4a23;
        }

    #mail h1 button
    {
        float: right;
        margin: 10px 0 0 5px;
    }

    #mail  h1 button .icon, #mail  h1 button .icon:hover
    {
        fill: #fff;
        transform: none;
        margin: -6px 4px 0 0;
        width: 22px;
    }


#mail #tabs
{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin: 0 0 0 5px;
}

    #mail #tabs .item a span
    {
        vertical-align: middle;
        font-size: 20px;
        font-weight: 200;
        letter-spacing: 2px;
        color: #bbb;
    }

        #mail #tabs .item.selected a span, #mail #tabs .item.selected a:hover span
        {
            color: #ee4a23;
            font-weight: 500;
        }

        #mail #tabs .item.selected-black a span, #mail #tabs .item.selected-black a:hover span
        {
            color: #ee4a23;
            font-weight: 500;
        }

    #mail #tabs .item .icon
    {
        fill: #ddd;
        vertical-align: middle;
    }

        #mail #tabs .item.selected .icon, #mail #tabs .item.selected:hover .icon
        {
            fill: #ee4a23;
        }

        #mail #tabs .item.selected-black .icon, #mail #tabs .item.selected-black:hover .icon
        {
            fill: #ee4a23;
        }

        #mail #tabs .item:hover a span, #mail #tabs .item:hover .icon
        {
            color: #444;
            fill: #444;
        }

        #mail #tabs .item .icon.mail { width: 26px; margin-right: 3px; margin-top: 2px;}
        #mail #tabs .item .icon.outbox { width: 35px; margin: 1px 3px 0 0;  }
        #mail #tabs .item .icon.send { width: 28px; margin-right: -2px;  }



#mail #mailbox
{
    margin-top: 30px;
    padding: 30px;
}

    #mail #mailbox .mail-item
    {
        display: flex;
        align-items: center;
        margin: 10px 0 40px 0;
    }

        #mail #mailbox .mail-item .text
        {
            flex-grow: 1;
            padding-left: 10px;
        }

            #mail #mailbox .mail-item .text .subject
            {
                font-size: 26px;
                letter-spacing: 1px;
                font-weight: 300;
            }

                #mail #mailbox .mail-item .text .subject a
                {
                    color: #ee4a23;
                }

                #mail #mailbox .mail-item .text .subject a:hover
                {
                    text-decoration: underline;
                }

            #mail #mailbox .mail-item .text .post
            {
                margin: 5px 0 5px 0;
                font-size: 15px;
                color: #000;
                font-weight: 300;
            }

                #mail #mailbox .mail-item .text .post b
                {
                    font-weight: 500;
                }

            #mail #mailbox .mail-item .text .info, #mail #mailbox .mail-item .text .info a
            {
                font-size: 12px;
                color: #ee4a23;
                font-weight: 300;
                height: 22px;
                line-height: 20px;
            }

        /* is read */
        #mail #mailbox .mail-item.is-read .text .subject
        {
        }

            #mail #mailbox .mail-item.is-read .text .subject a,
            #mail #mailbox .mail-item.is-read .text .post,
            #mail #mailbox .mail-item.is-read .text .post a,
            #mail #mailbox .mail-item.is-read .text .info
            {
                color: #333;
                font-weight: 200;
            }

        #mail #mailbox .mail-item .avatar img
        {
            width: 60px;
            height: 60px;
            border-radius: 60px;
        }

        #mail #mailbox .mail-item .avatar
        {
            text-align: center;
            padding-right: 0;
            margin-right: 5px;
            width: 90px;
            min-width: 90px;
            cursor: pointer;
        }

            #mail #mailbox .mail-item .avatar b
            {
                margin-top: -3px;
                font-size: 14px;
                color: #ee4a23;
                font-weight: 700;
                display: block;
                line-height: 18px;
                max-width: 90px;
                text-overflow: ellipsis;
                overflow: hidden;
            }

            #mail #mailbox .mail-item .avatar i
            {
                font-size: 11px;
                color: #ee4a23;
                font-weight: 400;
                letter-spacing: 0.3px;
                display: block;
                white-space: nowrap;
            }

@media (max-width: 800px)
{
    #mail #info-panel { margin-left: 5px; }
}

@media (max-width: 600px)
{
    #mail #mailbox .mail-item
    {
        align-items: flex-start;
        margin: 10px 0 40px 0;
    }

    #mail #mailbox .mail-item .text .subject
    {
        font-size: 18px;
        letter-spacing: 1px;
        font-weight: 400;
    }

    #mail #mailbox .mail-item .text .post
    {
        font-size: 14px;
    }
}

#lesson #content
{
    max-width: 900px;
    margin: 40px auto 0 auto;
}

    @media (max-width: 1090px) { #lesson #content { margin: 40px 80px 0 80px; } }
    @media (max-width: 1030px) { #lesson #content { margin: 30px 60px 0 60px; } }
    @media (max-width: 600px) { #lesson #content { margin: 20px 40px 0 40px; } }
    @media (max-width: 400px) { #lesson #content { margin: 10px 20px 0 20px; } }

    .lesson .video
    {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 56.25%;
        margin: 20px 0;
    }

    .lesson .video iframe
    {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 4px;
    }

/* AUDIO */
.lesson audio { min-width: 100%; width: 100%; border-radius: 4px; }
.lesson audio::-webkit-media-controls-enclosure { overflow:hidden; }
.lesson audio::-webkit-media-controls-panel { width: calc(100% + 30px); }
.lesson .audio {
    margin: 25px 0 15px 0;
}

.lesson .actions
{
    text-align: center;
    padding-top: 20px;
}

.lesson .title-panel
{
    display: flex;
    align-items: flex-start;
    margin: 60px 0 0 0;
    background: #ee4a23;
    padding: 25px;
    border-radius: 4px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

    @media (max-width: 1090px) { .lesson .title-panel { margin: 50px 0 0 0; } }
    @media (max-width: 1030px) { .lesson .title-panel { margin: 40px 0 0 0; } }
    @media (max-width: 600px) { .lesson .title-panel { margin: 30px 0 0 0; } }
    @media (max-width: 400px) { .lesson .title-panel { margin: 20px 0 0 0; } }

    .lesson .note.intro .hint
    {
        padding-top: 5px;
        margin-bottom: 10px;
        font-size: 14px;
    }
    .lesson .note.intro .icon.info
    {
        width: 24px;
        vertical-align: middle;
        fill: #fff;
        opacity: 0.5;
        margin: -4px 2px 0 0;
    }

    .lesson .title-panel .left .icon
    {
        fill: #fff;
        width: 45px;
        margin-top: 23px;
    }

        .lesson .title-panel .left .icon.chat { margin-top: 25px;  }
        .lesson .title-panel .left .icon.bulb { margin-top: 23px; }
        .lesson .title-panel .left .icon.book { margin-top: 22px; }
        .lesson .title-panel .left .icon.momentum { margin-top: 23px; width: 47px; }

    .lesson .title-panel .right
    {
        padding-left: 20px;
    }

    .lesson .title-panel .right .stage
    {
        font-size: 14px;
        color: #fff;
        opacity: 0.5;
    }

    .lesson .title-panel .right .title
    {
        font-size: 45px;
        font-weight: 100;
        letter-spacing: 3px;
        color: #fff;
        line-height: 50px;
    }

    @media (max-width: 600px)
    {
        .lesson .title-panel .right .title { font-size: 35px;line-height: 40px; letter-spacing: 2px; }
    }

.lesson img { width: 100%; height: auto; border-radius: 4px; }

.lesson .figure .title
{
    margin: 5px 0 20px 0;
    text-align: center;
    font-size: 14px;
    color: #555;
}

/*
* TYPOGRAPHY
*/

.lesson h1
{
    color: #333;
    margin: 60px 0 15px 0;
    font-weight: 400;
    font-size: 34px;
    letter-spacing: 1px;
}

.lesson h2
{
    color: #333;
    margin: 40px 0 10px 0;
    font-weight: 400;
    font-size: 24px;
    letter-spacing: 1px;
}

.lesson p
{
    font-size: 17px;
    line-height: 22px;
    margin-top: 10px;
    margin-bottom: 20px;
}

.lesson ul
{
    margin-top: 20px;
    margin-bottom: 20px;
}

.lesson li
{
    margin-bottom: 3px;
}

.lesson ul.spaced, .lesson ol.spaced
{

}

.lesson ul.spaced li, .lesson ol.spaced li
{
    margin-bottom: 15px;
}

.lesson blockquote
{
    margin: 30px 0 30px 30px;
    font-style: italic;
    font-weight: 400;
    border-left: solid #ee4a23 1px;
    padding-left: 15px;
}

    .lesson .note blockquote
    {
        margin-top: 25px;
    }

.lesson a
{
    color: #ee4a23;
    text-decoration: underline;
}

    .lesson a:hover
    {
        color: #000;
    }

/*
* NOTE
*/

.lesson
{
    letter-spacing: 0.3px;
}

.lesson .note
{
    margin-top: 25px;
    margin-bottom: 20px;
    background: #fff1d7;
    padding: 15px 20px 8px 20px;
    border-radius: 4px;
    font-size: 17px;
    color: #272623;
    font-weight: 300;
}

    .lesson .note .white
    {
        background: #fff; /* d7e2ff */
        color: #000;
    }

    .lesson .note .indent
    {
        background: none; /* d7e2ff */
        color: inherit;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .lesson .note img
    {
        margin: 5px 0;
    }

    .lesson .note hr
    {
        border: 0;
        height: 1px;
        background: #272623;
        opacity: 1;
        margin: 15px 0;
        opacity: 0.1;
    }

    .lesson .note.example
    {
        background: #d5e4ea; /* d7e2ff */
        color: #000;
    }

        .lesson .note.example hr
        {
            border: 0;
            height: 1px;
            background: #fff;
            opacity: 1;
            margin: 15px 0;
            opacity: 0.75;
        }



    .lesson .note.important
    {
        background: #5b666b;
        color: #fff;
    }

        .lesson .note.important hr
        {
            border: 0;
            height: 1px;
            background: #fff;
            opacity: 1;
            margin: 15px 0;
            opacity: 0.25;
        }

    .lesson .note.intro
    {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        margin-top: 0;
        padding-left: 30px;
        background: rgba(238,74,35,0.8);
        color: #f9e5e1;
    }

        .lesson .note.intro .title
        {
            font-weight: 300;
        }

        .lesson .note.intro div, .lesson .note.intro ul
        {
            /* opacity: 0.7; */
        }

    .lesson .note.no-title
    {
        padding: 5px 20px 8px 20px;
    }

.lesson .note p
{
    margin-bottom: 12px;
}

.lesson .note.huge
{
    padding-top: 25px;
    padding-bottom: 15px;
    text-align: center;
}

.lesson .note.huge p
{
    margin-bottom: 20px;
    font-size: 40px;
    line-height: 45px;
    font-weight: 400;
}

.lesson .note .title
{
    font-weight: 600;
    font-style: italic;
}

.lesson .note b
{
    font-weight: 600;
}

.lesson .note ol, .lesson .note ul
{

    margin-top: 15px;
    padding-left: 20px;
}

.lesson .note ol li, .lesson .note ul li
{
    margin-bottom: 5px;
}

.lesson .note ol.spaced, .lesson .note ul.spaced
{
    margin-top: 20px;
}

.lesson .note ol.spaced li, .lesson .note ul.spaced li
{
    margin-bottom: 15px;
}

.reading, .footnotes
{
    margin: 20px 0 20px 0;
}

    .reading .title
    {
        font-size: 15px;
    }

    .reading li
    {
        font-size: 13px;
        margin: 0 0 5px 0;
        color: #666;
        margin: 0 0 0 0 !important;
    }

    .reading a, .footnotes a
    {
        font-size: 16px;
        color: #ee4a23;
        text-decoration: underline;
    }

.footnotes
{
    background: #eee !important;
}

    .footnotes .title
    {
        font-size: 15px;
    }

    .footnotes p
    {
        font-size: 15px;
        line-height: 20px;
        margin-bottom: 5px;
    }

/*
* QUOTE
*/

.lesson hr
{
    opacity: 0.25;
}

.lesson .quote
{
    text-align: right;
    margin: 60px 0 60px 0;
}

    .lesson .quote b
    {
        color: #333;
        font-weight: 600;
        font-size: 22px;
        font-style: italic;
        max-width: 60%;
        display: inline-block;
    }

    .lesson .quote .person
    {
        color: #333;
        font-weight: 300;
        font-size: 16px;
        font-style: italic;
        margin-top: 5px;
    }

/*
* HEADER
*/

.heading h1
{
    color: #333;
    margin: 60px 0 15px 0;
    font-weight: 400;
    font-size: 34px;
    letter-spacing: 1px;
}

/*
* upload panel
*/

#lesson #slack-post-wrapper
{
    text-align: right;
    margin: 0px 0 25px 0;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.5px;
    cursor: pointer;
}

#lesson #slack-post-wrapper label, #lesson #slack-post-wrapper input
{
    cursor: pointer;
}

#lesson #response-hint
{
    padding: 8px 12px;
    font-weight: 300;
    margin: 0 0 10px 0;
    color: #000;
}

#lesson #upload-panel
{
    margin-top: 10px;
}

    #lesson #upload-panel .title
    {
        color: #ee4a23;
        font-size: 20px;
        font-weight: 200;
        margin: 14px 0 10px 0;
    }

    #lesson #upload-panel .upload
    {
        display: inline-block;
        text-align: center;
        margin-right: 15px;
        background: #eee;
        border-radius: 4px;
        padding: 2px 8px 7px 10px;
        text-align: middle;
        margin-bottom: 15px;
    }

        #lesson #upload-panel .upload a
        {
            vertical-align: middle;
            color: #ee4a23;
        }

        #lesson #upload-panel .popout
        {
            width: 16px;
            vertical-align: middle;
            fill: #ee4a23;
        }

/*
* work panel
*/

#lesson #work-panel
{
    border-top: solid #ee4a23 4px;
    padding-top: 10px;
    margin: 30px 0 0 0;
    font-size: 30px;
    font-weight: 200;
    color: #ee4a23;
    height: 55px;
}

#lesson #work-panel button, #lesson #work-panel a
{
    float: right;
    margin-top: 3px;
    margin-left: 10px;
}

#lesson #work-panel .loader
{
    float: right;
    margin: -15px 40px 0 0;
}

#lesson #work-panel #upload-file
{
    float: right;
    margin-top: 3px;
    margin-left: 10px;
}

    #lesson #work-panel #upload-file .icon
    {
        width: 38px;
        fill: #ee4a23;
    }

        #lesson #work-panel #upload-file .icon:hover
        {
            fill: #000;
        }

#lesson #batch-selector
{
    margin: 15px 0 0 0;
    font-size: 16px;
    color: #333;
}

@media (max-width: 700px)
{
    #lesson #batch-selector { text-align: center; }
    #lesson #batch-selector select { margin-top: 10px; }
    #lesson #work-panel { text-align: center; padding-top: 8px; }
    #lesson #work-panel .title { display: none; }
    #lesson #work-panel button { float: none; }
}

/*
* PROJECT - TABS
*/

#dashboard #tabs
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: -20px 0 32px 0;
    padding: 0 50px;
}

    #dashboard #tabs .item
    {
    }

        #dashboard #tabs .item a span
        {
            vertical-align: middle;
            font-size: 20px;
            font-weight: 200;
            letter-spacing: 2px;
            color: #bbb;
        }

            #dashboard #tabs .item.selected a span, #dashboard #tabs .item.selected a:hover span
            {
                color: #ee4a23;
                font-weight: 500;

            }

        #dashboard #tabs .item .icon
        {
            fill: #ddd;
            vertical-align: middle;
        }

            #dashboard #tabs .item.selected .icon, #dashboard #tabs .item.selected:hover .icon
            {
                fill: #ee4a23;
            }

            #dashboard #tabs .item:hover a span, #dashboard #tabs .item:hover .icon
            {
                color: #444;
                fill: #444;
            }

            #dashboard #tabs .item .icon.founders { width: 34px; margin-right: 7px; }
            #dashboard #tabs .item .icon.batches { width: 34px; margin-right: 3px; }
            #dashboard #tabs .item .icon.leaderboard { width: 34px; margin-right: 6px; }

/*
* IDEAS - TABS RESPONSIVE
*/

@media (max-width: 700px)
{
    #dashboard #tabs { margin-top: 15px; padding: 0 20px; }
    #dashboard #tabs .item { text-align: center; }
    #dashboard #tabs .item a span { font-size: 14px; display: block;  }
}

/*
* NUGGETS
*/

#nuggets #content
{
    max-width: 900px;
    margin: 40px auto 0 auto;
}

    @media (max-width: 1090px) { #nuggets #content { margin: 40px 80px 0 80px; } }
    @media (max-width: 1030px) { #nuggets #content { margin: 30px 60px 0 60px; } }

/*
* IDEAS - TITLE BAR
*/

#nuggets #title-bar
{
    display: flex;
    align-items: flex-start;
}

    #nuggets  #title-bar .item
    {
    }

        #nuggets #title-bar .info-panel
        {
            text-align: left;
        }

            #nuggets #title-bar .info-panel h2
            {
                font-size: 16px;
                font-weight: 200;
                color: #606060;
                letter-spacing: 2px;
                margin: 15px 0 5px 0;
            }

            #nuggets #title-bar .info-panel h2 .icon
            {
                width: 28px;
                vertical-align: middle;
                fill: #ee4a23;
            }

                #nuggets #title-bar .info-panel h2 .icon:hover
                {
                    fill: #000;
                }

        #nuggets #title-bar .search-panel
        {
            flex-grow: 1;
            text-align: right;
            margin: 5px 5px 0 0;
        }

            #nuggets #title-bar .search-box
            {
                display: inline-block;
                background: #f4f4f4;
                height: 42px;
                border-radius: 21px;
                line-height: 42px;
                padding: 0 15px 0 20px;
            }

                #nuggets #title-bar .search-box input
                {
                    background: none;
                    border: none;
                    font-size: 16px;
                    letter-spacing: 2px;
                    width: 250px;
                    font-weight: 200;
                }

                #nuggets #title-bar .search-box .icon
                {
                    float: right;
                    width: 22px;
                    fill: #bbb;
                    margin-top: 11px;
                }

/*
* IDEAS - TITLE BAR RESPONSIVE
*/

@media (max-width: 700px)
{
    #nuggets #content { margin: 0 20px; }
    #nuggets #title-bar { display: block; }
    #nuggets #title-bar .info-panel { margin: 0 0 -10px 7px;}
    #nuggets #title-bar .search-panel { text-align: left; margin: 40px 0 0 0; }
    #nuggets #title-bar .search-panel .search-box { width: 100%; }
    #nuggets #title-bar .search-box input { width: 85%; }
}

/*
* NUGGETS - TABS
*/

#nuggets #tabs
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 60px 0 0 5px;
}

    #nuggets #tabs .item
    {
    }

        #nuggets #tabs .item a span
        {
            vertical-align: middle;
            font-size: 20px;
            font-weight: 200;
            letter-spacing: 2px;
            color: #bbb;
        }

            #nuggets #tabs .item.selected a span, #nuggets #tabs .item.selected a:hover span
            {
                color: #ee4a23;
                font-weight: 500;

            }

        #nuggets #tabs .item .icon
        {
            fill: #ddd;
            vertical-align: middle;
        }

            #nuggets #tabs .item.selected .icon, #nuggets #tabs .item.selected:hover .icon
            {
                fill: #ee4a23;
            }

            #nuggets #tabs .item:hover a span, #nuggets #tabs .item:hover .icon
            {
                color: #444;
                fill: #444;
            }

            #nuggets #tabs .item .icon.diamond { width: 28px; margin-right: 5px;  }
            #nuggets #tabs .item .icon.beaker { width: 26px; margin-right: 1px; }
            #nuggets #tabs .item .icon.heart { width: 20px; margin-right: 3px; margin-top: 2px; }
            #nuggets #tabs .item .icon.tags { width: 24px; }

/*
* IDEAS - TABS RESPONSIVE
*/

@media (max-width: 700px)
{
    #nuggets #tabs { margin-top: 40px; }
    #nuggets #tabs .item { text-align: center; }
    #nuggets #tabs .item a span { font-size: 14px; display: block;  }
}

/*
* NUGGETS - ORDER BAR
*/

#nuggets #order-bar
{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 40px 0 10px 5px;
}

    #nuggets #order-bar .item
    {
        margin-right: 30px;
    }

    #nuggets #order-bar .item a
    {
        font-size: 12px;
        letter-spacing: 1px;
        color: #606060;
        font-weight: 200;
    }

        #nuggets #order-bar .item a:hover
        {
            color: #ee4a23;
        }

    #nuggets #order-bar .item .arrow-up
    {
        float: right;
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom: 5px solid #c0c0c0;
        margin: 11px 0 0 3px;
    }

    #nuggets #order-bar .item  .arrow-down
    {
        float: right;
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 5px solid #c0c0c0;
        margin: 10px 0 0 3px;
    }

/*
* NUGGETS - NUGGETS PANEL
*/

#nuggets #no-results
{
    padding: 20px;
    color: #999;
}

#nuggets #nuggets-panel
{
    min-height: 500px;
}

    #nuggets #nuggets-panel .item
    {
        display: flex;
        align-items: flex-start;
        padding: 17px 15px 22px 18px;
        margin-bottom: 30px;
    }

        #nuggets #nuggets-panel .item:hover
        {
            border: solid #fad2ca 1px;
        }

        #nuggets #nuggets-panel .item .symbol
        {
            flex-basis: 35px;
            padding-right: 8px;
        }

            #nuggets #nuggets-panel .item .symbol .icon
            {
                fill: #ccc;
            }

            #nuggets #nuggets-panel .item .symbol .icon.diamond { width: 25px; margin: 2px 0 0 0;  }
            #nuggets #nuggets-panel .item .symbol .icon.beaker { width: 26px; margin: 0; }

        #nuggets #nuggets-panel .item .text
        {
            flex-grow: 1;
        }

            #nuggets #nuggets-panel .item .text a
            {
                font-size: 18px;
                color: #ee4a23;
                letter-spacing: 1px;
                font-weight: 400;
            }

                #nuggets #nuggets-panel .item .text a b
                {
                    font-weight: 600;
                }

                #nuggets #nuggets-panel .item .text a:hover
                {
                    text-decoration: underline;
                }

            #nuggets #nuggets-panel .item .text .info, #nuggets #nuggets-panel .item .text .info a
            {
                font-size: 12px;
                color: #ee4a23;
                margin: 7px 0 0 1px;
                font-weight: 300;
            }

        #nuggets #nuggets-panel .item .abstract
        {
            font-size: 14px;
            margin-top: 10px;
            color: #000;
            letter-spacing: 0.3px;
            line-height: 20px;
            font-weight: 200;
        }

            #nuggets #nuggets-panel .item .abstract b {
                font-weight: 500;
            }

        #nuggets #nuggets-panel .item .action
        {
            min-width: 80px;
        }

        #nuggets #nuggets-panel .item .action .icon
        {
            width: 20px;
            margin-top: 2px;
            fill: #ddd;
            cursor: pointer;
        }

            #nuggets #nuggets-panel .item .action .icon:hover { fill: #ee4a23; }

            #nuggets #nuggets-panel .item .action span.heart { width: 25px; display: inline-block; float: right; }
            #nuggets #nuggets-panel .item .action span.heart-o { width: 25px;  display: inline-block;  float: right; }
            #nuggets #nuggets-panel .item .action span.contact { width: 25px;  display: inline-block;  float: right; }
            #nuggets #nuggets-panel .item .action a.edit { width: 25px;  display: inline-block;  float: right; }
            #nuggets #nuggets-panel .item .action a.popout { width: 30px;  display: inline-block;  float: right; }

            #nuggets #nuggets-panel .item .action .icon.mail { width: 20px; fill: #ee4a23;  margin: 0 0 0 5px; float: right; }
            #nuggets #nuggets-panel .item .action .icon.heart { width: 18px; fill: #ee4a23; float: right; }
            #nuggets #nuggets-panel .item .action .icon.heart-o { width: 22px; margin: 0 -2px 0 0; float: right;}
            #nuggets #nuggets-panel .item .action .icon.edit {width: 18px; margin: 1px 0 0 0; float: right; }
            #nuggets #nuggets-panel .item .action .icon.popout {width: 20px; margin: 1px 4px 0 0; float: right; }

/*
* IDEAS PANEL - RESPONSIVE
*/

@media (max-width: 700px)
{
    #nuggets #nuggets-panel .item { padding: 10px 10px 20px 10px; }
    #nuggets #nuggets-panel .item .symbol { padding-right: 8px; }
    #nuggets #nuggets-panel .item .text a { font-size: 16px; }
}

/*
* NUGGETS - TAGS PANEL
*/

#nuggets #tags-panel
{
    margin-top: 0;
    padding: 30px 0;


}

    #nuggets #tags-panel #tags-data
    {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        width: 85%;
        margin: 0 auto;
    }

        #nuggets #tags-panel #tags-data .column
        {
            text-align: left;
            font-size: 14px;
            line-height: 23px;
        }

            #nuggets #tags-panel #tags-data .column a:hover
            {
                text-decoration: underline;
            }

/*
* TAGS PANEL - RESPONSIVE
*/

@media (max-width: 700px)
{
    #nuggets #tags-panel #tags-data { display: block; text-align: center;}
    #nuggets #tags-panel #tags-data .column { display: inline-block; margin: 0 10px; vertical-align: top; margin-bottom: 20px; }
}

/*
* NUGGETS
*/

#nugget #content
{
    max-width: 900px;
    margin: 40px auto 0 auto;
}

    @media (max-width: 1090px) { #nugget #content { margin: 40px 80px 0 80px; } }
    @media (max-width: 1030px) { #nugget #content { margin: 30px 60px 0 60px; } }
    @media (max-width: 600px) { #nugget #content { margin: 20px 40px 0 40px; } }
    @media (max-width: 400px) { #nugget #content { margin: 10px 20px 0 20px; } }

#nugget .like
{
    float: right;
    margin: -4px 10px 0 0;
}

    #nugget .like .icon
    {
        fill: #e4e4e4;
        cursor: pointer;
    }

    #nugget .like .icon:hover { fill: #ee4a23; }
    #nugget .like .icon.heart { width: 26px; fill: #ee4a23; margin: 2px 2px 0 0;}
    #nugget .like .icon.heart-o { width: 30px; }
    #nugget .like .icon.shuffle { width: 30px; margin: 0 0 0 5px; fill: #ee4a23;}
    #nugget .like .icon.shuffle:hover { fill: #000; }
    #nugget .like .icon.play { width: 30px; height: 30px; margin: 0 0 0 0; fill: #ee4a23;}
    #nugget .like .icon.play:hover { fill: #000; }

    #nugget .like a.edit { float: left; }
    #nugget .like .icon.edit { width: 23px; margin: 3px 10px 0 0;  }

#comment-hint
{
    color: #333;
    font-size: 16px;
    letter-spacing: 0.3px;
    font-weight: 200;
    padding: 20px;
    margin-top: 30px;
}

    #comment-hint li
    {
        margin-bottom: 5px;
    }

        #comment-hint li span
        {
            font-size: 14px;
            color: #666;
        }

    #comment-hint .title
    {
        color: #777;
        font-weight: 300;
        font-style: italic;
        letter-spacing: 0.5px;
    }

    #comment-hint #mindset-link
    {
        color: #ee4a23;
        font-weight: 300;
    }


#nugget h1
{
    font-size: 36px;
    font-weight: 400;
    color: #ee4a23;
    margin: 0 5px 0 5px;
}

#nugget #info-panel
{
    font-size: 16px;
    font-weight: 200;
    color: #ee4a23;
    margin: 20px 5px 30px 5px;
}

    #nugget #info-panel a
    {
        color: #ee4a23;
    }

#nugget #nugget-body
{
    padding: 20px 25px 12px 25px;
}

    #nugget #nugget-body .text
    {
        font-size: 16px;
        line-height: 22px;
        letter-spacing: 0.3px;
        font-weight: 300;
        color: #000;
    }

    #nugget #nugget-body #submission
    {
    }

        #nugget #nugget-body #submission h2
        {
            font-size: 16px;
            font-weight: 300;
            color: #bbb;
            letter-spacing: 0.5px;
            margin: 0 0 15px 0;
            font-style: italic;
        }
        }

        #nugget #submission .text
        {
            font-size: 16px;
            line-height: 23px;
            letter-spacing: 0.5px;
            font-weight: 300;
            color: #000;
        }

    #nugget #analysis
    {
        margin: 30px 0 5px 0;
        background: #92999f;
        border-radius: 6px;
        padding: 20px 25px 10px 25px;

    }

        #nugget #analysis h2
        {
            font-size: 16px;
            font-weight: 300;
            color: #ccc;
            letter-spacing: 0.5px;
            margin: 0 0 15px 0;
            font-style: italic;
        }

        #nugget #analysis .text
        {
            font-size: 16px;
            line-height: 23px;
            letter-spacing: 0.5px;
            font-weight: 200;
            color: #fff;
        }

            #nugget #analysis .text a
            {
                color: #fff;
                text-decoration: underline;
            }

            #nugget #analysis .avatar
            {
                height: 50px;
                border-radius: 50px;
                float: left;
                margin-right: 10px;
                border: solid #ccc 1px;
            }

        #nugget #nugget-body #analysis .text a, #nugget #nugget-body #submission .text a
        {
            text-decoration: underline;
            color: #000;
        }

        #nugget #nugget-body #analysis .text a:hover, #nugget #nugget-body #submission .text a:hover
        {
            color: #ee4a23;
        }

#nugget #chat-title
{
    font-size: 30px;
    font-weight: 100;
    color: #000;
    margin: 30px 5px 40px 5px;
}

#nugget #add-comment
{
    float: right;
    margin: 3px 0 0 0;
}

#nugget #hint-panel
{
    margin-top: 40px;
    padding: 20px 30px 25px 30px;
}

    #nugget #hint-panel a
    {
        text-decoration: underline;
    }

    #nugget #hint-panel h1
    {
        font-size: 36px;
        font-weight: 200;
        color: #ee4a23;
        letter-spacing: 1px;
        font-style: italic;
        margin: 10px 0 35px 0;
    }

    #nugget #hint-panel h2
    {
        color: #ee4a23;
        font-size: 18px;
        font-weight: 300;
        letter-spacing: 0;
        font-style: italic;
        margin: 30px 0 0 0;
    }

    #nugget #hint-panel ul li
    {
        font-weight: 300;
        margin-bottom: 5px;
    }

    #nugget #hint-panel ul li span
    {
        font-size: 12px;
        color: #999;
    }























/**/

/*
* NUGGET EDIT
*/


#nugget-edit #content
{
    max-width: 900px;
    margin: 40px auto 0 auto;
}

    @media (max-width: 1090px) { #nugget-edit #content { margin: 40px 80px 0 80px; } }
    @media (max-width: 1030px) { #nugget-edit #content { margin: 30px 60px 0 60px; } }
    @media (max-width: 600px) { #nugget-edit #content { margin: 20px 40px 0 40px; } }
    @media (max-width: 400px) { #nugget-edit #content { margin: 10px 20px 0 20px; } }

#nugget-edit .item
{
    margin-bottom: 20px;
}

    #nugget-edit .item label
    {
        display: block;
        margin-bottom: 5px;
        font-size: 14px;
        font-weight: 200;
        color: #999;
        letter-spacing: 1px;
    }

/*
* ACCOUNT - AVATAR
*/

.dz-preview { display: none; }

#account-avatar #avatar-wrapper
{
    display: flex;
    margin: 0 auto 10px auto;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    width: 250px;
    height: 250px;
}

    #account-avatar #avatar-wrapper img
    {
        border-radius: 4px;
        max-width: 250px;
        max-height: 250px;
    }

    #avatar-wrapper .icon
    {
        position: absolute;
        fill: #000;
        width: 40px;
        margin: -15px 0 0 80px;
    }

    #account-avatar .loader
    {
        position: absolute;
        margin-top: -20px;
    }

/*
* ACCOUNT - PLAN
*/

#account-plan table.styled
{
    max-width: 500px;
    margin: 30px auto 50px auto;
}

    #account-plan table.styled .key
    {
        width: 110px;
    }

    #account-plan table.styled tr:first-of-type td
    {
        background: #ee4a23;
        color: #fff;
        border: none;
        font-weight: 400;
        text-transform: uppercase;
    }

@media (max-width: 700px)
{
    #account-plan table.styled
    {
        width: 80%;
        max-width: 80%;
        margin: 20px 0 70px 10%;
    }
}

/*
* ACCOUNT - CARD
*/

#card
{
    height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
}
    #card img
    {
        opacity: 0.1;
        cursor: pointer;
    }

    #card .number
    {
        position: absolute;
        margin-top: -35px;
        letter-spacing: 3px;
        font-weight: 300;
        color: #333;
        font-size: 16px;
        cursor: pointer;
    }

    #card .type
    {
        position: absolute;
        margin-top: 28px;
        letter-spacing: 3px;
        font-weight: 200;
        color: #000;
        font-size: 25px;
        cursor: pointer;
        text-transform: uppercase;
        opacity: 0.2;
    }

#admin-page #main-title
{
    text-align: center;
    font-weight: 500;
    font-size: 26px;
    margin: -10px 0 20px 0;
    color: #ee4a23;
}

#admin-page #inserts
{
    text-align: center;
    height: 38px;
    overflow-y: auto;
    white-space: nowrap;
}

    #admin-page #inserts a
    {
        background: #ee4a23;
        color: #fff;
        text-transform: uppercase;
        display: inline-block;
        padding: 5px 6px;
        border-radius: 4px;
        font-size: 10px;
        font-weight: 500;
        letter-spacing: 1px;
        margin-bottom: 5px;
    }

#admin-page #editor
{
    margin-top: 0;
    display: flex;
    align-items: flex-start;
    align-content: stretch;
    justify-content: space-between;
}

    #admin-page #edit-panel
    {
        width: 50%;
        padding: 0 20px 0 20px;
    }

        #admin-page #edit-panel #yaml
        {
            font-weight: 300;
            overflow-y: scroll;
            height: 73vh;
            padding-bottom: 20px;
            font-size: 16px;
            line-height: 30px;
            font-weight: 400 !important;
            color: black;
            -moz-tab-size : 4;
            -o-tab-size : 4;
            tab-size : 4;
        }

        #admin-page #edit-panel button
        {
            text-align: center;
            width: 90px;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }

        #admin-page #edit-panel #actions
        {
            text-align: center;
            margin-top: 10px;
            cursor: pointer;
        }

            #admin-page #edit-panel #actions .loader
            {
                position: absolute;
                margin-top: -25px;
            }

            #admin-page #edit-panel #actions .icon.upload2
            {
                width: 30px;
                margin-right: -3px;
                margin-left: 3px;
            }

            #admin-page #edit-panel #actions .icon.flipper
            {
                width: 24px;

            }

            #admin-page #edit-panel #actions .icon.textify
            {
                width: 28px;
                margin-right: 10px;
                margin-left: -3px;
                transform: rotate(180deg);
            }

            #admin-page #edit-panel #actions .lock-scroll .icon.scroll
            {
                margin-right: -10px;
                margin-left: 0;
            }

                #admin-page #edit-panel #actions .lock-scroll.selected .icon.scroll
                {
                    fill: #ee4a23;
                }


            #admin-page #edit-panel #actions .large-edit .icon.flipper
            {
                margin-right: 5px;
                margin-left: 0;
                transform: rotate(180deg);
            }

                #admin-page #edit-panel #actions .large-edit.selected .icon.flipper
                {
                    fill: #ee4a23;
                }

            #admin-page #edit-panel #actions .equal-screen .icon.equal
            {
                margin-right: 0px;
                margin-left: -3px;
                transform: rotate(180deg);
            }

                #admin-page #edit-panel #actions .equal-screen.selected .icon.equal
                {
                    fill: #ee4a23;
                }

            #admin-page #edit-panel #actions .large-preview .icon.flipper
            {
                margin-right: 0;
                margin-left: 0;
            }

                #admin-page #edit-panel #actions .large-preview.selected .icon.flipper
                {
                    fill: #ee4a23;
                }

            #admin-page #edit-panel #actions .go-start .icon.bump
            {
                width: 24px;
                margin-right: -10px;
                margin-left: 0;
                transform: rotate(180deg);
            }

            #admin-page #edit-panel #actions .go-end .icon.bump
            {
                width: 24px;
                margin-right: 7px;
                margin-left: 0;
            }

            #admin-page #edit-panel #actions .icon.eye
            {
                width: 30px;
                margin-left: 0px;
            }

        #admin-page #edit-panel #actions .icon
        {
            width: 26px;
            vertical-align: middle;
            margin-top: -4px;
            fill: #ccc;
            cursor: pointer;
        }

            #admin-page #edit-panel #actions .icon:hover
            {
                fill: #ee4a23;
            }

            #admin-page #edit-panel #actions .back .icon
            {
                transform: rotate(180deg);
                margin-right: -4px;
            }

            #admin-page #edit-panel #actions .next .icon
            {
                margin-left: 3px;
            }

            #admin-page #edit-panel #actions .disabled .icon
            {
                fill: #ddd;
                opacity: 0.5;
                cursor: default;
            }

    #admin-page #preview-panel
    {
        width: 50%;
        padding: 0 20px 0 0;
        max-height: 73vh;
        overflow: auto;
    }

.ship .countdown-wrapper
{
    background: #000;
    padding: 15px 20px 0 20px;
    margin-top: 20px;
    border-top: dotted #fff 3px;
    border-bottom: dotted #fff 3px;
    height: 85px;
}

    .ship .join-waitlist-link
    {
        text-decoration: underline;
        color: #ee4a23;
    }

    .ship .countdown-wrapper .countdown-title
    {
        text-align: center;
        max-width: 600px;
        margin: 0 auto;
        font-weight: 500;
        letter-spacing: 2px;
        color: #fff;
        font-size: 12px;
    }


    .ship .countdown
    {
    	text-align: center;
    	font-size: 38px;
    	font-family: 'Bungee Hairline', cursive;
    	color: #fff;
    	height: 55px;
        line-height: 55px;
        margin-top: -5px;
    }

.ship h1:first-of-type
{
    margin: 50px auto 50px auto !important;
	letter-spacing: 2px !important;
}

.ship h2:first-of-type
{
    color: #333 !important;
    font-size: 18px !important;
    font-weight: 300 !important;
    line-height: 22px !important;
    max-width: 600px !important;
    margin: 0px auto 50px auto !important;
    text-align: center !important;
    letter-spacing: 1px;
}

.ship #todo-list
{
    margin-top: 25px;
    margin-bottom: 20px;
    background: #fff1d7;
    padding: 20px 20px 15px 30px;
    border-radius: 4px;
    font-size: 18px;
    color: #272623;
    font-weight: 300;
    max-width: 600px;
    margin: 40px auto 100px auto;
    line-height: 25px;
}

    .ship #todo-list .title
    {
        margin-bottom: 40px;
        font-weight: 500;
        font-size: 20px;
        padding-bottom: 15px;
    }

    .ship #todo-list .item
    {
        display: flex;
        margin: 15px 0;
        padding-bottom: 15px;
        align-items: flex-start;
    }

        .ship #todo-list .item:last-of-type
        {
            border-bottom: none;
        }

        .ship #todo-list .item .check
        {
            width: 30px;
            font-size: 18px;
            opacity: 0.8;
            margin-top: 2px;
        }

            .ship #todo-list .item .check .icon
            {
                width: 25px;
                fill: #0f6819;
            }

        .ship #todo-list .item .text
        {
            font-weight: 400;
            font-family: 'Caveat';
            font-size: 36px;
            opacity: 0.8;
        }

.ship #founder-logos
{
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
    max-width: 850px;
    margin: 0 auto 0 auto;
}

    .ship #founder-logos img
    {
        border-radius: 4px;
        width: 100%;
    }

.ship #testimonial
{
    text-align: center;
    padding-top: 40px;
    padding-bottom: 80px;
}

    .ship #testimonial h1
    {
        margin-bottom: 80px !important;
    }

    .ship #testimonial .item
    {
        display: flex;
        align-items: flex-start;
        max-width: 850px;
        margin: 0 auto 50px auto;
    }

        .ship #testimonial .item .avatar
        {
            width: 150px;
        }

            .ship #testimonial .item .avatar .image
            {
                background-size: cover !important;
                height: 150px;
                width: 150px;
                border-radius: 4px;
                margin: 0 auto;
            }

            .ship #testimonial .item .avatar .name
            {
                font-size: 26px;
                margin-top: 10px;
                font-weight: 500;
            }

            .ship #testimonial .item .text
            {
                font-size: 26px;
                text-align: left;
                margin-left: 20px;
                font-weight: 300;
                font-style: italic;
                line-height: 34px;
                letter-spacing: 1px;
            }

@media (max-width: 700px)
{
    .ship #testimonial .item
    {
        display: block;
        margin: 0 auto 50px auto;
        border: solid #eee 1px;
        background: #fafafa;
        padding: 30px 0;
    }
    .ship #testimonial .item .avatar
    {
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }

}

.ship #academy-benefits, .ship #faq
{
    text-align: center;
    padding-bottom: 60px;
    padding-top: 40px;
    border: solid #eee 1px;
    background: #fafafa;
}

    .ship #academy-benefits .row, .ship #faq .row
    {
        display: flex;
        align-items: flex-start;
        max-width: 890px;
        margin: 0 auto 40px auto;
        padding: 0 20px;
    }

        .ship #academy-benefits .row .item, .ship #faq .row .item
        {
            display: flex;
            align-items: flex-start;
            text-align: left;
            width: 50%;
        }

            .ship #academy-benefits .row .item:first-of-type { margin-right: 5px; }
            .ship #academy-benefits .row .item:last-of-type { margin-left: 5px; }
            .ship #faq .row .item:first-of-type { margin-right: 10px; }
            .ship #faq .row .item:last-of-type { margin-left: 10px; }

            .ship #academy-benefits .row .item .check .icon
            {
                height: 30px;
                fill: #92d36e;
            }

            .ship #academy-benefits .row .item .text, .ship #faq .row .item .text
            {
                font-size: 20px;
                line-height: 25px;
            }

            .ship #academy-benefits .row .item .text a
            {
                text-decoration: underline;
                color: #ee4a23;
            }

@media (max-width: 700px)
{
    .ship #academy-benefits .row, .ship #faq .row { display: block; margin: 0 0;}
    .ship #academy-benefits .row .item, .ship #faq .row .item { width: 100%; margin-bottom: 20px; margin: 0 0 40px 0;}
    .ship #academy-benefits .row .item:first-of-type { margin-right: 0; }
    .ship #academy-benefits .row .item:last-of-type { margin-left: 0; }
    .ship #faq .row .item:first-of-type { margin-right: 0; }
    .ship #faq .row .item:last-of-type { margin-left: 0; }
}

.ship #academy-video
{
    text-align: center;
    padding-bottom: 80px;
    padding-top: 40px;
    border: solid #eee 1px;
}

    .ship #academy-video .video
    {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 56.25%;
        margin: 20px 0;
    }

    .ship #academy-video .video iframe
    {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.ship #the-deal
{
    border: solid #eee 1px;
    background: #fafafa;
}

    .ship .base-plan-pay-button
    {
        padding: 15px 30px;
        font-size: 24px;
        letter-spacing: 2px;
        font-weight: 500;
        text-align: center;
    }

        .ship .base-plan-pay-button div
        {
            font-weight: 100;
            font-size: 16px;
            margin-top: 5px;
        }

.ship #faq
{
    background-color: #fff;
    border: none;
    padding-bottom: 0;
}

.ship #faq h1
{
    margin-top: 0 !important;
}

.ship.offer #academy-benefits
{
    background: #fff;
    border: none;
    margin-top: -30px;
}

.ship.offer #main-deal-panel
{
    text-align: center;
    margin-top: -50px;
}

    .ship.offer #main-deal-panel button
    {
        width: 300px;
        font-weight: 400;
        font-size: 22px;
        text-align: center;
        margin: 0 auto;
        padding: 15px;
        text-transform: none;
    }

    .ship.offer #main-deal-panel button div
    {
        font-weight: 100;
        font-size: 16px;
        margin-top: 5px;
        text-transform: uppercase;
    }

@media (max-width: 700px)
{
    .ship.offer #main-deal-panel button
    {
        display: block;
    }
}

.ship.offer #no-thanks-panel
{
    margin-top: 30px;
    font-weight: 400;
    text-align: center;
}

    .ship.offer #no-thanks-panel a
    {
        font-size: 18px;
    }

/*
* PROJECT
*/

#project #content
{
    max-width: 900px;
    margin: 40px auto 0 auto;
}

    @media (max-width: 1090px) { #project #content { margin: 40px 80px 0 80px; } }
    @media (max-width: 1030px) { #project #content { margin: 40px 60px 0 60px; } }
    @media (max-width: 800px) { #project #content { margin: 20px 20px 0 20px; } }
    @media (max-width: 400px) { #project #content { margin: 20px 20px 0 20px; } }

#project #content h1
{
    margin-top: 50px;
}

#project #content h2
{
    margin-top: 30px;
    margin-bottom: 50px;
}

    #project #content h2 b
    {
        font-weight: 500;
    }


#account-avatar.project-logo #avatar-wrapper
{
    display: flex;
    margin: 0 auto 10px auto;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    width: 100%;
    height: 150px;
}

    #account-avatar.project-logo #avatar-wrapper img
    {
        border-radius: 4px;
        max-width: 100%;
        max-height: 150px;
    }

#project .form
{
    max-width: 100%;
    padding: 0;
}

    #project .form .question
    {
        margin-bottom: 5px;
        font-weight: 200;
    }

    #project .form .checkboxes
    {
        margin: 20px 0 25px 0;
    }

    #project .form .example
    {
        margin: -10px 2px 60px 2px;
        font-size: 14px;
        border-radius: 4px;
        padding: 15px 20px;
        border: dashed #ee4a23 1px;
        color: #ee4a23;
        letter-spacing: 0.5px;
        line-height: 18px;
    }

    #project .form button
    {
        width: 49%;
        display: inline-block;
    }

    #project .form button:first-of-type
    {
        margin-right: 2%;
    }

/*
* PROJECT VIEW & CHECKIN
*/

#project #project-panel
{
    display: flex;
    align-items: center;
    justify-content: center;
}

#project #project-panel.is-checkin
{
    margin-top: 50px;
}

    /* LEFT */
    #project #project-panel .left
    {
    }

        #project #project-panel .left .avatar
        {
            text-align: center;
            padding-right: 0;
            margin-right: 5px;
            min-width: 90px;
            cursor: pointer;
        }

            #project #project-panel .left .avatar img
            {
                width: 125px;
                height: 125px;
                border-radius: 125px;
            }


            #project #project-panel .left .avatar b
            {
                margin-top: -3px;
                font-size: 24px;
                color: #ee4a23;
                font-weight: 400;
                display: block;
                text-overflow: ellipsis;
                overflow: hidden;
                max-width: 165px;
                white-space: nowrap;
                letter-spacing: 1px;
                margin-bottom: 5px;
            }

            #project #project-panel .left .avatar i
            {
                font-size: 11px;
                color: #ee4a23;
                font-weight: 400;
                letter-spacing: 0.3px;
                display: block;
                white-space: nowrap;
            }

    /* MIDDLE */
    #project #project-panel .middle
    {
        padding: 0 25px 0 20px;
        flex-grow: 1;
        max-width: 250px;
    }

        #project #project-panel .middle .state
        {
            text-align: center;
            margin-bottom: 8px;
            font-size: 14px;
            color: #777;
            letter-spacing: 0.7px;
        }

        #project #project-panel .middle .arrow .line
        {
            height: 3px;
            background: #d6d6d6;
            margin: 0;
        }

        #project #project-panel .middle .arrow .icon
        {
            width: 21px;
            height: 21px;
            float: right;
            fill: #d6d6d6;
            margin: -12px -5px 0 0;
        }

    /* RIGTH */
    #project #project-panel .right
    {
        position: relative;
        max-width: 500px;
    }

        #project #project-panel .right img
        {
            /* 600 x 180 */
            width: 100%;
            max-width: 300px;
        }

        #project #project-panel .right .name
        {
            font-weight: 500;
            margin-bottom: 10px;
        }

        #project #project-panel .right .description
        {
            font-weight: 300;
            font-size: 16px;
            line-height: 20px;
        }

        #project #project-panel .right .link
        {
            margin-top: 10px;
            font-size: 15px;
        }

            #project #project-panel .right .link a
            {
                color: #ee4a23;
            }

        #project #edit-link
        {
            margin: 0 0 0 20px;
        }

        #project #edit-link .icon
        {
            width: 34px;
            fill: #ee4a23;
        }

            #project #edit-link .icon:hover
            {
                fill: #000;
            }

@media (max-width: 760px)
{
    #project #project-panel { display: block; }
    #project #project-panel .left .avatar b { max-width: 100%; }
    #project #project-panel .middle {max-width: 100%;}
    #project #project-panel .middle .state { margin: 5px 0 0 0; }
    #project #project-panel .middle .arrow { display: none; }
    #project #project-panel .right { text-align: center; margin: 20px auto 0 auto; }
    #project #project-panel .right img { margin-bottom: 5px; }
    #project #project-panel .right .description { padding: 0 10px; }
    #project #project-panel #edit-link
    {
        text-align: center;
        margin-top: 10px;
    }
}

#project #kpi-panel
{
    display: flex;
    align-items: center;
    margin: 45px 0 0 0;
    justify-content: space-evenly;
    padding: 25px 0;
}

    #project #kpi-panel .icon
    {
        width: 50px;
        fill: #ddd;
    }

    #project #kpi-panel .item
    {
        text-align: center;
    }

    #project #kpi-panel .stat
    {
        font-size: 40px;
        font-weight: 300;
        color: #ee4a23;
    }

    #project #kpi-panel .tag
    {
        font-size: 15px;
        font-weight: 200;
        color: #000;
        letter-spacing: 1px;
    }



@media (max-width: 750px)
{
    #project #kpi-panel { margin-top: 30px; }
    #project #kpi-panel .stat { font-size: 30px; }
    #project #kpi-panel .tag { font-size: 14px; }
}

@media (max-width: 800px)
{
    #project #kpi-panel.is-checkin { margin-top: 30px; }
    #project #kpi-panel.is-checkin .stat { font-size: 30px; }
    #project #kpi-panel.is-checkin .tag { font-size: 14px; }
}

@media (max-width: 550px)
{
    #project #kpi-panel { padding: 15px 0; margin-top: 30px; margin-bottom: -10px;}
    #project #kpi-panel .stat { font-size: 25px; }
    #project #kpi-panel .tag { font-size: 12px; }
}

@media (max-width: 600px)
{
    #project #kpi-panel.is-checkin { padding: 15px 0; margin-top: 30px; margin-bottom: -10px;}
    #project #kpi-panel.is-checkin .stat { font-size: 25px; }
    #project #kpi-panel.is-checkin .tag { font-size: 12px; }
}

@media (max-width: 430px)
{
    #project #kpi-panel { display: block; padding: 20px 0 10px 0; }
    #project #kpi-panel .stat { font-size: 30px; }
    #project #kpi-panel .tag { font-size: 14px; margin-bottom: 20px; }
}

@media (max-width: 480px)
{
    #project #kpi-panel.is-checkin { display: block; padding: 20px 0 10px 0; }
    #project #kpi-panel.is-checkin .stat { font-size: 30px; }
    #project #kpi-panel.is-checkin .tag { font-size: 14px; margin-bottom: 20px; }
    #project #kpi-panel.is-checkin button { margin-bottom: 20px; }
}

#project #cards-panel
{
    display: flex;
    align-items: center;
    margin: 50px 0 0 0;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    box-sizing: border-box;
}

    #project #cards-panel .card
    {
        position: relative;
        width: 29%;
        margin: 0 0 50px 0;
        padding: 20px 0 35px 0;
        text-align: center;
    }

        #project #cards-panel .card .title
        {
            color: #ee4a23;
            font-size: 22px;
            font-weight: 200;
            letter-spacing: 1px;
            opacity: 1;
        }

        #project #cards-panel .card .tag
        {
            font-weight: 200;
            font-size: 15px;
            letter-spacing: 1px;
            margin-top: 20px;
        }

        #project #cards-panel .card .stat
        {
            font-weight: 300;
            font-size: 15px;
            margin-top: 2px;
        }

        #project #cards-panel .card .sparkline
        {
            fill: none;
            stroke: #629c44;
            margin: 30px 0 0 0;
        }

        #project #cards-panel .card .legend
        {
            text-align: center;
            margin: 0 0 0 0;
            font-size: 12px;
            color: #000;
            opacity: 0.3;
        }

        #project #cards-panel .card button
        {
            margin: 30px 0 5px 0;
            position: absolute;
            bottom: 20px;
            left: 28%;
            width: 42%;
            text-align: center;
        }

    #project #cards-panel .zero
    {
        width: 29%;
    }

@media (max-width: 890px)
{
    #project #cards-panel .card { width: 45%; }
}

@media (max-width: 630px)
{
    #project #cards-panel .card { width: 100%; }
}

/*
* PROJECT - TABS
*/

#project #tabs
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 0 0;
    padding: 0 50px;
}

    #project #tabs .item
    {
    }

        #project #tabs .item a span
        {
            vertical-align: middle;
            font-size: 20px;
            font-weight: 200;
            letter-spacing: 2px;
            color: #bbb;
        }

            #project #tabs .item.selected a span, #project #tabs .item.selected a:hover span
            {
                color: #ee4a23;
                font-weight: 500;

            }

        #project #tabs .item .icon
        {
            fill: #ddd;
            vertical-align: middle;
        }

            #project #tabs .item.selected .icon, #project #tabs .item.selected:hover .icon
            {
                fill: #ee4a23;
            }

            #project #tabs .item:hover a span, #project #tabs .item:hover .icon
            {
                color: #444;
                fill: #444;
            }

            #project #tabs .item .icon.founders { width: 34px; margin-right: 7px; }
            #project #tabs .item .icon.batches { width: 34px; margin-right: 3px; }
            #project #tabs .item .icon.leaderboard { width: 34px; margin-right: 6px; }

/*
* IDEAS - TABS RESPONSIVE
*/

@media (max-width: 700px)
{
    #project #tabs { margin-top: 40px; padding: 0 20px; }
    #project #tabs .item { text-align: center; }
    #project #tabs .item a span { font-size: 14px; display: block;  }
}

/*
* FOUNDERS
*/


#project #founder-cards
{
    display: flex;
    align-items: center;
    margin: 50px 0 0 0;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    box-sizing: border-box;
}

    #project #founder-cards .zero
    {
        width: 31%;
    }

    #project #founder-cards .card
    {
        position: relative;
        width: 31%;
        margin: 0 0 50px 0;
        padding: 20px 0 35px 0;
        text-align: center;
        border: solid #f7f6f6 10px;
        border-radius: 5px;
        height: 430px;
    }

        #project #founder-cards .card .avatar
        {
            text-align: center;
            padding-right: 0;
            margin-right: 5px;
            min-width: 90px;
            cursor: pointer;
        }

            #project #founder-cards .card .avatar img
            {
                width: 100px;
                height: 100px;
                border-radius: 100px;
            }


            #project #founder-cards .card .avatar b
            {
                margin-top: -3px;
                font-size: 20px;
                color: #ee4a23;
                font-weight: 500;
                display: block;
                text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap;
                letter-spacing: 1px;
                margin-bottom: 5px;
            }

            #project #founder-cards .card .avatar i
            {
                font-size: 11px;
                color: #ee4a23;
                font-weight: 400;
                letter-spacing: 0.3px;
                display: block;
                white-space: nowrap;
            }

            #project #founder-cards .card .state
            {
                margin: 5px 0 0 0;
                font-size: 13px;
                color: #ee4a23;
                letter-spacing: 1px;
                font-style: italic;
            }

        #project #founder-cards .card .logo
        {
            padding: 15px 15px;
        }

            #project #founder-cards .card .logo img
            {
                width: 100%;
                max-width: 250px;
            }

        #project #founder-cards .card .stats
        {
            display: flex;
            align-items: center;
            justify-content: space-evenly;
            flex-wrap: wrap;
        }

            #project #founder-cards .card .stats .item
            {
                text-align: center;
                width: 40%;
                margin-bottom: 10px;
            }

            #project #founder-cards .card .stats .stat
            {
                font-size: 20px;
                font-weight: 400;
                color: #ee4a23;
                margin-bottom: 3px;
            }

            #project #founder-cards .card .stats .tag
            {
                font-size: 13px;
                font-weight: 200;
                color: #000;
                letter-spacing: 1px;
            }

        #project #founder-cards .card .bio
        {
            margin: 15px 15px 0 15px;
            padding: 10px;
            font-size: 14px;
            line-height: 18px;
            height: 195px;
            text-align: left;
            overflow-y: auto;
            text-overflow: ellipsis;
        }


@media (max-width: 890px)
{
    #project #founder-cards .card { width: 45%; }
}

@media (max-width: 630px)
{
    #project #founder-cards .card { width: 100%; }
}

/*
* BATCHES
*/

#project #batch-cards
{
    display: flex;
    align-items: center;
    margin: 50px 0 0 0;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    box-sizing: border-box;
}

    #project #batch-cards .zero
    {
        width: 31%;
    }

    #project #batch-cards .card
    {
        position: relative;
        width: 31%;
        margin: 0 0 50px 0;

        text-align: center;
        border: solid #f7f6f6 10px;
        border-radius: 5px;
    }

        #project #batch-cards .card .main-link
        {
            display: block;
            padding: 20px 15px 35px 15px;
            height: 100%;
        }

        #project #batch-cards .card .name
        {
            color: #ee4a23;
            font-size: 26px;
            font-weight: 600;
            letter-spacing: 1px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        #project #batch-cards .card .series
        {
            color: #606060;
            font-size: 12px;
            font-weight: 300;
            letter-spacing: 1px;
            margin-top: 3px;
        }

        #project #batch-cards .card .members
        {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            margin: 20px 0 15px 0;
        }

            #project #batch-cards .card .members .img
            {
                background: #eee;
                width: 20%;
                height: 45px;
            }

            #project #batch-cards .card .members .zero
            {
                width: 20%;
            }

        #project #batch-cards .card .info
        {
            text-align: left;
            color: #000;
            font-size: 14px;
            font-weight: 300;
            letter-spacing: 1px;
            margin-bottom: 7px;
        }

@media (max-width: 890px)
{
    #project #batch-cards .card { width: 45%; }
}

@media (max-width: 630px)
{
    #project #batch-cards .card { width: 100%; }
}