#page > .topbar,
#identification_container{
    display:none !important;
}

.top-bar{
    float:left;
    width:100%;
    background-color:#3a3c45;
    margin-bottom:0px;
    display:block !important;
    overflow:visible;
}

body.acces_reserve .btn-center{
    display:none;
}

.top-bar .centered{
    width:100%;
}

.top-bar .logo-sd {
    background-image: url("/images_communes/logo_cancero_presente.png");
    background-position: center center;
    background-repeat: no-repeat;
    float: left;
    height: 65px;
    width: 100%;
    background-size: 73% auto;
    max-width: 210px;
}
.block-connexion form{
    float:left;
    margin-right:10px;
}

.block-connexion .name{
    color:white;
    float:left;
    width:100%;
    text-align:center;
    padding-top:10px;
    padding-bottom:5px;
    font-size:14px;
}

.op-bar{
    float:left;
    color:white;
    margin-left:20px;
    border-left:1px solid #319ed6;
    width:100%;
    max-width:650px;
    padding:0px;
    margin-bottom:0px;
    list-style:none;
}

.op-bar li{
    float:left;
    border-right:1px solid #319ed6;
    width:calc((100% - 108px) / 3);
}

.op-bar li.global{
    width:100px;
    height:73px;
}

.op-bar li a {
    color: white;
    text-decoration: none;
    padding-top: 36px !important;
    padding-bottom: 20px;
    float: left;
    font-weight: bold;
    background-position: center 12px !important;
    background-repeat: no-repeat;
    width: 100%;
    text-align: center;
}

.op-bar li:not(.global) a{
    background-size:20px auto;
}

.op-bar li a:hover,
.op-bar li.actif a{
    background-color:#319ed6;
}

.op-bar li.global a{
    height:100%;
    font-size:0px;
    width:100%;
    padding-right:30px;
    padding-left:30px;
    background-image:url('../images_index/new/icon-op-global.png');
    background-position:center center;
}

.op-bar li.immanquable a{background-image:url('../images_index/new/icon-op-imm.png');}
.op-bar li.webcast a{background-image:url('../images_index/new/icon-op-webcast.png');background-position:15px center;}
.op-bar li.direct a{background-image:url('../images_index/new/icon-op-direct.png');background-position:35px center;}
.op-bar li.duo a {background-image: url(../../images_index/sfh2021/icontb.png);}

.connexion-btn,
.signin{
    background-color:white;
    padding:10px;
    padding-left:20px;
    padding-right:20px;
    color:black;
    text-decoration:none !important;
    opacity:0.8;
    margin-top:12px;
    float:right;
    border:none;
}

a:hover, a:focus{
    color:black;
}

.signin{
    padding-top:10px;
    padding-bottom:10px;
}

.block-connexion {
    float: right;
    width: 200px;
}

.block-connexion .logout{
    color:white;
    text-decoration:underline;
    float:left;
    width:100%;
    text-align:center;
    font-size:14px;
}

.block-connexion .logout{
    margin-top:5px;
}

.btn-center{
    float:left;
    width:100%;
}

.block-connexion .logout:hover,
.connexion-btn:hover,
.signin:hover,
.block-connexion .logout:active:,
.connexion-btn:active,
.signin:active{
    opacity:1;
    cursor:pointer;
    text-decoration:none !important;
    color:black !important;
}

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

    .centered{
        width:980px !important;
    }

    .op-bar{
        max-width:435px;
    }

    .op-bar li:not(.global) a{
        background-image:none !important;
        line-height:16px;
    }

    .op-bar li a{
        font-size:11px;
    }

    .op-bar li a {
        font-size: 12px;
        padding-top: 28px !important;
        padding-bottom: 28px !important;
    }
}

@media screen and (max-width:1024px){
    .centered{
        width:720px !important;
    }

    .op-bar{
        float:left;
        width:100%;
        border:none;
        padding:0px;
        margin:0px;
        max-width:100%;
        margin-top:10px;
    }

    .op-bar li:last-child{
        border-right:none;
    }

    .block-connexion{
        float:left;
        width:100%;
        margin-top:20px;
        margin-bottom:20px;
    }

    .block-connexion .name{
        padding:0px;
        padding-right:10px;
        padding-left:10px;
    }

    .block-connexion .name,
    .block-connexion .btn-center,
    .block-connexion .logout{
        width:auto;
    }

    .block-connexion .logout{
        margin:0px;
    }

    .top-bar .logo-sd{
        float:left;
        width:100%;
    }
}

@media screen and (max-width:720px){
    .centered{
        width:100% !important;
    }

    .op-bar li.global{
        width:80px;
    }

    .op-bar li {
        width: calc((100% - 80px) / 3);
    }

    .op-bar li a {
        font-size: 8px;
    }
}