.join-welcome-top h2 {
	color: #373a3d;
}

.join-welcome-top h4 {
    color: #373a3d;
}

.join-welcome-top .wrapper {
	padding-top: 18px;	
	background-image: url(../images/hero-sprite-blue.png);
	background-repeat: no-repeat;
	background-position: top left;
    background-size: 2rem;
	padding-bottom: 20px;
}

/*tables*/

table.join-table {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
	margin-bottom: 20px;
}

table.join-table tr {
    border-bottom: 0px;
}

table.join-table th,
table.join-table td {
	padding: 20px 20px 0;
    width: 267px;
}


@media only screen and (max-width: 1000px) {
    thead th:not(:first-child) {
        display: none;
    }

    td, th {
        display: block;
		width: auto;
    }

    td[data-th]:before  {
        content: attr(data-th);
    }
	
	td p {
		width: auto;
	}
	
	table {
		width: auto !important;
	
}
}


.join-table p {
    color: #373a3d;
    margin-top: 0.5rem;
    margin-bottom: 1.0rem;
    font-size: 18px;
    font-weight: bold;
    font-family: 'CircularTT-Book',sans-serif;
}

h1.nosb-title {
    padding-top: 32px;
}

/* Join Section */
#join-text-image.text-image {
    background: radial-gradient(farthest-side at bottom right, #9ed07c, #9ed07c 50%, rgba(164, 214, 94, 0.6));
	width:100%;
}

#join-text-image.text-image .wrapper {
    background-image: url(../images/hero-sprite-white.png);
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 2rem;
    padding-top: 3rem;
}

.join-left {
    float: left;
    width: calc(100% - 600px);
    padding-left: 50px;
	padding-right: 50px;
    display: table-cell;
    vertical-align: bottom;
    text-align: right;
	margin-bottom: -5px;
}

.join-left img {
	float:left;
}

.join-right p {
	color: #007fc4;
	font-size: 24px;
	word-spacing: 1px;
	margin-bottom: 45px;
	line-height: 2rem;
	max-width: 90%;
}

.join-right h2 {
	color:#007fc4;
	font-size: 48px;
    margin-bottom: 45px;
	margin-top: 32px;
}

.join-right h3 {
    color: #007fc4;
    font-size: 24px;
    word-spacing: 1px;
    margin-bottom: 45px;
    line-height: 2rem;
    max-width: 90%;
	font-family: 'CircularTT-Book', sans-serif !important;
}

.join-right {
    float: right;
    width: 100%;
    max-width: 500px;
	margin-top: 30px;
}

.join-button {
    float: left;
    background-color: #ffffff;
    color: #007fc4;
	background-image: url(../images/more-sprite-blue.png);
    background-repeat: no-repeat;
    background-position: 95% 53%;
    margin-top: 0px;
    text-align: center;
    width: 140px;
    height: 16px;
    padding: 10px 35px 10px 17px;
    margin-bottom: 32px;
	border-radius: 2px;
	margin-top: 0px;
	font-family: 'CircularTT-Bold';
    font-size: 0.95rem;
    line-height: 1rem;
}

.join-button:hover {
    background-color: #007fc4;
    background-image: url(../images/more-sprite-grey.png);
	text-decoration: none !important;
    color: #ffffff !important;
}

@media screen and (max-width: 1000px) {
	.join-left {
		display: none;
	}
	.join-right {
		float:left;
	}
}
	

/* Join Bar - Top */

#topjoin.text-banner {
    background: #007fc4;
}

#topjoin.text-banner .wrapper {
	background-image:none;
}

#topjoin.text-banner .banner-left h2 {
	color: #ffffff !important;
	margin-top: 0px;
	font-size: 28px;
}
		
#topjoin.text-banner .banner-left h1 {
    color: #ffffff !important;
    margin-top: 0px;
    font-size: 28px;
	line-height: 0.9;
}

	/* button */

.join-page-button {
    float: right;
    background-color: #ffffff;
    color: #007fc4;
	background-image: url(../images/more-sprite-blue.png);
    background-repeat: no-repeat;
    background-position: 95% 53%;
    text-align: center;
    width: 140px;
    height: 16px;
    padding: 10px 35px 10px 17px;
	border-radius: 2px;
	margin-top: -6px;
	font-family: 'CircularTT-Bold';
    font-size: 0.95rem;
    line-height: 1rem;
}

.join-page-button:hover {
background-color: #ffdd55;
    background-image: url(../images/more-sprite-grey-hover.png);
	text-decoration: none !important;
    color: #242a2f !important;
}

/* Responsive layout - when the screen is less than 760px wide, make button float left */
@media screen and (max-width: 760px) {
    .join-page-button {
        float: left;
		margin-bottom: 32px;
			}
		}

#footer-join {
    padding-top: 18px;
    background-image: url(../media/341207/hero-sprite-green.png);
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 2rem;
    padding-bottom: 20px;
}

#footer-join.wrapper h4 {
    margin-top: 32px;
/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */