﻿

/*  These styles are the defaults for both the dwt templates and the editable content  */

ul           {list-style-image: url('images/dltkbullet1.gif'); margin-top:20px; padding-bottom:10px }
ul.materialsList li { padding-bottom:5px }
ul ul        { list-style-image: url('images/dltkbullet2.gif'); margin-top:20px; }
ul ul ul     { list-style-image: url('images/dltkbullet3.gif'); }
li			 { list-style-position: outside; padding-bottom:20px }
a:link       { color: rgb(0, 0, 255); }
a:active     { color: rgb(0, 153, 0); }
a:visited    { color: rgb(0, 153, 0); }
a:hover 	 { color: rgb(70, 130, 180); }
body         { background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); font-size: large; font-family: Helvetica, Arial, sans-serif; line-height:150%; }
h1           { color: rgb(0, 0, 128); font-size: xx-large; font-weight: normal; font-style: normal; font-family: Georgia, "Times New Roman", Times, serif; line-height:140% }
h2           { color: rgb(0, 0, 128); font-size: x-large; font-weight: normal; font-style: normal; line-height:120% }
h3           { color: rgb(255, 0, 0); font-size: large; font-weight: normal; font-style: normal }
h4           { color: rgb(0, 128, 128); font-weight: normal; font-size: medium; font-style: normal; }
h5           { color: rgb(0, 153, 153); font-size: small; font-style: normal; font-weight: normal; }
h6           { color: rgb(0, 153, 153); font-size: x-small; font-style: normal; font-weight: normal }
table        { line-height:110%; border:0; padding:3px; width:100% }
td  	     { min-width:200px }

/*  These styles are for the dwt templates  */
/*  Remember . indicates a CLASS which can be used multiple times on a page while # indicates an ID which should only be used once per page  */

div#container { width:100%; margin:5px auto; }

div#largeContent { float:left; width:77%; padding:0 1% 0 1%; }
div#content { float:left; width:68%; padding:0 1% 0 1%; }
article#contentABC { float:left; width:68%; padding:0 1% 0 1%; }

nav#pageTemplateTop { background-color:#FFFFFF; width:100%; margin:0 auto; line-height:100% }
div#advertisingBanner { background-color:#9191ff; width:100%; text-align:center; padding-top:10px; padding-bottom:10px }

div#siteNavWrapper { width:100% }
div.siteNav { float:left; width:11%; background-color: #E9E9EC; font-size:small; text-align:center; overflow:hidden; padding:10px 0 10px 0}
div.twentyNav { float:left; width:19%; background-color: #E0E0E0; border: 1px solid gray; font-size:small; font-weight:bold; text-align:center; overflow:hidden; padding:5px 0 5px 0}

nav#homeButton { float:left; width:200px; text-align:left; padding-right:3%; padding-top:0px }
nav#socialMedia { float:right; height:36px; width:275px; text-align:right; overflow:hidden; padding:10px 0 10px 0 }
div#search 	    { float:left; width:300px;  margin:0; padding-top: 15px; }

#leftSideBarABC { float:left; width:10%; overflow:hidden; text-align:left; margin:0 auto; }
nav#leftSideBar { float:left; width:9%; overflow:hidden; text-align:left; margin:auto; line-height:100%; }
nav#rightSideBar { float:right; width:20%; overflow:hidden; text-align:right; margin:auto; line-height:100%; }

footer#pageTemplateBottom { background-color:#FFFFFF; width:100%; margin:0 auto; padding-left:20px}

div.topLeft { float:left; width:20%; height:100px; text-align:left; overflow:hidden }
div.topAd { float:left; width:59%; height:100px; text-align:center }
div.topRight { float:left; width:20%; height:100px; text-align:right; overflow:hidden }
div.topLinks { float:left; width:20%; background-color:#E9E9EC; text-align:center; overflow:hidden; padding:10px 0 10px 0 }
div.bottomLinks { float: left; width: 19%; background-color: #E0E0E0; border: 1px solid gray; font-size: small; font-weight: bold; text-align: center; overflow: hidden; padding: 5px 0 5px 0 }
div.halfLeft { text-align:left; float:left; width:49% }
div.halfRight { text-align:right; float:right; width:49% }
nav.footerLinks { float: left; width: 24%; background-color: #dddddd; border:1px thin solid black; padding:5px 0 5px 0; font-size: small; font-weight: bold; text-align: center; overflow: hidden; margin: 2px  }

/*  Styles for new branding in January 2021  */
nav#DLTKtopborder { width:100%; line-height:100%; }
div#DLTKadBanner { width:100%; text-align:center; min-height: 90px; }
div#DLTKbranding { width:100%; margin: auto; background-color: #E9E9EC; text-align:center; }
div#DLTKsitenav { clear:both; background-color: #E9E9EC; padding:0; margin:0; overflow:hidden;}
div.DLTKsitenavButtons { float:left; width:125px; text-align:center; overflow:hidden; padding-top:20px; font-family: Helvetica, Arial, sans-serif; font-size: large; }
div#DLTKsitenavSearch { float:left; width:300px;padding-top:10px; text-align:left }
div#DLTKsitenavSocial { float:right; max-width:325px; text-align:center; overflow:hidden; }
div#TEACHsiteNav { width:100%; background-color: #E9E9EC; text-align:center; overflow:hidden; }
div.TEACHsiteNavlinks { float:left; width:14%; background-color: #E9E9EC; font-size:small; text-align:center; overflow:hidden; padding:10px 0 10px 0}
#rightSideBarLinks { font-size: small; font-weight:normal; line-height: 200%; text-align:center; }
p.rightSideBarLinks { font-size: small; font-weight:normal; line-height: 150%; text-align:center; }
hr.rightSideBarLine { margin: 5px 0px 5px 0px; clear: both; }

/*  These styles are for the editable content  */
/*  Remember . indicates a CLASS which can be used multiple times on a page while # indicates an ID which should only be used once per page  */

.pageTitleShrink { font-size: medium; font-family: Helvetica, Arial, sans-serif }

.printVersionLink { background-color: #eeddff; }

header#mainHeader { margin-bottom:10px }
h3#materials   { padding-top: 20px }
ul.materialsList  { padding-bottom:20px }
ul.materialsList li { padding-bottom:5px }
#author { font-size: small; font-style:italic }

.indentLarge   { margin-left: 80px }
.indentSmall   { margin-left: 40px }

.indexHighlight { background-color: #DDDDDD; font-size: medium; font-weight: bold; line-height:110%; }

.indexImage { float:left; text-align:center; margin: 0 20px 0 20px; min-width:150px; max-width:250px; min-height:60px }
.indexText  { float:left; margin:0; min-width:150px; max-width: 650px; min-height:60px }

.textLarge  { font-size: large; }
.textMedium { font-size: medium; }
.textSmall  { font-size: small; }
.textStory { font-size:150%; line-height:150%; padding-bottom: 25px }

.floatStop { clear:both; margin: 0; }
.floatRight { float: right; margin: 10px 0 40px 20px; vertical-align: text-top; text-align:center; }
.floatLeft { float: left; margin: 0 20px 5px 0; vertical-align: text-top; text-align:center; }

nav.topNav { padding: 15px 0 15px 0; margin: 0; font-size: small; width: 100%; background-color: #F0F2F5; line-height:100%; }

div.columnsTwo { float: left; padding: 20px; margin: 0 20px 10px 0; width: 40%; border: 1px solid gray }

div.greyFloatRight { float: right; margin: 10px 0 40px 20px; vertical-align: text-top; text-align:center; background-color:#E0E0E0; border: 1px solid gray }

div.columns150px { float: left; padding: 10px; width: 150px; font-size:large; border: 1px solid gray; text-align:center; }
div.columns150pxNoBorder { float: left; padding: 10px; width: 150px; font-size:large; border: 0px; text-align:center; }

div.columnsTwo { float: left; padding: 20px; margin: 0 20px 10px 0; width: 40%; border: 1px solid gray; }
div.columnsTwoNoBorder { float: left; padding: 10px; margin: 0 20px 10px 0; width: 40%; text-align:center }
div.columnsThree { float: left; padding: 10px; margin: 0 5px 5px 0; width: 30%; text-align:center }
div.columnsFour { float: left; text-align:center; padding:5px; margin:10px; width: 200px; min-height:260px; font-size: medium; border: 1px solid navy }

div.audioBox { float: left; text-align: center; padding: 5px; background-color: #ddeeff; width: 400px; }

/* CSS for Features Javascript implementation */
div#FeaturesInsert { width:100%; margin: auto; }
div#featuresColA { min-height:225px; float: left; padding: 2%; margin: 0 2% 1% 0; width: 43%; border: 1px solid gray; }
div#featuresColB { min-height:225px; float: right; padding: 2%; margin: 0 2% 1% 0; width: 43%; border: 1px solid gray; }
img#featuresImgA { float: left; margin: 0 20px 20px 0; vertical-align: middle; }
img#featuresImgB { float: right; margin: 0 0 20px 20px; vertical-align: middle; }

/*  These styles prevent the navigation and advertising from printing  */

@media print {
	.no-print {display:none}
	nav.topNav {display:none}
	body { font-size: 12pt; }
	#leftSideBarABC {display:none}
	#leftSideBar {display:none}
	#rightSideBar {display:none}
		#amp_floatingAdDiv{ display: none !important;}
	nav.pageTemplateTop {display:none}
	footer {display:none}
	.textStory { font-size:12pt; line-height:100% }
}
