/*Styles for Social Media Best Practices for Law Schools website. As opposed to the style sheet for the brochure of the same name??*/
* {
	padding: 0px;
	margin: 0px;
	border: 0px;
}

body {
	background-color: #eefaf0;
	height: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
}

p {
	margin-bottom: 1.25em;
}

#wrapper {
	width: 75%;
	background-color: #ffffff;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	padding: 30px;
	min-height: 500px;
	height: 100%;
	border: 1px solid #ffe100;
}

/*banner styling is here! Let's make it all text, baby. */
#banner {
	font:Arial, Helvetica, sans-serif;
	margin-top: -1.5em;
	
}

#banner h1{
	color: #81cfff;
	font-weight: bold;
	line-height: 2em;
	border-bottom: #ffe100 4px solid;
	font-size: 300%;
	font-style:oblique;
}

#banner h1 a, #banner h1 a:hover, #banner h1 a:active {
	color: #81cfff;
	text-decoration: none;
}

#banner h2{
	width: 500px;
	color: #4edfbb;
	float: right;
	margin-top: -1.25em;
	font-size: 200%;
	position: relative;
	z-index: 1;
}

#banner h2 a, #banner h2 a:hover, #banner h2 a:active {
	color: #4edfbb;
	text-decoration: none;
}

#banner-menu {
	background: #81cfff;
	padding: .25em 0em .4em 0em;
	border-bottom: 1px solid #999999;
}

#banner-menu a {
	color: #ffffff;
	text-decoration: none;
	padding: .25em 1em .4em 1em;
	border-right: 1px solid #ffffff;
}

#banner-menu a:hover {
	color: #ffe100;
}

#banner-menu a:active {
	color: #4edfbb;
}

#banner-menu #self a, #banner-menu #self a:hover  {
	background-color: #79bbe3;
	color: #ffffff;
}

#banner-menu #self-intro a, #banner-menu #self-intro a:hover  {
	background-color: #79bbe3;
	color: #ffffff;
	margin-left: .25em;
}

#banner-menu ul li {
	display: inline;
	padding: 0em;
	border: 0em;
	margin-left: -.25em;
}

#banner-shadow {
	height: 10px;
	background: url(images/under-banner-shadow.jpg);
	background-repeat: repeat-x;
}
	


#intro {
	margin-left: -3em;
}


#intro h2 a {
	color: #81cfff;
	font-size: 85%;
	text-decoration:none;
}

#intro h2 a:hover {
	color: #ffe100;
}

#intro h2 a:active {
	color: #4edfbb;
}

#submenu ul {
	list-style:none;
	list-style-position: outside;
}

#submenu li {
	display: inline;
	padding: 0 1em 0;
	border-left: 1px solid #CCCCCC;
	
}

.back-to-top {
	text-align: center;
	font-size: 85%;
	text-transform:uppercase;
}
	

#main {
	clear:both;
	margin-top: 30px;
	margin-left:40px;
	width: 100%;
}

#main .portal {
	width: 28%;
	float:left;
	padding: 15px;
}

#main .portal .button {
	margin-left: auto;
	margin-right: auto;
}

#main .portal .button-left {
	float: left;
	background: #81cfff url(images/left-blue-button.gif) no-repeat top left;
	width: 19px;
	height: 57px;
	
}

#main .portal .button-word {
	float: left;
	color: #ffffff;
	font-size: 180%;
	font-weight: bold;
	text-align: center;
	background: #81cfff;
	padding-top: 15px;
	height: 37px;
	width: 6em;
	border-bottom: #ffe100 5px solid;
	padding-left: 20px;
	padding-right: 20px;
	margin: 0px;
}

#main .portal .button-word a {
	display: block;
	text-decoration:none;
	color: #ffffff;
}

#main .portal .button-word a:hover {
	color: #ffe100;
}

#main .portal .button-word a:active {
	color: #ffffff;
}

#main .portal .button-right {
	float: left;
	width: 23px;
	height: 57px;
	background: #81cfff url(images/right-blue-button.gif);
}

#main .portal .clear {
	clear: both;
	height: 30px;
}

#main .portal .text {
	width: 80%;
	margin-left: 10%;
}

#main .portal .learn-more {
	background: url(images/blue-arrow.png) no-repeat right;
	float: right;
	width: 70%;
	color: #81cfff;
	font-weight: bold;
	height: 39px;
	line-height: 39px;
	vertical-align: text-top;
	margin-top: 20px;
	margin-right: 10px;
}

#main .portal .learn-more a {
	display: block;
	text-decoration: none;
	color: #81cfff;
}

#main .portal .learn-more a:hover {
	background: url(images/yellow-arrow.png) no-repeat right;
	color: #ffe100;
}

#main .portal .learn-more a:active {
	background: url(images/green-arrow.png) no-repeat right;
	color: #4edfbb;
}

#main #text p {
	margin-left: 2%;
	margin-right: 8%;
	margin-bottom: 1em;
}

#conclusion {
	float: right;
	margin-top: -2em;
	margin-right: 3em;
}

#conclusion h2 a {
	color: #4edfbb;
	font-size: 85%;
	text-decoration: none;
}

#conclusion h2 a:hover {
	color: #ffe100;
}

#conclusion h2 a:active {
	color: #81cfff;
}

#content {
	width: 100%;
}

.bold {
	font-weight: bold;
}

#right-col {
	margin-top: 20px;
	margin-left: 20px;
	width: 410px;
	padding-top: 10px;
	padding-bottom: 10px;
	float: right;
	overflow: hidden;
}

#right-col #shadow {
	margin-top: -3px
}

#left-col {
	padding: 10px;
}

#left-col h2 {
	color: #81cfff;
	font-size: 210%;
	margin-top: .25em;
}

#left-col h3 {
	color: #4edfbb;
	margin-top: 1em;
	font-size: 160%;
	font-style: oblique;
}

#left-col h4	{
	color: #4edfbb;
	margin-top: 1em;
	font-size: 130%;
	font-style: oblique;
}

#left-col a {
	color: #53a6d9;
	text-decoration: none;
}

#left-col a:hover {
	color: #4edfbb;
}

#left-col ol {
	list-style: inside;
	list-style-type: decimal;
	margin-left: 1em;
	margin-bottom: 1em;
}

#left-col ol li {
	margin-bottom: .5em;
}

#left-col ul {
	list-style: outside;
	list-style-image: url(images/blue-bullet.gif);
	margin-left: 3em;
	margin-bottom: .25em;
}

#left-col ul li {
	margin-bottom: .5em;
}

#left-col blockquote {
	background: #eefaf0 url(images/blockquote.gif) no-repeat top left;
	width: 50%;
	border-left: 1px solid #ffe100;
	border-right: 1px solid #ffe100;
	margin: 5px 5px 10px 0px;
	padding: 10px;
	font-size: 90%;
	font-style:oblique;
	text-indent: 1em;
}

#left-col blockquote a {
	display: block;
	margin-top: 5px;
	text-align:right;
	font-style: normal;
}

.references li a {
	margin-left: 2em;
}

#endnotes {
	font-size: 85%;
}

.superscript {
	font-size: 75%;
	vertical-align:text-top;
}
	

#clear-after-text {
	clear: both;
}

/*HERE IS THE FOOTER which is the SAME ON EVERY PAGE*/
#wrapper #clear-bottom {
	clear: both;
	height: 5px;
	width: 960px;
	
}

#footer {
	clear:both;
	width:800px;
	margin-left: auto;
	margin-right: auto;
	color:#81cfff;
	position: bottom;
	text-align:center;
	font-size: 80%;
	padding-top: 5px;
	margin-bottom: 5px;
}

#footer ul#footer-list li{
	display:inline;
	padding-left: 1em;
	padding-right: 1em;
}	

#footer a {
	color: #81cfff;
	text-decoration: none;
}

#footer a:hover {
	color: #ffe100;
}

#footer #disclaimer {
	text-align: center;
	color: #800000;
}
/*End of the footer */