html, body{
	margin: 0;
	padding: 0;
	position: relative;
	overflow-x: hidden;
	font-family: 'Open Sans', sans-serif;
	font-size: 18px;
    font-weight: 400;
    line-height: 1.35em;
	color: #fff;
}
body{background: #232727;}
body img{border: none;}
.wrap{
	margin: 0 auto 0 auto;
	position: relative;
	width: 90%;
	max-width: 884px;
}
@media screen and (max-width: 720px){
    html, body{font-size: 16px;}
}
	
/*---------------FONT STYLES--------------*/
h1, h2, h3, h4, p, a, ol, ul, li{margin: 0; padding: 0;}
h1{
	margin: 0 0 15px 0;
	font-size: 30px;
	font-weight: 700;
    line-height: 1.666em;
}
h2{
	margin: 0 0 20px 0;
	padding: 15px 0 0 0;
	font-size: 1.333em;
	font-weight: 700;
    line-height: 1.3em;
}
h2:first-child, h1 + h2{padding-top: 0;}
h3{
	margin: 0 0 20px 0;
	padding: 15px 0 0 0;
	font-size: 1.111em;
	font-weight: 700;
    line-height: 1.3em;
}
h3:first-child, h2 + h3{padding-top: 0;}
p{margin-bottom: 20px;}
a{
	text-decoration: none;
	color: #73D6D2;
	-webkit-transition: color 300ms ease;
	-moz-transition: color 300ms ease;
	-o-transition: color 300ms ease;
	transition: color 300ms ease;
}
a:hover{color: #fff;}
a:focus{outline: none;}
ul{margin-bottom: 20px;}
ul li{list-style: none;}
@media screen and (max-width: 720px){
    h1{font-size: 1.625em;}
    h2{font-size: 1.333em;}
    h3{font-size: 1.125em;}
}
	
/*---------------CONTENT--------------*/
#page .top{
    display: flex;
    flex-direction: row;
    align-items: stretch;
    background: url("images/dancing-background.jpg") center center no-repeat; background-size: cover;
}
#page .top::before{
    margin-left: -100px;
    padding: 28% 0 320px 0;
    display: block;
    width: 100px;
    float: left;
    content: '';
}
#page .top-inner{
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-between;
}
#top{padding-top: 3.645833%;}
#top .wrap{padding-top: 10px;}
#top .logo-social{position: relative;}
#top .logo{display: block; width: 390px; min-width: 200px; max-width: 44.117647%;}
#top .logo img{display: block; width: 100%;}
#top .social{
    margin-bottom: -16px;
    position: absolute;
    top: 27.523025%;
    right: 0;
}
#main{font-size: 20px; line-height: 1.35em;}
#main .wrap{padding: 180px 0 15px 0;}
#main .inner{max-width: 608px;}
.content{padding-top: 60px; padding-bottom: 40px;}
.content + .content{padding-top: 0;}
.section + .section{padding-top: 15px;}
.short-paragraphs{margin-bottom: 20px;}
.short-paragraphs p{margin: 0;}
.short-paragraphs p + p{margin-top: 5px;}
.no-margins{margin-bottom: 20px;}
.no-margins p{margin-bottom: 0;}
.dance-types{overflow: hidden; color: #73D6D2;}
.dance-types li{float: left;}
.dance-types li::after{margin: 0 4px; content: '|';}
.dance-types li:last-child::after{display: none;}
.email-heading{margin-bottom: 10px;}
.email-heading span{display: inline-block;}
.icon-link a{display: block;}
.icon-link .icon{margin-right: 5px; display: inline-block; vertical-align: middle;}
.icon-link .text{display: inline-block; vertical-align: middle; overflow-wrap: break-word;}
.social{margin: 0 -10px 20px -10px;}
.social a{margin: 0 8px 16px; display: inline-block;}
.social img{display: block; width: 44px; image-rendering: -webkit-optimize-contrast;}
#footer{
    margin-bottom: 20px;
    font-size: 12px;
    line-height: 1.3em;
    color: #9b9b9b;
}
#footer a{text-decoration: none; color: inherit;}
#footer a:hover{color: #fff;}
#footer ul{margin: 0; display: inline-block; vertical-align: middle;}
#footer li{display: inline-block; vertical-align: middle;}
#footer li::after{content: ' |';}
#footer li:last-child::after{display: none;}
#footer .text{display: inline-block; vertical-align: middle;}
#footer .icon{margin-left: 4px; display: inline-block; vertical-align: middle;}
#footer .icon img{display: block; width: 25px;}
@media screen and (max-width: 720px){
    #main{font-size: 18px;}
	.content{padding-top: 50px; padding-bottom: 30px;}
    .section + .section{padding-top: 10px;}
    #footer li{display: block;}
    #footer li + li{margin-top: 4px;}
    #footer li::after{display: none;}
    #footer .icon img{width: 22px;}
}
@media screen and (max-width: 480px){
    #top .logo{width: 200px; max-width: none; min-width: 0;}
    #top .social{margin: 0 -7px -14px -7px; top: auto; bottom: 0;}
    #top .social a{margin: 0 7px 14px 7px; display: block;}
    #top .social img{width: 35px;}
	.content{padding-top: 40px; padding-bottom: 20px;}
    .section + .section{padding-top: 5px;}
}