html {
	margin: 0px;
	padding: 0px;
	background-color: #495868;
}
body {
	font-family: 'Roboto', sans-serif;
	margin: 0px;
	padding: 0px;
	font-size: 10pt;
	color:#555555;
	overscroll-behavior:none;
	background-color:#ffffff;
}
#all {
	box-sizing: border-box;
	margin: 0px;
	background-color: #ffffff;
	width: 100%;
	text-align: center;
}
#container {
	box-sizing: border-box;
	min-height:450px;
    height:auto !important;
	background-color: #ffffff;
	width: 100%;
	margin: 0px;
	padding: 100px 0 0 0;
	text-align: left;
}

/* START NAVIGAITON */
div#top-menu-bar-public {
	width: 100%;
	padding: 10px 25px;
	margin: 0;
	overflow: hidden;
	text-align:left;
	background-color:#ffffff;
	position:fixed;
	box-sizing: border-box;
	height:100px;
	z-index: 100;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:space-between;
	-moz-justify-content:space-between;
	justify-content:space-between;
	-webkit-align-items:center;
	align-items:center;
}

div#top-menu-bar-public div#menu-expand {
	display:none;
	cursor:pointer;
}

div#top-menu-bar-public div#menu-expand p {
	box-sizing: border-box;
	vertical-align:middle;
	color:#000000;
	font-size:2em;
	padding:0px 10px;
	margin:0px;
	line-height:40px;
	display:inline-block;
	font-family: 'Helvetica', sans-serif;
	width:45px;
	text-align:center;
}

div#top-menu-bar-public div#main-logo a#logo-link {
	vertical-align:middle;
}

div#top-menu-bar-public div#main-logo img {
	margin: 0px;
	padding: 0px;
	cursor: pointer;
	width:200px;
	vertical-align:middle;
}
div#top-menu-bar-public div#top-header-link-container a {
	text-decoration:none;
	color:#495868;
	margin-right:15px;
	font-family: 'Roboto', sans-serif;
	font-size:1.1em;
	letter-spacing:1px;
	font-weight:400;
}
div#top-menu-bar-public div#top-header-link-container a:hover {
	opacity:0.7;
}

/*------SIDEBAR------*/
div.sidebar-public {
	-webkit-box-shadow: 0px 0px 7px #cccccc;box-shadow: 0px 0px 7px #cccccc;-moz-box-shadow: 0px 0px 7px #cccccc;
	margin: 0;
	padding-top:0px;
	padding-bottom:85px;
	width: 200px;
	background-color: #ffffff; /* #F5F8FA; light blue */
	height: 100%;
	overflow: auto;
	text-align:left;
	box-sizing: border-box;
	position:fixed;
	top: 100px;
	right: 0;
	z-index: 99;
	display:block;
}

div.sidebar-public a {
  display: block;
  padding: 10px 1em;
  text-decoration: none;
  color:#495868;
  border-left: 5px solid #ffffff;
  font-family: 'Roboto', sans-serif;
  font-size:1.4em;
  font-weight:300;
  cursor:pointer;
}

/* active sidebar link */
#home div.sidebar-public a.home-nav-link, 
#features div.sidebar-public a.features-nav-link, 
#membership div.sidebar-public a.membership-nav-link {
	background-color: #F5F8FA;
	border-left: 5px solid #55C777;
	color: #55C777;
}
#features div#top-menu-bar-public div#top-header-link-container a.features-top-nav-link, 
#membership div#top-menu-bar-public div#top-header-link-container a.membership-top-nav-link, 
#login div#top-menu-bar-public div#top-header-link-container a.login-top-nav-link {
	border-bottom: 1px solid #55C777;
	color: #55C777;
}

div.sidebar-public a:hover {
  cursor:pointer;
  color: #527493;
  background-color: #fcfcfc;
}
/* END NAVIGATION */

/* START FOOTER */
div#footer-public {
	min-height: 30px;
	height:auto !important;
	width:100%;
	color: #F5F8FA; /* **COOL GRAY** */
	font-size: 1.2em;
	padding: 2em 0em;
	margin: 0px;
	background-color: #495868;
}
div#footer-public div#footer-inner-container {
	max-width:700px;
	margin:auto;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:center;
	-moz-justify-content:center;
	justify-content:center;
}
div#footer-public div#footer-inner-container div.footer-section{
	width:30%;
	box-sizing:border-box;
	padding:10px;
	text-align:center;
}
div#footer-public div#footer-inner-container div.footer-section h4{
	color:#B8D1E6;
	font-size:1em;
}
div#footer-public div#footer-inner-container div.footer-section a{
	display:block;
	margin:5px 0px;
	color:#ffffff;
	text-decoration:none;
	letter-spacing:1px;
}
div#footer-public div#footer-inner-container div.footer-section a:hover{
	opacity:0.7;
}
div#footer-public p#footer-afternote{
	text-align:center;
	font-size:9pt;
}
div#footer-public p#footer-afternote a{
	margin:10px 1em;
	display:inline-block;
	color:#83A3BA;
	text-decoration:none;
	font-size:9pt;
}
div#footer-public p#footer-afternote a:hover{
	opacity:0.7;
}
div#footer-public p#footer-afternote span {
	padding:0px 1em;
	color:#83A3BA;
	font-size:9pt;
	display:inline-block;
}
div#footer-public p#footer-afternote span#copyright {
	margin-left:1em;
}
div#footer-public p#footer-afternote span#copyright a{
	margin-left:0px;
}
/* end FOOTER */
/* START PAGE STYLES */
a:link, a:visited { 
	font-size: 1em;
	cursor:pointer;
	color:#527493;
	outline-style: none;
}
a:hover {
	color:#000000;
	cursor:pointer;
}
a:focus {
	outline:none;
	text-decoration:underline;
}

.button-primary, 
.button-secondary, 
.button-outline {
	font-family: 'Roboto', sans-serif;
	font-weight:700;
	letter-spacing:1px;
	font-size:1em;
	cursor:pointer;
	width:auto;
	display:inline-block;
	text-decoration:none;
	padding: 4px 5px;
	margin: 10px 3px;
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	outline:none;
}
a.button-primary, .button-primary {
	border: 2px solid #55C777;
	background-color: #55C777;
	color:#ffffff;
	font-size:1em;
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
}

a.button-primary:hover, .button-primary:hover {
	opacity:0.8;
}
a.button-secondary, .button-secondary {
	border: 2px solid #DCE0E2;
	background-color: #DCE0E2;
	color:#414142;
}

a.button-secondary:hover, .button-secondary:hover {
	background-color: #CACBCC;
	border: 2px solid #CACBCC;
}
a.button-outline, .button-outline {
	color: #527493;
	border: 2px solid #527493;
	background-color:transparent;
}

a.button-outline:hover, .button-outline:hover {
	color: #414142;
	border: 2px solid #414142;
}

a.classicLink, p.classicLink, input.link-lookalike {
	border: none;
	background-color: transparent;
	text-decoration: underline;
	color: #527493;
	background-image: none;
	padding: 0px;
}
h1 {
	font-family: 'Playfair Display', serif;
	/*font-family: 'Roboto', sans-serif;*/
	font-weight: 200;
	font-size: 3em;
	color: #555555;
	padding: 20px 0px 10px 0px;
	margin:0;
}
h1.large-margins {
	margin:2em 0;
}

h2 {
	color:#527493;
	font-weight:400;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	font-size:2em;
	margin:0;
	padding:10px 0;
}

h3 {
	color:#495868;
	font-size: 1.5em;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
}

h4 {
	color:#495868;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	font-weight:400;
	margin-bottom:5px;
	font-size:1.1em;
}
h5 {
	color:#495868;
	font-family: 'Roboto', sans-serif;
	text-transform: uppercase;
	font-weight:400;
	margin:10px 0px 5px 0px;
	font-size:1.1em;
}
input[type=text], input[type=textbox], input[type=password], textarea {
	padding: 10px 5px;
	/*border: 1px solid #DBDFE1;
	background-color:#F5F8FA;*/
	border:1px solid #DBDFE1;
	background-color:#fcfcfc;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	width:100%;
	box-sizing: border-box;
	font-size: 1.1em;
	/*border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;*/
	margin:3px 0px;
	outline:none;
}
input[type=text]:focus, input[type=textbox]:focus, input[type=password]:focus, textarea:focus {
	background-color:#F5F8FA;
	border:1px solid #C5DAE2;
}
input[type=text]::-webkit-input-placeholder, input[type=textbox]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
	color:#aaaaaa;
}
input[type=text]:-ms-input-placeholder, input[type=textbox]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, textarea:-ms-input-placeholder {
	color:#aaaaaa;
}
input[type=text]::placeholder, input[type=textbox]::placeholder, input[type=password]::placeholder, textarea::placeholder {
	color:#aaaaaa;
}
input[type=text].small-textbox {
	width:90px;
}
input.datepicker {
	background: #fcfcfc url('../images/icons/calendar_gray_25.png') no-repeat 99% 50%;
	padding-right:40px;
}

input.check-style, 
div.list-table input[type=checkbox], input[type=radio] {
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width:24px;
    height:24px;
    background-color:#ffffff;
    border:1px solid #DCE0E2;
    margin:0px 10px 0px 0px;
    vertical-align:middle;
    border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	outline:none;
}

input.check-style:checked, 
div.list-table input[type=checkbox]:checked, input[type=radio]:checked {
	background: #ffffff url('../images/icons/check_darkgray_22.png') no-repeat center center;
}
input[type=submit], input{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
label {
	cursor:pointer;
	margin-top:10px;
	display:block;
}
textarea {
	font-family: 'Roboto', 'Open Sans', sans-serif;
	overflow: auto;
}
textarea.longtext {
	min-height:200px;
}
textarea:focus {

}

select.droplist {
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
	padding:10px;
	border:1px solid #DBDFE1;
	font-size:1.1em;
	color:#414142;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	width:100%;
	margin:0px;
	background: #F4F7F9 url('../images/icons/droplist-arrow-filled_22.png') no-repeat right 5px center;
	outline:none;
}
select.droplist.inline-droplist {
	background-color:#ffffff;
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	padding:7px 10px;
	border:1px solid #DBDFE1;
}
p.validMessage,div.validMessage, 
p.successfulProcessMessage {
	background-color: #D5EFDB;
	padding: 1em 2em;
	width:100%;
	margin:10px 0px 0px 0px;
	box-sizing:border-box;
}

p.invalidMessage, div.invalidMessage,
p.errorProcessMessage {
	background-color: #FED7AF;
	padding: 1em 2em;
	width:100%;
	margin:10px 0px 0px 0px;
	box-sizing:border-box;
}
div.public-page-header {
	text-align:center;
	padding:1em 2em 2em 2em;
	background-color:#F5F8FA;
}
div.public-page-content {
	padding:1em 2em 3em 2em;
	max-width:600px;
	margin:auto;
}
div.public-page-content form {
	max-width:450px;
	margin:auto;
}
div.public-page-header p {
	max-width:600px;
	margin:auto;
}
div#faq-collapsible h3{
	margin-bottom:0px;
}
div.public-page-callout {
	background-color:#55C777;
	padding:3em 2em;
	text-align:center;
	color:#ffffff;
}
div.public-page-callout a.button-primary{
	background-color:#FC9B38;
}
div.public-page-callout h2{
	max-width:600px;
	margin:auto;
	color:#ffffff;
}
div.home-hero-section {
	padding:3em 2em;
	background-color:#ffffff;
	margin:0px;
}
div.home-hero-section.art-swatch-background {
	background: #F5F8FA url("../images/art_swash_background_bottom_2000.png") no-repeat;
	background-position: center bottom;
	background-size: 100% auto;
}
div.home-hero-section#features-header{
	background: #F5F8FA url("../images/smiling_boy_edited.png") no-repeat;
	background-position: right -15% bottom 40%;
	background-size: auto 120%;
}
div.home-hero-section#features-header h1 span#green-swash{
	background:url("/images/red_swash.png") no-repeat center;
	display:inline-block;
	padding:5px 20px 15px 20px;
	background-size: contain;
	color:#ffffff;
	font-family:'Roboto Condensed', sans-serif;
}
div.home-hero-section p {
	max-width:600px;
	font-size:1.1em;
}
div.home-hero-section#features-header p{
	max-width:65%;
}
div.home-hero-section div.hero-centered-image {
	text-align:center;
}
div.home-hero-section div.hero-centered-image img {
	width:80%;
	max-width:1000px;
}
div.home-hero-section div.three-column-feature {
	width:100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:center;
	-moz-justify-content:center;
	justify-content:center;
}
div.home-hero-section div.three-column-feature > div.how-it-works-feature {
	width:32%;
	text-align:center;
	box-sizing:border-box;
	padding:10px;
	max-width:300px;

}
div.home-hero-section div.three-column-feature > div h2{
	text-align:center;
}
div.home-hero-section div.three-column-feature > div.how-it-works-feature:not(:last-child) {
	background: #ffffff url("../images/large_gray_right_arrow_150.png") no-repeat right center;
}
div.home-hero-section div.three-column-feature div.how-it-works-feature div.image-container{
	width:90%;
	background-color:#ffffff;
	box-sizing:border-box;
	margin: 10px auto;
	/*-webkit-box-shadow: 0px 0px 7px #cccccc;box-shadow: 0px 0px 7px #cccccc;-moz-box-shadow: 0px 0px 7px #cccccc;*/
	vertical-align:middle;
}
div.home-hero-section div.three-column-feature div.how-it-works-feature div.image-container:not(last-child){
}
div.home-hero-section div.three-column-feature div.how-it-works-feature div.image-container img{
	width:100%;
}
div.home-hero-section div.two-column-feature {
	width:100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:center;
	-moz-justify-content:center;
	justify-content:center;
}
div.home-hero-section div.two-column-feature > div {
	width:45%;
	text-align:center;
	box-sizing:border-box;
	padding:1em 10px;
	max-width:500px
}
div.home-hero-section div.two-column-feature > div:first-child {
	border-right:1px solid #DCE0E2;
}
div.home-hero-section div.two-column-feature > div h3{
	margin-top:0px;
}
div.home-hero-section div.two-column-feature > div p {
	text-align:left;
	box-sizing:border-box;
	margin:0px;
	padding:10px;
}
div.home-hero-section div.two-column-feature > div p:not(:last-child) {
	border-bottom:1px solid #DCE0E2;
}
div.home-hero-section.background-image {
	min-height:400px;
}
div.home-hero-section.background-image#background-image1{
	background: url("../images/Janet_conferring_student_dim_BW.jpg") no-repeat 55% 65%; /* Janet_conferring_student_dim_BW.jpg */
}
div.home-hero-section.background-image#background-image1 div.quote-overlay{
width:100%;max-width:1500px;margin:auto;box-sizing:border-box;
}
div.home-hero-section.background-image#background-image1 div.quote-overlay p.quote-text{
	color:#F5F8FA;font-family:'Playfair Display', serif;font-size:2em;width:70%;padding-left:2em;
}
div.home-hero-section.background-image#background-image1 div.quote-overlay p.quote-source{
	width:70%;color:#ffffff;padding-left:2em;text-align:right;
}
div.home-hero-section.background-image div.text-black-overlay {
	background: url("../images/black_block_70_opaque.png") repeat;
	vertical-align:middle;
	width:80%;
	margin:auto;
}
div.home-hero-section.background-image div.text-white-overlay {
	background: url("../images/white_block_50_opaque.png") repeat;
	vertical-align:middle;
	width:80%;
	margin:auto;
}
div.home-hero-section div.text-black-overlay h1 {
	color:#ffffff;
}
div.home-hero-section div.text-white-overlay h1{
	color:#000000;
}
div.home-hero-section#sign-up {
	background-color:#F5F8FA;
	background-image:url("../images/confer_open_iPad.png");
	background-position: right center;
	background-size:35% auto;
	background-repeat:no-repeat;
}
div.home-hero-section#sign-up h2,
div.home-hero-section#sign-up p{
	width:65%;
}
div.home-hero-section#group-memberships {

}
div.inline-tabs > ul.ui-tabs-nav {
	margin:0px auto;
	text-align:center;
	box-sizing:border-box;
}
div.inline-tabs > ul.ui-tabs-nav li {
	border-bottom:2px solid #ffffff;
	color:#527493;
	background-color:transparent;
	font-weight:400;
	width:25%;
	outline-style: none;
	font-size:1.2em;
	letter-spacing:1px;
	margin:auto;
	box-sizing:border-box;
	padding:15px 0px;
}
div.inline-tabs > ul.ui-tabs-nav li:hover {
	border-bottom:2px solid #BBE9C9;
	background-color:transparent;
}
div.inline-tabs > ul.ui-tabs-nav li.ui-tabs-active {
	border-bottom:2px solid #55C777;
	color:#55C777;
}
div.inline-tabs > ul.ui-tabs-nav li.ui-tabs-active a{
	color:#55C777;
}
div.inline-tabs > ul.ui-tabs-nav li a{
	text-align:center;
	width:100%;
}
div.inline-tabs > div {
	padding-top:1em;
}
div.inline-tabs div.tab-container {
	padding:0em;
}
div.home-hero-section#classroom-feature {
	background-color:#F5F8FA;
	padding-bottom:0px;
}
div.home-hero-section#classroom-feature div#classroom-image-feature {
	text-align:center;
}
div.home-hero-section#classroom-feature div#classroom-image-feature img{
	display:block;
	width:100%;
	max-width:1200px;
	text-align:center;
	margin:0px auto;
}
div.home-hero-section#classroom-feature div.three-column-feature {
	margin-top:1em;
}
div.home-hero-section#classroom-feature div.three-column-feature > div {
	width:30%;
	box-sizing:border-box;
	padding:0px 10px;
	max-width:400px;
}
div.home-hero-section#classroom-feature h1 {
	text-align:center;
}
div.home-hero-section#classroom-feature p.classroom-description {
	max-width:620px;
	text-align:center;
	margin:auto;
}
div.home-hero-section.tools-section {
	padding:2em 0em 0em 0em;
}
div.home-hero-section.tools-section div.inline-tabs > ul.ui-tabs-nav {
	margin:0px 1em;
}
div.inline-tabs#feature-tabs div.tab-container div.top-box-shadow, 
div.inline-tabs#tutorial-tabs div.tab-container div.top-box-shadow{
	padding: 0px;
	margin:0px 1em;
	-webkit-box-shadow: inset 0 7px 9px -7px #cccccc;
	-moz-box-shadow: inset 0 7px 9px -7px #cccccc;
	box-shadow: inset 0 7px 9px -7px #cccccc;
	height: 1em;
}
div.features-flex-container {
	width:100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:space-between;
	-moz-justify-content:space-between;
	justify-content:space-between;
}
div.features-flex-container > div{
	width:50%;
	box-sizing:border-box;
}
div.features-flex-container > div.features-content {
	padding:1em 2em;
}
div.features-flex-container > div.features-image {
	-webkit-align-self:center;
	align-self:center;
	padding:1em 1em 0em 1em;
}
div.features-flex-container > div.features-image img {
	width:100%;
	display:block;
}

/* TUTORIALS */
div.inline-tabs#tutorial-tabs {
	margin-top:2em;
}
div.inline-tabs#tutorial-tabs > ul.ui-tabs-nav {
	margin:0px auto;
	text-align:center;
	width:100%;
	border-bottom:1px solid #DCE0E2;
}
div.inline-tabs#tutorial-tabs > ul.ui-tabs-nav > li {
	width:50%;
	display:inline-block;
	box-sizing:border-box;
}
div#tutorial-video-accordian .ui-icon {
	background-color:transparent;
}
div#tutorial-video-accordian h2{
	font-size:1.8em;
	background-color:#F5F8FA;
	border-bottom:1px solid #DCE0E2;
	outline-style: none;
	padding:15px 1em;
}
div#tutorial-video-accordian > div {
	width:90%;
	margin:auto;
	padding:2em;
}
div.public-page-content#screenshot-tutorial{
	max-width:700px;
}
div.public-page-content#screenshot-tutorial p img{
	width:100%;
	-webkit-box-shadow: 0px 0px 5px #cccccc;-moz-box-shadow: 0px 0px 5px #cccccc;box-shadow: 0px 0px 5px #cccccc;
}
div.public-page-content#screenshot-tutorial p.tutorial_step{
	padding:5px;
	font-size:1.2em;
}
div.inline-tabs#tutorial-tabs div#screenshot-tab {
	padding:2em;
}
div.inline-tabs#tutorial-tabs div#screenshot-tab div#tutorial_list h5 {
	text-transform:none;
	margin-bottom:0px
	font-weight:bold;
}
div.inline-tabs#tutorial-tabs div#screenshot-tab div#tutorial_list p{
	margin: 0px 0px 5px 0px;
}
div.inline-tabs#tutorial-tabs div#screenshot-tab div#tutorial_list {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:space-evenly;
	-moz-justify-content:space-evenly;
	justify-content:space-evenly;
}
div.inline-tabs#tutorial-tabs div#screenshot-tab div#tutorial_list > div {
	width:40%;
}
/* END TUTORIALS */
span.how-arrow{
	font-size:2em;
	vertical-align:middle;
}

.drop-shadow {
	-webkit-box-shadow: 0px 0px 7px #cccccc;box-shadow: 0px 0px 7px #cccccc;-moz-box-shadow: 0px 0px 7px #cccccc;
}
.text-center{
	text-align:center;
	margin:auto;
}
.text-right{
	text-align:right;
}
.text-left{
	text-align:left;
}
.inline-block{
	display:inline-block;
}
.no-edges {
	margin:0px;
	padding:0px;
}
.bold-me {
	font-weight:bold;
}
.hidden {
	display:none;
}
div.top-banner-announcement {
	margin:0px;
	padding:1em;
	background-color:#29b473;
}
div.top-banner-announcement p {
	text-align:center;
	margin:0px auto;
	width:100%;
	max-width:600px;
	color:#ffffff;
	font-size:18px;
}
div.top-banner-announcement p a{
	color:#ffffff; 
}
div#form-validation {
	background-color:#fa755a;
	color:#ffffff;
	padding:10px;
	margin:10px auto;
	display:none;
}
div#form-validation a {
	color:#ffffff;
	font-weight:bold;
}
/* spinner/processing state, errors */
.spinner,
.spinner:before,
.spinner:after {
  border-radius: 50%;
}
.spinner {
  color: #ffffff;
  font-size: 22px;
  text-indent: -99999px;
  margin: 0px auto;
  position: relative;
  width: 20px;
  height: 20px;
  box-shadow: inset 0 0 0 2px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.spinner:before,
.spinner:after {
  position: absolute;
  content: "";
}
.spinner:before {
  width: 10.4px;
  height: 20.4px;
  background: #55C777;
  border-radius: 20.4px 0 0 20.4px;
  top: -0.2px;
  left: -0.2px;
  -webkit-transform-origin: 10.4px 10.2px;
  transform-origin: 10.4px 10.2px;
  -webkit-animation: loading 2s infinite ease 1.5s;
  animation: loading 2s infinite ease 1.5s;
}
.spinner:after {
  width: 10.4px;
  height: 10.2px;
  background: #55C777;
  border-radius: 0 10.2px 10.2px 0;
  top: -0.1px;
  left: 10.2px;
  -webkit-transform-origin: 0px 10.2px;
  transform-origin: 0px 10.2px;
  -webkit-animation: loading 2s infinite ease;
  animation: loading 2s infinite ease;
}
button.button-blue .spinner:before,
button.button-blue .spinner:after {
	background: #73B3F2;
}
@-webkit-keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@media only screen and (max-width: 900px) {
	div.home-hero-section#features-header h1{
		font-size:2.7em;
	}
	div.home-hero-section#features-header p{
		width:60%;
	}
}
@media only screen and (max-width: 750px) {
	div.home-hero-section#features-header {
		background-position: right -25% bottom 40%;
		background-size: auto 100%;
	}
	div.home-hero-section#features-header h1{
		font-size:2.5em;
	}
}
@media only screen and (max-width: 690px) {
	div.home-hero-section div.three-column-feature {
		display: block;
	}
	div.home-hero-section div.three-column-feature > div.how-it-works-feature:not(:last-child) {
		background: #ffffff url("../images/large_gray_down_arrow_150.png") no-repeat bottom center;	
	}
	div.home-hero-section div.three-column-feature > div {
		width:100%;
		text-align:center;
		margin:auto;
	}
	div.home-hero-section#classroom-feature div.three-column-feature > div {
		width:100%;
		max-width:600px;
		text-align:left;
	}
	div.features-flex-container{
		display:block
	}
	div.features-flex-container > div.features-content {
		-webkit-box-ordinal-group: 1;
		-moz-box-ordinal-group: 1;
		-ms-flex-order: 1; 
		-webkit-order: 1; 
		order:1;
	}
	div.features-flex-container > div.features-image {
		-webkit-box-ordinal-group: 2;
		-moz-box-ordinal-group: 2;
		-ms-flex-order: 2; 
		-webkit-order: 2; 
		order:2;
	}
	div.features-flex-container > div.features-content,
	div.features-flex-container > div.features-image {
		width:90%;
		max-width:500px;
	}
	/*div.inline-tabs#tutorial-inner-tabs > ul.ui-tabs-nav li {
		width:25%;
	}
	div.inline-tabs#tutorial-inner-tabs > ul.ui-tabs-nav li.bottom-row {
		border-top:1px solid #DCE0E2;
	}*/
}
@media only screen and (min-width: 650px) {
	div.sidebar-public{
		display:none;
	}
	div#top-header-link-container {
		display:block !important;
	}
}
@media only screen and (max-width: 650px) {
	div.sidebar-public{
		display: none;
	}
	div#top-menu-bar-public div#menu-expand {
		display:inline-block;
	}
	div#top-menu-bar-public {
		width: 100%;
	}
	div#top-header-link-container {
		display:none !important;
	}
	div#top-header-link-container {
		display:block;
	}
	div.home-hero-section#features-header {
		background-image:none;
	}
	div.home-hero-section#features-header p{
		width:100%;
	}
	/div.inline-tabs#tutorial-tabs > ul.ui-tabs-nav li {
		width:50%;
	}
	div.home-hero-section div.two-column-feature {
		display: block;
	}
	div.home-hero-section div.two-column-feature > div {
		width:100%;
		margin:auto;
	}
	div.home-hero-section div.two-column-feature > div:first-child {
		border-right:0px;
		border-bottom:1px solid #DCE0E2;
	}
}
@media only screen and (max-width: 500px) {
	div.home-hero-section div.three-column-feature > div.how-it-works-feature {
		width:80%;
	}
	div.inline-tabs#tutorial-tabs div#screenshot-tab div#tutorial_list {
		display: block;
	}
	div.inline-tabs#tutorial-tabs div#screenshot-tab div#tutorial_list > div {
		width:100%;
	}
	div.home-hero-section.background-image#background-image1 div.quote-overlay p.quote-text{
		width:90%;padding-left:1em;
	}
}
@media only screen and (min-device-width : 375px) and (-webkit-device-pixel-ratio : 3) { 
	h1{
		font-size:2.4em;
	}
	div.home-hero-section p {
		letter-spacing:0px;
	}
	div.home-hero-section div.hero-centered-image img {
		width:100%;
	}
}