
                                        /*  MARGINS   */ 


.margintop105 {
    margin-top:105px !important;
}

.margintop100 {
    margin-top:100px !important;
}

.margintop80 {
    margin-top:80px !important;
}

.margintop75 {
    margin-top:75px !important;
}

.margintop50 {
    margin-top:50px !important;
}

.margintop55 {
    margin-top:55px !important;
}

.margintop20 {
    margin-top:20px !important;
}

.margintop13 {
    margin-top:13px !important;
}

.margintop25 {
    margin-top:25px !important;
}

.margin10tb {
    margin:10px 0px !important;
}

.margintopneg10 {
    margin-top:-10px ! important;
}

.marginbottom50 {
    margin-bottom:50px !important;
}

.marginbottom25 {
    margin-bottom:25px;
}

.negMar {
    margin:6px 0px -23px 0px;
}

.negM {
    margin:-15px 0 -25px;
    display:block;
}

.lightBlueBackground, .darkBlueBackground {
    margin:0 !important;
    height:480px;
}

.monthlyMargin {
    margin-top:95px !important;
}

.monthlyMargin2 {
    margin-top:69px !important;
}

.negMonthlyMarg {
    margin-top: -33px;
}






                                        /*  BG colors  */ 

.fondBeige {
    background-color:#E9EBE7;
}

.lightBlueBackground {
    background-color: #17406A;
}

.darkBlueBackground {
    background-color : #132943;
}

.ExchangeHeader {
    background-color: #122844;
}

.squaredBG {
    background: transparent url("../../../images/emails/hosted_exchange/2016/bckgnd_squared.png")
}





                                    /*  FONTS   */


.MenuInternal * {
    color:white;
}    

.complete > .row > h2, .complete > h2, .padsProducts > h2 {
    font-size:30px !important;
    font-weight:500 !important;
    color:#122844 !important;
}

.blueLink {
    color:#46CFEF !important;
}

.exc2016 > div >h2 {
    font-size:35px !important;
}

.complete > h2 {
    font-size:27px !important;
}

.margintop50 > h3, .squaredBG h2 {
    color : #122844 ! important;
}

.uniweb * {
    color : #122844 ;
}


                                    /* BORDERS */

.padproduct {
    border:1px solid #00A2BF;
    border-radius:3px;
}

.bottomPad {
    border-top: 1px solid #00a2bf;
}







                                    /*   OTHER    */

.darkBlueBackground > h3 {
    padding-top:38px;
}

.lightBlueBackground {
    padding-bottom:16px;
}

body .separationBorder {
    background:rgb(39, 184, 161) none repeat scroll 0 0;
}

.orderForm {
    margin:0 auto;
    display:table;
}

.orderForm #plusHosted::before, .orderForm #plusHostedBig::before, .orderForm #plusPrivate::before, .orderForm #plusDedicatedB::before, .orderForm #plusDedicatedS::before {
    content: "+";
}

.orderForm #moinsHosted::before, .orderForm #moinsHostedBig::before, .orderForm #moinsPrivate::before, .orderForm #moinsDedicatedB::before, .orderForm #moinsDedicatedS::before {
    content: "-";
}


.orderForm #plusHosted, .orderForm #plusHostedBig, .orderForm #moinsHosted, .orderForm #moinsHostedBig, .orderForm #plusPrivate, .orderForm #moinsPrivate, .orderForm #plusDedicatedS, .orderForm #moinsDedicatedS, .orderForm #moinsDedicatedB, .orderForm #plusDedicatedB {
    background: #F2F2F2 none repeat scroll 0 0;
    color: #122844;
    cursor: pointer;
    float: left;
    line-height: 20px;
    padding: 10px 15px;
    transition: all 0.2s ease 0s;
    font-weight:600;
}

.down:hover, .up:hover {
    background-color:#E0F6FD !important;
    border:1px solid #BBBDBF;
}

.down {
    border-radius:3px 0 0 3px;
    border: 1px solid #BBBDBF;
}

.up {
    border-radius:0 3px 3px 0;
    border: 1px solid #BBBDBF;
}

body input[type="text"] {
    border-top: 1px solid #BBBDBF !important;
    border-bottom: 1px solid #BBBDBF !important;
    border-left:1px solid #BBBDBF !important;
    border-right:none !important;
}

h3, h2 {
    text-align:center !important;
}

.center {
    text-align:center !important;
}

.orderForm input {
    float: left;
    height: 20px !important;
    padding: 10px;
    text-align: center;
    width: 60px !important;
    border-radius:0 !important;
    font-weight:600;
}

.toggle {
    height:29px;
    border-radius:5px;
}

.toggle > div {
    margin : 0px !important;
}

.toggle .monthSelected, .monthSelected {
    color:white !important;
    border: 1px solid #00a2bf; 
    background-color: #00A2BF !important;
    border-radius: 5px 0 0 5px;
    font-weight:600;
}

.monthOnly {
    color:white !important;
    background-color: #00A2BF !important;
    border-radius: 5px;    
}

.toggle .yearSelected {
    color:white !important;
    background-color: #00A2BF !important;
    border-radius: 0px 5px 5px 0px;
    font-weight:600;
    border: 1px solid #00a2bf;
}

.mensuel, .Annuel {
    color:#122844;
    border:1px solid #bbbdbf;
}

.mensuel {
    border-radius:3px 0 0 3px;
}

.Annuel {
    border-radius:0 3px 3px 0;
}

.fifty {
    width:50%;
    float:left;
}

.mensuel:hover {
    color:#122844;
    background-color:#F0FAFD;
    cursor:pointer;
}

.Annuel:hover {
    color:#122844;
    background-color:#F0FAFD;
    cursor:pointer;
}


.currencyHeight {
    height:76px;
}

.monthlyPrice {
    margin-top:-9px;
}

.displayNone {
    opacity:0.3;
    cursor:not-allowed !important;
    pointer-events:none;
}

.padbottomlink {
    margin:0% 10%;;
}

.imgMargn {
    margin:15px;
}

.fondBleu {
    background-color:#17406A;
}

.flex {
    display:flex;
}

.borderTop {
    border-top:1px solid #00A2BF;
    width:102% 
}

.borderLeft {
    border-left:1px solid #00A2BF; 
}

.dashedBorder {
    border-right: 1px dashed #B3BBC1;
    border-left:1px dashed #B3BBC1;
    padding-bottom:20px;
}

.esp {
    padding:20px 0;
}

.circleBorder {
    border: 2px solid #122844;
    border-radius: 78px;
    display: inline-block !important;
    height: 90px;
    padding-top: 13px;
    width: 90px !important;
}

body > *, .uniweb * {
    font-family:"SourceSansPro" !important;
}

html body div#main * h2 {
    font-family:"SourceSansPro" !important;
    font-size:33px !important;
    line-height:36px;
} 

div.uniweb h3, div.uniweb h4, div.uniweb h5{
    color:#122844;
}

.rightRuban {
    -ms-transform: rotate(180deg); 
    -webkit-transform: rotate(180deg); 
    transform: rotate(180deg);
    position:absolute;
    z-index:1;
    
}

.leftRuban {
    margin:-10px 0 0 -27px;
}

.nouveau {
    background-color:#27B9A2;
    display: inline-block;
    padding: 0 15px;
    position: relative;
    z-index: 9999;
    margin:5px -10px 0 -10px;
}

.blueTitles {
    color:#00a2bf !important;
}


@media screen and (max-width: 1020px) {
    .dashedBorder {
        border:none;
        margin:50px 0;
    }
}

@media screen and (max-width: 767px) {
    .lightBlueBackground, .darkBlueBackground {
        width:100% !important;
        height:unset;
    }

    .phoneMargin {
        margin:70px 0;
    }

}


@media screen and (max-width: 505px) {
    .flex {
        display:block;
    }

    .borderLeft {
        border:none;
    }

}

