/* Style sheet for Voix et diction Marie Guimont */
/* Entry page */
/* By Natmark-Concept inc. 2008 All rights reserved. */

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	color: #313131;
	background-color: #486787;
	margin: 0px;
	padding: 0px;
	background-image: url(../images/bkg-body.gif); background-repeat: repeat-x; }

#outerframe { width: 729px; margin: 0 auto; }
img.x { clear: both; position:relative; left:-6px; top:-20px; z-index: 0; }
html { height: 100.1%; overflow-y: scroll; } /* Hack to make the right-side scrollbar appear on all pages and avoid bumpy navigation */
img { border: 0px; }

/* Top horizontal menu */
#topmenu { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: .65em; font-weight: bold; padding: 0px 14px 0px 0px; margin-left: 8px; margin-top: 3px; margin-bottom: 3px; background-color: #ffffff; color: #313131; }
#topmenu ul, #topmenu li { margin: 0px; padding: 0px; list-style-type: none; display: inline; }
#topmenu a.topmenuoff:link, #topmenu a.topmenuoff:visited { background-color: transparent; color: #313131; text-decoration: none; padding: 2px 6px 2px 6px; margin-left: 10px; }
#topmenu a.topmenuoff:hover, a#topmenu .topmenuoff:active { background-color: #ED5E27; color: #ffffff; text-decoration: none; padding: 2px 6px 2px 6px; margin-left: 10px; }
/* Top menu : selected state */
#topmenu a.topmenuon:link, #topmenu a.topmenuon:visited, #topmenu a.topmenuon:hover, #topmenu a.topmenuon:active { background-color: #ED5E27; color: #ffffff; text-decoration: none; padding: 2px 6px 2px 6px; margin-left: 10px; }

#whiteframe {
	padding: 0px 10px 0px 10px;
	background-color: #ffffff;
    color: #313131;
    }

#innerframe {
	position:relative;
	text-align:left;
	width: 706px;
	padding: 0px;
    border: 1px solid #ED5E27;
	background-color: #ffffff;
    color: #313131;
    background-image: url(../images/photo-Marie-Guimont.jpg); background-repeat: no-repeat; background-position: top right;
    }

.clearfloat {
	clear: both;
	height: 0px;
	line-height: 0px;
	font-size: 0px;
}

/* Left section */
#left 				{ width: 180px; float: left; }
#left .content 		{ padding-top: 0px; padding-bottom: 20px; font-size: 0.75em; }
#left ul	{ padding: 0px; margin: 0px; }
#left li	{ list-style-type: none; background-image: url(../images/toplink-off.gif); background-repeat: no-repeat; background-position: top left; padding: 0px 0px 20px 16px; margin: 0px 0px 0px -6px; }
#left a:link, #left a:visited, #left a:hover, #left a:active { text-decoration: none; }
/* Left blue square */
#left .blue	{ background-color: #557A9F; color: #ffffff; width: auto; margin: -20px 36px 10px 10px; padding: 10px 6px 10px 6px; }
#left .prochaines { font-size: .65em; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif; }
#left .formations { font-size: .80em; font-weight: bold; padding-bottom: 8px; font-family: Verdana, Arial, Helvetica, sans-serif; }
#left .details { font-size: .70em; color: #D5DBE3; background-color: #557A9F; }
#left a.bluelink:link, #left a.bluelink:visited { color: #ffffff; background-color: #557A9F; text-decoration: underline; font-size: 1em; }
#left a.bluelink:hover, #left a.bluelink:active { color: #ffffff; background-color: #557A9F; text-decoration: overline; font-size: 1em; }

/* Middle section */
#center 			{ width: 524px; float: left; }
#center .content 	{ padding: 10px 220px 20px 0px; font-size: 0.7em; line-height: 1.65em; text-align: left; }
#center p 			{ margin-top: 0px; }
#center h1 			{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1.2em; color: #557A9F; background-color: transparent; font-weight: bold; }
#center h2 			{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1.6em; color: #557A9F; background-color: transparent; font-weight: bold; margin-bottom: 0px; }
#center a:link 		{ color: #ED5E27; background-color: transparent; text-decoration: underline;} 
#center a:visited 	{ color: #ED5E27; background-color: transparent; text-decoration: underline; }
#center a:hover 	{ color: #486787; background-color: transparent; text-decoration: overline; }
#center a:active 	{ color: #486787; background-color: transparent; text-decoration: underline; }
#center hr 			{ color: #486787; background-color: #486787; width: 100%; height: 1px; }

/* Promotional section */
#promo { border-top: 1px dashed #557A9F; border-bottom: 1px dashed #557A9F; margin-top: 20px; padding: 4px 0px 10px 20px; }
#promo p { font-size: 1em; line-height:normal; }
#promo h3 { font-size: 1em; color: #ED5E27; background-color: transparent; font-weight: bold; margin-bottom: 0px; margin-top: 0px; }
#promo .small { font-size: 0.9em; line-height: normal; } 

#copyright { color: #313131; padding: 6px; text-align: center; font-size: 0.6em; clear: both; background-color: #ffffff; }
#copyright a:link, #copyright a:visited { color: #313131; background-color: #ffffff; text-decoration: none; }
#copyright a:hover, #copyright a:active { color: #313131; background-color: #ffffff; text-decoration: underline; }

#footer { background-image: url(../images/bkg-ligne_bleue.gif); background-repeat: repeat-x; background-position: top; margin-top: 20px; }