/* main.css
// 
// CSS du site Popenglish en création 
//
*/

/* -- styles globaux -- */
* {
	margin: 0;
	padding: 0;
}

body {
    /*margin: 0;
    padding: 0;*/
/*    background-image: url(../images/bodyfond0.jpg);
    background-repeat: repeat-x;
    background-color: #B0DFF1;*/
	background:url(../images/bg-body.png) repeat-x top center #E8F7F9;	
	color:#222222;	
    font-family: Arial,Helvetica,sans-serif;
    font-size: 10pt;
    line-height: 1.5em;
}

p {
    margin-top: 3px;
	margin-bottom: 3px; 
}

a:link {
    color: #0033cc;
    text-decoration: underline;
}

a:visited {
    color: #0B98C8;
	text-decoration:none;
}

a:hover {
    color: #38add6;
    text-decoration: none;
}

/* -- sections du document -- */

#conteneur {
    width: 950px;
    margin-left: auto;
    margin-right: auto;
    background-color: #ffffff;
}


/* -- Heders -- */

#header {
    width: 900px;
    height: 150px;
    background-color: /*#B0DFF1*/ #FD1877;
    /*background-image: url(../images/ban02.png);
    background-repeat: no-repeat;*/

/*
sur l'img :

    width: 900px;
    height: 81px;
*/
}

#header h1{
	font-family:"Arial Black", Gadget, sans-serif;
	margin: 0;
	font-size: 35px;
	padding-top: 10px;
	color:#3162A6;
}

/*.welcome {*/
#welcome h1{
	color: #C1FF64;
	font-family: verdana, tahoma, helvetica, arial, sans-serif;

}

#header p{
	padding-top: 6px;	
	color:#3162A6;
}
/*
#contenu-conteneur {
}
*/
#contenu {
    padding: 10px;
    width: 660px;
    background-color: #ffffff;
    float: right;
}

#fpage {
margin-top: -18px;
width: 100%;
}

#gauche {
    width: 173px;
    padding-top: 10px;
    padding-left: 20px;
    float: left;
}

.logo_home {
    width: 125px;
    height: 111px;
}

.logo_pop_fr {
    width: 125px;
    height: 102px;
}


.logo_pop_es {
    width: 125px;
    height: 106px;
}

.histo1 {
    width: 150px;
    height: 413px;
	vertical-align:middle;
}




.methode1 {
    width: 150px;
    height: 210px;
	vertical-align:middle;
}

.histo2 { /* 2 photos à gauche */
	float:right;
	margin-left: 5px;
	margin-bottom: 15px;	
}	

.histo_droite { /* 2 photos à gauche */
	float:left;
	margin-right: 5px;
	margin-bottom: 15px;	
}

/*  ---  Body à droite -- */

/* cadre 1 */

#cadre1 {
	border: 1px solid #4278E6;
	padding: 0px;
}

#cadre2 {
	border: 1px solid #69AD09;
	padding: 0px;
}

#cadre3 {
	border: 1px solid #B51E0D;
	padding: 0px;
}

#cadre4 {
	border: 1px solid #6A09AD;
	padding: 0px;
}

#cadre5 {
	border: 1px solid #AD095B;
	padding: 0px;
}


#cadre6 {
	border: 1px solid #0977AD;
	padding: 0px;
}


#cadre7 {
	border: 1px solid #0977AD;
	padding: 0px;
}




ul {
	margin-left: 20px;
	padding-left: 0;
	list-style: square;
}



/*  ---  / Body à droite -- */

#footer {
    background-image: url(../images/animaux_94.png); 
	background-repeat: no-repeat;
    background-color: /*#ffffff*/ #9BF722;
    height: 72px;
    clear: both;
    text-align: center;
    font-size: 0.85em;
    color: #555555;
    padding-top: 22px;
}
/********/
/* menu */
/********/


#menuTop {
	position:relative;
	background-image: url(../images/navbarre.jpg);
	background-repeat: repeat-x;
	padding-top: 18px;
	height: 55px;
	font-size: 9pt;
}

#menuTop ul, #menuTop li {
	margin: 0;
	padding: 0;
}

#menuTop ul {
	list-style-type: none;
}

@font-face {
font-family: menu_font;
src: url('../font/menu.eot');
src: local(menu_font), url('../font/menu.ttf') format('opentype');
}

#menuTop li {
	font-family: menu_font;
	font-size: 105%;
	display: block; /* permet de use des tailles spécifiques */
	background-color: #BAE8F7;
	/*width: 135px;*/
	height: 20px;
	margin: 0 3px 0 0;
	padding: 0;
}

.Sub1 {
	width: 135px;
	border-left: 2px solid #769DED;
}
.Sub2 {
	width: 266px;
	border-left: 2px solid #A3D42D;
}
.Sub3 {
	width: 81px;
	border-left: 2px solid #D48C02;
}
.Sub4{
	width: 95px;
	border-left: 2px solid #7D2FD6;
}
.Sub5 {
	width: 91px;
	border-left: 2px solid #D22B93;
}
.Sub6{
	width: 88px;
	border-left: 2px solid #89AAD6;
}
.Sub7{
	width: 107px;
	border-left: 2px solid #8F80C0;
}
.Sub8 {
	width: 47px;
	border-left: 2px solid #E4036B;
}


ul#menuSub1 	{ left: 0px; }
ul#menuSub2 	{ left: 140px }
ul#menuSub3	{ left: 411px }
ul#menuSub4 	{ left: 549px }
ul#menuSub5 	{ left: 649px }
ul#menuSub6 	{ left: 745px }
ul#menuSub7 	{ left: 838px }
ul#menuSub8 	{ left: 463px }

.petit {
	width: 91px;
}

#menuTop a {
	display: block; 
	margin: 0;
	padding: 0 3px;
	font-family: menu_font;
	font-size: 105%;
}

#menuTop a:link, #menuTop a:visited {
	font-family: menu_font;
	font-size: 105%;
    color: /*#6CACD6;*/ #0033CC;
    text-decoration: none;
    /* padding-right: 30px; */
}

#menuTop a:hover {
    color: #0B98C8;
	font-family: menu_font;
	font-size: 105%;
}

ul.menuHoriz li {
	float: left;
}

ul.menuVert {
	position: absolute;	
	top: 38px;
	visibility: hidden;
}



/* corps */

.corps {
}
/*
.corps .title1 {
	background: #3C74E6 url(../images/cadre11.gif) repeat-x;
	font-size: 1.2em;
	color: #FFFFFF;
}

.corps .title1 span {
	display: block;
	height: 15px;
	padding: 10px 0 10px 20px;
}
*/

.corps .title1 {
	display: block;
	height: 15px;
	padding: 10px 0 10px 20px;
	font-size: 1.2em;
	color: #FFFFFF;
	background: #769DED url(../images/cadre11.gif) repeat-x;
}

.corps .title2 {
	display: block;
	height: 15px;
	padding: 10px 0 10px 20px;
	font-size: 1.2em;
	color: #FFFFFF;
	background: #A3D42D url(../images/cadre21.gif) repeat-x;
}

.corps .title3 {
	display: block;
	height: 15px;
	padding: 10px 0 10px 20px;
	font-size: 1.2em;
	color: #FFFFFF;
	background: #D48C02 url(../images/cadre31.gif) repeat-x;
}

.corps .title4 {
	display: block;
	height: 15px;
	padding: 10px 0 10px 20px;
	font-size: 1.2em;
	color: #FFFFFF;
	background: #7D2FD6 url(../images/cadre41.gif) repeat-x;
}

.corps .title5 {
	display: block;
	height: 15px;
	padding: 10px 0 10px 20px;
	font-size: 1.2em;
	color: #FFFFFF;
	background: #D22B93 url(../images/cadre51.gif) repeat-x;
}

.corps .title6 {
	display: block;
	height: 15px;
	padding: 10px 0 10px 20px;
	font-size: 1.2em;
	color: #FFFFFF;
	background: #89AAD6 url(../images/cadre61.gif) repeat-x;
}

.corps .title7 {
	display: block;
	height: 15px;
	padding: 10px 0 10px 20px;
	font-size: 1.2em;
	color: #FFFFFF;
	background: #2FB4D6 url(../images/cadre71.gif) repeat-x;
}

.corps .texte {
	padding: 20px;
	border-top: 1px solid #FFFFFF;
	/*background: url(../images/cadre12.gif) repeat-x;*/
}

.corps .texte a {
    color: #0033cc;
    text-decoration: none;
}
<!-- 2 -->

