/* jaredkempton.com Main Site Stylesheet */

body { background-color: #444; margin:10px 10px 0px 10px; padding: 0px; text-align:center; }

.contentcontainer { width: 800px; margin-left: auto; margin-right: auto; text-align:left; position:relative; }

.firsttoptitlebar { width: 800px; height: 50px; padding: 0px 0px 0px 0px; background: #027dc0; text-align: center; vertical-align: middle; font-family: 'Monotype Corsiva','Rage Italic','Lucida Handwriting',cursive; font-size: 43px; font-weight: bold; color: white; z-index: 10; }

.secondtoptitlebar { width: 800px; height: 50px; padding: 0px 0px 0px 0px; background: #027dc0; text-align: right; vertical-align: middle; font-family: 'Curlz MT','Pristina','Lucida Calligraphy',cursive; font-size: 40px; font-weight: bold; color: white; z-index: 10; }

.thirdtoptitlebar { width: 275px; float:left; height: 50px; padding: 0px 0px 0px 0px; background: url(/images/pinkbarbg.jpg) repeat-x; text-align: right; vertical-align: middle; line-height: 50px; font-family: 'Lucida Calligraphy','Pristina',cursive; font-size: 12px; word-wrap: break-word; color: white; z-index: 10; }

.thirdtoptitlebarinner { width: 505px; margin-left: 275px; height:40px; padding: 5px 10px 5px 10px; _padding: 5px 5px 5px 5px; background: url(/images/pinkbarbg.jpg) repeat-x; text-align: right; vertical-align: middle; line-height: 18px; font-family: 'Lucida Calligraphy','Pristina',cursive; font-size: 12px; word-wrap: break-word; color: white; z-index: 10; }

.maincontent { width: 800px; height: auto; padding: 5px 0px 5px 0px; background: #dc588a; text-align: left; vertical-align: middle; font-family: 'Curlz MT','Pristina',cursive; font-size: 25px; color: white; z-index: 10; }

.leftcontent { width: 250px; height: auto; min-height: 250px; padding: 130px 5px 5px 5px; float: left; background: #dc588a; text-align: center; font-family: 'Lucida Handwriting',cursive; font-size: 15px; color: white; }

.leftcontent a:link { text-decoration: none; color: white; }

.leftcontent a:visited { text-decoration: none; color: white; }

.leftcontent a:active { text-decoration: none; color: white; }

.leftcontent a:hover { text-decoration: none; color: #027dc0; }

.pagecontent { width:500px; height: auto; min-height: 500px; margin-left: 275px; padding: 5px; background: #fff; font-family: 'Palatino Linotype','Palatino',Helvetica,sans-serif; font-size: 15px; color: black; }

.pagecontent h1 { text-align: center; color: #4c0724;}

.pagecontent h2 { text-align: center; }

.pagecontent h4 { text-align: right; text-size: 14px;}

.pagecontent p { font-size: 12px; }

.pagecontent a:link { text-decoration: none; color: #027dc0; }

.pagecontent a:visited { text-decoration: none; color: #027dc0; }

.pagecontent a:active { text-decoration: none; color: #027dc0; }

.pagecontent a:hover { text-decoration: none; color: #4c0724; }

.topimage { text-align: center; padding: 8px 0px 8px 0px; }

.footercontent { width:770px; margin-left: 15px; margin-right: 15px; margin-top: 25px; height: 50px; vertical-align: sub; letter-spacing: 0.2em; background: #4c0724; font-family: 'Lucida Handwriting',cursive; font-size: 13px; color: white; text-align: right; }

.footercontent a:link { text-decoration: none; color: white; }

.footercontent a:visited { text-decoration: none; color: white; }

.footercontent a:active { text-decoration: none; color: white; }

.footercontent a:hover { text-decoration: none; color: #027dc0; }

.designinfo { font-size: 11px; vertical-align: baseline; letter-spacing: normal;}

.mainimage { width: auto; height: auto; position: absolute; top: 65px; left: 20px; z-index: 100;}

/* Pure CSS menu written by Alan Roes
   contact: aroes@emrtc.nmt.edu
   copyright: 2008 use without permission prohibited
*/

.mainmenu {padding: 0 0 0 0; width: 800px; background: url(/images/menubuttonbg.jpg) repeat-x; margin: 0px; list-style: none; height: 50px; position: relative; z-index: 500; font-family: Helvetica,Geogia,cursive; text-align: center;}

/* Set up the regular buttons for the menu */
.mainmenu li.top {display: block; width: 110px; float: left; position: relative;color: white; font-size:18px;padding: 0px 0px 0px 0px;}
.mainmenu li.topwide {display: block; width: 170px; float: left; position: relative;color: white; font-size:18px; padding: 0px 0px 0px 0px;}
.mainmenu li.toplast {display: block; width: 102px; float: left; position: relative;color: white; font-size:18px; padding: 0px 0px 0px 0px;}
.mainmenu a.toplink {display: block; width: 110px; cursor: pointer; height: 50px; font-family: Helvetica,Geogia,cursive;text-decoration: none; font-size:18px; float: left; color: white; }
.mainmenu a.toplinkwide {display: block; width: 170px; cursor: pointer; height: 50px; font-family: Helvetica,Geogia,cursive;text-decoration: none; font-size:18px; float: left; color: white; }
.mainmenu a.toplinklast {display: block; width: 102px; cursor: pointer; height: 50px; font-family: Helvetica,Geogia,cursive;text-decoration: none; font-size:18px; float: left; color: white; }
.mainmenu a.toplink span, a.toplinkwide span, a.toplinklast span {display: block; background: url(/images/menubuttonbg.jpg) repeat-x; line-height: 50px;}

/* Rules for when the current top menu item is selected forthe page */
.mainmenu a.toplink span.selected, a.toplinkwide span.selected, a.toplinklast span.selected {display: block; background: #fff; line-height: 50px; color: black;}

.mainmenu a.toplink:visited {text-decoration: none; color: white;}
.mainmenu a.toplink:active {text-decoration: none; color: white;} 
.mainmenu a.toplinkwide:visited {text-decoration: none; color: white;}
.mainmenu a.toplinkwide:active {text-decoration: none; color: white;}
.mainmenu a.toplinklast:visited {text-decoration: none; color: white;}
.mainmenu a.toplinklast:active {text-decoration: none; color: white;}

/* Rules for when the mouse is hovered over a top menu item */
.mainmenu a.toplink:hover span{text-decoration: none; background: #fff; color: black; display: block; line-height: 46px; }
.mainmenu a.toplinkwide:hover span{text-decoration: none; background: #fff; color: black; display: block; line-height: 46px; }
.mainmenu a.toplinklast:hover span{text-decoration: none; background: #fff; color: black; display: block; line-height: 46px; }

/* Rules to keep background change while hovering over dropmenu */
 
.mainmenu li.top:hover > a.toplink { background: #fff;}
.mainmenu li.top:hover > a.toplink span {background: #fff; border-style:inset; padding: 0px; line-height: 46px; color: black;}
.mainmenu li.topwide:hover > a.toplinkwide { background: #fff;}
.mainmenu li.topwide:hover > a.toplinkwide span {background: #fff; border-style:inset; padding: 0px; line-height: 46px; color: black;}
.mainmenu li.toplast:hover > a.toplinklast { background: #fff;}
.mainmenu li.toplast:hover > a.toplinklast span {background: #fff; border-style:inset; padding: 0px; line-height: 46px; color: black;}

/* Rules to style the list or link hover. Depends on which browser is used */

.mainmenu a:hover {visibility:visible; }
.mainmenu li:hover {position:relative; z-index: 200;}

/* Rules to keep the drop down menu level invisible by placing it off screen. */
.mainmenu ul, 
.mainmenu :hover ul ul, 
.mainmenu :hover ul :hover ul ul,
.mainmenu :hover ul :hover ul :hover ul ul,
.mainmenu :hover ul :hover ul :hover ul :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

.mainmenu :hover ul.sub { left:2px; top:30px; background: #fff; padding:3px 0; border:1px solid #003366; white-space:nowrap; width:315px; height:auto; text-align: left; }
.mainmenu :hover ul.sub li {display:block; height:30px; position:relative; float:left; width:312px; }
.mainmenu :hover ul.sub li a {display:block; font-size:12px; height:30px; width:310px; line-height:30px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.mainmenu :hover ul.sub li a:hover { background:#027dc0; color: black; height:30px;}