/* RESET - Josh Comeau reset+
------------------------------------------------------------------------------------*/
*, *::before, *::after { box-sizing: border-box;  }
* {margin: 0;}
html {height: 100%;}
body {line-height: calc(1em + 0.5rem); -webkit-font-smoothing: antialiased;width: 100%;height: 100%;}
img, picture, video, canvas, svg {display: block;max-width: 100%;height: auto;}
input, button, textarea, select {font: inherit;}
p, h1, h2, h3, h4, h5, h6 {overflow-wrap: break-word;}
a, a:hover  { text-decoration:none;} 
seamless-flyout, #loom-companion-mv3 {display: none;} /* for clean screenshots - rhm */

/* FOCUS - for accessibility
************************/

:is(a, button, input, textarea, summary) {
  --outline-size: max(1px, 0.05em);
  --outline-style: solid;
  --color-outline: #DDD;
}

:is(a, button, input, textarea, summary):focus {
  outline: var(--outline-size) var(--outline-style) var(--color-outline);
  outline-offset: var(--outline-offset, var(--outline-size));
}

:is(a, button, input, textarea, summary):focus-visible {
  outline: var(--outline-size) var(--outline-style) var(--color-outline);
  outline-offset: var(--outline-offset, var(--outline-size));
}

:is(a, button, input, textarea, summary):focus:not(:focus-visible) {
  outline: none;
}

/* Styles from old site
************************/
body {
    background-image: url('https://www.deenalevy.com/images/design/Chair1.png');
    background-repeat: repeat-x;
    font-family: 'DejaVu Sans Condensed', 'Abadi MT Condensed Light', Arial, Verdana, "Lucida Grande", Tahoma, Helvetica, sans-serif;
    color: #f7f7d5;
    background-color: #080230;
    font-size: 11pt;
}


.uberContainer {
    width: 1000px;
    min-height: 100%;
    margin: 0 auto;
    /*background-image: url('https://www.deenalevy.com/images/design/Chair3.png');
    background-repeat: repeat-x;
    background-position: 0px 150px;*/
    background-color: #a81037;
}

.innerContainer {
    margin: 0 auto;
    min-height: 100vh;
    height: auto;
    border: 0px dashed green;
    padding: 20px 0 20px 20px;
}

.mainHeaderContainer {
	width: 100%;
    height: 140px;
}

.mainHeader	{
	width: 920px;
	position: relative;
	border: 0px dashed yellow;
}

#mainHeader .site-name {
    background-image: url('https://www.deenalevy.com/images/design/deenaLevyTheatreStudio.png');
    height: 49px;
    background-repeat: no-repeat;
    text-indent: -1000px;
    overflow: hidden;
    border: 0px dotted red;
}

.logo	{
	position: absolute;
    top: -17px;
    left: 830px;
    background-image: url('https://www.deenalevy.com/images/design/logo.png');
    width: 86px;
    height: 137px;
    z-index: 3;
    border: 0px dotted orange;
}

h1.siteTitle	{
	background-image: url('https://www.deenalevy.com/images/design/deenaLevyTheatreStudio.png');
    height: 49px;
    background-repeat: no-repeat;
    text-indent: -1000px;
    overflow: hidden;
    border: 0px dotted red;
}

h2.siteSlogan {
background-image: url('https://www.deenalevy.com/images/design/Slogan.png');
    height: 25px;
    background-repeat: no-repeat;
    text-indent: -1000px;
    overflow: hidden;
    border: 0px dotted red;
}

.mainNavigationContainer {
    float: left;
    width: 200px;
    height: 405px;
    border: 0px dotted yellow;
    z-index: 6;
}

ul.mainNavigation	{
	position: relative;
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    z-index: 5;
    font-family: Georgia, Times, serif;
}

ul.mainNavigation li {
    z-index: 6;
    position: relative;
    margin: 0px;
    padding: 0px;
    border-bottom: 0px solid #EEE;
    line-height: 30px;
    font-size: 14.5px;
    /* font-size: 1.1em; */
    background-image: url('https://www.deenalevy.com/images/design/fuschiaGradient1.png');
    margin-top: 1px solid #a81037;
}

ul.mainNavigation li a,
.contactInfo a,
.footer a {
	color: #fff;
}

ul.mainNavigation li a:hover,
.footer a:hover {
	border-bottom: 1px dotted #fff;;
}

.socialContainer {
    margin-top: 10px;
    margin-left: 10px;
    height: 20px;
    overflow: hidden;
    z-index: 10;
}

ul.socialFollow {
    list-style: none;
    margin: 0px;
    padding: 0px;
    border: 0px dotted red;
    width: 248px;
}

ul.socialFollow > li {
    display: block;
    float: left;
    margin: 0px;
    padding: 0px;
    width: 20px;
    height: 20px;
    margin-right: 10px;
}

ul.socialFollow li a.social {
    display: block;
    background-image: url('https://www.deenalevy.com/images/design/socialFollow.png');
    height: 20px;
    color: #602868;
    text-transform: lowercase;
    font-family: Helvetica;
    font-weight: bold;
    font-size: 16px;
    text-indent: 100px;
    border: 0px dotted red;
    overflow: hidden;
    margin: 0px;
}

ul.socialFollow li.email {
 	width: 27px;   
}

ul.socialFollow li.facebook a	{ background-position: 0px 0px;}
ul.socialFollow li.twitter a	{ background-position: -28px 0px;}
ul.socialFollow li.pinterest a	{ background-position: -56px 0px;}
ul.socialFollow li.youTube a	{ background-position: -84px 0px;}
ul.socialFollow li.linkedIn a	{ background-position: -112px 0px;}
ul.socialFollow li.googlePlusOne a	{ background-position: -140px 0px;}
ul.socialFollow li.instagram a	{ background-position: -168px 0px;}
ul.socialFollow li.email a	{ background-position: -196px 0px;}

ul.socialFollow li.facebook a:hover	{ background-position: 0px -20px;}
ul.socialFollow li.twitter a:hover	{ background-position: -28px -20px;}
ul.socialFollow li.pinterest a:hover	{ background-position: -56px -20px;}
ul.socialFollow li.youTube a:hover	{ background-position: -84px -20px;}
ul.socialFollow li.linkedIn a:hover	{ background-position: -112px -20px;}
ul.socialFollow li.googlePlusOne a:hover	{ background-position: -140px -20px;}
ul.socialFollow li.instagram a:hover	{ background-position: -168px -20px;}
ul.socialFollow li.email a:hover	{ background-position: -196px -20px;}

.mainContentContainer {
    position: relative;
    margin-left: 210px;
    width: 770px;
    min-height: 100vh;
    height: auto;
    /* background-image: url('https://www.deenalevy.com/images/design/mainBG2.png');
    background-color: #080230; 
    background-repeat: repeat-y;
    background-color: none;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;*/
    border: 0px solid yellow;
}

@media (max-width: 1900px)	{
.mainContentContainer {min-height: 120vh;}
}

.mainContent {
    width: 764px;

    font-size: 1.3em;
}

.image	{
	margin-bottom: 10px;
}

.image.left	{
    height: 398px;
    width: auto;
    font-size: 1.3em;
    float: left;
}

.image.right {
	float: left;
    border: 0px dotted grey;
    z-index: 2;
}

.image.left img,
.image.right img	{
	height: 398px;
}

.articles {
	height: 398px;
    width: auto;
    clear: left;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.bottomQuote {
	width: 764px;
    border: 0px solid red;
    background-image: url('https://www.deenalevy.com/images/design/transp/purple80pc.png');
    margin-bottom: 20px;
    padding: 20px;
}

p {
	padding-right: 10px;
    padding-left: 10px;
    letter-spacing: .1em;
	line-height: 1.5em;
	
}
.bottomQuote p {
	font-size: 1em;
    width: 100%;
    max-width: 100%;
    color: #f7f556;
    font-style: italic;
    font-family: Georgia, serif;
    margin-bottom: 0px;
}

.mainContent .testimonials {
    overflow: hidden;
    width: 765px;
    height: 180px;
    background-image: url('https://www.deenalevy.com/images/design/mainBG2.png');
    background-repeat: repeat-y;
    background-color: none;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding-top: 15px;
    padding-left: 30px
}

.testimonials .image.left {
    float: left;
    margin-right: 20px;
    height: 120px;
    }
    
.testimonials .image.left img {
	height: 120px;
	width: auto;
}

.mainContent .testimonials .testimonial p {
    margin-top: 0px;
    padding-top: 0px;
    font-size: 14px;
    font-style: italic;
    margin-left: 0px;
    margin-bottom: 0px;
    width: 670px;
    line-height: 20px;
}

.mainContent .testimonials .author {
    font-size: 15px;
    margin-left: 0px;
    padding-left: 10px;
    opacity: 0.9;
    margin-top: 8px;
    width: 680px;
}

.footer	{
	text-align: center;

}

.footer .email {
		font-size: 1.3rem;
}

div.contactInfo	{
	padding-top: 50px;
	margin-bottom: 50px;
}
