/* This code is only meant for previewing your Reflow design. */
.primaryContainer {
    height: auto;
    margin-left: auto;
    margin-right: auto;
    min-height: 100%;
    width: 100%;
    background-color: rgb(16, 2, 2);
}

#slideshow {
    float: left;

	margin-left: 5%;
	margin-top: 22px;
	clear: both;
	width: 88%;
	margin-right: 5%;
	max-height: 100%;
	max-width: 700px;
	
	background-position: 0% 0%;
	border-color:white;
}

#image1 {
    float: left;
    width: auto;
    max-width: 100%;
    height: auto;
    margin-left: 0%;
    margin-top: 0px;
    clear: none;

    visibility: hidden;
    position: absolute;
    top: 219px;
    left: 0%;
}

#image {
    float: left;
    width: 368px;
    height: auto;
    margin-left: -0.03349336%;
    margin-top: 72px;
    clear: none;
  
    max-width: none;
    margin-right: 0%;
}

.input {
    float: left;
    height: 39px;
    font-size: 1.5em;
    margin-left: 5%;
    margin-top: 0px;
    clear: none;
	padding:px;
    color: rgb(255, 255, 255);
    background-color: rgb(16, 2, 2);
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-width: 0px;
    box-shadow: none;
    margin-right: 0%;
    font-weight: 100;
    font-family: helvetica;
}

.input:hover {
    background-color: rgb(250, 63, 214);
}

.input:active {
    background-color: rgb(250, 63, 214);
}

.hiddenBox{
	float: left;
	padding: 3px;
	 margin-left: 5%;
	margin-top: 20px;
	margin-right: 25%;
	color: #FFFFFF;
	background-size: 100%;
	min-width: 0px;
	display:none;
	font-family:Arial, Helvetica, sans-serif;
	text-wrap:normal;
	max-width:800px;


	
}




#logo {
    float: left;
    height: 189px;
    margin-left: 7.834073%;
    margin-top: -11px;
    clear: none;
    width: 100%;
}


#content_box {
	float: left;
	
	height: 200px;
	padding: 3px;
	 margin-left: 7.83944%;
	margin-top: 50px;

	width: 500px;
	margin-right: 0%;
	color: #FFFFFF;
	background-size: 100%;
	min-width: 0px;
	
	display:none;
	font-family:Arial, Helvetica, sans-serif;
	
}


.shows_white_bg{
	background-color:#FFF;
	color:#000;
	padding:30px;
	text-wrap:normal;
	line-height:1.5em;
	font-family:Arial, Helvetica, sans-serif;	
	
	    float: left;

	margin-left: 5%;
	margin-top: 22px;
	clear: both;
	width: 88%;
	margin-right: 5%;
	max-height: 100%;
	max-width: 750px;
	
	
	
}

.upcomingclasses_header {
	
	font-family:Arial, Helvetica, sans-serif;
	font-size:2.1em;
	
}

.upcomingshows {
	
	font-family:Arial, Helvetica, sans-serif;
	
}

.upcomingshows a {
	text-decoration:underline;
	color:#B35CB7;
	
	
}

.upcomingshows a:hover{
	color:#F374F7;

}

.upcomingshows_bold {
	font-weight:700;
	
}

.upcomingshows_bold_underline {
	font-size:1.3em;
	color:#B35CB7;

	text-decoration:underline;
	
	
}

.contact_box {
	float: left;

	height: auto;
	margin-left: 5%;
	margin-top: 5px;
	clear: none;
	width: 600px;
	margin-right: 0%;
	position: relative;
	top: 0px;
	left: 0px;
	display: block;
	z-index: 0;
	color: #F374F7;
}

#navigation {
	float: left;
	height: auto;
	margin-left: 15%;
	margin-top: 16px;
	clear: none;
	width: 100%;
	margin-right: 0%;
	position: relative;
	top: 0px;
	left: 0px;
	display: block;
	z-index: 0;
	color: #F374F7;
}





@media only screen and (max-width: 768px) {
    #navigation {
        margin-top: 47px;
        margin-left: 12.795318%;
        clear: both;
   
        z-index: 0;
    }

    #logo {
        margin-top: -11px;
        margin-left: 7.831293%;
        clear: none;
        width: 100%;
        height: 189px;
    }

    #slideshow {
        margin-top: 22px;
        margin-left: 9%;
        clear: both;
  
    }

    #image1 {
        top: 219px;
        left: 0%;
    }
	
 
}

@media only screen and (max-width: 540px) {
    #navigation {
        margin-top: 33px;
        margin-left: 7.835145%;
        clear: both;
        height: 108px;
        width: 100%;
        z-index: 0;
    }

    #logo {
        margin-top: -11px;
        margin-left: 7.831371%;
        clear: none;
        width: 100%;
        height: 189px;
    }

    #slideshow {
        margin-top: 22.109375px;
        margin-left: 9.034613%;
        clear: both;
        height: 384px;
    }


	

}

@media only screen and (max-width: 210px) {
	
	.primaryContainer {
    width: 100%;
   
}

	
	
    #navigation {
        margin-top: 33px;
        margin-left: 7.835145%;
        clear: both;
        height: 108px;
        width: 100%;
       
    }

    #logo {
        margin-top: -11px;
        margin-left: 7.831371%;
        clear: none;
        width: 100%;;
        
    }

    #slideshow {
        margin-top: 45px;
        margin-left: 3%;
        clear: both;
        height: 384px;
    }

	

}