/****THESE STYLES ARE SPECIFIC TO FRONT MATTER, REAR MATTER****PUT GENERAL STYLES IN FUNDAMENTAL.CSS****/

/***USED IN CONTENTS.HTML TO MAKE THE PAGE BODY SLIDE UNDER A TUTORZONE AREA AT TOP OF PAGE WHEN SCROLLING DOWN***/


#headley {
    z-index: 10;
    position: relative;/*z-index won't work if you take this out*/
}

#tutorzone {
    position:fixed;
/*     background: url(../images/unworlding.jpg) center top no-repeat fixed #DDCCBA; */
	background: url(../images/unworlding2.jpg) center top/auto 100% no-repeat fixed #111111;
    height:210px;
    width:770px;
    color: transparent;
    z-index: 2;
    margin-top: -825px; /*distance from top of page to top of main body text*/ 
}/*this container and the functionality it supports should not exist for smaller screens as soon as the main text body starts to resize so just make it a fixed size*/

#body-text {
    z-index: -2;
    padding: 10px 0;
    width: 100%;
    margin-bottom: 20px;
}

/***************************/

.main-body-margin {
    padding: 20px 0;
    background-color: #ffefd5;
    margin-bottom: 40px;
}

/******TITLE AREA********/
    
.titlearea002 {    
    margin: 0 0 20px 5px; /*no top margin allowed because it shifts the background pic down */
    color: #DDCCBA;
    max-width: 250px; 
    height: auto; 
    padding: .5%; 
    border: 2px solid #272731; 
    border-radius: 10px;
    background-color: rgb(5, 23, 91); /* Fallback for non-compliant browsers, use same color */
    background-color: rgba(5, 23, 91, 0.5);    
}

/***********************************BACKGROUNDS**************************************************/

/* .rundick {background: url(../images/unworlding.jpg) center top no-repeat fixed #DDCCBA;} */

.rundick {background: url(../images/unworlding2.jpg) center top/auto 100% no-repeat fixed #111111;}

#eyeamid {background: url(../images/eyeball-pyramid_background.jpg) center top repeat scroll #DDCCBA;}

#asphalt {background: url(../images/asphalt.jpg) center top no-repeat fixed #DDCCBA;}

h1 {font-size: 2em; text-align: center;}

/***********************FOR BOOKMARK MENU FIXED AT TOP LEFT OF GLOSSARY ONLY**************************/

.alphaletter {display: block; padding-bottom: 1.5em;}

.bookmarks-toggle-block {
    display: block;
    position: fixed; 
    top: 40px; 
    width: 100%; 
    z-index: 9999;
}

.bookmarks-toggle-none {display: none;}

.alfab2 {
    display: inline-block; 
    width: 30px; 
    height: 1.7em; 
    font-size: .7em; 
    padding: 0.0625em; 
    border: solid gray 0.0625em; 
    background-color: white; 
    box-sizing: border-box;  
    margin-left: auto; 
    margin-right: auto; 
    margin-bottom: 4px;
}

.toggler {
    position: fixed; 
    z-index: 9999; 
    background-color: #ffefd5; 
    border: solid 1px black; 
    padding-top: 1px; 
    width: 150px; 
    height: 20px; 
    text-align: center;
}

.button-parent {
    position: absolute; 
    text-align: center; 
    width: 150px; 
    background-color: #ffefd5;
}

.transparent-spacer {
    height: 20px; 
    background-color: transparent; 
    color: transparent;
}

/***FOR TRANSLUCENT WHITENESS OVER DARKISH BACKGROUNDS***/

.whitish {
    background-color: rgb(255, 255, 255); 
    background-color: rgba(255, 255, 255, 0.5);
}

/***FOR SCROLL DOWN BOOKMARK AT TOP OF CONTENTS***/

.disappear-smallscreen {text-align: center; margin-top: -20px;}