body {
	background:url(../images/BG2.jpg) #000;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}

h2 {
	margin:0;
	padding:0;
	font-size:20pt;
}

h2 a, h2 a:visited {
	color:#6600CC;
	text-decoration:underline;
}

h2 a:hover {
	color:#66F;
}

h3 {
	margin-bottom:0;
}

h4 {
	margin:20px 0 0 0;
	padding:0;
	font-size:15pt;
}

p {
	padding:5px 0 5px 0;
	margin:0;
	font-size:13pt;
}

a, a:visited { 
	color:#60F;
}

a:hover {
	color:#66F;
}

img {
    max-width: 100%;
    height: auto;
}

a img {
	border:0;
	outline:none;
}

#outerWrapper {
	width:930px;
	margin:0 auto;
}

#roundOuterTop {
	height:20px;
	width:930px;
	margin:0 auto;
	padding:0;
	background:url('../images/roundOuterTop.png');
}

#roundOuterBottom {
	height:20px;
	width:930px;
	margin:0 auto;
	padding:0;
	background:url('../images/roundOuterBottom.png');
}

#header {
	width:922px;
	height:480px;
	border:4px solid #000;
	border-top:0;
	border-bottom:0;
	background-image:url(../images/Roop-New-Homepage-Layout-3.jpg);
	background-repeat:no-repeat;
	margin:0 auto;
}

#headerSmall {
	width:922px;
	height:300px;
	border:4px solid #000;
	border-top:0;
	border-bottom:0;
	background-image:url(../images/smallHeader2.jpg);
	background-repeat:no-repeat;
	margin:0 auto;
}

#music {
	width:367px;
	height:100px;
	float:left;
}

#player {
	width:275px;
	margin:10px auto;
}

.songTitle, .popUp {
	font-size:10pt;
	color:#ddd;
	margin:0;
	padding:0;
}

.popUp a{
	font-size:8pt;
	color:#ddd;
}

.popUp a:hover {
	color:#fff;
}

#body {
	width:922px;
	margin:0 auto;
	border:4px solid #000;
	border-top:0;
	border-bottom:0;
	background:url('../images/bodyBG.jpg') #000;
	background-repeat:no-repeat;
}

#roundTop{
	width:895px;
	margin:0 auto;
	height:14px;
	background:url('../images/roundTop.png');
	background-repeat:no-repeat;
}

#sitar {
	width:150px;
	height:100%;
	float:left;
	padding:0 0 10px 0;
}

#contentLeft {
	width:145px;
	padding-left:15px;
	float:left;
}

#contentRight {
	width:655px;
	padding:0 70px 0 10px;
	float:right;
}

.right {
	text-align:right;
	font-weight:bold;
	padding:0 0 20px 0;
}

.italic {
	font-style:italic;
}

.15pt {
	font-size:15pt;
}

.linkPageLinkP {
	line-height:30px;
	padding-top:15px;
}

a.linkPageLink, .linkPageLinkP img {
	line-height:30px;
	font-size:20px;
	vertical-align:middle;
}

a.linkPageLink {
	padding-left:10px;
}

#content {
	width:895px;
	min-height:400px;
	margin:0 auto;
	padding:0 0 20px 0;
	background:url('../images/contentBG.png');
	background-repeat:repeat-y;
}

#roundBottom{
	width:895px;
	margin:0 auto;
	height:14px;
	background:url('../images/roundBottom.png');
	background-repeat:no-repeat;
}

#footer {
	padding:15px 0 0 0;
	background:#000;
}

.clearFix {
	clear:both;
}

.label{
    text-align:right;
}

#submit{
    text-align:center;
}

#recentRecordings {
	background:#dcd1ac;
	border:1px solid #c2b897;
	margin-top:10px;
}

#recentRecordings ul{
	width:670px;
	list-style-type:none;
	margin:0 auto;
	padding:0;
	text-align:center;
	font-size:11pt;
}

#recentRecordings li {
	list-style-type:none;
	display:inline;
	float:left;
	padding:10px 5px 10px 5px;
	width:150px;
}

#recentRecordings img {
	border:1px solid #ccc;
}

#recentRecordings li a:hover img,.product a:hover img{
	position:relative;
	top:-2px;
}

#upcomingEvents, #pastEvents {
	background:#dcd1ac;
	border:1px solid #c2b897;
	width:644px;
	margin:0 auto;
}

#musicLearningEvents {
	background:#dcd1ac;
	border:1px solid #c2b897;
	padding:10px;
}

#pastEvents .dayVariable {
	display:none;
}

.tableTitles {
	font-weight:bold;
	width:644px;
	margin:15px auto 0 auto;
}

hr {
	margin:5px 0 0 0;
	padding:0 0 0 0;
}

.footerLinks ul{
	width:550px;
	float:right;
	text-align:center;
	padding:0;
	list-style:none;
	font-size:10pt;
	margin:0;
}

.footerLinks li{
	display:inline;
	float:left;
	padding:0px 5px 0 5px;
	margin:0;
}

.roopProfile {
	
	text-align:center;
	width:137px;
	padding:10px;
	text-size:11pt;
	font-style:italic;
}
.recommended {
	text-align:center;
	width:200px;
	float:right;
	background:#dcd1ac;
	border:1px solid #c2b897;
	margin-left:5px;
}
.product{
    margin:6px;
    padding:6px;
    background: #c2b897;
}
.product span {
    margin-bottom: 6px;
    display: block;
}

#continuum5 {
	float:right;
	padding:10px;
}

#continuum4 {
	float:left;
	padding:10px;
}#continuum3 {
	padding: 10px;
	float: right;
}
#continuum1 {
	padding: 10px;
	float: left;
}
#musician1 {
	padding: 5px 10px;
	float: right;
}
#musician2 {
	padding: 5px 10px;
	float: left;
}
#contactForm label, #contactForm input, #contactForm textarea {
	width: 45%;
	display: inline-block;
	vertical-align: top;
	margin-bottom: 10px;
}
#contactForm input, #contactForm textarea {
	box-shadow: 0 0 1px;
	padding: 3px;
}
#contactForm input[type=submit] {
    width: 50%;
    padding: 6px;
    border: 1px solid #ccc;
    background: #fff;
    margin: 6px 0;
    font-size: 15px;
    margin: 12px auto;
    display: block;
}
#error {
	color: red;
}
#mobileBar, .submenu {
	display: none;
}
.rightFloat {
	float: right;
}
.refresh-icon svg {
    height: 25px;
    width: 25px;
}
.error{
    color:red;
    font-weight: bold;
}
@media screen and (max-width: 1000px) {
	#nav {
		display: none;
	}    

    div#header {
        display: block;
        max-width: 95%;
        background-size: contain;
        height: 49.5vw;
        border: none;
        margin-bottom: 6px;
        border-radius: 17px;
        overflow: hidden;
    }
    div#headerRight { /* music player */
        display: none;
    }
	body {
		width: 100%;
		margin: 0;
	}
	#outerWrapper {
		max-width: 100%;
	}
	#body {
		width: 100%;
		border: none;
		background: none;
	}
	#roundTop, #roundBottom {
		display: none;
	}
	#content {
		width: 95%;
		margin: auto;
		background: #F4E9C3;
		border: 2px solid #661713;
		border-radius: 10px;
		margin-bottom: 10px;
	}
	#contentLeft {
		width: 15%;
		vertical-align: top;
		padding: 10px;
		box-sizing: border-box;
	}
	#contentRight {
		width: 80%;
		vertical-align: top;
		padding: 10px;
		box-sizing: border-box;
	}
	#footer {
		width: 95%;
		margin: auto;
		border-radius: 10px;
		padding: 7px;
		box-sizing: border-box;
	}
	#roundOuterBottom {
		display: none;
	}
	#recentRecordings ul {
		width: 100%;
		height: auto;
		text-align: center;
		margin: auto;
	}
	#recentRecordings li {
		float: none;
		display: inline-block;
		text-align: center;
		vertical-align: top;
	}
	#recentRecordings li a {
		display: block;
	}
    #mobileBar {
        height: 60px;
        background-color: #A6CCF1;
        box-shadow: 0 3px 6px rgba(0,0,0,.5);
        position: fixed;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 10;
        display: block;
        max-width: 100vw;
    }
	#mobileBar img {
		height: 100%;
	}
    #mobileBar span.title {
        display: inline-block;
        vertical-align: top;
        font-size: 3.5vw;
        color: #fff;
        padding: 6px 0;
        text-align: right;
        line-height: 45px;
    }
	#navBtn {
		display: block;
		position: absolute;
		right: 10px;
		top: 8px;
		background-color: white;
		color: #AE94DD;
		padding: 10px;
		font-size: 1.5em;
		font-weight: bold;
		box-shadow: 0 1px 3px rgba(0,0,0,.5);
		transition: all .2s;
	}
	#navBtn:hover {
		background-color: #eee;
		cursor: pointer;
	}
	#navBtn:active {
		box-shadow: inset 0 1px 3px rgba(0,0,0,.5);
	}
	#mobileNav {
		background-color: #A6CCF1;
		display: block;
		position: fixed;
		width: 100%;
		color: #fff;
		font-weight: bold;
		overflow-y: hidden;
		height: 0;
		transition: all .5s;
		box-shadow: 0 3px 6px rgba(0,0,0,.5);
	}
	#mobileNav.open {
		height: 80%;
        overflow-y: scroll;
	}
	#mobileNav ul {
		padding: 0;
		margin: 0;
	}
	#mobileNav li a {
		list-style-type: none;
		width: 100%;
		padding: 10px;
		font-size: 1.2em;
		transition: all .2s;
		box-sizing: border-box;
		color: white;
		display: block;
		text-decoration: none;
	}
	#mobileNav li:nth-child(odd) a {
		background-color: #acf;
	}
	#mobileNav li a:hover {
		background-color: #79c;
		cursor: pointer;
	}
    .submenu{
        display: block;
    }
	body {
		margin-top: 75px;
	}
    .has-children > a:after{
        content' ↴ ';
    }
	.submenu.open {
		display: block;
		margin-left: 25px;
	}
	.submenu li a {
		font-size: .9em;
		padding-left: 20px !important;
	}
    .submenu li a:before{
        content:'› ';
    }
    #mobileNav ul.submenu li:nth-child(odd) a {
        background: #abd;
    }
    #mobileNav ul.submenu li:nth-child(even) a {
        background: #AEC2E4;
    }
	#headerSmall {
		display: none;
	}
	#gallery li {
		float: none !important;
		display: inline-block !important;
	}
	#gallery {
		text-align: center;
	}
    .g-recaptcha {
        text-align: center;
    }
    /* text restylings */
    h2{
        font-size:18pt;
    }
    h4{
        font-size:14pt;
    }
    .product {
        width: 40%;
        display: inline-block;
    }
}
@media screen and (max-width: 800px) {
	#contentLeft {
		display: none;
	}
	#contentRight {
		width: 100%;
        float:none;
	}
	#contentRight > div {
		width: 100% !important;
        overflow-x: hidden;
        float:none;
        margin:10px 0;
	}
}
@media screen and (max-width: 500px) {
	.rightFloat {
		float: none;
		width: 90%;
		margin: auto;
	}
	#upcomingEvents table td, #pastEvents table td {
		display: block;
		width: 100%;
		text-align: left;
	}
    #mobileBar span.title{        
        width: 50vw;
        font-size:14px;
        text-align: center;
    }
    #mobileBar span.title.long-title{        
        line-height: 1.7em;        
        text-align: right;
    }
	.tableTitles {
		display: none;
	}
	[align=center] {
		text-align: left;
	}
	p {
		text-align: left !important;
	}
	table {
		max-width: 100%;
		width: auto;
	}
	td {
		max-width: 100% !important;
	}
    /* text restylings */
    
    p{
        font-size: 14px;
        line-height: 1.3;
    }
}
/* Landscape phone */
@media screen and (max-height: 450px){
    .submenu.open{
        width:100%;
        background: #79c;
    }
    #mobileNav .submenu li{
        width:100%;
        display: block;
    }
}