/*
980px grid system ~ Core CSS.
4 columns ~ margin: 20px

Based on the golden grid system - http://code.google.com/p/the-golden-grid/
by Vladimir Carrer

Created by the Grid System Generator - v1.00
Learn more ~ http://www.gridsystemgenerator.com/
*/

/* =Containers
--------------------------------------------------------------------------------*/
#main
{	position: relative;
	margin-top: 40px;
	margin-left: 40px;
	margin-right: auto; padding: 20px 15px;
	width: 860px; min-height: 470px;
}

.filled {background: #f9f9f9;}


/* =Grid >> Global
--------------------------------------------------------------------------------*/
.g240, .g480, .g720, .g960 {
	display: inline;
	float: left;
	margin: 0 0px 0 0px;
}

/* =Grid >> 4 Columns
--------------------------------------------------------------------------------*/
.g240{width:200px;}
.g480{width:440px;}
.g720{width:640px;}
.g960{width:860px;}


.main-title {
	margin: 40px 0 0 0px; padding: 5px 0 0 0; border-top: 1px solid #EEEEEE;
	font-family: Corbel;
}

.title-concept {
width: 170px;
margin-left: 10px;font-family: Corbel;
}

.concept {
padding: 100px 0px 23px 0px;
display: block; height: 240px; /*border: 1px dotted #E0091D;*/
background: transparent url('../images/bg-cao-bis.png') no-repeat left 20px;
}

.concept p {
margin-left: 10px; font-size: 1.1em;
}

.title-crp {
margin: 5px 0 0 15px; float: left;
width: 60px; padding-left: 30px;
background: url('../images/Puce-CAOGRAFIA.png') top left no-repeat;font-family: Corbel;
}

.crp {
padding: 50px 10px 10px 10px;
display: block; height: 65px; /*border-top: 1px dotted #39B34D; border-right: 1px dotted #39B34D; border-bottom: 1px dotted #39B34D;*/
background: url('../images/bg-crp-bis.png') no-repeat top right;
}

.crp p { float: left; width: 320px;
margin: 0px 0 0 15px; font-size: 1.1em;
}


.title-reflex {
width: 140px; margin: 30px 0 0 20px; padding-left: 25px; height:20px;
background: url('../images/puce-reflex.png') top left no-repeat;font-family: Corbel;
}

.reflex {
padding: 10px 10px;
display: block; height: 200px; /*border-right: 1px dotted #D8061E;*/
background: url('../images/bg-reflex-bis.png') no-repeat top left;
}

.reflex p {
margin: 10px 0 0 20px; font-size: 1.1em; width: 155px;
}

.title-caograf {
width: 140px; margin: 20px 0 0 10px; padding-left: 25px; height:20px;
background: url('../images/puce-caograf.png') top left no-repeat;font-family: Corbel;
}

.caograf {
padding: 10px 10px;
display: block; height: 200px; /*border-right: 1px dotted #0D8CB8;*/
background: url('../images/bg-caograf-bis.png') no-repeat top left; 
}

.caograf p {
margin: 10px 0 0 10px; font-size: 1.1em; width: 160px;
}

.title-caodrive {
width: 140px; margin: 10px 0 0 10px; padding-left: 25px; height:20px;
background: url('../images/puce-caodrive.png') top left no-repeat;font-family: Corbel;
}

.caodrive {
padding: 10px 10px;
display: block; height: 200px;
background: url('../images/bg-caodrive-bis.png') no-repeat top left;  
}

.caodrive p {
margin: 10px 0 0 10px; font-size: 1.1em; width: 165px;
}

.title-caolive {
width: 65px; float: left; margin: 10px 0 0 15px;
padding-left: 30px;
background: url('../images/puce-caolive.png') top left no-repeat;font-family: Corbel;
}

.caolive {
padding: 25px 10px;
display: block; height: 40px; /*border-top: 1px dotted #82d620; border-right: 1px dotted #82d620;  border-bottom: 1px dotted #82d620; */
background: url('../images/bg-caolive-bis.png') no-repeat left -30px;
}

.caolive p {
float: left; width: 365px;
margin: 5px 0 0 30px; font-size: 1.1em;
}
/* =Grid >> 4 Columns - no left margin
--------------------------------------------------------------------------------*/
.ml240{margin-left:260px;}
.ml480{margin-left:500px;}
.ml720{margin-left:740px;}
.ml960{margin-left:980px;}

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content:' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

.filledbg {background-color: none; color: #000; padding: 10px 0px 10px 0; border-top:1px dotted #e10d1c;}


