﻿*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;

    -webkit-font-smoothing: antialiased;
            font-smoothing: antialiased;

    text-rendering: optimizeLegibility;
}

body
{
    overflow-x: hidden;
}

body,
body > *:not(#sizeBracket),
html
{

    width: 100% !important;
}

body,
html
{
    margin: 0;
    font-size: 16px;
    font-size: 1.6rem;
    background-color: #f1f1f1;
}

.whiteBg{
    background-color: white;
}


button,
input:not(input[type='checkbox']):not(input[type='radio']),
input[type="email"]
{
    border: none;
    outline: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
        -ms-border-radius: 0;
         -o-border-radius: 0;
            border-radius: 0;
}

label{
    cursor: pointer;
}

svg{
    display: block;
    margin: 0 auto;
    position: relative;
    pointer-events: none;
}

text { /* For SVG */
    text-anchor: middle;
    pointer-events: auto;
}

#sizeBracket{
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 3px;
    height: 0;
}

.clearFix:after,
main:after,
.relatedArticles:after
{
    content: " ";
    visibility: hidden;
    display: block;
    height: 0;
    clear: both;
}

.clear{
    clear: both;
}

.grid{
    width: 100%;
    position: relative;
}

main .grid{
    margin: 0 auto;
}

.grid:after{
    content: "";
    display: table;
    clear: both;
}

[class*='col-'],
.searchResult,
.relatedArticles-infoBlock
{
    float: left;
    display: block;
}

.col-1-1{
    width: 100%;
}

.col-1-2,
.cell-1-2
{
    width: 50%;
}

.col-1-3,
.cell-1-3
{
    width: 33.3333333333%;
}

.col-2-3{
    width: 66.6666666666%;
}

.col-1-4,
.relatedArticles-infoBlock
{
    width: 25%;
}

.col-3-4{
    width: 75%;
}

.col-2-5,
.cell-2-5,
.tableCell-2-5
{
    width: 40%;
}

.col-3-5,
.cell-3-5
{
    width: 60%;
}

.col-1-5,
.tableCell-1-5
{
    width: 20%;
}

table{
    /* width: 100%; */ 
}

.table,
.table.conditionally-table
{
    display: table;
    position: relative;
    width: 100%;
   
}

.tableRow,
.table.conditionally-table .conditionally-tableRow,
#dnn_dnnSearch_ClassicSearch
{
    display: table-row;
    position: relative;
}

.showOverflow.showOverflow{
    overflow: visible;
}

.tableCell,
[class*='tableCell-']
{
    display: table-cell;
    vertical-align: middle;
    position: relative;
    text-align: center;
}

.table.conditionally-table .tableCell{
    display: table-cell;
    float: none;
}


[class*='tableCell-']{
    overflow: hidden;
}


.halves > .tableCell{
    width: 50%;
}

.inlineBlock{
    display: inline-block;
}

.posRel{
    position: relative;
}

.vAlign-top{
    vertical-align: top;
}

.vAlign-middle{
    vertical-align: middle;
}

.vAlign-bottom{
    vertical-align: bottom;
}

.fullSizeOfParent,
.pageSection-bgImage,
.calendarAction .svgWrapper
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.bigTitle,
.pageSection-bgImage,
.articlePreview-image
{
    background-repeat: no-repeat;
    background-size: cover;
}

.pageSection-overlay{
    position: absolute;
    top: 0;
    left: 50%;
    width: 50%;
    height: 100%;
    display: table;
}

.pageSection-overlay .tableCell{
    vertical-align: top;
    text-align: left;
}

.pageSection-splash{
    margin-top: 135px;
}

.pageSection-splash .textInjection{
    color: white;
    font-size: 72px;
    font-size: 7.2rem;
    font-weight: 200;

}

.pageSection-splash .highlight{
    display: block;
    position: relative;
    font-size: 48px;
    font-size: 4.8rem;
    font-weight: 600;
    top: 8px;
    padding-bottom: 8px;

}

.pageSection-splash > span{
    letter-spacing: 8px;
    line-height: 60px;
    line-height: 6rem;
}


.pageSection-background{
    position: relative;
    height: 100%;
}

.siteWidth{
    width: 1000px;
    margin: 0 auto;
}

.siteWidth.extraWide{
    width: 100%;
    max-width: 1300px;
    padding-left: 50px;
    padding-right: 50px;
}

section{
    position: relative;
}

/*dont refactorise to 
	.mobileOnly.mobileOnly,.tabletOnly,.notDesktop display: none;
 thank you	
*/
.mobileOnly
{
    display: none;
}
.tabletOnly
{
    display: none;
}
.notDesktop
{
    display: none;
}

.darkOverlay{
    background-color: rgba(0, 0, 0, 0.6);
}

.fixedBg{
    background-attachment: fixed;
    background-size: cover;
    background-position: 50% 0%;
    background-repeat: no-repeat;
}

.fakeFixedBg{
    position: fixed;
    top: 115px;
    left: 0;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    width: 100%;
    width: 100vw;
    height: 100%;
    height: 100vh;
    height: calc(100vh - 115px);
}

.isLoggedOut .fakeFixedBg{
    top: 0;
    height: 100vh;
}

.letterSpacing-1{
    letter-spacing: 1px;
}

.letterSpacing-2{
    letter-spacing: 2px;
}

#preloadedImages{
    display: none;
}

.mainCell{
    padding-top: 50px;
    padding-bottom: 50px;
}

/*-----------------------------------------*\
    Type
\*-----------------------------------------*/

html{
    font-size: 62.5%;
}

html,
input,
button
{
    -webkit-text-size-adjust: 100%;
       -moz-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
    font-weight: 400;
}


strong,
b
{
    font-weight: 600;
}


em,
i
{
    font-style: italic;
}

u
{
    text-decoration: underline;
}

sup{
    font-size: 0.8em;
    vertical-align: top;
}

sub{
    font-size: 0.8em;
    line-height: 1em;
    vertical-align: bottom;f
}

.alignLeft{
    text-align: left;
}

.alignRight{
    text-align: right;
}

.alignCentre{
    text-align: center;
}


.textIndent,
.companyLogo,
.svgWrapper
{
    text-indent: 150%;
    white-space: nowrap;
    overflow: hidden;
}

button,
input[type="search"],
input[type="submit"],
input[type="email"]
{
    border: 0;
    outline: none;
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-size: 1.6rem;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
        -ms-border-radius: 0;
         -o-border-radius: 0;
            border-radius: 0;

    cursor: pointer;
    background: none;
    background-color: transparent;
}

input[type="text"],
input[type="password"]
{
    border: 0;
    outline: none;
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-size: 1.6rem;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
        -ms-border-radius: 0;
         -o-border-radius: 0;
            border-radius: 0;
}

address{
    font-style: normal;
}

li{
    list-style: none;
}

a{
    color: white;
    text-decoration: none;
}

.bigTitle{
    font-size: 6.1rem;
    font-weight: 200;
    letter-spacing: 5px;
    margin-left: -5px;
    margin-top: -13px;
}

.rightTitle {
    text-align: right;
}

.mediumTitle{
    font-size: 53px;
    font-size: 5.3rem;
    line-height: 60px;
    line-height: 6rem;
    font-weight: 400;
    letter-spacing: 5px;
    margin-left: -5px;
	padding-top: 60px;
}

.smallTitle{
    font-size:20px;
    margin-left: -5px;
}



/*-----------------------------------------*\
    Drop Downs
\*-----------------------------------------*/

.selector
{
    color: white;
    cursor: pointer;
}

div.selector select,
div.selector span,
.selector
{
    position: relative;
    height: 49px;
    line-height: 43px;
    width: 100% !important;
    display: -moz-inline-box;
    display: inline-block;
    zoom: 1;
    vertical-align: middle;
}

div.selector select {
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    border: none;
    background: none;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: left;
    text-transform: uppercase;
}

div.selector span {
    text-overflow: ellipsis;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    padding: 0 25px 0 20px;
    cursor: pointer;
    width: 100%;
    display: block;
    text-align: left;
    font-size: 16px;
    text-align: left;
}

.selector{
    border: solid 3px white;
    background-image: url("img/dropDownArrow.gif");
    background-position: 100% 50%;
    background-repeat: no-repeat;

}

/*-----------------------------------------*\
    Menu
\*-----------------------------------------*/

header{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 5;
    -webkit-box-shadow: 0px 6px 11px 0px rgba(50, 50, 50, 0.1);
       -moz-box-shadow: 0px 6px 11px 0px rgba(50, 50, 50, 0.1);
            box-shadow: 0px 6px 11px 0px rgba(50, 50, 50, 0.1);
}

.loggedOutMenu {
    position: absolute;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
}

.mobileMenu-loggedOut-content {
    float: left;
}

.loggedOutMenu ul {
    margin-left: 24px;
    top: 2px;
}

.loggedOutMenu ul li {
    float: left;
}

.loggedOutMenu ul li a {
    color: white;
    height: 12px;
    line-height: 12px;
    display: block;
    border-left: solid 1px #fff;
    margin: 54px 0;
    padding: 0 22px;
}

.loggedOutMenu ul li:first-child a {
    border-left: 0;
}

.companyLogo{
    display: block;
    position: relative;
    width: 100%;
	margin: 0 0 0 0px;
	background-image:none;
	background-color: inherit;
}

.menu-desktop{
    position: relative;
    z-index: 2;
    background-color: white;
    -webkit-transform: translate3d(0, 0, 0);
	width:100%;
}

.menu-desktop td{
    vertical-align: top;
    text-align: center;
}

.menu-endWidth{
    width: 12%;
}

.menu-itemWidth{
    width: 15.2%
}

.menu-itemWidth-double{
    width: 30.4%;
}

.menu-itemWidth-half{
    width: 7.7%;
}

.menu-fullHeight,
.menu-fullHeight > *
{
    height: 120px;
}

.menu-topItem,
.menu-topItem > *,
.searchInputContainer,
.SearchButton
{
    height: 40px;
}

.searchInputContainer{
    display: table-cell;
}

.menu-bottomItem,
.menu-bottomItem > *
{
    height: 80px;
}

.menu-bottomItem{
    font-size: 14px;
    font-size: 1.4rem;
}

#dnn_dnnSearch_txtSearch,
#dnn_dnnMobile_txtSearch
{
    padding: 10px 0 11px 15px;
    min-height: 40px;
    max-height: 40px;
    width: 100%;
}

#dnn_dnnMobile_ClassicSearch{
    display: table-row;
}

.SearchButton
{
    position: relative;
    display: table-cell;
    width: 70px;
    cursor: pointer;
    overflow: hidden;
    text-indent: -400px;
    white-space: nowrap;
    padding: 0;
    margin: 0;
    vertical-align: top;
}

.searchBar{
    display: table;
    width: 100%;
}

header .myProfile
{
    font-weight: 600;
    color: white;
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 1px;
}

.menu-fullCell
{
    display: table;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.menu-fullCell .tableCell{
    padding: 2px 10px 0;
    letter-spacing: 1px;
    line-height: 20px;
    line-height: 2rem;
}

.menu-desktop-top .hoverEffect .tableCell:after,
.menu-desktop-bottom .menu-fullCell .tableCell:after
{
    content: " ";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 10px;
    margin-bottom: -10px;
    -webkit-transform: translateZ(0); /* Fix chrome artifact */
}

#searchForm-notMobile .tableCell{
    vertical-align: top;
}


.healthScore-global{
    display: inline-block;
    position: relative;
    letter-spacing: 0;
    font-size: 20px;
    font-size: 2rem;:
    margin-left: 5px;
    top: 3px;
    padding-bottom: 5px;
}

.menu-desktop-top .menu-fullCell .tableCell,
.healthScore-note
{
    font-size: 12px;
    font-size: 1.2rem;
}

.myProfile .arrowWrapper{
    position: relative;
}

.myProfile .arrowDown{
    position: relative;
    top: 0;
}


.noteWrapper{
    overflow: visible;
}

.dropDownHealthScore{
    background-color: #2f2f2f;
    width: 700px;
    z-index: 2;
    position: absolute;
    top: 40px;
    right: 0;

    display: none;
}


.dropDownHealthScore-leftCol{
    width: 235px;
    vertical-align: top;
    text-align: left;
    background-color: #3e3e3e;
    padding: 20px 0 0 20px;
}

.dropDownHealthScore-rightCol{
    vertical-align: top;
    text-align: right;
    background-color: #2f2f2f;
}

.dropDownHealthScore .scoreCircleContainer{
    float: left;
    clear: both;
}

.dropDownHealthScore .scoreCategory{
    float: left;
    width: 130px;
    padding-right: 20px;
}

.dropDownHealthScore .healthReport-subScoreTitle{
    padding-top: 5px;
}

.dropDownHealthScore-rightCol{
    text-align: left;
    padding: 50px;
}

.dropDownHealthScore-rightCol .linkBlock-message{
    font-size: 14px;
    font-size: 1.4rem;
}

.dropDownHealthScore .linkBlock.first{
    margin-top: 50px;
}

.dropDownHealthScore .linkBlock{
    margin-bottom: 30px;
}

.dropDownHealthScore-rightCol .linkBlock-message{
    padding: 11px 10px 12px;
    color: white;
}

.dropDownHealthScore .linkBlock:hover .linkBlock-message{
    color: #2f2f2f;
}

.dropDownHealthScore .linkBlock:hover .linkBlock-icon{
    background-color: #3e3e3e;
    border-color: #3e3e3e;
}

.dropDownHealthScore-leftCol .scoreCircleContainer.first{
    float: none;
    padding-right: 20px;
}


.dropDownHealthScore .titleOnImage-sectionName{
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 20px;
    line-height: 2rem;
    padding-bottom: 0;
}

.dropDownHealthScore .titleOnImage-title{
    font-size: 30px;
    font-size: 3rem;
    line-height: 35px;
    line-height: 3.5rem;
    padding-bottom: 0;
}

.dropdownhealthscore .linkBlock.first{
    margin-top: 100px;
}







/* Submenu desktop */

.subMenu-myProfile{
    z-index: 0;
    -webkit-transform: translateZ(0); /* Fix safari bug */
    position: absolute;
    top: -700px;
    right: 0;
    width: 100%;
    height: 0px;
    overflow: visible;
    width: 100%;
    max-height: 500;

}

.subMenu-desktop-toggle{
    display: block;
    width: 100%;
    position: relative;
    z-index: 2;
    text-transform: uppercase;
    font-size: 13px;
    font-size: 1.3rem;
    font-weight: 600;
    overflow: visible;
}

.subMenu-desktop-toggle .table{
    height: 100%;
    width: 100%;
}


.subMenu-myProfile .genericContent-subSubTitle{
    color: #a9a9a9;
    margin-top: 10px;
    padding-bottom: 5px;
}


.subMenu-myProfile ul a{
    text-transform: none;
}



.subMenu-leftCell{
    width: 72.91%;
    background-color: #2f2f2f;
    z-index: 1;
    position: relative;

    line-height: 24px;
    line-height: 2.4rem;
    color: #a9a9a9;
    letter-spacing: 1px;
}

.subMenu-leftCell,
.subMenu-rightCell
{
    padding-top: 45px;
    padding-bottom: 45px;
    display: table-cell;
    vertical-align: top;
}

.subMenu-rightCell{
    background: #e6e6e6;
    color: #2f2f2f;
}

.subMenu-rightCell li{
    padding-bottom: 15px;
}

.subMenu-myProfile .fake_li-bulletAndTitle{
    background-position: 0% 50%;
}

.subMenu-rightCell .colWidth{
    width: 80%;
    margin: auto;
}


.subMenu-leftCell .colWidth{
    width: 100%;
    margin: auto;
    padding: 0 50px;
}

.subMenu-rightCell .colPadding
{
    padding-left: 25px;
}

.subMenu-leftCell .colPadding
{
    padding-left: 35px;
}

.subMenu-myProfile li,
.subMenu-myProfile .fake_li-bulletAndTitle
{
    padding-left: 30px;
    background-repeat: no-repeat;

}

.subMenu-myProfile .fake_li-bulletContent{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 18px;
    line-height: 1.8rem;
    display: block;
    margin-left: 15px;
    color: #898989;
    text-align: left;
    text-transform: none;
    font-weight: 400;

}

.fake_li-freeWidth{
    width: 120px;
}

.fake_ul tr td{
    padding-bottom: 15px;
}


.subMenu-leftCell .highlight{
    color: #e6e6e6;
}

.bigText-subMenu,
.bigText-subMenu a
{
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 30px;
    line-height: 3rem;
    font-weight: 200;
    letter-spacing: 2px;
    padding-bottom: 13px;
}

.subMenu-leftCell .bigText-subMenu,
.subMenu-leftCell .bigText-subMenu a
{
    color: white;
}

.svgServiceBell{
    width: 23px;
    height: 22px;
    display: inline;
    position: relative;
    top: 3px;
}

.svgRessourcesIcon{
    width: 24px;
    height: 12px;
    display: inline;
}

.subMenu-myProfile .titleIcon-ressourcesIcon .svgWrapper,
.subMenu-myProfile .titleIcon-serviceBell .svgWrapper
{
    display: inline-block;
    width: 26px;
    height: 25px;
    text-indent: 0;
}

.subMenu-myProfile li,
.subMenu-myProfile td[class*="fake_li-"]
{
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 18px;
    line-height: 1.8rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1px;
    background-repeat: no-repeat;
}


.subMenu-myProfile .linkBlock{
    font-weight: 200;
    font-size: 12px;
    font-size: 1.2rem;

    background-color: white;
    color: black;

    margin-left: 35px;
}

.subMenu-myProfile .linkBlock-icon,
.subMenu-myProfile .linkBlock-message,
.linkBlock-containerWidth .linkBlock-message,
.linkBlock-containerWidth .linkBlock-icon
{
    border: none;
}

.subMenu-myProfile .linkBlock-dark .linkBlock-icon{
    background-color: #2f2f2f;
}

.subMenu-myProfile .linkBlock-light .linkBlock-icon{
    background-color: #e6e6e6;
    background-image: url("img/arrow_black.png");
}

.linkBlock.black .linkBlock-message,
.linkBlock.black .linkBlock-icon
{
    border-color: #2f2f2f;
    color: #2f2f2f;
}

.linkBlock.black .linkBlock-icon{
    background-color: #2f2f2f;
    background-image: url("img/arrow_white.png");
}

.linkBlock.white .linkBlock-message{
    color: white;
}

.subMenu-leftCell .bigText-subMenu{
    padding-bottom: 0;
    color: white;
}

.subMenu-myProfile ul{
    padding: 10px 0 25px;
}

.subMenu-leftCell li{
    text-transform: none;
    color: #898989;
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 23px;
    line-height: 2.3rem;
    letter-spacing: 0;
}




.subMenu-leftCell .rightPadding{
    padding-right: 25px;
}

.subMenu-leftCell .leftPadding{
    padding-left: 25px;
}



.subMenu-myProfile .fake_ul{
    margin: 15px 0 15px;
}

.subMenu-myProfile .fake_li-bulletAndTitle{
    color: white;
    font-size: 20px;
    font-size: 2rem;
    white-space: nowrap;
}

.promoBlocks,
main .grid.promoBlocks
{
    margin-top: 20px;
}

.promoBlock{
    position: relative;
    display: block;
    float: left;
    width: 31%;
    overflow: hidden;
    margin-right: 3.5%;
    text-align: center;
}

.promoBlock.last{
    margin-right: 0;
}

.promoBlock-table,
.promoBlock-ammount
{
    display: table;
    width: 100% !important;
}

.promoBlock-ammount{
    font-size: 30px;
    font-size: 3rem;
    font-weight: 400;
    display: block;
    padding: 20px 0;
    font-weight: 200;

    background-color: #5e5e5e;
    color: white;
}

.promoBlock-title{
    font-size: 14px;
    font-size: 1.4rem;
    padding-top: 2px;
    text-transform: uppercase;

    text-shadow: rgba(47, 47, 47, 0.3) 0 0; /* Safari fix for blurry small text */
    color: #2f2f2f;
    background-color: #e6e6e6;

}

.promoBlock-cartIcon{
    width: 40px;
    height: 40px;
}

.svg-shoppingCart{
    width: 23px;
    height: 23px;
}

.svg-shoppingCart path{
    fill: white;
}




/*-----------------------------------------*\
    Mobile Menu
\*-----------------------------------------*/
.mobileMenu{
    height: 100%;
    width: 100%;
    background-color: #e6e6e6;

    -webkit-box-shadow: 0px 6px 11px 0px rgba(50, 50, 50, 0.1);
       -moz-box-shadow: 0px 6px 11px 0px rgba(50, 50, 50, 0.1);
            box-shadow: 0px 6px 11px 0px rgba(50, 50, 50, 0.1);

}

.mobileMenu-companyLogo,
.mobileMenu-searchButton,
.mobileMenu-profile,
.mobileMenu-hamburger
{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    width: 25%;
    cursor: pointer;
    height: 50px;
    overflow: hidden;
}

.svg-searchIcon path{
    fill: #818181;
}



.loggedOutMenu .companyLogo{
    height: 120px;
    width: 200px;
    float: left;
}

.loggedOutMenu-nav{
    float: left;
}




/*-----------------------------------------*\
    Generic elements
\*-----------------------------------------*/
main{
    position: relative;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    display: block;
}

main.table{
    dispalay: table;
    width: 100%;
}

.clearMenu{
    height: 120px;
}

/* Link blocks */

.linkBlock{
    display: inline-block;
    text-transform: uppercase;
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 20px;
    line-height: 2rem;
    letter-spacing: 1px;
}

.linkBlock-message{
    padding: 16px 25px 14px;
    border-left: solid white 3px;
    border-top: solid white 3px;
    border-bottom: solid white 3px;
    text-align: left;
}

.linkBlock-leftArrow .linkBlock-message{
    border-left: none;
    border-right: solid white 3px;
}

.linkBlock-icon{
    width: 50px;
    height: 100%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    border: solid white 3px;
    background-image: url("img/arrow_white.png");
}

.linkBlock-leftArrow .linkBlock-icon{
    background-image: url("img/leftArrow_white.png");
}

.linkBlock-backToTop .linkBlock-message,
.linkBlock-backToTop .linkBlock-icon
{
    border-color: #848484;
    color: #848484;
}

.linkBlock-backToTop .linkBlock-icon{
    background-image: url("img/upArrow_grey.png");
}

.linkBlock-backToTop-white .linkBlock-icon{
    background-image: url("img/upArrow_white.png");
}

.linkBlock-download {
    background-image: url("img/downArrow_white.png");
}

.linkBlock-background{
    height: 400px;
    padding: 0 30px;
    text-align: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}

.backToTopWrapper{
    text-align: center;
    padding: 80px 0;
    background-color: white;
    background-size: cover;
    background-position: 100% 50%;
    -webkit-transform: translate3d(0, 0, 0);
}

.toOtherPageWrapper{
    text-align: center;
    padding: 40px 10px;
    background-color:#e21c39;
}

.toOtherPageWrapper .linkBlock-message {
    background: #cb1933;
}

.toOtherPageWrapper .linkBlock:hover .linkBlock-message{
    background: white;
}


.promoBlock:hover .notHover,
.onHover
{
    display: none;
}

.promoBlock:hover .onHover{
    display: block;
}

/* Articles */

.pageIntro{
    position: relative;
    width: 100%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    color: white;
    min-height:275px;
}

.webkitScrollFix{
    -webkit-transform: translate3d(0, 0, 0);
}

.isLoggedOut .pageIntro{
    padding-top: 70px;
    background-position: 50% 0;
}

.pageIntro-transparentMenu.pageIntro {
    padding-top: 120px;
}

.bigTitle,
.mediumTitle
{
    color: white;
    padding-bottom: 30px;
}

.pageIntroColourOverlay{
    background-color: rgba(47, 47, 47, 0.5);
    padding: 77px 0;
}

.pageIntroTextOnImage{
    padding: 96px 0 80px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 0%;
    overflow: hidden;
    z-index: 1;
    position: relative;
    -webkit-transform: translate3d(0, 0, 0);
}


.pageIntro-authorPhoto{
    width: 155px;
    text-align: left;
}

.pageIntro-info{
    text-align: left;
}

.pageIntro-contentWrapper{
    width: 48%;
    margin-right: 9.5%;
    float: right;
    padding: 100px 50px 100px 0;
    position: relative;
    z-index: 2;
}

.pageIntro-overlay-keepInCenter .pageIntro-contentWrapper{
    width: 55vw;
    margin-right: 0;
    float: left;
    padding: 75px 50px 99px 0;
    margin-left: 40vw;
}

.pageIntro-overlay{
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
}

.pageIntro-overlay-description{
    font-size: 14px;
    font-size: 1.4rem;
    text-transform: uppercase;
    line-height: 20px;
    font-weight: 600;

}

.breadcrumb img,
.linkWrapper img
{
    padding-right: 10px;
}

.breadcrumb,
.breadcrumb a,
.linkWrapper,
.linkWrapper a
{
    text-transform: uppercase;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
    font-weight: 600;
}

.articleTitle{
    font-size: 33px;
    font-size: 3.3rem;
    line-height: 40px;
    line-height: 4rem;
    letter-spacing: 2px;
    max-width: 470px;
    padding: 90px 0 15px;
}

.discount {
    float: right;
    background: black;
    color: #6b6b6b;
    font-size: 24px;
    height: 68px;
    line-height: 68px;
    font-weight: 400;
    text-transform: uppercase;
    width: 555px;
}

.discount span {
    background: #d92551;
    color: white;
    font-size: 55px;
    line-height: 68px;
    float: left;
    padding: 0 20px;
    margin-right: 30px;
    font-weight: 400;
}

/* Black and white columns */
.blackAndWhiteContent{
    background-color: white;
}

.blackAndWhiteContent.table{
    width: 100%; /* ie9*/
}

.blackAndWhiteContent-separateCols{
    background-color: transparent
}

.blackAndWhiteContent-separateCols .blackAndWhiteCol{
    background-color: white;
}

.blackAndWhiteCol-left,
.blackAndWhiteCol-right
{
    text-align: left;
    width: 50%;
    vertical-align: top;
    padding: 90px 5% 5%;
}


.blackAndWhiteCol.dark .genericContent-title{
    color: #cdcdcd;
}

.blackAndWhiteCol.dark{
    background-color: #2f2f2f;
    color: #919191;
}
.blackAndWhiteCol.dark p,
.blackAndWhiteCol.dark li
{
    color: #969696;
}

.arrowWrapper-right{
    position: absolute;
    top: 0;
    right: 0;
}

.arrowRight{
    position: absolute;
    display: block;
    height: 0;
    width: 0;
    right: 0;
    z-index: 2;
    margin-right: 2px;
    opacity: 0;
}

.arrowLeft{
    position: absolute;
    display: block;
    height: 0;
    width: 0;
    top: 0;
    left: 0;
    margin-left: 2px;
    opacity: 0;
}


/* Page description */

.pageDescription-title {
    color:#2f2f2f;
    font-size:2.4rem;
    font-weight: 200;
}

.pageDescription-subTitle {
    color: #666666;
    font-size: 1.3rem;
    margin: 10px 0 27px;
    font-weight: 400;
}

.pageDescription p {
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 19px;
    line-height: 1.9rem;
    margin-bottom: 20px;
    color: #898989;
}

.pageDescription .linkWrapper a{
    color: #8a8a8a;
    font-weight: 400;
    font-size: 13px;
    font-size: 1.3rem;
    text-transform: none;

}

.pageDescription-linksTitle {
    color: #e21c39;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-weight: 400;
    font-size: 13px;
    font-size: 1.3rem;
}

.pageDescription-content {
    padding: 50px 50px 30px;
    -webkit-transform: translate3d(0, 0, 0);
}


.pageDescription {
    width: 465px;
    background: white;
    float: right;
    position: relative;
    margin: 55px 0;
    min-height: 100px;
    letter-spacing: 1px;
    -webkit-transform: translate3d(0, 0, 0);
}

.pageDescription.absolute{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}



/* Adhere link */
.linkBlock-containerWidth{
    display: block;
}

.linkBlock-containerWidth .linkBlock-message{
    font-size: 16px;
    font-size: 1.6rem;
    text-align: left;
    padding: 16px 50px 14px;

}

.linkBlock-containerWidth .linkBlock-icon{
    width: 70px;
    height: 70px;
}

/* Custom scroller */
.scrollButton-top,
.scrollButton-bottom
{
    width: 50%;
    display: block;
    float: left;
    background-color: #e6e6e6;
    padding: 20px 0;
}

.scrollButton-bottom{
    border-right: solid 1px #bcbcbc;
}

.customScroller-controls{
    display: none;
}

.customScroller-controls .table{
    width: 100%;
}



.customScroller-hiddenScrollBar{
    overflow-y: scroll;
    overflow-x: hidden;
    width: 550px;
}

.customScroller-container,
.customScroller-controls
{
    width: 350px;
}

.customScroller-hideOverflow
{
    overflow: hidden;
    width: 365px;
}

.customScroller-hiddenScrollBar
{
    height: 500px;
}

.contentBrowser-content{
    background-color: #e6e6e6;
    text-align: left;
}

.recipePadding{
    padding: 60px 10%;
}

.loaderInContainer{
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.7);
    background-image: url("img/loader.gif");
    background-repeat: no-repeat;
    background-position: 50% 50%;
    z-index: 2;
}




/* Generic content */

.genericContent-title{
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 30px;
    line-height: 3rem;
    color: #2f2f2f;
    font-weight: 400;
    padding-bottom: 30px;
}

.genericContent-title.bigTitle{
    font-size: 36px;
    font-size: 3.6rem;
    line-height: 40px;
    line-height: 4rem;
    padding-bottom: 10px;
}

.genericContent-title.thinExtraLarge{
    font-size: 30px;
    font-size: 3rem;
    font-weight: 200;
    letter-spacing: 2px;
    color: white;
    margin-top: 30px;
}

.blackAndWhiteCol-right .genericContent-title.thinExtraLarge{
    color: #2f2f2f
}

.genericContent-titleOnEnd{
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.genericContent-subTitle{
    padding-bottom: 20px;
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 20px;
    line-height: 2rem;
    font-weight: 400;
    color: #2f2f2f;
}

.genericContent-subSubTitle{
    padding-bottom: 15px;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
    letter-spacing: 2px;
    font-weight: 400;
}

.genericContet-minorTitle{
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400;
    margin-bottom: 20px;
}

.dark .genericContent-subTitle {
    color:#bebebe;
}

.genericContent p,
.genericContent li,
.genericContent a,
.genericContent address
{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
    font-weight: 400;
    letter-spacing: 1px;
    color: #727272;
}

.genericContent p,
.genericContent ul
{
    margin-bottom: 20px;
}

.genericContent li{
    padding: 0 0 10px 33px;
    background-repeat: no-repeat;
    background-position: 0 6px;
}

.blackAndWhiteCol-left.dark .genericContet-minorTitle{
    color: white;
}


/* Info block */

.infoBlock{
    padding: 40px;
    border-right: solid #cbcbcb 1px;
    vertical-align: top;
    background-color: #e6e6e6;
}

.infoBlock.last{
    border-right: none;
}

.infoBlock-title{
    background-repeat: no-repeat;
    background-position: 0% 0%;
    text-transform: uppercase;
    text-align: left;
    vertical-align: top;
    background-image: url("img/bgChallengeSeparator.gif");
    background-repeat: no-repeat;
    background-position: 0% 100%;
    min-height: 65px;
}

.infoBlock-title.tableCell{
    min-height: 0;
}

.infoBlock-textBlock
{
    text-align: left;
    text-transform: uppercase;
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 16px;
    line-height: 1.6rem;
    font-weight: 400;
    letter-spacing: 1px;
    color: #989898;
}


.infoBlock,
.infoBlock p,
.infoBlock a
{
    color: #525252;
    text-transform: uppercase;
    text-align: left;
}


.infoBlock-subTitle{
    font-size: 14px;
    font-size: 1.4rem;
    text-align: left;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.infoBlock-borderBottom{
    border-bottom: solid #cbcbcb 1px;
}

.infoBlock-borderTop{
    border-top: solid white 1px;
}

.infoBlock-padding{
    padding: 25px 0;
}

.infoBlock-padding-less{
    padding: 15px 0;
}

.infoBlock-padding-less.first{
    padding-top: 0;
}

.noPaddingBottom{
    padding-bottom: 0;
}

.noMarginBottom,
.genericContent .noMarginBottom
{
    margin-bottom: 0;
}

.noSpacingBottom{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.infoBlock li{
    padding: 0 0 10px 33px;
    background-repeat: no-repeat;
    background-position: 0 6px;

    font-size: 13px;
    font-size: 1.3rem;
    line-height: 22px;
    line-height: 2.2rem;
    font-weight: 400;
    letter-spacing: 1px;
    color: #555555;
    text-transform: uppercase;
}


.infoBlock-numberedList,
.infoBlock-numberedList a
{
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 20px;
    line-height: 2rem;
}

.infoBlock-numberedList-number{
    font-size: 20px;
    font-size: 2rem;
    padding-right: 2px;
}

.infoBlock strong{
    color: #1A1A1A;
    font-weight: 400;
}


.infoBlock .oneFieldInput{
    margin-top: 15px;
}


/* Promo section */

.otherSectionPromotion-title{
    font-size: 36px;
    font-size: 3.6rem;
    line-height: 35px;
    line-height: 3.5rem;
    font-weight: 600;
    letter-spacing: 3px;
    margin-bottom: 25px;
}

.otherSectionPromotion-content{
    font-size: 14px;
    font-size: 1.4rem;
    letter-spacing: 2px;
    color: white;
    font-weight: 600;
    margin-bottom: 15px;
}

/* Calendar event block */

.calendarEventBlock{
    max-width: 100%;
    width: auto;
}

.calendarEventBlock-day{
    background-color: white;
}

.calendarEventBlock-monthTime{
    background-color: white;
    padding-right: 20px;
}

.calendarEventBlock-monthTime > span{
    display: block;
}

.calendarEventBlock-content{
    color: white;
    text-align: left;
    padding: 8px 20px;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 22px;
    line-height: 2.2rem;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.calendarEventBlock-day{
    color: #2f2f2f;
    font-size: 58px;
    font-size: 5.8rem;
    font-weight: 200;
    padding: 3px 10px 0 15px;
}

.calendarEventBlock-month{
    text-transform: uppercase;
    font-size: 18px;
    font-size: 1.8rem;
    text-align: left;
    font-weight: 400;
}

.calendarEventBlock .separator-single{
    margin: 4px 0;
    width: 100%;
}

.calendarEventBlock-time{
    text-transform: uppercase;
    font-weight: 200;
    text-align: left;
}


.bgOverlay{
    background-color: rgba(0, 0, 0, 0.3);
}

/* end arrow */

[class*='endArrow-']{
    display: block;
    background-repeat: no-repeat;
    background-position: 100% 68%;

}

.endArrow-white{
    background-image: url("img/arrow_white.png");
}



/* Diagonal intro */

.diagonalIntro-whole{
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    width: 70%;
    background-color: black;
}

.diagonalIntro-whole .darkOverlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.diagonalIntro-cut{
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 450px;
    overflow: hidden;
    z-index: 1;
}


.leftCut .diagonalCut-outer,
.leftCut .diagonalCut-inner
{
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}


.leftCut .diagonalCut-outer{
    height: 200%;
    width: 200%;
    overflow: hidden;
    -webkit-transform: rotate(22deg);
       -moz-transform: rotate(22deg);
        -ms-transform: rotate(22deg);
         -o-transform: rotate(22deg);
            transform: rotate(22deg);

    -webkit-box-shadow: -1px -1px 1px 0px white; /* makes edge nicer in webkit */
}

.diagonalIntro-dark .leftCut .diagonalCut-outer{
    -webkit-box-shadow: none;
}


.diagonalIntro-dark .mediumTitle-subTitle{
    color: white;
    font-size: 30px;
    font-size: 3rem;
    font-weight: 200;
    margin-top: 25px;
}

.diagonalIntro-dark .pageIntro-overlay-description{
    color: white;
    max-width: 620px;
    padding-right: 50px;
    margin-bottom: 25px;
}


.leftCut .diagonalCut-inner
{
    height: 50%;
    width: 50%;
    -webkit-transform: rotate(-22deg);
       -moz-transform: rotate(-22deg);
        -ms-transform: rotate(-22deg);
         -o-transform: rotate(-22deg);
            transform: rotate(-22deg);
}

.no-csstransforms .sosSante-logoOffset{
    margin: auto;
}

.diagonalIntro-noContent{
    height: 450px;
}


.no-csstransforms .diagonalIntro-cut{
    width: 50%;
}

.diagonalIntro-big .diagonalIntro-cut{
    height: 100%;
}

.no-csstransforms .diagonalCut-outer,
.no-csstransforms .diagonalCut-inner
{
    -webkit-box-shadow: none;
    height: 100%;
    width: 100%;
}



.diagonalIntro{
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    width: 100%;
    width: calc(100% + 1px);
    
}



.diagonalCut-rightBg{
    background-size: cover;
    background-repeat: no-repeat;
    position:absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* Related links */
.relatedLinks{
    margin-top: 45px;
}

.relatedLinks a{
    font-weight: 400;
    color: #777777;
    display: block;
    margin-bottom: 5px;
}


/* Separator */

.separator{
    height: 0;
    border-top: solid #c6c6c6 1px;
    border-bottom: solid white 1px;
    background: none;
}

.separator-small{
    width:60px;
}

[class*="separatorBlock-"]{
    display: none;
    height: 5px;
    width: 30px;
    background-color: white;
    margin: 5px 0 20px;
}
[class*="separatorBlock-"].xtraSmall{
    width: 15px;
    height: 2px;
    margin-bottom: 10px;
}

.separatorBlock-black{
    background-color: black;
}

.separatorBlock-grey{
    background-color: #bfbfbf;
}

[class*="separatorBlock-"].small{
    width: 20px;
    height: 3px;
}

.separator-single{
    width: 55px;
    height: 1px;
    margin-bottom: 27px;
    background-color: #e5e5e5;
}

.scoreCircleContainer[data-size="big"] .scoreCircle{
    width: 220px;
    height: 220px;
    margin-bottom: 20px;
}

.scoreCircleContainer[data-size="med"] .scoreCircle{
    width: 130px;
    height: 130px;
    margin-bottom: 20px;
}

.scoreCircleContainer[data-size="small"] .scoreCircle{
    width: 100px;
    height: 100px;
    margin-bottom: 20px;
    margin-right: 10px;
}

.scoreCircleContainer[data-size="xSmall"] .scoreCircle{
    width: 70px;
    height: 70px;
    margin-bottom: 20px;
    margin-right: 10px;
}

.scoreCircle-foreground{
    -webkit-transform: translate3d(0, 0, 0);
}

.titleOnImage-sectionName,
.otherSectionPromotion-sectionName
{
    font-size: 30px;
    font-size: 3rem;
    letter-spacing: 2px;
    font-weight: 400;
    padding-bottom: 10px;
    color: white;
}

.titleOnImage-title{
    font-size: 48px;
    font-size: 4.8rem;
    letter-spacing: 8px;
    font-weight: 600;
    margin-left: -2px;
    padding-bottom: 10px;
}

.paragraphOnImage{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
    font-weight: 600;
    color: white;
    padding-bottom: 20px;
    max-width: 600px;
}

/* Custom checkboxes, no JS */

input[type='checkbox'],
input[type='radio']
{
    /*visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;*/
}

.fakeCheckbox{
    width: 30px;
    height: 30px;
    border: solid 3px #b1b1b1;
    display: inline-block;
}

/* One field input */

.oneFieldInput{
    height: 40px;
    width: 100%;
}

.oneFieldInput-textCol{
    vertical-align: top;
}

.oneFieldInput-submitCol{
    width: 30%;
    max-width: 300px;
    vertical-align: top;
}



input[type="text"].oneFieldInput-text{
    height: 40px;
    width: 100%;
    padding: 12px 15px 11px;
    font-size: 14px;
    font-size: 1.4rem;
    letter-spacing: 1px;
}


input[type="submit"].oneFieldInput-submit{
    background-color: #2f2f2f;
    height: 40px;
    width: 100%;
    color: white;
}

/* Price with bullet */
.priceWithBullet{
    margin-bottom: 30px;
}


.priceWithBullet .tableCell{
    vertical-align: top;
    text-align: left;
}

.priceWithBullet-price{
    width: 95px;
    font-size: 36px;
    font-size: 3.6rem;
    font-weight: 200;
    color: #2f2f2f;
}

.priceWithBullet-bullet{
    width: 40px;
    padding-top: 4px;
}

.priceWithBullet-bullet img{
    display: block;
}

.priceWithBullet-content{

}



/*-----------------------------------------*\
    Footer Widgets
\*-----------------------------------------*/

#footerWidgets{
    display: table;
    -webkit-transform: translateZ(0);
}

#footerWidgets h4,
.infoBlock-title,
.progressGraph-title
{
    color: #2f2f2f;
    font-size: 30px;
    font-size: 3rem;
    font-weight: 200;
    letter-spacing: 2px;
}

.widget-titleLink{
    display: block;
    padding-right: 30px;
    background-repeat: no-repeat;
    background-position: 100% 50%;
}

#footerWidgets .separator{
    margin: 20px 0 23px;
}

#footerWidgets h5{
    font-weight: 400;
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 1px;
    padding-bottom: 10px;
}

#footerWidgets p,
#footerWidgets input
{
    font-weight: 400;
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 20px;
    line-height: 2rem;
    letter-spacing: 1px;
    color: #636363;
}

#footerWidgets ul{
    margin-top: 10px;
    display: inline-block;
}

#footerWidgets li
{
    font-weight: 600;
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 20px;
    line-height: 2rem;
    margin-bottom: 10px;
    color: #636363;
}

#footerWidgets .colRow > .tableCell{
    width: 33.3333333333%;
    text-align: left;
    vertical-align: top;
}


#footerWidgets li a
{
    text-transform: uppercase;
    font-weight: 600;
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 20px;
    line-height: 2rem;
    display: block;
    padding-right: 35px;
    background-repeat: no-repeat;
    background-position: 100% 50%;
    color: #636363;
}

/* Footer */
footer,
footer a
{
    color: #959595;
}

footer .svgWrapper path{
    fill: #959595;
}

#footerWidgets{
    background-color: #f1f1f1;
}

#footerWidgets .dark{
    background-color: #e6e6e6;
}




/* Widget - Calendar */

.calendarEvent{
    display: table;
    width: 100%;
}

.calendarEvent-date{
   width: 70px;
}

.calendarEvent-day{
    display: block;
    color: #2f2f2f;
    font-size: 54px;
    font-size: 5.4rem;
    line-height: 41px;
    line-height: 4.1rem;
    text-align: right;
    margin-right: -2px;
}

.calendarEvent-month{
    display: block;
    color: #2f2f2f;
    text-align: right;
}

.calendarEvent-content{
    text-align: left;
    paddng-right: 10px;
}

.calendarEvent .tableCell{
    vertical-align: top;
}

.calendarEvent-ellipsis{
    height: 45px;
}


#footerWidget-newsletterForm{
    margin: 25px 0;
    text-align: right;
}

#footerWidget-newsletterForm-emailField{
    width: 100%;
    border: solid #d7d7d7 1px;
    padding: 15px 10px;
}

#footerWidget-newsletterForm-submit{
    text-transform: uppercase;
    margin-top: 10px;
    font-weight: 400;
    font-size: 12px;
    font-size: 1.2rem;
    padding-right: 35px;
    background-repeat: no-repeat;
    background-position: 100% 50%;
}



/*-----------------------------------------*\
    Footer
\*-----------------------------------------*/

footer{
    position: relative;
    display: table;
    width: 100%;
    height: 110px;
    padding: 0 20px;
    -webkit-transform: translate3d(0, 0, 0);
}

footer ul{
    padding-bottom: 6px;
}

footer li{
    display: inline-block;
}

footer img{
    position: relative;
    display: block;
    top: 2px;
    width: 18px;
    height: auto;
}

footer .separator{
    border: none;
    padding: 0 27px;
    display: inline;
    background: none;
}

footer a{
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 2px;
    text-transform: uppercase;
}

footer svg{
    position: relative;
    width: 21px;
}

footer .svgWrapper{
    position: relative;
    height: 23px;
    top: 4px;
}

[class*='footerWidget-calendar']{
    padding: 50px 60px;
}

/*[class*='footerWidget-']{
    padding: 50px 60px;
}*/


/*-----------------------------------------*\
    Parsley
\*-----------------------------------------*/


#footerWidgets ul.parsley-errors-list,
.parsley-errors-list
{
    margin-top: 5px;
    display: block;
}

.parsley-errors-list li{
    font-size: 14px !important;
    font-size: 1.4rem !important;
    font-weight: 400 !important;
    text-transform: none;
    color: #e21c39 !important;
    background-image: none !important;
    padding-left: 0 !important;
}

.oneFieldInput .parsley-errors-list li{
    text-align: left;
}

/*-----------------------------------------*\
    Home
\*-----------------------------------------*/


.pageSection{
    /*height: 900px;*/
     height: 650px;
    position: relative;
    width:100%;
    width: calc(100% + 1px);

}

.pageSection.pageSection-last{
    /*height: 1270px;*/
     height: 1100px;
}

.pageSection.pageSection-last .pageSection-content{
    /*bottom: 400px;*/
     bottom: 235px;
    margin-bottom: 0;
}

.pageSection-bgImage{
    background-position: 25% 50%;
}

.pageSection-content{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    width: calc(100% + 1px);
    height: 430px;
    margin-bottom: -215px;
    z-index: 1;
}

.pageSection-message{
    float: left;
    width: 32%;
    background-color: #e6e6e6;
    color: #2f2f2f;
    position: relative;
    z-index: 1;
}

/* Message box */

.pageSection-message{
    padding: 45px 50px;
    height: 430px;
}

.pageSection-message-title{
    font-size: 30px;
    font-size: 3rem;
    line-height: 35px;
    line-height: 3.5rem;
    font-weight: 200;
    letter-spacing: 2px;
}

.pageSection-message-title .lastWord{
    display: block;
    font-size: 45px;
    font-size: 4.5rem;
    line-height: 25px;
    line-height: 2.5rem;
    background-image: url("img/arrow_black.png");
    background-repeat: no-repeat;
    background-position: 100% 100%;
    vertical-align: bottom;
    margin: 11px 0 30px;
    padding-right: 30px;
}


.pageSection-first .lastWord,
.pageSection-rightAlign .lastWord,
.pageSection-last .pageSection-message-title .lastWord
{
    background-image: url("img/arrow_white.png");
}

.pageSection-message .separator{
    margin: 35px 0 35px;
}

.pageSection-message-content{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 17px;
    line-height: 1.7rem;
    font-weight: 400;
    letter-spacing: 1px;
    height: 150px;
    color: #676767;
}

.pageSection-first .pageSection-message-content,
.pageSection-rightAlign .pageSection-message-content,
.pageSection-last .pageSection-message-content
{
    color: white;
}




/* News preview */

.articlePreviews{
    float: left;
    width: 68%;
}

.articlePreview{

    height: 215px;
    overflow: visible;
    position: relative;
    width: 100%;
    text-align: left;
}

.firstRow .articlePreview{
    z-index: 1;
}

.articlePreview-header .icon-arrow{
    width: 17px;
    height: auto;
}

.articlePreview-header h3{
    font-weight: 400;
    overflow: hidden;
}

.articlePreview-title,
.articlePreview-subTitle,
.articlePreview-category,
.articlePreview-exerptTitle
{
    color: #737373;
    font-size: 13px;
    font-size: 1.3rem;
    text-align: left;
    font-weight: 400;
    letter-spacing: 1px;
    text-align: left;
    line-height: 14px;
    line-height: 1.4rem;
}


.articlePreview-title{
    padding: 0 20px;
}


.articlePreview-top{
    height: 215px;
    background-color: white;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.articlePreview-header{
    height: 80px;
    width: 100%;
    /*width: calc(100% + 1px);*/
}

.articlePreview-imageContainer{
    height: 135px;
    width: 100%;
    width: 100%;
    width: calc(100% + 1px);
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0);
}

.articlePreview-image{
    position: relative;
    height: 135px;
    width: 100%;
    background-position: 50% 50%;
}


.articlePreview-content{
    height: 215px;
    padding: 23px 30px;
    position: absolute;
    top: 0;
    background-color: #e6e6e6;
    width: 100%;
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0);
}

.articlePreview-arrow{
    width: 80px;
}

.articlePreview .separator{
    width: 36px;
    margin: 10px 0;
}

.articlePreview-excerpt{
    height: 105px;
}

.articlePreview-excerpt p{
    color: #605f5f;
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 1px;
    line-height: 20px;
    line-height: 2rem;
    overflow: hidden;
}

.articlePreview.featured .articlePreview-top{
    margin-top: -215px;
}

.isOnline .expertOnline{
    opacity: 1;
}

.isOnline .expertOnline-circle,
.isOnline.pageDescription .expertOnline
{
    display: inline-block;
}



.expertOnline{
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #64d44e;
    color: white;
    text-transform: uppercase;
    font-size: 12px;
    padding: 10px 20px;
    margin-top: 25px;
}




/*-----------------------------------------*\
    Search results & Outils
\*-----------------------------------------*/

.searchResultIntro .bigTitle{
    color: #2f2f2f;
}

.searchResultsSection{
    position: relative;
    clear: both;
}

.searchResult{
    width: 25%;
}

.searchResultIntro .bigTitle{
    padding: 50px 0 10px;
}

.searchResultIntro p{
    text-transform: uppercase;
    font-weight: 200;
    padding: 0 0 50px;
    letter-spacing: 1px;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 16px;
    line-height: 1.6rem;
}

.searchResultIntro img{
    padding-right: 10px;
}


.searchResultsSection-sectionName{
    font-size: 20px;
    font-size: 2rem;
    text-transform: uppercase;
    font-weight: 400;
    padding: 84px 0 73px;
    color: #868686;
    letter-spacing: 2px;
}

.searchResultsSection-sectionName.first{
    padding: 50px 0 55px;
}


.searchResults-moreResults{
    width: 100%;
    text-transform: uppercase;
    padding: 12px 0;
    font-size: 12px;
    font-size: 1.2rem;
    letter-spacing: 1px;
}

.searchResults-moreResults .ajax-isLoading,
.searchResults-moreResults.loading .ajax-notLoading
{
    display: none;
}

.searchResults-moreResults.loading .ajax-isLoading
{
    display: block;
}

.searchResults-buttonWrapper{
    overflow: hidden;
    width: 100%;
}

.animatedResultsContainer.isWaitingForNewArticles{
    position: relative;
    overflow: hidden;
}

/*-----------------------------------------*\
    User Content
\*-----------------------------------------*/


.textColumns-2{
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;

    -webkit-column-gap: 50px;
       -moz-column-gap: 50px;
            column-gap: 50px;
}

.csscolumns [class*="textColumns-"] > img{
    width: 100%;
    height: auto;
    display: block;
}

.no-csscolumns .userContent p img{
    float: left;
    clear: both;
    padding: 20px 30px 20px 0;
}

.no-csscolumns .userContent > img{
    clear: both;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.pagePadding{
    padding: 50px 0 100px;
}

.userContent > *{
    padding-bottom: 25px;
}

.userContent h2,
.userContent h3,
.userContent h4,
.userContent h5,
.userContent h6
{
    color: #2f2f2f;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: 400;

    -webkit-column-break-after: avoid;
       -moz-column-break-after: avoid;
            column-break-after: avoid;

    -webkit-column-break-inside: avoid;
       -moz-column-break-inside: avoid;
            column-break-inside: avoid;


}

.userContent ul,
.userContent ol,
.userContent p
{
    -webkit-column-break-before: avoid;
       -moz-column-break-before: avoid;
            column-break-before: avoid;
}


.userContent p,
.userContent li,
.userContent
{
    color: #777777;
}

.userContent a{
    text-decoration: underline;
}

.userContent a,
.userContent li,
.userContent p,
.userContent
{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
}

.userContent ul,
.userContent ol
{
    padding-top: 0;
    margin-left: 30px;
}

.userContent ul li{
    padding-left: 15px;
    background-repeat: no-repeat;
    background-position: 0% 49%;
}

.userContent ol li{
    list-style-type: decimal;
}

.userContent img{
    max-width: 100%;
}

.userContent sup{
    position: relative;
    bottom: 2px;
}


/*-----------------------------------------*\
    Related Content
\*-----------------------------------------*/

.relatedArticles{
    -webkit-box-shadow: 0px -6px 30px 0px rgba(50, 50, 50, 0.1);
       -moz-box-shadow: 0px -6px 30px 0px rgba(50, 50, 50, 0.1);
            box-shadow: 0px -6px 30px 0px rgba(50, 50, 50, 0.1);
    background-color: #2f2f2f;
    width:100%;
    width: calc(100% + 1px);
}

.relatedArticles-messageWrapper{
    height: 215px;
    background-color: #2f2f2f;
    color: white;
    width: 100%

}

.relatedArticles-message{
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    color:white;
}

.relatedArticles-message{
    font-size: 30px;
    font-size: 3rem;
    font-weight: 200;
    line-height: 33px;
    line-height: 3.3rem;
    letter-spacing: 1px;
    text-align: center;
}

.relatedArticles-messageContainer{
    text-align: left;
    width: 67%;
    margin: auto;
    display: block;
}

.relatedArticles-message .lastWord{
    font-size: 40px;
    font-size: 4rem;
    line-height: 55px;
    line-height: 5.5rem;
    font-weight: 400;
}

.relatedArticles-message .arrowBackground{
    width: 290px;
    display: block;
    background-repeat: no-repeat;
    background-position: 100% 50%;
    background-image: url("img/arrow_white.png");
}

.relatedArticles-message .inlineBlock{
    text-align: left;
}

.relatedArticles .articlePreview{
    float: left;
    width: 25%;
}

.relatedArticles .articlePreview-content{
    display: none;
}

/* Exception */
@media screen and (max-width: 1360px) and (min-width: 1200px){
    .relatedArticles-message{
        font-size: 25px;
        font-size: 2.5rem;
        line-height: 31px;
        line-height: 3.1rem;
    }

    .relatedArticles-message .lastWord{
        font-size: 35px;
        font-size: 3.5rem;
        line-height: 45px;
        line-height: 4.5rem;
    }

    .relatedArticles-message .arrowBackground
    {
        width: 250px;
    }
}



/*-----------------------------------------*\
    Personnal health report
\*-----------------------------------------*/



.healthReport-subScores svg{
    float: left;
}

.androidSvgFix{
    background-position: 50% 50%;
    background-repeat: no-repeat;
    display: inline-block;
}


.icon-heartBeat{
    background-image: url("img/heartBeat.svg");
    width: 30px;
    height: 20px;

}

.icon-brain{
    background-image: url("img/brain.svg");
    width: 24px;
    height: 20px;
}

.icon-people{
    background-image: url("img/people.svg");
    width: 26px;
    height: 16px;
}

.icon-money{
    width: 25px;
    height: 25px;
    background-position: 50% 50%;
    background-image: url("img/money.svg");
}

.healthReport-subScoreTitle .androidSvgFix{
    margin-top: 5px;
}


.healthReport-subScoreTitle{
    text-transform: uppercase;
    font-size: 11px;
    font-size: 1.1rem;
    line-height: 14px;
    line-height: 1.4rem;
    color: #cbcbcb;
    padding: 25px 0 10px;
    letter-spacing: 1px;
}





/*-----------------------------------------*\
    Health details
\*-----------------------------------------*/

#page-healthReport .linkBlock {
    margin-top: 20px;
}

.healthDetail-intro-scoreCol{
    width: 170px;
    vertical-align: top;
}

.healthDetail-intro-scoreCol .scoreCircle{
    margin: 0;
}

.healthDetail-intro-infoCol{
    text-align: left;
}

.healthDetails-all{
    min-height: 700px;
}


.healthDetails{
    background-color: #e6e6e6;
    position: absolute;
    top: 0;
    left: 0;
}

.healthDetail{
    background-color: #e6e6e6;
    padding: 35px 45px;
    cursor: pointer;
    text-align: left;
    width: 33.3333333333%;
    border-bottom: solid #cbcbcb 1px;
}

.healthDetail.border-left,
.healthDetail.border-left-desktop
{
    border-left: solid #cbcbcb 1px;
}

.healthDetail .separator-small{
    margin-bottom: 25px;
}


.healthReport-feedBack {
    font-size: 20px;
    font-size: 2em;
    font-weight: 200;
    text-transform: uppercase;
}

.health-feedbackDetails{
    height: 150px;
    padding-bottom: 30px;
}

.health-feedbackDetails p{
    color: #2f2f2f;
}

.healthDetail .genericContent-title{
    font-weight: 200;
    letter-spacing: 2px;
}

.healthDetails-all .svgWrapper{
    display: inline-block;
    position: relative;
    top: 4px;
    margin-left: 10px;
}

.healthDetail svg{
    fill: #2f2f2f;
}

.healthDetails-all .svgApple{
    fill: none;
    stroke: #2f2f2f;
    width: 22px;
    height: 25px;
}

.svgScale{
    width: 22px;
    height: 22px;
}

.svgHeart{
    width: 22px;
    height: 21px;
}

.svgWeight{
    width: 35px;
    height: 22px;
}

.svgMoon{
    width: 20px;
    height: 23px;
}

.svgWrapper-graph{
    height: 28px;
}

.svgGraph{
    width: 60px;
    height: 60px;
    margin-top: -17px;
    margin-left: 10px;
}

.close-popup {
    position: absolute;
    width: 29px;
    height: 29px;
    display: block;
    background: url("img/popup-close.png");
    right: 30px;
    top: 30px;
}

.healthReport-popup {
    position: relative;
    float: left;
    display: none;
    width: 100%;
    min-height: 700px;
    background-color: rgba(0, 0, 0, 0.5);
}

.healthDetail{
    height: 350px;
}

.healthDetail-linkCell{
    display: table;
    border: none;
}

.healthDetails-all .genericContent-title{
    text-transform: uppercase;
}

.healthReport-popup .genericContent-title{
    letter-spacing: 2px;
    font-size: 35px;
    font-size: 3.5rem;
    line-height: 40px;
    line-height: 4rem;
    font-weight: 200;
    padding-bottom: 15px;
    letter-spacing: 2px;
}

.healthDetail .linkBlock{
    background-color: rgba(0, 0, 0, 0.30);
}

.healthReport-popup-leftCol{
    background-color: white;
}

.healthReport-popup-rightCol{
    background-color: #f0f0f0;
}


.healthReport-popup-rightCol,
.healthReport-popup-leftCol
{
    text-align: left;
    vertical-align: top;
    padding: 80px 5%;
}


.healthReport-popup-leftCol .svgApple{
    width: 26px;
    height: 30px;
}

.healthReport-popup-leftCol .svgWrapper{
    top: 2px;
}

.healthReport-popup .separator{
    margin-bottom: 20px;
}

.healthReport-feedBackPoints td.left{
    padding-right: 10px;
}

.healthReport-feedBackPoints td.right{
    padding-left: 10px;
}

.healthReport-feedBackPoints li{
    font-size: 20px;
    font-size: 2rem;
    line-height: 37px;
    padding-left: 50px;

    text-transform: uppercase;
}

.healthReport-popup .linkBlock{
    margin: 20px auto;
    display: inline-block;
    font-size: 20px;
    font-size: 2rem;
}

.healthReport-popup-leftCol .arrowRight{
    top: 40%;
    opacity: 1;
    margin: -10px -15px 0 0;
    border-bottom: 15px solid transparent;
    border-left: 15px solid white;
    border-top: 15px solid transparent;
}


/*-----------------------------------------*\
    Sos Santé
\*-----------------------------------------*/

.sosSante-logo{
    display: block;
    margin: auto;
    width: 440px;
    margin: auto;
}

.sosSante-logoOffset{
    margin-left: 120px;
    margin-bottom: 5px;
}

#page-sosSante .diagonalCut-inner{
    background-color: white;
}

.contentBrowser{
    min-height: 850px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    -webkit-transform: translate3d(0, 0, 0);
}

.contentBrowser-categoriesTitle{
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: 400;
    color: white;
    background-color: #2f2f2f;
    padding: 21px 20px;
    height: 60px;
}

.contentBrowser-categoryItem{
    display: block;
    width: 100%;
    text-align: left;
    font-size: 13px;
    font-size: 1.3rem;
    text-transform: uppercase;
    color: #9b9b9b;
    letter-spacing: 1px;
    padding-top: 18px;
    padding-bottom: 16px;
    position: relative;
}

.contentBrowser-group,
.contentBrowser-categoryItem,
.contentBrowser-subCategories
{
    background-color: white;
    border-top: 1px solid #e1e1e1;
}

.contentBrowser-groupName{
    cursor: pointer;
}

.noBorder .contentBrowser-groupName{
    border-bottom: 1px transparent;
}

.contentBrowser-group.first,
.contentBrowser-categoryItem.first
{
    border-top: none;
}

[class*="contentBrowser-icon-"],
.contentBrowser-categoryItem
{
    padding-left: 30px;
}

.contentBrowser-categoryItem
{
    padding-right: 30px;
}

.contentBrowser-subCategories{
    display: none;
}

.rightArrowWrapper{
    position: absolute;
    display: inline-block;
    height: 100%;
    top: 0;
    right: 0;
    width: 30px;

}

.isOpen .contentBrowser-subCategories,
.openOnLoad .contentBrowser-subCategories
{
    display: block;
}

[class*="contentBrowser-icon-"]
{
    width: 70px;
}

.contentBrowser-arrow{
    width: 40px;
}

.contentBrowser-arrow{
    background-repeat: no-repeat;

}

.contentBrowser-title{
    text-align: left;
    font-size: 15px;
    font-size: 1.5rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 400;
    padding: 34px 0 32px;
}

.contentBrowser-categoriesCol,
.contentBrowser-selectorCol,
.contentBrowser-contentCol
{
    vertical-align: top;
    padding-bottom: 20px;
}

/* too big to allow arrows and overflow */
.contentBrowser-categoriesCol,
.contentBrowser-selectorCol,
.contentBrowser-widthForArrows
{
    width: 350px;
}

.contentBrowser-contentCol{
    overflow: hidden;
}

#recipesList{
    position: relative;
    width: 100%;
    margin-left: -110%;
}

.recipe-preview{
    display: block;
    position: relative;
    padding: 17px 0 5px;
    border-bottom: solid 1px #d1494d;
    z-index: 1;
}


.recipe-preview,
#recipe
{
    -webkit-box-shadow: 10px 0px 10px 0px rgba(50, 50, 50, 0.1) inset;
       -moz-box-shadow: 10px 0px 10px 0px rgba(50, 50, 50, 0.1) inset;
            box-shadow: 10px 0px 10px 0px rgba(50, 50, 50, 0.1) inset;
}

.recipe-preview .arrowRight{
    top: 32px;
    opacity: 0;
}

.recipe-thumb{
    width: 100px;
    vertical-align: top;
}

.recipe-thumb img{
    display: block;
    margin: 0;
}

.recipe-content{
    vertical-align: top;
}

.recipe-preview .table{
    padding: 0 15px;
}

.recipe-title{
    text-align: left;
    color: white;
    font-size: 14px;
    font-size: 1.4rem;
    margin-bottom: 8px;
    letter-spacing: 1px;
}

.recipe-preview p{
    text-align: left;
    color: white;
    height: 60px;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 18px;
    line-height: 1.8rem;
    letter-spacing: 1px;
    margin-top: -3px;
    color: #f1b0b9;
}

.contentBrowser-selector .customScroller-hiddenScrollBar{
    height: 560px;
}

.contentBrowser-selector .scrollButton-bottom {
    border-left: solid 1px #bcbcbc;
}


#recipe p{
    color: #8a8888;
    font-size: 14px;
    font-size: 1.4rem;
    margin-bottom: 15px;
}

#recipe .separatorBlock-black{
    margin-bottom: 35px;
}

#recipe .genericContent-subTitle{
    font-size: 14px;
    font-size: 1.4rem;
    color: #2f2f2f;
    letter-spacing: 2px;
    text-shadow: 0 0 #2f2f2f;
}

#recipe li{
    color: #888888;
    margin-bottom: 5px;
    padding-left: 40px;

    background-repeat: no-repeat;
    background-position: 0% 4px;
}

.fakeOrderedList-number{
    font-size: 18px;
    font-size: 1.8rem;
}

.fakeOrderedList-content{
    color: #888888;
    padding-left: 25px;
}

.fakeOrderedList td{
    padding-bottom: 5px;
}

#recipe ul,
#recipe .fakeOrderedList
{
    margin-bottom: 20px;
}

#recipe .alignCentre{
    margin-top: 50px;
}

#recipe{
    margin-left: -110%;
    width: 100%;
}


/*-----------------------------------------*\
    Video player
\*-----------------------------------------*/

#vimeoPlayer{
    width: 100%;
    height: 500px;
    height: calc(100vh - 120px);
}

.videoPlayer{
    background-position: 57% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 500px;
    min-height: calc(100vh - 120px);

}

.videoPlayer .pageDescription{
    position: relative;
    z-index: 1;
}

.featuredVideo-play{
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -60px 0 0 -60px;
    width: 120px;
    height: 120px;
    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
            border-radius: 50%;
    background-color: #2f2f2f;
    background-color: rgba(47, 47, 47, 0.5);
    border: solid white 3px;
    z-index: 1;
}

.featuredVideo-play .svgWrapper{
    width: 40px;
    height: 52px;
    margin: 31px 0 0 44px;
    cursor: pointer;
}

.featuredVideo-play svg{
    fill: white;
}

.videoContainer{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.playlistItem .table{
    background-color: white;
    width: 100%;

}

.playlistItem-title,
.expertList-title
{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 17px;
    line-height: 1.7rem;
    color: #9c9c9c;
    text-transform: uppercase;
    text-align: left;
    padding: 15px 30px;
    border-bottom: solid 1px #e1e1e1;
    min-width:267px;
}

.playlistItem-icon{
    background-color: #e6e6e6;
    width: 80px;
    padding: 30px 0;
    border-bottom: solid 1px #a5a5a5;
}

.playlistItem.last .playlistItem-icon,
.playlistItem.last .playlistItem-title
{
    border-bottom: none;
}

.playlistItem-icon .svgWrapper{
    width: 15px;
    height: 20px;
    margin: auto;
}

.playlistItem-icon svg{
    fill: #2f2f2f;
}

.contentBrowser-playlist{
    position: relative;
    display: inline-block;
    min-height: 0;
    z-index: 2;
}

.contentBrowser-playlist .customScroller-hiddenScrollBar{
    height: 350px;
    height: calc(100vh - 300px);
}

.contentBrowser-playlist.isVideoLoaded{
    opacity: 0.2;
    z-index: 2;
}








/*-----------------------------------------*\
    VIRTUAL YOGA
\*-----------------------------------------*/

.pageIntro-promo{
    z-index: 1;
    -webkit-transform: translate3d(0, 0, 0);
}

.promo-discount{
    margin-top: 20px;
    width: auto;
}


.promo-discount-rebate{
    text-align: center;
    font-size: 55px;
    font-size: 5.5rem;
    font-weight: bold;
    padding: 12px 10px 8px;
}

.promo-discount-text{
    color: #6b6b6b;
    font-size: 24px;
    font-size: 2.4rem;
    background-color: white;
    text-transform: uppercase;
    text-align: left;
    padding: 3px 20px 0;
}

.promoContentOffset{
    width: 50%;
    padding: 50px 25px 80px 0;
    margin-left: 40%;
    position: relative;
    z-index: 1;
}

.promoContentOffset .paragraphOnImage{
    width: 520px;
}

/*-----------------------------------------*\
    Experts
\*-----------------------------------------*/

main#page-experts{
    width:100%;
    width: calc(100% + 1px) !important;
}

.pageIntro-promo.extraHeight .promoContentOffset {
    padding-top: 170px;
    padding-bottom: 200px;
}

.expertOnline-circle{
    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
            border-radius: 50%;
    width: 8px;
    height: 8px;
    margin-left: 8px;
}

.expertList-expert{
    display: block;
}

.expertList-expert .table{
    width: 100%; /* ie */
}

.backgroundCover{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.expertList-expert{
    background-color: white;
    cursor: pointer;
}

.expertList-title{
    border-bottom: solid 1px #e1e1e1;
    background-color: white;
}

.expertList-icon{
    background-color: #2f2f2f;
    width: 80px;
    padding: 30px 0;
    border-bottom: solid 1px #1f1f1f;
}

.last .expertList-icon,
.last .expertList-title
{
    border-bottom: none;
}

.contentBrowser-experts .customScroller-hiddenScrollBar{
    height: 350px;
    height: calc(100vh - 200px);
}

.contentBrowser-experts{
    min-height: 0;
    float: left;
    display: inline-block;
}

.expertContainer{
    padding-bottom: 50px;
}

.pageDescription.pageDescription-red .separator-double{
    width: 50px;
    margin-bottom: 25px;
}

.pageDescription.pageDescription-red ul{
    margin-top: 5px;
}

.pageDescription.pageDescription-red li{
    padding-bottom: 0;
}

.pageDescription .expertOnline{
    position: relative;
    display: none;
}

.pageDescription .expertOnline-circle{
    position: relative;
    bottom: 3px;
}



/*-----------------------------------------*\
    TESTS ET OUTILS
\*-----------------------------------------*/

#page-testsOutils .backToTopWrapper {
    background-color: transparent;
    background-position: 50% bottom;
    background-size: cover;
    border-top: none;
}

/*-----------------------------------------*\
    CHRONIQUES
\*-----------------------------------------*/

#page-chroniques .backToTopWrapper{
    background: transparent;
    border-top: none;
}

/*-----------------------------------------*\
    ENTERPRISE
\*-----------------------------------------*/

.linkBlockWrapper{
    padding: 40px 20px 38px;
    text-align: center;
}

.linkBlockWrapper .linkBlock-message{
    padding-top: 12px;
    padding-bottom: 9px;
    background-color: #cb1933;
}

.linkBlockWrapper .linkBlock-icon{
    height: 75px;
    width: 75px;
}


/*
.contact-us h3 {
    color: #e21c39;
    margin-bottom: 30px;
}

.contact-photo {
    vertical-align: top;
    padding-right: 20px;
}

.contact-text {
    vertical-align: top;
    text-align: left;
    color: #8d8d8d;
}

.contact-text h4 {
    color: #2f2f2f;
    font-size: 1.4rem;
    margin-bottom: 15px;
}

.dark h4 {
    color: white;
}

.contact-text p {
    margin-bottom: 15px;
}
*/

/*-----------------------------------------*\
    FAQ
\*-----------------------------------------*/

.question {
    position: relative;
    padding: 40px 0 25px;
    cursor: pointer;
    border-top: solid #d3d3d3 1px;
    -webkit-transform: translateZ(0); /* Fix chrome artifact */
}

.question.first{
    border-top: none;
}

.qaWrapper .genericContent-title {
    padding-bottom: 10px;
    padding-right: 100px;
    position: relative;
    font-size: 20px;
    font-size: 2rem;
    line-height: 25px;
    line-height: 2.5rem;
    letter-spacing: 2px;
}

.answer {
    display: none;
}

.answer p {
    margin-bottom: 10px;
    padding-right: 50px;
    line-height: 18px;
    line-height: 1.8rem;
}

.faqToggle {
    display: block;
    width: 26px;
    height: 25px;
    position: absolute;
    right: 0;
    top: 6px;
}

.faqOpen,
.faqClose
{
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    margin: auto;
    width: 100%;
}

.faqClose{
    opacity: 0;
}


/*-----------------------------------------*\
    CONTACT
\*-----------------------------------------*/

.formOnBg{
    padding: 80px 0;
}

.isLoggedOut-pageIntro{
    padding: 120px 0 55px;
}

.formOnBg input[type="text"]{
    border: solid white 3px;
    background: none;
    color: white;
}

.formOnBg textarea {
    width: 100%;
    height: 197px;
    background-color: transparent;
    border: solid 3px white;
    color: white;
    outline: none;
    font-size: 14px;
    font-size: 1.4rem;
    overflow: auto;
}

.formOnBg input[type="text"],
.formOnBg textarea
{
    width: 100%;
    padding: 11px 20px;
    font-size: 17px;
    font-size: 1.7rem;
    letter-spacing: 1px;
}

.formOnBg .parsley-errors-list{
    padding-top: 0px;
    height: 15px;
}

.formOnBg .cell-1-2{
    vertical-align: top;
}

.formOnBg .cell-1-2.left{
    padding-right: 20px;
}

.formOnBg .table{
    width: 100%; /* ie9 */
}

.svgHandshake{
    position: relative;
    display: block;
    width: 35px;
    height: 25px;
    margin: 2px 0 0;
}

.linkBlock-login{
    float: right;
}

.contactForm,
.contact-content
{
    text-align: left;
    vertical-align: top;
}

.contact-photo{
    width: 175px;
    vertical-align: top;
}

.contact-photo img{
    display: block;
}

.bigger .genericContent-title{
    font-size: 30px;
    font-size: 3rem;
}

.bigger .genericContent-subSubTitle{
    font-size: 18px;
    font-size: 1.8rem;
}

.blackAndWhite-intro .genericContent-subSubTitle{
    padding-bottom: 30px;
}

.blackAndWhite-intro .blackAndWhiteCol{
    padding-top: 70px;
    padding-bottom: 75px;
}

.blackAndWhite-intro .genericContent-subSubTitle{
    padding-top: 20px;
}

.contactForm .parsley-errors-list{
    text-align: left;
    margin-bottom: 5px;
}


/*-----------------------------------------*\
    LOGIN
\*-----------------------------------------*/

.loginForm{
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 50px 60px;
    background-color: white;
    width: 25%;
    z-index: 1;
}

.login-offsetIntro{
    margin-left: 475px;
}

a.loginForm-forgotPassword{
    display: block;
    text-transform: uppercase;
    font-size: 13px;
    font-size: 1.3rem;
    color: #a9a9a9;
}

.loginForm .parsley-errors-list,
.loginForm .loginForm-forgotPassword
{
    margin-bottom: 20px;
}

.loginForm input,
.forgotPasswordForm input
{
    border: solid #bebebe 3px;
    font-size: 14px;
    font-size: 1.4rem;
    padding: 9px 15px 9px;

}

.loginForm input,
.loginForm button,
.forgotPasswordForm input,
.forgotPasswordForm button
{
    width: 100%;
    margin-bottom:10px;
    max-width:445px;
}

.forgotPasswordForm
{
    width: 500px;
    height:200px;
    z-index: 1;
    margin-left:auto;
    margin-right:auto;
}

.whitePlaceholder::-webkit-input-placeholder{
    color: white;
}

.whitePlaceholder:-moz-placeholder{
    color: white;
}

.whitePlaceholder::-moz-placeholder{
    color: white;
}

.whitePlaceholder:-ms-input-placeholder{
    color: white;
}

/*-----------------------------------------*\
    Calendar
\*-----------------------------------------*/

.calendar{
    padding: 20px 0 20px;
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}

.month{
    width: 33.3333333333%;
    float: left;
}

.month-content{
    margin-right: 8px;
    margin-bottom: 8px;
    background-color: white;
    padding-bottom: 17px;
    border-top: solid white 3px;
    border-bottom: solid white 3px;
}

.month.thirdInRow .month-content{
    margin-right: 0;
}

.month-name{
    color: #2f2f2f;
    text-transform: uppercase;
    font-size: 30px;
    font-size: 3rem;
    text-align: center;
    font-weight: 200;
    padding: 22px 0 25px;
    letter-spacing: 3px;
}

.month th,
.month td
{
    text-align: center;
    font-weight: 200;
    color: #2f2f2f;
    text-transform: uppercase;
    text-shadow: 0 0 #2f2f2f;
}

.month th{
    font-size: 12px;
    font-size: 1.2rem;
    padding: 2px 0;
}

.month td{
    text-align: center;
}

.calendar{
    -webkit-transform: translate3d(0, 0, 0);
}

.calendar-day{
    padding-top: 5px;

    width: 26px;
    height: 26px;
    text-align: center;

    margin: auto;

    font-size: 16px;
    font-size: 1.6rem;
    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
            border-radius: 50%;

}

.calendar-weekdays{
    border-top: solid #e6e6e6 3px;
    border-bottom: solid #e6e6e6 3px;
}

.calendar-weekdays th{
    padding: 13px 0 11px;
}

.month td{
    padding-bottom: 4px;
}


.calendar .spacer{
    width: 20px;
}

.calendar-days{
    margin-top: 20px;
}

.calendar-day.hasEvent{
    cursor: pointer;
}


.calendarDisplayTypes{
    margin: 50px 0;
    text-align: center;
}

.calendarDisplayType{
    display: inline-block;
    margin-right: 1px;
    padding: 25px 45px;
    background-color: #e6e6e6;
    color: #2f2f2f;
    font-size: 16px;
    font-size: 1.6rem;
    text-transform: uppercase;

}

.calendarDisplayType.last{
    margin-right: 0;
}

.calendarActions{
    position: absolute;
    top: 0;
    right: 0;
}

.calendarAction{
    width: 70px;
    height: 70px;
    background: white;
    position: relative;
}

.calendarAction-addEvent{
    margin-right: 1px;
}

.calendarAction .svgWrapper{
    vertical-align: middle;
    position: relative;
}

.calendarAction svg{
    display: table-cell;
    vertical-align: middle;
}

/* Current month */

.isCurrentMonth .month-content{
    border: solid white 3px;
    background-color: rgba(47, 47, 47, 0.3);
    color: white;
}


.isCurrentMonth th,
.isCurrentMonth .month-name,
.isCurrentMonth .calendar-day
{
    color: white;
    text-shadow: 0 0 white;
}

.isCurrentMonth .spacer{
    width: 17px;
}

/* Intro */

.calendarHeader{
    z-index: 1;
    -webkit-transform: translate3d(0, 0, 0);
    overflow: hidden;
}

.calendarHeader .darkOverlay{
    height: 200%;
}

.calendarHeader-left{
    width: 66%;
    width: calc(66% + 1px);
}

.calendarHeader-right{
    width: 34%;
}


.calendarHeader-left,
.calendarHeader-right
{
    text-align: left;
    vertical-align: top;
}

.calendarHeader-leftContent,
.calendarHeader-rightContent
{
    width: 80%;
    margin: auto;
    position: relative;
    z-index: 1;
    padding-top: 50px;
    padding-bottom: 70px;
}

/*-----------------------------------------*\
    Welcome page
\*-----------------------------------------*/

.welcome-col{
    display: table-cell;
    width: 33.3333333333%;
    width: 33.3333333333vw;
    vertical-align: top;
}

.welcomeBlock{
    overflow: hidden;
    height: 350px;
}

.welcomeBlock-icon{
    position: relative;
    height: 126px;
    width: 126px;
    fill: #2e2e2e;
    width: 126px;
    margin: 0 auto;
}

.welcomeBlock-iconWrapper{
    position: relative;
}

.welcomeBlock-rightBg,
.welcomeBlock-leftBg
{
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #e6e6e6;
}

.welcomeBlock-rightBg{
    right: 50%;
    margin-right: 62px;
}

.welcomeBlock-leftBg{
    left: 50%;
    margin-left: 62px;
}

.welcomeBlock .generatedSvg{
    display: block;
    position: relative;
    height: 100%;
    width: 100%;
    outline: solid #e6e6e6 2px;
}

.welcome-col.light .welcomeBlock .generatedSvg{
    outline: solid #F5F5F5 2px;
}

.welcomeBlock-top{
    height: 69px;
    margin-bottom: -1px;
    width: 100%;
}

.welcomeBlock-bottom{
    text-align: center;
    padding-bottom: 20px;
}

.welcomeBlock-top,
.welcomeBlock-bottom,
.welcomeBlock-empty
{
    background-color: #e6e6e6;
    color: #2f2f2f;
}


.welcome-backgroundSvg{
    fill: #e6e6e6;
}

.welcome-col.light .welcome-backgroundSvg{
    fill: #F5F5F5;
}

#welcome-links{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    width: 100vw;
}

.svg-welcomeIcon{
    position: absolute;
    top: 0;
    left: 0;
    width: 126px;
    height: 126px;
}

.welcomeBlock-callToAction{
    font-weight: 200;
    font-size: 15px;
    font-size: 1.5rem;
    padding: 25px 0 10px;
    letter-spacing: 1px;
}

.welcomeBlock-sectionName{
    font-weight: 400;
    font-size: 24px;
    font-size: 2.4rem;
    letter-spacing: 4px;
}

.welcomeBlock-bottom .welcomeBlock-arrow{
    margin: 35px 0 15px -20px;
    opacity: 0;
}

.welcome-intro{
    padding-bottom: 450px;
    padding-top: 97px;
    position: relative;
}

.welcome-intro .pageSection-splash{
    margin: 0;
}


.welcome-col.light .welcomeBlock-top,
.welcome-col.light .welcomeBlock-bottom,
.welcome-col.light .welcomeBlock-empty,
.welcome-col.light .welcomeBlock-rightBg,
.welcome-col.light .welcomeBlock-leftBg
{
    background-color: #F5F5F5;
}

/*-----------------------------------------*\
    Quiz
\*-----------------------------------------*/

.quiz .linkBlock-leftArrow{
    margin-right: 20px;
}

.quiz-questionCol,
.quiz-questionInfoCol
{
    vertical-align: top;
    color: white;
}

.quiz-questionCol{
    text-align: left;
    width: 65%;
    padding-right: 5%;
}

.quiz-questionWrapper{
    text-transform: uppercase;
    color: white;
    font-size: 18px;
    font-size: 1.8rem;
    padding-bottom: 15px;
    padding-right: 7px;
    padding-top: 80px;
    letter-spacing: 2px;
    margin-right: -4px;
}

.quiz-question{
    font-size: 48px;
    font-size: 4.8rem;
    font-weight: 400;
    letter-spacing: 4px;
    margin-top: -6px;
}

.subTitle-grey{
    color: #b6b6b6;
    text-transform: uppercase;
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: 0% 2px;
    font-weight: 400;
    font-size: 14px;
    font-size: 1.4rem;
    margin-bottom: 40px;

}

.quiz-answer{
    margin-bottom: 15px;
}

.fakeCheckbox-boxCol{
    display: table-cell;
    width: 40px;
    vertical-align: middle;
}

.fakeCheckbox-labelCol{
    display: table-cell;
    vertical-align: middle;
}


.fakeCheckboxLabel{
    display: block;
    font-size: 20px;
    font-size: 2rem;
    line-height: 22px;
    line-height: 2.2rem;
    text-transform: uppercase;
    color: #c0c0c0;
}

.quiz-controls{
    margin: 50px 0 70px;
}

.linkBlock-nav{
    opacity: 0.45;
}

/* Quiz Progress */

.quiz-questionInfoCol{
    text-align: right;
    padding-right: 15px;
    color: white;
    min-width: 200px;
}

.quiz-progress-left,
.quiz-progress-right
{
    float: right;
}

.quiz-questionNo{
    font-size: 100px;
    font-size: 10rem;
    line-height: 72px;
    line-height: 7.2rem;
    font-weight: 200;
    padding-bottom: 5px;
    margin-left: 15px;
    float: right;
}

.quiz-totalQuestions{
    font-size: 38px;
    font-size: 3.8rem;
    line-height: 53px;
    line-height: 5.3rem;
    letter-spacing: 5px;
    color: rgba(255, 255, 255, 0.76);
    float: right;
    clear: both;
}

.quiz-progress-n{
    font-size: 30px;
    font-size: 3rem;
    margin-right: 4px;
    font-weight: 400;
    line-height: 20px;
    line-height: 2rem;
}

.quiz-progress sup{
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 13px;
    line-height: 1.3rem;
    padding-bottom: 1px;
}

.quiz-progress .separator-single{
    background-color: rgba(255, 255, 255, 0.3);
    float: right;
    clear: both;
    margin-bottom: 0;
    width: 46px;
    margin-right: 8px;
}

/* Quiz nav */
.quiz-nav{
    width: 20%;
    vertical-align: top;
}

.quiz-nav-questionGroupTitle{
    padding: 30px 20px;
    color: white;
    font-weight: 400;
    line-height: 20px;
    line-height: 2rem;
    display: block;
    width: 100%;
    text-transform: uppercase;
}

.quiz-nav-questions{
    display: none;
}

.quiz-nav-question-name
{
    text-shadow: none;
    font-size: 13px;
    font-size: 1.3rem;
}

.quiz-nav-question{
    text-transform: uppercase;
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 2px;
    padding: 13px 20px 10px 20px;
    line-height: 25px;
    line-height: 2.5rem;
    cursor: pointer;
    position: relative;
}

.isComplete .quiz-nav-question{
    padding-top: 20px;
}

.quiz-nav-question.isSelected{
    background-color: white;
    color: #636363;
}

.quiz-nav-question svg{
   display: inline;
}


.quiz-fakeCheckboxWrapper{
    display: block;
    position: relative;
}

.quiz-answer{
    position: relative;
}

.quiz-nav-question .leftArrowWrapper{
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -10px;
}


/*-----------------------------------------*\
    RESSOURCES
\*-----------------------------------------*/

.ressources-brain-icon{
    position: relative;
    display: block;
    width: 20px;
    height: 17px;
    margin: 5px 0 0;
}

.ressources-bike-icon{
    position: relative;
    display: block;
    margin: 5px 0 0;
    width: 25px;
    height: 17px;
}

.ressources-apple-icon{
    position: relative;
    display: block;
    margin: 3px 0 0;
    width: 17px;
    height: 20px;
}



/*-----------------------------------------*\
    SERVICES
\*-----------------------------------------*/



.svgTicket{
    position: relative;
    display: block;
    width: 14px;
    height: 27px;
    margin: 0;
}


.svgStethoscope{
    position: relative;
    display: block;
    width: 20px;
    height: 23px;
    margin: 2px 0 0;
}


.genericContent-title-iconCol{
    width: 35px;
    vertical-align: top;
    text-align: left;
}

.genericContent-title-iconCol.wide{
    width: 50px;
}

.genericContent-title-iconCol-left{
    width: 20px;
}

.blackAndWhiteCol .genericContent-title{
    text-align: left;
}


/*-----------------------------------------*\
    CONTEST
\*-----------------------------------------*/

.laurelsWrapper{
    vertical-align: top;
}

.laurelsWrapper,
.svgLaurels
{
    width: 89px;
}

.svgLaurels{
    height: 73px;
    margin: 0;
}

.contest-prizeDescription{
    text-align: left;
    padding-left: 25px;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
    letter-spacing: 1px;

}


/*-----------------------------------------*\
    Challenge
\*-----------------------------------------*/

.progressGraph{
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    padding: 90px 0 80px;
}

.infoCol-red .infoBlock-title{
    background-image: url("img/bgChallengeSeparator_red.gif");
}

.infoCol-red .challenge-results-summary{
    border-bottom: solid #b5213b 1px;
}

.infoCol-red .challenge-results-ranking{
    border-top: solid #eb6276 1px;
}

.infoCol-red .infoBlock-textBlock{
    color: white;
}

.challenge-results-ranking.noBorder-top{
    border-top: none;
}

.challenge-results-ranking.noBorder-bottom{
    border-bottom: none;
}

.challenge-title-icon{
    width: 65px;
    display: table-cell;
}

.leaderboards .challenge-title-icon{
    width: 85px;
}



.challenge-title-icon img{
    display: block;
}

.challenge-title-icon .svgWrapper{
    height: 52px;
}

.challenge-inputs{
    padding: 40px 0 25px;
    border-bottom: solid #cbcbcb 1px;
}

.challenge-inputs .table{
    margin-bottom: 10px;
}

.svgCalendar{
    width: 24px;
    height: 22px;
    fill: #a0a0a0;
    margin: 8px 0 0 8px;
}

.svgBike{
    width: 38px;
    height: 25px;
    fill: #a0a0a0;
    margin: 7px 0 0;
}

.challenge-inputWrapper ::-webkit-input-placeholder{
    color: #9e9e9e;
}

.challenge-inputWrapper :-moz-placeholder{
    color: #9e9e9e;
}

.challenge-inputWrapper ::-moz-placeholder{
    color: #9e9e9e;
}

.challenge-inputWrapper :-ms-input-placeholder{
    color: #9e9e9e;
}

.challenge-inputWrapper input[type="text"]{
    padding: 12px 15px 11px;
    height: 40px;
    font-size: 14px;
    font-size: 1.4rem;
    letter-spacing: 1px;
    width: 100%;
}

.challenge-buttonWrapper{
    width: 40px;
}

.challenge-buttonWrapper button{
    width: 100%;
    height: 100%;
    background-color: #2f2f2f;
    color: #e6e6e6;
    height: 40px;
}

.challenge-leftText{
    text-align: left;
}

.challenge-rightText{
    text-align: right;
    padding-left: 5px;
}

.challenge-leftText,
.challenge-rightText
{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 16px;
    line-height: 1.6rem;
    color: #9d9d9d;
    padding-bottom: 10px;
    text-transform: uppercase;
}

.challenge-leftText.last{
    padding-bottom: 0;
    margin-bottom: 0;
    vertical-align: bottom;
}

.challenge-rightText .big,
.challenge-leftText .big
{
    font-size: 20px;
    font-size: 2rem;
    line-height: 20px;
    line-height: 2rem;
}

.challenge-leftText .dark,
.challenge-leftText.dark,
.challenge-rightText.dark,
.challenge-rightText .dark
{
    color: #393939;
}


.challenge-results-summary{
    text-transform: uppercase;
    padding: 44px 0 41px;
    border-bottom: solid #cbcbcb 1px;

}

.challenge-stats-individual .challenge-results-summary{
    border-top: solid white 1px;
}

.challenge-results-ranking{
    border-top: solid white 1px;
    padding: 30px 0 0;
}

.challenge-fraction-num{
    font-size: 60px;
    font-size: 6rem;
    line-height: 4.5rem;
    text-align: center;
    letter-spacing: 7px;
    text-indent: 6px;
}

.challenge-fraction .separator-single{
    margin: 8px auto 12px;
    width: 75px;
    background-color: #2e2e2e;
}

.challenge-team-icon .svgTeamNoTrophy{
    width: 37px;
    height: 23px;
    fill: #2f2f2f;
    margin: 0;
}

.svgStar-icon{
    width: 17px;
    height: 17px;
    margin: 0 2px 0 0;
    float: left;
}

.challenge-leftText .starsContainer{
    display: inline-block;
    width: auto;
    margin-left: 8px;
}


.svgBriefcase{
    fill: white;
    width: 26px;
    height: 23px;
    margin: 0;
}



.challenge-stats-company .infoBlock-textBlock,
.challenge-stats-team .infoBlock-textBlock,
.challenge-stats-individual .infoBlock-textBlock
{
    margin-top: 20px;
}

.challenge-signature{
    text-align: right;
}

/* Progress graph */

.progressGraph-intro{
    max-width: 350px;
}

.progressGraph-title{
    margin-bottom: 15px;
}

.progressGraph-desc{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    color: white;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.progressGraph .infoBlock-title{
    padding-bottom: 20px;
}

.progressGraph-container{
    position: relative;
    height: 130px;
    display: block;
    clear: both;
}


.progressGraph-graph{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 7px;
    background-color: white;
}

.progressGraph-horizontalPos{
    position: absolute;
    top: 0;
    left: 0;
}

.progressGraph-pinContainer{
    position: absolute;
    bottom: 1px;
    right: 0;
    width: 1px;
    height: 10px;
}

.progressGraph-pin{

}

.progressGraph-pinIcon{
    margin-left: -15px;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 35px;
    width: 28px;
    background-image: url("img/pinShadow.png");
    background-repeat: no-repeat;
    background-position: 100% -90%;
    background-size: 30px;
    cursor: pointer;
}


.progressGraph-pinContainer.isLeader .progressGraph-starIcon{
    display: block;
}


.progressGraph-pinContainer.isYou .progressGraph-you{
    display: block;

}

.progressGraph-starIcon{
    display: none;
    width: 30px;
    left: 0;
    margin-left: -9px;
    position: absolute;
    bottom: 40px;
    width: 18px;
    height: 18px;
}

.progressGraph-starIcon .starIcon{
    width: 18px;
    height: 18px;
}


.progressGraph-you{
    width: 30px;
    text-align: center;
    margin-left: -17px;
    position: absolute;
    left: 0;
    bottom: 34px;
    display: none;
}


.progressGraph-bubble{
    display: none;
    position: absolute;
    bottom: 60px;
    left: 0;
    width: 170px;
    margin-left: -85px;

    background-color: white;

}


.progressGraph-pinContainer.isSelected .progressGraph-bubble{
    display: block;
}

.progressGraph-pinContainer.isSelected .challengePin{
    fill: white;
}

.challengePin{
    position: absolute;
    bottom: 0px;
    right: 0;
    width: 25px;
    height: 31px;
}


.progressGraph-bubble{
    padding: 15px;
    text-align: center;
}

.progressGraph-bubble-team{
    text-align: center;
    text-transform: uppercase;
    font-size: 14px;
    font-size: 1.4rem;
    padding-bottom: 5px;
    color: #2f2f2f;

}

.progressGraph-bubble-position{
    font-size: 30px;
    font-size: 3rem;
    color: #b2b2b2;
}

.progressGraph-bubble-vSeparator{
    display: inline-block;
    height: 20px;
    width: 1px;
    margin: 0 10px;
    background-color: #b2b2b2;
}

.progressGraph-bubble-progress{
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 30px;
    line-height: 3rem;
    letter-spacing: 1px;
    display: inline-block;
    color: #838383;
    vertical-align: top;
}

.progressGraph-bubble .arrowWrapper{
    position: absolute;
    margin-bottom: -11px;
    bottom: 0;
    left: 0;
    width: 100%;
}

.progressGraph-bubble .arrowDown{
    border-top-color: white;
}

.svgTrophy{
    width: 36px;
    height: 37px;
}

.progressGraph-end{
    text-transform: uppercase;
    font-size: 16px;
    font-size: 1.6rem;
    margin-bottom: 10px;
}

.progressGraph-endGoal{
    width: auto;
    float: right;
    background-color: white;
    padding: 10px;
    margin: -70px 0 0;
}

.progressGraph-endGoal-icon .svgTrophy{
    margin-right: 10px;
}

.progressGraph-end.right{
    float: right;
    clear: both;
    text-align: right;
}

.progressGraph-end.left{
    margin: -35px 0 0 -1px;
}

.progressGraph-goal{
    font-size: 14px;
    font-size: 1.4rem;
}

.progressGraph-endGoal-text p{
    font-size: 12px;
    font-size: 1.2rem;
    padding-top: 8px;
}

.progressGraph-leftBorder{
    height: 33px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}



/* Leader boards */

.leaderboards{
    width: 100%;
    background-color: white;
}

.leaderboard-team{
    background-color: #e6e6e6;
}


.leaderboards svg{
    fill: #2f2f2f;
}

.svgIndividual{
    width: 35px;
    height: 25px;

}

.svgTeam{
    width: 50px;
    height: 21px;
}


.leaderboard-individual,
.leaderboard-team
{
    display: table-cell;
    width: 50%;
    padding: 50px 20px;
}

.leaderboard-individual .leaderboard-ranking,
.leaderboard-team .leaderboard-ranking
{
    margin-top: 70px;
}



.leaderboard-1to3{
    padding-right: 20px;
}

.leaderboard-1to3 .leaderboard-name{
    margin-bottom: 5px;
}

.leaderboard-progress{
    margin-bottom: 5px;
    color: #939393;
}



.leaderboard-rank-big{
    font-size: 60px;
    font-size: 6rem;
    line-height: 44px;
    line-height: 4.4rem;
    font-weight: 400;
    text-align: center;
    width: 85px;
    padding-bottom: 38px;
}


.leaderboard-rank-small{
    font-size: 30px;
    font-size: 3rem;
    line-height: 22px;
    line-height: 2.2rem;
    text-align: center;
    width: 40px;
    display: inline-block;

}

.leaderboard-name{
    text-transform: uppercase;
    vertical-align: top;
    line-height: 15px;
    line-height: 1.5rem;
}


.leaderboard-4to10{
    min-width: 200px;
}


.leaderboard-4to10 .leaderboard-name{
    vertical-align: top;
    padding-bottom: 19px;
    line-height: 15px;
    line-height: 1.5rem;
}

/*-----------------------------------------*\
    ARCHIVE
\*-----------------------------------------*/

.archiveBrowserCol{
    float: left;
    width: 35%;
}

.archiveDataCol{
    float: left;
    width: 65%;
}

.archiveBrowserCol .contentBrowser{
    margin-top: 100px;
}

.contentBrowser-noIcons .contentBrowser-title{
    padding-left: 30px;
}

.archiveDataCol-scores{
    float: left;
}

.archiveDataCol-scores.left{
    width: 155px;
}

.archiveDataCol-scores.left svg{
    margin-left: 0;
}

#archiveDataContainer{
    margin-top: 97px;
}

#page-archive{
    padding-bottom: 100px;
}

#page-archive .contentBrowser{
    min-height: 0;
}

#downloadHealthReport{
    margin-top: 30px;
}

.contentBrowser-noIcons .contentBrowser-title {
    padding-left: 25px;
}

.contentBrowser-download{
    width: 46px;
    backround-repeat: no-repeat;
}

.contentBrowser-categoryItem .tableCell{
    text-align: left;
}

.archiveBrowserCol .contentBrowser-categoryItem{
    padding: 0;
}

.contentBrowser-categoryItem .tableCell{
    padding-top: 18px;
    padding-bottom: 16px;
}

.contentBrowser-date{
    padding: 0 25px;
}

/*-----------------------------------------*\
    Extra large displays
\*-----------------------------------------*/
@media screen and (min-width: 1750px) {
    .marginOnLargeScreens{
        width: 76%;
    }
}

/*-----------------------------------------*\
    Browser specific
\*-----------------------------------------*/

/* Firefox */
@-moz-document url-prefix() {
    .clearMenu{
        height: 119px;
    }

    .articlePreview-image{
        width: 102%;
        margin-left: -1%;
    }

    /*.articlePreview-top{
        overflow: hidden;
    }*/

}

/* Webkit */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    main
    {
        overflow-x: hidden;
    }

    .promoBlock-ammount,
    .promoBlock-table
     {
        width: 100%;
        width: calc(100% + 1px) !important;
    }

    .csstransforms .welcome-col:hover .welcomeBlock{
        margin-top: 0;
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
    }

}

.calendarEvent-content p{
height: 45px;
word-wrap:break-word;
}

.autoAssignForm_Title
{
    color:black;
    margin-right:auto;
    margin-left:auto;
    font-size: 20px;
}

.Subhead 
{
    color:black;
}

#dnn_ctr648_AutoRoleAssignationForm_ctl00
{
    margin-left:auto;
    margin-right:auto;
    font-size: 20px;
    width:auto;
}

#dnn_ctr582_ModuleContent, #dnn_ctr611_ModuleContent, #dnn_ctr681_ModuleContent, #dnn_ctr675_ModuleContent, #dnn_ctr688_ModuleContent
{
    width: 1200px;
    margin-left: -250px;
}

.paddingResources {
    padding: 30px 30px 30px 30px !important;
}

.highlight-message{
    display: block;
    position: relative;
    font-size: 10px;
    top: 9px;
    padding-bottom: 8px;
    color: #e21c39;
    font-style:italic;
}

#dnn_SectionB_Left .pageSection-message-title, #dnn_SectionD_Left .pageSection-message-title {
    color:black;
}

.tableCellMain {
display: table-cell;
vertical-align: middle;
position: relative;
text-align: center;
padding-left:150px;
}


.dnnPasswordResetContent {
    width:100%;
}

.list-description, .list-coaches-item {
    width: 100% !important;
}

.pageDescriptionWide {
    width: 650px;
}
.loginPageContent{
    width:40%;
    max-width:450px; 
    padding: 15px 10px;
}
.dnnLabel {
display: inline-block;
float: left;
position: relative;
width: 100%;
padding-right: 20px;
margin-right: 18px;
overflow: visible;
 text-align: left; 
}

.dnnPasswordResetContent input[type=text] {
width: 100%;
max-width: 445px;
}
.dnnFormItem input[type="password"] {
width: 100%;
max-width: 445px;
}

.DNNAlignright {
text-align: right;
float: right;
}

.sosInLineBlock {
    display:inline-block;
}

.recipesColContainer{
   display:inline-block;
}

.ui-progressbar .ui-progressbar-value {
	height: 100%;
    margin: 0px !important;
}

.ui-widget-header {
	border: 1px solid #aaaaaa;
    background: #e21c39 !important;
	color: #222222;
	font-weight: bold;
}

.dial
{
	color: #e21c39 !important;
}

.profileText
{
	float:left; 
	margin-top:40px; 
	margin-right: 20px;
}

.profileLink
{
	background-color: #2f2f2f;
}

.noMargin
{
	margin: 0px !important;
}

.closeProfileDropdown
{
	position:absolute;
	bottom:10;
	width: 100%;
	text-align:center;
	cursor:hand;
}
