body {
    text-align: left !important;
}

div.about-us * {
    font-family: "lato", "OpenSans", sans-serif !important;
}

div.about-us div.table-cell {
    vertical-align: middle
}

div.about-us div.wrapper {
    width: 970px;
    margin: 0 auto;
    max-width: 100%;
}

div.about-us div.breadcrumb a {
    color: #3C3C3C;
}

div.about-us div.table {
    display: table
}
div.about-us div.table-cell {
    display: table-cell;
    text-align: center;
    padding: 2%;
}

div.about-us div.wrapper img {
    vertical-align: middle;
    height: auto;
    width: 100%;
}

div.about-us div.wrapper ul li {
    /*padding-left : 5%;*/
    padding-bottom : 2%;
    /*text-indent : -17px;*/
    list-style-image : none;
    font-size : 16px;
    font-weight : 200;
    line-height : 20px;
    text-align : left;
    list-style-type: square;
}

/*div.about-us div.wrapper ul li:before {
    content : "■";
    padding-right : 10px;
    font-size : 10px;
    vertical-align : middle;
    color : #0581cb;
}*/

/*div.about-us div.wrapper ul li span:first-child {
    margin-left: -0.25em;
}*/

div.about-us div.wrapper ul li ul li {
    font-size : 14px;
    /*text-indent : -3%;*/
    padding-left : 0;
    padding-bottom : 0;
}

/*div.about-us div.wrapper ul li ul li:before {
    content : "•";
    color : #3C3C3C;
    padding-right : 1%;
}*/

div.about-us div.wrapper ul.green li:before {
    color : #89c201;
    padding-right : 5%;
}   

div.about-us div.wrapper.subMenu ul { margin : 0 }
div.about-us div.wrapper.subMenu ul li {
    margin : 0;
    padding : 0;
    display : inline-block;
    width : 33%;
}

div.about-us div.wrapper.subMenu ul li a { 
    text-align : left;
    vertical-align : middle;
    text-decoration : none;
    color : #FFFFFF;
    font-size : 14px;
    font-weight : 400;
}
div.about-us div.wrapper.subMenu ul li:before {
    content : "■";
    color : #FFFFFF;
}

div.about-us div.wrapper.subMenu ul li:hover:before,
div.about-us div.wrapper.subMenu ul li a:hover {
    color : #0068b1;
}

div.about-us div {
    box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
}

div.about-us img {
    max-width: 100%;
    height : auto;
}

del { background-image : none !important; }

div.about-us h1.intro { 
    color : #2a2829; 
    font-weight : 300; 
    font-size : 50px;
    line-height : 55px;
}
div.about-us h1.intro span { 
    color : #0581cb; 
    font-size : 50px;
    line-height : 55px;
}

div.about-us h2.intro { 
    color : #5e5e5e; 
    font-weight : 300; 
    font-size : 30px;
}

div.about-us h2.intro sup {
    color : #5e5e5e; 
}

div.about-us div.wrapper a.introLink,
div.about-us div.wrapper a.btn {
    background-color: #0581CB;
    border-radius: 7px 7px 7px 7px;
    -webkit-border-radius: 7px 7px 7px 7px;
    color: #FFFFFF;
    padding: 10px;
    text-decoration: none;
    font-weight : 400;
    display: inline-block;
}

nav.about-us,
div.about-us nav.about-us { 
    background-color: #2980B9;
    position : relative;
}

nav.about-us a,
div.about-us nav.about-us a { 
    display : inline-block; 
    float : none; 
    color : #FFFFFF; 
    font-size : 18px; 
    line-height : 30px; 
    text-decoration : none; 
    width: 25%;

   -webkit-transition-duration: 0.20s;
   -moz-transition-duration: 0.20s;
   -ms-transition-duration: 0.20s;
   -o-transition-duration: 0.20s;
   transition-duration: 0.20s;
}

nav.about-us a:hover,
div.about-us nav.about-us a:hover {
    color: #8FD2FF;
    font-weight: 400;
}

div.about-us a.vignette { 
    display : inline; 
    background : none repeat scroll 0 0 #FFFFFF;
    border : 2px solid #FFFFFF;
    padding-top : 2%;
    padding-bottom : 2%;
    text-decoration : none;
    outline : none;
}

div.about-us a.vignette.half {
    width: 48%;
    height: 320px;
}

div.about-us a.vignette div.imgPanel { height : 160px; background-position : 50% 50%;}

div.about-us a.vignette span.link {
    background : transparent url('../../images/about-us/more.jpg') no-repeat 0 75%; 
    color : #0581cb; 
    padding-left : 18px; 
    padding-bottom : 2px;
    margin-left : 5px; 
    visibility : hidden;
}


div.about-us a.vignette:hover span.link {
    color : #0581cb; 
    padding-left : 18px; 
    padding-bottom : 2px;
    margin-left : 5px; 
    visibility : visible;
}

div.about-us a.vignette:hover {
    background : none repeat scroll 0 0 #F8F8F8;
    border : 2px solid #DCDDDF;
}

div.about-us section article {
    width : 24%;
    float : left;
    display : block;
    margin : 0 0.5%;
}

div.about-us section:nth-child(odd) {
    background : none repeat scroll 0 0 #F1F1F1;
    padding-bottom : 2%;
}

div.about-us section:nth-child(even) {
    background : none repeat scroll 0 0 #FFFFFF;
    padding-bottom : 2%;
}

div.about-us span.title { 
    font-size : 20px; 
    line-height: 24px;
    padding-bottom : 10px; 
    display : block; 
    padding: 10px 4px 10px 4px;
}

p.titleLight,
div.about-us p.titleLight { 
    background: none repeat scroll 0 0 #444444;
    color: #FFFFFF;
    display: table-cell;
    font-size: 24px;
    font-weight : 400;
    margin: 0;
    padding: 10px 30px;
    width: auto;
}

div.about-us div.wrapper div.intro {
    margin: 3% 0;
}

div.about-us div.wrapper div.intro div.textIntro {
    padding : 10px;
}

div.about-us div.wrapper.intro ul li {
    list-style-image : none;
    font-size : 15px;
    list-style-type : square;
    text-align: left;
}

div.about-us div.wrapper div.intro ul li {
    color : #FFFFFF;
}

div.about-us div.wrapper div.intro ul li:before {
    color : #FFFFFF;
}

div.about-us div.bgGreen { background-color : #89c201; }
div.about-us div.bgBlue { background-color : #68A6CE; }
div.about-us div.bgGrey { background-color : #E1E1E1; }

div.about-us div.why-pads .pad {
    display : table-cell;
    float : left;
    height : 174px;
    margin : 0.3% 0.3% 0 0;
    text-decoration : none;
}

div.about-us div.why-pads .pad span {
    color : #FFFFFF;
    display : table-cell;
    font-size : 19px;
    height : 174px;
    line-height : 24px;
    padding : 0 15px;
    text-align : center;
    text-decoration : none;
    vertical-align : middle;
    width : 165px;
}

div.about-us div.why-pads .pad span.right {
    display : table-cell;
    padding-left : 150px;
    vertical-align : middle;
    width : 165px;
}

section.logos {
    width: 100%;
    background-color: #FFF !important;
}

section.logos h2 {
    color: #0068B1;
    font-size: 32px;
    line-height: 36px;
    font-family: 'lato,' "OpenSans", "Liberation Sans","FreeSans",sans-serif;;
    font-weight: normal;
    text-align: left;
}

section.logos h4 {
    text-align: left;
    font-family: 'lato,' "OpenSans", "Liberation Sans","FreeSans",sans-serif;;
    font-size: 16px;
    line-height: 20px;
    margin-top: 20px;
}

section.logos a.button.logos {
    display: block;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    padding: 0px 15px;
    margin: 0 auto;
    background: #0681CE;
    background-color: #0681CE;
    color: white;
    text-decoration: none;
    font-weight: normal;
    border-radius: 3px;
    border: 1px solid #0681CE;
    -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.5);
    text-align : center;
}

/***************
    OVH MAG
****************/
.magBtn{
    background: #222A39;
    font-size: 2em;
    line-height: 120%;
    border-radius: 2px;
    padding: 2% 4%;
    margin-top: 40px;
    color:#fff;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    display: inline-block;
}

.magBtn:hover {
    background: #191F2B;
}

.mag img{
   -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border:solid #777 1px !important;
    -webkit-box-shadow: 0 10px 10px 0 rgba(0,0,0,0);
    box-shadow: 0 10px 10px 0 rgba(0,0,0,0);
}
.mag:hover img {
    -moz-transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
    -webkit-box-shadow: 0 10px 10px 0 rgba(0,0,0,0.2);
    box-shadow: 0 10px 10px 0 rgba(0,0,0,0.2);
}

.mag{
    display:inline-block;
    margin:10px;
}

div.about-us div.wrapper ul li.nthgbfr {
    text-indent: 0px;
}

div.about-us div.wrapper ul li.nthgbfr:before {
    content:none;
}

/***************
    NEWSLETTER
****************/

.newsletter {
    padding:60px 0 60px 0;
}

.firstTitle {
    color:#0088AC;
    font-size:30px;
    font-weight:300;
    margin:0 0 20px 0;
}
div.about-us div.wrapper .ontop {
    margin:0 0 0 20px;
    padding:0;
}
div.about-us div.wrapper .ontop li {
    margin:4px 0 0 0;
    padding:0;
    font-size:20px;
    line-height:24px;
    font-weight:300;
}
.seeit {
    background:#418E9A;
    padding:10px 25px 10px 25px;
    color:#FFF;
    font-weight:400;
    font-size:16px;
    text-decoration:none;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.seeit:hover {
    background:#0087AE;
}

.newsletterBox {
    display:table;
    position:relative;
    width:180px;
    height:180px;
    font-size:20px;
    font-weight:300;
    color:#FFF;
    text-decoration:none;
    text-align:center;
    vertical-align:middle;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}
.newsletterBox span.bg {
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    display:table-cell;
    width:180px;
    height:180px;
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-size:auto 110%;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    filter: grayscale(100%);
    -moz-box-shadow: inset 0px -30px 80px 20px #000000;
    -webkit-box-shadow: inset 0px -30px 80px 20px #000000;
    -o-box-shadow: inset 0px -30px 80px 20px #000000;
    box-shadow: inset 0px -30px 80px 20px #000000;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#000000, Direction=90, Strength=80);
}
.newsletterBox:hover span.bg {
    background-size:auto 100%;
}
.newsletterBox span.bgColor {
    position:absolute;
    top:0;
    left:0;
    background-color:rgba(0, 173, 177,0.3);
    width:180px;
    height:180px;
    font-size:20px;
    font-weight:300;
    color:#FFF;
    display:table;
    text-decoration:none;
    text-align:center;
    vertical-align:middle;
}
.newsletterBox span.bgColor p {
    display:table-cell;
    height:180px;
    vertical-align:bottom;
    padding-bottom:10px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.newsletterBox:hover span.bgColor p {
    padding-bottom:20px;
}
.newsletterBox span:after {
    content:"";
    position:absolute;
    display:block;
    width:67px;
    height:67px;
    background:url(../../images/about-us/icn-plus-off.png) no-repeat 0 0;
    top:0;
    right:1px;
}
.newsletterBox span:hover::after {
    background:url(../../images/about-us/icn-plus-on.png) no-repeat 0 0;
}

.imgFirst {
    position:relative;
    display:block;
    width:280px;
    height:280px;
    float:left;
    margin:0 40px 0 0;
}
.imgFirst span.bg {
    display:block;
    width:280px;
    height:280px;
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-size:auto 110%;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    filter: grayscale(100%);        
    -moz-box-shadow: inset 0px 0px 80px 10px #000000; 
    -webkit-box-shadow: inset 0px 0px 80px 10px #000000;
    -o-box-shadow: inset 0px 0px 80px 10px #000000;
    box-shadow: inset 0px 0px 80px 10px #000000;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#000000, Direction=NaN, Strength=80);
}
.imgFirst span.bgColor {
    position:absolute;
    top:0;
    left:0;
    background:rgba(0, 173, 177,0.3);
    display:block;
    width:280px;
    height:280px;
}
.textRight {
    float:right;
    width:640px;
}

.newsletterBanner {
    background: #00ADB1;
}
.newsletterBannerTitle {
    color:#FFF;
    font-size:46px;
    font-weight:300;
    line-height:50px;
    margin:0 auto;
    position:absolute;
    top:60px;
    left:20px;
}
.screenshot {
    overflow:hidden;
    display:block;
    width:180px;
    height:180px;
}

div.about-us div.weatherMapWrapper {
    height : 550px;
}


@media screen and (max-width: 480px) {

    div.about-us div.table-cell {display : block;}

    div.about-us div.wrapper { padding : 0 2%; }
    div.about-us a.vignette { margin-bottom : 2%; display: block; width : 100%;}

    div.about-us div[class*="half"] { width : 100%; }

    div.about-us div.table-cell.half { width : 100%; }

    div.about-us div.wrapper a.introLink {
        display: inline-block;
        margin : 7px;
    }

    div.about-us div.wrapper div.intro {
        background-image : none!important;
        background-color : #0068b1!important;
    }


    div.about-us nav.about-us a { width : 100%; text-align : center; }

    div.about-us div.Fright, div.about-us div.Fleft { clear : both; float: none; }
    div.about-us p.titleLight { line-height : 30px;}
    div.about-us div.wrapper.subMenu ul { margin-left : 30px; }
    div.about-us div.wrapper.subMenu ul li {
        display : block;
        width : 100%;
        text-align : left;
    }
    div.about-us section article { float : none; margin : 0 auto 30px auto; width : 79%;}
}

@media screen and (width:600px) {
    div.about-us nav.about-us a { width : 50%;}
    div.about-us div.wrapper { padding : 0 2%; }
}

@media screen and (max-width: 640px) {
    div.about-us div.weatherMapWrapper {
        height : 450px;
    }


    .half55 { width : 100%!important; }

}

@media screen and (min-width:639px) and (max-width:1024px) {
    div.about-us div.wrapper { padding : 0 2%; }
    div.about-us div.weatherMapWrapper {
        margin : 0 32px;
        height : 450px;
    }
    div.about-us div.wrapper.subMenu ul {
        margin-left : 30px;
    }

    div.about-us nav.about-us a { width : 33%; font-size : 17px;}

    div.about-us div.wrapper.subMenu ul li {
        width : 50%;
    }


    div.about-us div.wrapper div.intro {
        background : transparent url('/fr/images/about-us/header-reseau.jpg') no-repeat 57% 0!important;
    }
    div.about-us div.wrapper div.intro div.textIntro {
        padding : 2px;
    }
}


@media screen and (max-width : 1024px) {
    div.about-us div.weatherMapWrapper {
        margin : 0 32px;
    }

}