#header .icon {
    background: url('/img/pictos/ubihome_logo.png') no-repeat !important;
    width: 280px;
    cursor: default;
}

body.login_page, body.content_page, .mfp-bg  {
    /*background: url(../img/bg/bg_ubihome.jpg) no-repeat center center fixed transparent !important;*/
    background: url(../img/bg/bg_ubihome2.jpg) no-repeat center center fixed transparent !important;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;
}

#header .menu_item {
    color: rgba(255, 255, 255, 0.9) !important;
    font-weight: 300 !important;
}
a, #logout, .link-div, .add, .btn_arm_always_on {
    color: rgba(255, 255, 255, 0.9) !important;
    font-weight: 400;
}

.block_title, body, .addGateway a {
    /*color: rgba(7,12,5,0.75) !important;*/
    color: rgba(255,255,255,0.9) !important;
    font-weight: 300;

}
.notification-bar {
    color: rgba(7,12,5,0.75) !important;
}
.idm-result-msg {
    padding: 5px 10px !important;
}
.idm-plan-container .marginTop15 {
    padding:0 0 5px 10px;
}

.h-checkbox-plans {
	margin: 2px 0;
	display: inline-block;
}
.idm-plan-label {
	width: 360px;
}
.purchase-header {
    font-weight: bold;
    font-size: 15px;
}
.purchase-status {
    float: right;
    width: 10%;
}
.purchase-offer {
    float: left;
    width: 90%;
}
.purchase-line {
    clear: both;
    display: block;
    height: 40px;
    padding: 8px;
}
.purchase-line:hover {
    background: rgba(255, 255, 255, 0.5);
}
.purchase-container {
    width: 100%;
    height: 370px;
    font-size: 15px;
}
.purchase-used {
    opacity: 0.55;
}
.idm-account {
    margin-top: 8px;
}
.prepaid-div {
    width: 300px;
    margin-left:auto;
    margin-right: auto;
}
.tab_edit_account, .tab_pay {
    width: 240px;
}
.tab_edit_account {
    top: 230px;
} 
.tab_pay {
    top: 473px;
}
.idm-button-confirm, .idm-button-cancel {
    position: absolute;
    bottom: 0;
}
.idm-button-confirm {
    right: 12px;
} .idm-button-cancel {
    left: 26px;
}
.content_pay, .content_edit_account {
    min-height: 433px;
}
.voucher-div {
    padding: 10px;
    width: 100%;
    height: 46px;
}
.idm-result {
    width: 96%;
    margin-top: 10px;
}

.idm-plan-container {
    height: 349px;
    width: 100%;
    padding-left: 17px;
}

.refresh-voucher {
    width: 150px;
    height: 30px;
    padding-left: 46px;
    background-size: 30px 30px;
    background-position: 11px 0px;
    padding-top: 2px;
}
.voucher-cb-container {
    display: inline-block;
    width: 100%; 
}
#paymentIframe {
    width: 100%;
    height: 330px; 
    border: none;
}
.idm-cb-payment, .idm-voucher {
    width: 157px;
    height: auto;
    display: inline-block;
    padding-top: 60px;
    position: relative; 
    background-position: top center;
}
.idm-cb-payment:hover, .idm-voucher:hover {
    background-color: rgba(255,255,255,0.5);
}
.idm-cb-payment:before, .idm-cb-payment:after, .idm-voucher:before, .idm-voucher:after {
    width: 137px; 
}



.phone_background {
    background: url(/img/bg/img_mobile_home_idm.png) no-repeat !important;
    background-position: center 300px !important;
}

.gatewayContainer, .settings_label, .popupSceneDeviceContainer, .divScene:hover, .automation_device:hover, 
.comfort_device:hover, .alertBlock:hover, .control_alarm:hover, .liveBlockVideo:hover, .system_device:hover, .idm-result-msg,
.schedule:hover, .alarm_mode:hover, .reg_TYPE:hover, .blockVideo:hover
{
    color: rgba(7,12,5,0.65);
}

.hexagone-div-large {
    background: rgba(255, 255, 255, 0.3) none repeat scroll 0% 0%;
}

.hexagone-up-large {
    border-bottom: 20px solid rgba(255, 255, 255, 0.3);
}

.hexagone-down-large {
    border-top: 20px solid rgba(255, 255, 255, 0.3);
}

.settings_menu_item{
    color: rgba(7,12,5,0.9);
}

#content.login {
    /*height: 750px !important;
    background: url(/img/bg/img_mobile_home.png) no-repeat left center !important;
    background-size: 75% !important;*/
}

.purchase-history {
    margin-top: 30px;
    text-decoration: underline;
    text-align: center;
}
.prepaid-div {
    margin-top: 20px;
}

.prepaid-div .settings_field_input  {
    float: none !important;
}

.submit-voucher, .get-more-credit, .change-plan {
    clear: both;
    margin-top: 10px;
    /*text-transform: uppercase;*/
}
.payment-alt {
    margin-top: 10px;
}
.store-confirmation {
    height: 349px;
}
#field_voucher {
    width: 250px;
}

.country-list {
    background-color: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid rgba(61, 81, 98, 0.9) !important;
    color: rgba(35, 53, 68, 0.9) !important;
    width: 300px !important;
}

.intl-tel-input .country-list .country.highlight {
    background-color: rgba(0, 0, 0, 0.3) !important;
}

.intl-tel-input .country-list .divider {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.intl-tel-input ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: rgba(110,110,110,0.75) !important;
}
.intl-tel-input :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: rgba(110,110,110,0.75) !important;
}
.intl-tel-input ::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: rgba(110,110,110,0.75) !important;
}
.intl-tel-input :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: rgba(110,110,110,0.75) !important;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: rgba(7, 12, 5, 0.65) !important;
    background-color: rgba(255,255,255,0.75) !important;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
    /*background-color: rgba(80, 105, 126, 0.26) !important;*/
    background-color: rgba(7, 12, 5, 0.65) !important;    
}
/*
.ui-widget-content {
    //background-color: rgba(80, 105, 126, 0.26) !important;
    background-color: rgba(7,12,5,0.65) !important;
}*/
.ui-slider .ui-slider-handle {
    border: 1px solid rgba(61, 81, 98, 0.75) !important;
    background-color: rgba(255, 255, 255, 1) !important;
}
.ui-slider-range {
    border: 1px solid rgba(61, 81, 98, 0.75) !important;
    background-color: rgba(255, 255, 255, 0.8) !important;
}
option {
    background-color: #A3B6AC !important;
    color: rgba(7,12,5,0.75) !important;
}
input, .settings_field_input select, .selectIpCamNameVideos, .selectCatLogs, select {
    border: 1px solid rgba(61, 81, 98, 0.9) !important;
    /*    color: rgba(255, 255, 255, 0.9) !important;
            color: rgba(61, 81, 98, 0.9) !important;*/
    color: rgba(35, 53, 68, 0.9) !important;
    background-color: rgba(255, 255, 255, 0.46) !important;
    /*    background-color: rgba(80, 105, 126, 0.26) !important;*/
    font-weight: 300 !important;
    height: 25px;

}

input[type="text"]:disabled {color: rgba(35, 53, 68, 0.5) !important;}
.dayTitle {
    background-color: rgba(61, 81, 98, 0.9) !important;
    color: rgba(255, 255, 255, 0.8) !important;
}
.button_blue, .settings_field_submit input[type="submit"], input[type="submit"], .reg_button, .reg_button_next, .button-sched {
    border: none !important;
    background-color: rgb(61, 81, 98) !important;
    color: rgba(255, 255, 255, 0.9) !important;
}
.button_grey {
    color: rgba(255, 255, 255, 0.9) !important;
}
.launch-schedule {
    color: rgba(255, 255, 255, 0.9) !important;
}
.to_select {
    color: rgba(255, 255, 255, 0.9) !important;
}

.first {
    border-left: 1px solid rgb(61, 81, 98) !important;
}
.btn_arm_always_on {
    border: 1px solid rgb(61, 81, 98) !important;
}
.option-btn, .btn_arm_always_on {
    background-color: rgba(80, 105, 126, 0.26) !important;
    border-right: 1px solid rgb(61, 81, 98) !important;
    border-top: 1px solid rgb(61, 81, 98) !important;
    border-bottom: 1px solid rgb(61, 81, 98) !important;
    color: rgba(255, 255, 255, 0.9) !important;
}
.option-selected {
    background-color: rgb(61, 81, 98) !important;
}
.selected {
    font-weight: 500 !important;
}
.ui-widget-content {
    background: rgba(255, 255, 255, 0.8) !important;
}
.ui-widget-content a {
    color: rgba(0, 0, 0, 0.55) !important;
}
.ui-widget-content a:hover {
    color: rgba(255,255,255,0.8) !important;
}
.settings_menu_item:hover {
    background-color: rgb(61, 81, 98) !important;
}
.code_container:hover, .alertBlock:hover {
    background-color: rgba(255, 255, 255, 0.5) !important;
}
.containerItem, .comfort-btn {
    color: rgba(255,255,255,0.8) !important;
}
#tab_automation, #tab_security, .tab-item, .popupSceneTabItem {
    color: rgba(255,255,255,0.8);
}

.tabSelected, .tab_selected, .tab-selected, .popupTabSelected, .popupTabSelected:hover  {
    color: rgba(7,12,5,0.75) !important;
    background-color: rgba(232, 241, 243, 0.31) !important;    
}

.tabSelected:before {
    border-bottom: 20px solid rgba(232, 241, 243, 0.31) !important;   
}
.tabSelected:after {
    border-top: 20px solid rgba(232, 241, 243, 0.31) !important;   
}

.bg_highlight_triangle1, .bg_selected_triangle1 {
    border-color: transparent transparent rgb(232, 241, 243) !important;
}
.bg_highlight_triangle2, .bg_selected_triangle2 {
    border-color: rgb(232, 241, 243) transparent transparent;
}

#header .gateway_selector SELECT {
    background: #FFF url("/img/bg/select_bg_idm.png") no-repeat scroll right center !important;
    color: rgba(7,12,5,0.75) !important;
}

.selectCatLogs, .selectIpCamNameVideos, .settings_field_input select, select {
    background: rgba(255, 255, 255, 0.46) url("/img/bg/select_bg_idm.png") no-repeat scroll right center !important;
}

#log_list {
	margin-top: 15px;
}

#videos_list{
	margin-top: 10px;
}

.log_container, .videoContainer {
    height: 460px;
}

#header .menu_security {
    background-image: url(/img/pictos/header_security_white.png);
}

#header .menu_alerts {
    background-image: url(/img/pictos/header_alert_white.png);
}

#header .menu_live {
    background-image: url(/img/pictos/header_live_white.png);
}

#header .menu_video {
    background-image: url(/img/pictos/header_video_white.png);
}

#header .menu_automation {
    background-image: url(/img/pictos/header_automation_white.png);
}

#header .menu_comfort {
    background-image: url(/img/pictos/header_comfort_white.png);
}

#header .menu_system {
    background-image: url(/img/pictos/header_system_white.png);
}

#header .menu_logs {
    background-image: url(/img/pictos/header_logs_white.png);
}

#error-msg-text {
    background: url(/img/pictos/popup_error_icon_idm.png) no-repeat 10px center transparent;
    background-size: 60px;
}
#confirm-msg-text {
    background: url(/img/pictos/popup_confirm_icon_idm.png) no-repeat 10px center transparent;
	background-size: 60px;
}

#notif-msg-text {
    background: url(/img/pictos/popup_notif_icon_idm.png) no-repeat 10px center transparent;
    background-size: 60px;
}

.login-block > .bloc_corner1, .login-block > .bloc_rectangle1, .login-block > .bloc_corner2, .login-block > .bloc_rectangle2,
.login-block > .bloc_corner3, .login-block > .bloc_corner4, 

.security-block > .bloc_corner1, .security-block > .bloc_rectangle1, .security-block > .bloc_corner2, .security-block > .bloc_rectangle2,
.security-block > .bloc_corner3, .security-block > .bloc_corner4,

.alerts-block > .bloc_corner1, .alerts-block > .bloc_rectangle1, .alerts-block > .bloc_corner2, .alerts-block > .bloc_rectangle2,
.alerts-block > .bloc_corner3, .alerts-block > .bloc_corner4, 

.live-block > .bloc_corner1, .live-block > .bloc_rectangle1, .live-block > .bloc_corner2, .live-block > .bloc_rectangle2,
.live-block > .bloc_corner3, .live-block > .bloc_corner4, 

.video-block > .bloc_corner1, .video-block > .bloc_rectangle1, .video-block > .bloc_corner2, .video-block > .bloc_rectangle2,
.video-block > .bloc_corner3, .video-block > .bloc_corner4, 

.system-block > .bloc_corner1, .system-block > .bloc_rectangle1, .system-block > .bloc_corner2, .system-block > .bloc_rectangle2,
.system-block > .bloc_corner3, .system-block > .bloc_corner4, 

.logs-block > .bloc_corner1, .logs-block > .bloc_rectangle1, .logs-block > .bloc_corner2, .logs-block > .bloc_rectangle2,
.logs-block > .bloc_corner3, .logs-block > .bloc_corner4, 

.lost-password-block > .bloc_corner1, .lost-password-block > .bloc_rectangle1, .lost-password-block > .bloc_corner2, .lost-password-block > .bloc_rectangle2,
.lost-password-block > .bloc_corner3, .lost-password-block > .bloc_corner4 
{
    opacity: 0.3 !important;
}




.bloc_corner1, .bloc_corner2, .bloc_corner3, .bloc_corner4 {
    border-color: transparent #E8F1F3 #E8F1F3 transparent;
}
.bloc_corner2 {
    border-color: transparent transparent #E8F1F3 #E8F1F3;
}
.bloc_corner3 {
    border-color: #E8F1F3 #E8F1F3 transparent transparent;
}
.bloc_corner4 {
    border-color: #E8F1F3 transparent transparent #E8F1F3;
}
.bloc_rectangle1, .bloc_rectangle2 {
    background-color: #E8F1F3;
}
.gatewayMainContainer {
    background-color: rgba(255, 255, 255, 0.5) !important;
}
.gatewayMainContainer:before, .system_device:hover:before, .divScene:hover:before {
    border-bottom: 10px solid rgba(255, 255, 255, 0.5) !important;
}
.gatewayMainContainer:after, .system_device:hover:after, .divScene:hover:after {
    border-top: 10px solid rgba(255, 255, 255, 0.5) !important;
}
.system_device:hover, .divScene:hover {
    background-color: rgba(255, 255, 255, 0.5) !important;
}

.containerContent, .popupScene, .hexagone-div, #settings_menu-msg-popup, #confirm-msg-popup {
    background-color: rgba(232, 241, 243, 0.31) !important; 
}
.popupTabSelected:before, .popupScene:before, .hexagone-up, #up, #tab_automation.tab_selected:before, #tab_security.tab_selected:before, .tab-selected:before, #confirm-msg-popup:before {
    border-bottom: 10px solid rgba(232, 241, 243, 0.31) !important;
}
.popupTabSelected:after, .popupScene:after, .hexagone-down, #down, #confirm-msg-popup:after {
    border-top: 10px solid rgba(232, 241, 243, 0.31) !important;
}
.containerContent:before {
    border-bottom: 20px solid rgba(232, 241, 243, 0.31) !important;
}
.containerContent:after {
    border-top: 20px solid rgba(232, 241, 243, 0.31) !important;

}
.automation_device:hover:before, .comfort_device:hover:before {
    border-bottom: 10px solid rgba(255, 255, 255, 0.5) !important;
}
.automation_device:hover:after, .comfort_device:hover:after  {
    border-top: 10px solid rgba(255, 255, 255, 0.5) !important;

}

.control_arm_on, .control_arm.clicked {
    background-image: url(/img/btn/btn_security_arm_on.png) !important;
}
.control_arm {
    background-image: url(/img/btn/btn_security_arm_off.png) !important;
    background-position: center 0px;
}
.control_arm_on:hover, .control_arm:hover {
    background-color: rgba(255,255,255,0.5) !important;
}
.control_disarm_on, .control_disarm.clicked {
    background-image: url(/img/btn/btn_security_disarm_on.png) !important;
    background-position: 36px 0px !important;
}
.control_disarm {
    background-image: url(/img/btn/btn_security_disarm_off.png) !important;
    background-position: 36px 0px;
}
.control_disarm_on:hover, .control_disarm:hover {
    background-color: rgba(255,255,255,0.5) !important;
}
.control_partarm1_on, .control_partarm1.clicked {
    background-image: url(/img/btn/btn_security_partial_1_on.png) !important;
}
.control_partarm1 {
    background-image: url(/img/btn/btn_security_partial_1_off.png) !important;
}
.control_partarm1_on:hover, .control_partarm1:hover {
    background-color: rgba(255,255,255,0.5) !important;
}
.control_partarm2_on, .control_partarm2.clicked {
    background-image: url(/img/btn/btn_security_partial_2_on.png) !important;
}
.control_partarm2 {
    background-image: url(/img/btn/btn_security_partial_2_off.png) !important;
}
.control_partarm2_on:hover, .control_partarm2:hover {
    background-color: rgba(255,255,255,0.5) !important;
}
/*.scenes, */.picto-scene {
    background-image: url("/img/pictos/picto-scenes_on.png") !important;
}
/*.device {
    background-image: url('/img/pictos/picto-devices_on.png') !important;
}*/
.button_off {
    background-image: url("../img/btn/btn_automation_off_idm.png") !important;
}

.next-week-schedules, .prev-week-schedules {
    color: rgba(255, 255, 255, 0.9) !important;
}
.sched_arm {
    background-image: url("/img/pictos/picto_sched_arm_idm.png") !important;
}
.sched_disarm {
    background-image: url("/img/pictos/picto_sched_disarm_idm.png") !important;
}
.sched_partial1 {
    background-image: url("/img/pictos/picto_sched_partarm1_idm.png") !important;
}
.sched_partial2 {
    background-image: url("/img/pictos/picto_sched_partarm2_idm.png") !important;
}
.sched_automation {
    background-image: url("/img/pictos/picto_sched_scene_idm.png") !important;
}
.homesys-tab-item-selected, .homesys-tab-item-selected:hover {
    background-color: rgba(255, 255, 255, 0.3) !important;
}
.homesys-tab-item-selected::before, .homesys-tab-item-selected:hover::before {
    border-bottom: 10px solid rgba(255, 255, 255, 0.3) !important;
}

.refresh_scan, .advance_settings {
	color: #ffffff !important;
}

.h-checkbox-input {
    background-image: url('/img/btn/btn_check_off_idm.png');
}
.h-checkbox-wrapper.checked > .h-checkbox-input {
    background-image: url('/img/btn/btn_check_on_idm.png');
}

@media (max-width: 680px) {

    .login-block {
        margin: 0px auto 0 auto !important;
    }
    .login-block-content {
        margin-left: 0px !important;
    }

    #header .icon {
        background: url('/img/pictos/ubihome_logo.png') no-repeat !important;
        background-size: 110px;
        background-position: 0 20px;
    }

    #field_voucher {
        width: 100%;
    }


}
/**LOGIN CONTAINER**/

.login-container {
    width: 450px !important;
    margin-left: -70px !important;
    margin-top: 30px !important;
}
.login_label {
    font-size: 20px !important;
    width: 110px !important;
}

.login_value {
    width: 250px !important;
}

.login_value input {
    width: 250px !important;
}

#waiting-screen {
/*    background-image: url(../img/bg/bg_ubihome.jpg);*/
    background-image: url(../img/bg/bg_ubihome.jpg);
}
#waiting-screen .logo {
    background-image: url(/img/pictos/ubihome_logo2.png);
    width: 450px;
    margin-top: 55px;
    height: 200px;
}
.submit-button {
    background-color: rgb(61, 81, 98) !important;
    color: rgba(255, 255, 255, 0.9) !important;

}
#router_wifi {
    background-color: rgba(255, 255, 255, 0.35) !important;
    border: 1px solid rgba(61, 81, 98, 0.9) !important;
}

#password_strength_estimator {
    background: rgba(255, 255, 255, 0.46);
}
#password_strength_estimator:after {
    background: #fff;
}

@media (max-width: 975px) {

    .login-container {
        width: 400px !important;
    }
    .login_value {
        width: 200px !important;
    }

    .login_value input {
        width: 200px !important;
    }
}

@media (max-width: 870px) {

    #header .icon {
        width: 170px;
        background-size: 160px auto !important;
    } 
    #confirm-msg-text, #error-msg-text, #notif-msg-text {
        background-size: 60px;
    }
}


@media (max-width: 690px) {

    .idm-button-confirm, .idm-button-cancel {
        position: relative;
        right: 0px;
        bottom: 0px;
        left: 0px;
        margin-top: 5px;
    }
    .purchase-container {
        font-size: 10px;
    }
    .purchase-offer {
        width: 80%;
    }
    .purchase-status {
        width: 20%;
    }
    .idm-plan-container {
        height: 324px;
    }
    .prepaid-div {
        width: 100%;
    }
    .voucher-cb-container {
        padding-top: 0px;
    }

    .login-container  {
        margin: 0 auto  !important;
    }

    #header .icon {
        width: 140px;
        background-size: 130px auto !important;
    } 
    #confirm-msg-text, #error-msg-text, #notif-msg-text {
        background-size: 45px;
    }
    #log_list, #videos_list {
        margin-top: 50px;
    }    
}

@media (max-width: 450px) {
    .login-container {
        width: 300px !important;
    }
    .login_value {
         width: 100% !important;
    }
    .login_label {
        font-size: 16px !important;
        width: 80px !important;
        margin-top: 3px !important;
    }
    .login_value input {
        width: 100% !important;
        box-sizing: border-box;
    }
    .login_page #header .icon {
		background-size: 200px auto !important;
		background-position: center center !important;
		height: 100px !important;
		margin: 15px auto !important;
		width: 100% !important;
	}
    #header .icon, .create_account #header .icon {
        width: 120px !important;
        background-size: 120px auto !important;
        height: 50px !important;
        margin: 10px 0px 0px 10px !important;
	}	
      
    #confirm-msg-text, #error-msg-text, #notif-msg-text {
        background-size: 32px;
    }	
}

.pencil-input-mob {
    background-color: transparent !important;
    border: 1px dashed transparent !important;
    color: rgba(255, 255, 255, 0.9) !important;
}

.pencil-input {
    background-color: transparent !important;
    border: 1px dashed transparent !important;
    color: rgba(255, 255, 255, 0.9) !important;
}
.pencil-input:hover {
    border: 1px dashed rgba(255, 255, 255, 0.55) !important;
}
.pencil-input.clicked, .pencil-input.clicked:hover {
    border: 1px solid rgba(61, 81, 98, 0.9) !important;
    box-shadow: 0px 5px 10px -5px rgba(71, 71, 71, 0.5) inset !important;
    color: rgba(35, 53, 68, 0.9) !important;
    background-color: rgba(255, 255, 255, 0.46) !important;
}
.removed, .removed:hover {
    color:  rgba(255, 255, 255, 0.9) !important;
}
.dd-wrapper:not(.dd-patcher), .dd-patcher > span {
    background: rgba(255,255,255,0.46);
    border: 1px solid rgba(61, 81, 98, 0.9);
}
.dd-wrapper .dd-container {
    background: rgba(255,255,255,0.85);
}
.dd-wrapper .dd-container .dd-option:hover {
    background-color: rgba(61, 81, 98,0.3);
}
.dd-option.selected/*, .dd-wrapper .dd-container .dd-option.selected:hover*/ {
    background: rgb(61, 81, 98);
    color: #fff;
    border-bottom: 1px solid rgb(61, 81, 98);
    box-shadow: none;
}