
/*

DEFAULT CSS 

*/


*  { margin: 0%; padding: 0%; }
H1, H2, H3, H4, H5, H6, TEXT, OPTION, SELECT, P, A, SPAN, TD, INPUT, LABEL, UL, LI, OL  { font-family: 'Lato', 'Helvetica', 'Arial', 'sans-serif'; }
HTML, BODY  { background-color: #000000; }
P  { margin: 0% 0% 3% 0%; }
INPUT[type="checkbox"]  { cursor: pointer; }
A  { color: #007b00; }
A:hover  { color: #00ab00; }
A:active  { color: #006b00; }
TABLE TR TD A.fa  { display: inline-block; width: 100%; }
TABLE TR TD A I  { width: 100%; text-align: center; }
TABLE TFOOT TR TD A  { padding: 0px 3px; font-size: 130%; }
TABLE TFOOT TR TD  { line-height: 110%; vertical-align: middle; }

.clear  { clear: both; }
.filter  { margin-left: 2%; }
.hidden  { display: none; }
.closeout  { position: absolute; top: 0%; right: 0%; cursor: pointer; }
.audiobtn  { cursor: pointer; }
.audiobtn:hover  { opacity: 0.8; }
.audiobtn:active  { opacity: 0.9; }
.dialogbox  { position: absolute; background-color: #cccccc; z-index: 6; opacity: 1; box-sizing: content-box; }
.dialogwhite  { width: 90%; margin: 1%; padding: 4% 4% 2% 4%; background-color: #ffffff; box-sizing: content-box; height: auto; }
.dialogwhite HR  { border: 1px solid #dddddd; height: 1px; margin-top: 2%; margin-bottom: 2%; }
.dialogwhite H2  { display: inline-block; padding-left: 3%; padding-top: 1%; margin: auto; clear: both; }
.dialoggray  { width: 90%; padding: 1% 5% 2% 5%; }
.graybottom  { width: 110%; background-color: #cccccc; padding: 3% 0%; margin: 3% 0% -3% -5%; }
.col  { width: 44%; padding: 4% 3% 0% 3%; display: inline-block; float: left; box-sizing: content-box; }
.col DIV  { margin-bottom: 1%; }
.col H3  { margin-top: 3%; margin-bottom: 1%; }
.col P  { line-height: 120%; margin-bottom: 4%; }
.col LABEL  { display: inline; }
.downloads  { padding-left: 20px; background-color: #eeeeee; padding-right: 20px; }
.downloadtile  { float: left; position: relative; cursor: pointer; }
.downloadtile:hover  { background-color: #f6f6f6; }
.downloadtile H4  { width: 90%; line-height: 120%; margin-bottom: 3%; font-size: 110%; display: none; }
.downloadtile P  { width: 90%; line-height: 120%; display: none; }
.downloadthumb  { height: auto; margin-left: 3%; margin-bottom: 2%; margin-top: 2%; background-size: auto 100%; background-repeat: no-repeat; background-position: center center; }
.downloadthumb:hover  { opacity: 0.9; }
.downloadclose  { position: absolute; top: 0%; right: 0%; display: none; cursor: pointer; z-index: 1; }
.downloaddrop  { position: absolute; top: 100%; left: 0%; width: 100%; background-color: #eeeeee; padding-top: 3%; padding-bottom: 5%; display: none; }
.downloaddrop HR  { border: 0px; height: 0px; border-top: 1px solid #dddddd; width: 90%; margin-left: 5%; }
.downloadbtns  { width: 100%; position: absolute; bottom: 0px; background-color: #dedede; padding-top: 5px; display: none; box-sizing: content-box; }
.downloadbtns IMG  { position: absolute; }
.downloadopen  { background-color: #eeeeee; }
.downloadopen:hover  { background-color: #eeeeee; }
.downloadopen .downloadclose  { display: inline; }
.downloadopen H4  { display: block; margin-left: 5%; }
.downloadopen P  { display: block; margin-left: 5%; }
.downloadopen .downloaddrop, .downloadopen .downloadbtns  { display: inline; }
.downloaded  { background-color: #009b00; }
.downloaded:hover  { background-color: #00bb00; }
.audiothumb, .videothumb  { color: #ffffff; width: 74%; height: 100px; padding: 0% 10%; margin: 2% 3%; font-size: 110%; text-align: center; display: table; background-color: #2f4856; box-sizing: content-box; }
.audiothumb SPAN, .videothumb H3  { display: table-cell; vertical-align: middle; }
.videothumb  { background-image: url("../images/video.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; }
.videothumb H3  { font-size: 110%; }
.dbtn  { opacity: 1; }
.dbtn:hover  { opacity: 0.8; }
.dbtn:active  { opacity: 0.9; }
.storyaudio, .storyvideo  { display: inline-block; margin-top: 5%; margin-left: 50%; cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); }
.storyvideo  { margin-bottom: 10px; margin-top: 25px; }
.download  { left: 55%; }
.audioplay, .videoplay  { right: 55%; }
.expando  { right: 55%; }
.fullwidth  { width: 100%; padding-left: 0%; padding-right: 0%; }
.menutxt  { font-weight: bold; font-size: 115%; }
.extension  { border: 2px solid #dddddd; float: right; }
.normalp  { margin: 0%; padding: 0%; }
.prompt  { padding: 0%; margin: 0% 0% 1% 0%; }
.center  { text-align: center; }
.dash  { border: 10px solid #ffffff; background-color: #eeeeee; padding-bottom: 1%; box-shadow: inset 0px 0px 20px #dddddd; }
.admin  { padding-bottom: 3%; }
.btn2  { margin-right: 2%; }
.thirty  { width: 30px; }
.hundred  { width: 100px; }
.onetwenty  { width: 120px; }
.sortimg  { width: 80px; height: auto; }
.panel-heading  { height: 75px; position: relative; }
.panel-heading H4  { display: inline-block; position: absolute; top: 50%; font-size: 100%; transform: translateY(-50%); left: 150px; padding-right: 5%; }
.panel-heading H4.subs  { left: 70px; }
.promptul  { padding-left: 20px; }
.current_page  { text-align: center; width: 30px; }
.num_per_page  { width: 60px; }
.event-group  { list-style: disc inside; padding-bottom: 2%; }
.event-group-item  { text-indent: 5px; height: 25px; padding: 10px 0px 25px 5px; }
.event-group-item A  { height: 25px; }
.event-group-item A I  { font-size: 140%; }
.emptyerror, .texterror  { color: #990000; }
.formaterror  { color: #cccccc; }
.bumpright  { margin-right: 2%; }
.mediabtn  { padding: 1% 0% 2% 0%; }
.currentmedia  { border: 5px solid #006600; }
.upload  { width: 48%; position: relative; margin: 5px 1% 15px 1%; float: left; background-color: #eeeeee; padding: 15px 5%; overflow: hidden; }
.upload P, .uploadAV P  { width: 100%; text-align: center; }
.uploadAV  { width: 31%; position: relative; margin: 5px 1% 15px 1%; float: left; background-color: #eeeeee; padding: 15px 2%; overflow: hidden; }
.uploadAV .btn-warning  { padding: 10px 10px; line-height: 120%; }
.dragdrop  { width: 100%; background-color: #e8e8e8; position: relative; margin-bottom: 10px; }
.dragdrop IMG  { width: auto; height: auto; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); max-height: 80%; max-width: 80%; }
.uploadsizer  { position: absolute; opacity: 0; }
.upload_size.error  { color: #990000; font-weight: bold; }
.uploadinfo  { background-color: #ffffff; padding: 10px 0px; margin: 10px 0px; }
.uploadinfo P  { padding: 1% 5%; margin: 0%; }
.uploading  { width: 100%; height: 100%; top: 0%; left: 0%; position: absolute; z-index: 1; background-color: #666666; }
.uploadclear  { width: 30px; height: 30px; padding: 0px; border-radius: 15px; position: absolute; right: 5px; top: 5px; font-weight: bold; }
.medialoader  { position: absolute; top: 35%; left: 50%; transform: translateX(-50%); width: 64px; height: 64px; }
.feedback  { color: #ffffff; font-size: 150%; position: absolute; top: 50%; transform: translateY(-50%); }
.browse P  { margin: 20px 0px; }
.existingimage  { margin: 10px 0px 15px 0px; }
.inputerror  { color: #990000; background-color: #efd2d2; }
.inputwarning  { background-color: #ffeecc; }
.existingaudio  { width: 100%; margin: 10px 0%; }
.existingvideo  { max-width: 100%; margin: 10px 0%; }
.choosemedia  { padding: 20px 0px 30px 0px; }
.pickthumb  { display: inline-block; position: relative; width: 18%; min-width: 140px; height: 145px; cursor: pointer; background-color: #f2f2f2; margin: 1%; overflow: hidden; }
.pickthumb:hover  { background-color: #ffffff; }
.pickthumb IMG  { width: 120px; height: 80px; position: absolute; opacity: 1; top: 10px; left: 50%; transform: translateX(-50%); }
.pickthumb:hover IMG  { opacity: 0.7; width: 126px; height: 84px; top: 8px; }
.pickthumb:active IMG  { opacity: 0.9; width: 120px; height: 80px; top: 10px; }
.pickthumb P  { position: absolute; top: 100px; width: 90%; left: 5%; text-align: center; font-size: 70%; line-height: 120%; }
.pickthumb H4  { text-align: center; position: absolute; left: 5%; width: 90%; font-size: 85%; line-height: 100%; top: 20px; }
.newmedia  { padding: 0%; margin: 0%; }
.hideinputs  { position: absolute; left: -100%; top: -100%; }
.reorderedit1  { position: absolute; top: 38px; left: 40px; transform: translateY(-50%); z-index: 1; }
.reorderedit2  { position: absolute; top: 38px; left: 120px; transform: translateY(-50%); z-index: 1; }
.panel  { position: relative; }
.seemore  { height: 22px; overflow: hidden; width: 100%; }
.seemorebtn  { color: #009900; font-weight: bold; cursor: pointer; }
.seemorebtn:hover  { color: #00aa00; }
.seemorebtn:active  { color: #006600; }
.seemorebtn .fa-caret-down  { color: #009900; }
.ck  { font-size: 16px; line-height: 23px; }
.smaller  { font-size: 80%; line-height: 140%; }
.match  { color: #ffffff; background-color: #666666; }
.result  { padding-top: 10px; padding-bottom: 5px; }
.resulttitle  { width: 100%; font-size: 110%; }
.resulttext  { overflow: hidden; width: 100%; height: 60%; color: #666666; position: relative; }
.resultellipsis  { position: absolute; top: 0%; right: 0%; z-index: 5; cursor: pointer; background-image: url("../images/ellipsis.svg"); background-size: auto 100%; background-position: center right; background-repeat: no-repeat; }
.resultclose  { position: absolute; top: 0%; right: 0%; z-index: 5; cursor: pointer; background-image: url("../images/closetext.svg"); background-size: auto 100%; background-position: center right; background-repeat: no-repeat; }
.opentext, .resulttext.opentext  { height: auto; }
.resultevent, .resultmedia  { background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; display: inline-block; position: absolute; top: 0%; left: 0%; }
.resultmedia IMG  { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); max-width: 80%; max-height: 80%; }
.isEvent, .isMedia  { position: relative; }
.audioevent  { background-image: url("../images/audioevent.svg"); }
.educationevent  { background-image: url("../images/educationevent.svg"); }
.governmentevent  { background-image: url("../images/governmentevent.svg"); }
.imageevent  { background-image: url("../images/imageevent.svg"); }
.linkevent  { background-image: url("../images/linkevent.svg"); }
.mapevent  { background-image: url("../images/mapevent.svg"); }
.personalprofileevent  { background-image: url("../images/personalprofileevent.svg"); }
.quoteevent  { background-image: url("../images/quoteevent.svg"); }
.sciencetechnologyevent  { background-image: url("../images/sciencetechnologyevent.svg"); }
.societyevent  { background-image: url("../images/societyevent.svg"); }
.statsevent  { background-image: url("../images/statsevent.svg"); }
.videoevent  { background-image: url("../images/videoevent.svg"); }
.imagemedia  { background-image: url("../images/imagemedia.svg"); }
.videomedia  { background-image: url("../images/videomedia.svg"); }
.audiomedia  { background-image: url("../images/audiomedia.svg"); }



#page.admin  { background-color: #ffffff; }
#mypage, #myindexpage  { width: 100%; background-color: #000000; background-repeat: repeat-y; background-size: 100% auto; }
#badurl  { width: 80%; font-size: 150%; padding-top: 10%; color: #ffffff; margin-left: 10%; text-align: center; }
#scrollbarwidth  { width: 100px; height: 100px; overflow: scroll; position: absolute; left: 0%; top: -200px; }
#navbar  { width: 100%; position: relative; z-index: 4; }
#navbar IMG  { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; }
#darkfade  { width: 100%; position: absolute; background-repeat: repeat-x; background-image: url("../images/darkfade.png"); background-size: auto 100%; }
#secondaryhidden  { position: absolute; top: 0%; left: 100%; opacity: 0; }
#filter, #download, #search  { color: #ffffff; font-size: 120%; cursor: pointer; position: absolute; top: 50%; display: block; }
#filter IMG, #download IMG, #search IMG  { width: 30px; height: 16px; margin-left: -35px; margin-top: 3px; }
#filter:hover, #download:hover, #search:hover  { color: #006b00; }
#filter:active, #download:active, #search:active  { color: #009b00; }
#sitetitle  { color: #ffffff; position: absolute; top: 38%; left: 3%; font-size: 180%; font-weight: bold; }
#coverdiv  { width: 100%; height: 100%; z-index: 5; position: fixed; top: 0px; background-color: #000000; opacity: 0.6; display: none; }
#imageready  { background-color: #006600; color: #ffffff; text-align: center; padding: 15px 0px; }
#picker  { position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 1; }
#thumbnails, .newmedia  { position: fixed; top: 10%; left: 50%; transform: translateX(-50%); height: 80%; overflow-y: scroll; background-color: #e8e8e8; }
#thumbnailslider  { width: 90%; height: auto; margin-left: 5%; background-color: #e8e8e8; }
#thumbheader  { width: 80%; margin-left: 10%; text-align: center; font-size: 150%; font-weight: bold; }
#eraheader  { width: 80%; margin-left: 10%; text-align: center; font-size: 120%; }
#closepicker  { position: fixed; left: 50%; transform: translateX(-50%); bottom: 91%; border: 8px solid #e8e8e8; margin-left: -4px; }
#imagePreview, #audioPreview, #videoPreview  { background-color: #efefef; position: relative; padding: 2% 3% 1% 3%; margin-bottom: 15px; }
#imagePreview IMG, #audioPreview IMG, #videoPreview IMG  { width: 240px; height: auto; }
#closeImagePreview, #closeAudioPreview, #closeVideoPreview  { position: absolute; right: 2%; top: 10px; }

#linktable  { width: 100%; }
#linktable TR TH  { vertical-align: bottom; padding: 3px 2%; border-bottom: 2px solid #aaaaaa; background-color: #ffffff; }
#linktable TR TD  { vertical-align: top; padding: 5px 2%; }
#linktable TR  { border-bottom: 1px solid #cccccc; }
#linktable TR TH:nth-child(1), #linktable TR TD:nth-child(1)  { width: 25%; }
#linktable TR TH:nth-child(2), #linktable TR TD:nth-child(2)  { width: 50%; }
#linktable TR TH:nth-child(3), #linktable TR TD:nth-child(3)  { width: 25%; }
#linktable TR TD  { line-height: 120%; }
#linktable TR.clickedon TD  { background-color: #d8d8d8; }
#linktable TR TD:nth-child(1) A  { display: inline-block; margin-right: 10px; }
#linktable TR TD:nth-child(3) A  { display: block; margin-bottom: 15px; }

#menunav  { width: 100%; position: relative; overflow: hidden; }
#menuheader  { width: 100%; height: auto; }
#greenbg  { position: absolute; width: 50%; background-color: #009900; top: 0%; right: 0%; }
#menutext  { position: absolute; z-index: 1; color: #ffffff; left: 28%; bottom: 55%; width: 66%; font-size: 150%; }
#menu  { margin-left: 28%; width: 62%; margin-bottom: 4%; }
#menu P  { color: #ffffff; }
#menu A  { background-color: #006600; text-decoration: none; border-radius: 50px; color: #ffffff; font-size: 125%; width: 100%; display: block; padding: 12px 35px; margin: 1.5% 0%; }
#menu A:hover  { background-color: #009900; text-decoration: none; }
#menu A:active  { background-color: #005500; text-decoration: none; }

#logbg  { padding: 3% 5%; width: 40%; background-color: #ffffff; position: relative; top: 15%; margin-left: 30%; background-image: url("../images/banner.svg"); background-repeat: no-repeat; background-position: top center; background-size: 100% 12%; }
#fnfb  { color: #006600; }
#fnfb.texterror  { color: #990000; }

#lessontitle  { position: absolute; left: 3%; display: table; }
#lessonnav  { position: absolute; left: 42%; width: 54%; }

#introtext  { color: #ffffff; display: table-cell; font-size: 140%; vertical-align: middle; }
#submitfilter  { background-color: #009b00; border: none; color: #ffffff; font-size: 120%; padding: 1% 0%; width: 40%; margin-left: 30%; cursor: pointer; }
#submitfilter:hover  { background-color: #00ab00; }
#submitfilter:active  { background-color: #007b00; }

#lessons, #sections  { width: 100%; cursor: pointer; text-align: center; color: #ffffff; border-spacing: 2px; border-collapse: separate; }
#lessons TR TD, #sections TR TD  { background-color: #006b00; }
#lessons TR TD:hover, #sections TR TD:hover  { background-color: #008b00; }
#lessons TR TD:active, #sections TR TD:active  { background-color: #004b00; }
#lessons TR TD A  { display: block; width: 100%; height: 100%; color: #ffffff; margin-bottom: 3px; font-weight: 700; font-size: 100%; line-height: 100%; }
#lessons TR TD A:hover  { color: #ffffee; text-decoration: none; }
#lessons TR TD A:active  { color: #ffffdd; }
#lessons TR TD.current, #sections TR TD.current  { background-color: #00ab00; }
#lessons TR TD.current:hover, #sections TR TD.current:hover  { background-color: #00cb00; }
#lessons TR TD.current:active, #sections TR TD.current:active  { background-color: #008b00; }

#storyscreen  { left: 3%; width: 55%; box-sizing: content-box; }
#filterscreen  { left: 47%; width: 50%; box-sizing: content-box; }
#searchscreen  { left: 32%; width: 65%; height: auto; box-sizing: content-box; }
#downloadscreen  { right: 3%; box-sizing: content-box; }
#downloadscreen H2  { padding: 0%; margin: 0%; font-size: 180%; }

#searchinput  { width: 80%; padding: 6px 15px 6px 40px; background-color: #eeeeee; border: 2px solid #cccccc; background-image: url("../images/searchbutton.svg");/* box-shadow: inset 0px 0px 8px #cccccc;*/	 background-position: center left; background-size: auto 100%; background-repeat: no-repeat; }
#searchresults  { width: 100%; height: auto; position: relative; margin-top: 15px; padding-top: 15px; padding-bottom: 25px; padding-right: 3%; overflow-y: scroll; }
#numresults  { background-color: #bb2821; color: #ffffff; padding: 5px 10px; margin-left: 5px; }
#searchscreen .dialogwhite  { padding-bottom: 5%; }
#searchprompt  { margin-bottom: 1%; }

#storyaudio  { width: 100%; margin-top: 70px; margin-bottom: 20px; }
#cover2  { position: fixed; width: 100%; height: 100%; background-color: #000000; z-index: 15; opacity: 0.9; top: 0px; left: 0px; }
#player  { position: fixed; z-index: 16; top: 0%; width: 100%; height: 100%; }
#playerdiv  { margin: 5%; padding: 60px 5% 6% 5%; background-color: #ffffff; position: relative; max-height: 80%; }
#playerinfo { position: relative; width: 100%; height: 100%; }
#playerinfo H2  { width: 100%; text-align: center; margin-bottom: 20px; }
#playerinfo IMG, #playerinfo VIDEO  { margin-left: 50%; transform: translateX(-50%);  }
#playerinfo AUDIO  { width: 100%; height: 50px; padding: 10px 0%; }
#closeplayer  { position: absolute; top: 0px; right: 0px; width: 60px; height: 60px; cursor: pointer; }
#closeplayer:hover  { opacity: 0.8; }
#closeplayer:active  { opacity: 0.9; }

FOOTER  { background-color: #000000; width: 100%; margin: 0 auto; }

FOOTER ul  { width: 90%; list-style: none; text-align: center; margin: 0 auto; }
FOOTER ul li  { display: inline-block; color:#ffffff; vertical-align: middle; padding: 30px 0; text-align: left; font-size: 17px; line-height: 22px; }
FOOTER ul li.firstcol  { width: 370px; padding-right: 10px; float: none; }
.firstcol_icon  { float: left; margin: 15px 10px 15px 0; }
.firstcol_icon img  { width: 70px; height: 52.5px; margin-top: 5px; }
.firstcol_txt  { float: left; width: 240px; margin: 20px 10px 5px 0; }
.firstcol_txt h7  { font-size: 24px; text-transform: uppercase; }
.firstcol_txt p  { line-height: 18px; margin: 0 5px 0 0; }

FOOTER ul li.secondcol  { border-left: 1px solid #888888; border-right: 1px solid #888888; width: 26%; text-align: center; }
FOOTER ul li.secondcol p  { margin: 20px 25px 25px 25px; }
FOOTER ul li.secondcol p img  { margin: 15px 0 5px 0; width: 80px; height: 60px; }

FOOTER ul li.thirdcol  { width: 37%; padding-left: 10px; }
FOOTER ul li.thirdcol p  { font-size: 12px; line-height: 22px; margin: 25px; }

FOOTER a  { color: #43dc43; text-decoration: none; }
FOOTER a:hover  { text-decoration: underline; }

@media screen and (max-width: 1200px) {
	FOOTER ul { width: 95%; text-align: left; }
	FOOTER ul li.firstcol  { width: 285px; }
	.firstcol_txt  { width: 180px; }
	FOOTER ul li.secondcol  {}
	FOOTER ul li.secondcol p  { margin: 20px 15px 25px 15px; }
	FOOTER ul li.thirdcol  { width: 36.6%; }
	FOOTER ul li.thirdcol p  { margin: 25px 5px; }
}

@media screen and (max-width: 900px) {
	FOOTER ul  { width: 90%; margin-left: 5%; text-align: center; padding: 10px 0px; }
	FOOTER ul li  { display: list-item; padding: 15px 0px; }
	FOOTER ul li.firstcol  { width: 100%; }
	.firstcol_icon  { float: none; text-align: center; margin: 0; }
	.firstcol_icon img  { text-align: center; margin-bottom: 7px; }
	.firstcol_txt  { float: none; text-align: center; margin: 0 0 15px 0; width: 100%; }
	.firstcol_txt p  { margin: 0; }
	FOOTER ul li.secondcol  { width: 100%; border-left: none; border-right: none; border-top: 1px solid #888888; border-bottom: 1px solid #888888; }
	FOOTER ul li.secondcol p  { margin: 0 10px 15px 10px; }
	FOOTER ul li.thirdcol  { width: 100%; }
	FOOTER ul li.thirdcol p  { margin: 5px; text-align: center; }
}

@media screen and (max-width: 400px) {
	FOOTER ul  { width: 86%; }
	.firstcol_icon IMG  { margin-bottom: 5px; }
}


@media only screen and (min-width: 1920px) {
	#mypage, #myindexpage  { width: 1900px; position: relative; }
	FOOTER  { width: 1700px; padding: 20px 100px; }
	#mypage, FOOTER, #minorevents  { margin-left: auto; margin-right: auto; } 
	#coverdiv  { width: 1900px; margin-left: auto; margin-right: auto; }
	#playerdiv  { max-width: 1400px; margin-left: auto; margin-right: auto; }
	#menuheader  { width: 1400px; }
	#menu  { width: 800px; }
	#greenbg  { height: 100px; }
	#downloadscreen H2, #downloadscreen H3  { margin-left: 10px; }
	#lessons TR TD A  { padding-top: 4px; }
	#thumbnails, .newmedia  { width: 1700px; }
	#navbar #greenswirl  { height: 50px; }
	.downloadtile  { width: 240px; margin: 5px 10px 15px 10px; }
	.downloadthumb  { width: 216px; height: 144px; }
}
@media only screen and (min-width: 1600px) {
	#downloadscreen  { width: 1500px; }
}
@media only screen and (min-width: 1450px) and (max-width: 1599px) {
	#downloadscreen  {  width: 1250px; }
}
@media only screen and (min-width: 1450px) {
	BODY  { font-size: 18px; line-height: 26px; }
	TABLE TR TD  { height: 24px; }
	#mypage  { background-image: url("../images/xlarge/bg.jpg"); }
	#myindexpage  { background-image: url("../images/xlarge/bg.jpg"); height: 730px; }
	#menu  { width: 750px; }
	#navbar  { height: 90px; }
	#darkfade  { top: 90px; height: 300px; }
	#lessontitle  { top: 115px; height: 60px; } 
	#lessonnav  { top: 95px; height: 60px; }
	#intro  { width: 60px; height: 60px; }
	#filter  { right: 290px; }
	#download  { right: 50px; }
	#search  { right: 435px; }
	#storyscreen  { top: 210px; }
	#filterscreen  { top: 90px; }
	#downloadscreen  { top: 90px; }
	#lessons, #sections  { margin-top: 15px; }
	#menuheader  { width: 1200px; }
	#greenbg  { height: 116px; }
	#downloadscreen H2, #downloadscreen H3  { margin-left: 15px; }
	#lessons TR TD A  { padding-top: 4px; }
	#thumbnails, .newmedia  { width: 1300px; }
	.downloadtile  { width: 204px; margin: 5px 10px 15px 10px; }
	.downloadthumb  { width: 192px; height: 128px; }
	.closeout  { width: 80px; height: 80px; }
	.audiobtn  { width: 70px; height: 70px; }
	.downloaddrop  { padding-bottom: 85px; }
	.downloadbtns  { height: 70px; padding-top: 8px; }
	.downloadclose, .dbtn  { width: 60px; height: 60px; }
	.extension  { width: 130px; }
	.dragdrop  { height: 200px; }
	.isEvent  { padding-left: 60px; }
	.isMedia  { padding-left: 80px; }
	.resulttext  { height: 28px; }
	.resultellipsis, .resultclose  { width: 78px; height: 26px; top: 1px; right: 0px; }
	.resultellipsis:hover, .resultclose:hover  { width: 82px; height: 28px; top: 0px; right: -1px; }
	.resultevent  { width: 46px; height: 46px; top: 15px; }
	.resultmedia  { width: 66px; height: 66px; top: 15px; }
}
@media only screen and (min-width: 1200px) and (max-width: 1449px){
	#downloadscreen  { width: 1114px; }
}
@media only screen and (min-width: 980px) and (max-width: 1199px){
	#downloadscreen  { width: 898px; }
}
@media only screen and (min-width: 980px) and (max-width: 1449px) {
	BODY  { font-size: 16px; line-height: 24px; }
	TABLE TR TD  { height: 20px; }
	#mypage  { background-image: url("../images/large/bg.jpg"); }
	#myindexpage  { background-image: url("../images/large/bg.jpg"); height: 700px; }
	#menu  { width: 600px; }
	#navbar  { height: 80px; }
	#darkfade  { top: 80px; height: 250px; }
	#lessontitle  { top: 95px; height: 56px; } 
	#lessonnav  { top: 85px; height: 56px; }
	#intro  { width: 56px; height: 56px; }
	#filter  { right: 250px; top: 55%; }
	#search  { right: 370px; top: 55%; }
	#download  { right: 40px; top: 55%; }
	#storyscreen  { top: 190px; }
	#filterscreen  { top: 80px; }
	#downloadscreen  { top: 80px; }
	#lessons, #sections  { margin-top: 10px; }
	#downloadscreen H2, #downloadscreen H3  { margin-left: 15px; }
	#lessons TR TD A  { padding-top: 3px; }
	#thumbnails, .newmedia  { width: 900px; }
	.closeout  { width: 70px; height: 70px; }
	.audiobtn  { width: 60px; height: 60px; }
	.downloaddrop  { padding-bottom: 70px; }
	.downloadbtns  { height: 55px; padding-top: 8px; }
	.downloadtile  { width: 180px; margin: 5px 10px 15px 10px; }
	.downloadthumb  { width: 168px; height: 112px; }
	.downloadclose, .dbtn  { width: 45px; height: 45px; }
	.extension  { width: 100px; }
	.dragdrop  { height: 200px; }
	.isEvent  { padding-left: 54px; }
	.isMedia  { padding-left: 74px; }
	.resulttext  { height: 25px; }
	.resultellipsis, .resultclose  { width: 66px; height: 22px; top: 1px; right: 0px; }
	.resultellipsis:hover, .resultclose:hover  { width: 70px; height: 24px; top: 0px; right: -1px; }
	.resultevent  { width: 40px; height: 40px; top: 15px; }
	.resultmedia  { width: 60px; height: 60px; top: 15px; }
}
@media only screen and (min-width: 840px) and (max-width: 979px){
	#downloadscreen  { width: 770px; }
}
@media only screen and (min-width: 650px) and (max-width: 839px){
	#downloadscreen  { width: 600px; }
}
@media only screen and (min-width: 650px) and (max-width: 979px) {
	BODY  { font-size: 14px; line-height: 21px; }
	TABLE TR TD  { height: 17px; }
	#navbar #greenswirl  { width: 100%;  }
	#logbg  { width: 70%; margin-left: 15%; padding: 5% 5%; }
	#mypage  { background-image: url("../images/medium/bg.jpg"); background-size: 980px auto; }
	#myindexpage  { background-image: url("../images/medium/bg.jpg"); height: 550px; }
	#menu  { max-width: 500px; }
	#navbar  { height: 75px; }
	#darkfade  { top: 75px; height: 340px; }
	#lessontitle  { top: 90px; height: 50px; left: 5%; } 
	#lessonnav  { top: 145px; width: 90%; left: 5%; height: 50px; }
	#intro  { width: 50px; height: 50px; }
	#title  { top: 35px; }
	#filter  { right: 195px; top: 45px; }
	#search  { right: 290px; top: 45px; }
	#download  { right: 25px; top: 45px; }
	#filter IMG, #download IMG, #search IMG  { margin-top: 0px; margin-left: -27px; }
	#storyscreen  { top: 160px; left: 5%; width: 70%; }
	#filterscreen, #searchscreen  { width: 70%; left: 27%; top: 75px; }
	#lessons, #sections  { margin-top: 8px; }
	#lessons TD, #sections TD  { height: 21px; }
	#menutext  { bottom: 52%; font-size: 130%; }
	#downloadscreen H2, #downloadscreen H3  { margin-left: 15px; }
	#lessons TR TD A  { padding-top: 3px; }
	#thumbnails, .newmedia  { width: 600px; }
	#sitetitle  { top: 20px; }
	#searchinput  { padding: 5px 10px 5px 34px; }
	#searchresults  { padding-top: 0px; }
	#searchscreen  { left: 22%; width: 75%; }
	.pickthumb  { width: 31%; }
	.closeout  { width: 60px; height: 60px; }
	.audiobtn  { width: 50px; height: 50px; }
	.downloaddrop  { padding-bottom: 60px; }
	.downloadbtns  { height: 45px; padding-top: 8px; }
	.downloadtile  { width: 152px; margin: 5px 10px 15px 10px; }
	.downloadthumb  { width: 144px; height: 96px; }
	.downloadclose, .dbtn  { width: 35px; height: 35px; }
	.extension  { width: 80px; }
	.dragdrop  { height: 160px; }
	.result  { padding-top: 7px; padding-bottom: 4px; }
	.isEvent, .isMedia  { padding-left: 46px; }
	.resulttext  { height: 22px; }
	.resultellipsis, .resultclose  { width: 60px; height: 20px; top: 1px; right: 0px; }
	.resultellipsis:hover, .resultclose:hover  { width: 64px; height: 22px; top: 0px; right: -1px; }
	.resultevent, .resultmedia  { width: 36px; height: 36px; top: 12px; }
}
@media only screen and (max-width: 649px) {
	BODY  { font-size: 14px; line-height: 21px; }
	TABLE TR TD  { height: 17px; }
	#sitetitle  { top: 17px; }
	#logbg  { width: 80%; margin-left: 10%; padding: 9% 5% 7% 5%; }
	#mypage  { background-image: url("../images/small/bg.jpg"); background-size: 650px auto; }
	#myindexpage  { background-image: url("../images/small/bg.jpg"); background-size: 650px auto; height: 650px; }
	#menu  { max-width: 500px; }
	#navbar  { height: 80px; }
	#darkfade  { top: 80px; height: 290px; }
	#lessontitle  { top: 95px; height: 40px; left: 5%; } 
	#lessonnav  { top: 145px; width: 90%; left: 5%; height: 45px; }
	#lessons, #sections  { height: 30px; margin-top: 10px; }
	#lessons TR TD A  { opacity: 0; }
	#intro  { width: 40px; height: 40px; display: table-cell; }
	#introtext  { padding-left: 10px; padding-right: 15px; }
	#title  { width: 90%; text-align: center; display: inline-block; left: 5%; top: 10px; }
	#filter  { top: 50px; right: 180px; }
	#search  { top: 50px; right: 270px; }
	#download  { top: 50px; right: 15px; }
	#filter IMG, #download IMG, #search IMG  { margin-top: 0px; margin-left: -27px; }
	#storyscreen  { top: 160px; left: 5%; width: 90%; }
	#filterscreen, #downloadscreen, #searchscreen  { top: 80px; }
	#filterscreen, #searchscreen  { width: 94%; left: 3%; }
	#downloadscreen  { width: 400px; }
	#submitfilter  { width: 160px; margin-left: 50%; transform: translateX(-50%) }
	#menuheader  { height: auto; width: 700px; }
	#menutext  { position: static; margin-left: 8%; margin-bottom: 4%; width: 86%; }
	#menu  { width: 80%; margin-left: 10%; }
	#downloadscreen H2, #downloadscreen H3  { margin-left: 15px; }
	#thumbnails, .newmedia  { width: 400px; }
	#searchinput  { padding: 4px 8px 4px 30px; width: 90%; }
	#searchresults  { padding-top: 0px; }
	#numresults  { display: block; margin-left: 0px; width: 110px; margin-top: 5px; text-align: center; }
	.pickthumb  { width: 48%; }
	.col:nth-child(1), .col:nth-child(2)  { padding-top: 10%; }
	.col DIV  { padding: 3% 0%; }
	.closeout  { width: 50px; height: 50px; }
	.audiobtn  { width: 40px; height: 40px; }
	.downloadtile  { width: 152px; margin: 5px 10px 15px 10px; }
	.downloadthumb  { width: 144px; height: 96px; }
	.downloadclose, .dbtn  { width: 35px; height: 35px; }
	.downloaddrop  { padding-top: 6px; padding-bottom: 60px; }
	.downloaddrop H4  { line-height: 120%; font-size: 100%; }
	.downloaddrop P  { display: none; }
	.downloadbtns  { height: 45px; padding-top: 8px; }
	.extension  { width: 60px; }
	.hundred  { width: 60px; }
	.onetwenty  { width: 70px; }
	.upload  { width: 98%; }
	.dragdrop  { height: 180px; }
	.result  { padding-top: 7px; padding-bottom: 4px; }
	.isEvent, .isMedia  { padding-left: 46px; }
	.resulttext  { height: 22px; }
	.resultellipsis, .resultclose  { width: 60px; height: 20px; top: 1px; right: 0px; }
	.resultellipsis:hover, .resultclose:hover  { width: 64px; height: 22px; top: 0px; right: -1px; }
	.resultevent, .resultmedia  { width: 36px; height: 36px; top: 12px; }
}
@media only screen and (max-width: 450px){
	#downloadscreen  { width: 270px; }
	#downloadscreen H2, #downloadscreen H3  { margin-left: 7px; }
	#thumbnails, .newmedia  { width: 345px; }
	.col:nth-child(1)  { padding-top: 10%; }
	.col:nth-child(2)  { padding-top: 1%; }
	.col  { width: 80%; margin-left: 10%; }
	.col DIV  { padding: 1% 0%; }
	.downloadtile  { width: 111px; margin: 4px 5px 8px 5px; }
	.downloadthumb  { width: 105px; height: 71px; }
	.hundred  { width: 50px; }
	.onetwenty  { width: 50px; }
}
@media only screen and (max-width: 370px){
	#myindexpage  { height: 700px; }
	#filter  { top: 50px; right: 125px; font-size: 16px; }
	#search  { top: 50px; right: 207px; font-size: 16px; }
	#download  { top: 50px; right: 15px; font-size: 16px; }
	#filter IMG, #download IMG, #search IMG  { margin-top: 5px; margin-left: -20px; width: 20px; height: 10px; }
	#deletemedia  { display: none; }
}





@media only screen and (min-height: 700px){
	#searchresults  { max-height: 500px; }
}
@media only screen and (max-height: 699px) and (min-height: 550px){
	#searchresults  { max-height: 350px; }
}
@media only screen and (max-height: 549px){
	#searchresults  { max-height: 200px; }
}