/* 
CanalVie tools for media=screen
author: AUI team (Chaines Tele Astral), 2012
=====================================================
All the tools should be wrap within a classname "cvTool".
A french readable id is also expected on that same high level container.
Example: <section class="tool" id="plan-mariage">
lightPink = #FFC6D4
lightPink2 = #F392A9
purple = #B33484
*/


/* Heading */
.webapp h3.legend,
.pregnancyCalendar .hTitle {
	margin-bottom: 3px;
	padding: .5em 1% 1.5em 1%;
	font-family: cvFontTitle1;
	font-weight: normal;
	background: #E2E2E3 url(../../img/canalvie/bg-mosaic-5x5-efefef.png) repeat left top; /*midGrey*/
    /*box-shadow: 0 2px 2px #CCC; H-offset, V-offset, Gradient-size, #Color */
}
.webapp h3.legend {
	font-size: 2em;
	padding-top: .3em;
	padding-bottom: .9em;
}
.rightColumn .webapp h3.legend {
	font-size: 1.8em;
	font-weight: normal;
	margin-top: .4em;
	margin-bottom: .2em;
	padding: 0;
	background: none;
}

/* Tables */
.webapp thead th,
.webapp thead td {
	background-color: transparent;
}
.webapp tbody th {
	font-family: cvFontTitle1;
	font-size: 1.3em;
	background: #E2E2E3 url(../../img/canalvie/bg-mosaic-5x5-efefef.png) repeat left top; /*midGrey*/
}
.webapp tbody tr:nth-child(odd) {
	background-color: #F5F5F5; /*lightGrey*/
}
.socialShareWidget tbody tr:nth-child(odd) {
	background-color: transparent; /*reset*/
}
.webapp tbody tr.checked {
	background: #EEE url(../../img/canalvie/bg-mosaic-5x5-efefef.png) repeat left top; /*greyBg2*/
}
.webapp tfoot {
	font-size: 1em;
	border-top: 1px solid #F5F5F5; /*lightGrey*/
}
.webapp tfoot th,
.webapp tfoot td {
	padding-top: 0;
	padding-bottom: 0;
	border-top-color: white;
}
.webapp tfoot td {
	padding-right: 0;
	text-align: right;
}
.webapp tbody td.hr-border,
.webapp tfoot td.hr-border {
	border-bottom-color: #F5F5F5; /*lightGrey*/
}

/* Forms */
.webapp fieldset {
	clear:both;
}
/* form buttons */
.webapp tfoot button {
	margin-bottom: 0;
}
.webapp tfoot td button,
.webapp tfoot td .btn {
	margin-right: 0;
	border: none;
	color: black;
	font-weight: normal;
	text-shadow: none;
	text-transform: inherit;
}
/* image buttons */
.webapp fieldset .imgButton label.imgButton,
.webapp a.imgButton {
	padding: 8px 0 8px 16px;
	background-image: url(../../img/canalvie/app/ico-planificateur-mariage.png); 
	background-position: left top;
	background-repeat: no-repeat;
	border: none;
}
.webapp fieldset .imgButton label.icoX24x24,
.webapp fieldset .imgButton label.icoCheck24x24 {
	padding: 8px 0 8px 24px;
	background-image: url(../../img/canalvie/app/icon-extra-space-sprite.png);
}
.webapp fieldset tbody .imgButton label.imgButton {
	min-width: 80%;
}
.webapp fieldset .imgButton .imgButton.icoX,
.webapp a.icoX 	    { 
	background-position: left -40px;
}
.webapp fieldset .imgButton .imgButton.icoCheck,
.webapp a.icoCheck {
	background-position: left -88px;
}
.webapp fieldset .imgButton .imgButton.icoX24x24 {
	background-position: left -256px; /* checkbox */
}
.webapp fieldset .imgButton .imgButton.icoCheck24x24 {
	background-position: left -22px; /* checkbox */
}
.webapp .descriptionColumn .left {
	float: left;
	width: 88%;
}
.webapp .descriptionColumn .right {
	float: right;
	width: 12%;
}

/* Icons */
.icoArticle,
.icoVideo {
	display: block;
	width: 17px;
	height: 17px;
	background-image: url(../../img/canalvie/app/ico-calendrier-grossesse.png);
	background-position: left -144px;
	background-repeat: no-repeat;
}
.icoVideo {
	background-position: left -192px;
}
.icoArticle {
	width: 11px;
	background-position: left -431px;
}
.webapp .icoCustomization {
	padding-left: 28px;
	background-image: url(../../img/canalvie/app/ico-planificateur-mariage.png);
	background-position: 5px -141px;
	background-repeat: no-repeat;
	text-transform: capitalize;
	text-shadow: none;
	border: none;
}
.webapp .icoTrash {
    width: 21px;
    height: 21px;
    background-image: url(../../img/canalvie/app/ico-planificateur-mariage.png);
    background-position: 3px -190px;
    background-repeat: no-repeat;
    display: block;
}
.webapp .icoTrash.alt {
    background-position: 3px -240px;
}
.webapp .icoTrash:hover {
    background-color: #F37B97;
}
.webapp .icoTrash.alt:hover {
    background-color: #CCC;
}

/*
| Petits mignons - webapp
*/
.petitsMignons .tool a span {
	background-image: url(../../img/canalvie/app/toolbar-sprite.png);
}
.petitsMignons .pageList .btn {
	background-image: url(../../img/canalvie/app/ico-petits-mignons.png);
	background-position: left -48px;
}
.petitsMignons .pageList .toNextItem {
	background-position: -9px -96px;
}
.petitsMignons .heartIco {
	background-image: url(../../img/canalvie/app/ico-petits-mignons.png);
	background-position: left -191px;
}
.petitsMignons .heartIco.active, 
.petitsMignons .heartIco:hover {
	background-image: url(../../img/canalvie/app/ico-petits-mignons.png);
	background-position: left -143px;
}

.petitsMignons .pageList a:hover {
	background-color: #6ad7ff; /*blue*/
}
.petitsMignons .pageList .btn:hover {
	background-color: transparent;
}
.petitsMignons ol.decimalStyle > li:before,
.petitsMignons .recipe ol > li:before {
	color: #6ad7ff; /*blue*/
}
.petitMignonOfMonth {
	overflow: hidden;
	background-color: #F9F9F9; /*grey1*/
}
.petitMignonOfMonth .picture {
	margin-bottom: 0;
}
.petitMignonOfMonth .hTitle {
	border-bottom: 1px dotted #B7B7B7; /*greyBg3*/
	margin-left: 3%;
	margin-right: 3%;
	margin-bottom: 0;
	padding-top: 0.2em;
	padding-bottom: 0.4em;
}
.petitMignonOfMonth .teaser {
	padding-left: 3%;
	padding-right: 30%;
	padding-top: 0.5em;
	padding-bottom: 1em;
	margin-bottom: 0;
	background-color: #EEEEEE; /*greyBg2*/
}
.petitMignonOfMonth .medal {
	position: absolute;
	top: 217px;
	right: 10px;
	width: 64px;
	height: 89px;
	background-image: url(../../img/canalvie/app/medalFirst.png);
	background-position: left top;
	background-repeat: no-repeat;
}

/*
| Wedding Planner - webapp
*/
.weddingPlanner .pigment {
	background-color: #FF629D; /*pink*/
}
.weddingPlanner span.pigment {
	color: #FF629D; /*pink*/
	background-color: transparent;
}
.weddingPlanner a span.pigment:hover {
	color: #7E7E7E; /*txOver1*/
}
.weddingPlanner fieldset {
	padding-top: 0;
	border: none;
}
.weddingPlanner input[type=text],
.weddingPlanner input.alphameric {
	background-color: #FFC6D4; /*lightPink*/
}
.weddingPlanner input.realCost {
	background-color: #F392A9; /*lightPink2*/
}
.weddingPlanner h3.legend.pigment,
.weddingPlanner button.submit,
.weddingPlanner a.btn.submit {
	color: white;
	background-color: #F392A9; /*lightPink2*/
}
.weddingPlanner button.submit:hover,
.weddingPlanner a.btn.submit:hover {
	background-color: #FF629D; /*pink*/
	box-shadow: 0 2px 2px #CCC; /* H-offset, V-offset, Gradient-size, #Color */
}
/* new task generator */
.weddingPlanner .newRowGenerator td {
	padding-top: .5em;
	padding-bottom: .5em;
	text-align: left;
	background-color: #F392A9; /*lightPink2*/
}
.weddingPlanner .newRowGenerator input.alphameric,
.weddingPlanner .newRowGenerator select,
.weddingPlanner .userRow input.alphameric,
.weddingPlanner .userRow select {
	width: 96%;
	background-color: white;
	border-color: #7E7E7E;
}
.weddingPlanner .header {
	background-color: #F9F9F9; /*grey1*/
	margin-bottom: 1em;
	padding-bottom: 1em;
	overflow: hidden;
}
.weddingPlanner .header h2{
    font-family: 'cvFontTitle1',Arial,sans-serif;
	font-weight: normal;
	margin-bottom: 0.2em;
}
.weddingPlanner .header .picture {
	float: left;
}
.weddingPlanner .header li {
	list-style: none;
	border-top: 1px dotted #B7B7B7; /*greyBg3*/
	padding-top: 0.9em;
	padding-bottom: 0.9em;
}
.weddingPlanner .header li:first-child {
	border-top: none;
}
.weddingPlanner .tools,
.weddingPlanner nav.tabMenu {
	float: left;
	padding-left: 0;
	padding-bottom: 0;
	margin-bottom: 0;
	clear: none;
}
.weddingPlanner .tools {
	float: right;
}
.weddingPlanner .tools .btn {
	color: white;
	background-color: #F392A9; /*lightPink2*/ 
	margin-left: 0;
	margin-right: 0;
}
.weddingPlanner .first nav.tabMenu {
	float: left;
}
.weddingPlanner .sbHolder a {
	color: #F392A9; /*lightPink2*/
}
.weddingPlanner .sbHolder a:hover {
	color: #FF629D; /*pink*/
}
.weddingPlanner label.checkbox {
	margin-top: .2em;
}
.weddingPlanner label.checkbox input,
.weddingPlanner .action button {
	margin-left: 0;
}
.weddingPlanner .action .link {
	margin-left: 1em;
}
.weddingPlanner .wideColumn .checkFieldset {
	float: left;
	clear: none;
	margin-left: 1em;
}
.weddingPlanner .wideColumn .action {
	float: right;
	clear: none;
}
.weddingPlanner .total td{
	background-color: white;
	border: none;
}
.weddingPlanner .total-first-line td{
	border-collapse:separate;
	border-top: 2px solid #F5F5F5; /*lightGrey*/
}
.weddingPlanner .total .totalTitle {
	font-weight: bold;
	background-color: #F5F5F5; /*lightGrey*/
}
.weddingPlanner .total .totalEstimated,
.weddingPlanner .total .totalReal {
	text-align: right;
	color: white;
	background-color: #F392A9; /*lightPink2*/
}
.weddingPlanner .total .totalEstimated {
	border-right:1px dotted white;
	border-bottom-left-radius: 4px;
}
.weddingPlanner .total .totalReal {
	border-bottom-right-radius: 4px;
}

.weddingPlanner table .col1 { width: 40%; }
.weddingPlanner table .col2 { width: 10%; }
.weddingPlanner table .col3 { width: 10%; }
.weddingPlanner table .col4 { width: 20%; }
.weddingPlanner table .col5 { width: 10%; }
.weddingPlanner table .col6 { width: 10%; }
.wideColumn .weddingPlanner table .col1 { width: 10%; }
.wideColumn .weddingPlanner table .col2 { width: 35%; }
.wideColumn .weddingPlanner table .col3 { width: 15%; }
.wideColumn .weddingPlanner table .col4 { width: 30%; }

.cboxInlineContent#modifyDate fieldset.action {
	margin-top: 2em;
}
.weddingPlanner table select {
	width: 98%;
}
/* Overwrite theme */
.weddingPlanner .tabMenu a.open,
.weddingPlanner .tabMenu a.open:hover { 
	background-image: url(../../img/canalvie/app/wedding-bubblePointer-sprite.png);
}
.weddingPlanner .tabMenu a.open span,
.weddingPlanner .tabMenu a.open span:hover,
.weddingPlanner .tabMenu a.open:hover span {
	border-color: #F392A9;
	background-color: #F392A9;
}
.weddingPlanner .tool a span {
	background-image: url(../../img/canalvie/app/wedding-toolbar-sprite.png);
}

/* 
| Pregnancy Calendar - webapp
*/
.webapp .status {
	overflow: hidden;
}
.webapp .status .left {
	float: left;
}
.webapp .status .right {
	float: right;
}
.webapp .status .right a {
	padding-right: 16px;
	background-image: url(../../img/canalvie/app/ico-calendrier-grossesse.png);
	background-position: right -384px;
	background-repeat: no-repeat;
}
.pregnancyCalendar .sbHolder a,
.pregnancyCalendar .status .left a {
	color: #B33484; /*purple*/
}
.pregnancyCalendar .nav {
	width: 100%;
	padding-bottom: 1.5em;
	float: left;
}
.pregnancyCalendar .nav .left {
	width: 67%;
	float: left;
}
#content .pregnancyCalendar .nav  form {
	margin-bottom: 0;
}
.pregnancyCalendar .themeImage {
	margin-bottom: 1.5em;
}
.pregnancyCalendar .filterTool button.submit {
	margin-bottom: 0;
	margin-top: 1em;
}
.pickers > div {
	float: left;
	padding-right: 0.5em;
}
.pickers .text {
	padding-top: 0.3em;
}
.pickers #weekSelect {
	width: 15%;
}
.pickers #monthSelect {
	width: 26%;
}
.pregnancyCalendar .filterTool {
	width: 32%;
	height: 16.2em;
	float: right;
}
.pregnancyCalendar .hTitle {
	position: relative;
	background-color: #B33484; /*purple*/
	color: white;
	text-align: center;
}
.pregnancyCalendar .hTitle .control a {
	position: absolute;
	top: 0;
	height: 16px;
	padding-top: 8px;
	padding-bottom: 8px;
	margin-top: 0.3em;
	display: block;
	color: white;
	font-size: 1.2em;
	font-family: Arial,Helvetica,sans-serif;
	background-image: url(../../img/canalvie/icon-site-sprite.png);
	background-position: left -40px;
	background-repeat: no-repeat;
}
.pregnancyCalendar .hTitle .control a:hover {
	background-color: transparent;
}
.pregnancyCalendar .hTitle .control .rewind {
	left: 0;
	padding-left: 20px;
	padding-right: 1em;
	margin-left: 0.8em;
	border-right: 1px dotted white;
}
.pregnancyCalendar .hTitle .control .forward {
	right: 0;
	padding-left: 1em;
	padding-right: 20px;
	margin-right: 0.8em;
	background-position: right -72px;
	border-left: 1px dotted white;
}
.pregnancyCalendar table {
  	border-spacing: 0.7em;
  	border-collapse: separate;
}
.pregnancyCalendar tbody tr:nth-child(odd) {
	background-color: transparent;
}
.pregnancyCalendar th { 
	width: 13%; 
	font-family: cvFontTitle1;
	text-align: center;
	border: none;
	padding: 0;
}
.pregnancyCalendar td {
	border: none;
	padding: 0;
}
.pregnancyCalendar tfoot a {
	height: 16px;
	background-image: url(../../img/canalvie/app/ico-calendrier-grossesse.png);
	background-position: left -48px;
	background-repeat: no-repeat;
}
.pregnancyCalendar tfoot .rewind {
	float: left;
	padding-left: 22px;
}
.pregnancyCalendar tfoot .forward {
	background-position: right -96px;
	padding-right: 22px;
	float: right;
}
.pregnancyCalendar td .item {
	position: relative;
	height: 11.3em;
	width: 100%;
	border: 1px solid #EAEAEA; /*grey2*/
	overflow: hidden;
}
.pregnancyCalendar td:nth-child(even) .item {
	background-color:#F9F9F9; /* grey1 */
}
.pregnancyCalendar td .itemCurrent,
.pregnancyCalendar td:nth-child(even) .itemCurrent {
	background-color: #f7e8f1; 
	background-image: url(../../img/canalvie/bg-mosaic-5x5-efefef.png);
	background-repeat: repeat;
}
.pregnancyCalendar td .item:hover { 
	background-color: #e9e9e9; /*= 909090 transparent 80%*/
	background-image: url(../../img/canalvie/bg-mosaic-5x5-efefef.png);
	background-position: left top;
	background-repeat: repeat;
	cursor: pointer;
}
.pregnancyCalendar .item div {
	position: absolute;
}
.pregnancyCalendar .day {
	top: 56%;
	left: -10%;
	height: 100%;
	color: #F0F0F0;
	font-size: 6.5em;
	font-weight: bold;
	line-height: 1;
}
.pregnancyCalendar .icon {
	top: 0;
	width: 100%;
}
.pregnancyCalendar .icon ul {
	float: right;
	margin-right: 0.3em;
}
.pregnancyCalendar .icon li {
	float: left;
	margin-left: 0.4em;
	list-style: none;
}
.pregnancyCalendar .item .label {
	position: absolute;
	top: 35%;
	left: 5%;
	overflow: hidden;
	width: 90%;
	margin-bottom: 0;
}
.pregnancyCalendar .modalView { 
	display: none; 
}
#cboxLoadedContent .modalView {
	margin: 10px;
	/*background-color: green;*/
}
.pregnancyCalendar .week {
	top: 0;
	width: 51px;
	height: 51px;
	background-image: url(../../img/canalvie/app/bg-week2.png);
	background-position: left top;
	background-repeat: no-repeat;
	color: white;
	font-size: 0.9em;
}
.pregnancyCalendar .week span {
	display: block;
	width: 16px;
	text-align: center;
	position: relative;
	left: 5px;
	bottom: 2px;
	padding-top: 0.5em;
	margin-left: -0.3em;
}
.pregnancyCalendar .month {
	bottom: 0;
	width: 100%;
	background: #B33484 url(../../img/canalvie/bg-mosaic-5x5-efefef.png) repeat left top; /*purple*/
	color: white;
	font-weight: bold;
	text-align: center;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
}
.pregnancyCalendar .pickers .checkbox input {
	float: left;
	margin-left: 0;
}
/* Modal window within webapp pregnancyCalendar */
#cboxClose a.closeWindow.pregnancyCalendar {
	margin-top: 0;
	padding-right: 22px;
	background-image: url(../../img/canalvie/app/icoClose-B33484.png);
	background-position: right center;
}
#cboxClose a.closeWindow.pregnancyCalendar:hover {
	color: #B33484;
}
.modalHeader .date {
	clear: both;
	margin-top: -0.6em;
	padding-bottom: 1.4em;
	border-bottom: 1px dotted #CCC;
}
.modalHeader .pageTitle {
	font-size: 1.2em; /*14px*/
}
.modalContent .tools {
	overflow: hidden;
	clear: both;
	margin-bottom: 1em;
	padding-top: 1em;
}
.modalContent .tools {
	margin-left: 0;
}
.modalContent .tools li {
	list-style: none;
	margin-left: 0;
	padding-left: 12px;
	border-left: 1px dotted #CCC;
	float: left;
}
.modalContent .tools li:first-child {
	padding-left: 0;
	border-left: none;
}
.modalContent .tools a {
	padding-top: 0.1em;
	padding-bottom: 0.1em;
	padding-left: 18px;
	margin-right: 12px;
	display: inline;
}
.modalContent .tools .icoVideo {
	padding-left: 23px;
}
.modalContent .wrapImg { 
	float: right;
	margin: 0 0 .1em .5em;
	min-height: 185px;
}
.modalContent .pregnancyWidget div.selectDate {
	margin-top: 2.4%;
}
.modalContent .pregnancyWidget div.selectDate input {
	margin-left: 5%;
}
.modalContent .pregnancyWidget .appSubscribe fieldset.action {
	float: left;
	margin-top: -1.3em;
}
.modalContent .pregnancyWidget .appSubscribe a {
	display: block;
	float: left;
	margin-left: 1.5%;
	text-decoration: underline;
}
#cboxClose a.closeWindow.pregnancy {
	padding: 6px 25px 3px 0;
	background: transparent url(../../img/canalvie/app/icoClose-B33484.png) no-repeat right center;
}