﻿@font-face {
   font-family: 'Metroflex';
   src: url("/Content/Font/Metroflex/metroflex.eot"); /*internet explorer*//* IE9 Compat Modes */
   src: url('/Content/Font/Metroflex/metroflex.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url("/Content/Font/Metroflex/metroflex.css") format('truetype'), /*.ttf')  format('truetype'), /* Safari, Android, iOS */
   	     url("/Content/Font/Metroflex/metroflex.svg#metroflex") format('svg'), /* Legacy iOS */
         url("/Content/Font/Metroflex/metroflex.woff") format('woff'); /* Modern Browsers */
}

@font-face {
   font-family: 'MetroflexNarrow';
   src: url("/Content/Font/MetroflexNarrow/MetroflexNarrow.eot"); /*internet explorer*//* IE9 Compat Modes */
   src: url('/Content/Font/MetroflexNarrow/MetroflexNarrow.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url("/Content/Font/MetroflexNarrow/MetroflexNarrow.css") format('truetype'), /*.ttf')  format('truetype'), /* Safari, Android, iOS */
   	     url("/Content/Font/MetroflexNarrow/MetroflexNarrow.svg#metroflex_narrowlt") format('svg'), /* Legacy iOS */
         url("/Content/Font/MetroflexNarrow/MetroflexNarrow.woff") format('woff'); /* Modern Browsers */
}

@font-face {
   font-family: 'OpenSans';
   src: url("/Content/Font/OpenSans/OpenSans-regular.eot"); /*internet explorer*//* IE9 Compat Modes */
   src: url('/Content/Font/OpenSans/OpenSans-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url("/Content/Font/OpenSans/OpenSans-regular.css") format('truetype'), /*.ttf')  format('truetype'), /* Safari, Android, iOS */
   	     url("/Content/Font/OpenSans/OpenSans-regular.svg#metroflex") format('svg'), /* Legacy iOS */
         url("/Content/Font/OpenSans/OpenSans-regular.woff") format('woff'); /* Modern Browsers */
}

@font-face {
   font-family: 'Orbitron';
   src: url("/Content/Font/Orbitron/orbitron-regular.eot"); /*internet explorer*//* IE9 Compat Modes */
   src: url('/Content/Font/Orbitron/orbitron-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url("/Content/Font/Orbitron/orbitron-regular.css") format('truetype'), /*.ttf')  format('truetype'), /* Safari, Android, iOS */
   	     url("/Content/Font/Orbitron/orbitron-regular.svg#metroflex") format('svg'), /* Legacy iOS */
         url("/Content/Font/Orbitron/orbitron-regular.woff") format('woff'); /* Modern Browsers */
}

body {
    font-family: "OpenSans","Segoe UI", Verdana, Helvetica, Sans-Serif;
    letter-spacing:-0.5px;
    margin: 0 auto; 
    padding: 0; 
    height: 100%;
    display: inline-block;
    width: 100%;
    font-size:14px;
}

a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

a:active {
    text-decoration: underline;
}

    input.holo[type='text'], 
    input.holo[type='email'], 
    input.holo[type='password'],
    input.holo[type='number'] {
        /* You can set width to whatever you like */
        background: bottom left linear-gradient(#a9a9a9, #a9a9a9) no-repeat, bottom center linear-gradient(#a9a9a9, #a9a9a9) repeat-x, bottom right linear-gradient(#a9a9a9, #a9a9a9) no-repeat;
        background-size: 1px 6px, 1px 1px, 1px 6px;
    }
    input.holo[type='text']:hover, input.holo[type='text']:focus,
    input.holo[type='email']:hover, input.holo[type='email']:focus,
    input.holo[type='password']:hover, , input.holo[type='password']:focus 
    input.holo[type='number']:hover, input.holo[type='number']:focus {
        background: bottom left linear-gradient(#0099cc, #0099cc) no-repeat, bottom center linear-gradient(#0099cc, #0099cc) repeat-x, bottom right linear-gradient(#0099cc, #0099cc) no-repeat;
        background-size: 1px 6px, 1px 1px, 1px 6px; 
    } 

    /*MENU*/
   #showMenu {

                top: 0px;
                right: 0px;
                position: fixed;
                width: 40px;
                cursor:pointer;
                display:none;
                z-index:99;
    }

   #showMenu:hover {
            background:#dadada ;
        }

       .logo {
            width: 55px;
        margin: 0px auto;/*20px;*/
        display: inline-block;
    }

    .menu { 
        font-size: 0.9em;
        width: 79px; /*81px;*/
        text-align:center;
        display:inline-block;
    }

    .imgLogo {
        padding: 2px 0 0 0;
        width: 55px;
    }

    .notification_menu {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 999;
        width: 41px;
        cursor: pointer;
        height: 30px;
        padding: 5px 10px;
        /*background-color: #0098d9;*/
    }

        .notification_menu > img {
              width: auto;
            padding: 7% 0 0 0;
            height: 70%;
        }

        .notification_menu:hover {
            background:#dadada ;
        }



.unselectable {
/*CSS rule to disable text selection highlighting*/
    -webkit-touch-callout: none; /*Chrome, Opera, Safari (WebKit)*/
    -webkit-user-select: none; /*Chrome, Opera, Safari (WebKit)*/
    -khtml-user-select: none;
    -moz-user-select: none; /*Firefox*/
    -ms-user-select: none; /*Internet Explorer*/
    user-select: none;
    cursor: default;
}

input, textarea {
    font-family: "OpenSans";
    border: 1px solid #e2e2e2;

      border-top: none;
      border-right:none;
      border-left:none;
      width:calc(100% - 4px);
      margin:5px auto;
      height:27px;

    background: #fff;
    color: #333;
    font-size: 1em;
    padding: 2px;

    /*width: 200px;
    margin: 5px;
    height:26px;*/
}

.inputContainer > input{
   width: 216px;
}

#body {
    text-align:center;
    
}

   ul, li {
    list-style-type: none;
    list-style: none;
}

.title {
    /*background: url("../Images/General/info_box_title_bg_long.png") no-repeat scroll left bottom rgba(0, 0, 0, 0);*/
    border-bottom: 2px solid #337ab7;
    text-align:center;
    font-size: 20px;
    font-weight: bold;
    padding-bottom: 5px;
    color: #337ab7;
    width: 220px;
margin: 0.83em auto;
}

.content-wrapper {
    /*padding-left: 86px;*/
    max-width:1200px;
    margin: 50px auto 0 auto;
}

            .menu-left {
                /*box-shadow: 0 1px 10px rgba(0, 0, 0, 0.45), 0 0 30px rgba(0, 0, 0, 0.07) inset;*/
                border-bottom: 1px solid #c6c6c6;
                color: white;
                display: block;
                position: fixed;
                top: 0px;
                left: 0%;
                z-index: 99;
                height:100%;
                background-color: #337ab7; /*0073b2; /*#1f1f1f;*/ /*#4f4f4f;*/
            }

            .menu-right {
                box-shadow: 0 1px 10px rgba(0, 0, 0, 0.45), 0 0 30px rgba(0, 0, 0, 0.07) inset;
                color: white;
                display: block;
                position: fixed;
                top: 0px;
                right: 0%;
                z-index: 98;
                height:100%;
                background-color: #4f4f4f;
                /*background-image: -webkit-linear-gradient(top, #363636, #2E2E2E);
                background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #363636), color-stop(1, #2E2E2E));
                background-image: -moz-linear-gradient(top, #363636, #2E2E2E);
                background-image: -ms-linear-gradient(top, #363636, #2E2E2E);
                background-image: -o-linear-gradient(top, #363636, #2E2E2E);
                background-image: none, linear-gradient(to bottom, #363636 0px, #2E2E2E 100%);*/


            }


.main-container{
    display:inline-block;
    margin:0 auto;
}

input[disabled].btn:hover, input[disabled].btn:hover, input[disabled].btn:focus, .button[disabled]{
  opacity:0.5!important;
  filter: alpha(opacity=50)!important;
}


input[type="checkbox"] {
        -webkit-appearance: checkbox;
        width: 13px;
        height:13px;
    }

.button {
    display:inline-block;
    clear:both;
    text-transform:uppercase;
    background-color: rgba(0,0,0,0.4);
    border-width: 0px;
    color: white;
    background-position: 50% 50%;
    vertical-align: middle;
    box-sizing: border-box;
    cursor: pointer;
    line-height: 1.66em;
    padding: 0px 5px;
    text-align: center;
    text-decoration: none;
    border-style: solid;
     font-weight: 700;
     height:40px;
     word-wrap: break-word;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
     

}
    .button:hover {
         opacity:0.7!important;
  filter: alpha(opacity=70)!important;
    }

.errorTextPwd {
    text-align:right;
    margin: 0 5px;
    font-size: 13px;
    height:14px;
}

footer {
        width:5%;
        display: block;
        height:5%;
        position: fixed;
        bottom:0px;
        right:0px;
        z-index:99;
}
    
 .ikrotecFooter {
    max-height: 100%;/*50px;*/
    float:right;
}


.formLogin {
    max-width: 220px;
    display: block;
    /*margin:10% auto;*/
      margin: 15% auto 10%;
}

    .moduleProfile {
        padding:10px 20px;
        /*border-left: 1px solid #C3C3C3;*/
        text-align:left;
        display:inline-block;
        margin: 0px auto;
        height: 360px;
        vertical-align: top;
    }

    #fotoProfilo {
        display:inline-block;
        max-width:130px;
        max-height:150px;
        margin:5px auto;
    }
    #fotoProfiloContainer {
        /*background: none repeat scroll 0 0 #FAFAFA;
        border: 1px solid #C3C3C3;*/
        display:inline-block;
        width:207px;
        height:180px;
        text-align:center;
    }



.textAccount{
    height:19px;
    text-align:left;
    margin-left:6px;
}

    .formLogin > input {
        margin:0 auto;
        clear:both;
        display:block;
    }

    .formLogin > .inputContainer> .button {
        width: 210px!important;
    }

    .inputContainer {
    display:block;
    clear:both;
    max-width:250px;

}
.changeForm {
    cursor:pointer;
    display:block;
    clear:both;
    color:#0098d9;
    float:right;
    margin:5px;
}
.accountError{
    color: #fa2600;
    margin: 0;
    display:block;
}

    @keyframes blink {
        0% {
            opacity: 1;
            filter: alpha(opacity = 100); /*Internet Explorer*/
        }
        50% {
            opacity: 0;
            filter: alpha(opacity = 0); /*Internet Explorer*/
        }
        100% {
            opacity: 1;
            filter: alpha(opacity = 100); /*Internet Explorer*/
        }
    }

    @-webkit-keyframes blink /* Safari and Chrome */
        {
        0% {
            opacity: 1;
            filter: alpha(opacity = 100); /*Internet Explorer*/
        }
        50% {
            opacity: 0;
            filter: alpha(opacity = 0); /*Internet Explorer*/
        }
        100% {
            opacity: 1;
            filter: alpha(opacity = 100); /*Internet Explorer*/
        }
    }

.lampeggiaTemp {
        animation: blink 1s;
        -webkit-animation:blink 1s;
        animation-iteration-count: infinite; /*infinite*/
        -webkit-animation-iteration-count:infinite; /*Safari and Chrome*/
}

    @keyframes blinkSVG {
        0% {
            fill-opacity: 0;
        }
        15% {
            fill-opacity: 1;
            fill:#FF5918;
        }
        30% {
            fill-opacity: 0;
        }
        45% {
            fill-opacity: 0.5;
            fill:#FF5918;
        }
        60% {
            fill-opacity: 0;
        }
        75% {
            fill-opacity: 0.5;
            fill:#FF5918;
        }
        100% {
            fill-opacity: 0;
        }
    }

@-webkit-keyframes blinkSVG /* Safari and Chrome */ 
{
        0% {
            fill-opacity: 0;
        }
        15% {
            fill-opacity: 1;
            fill:#FF5918;
        }
        30% {
            fill-opacity: 0;
        }
        45% {
            fill-opacity: 0.5;
            fill:#FF5918;
        }
        60% {
            fill-opacity: 0;
        }
        75% {
            fill-opacity: 0.5;
            fill:#FF5918;
        }
        100% {
            fill-opacity: 0;
        }
}

.loading_general {
    position: fixed;
    z-index: 999;
    padding: 5px;
    top: 49%;
    left: calc(47.5% - 5px);
    border-radius: 50%;
    background-color: rgba(0,0,0,0.3);
    display: none;
    width: 5%;
    min-width: 50px;
    /*animation: rotate_loading 0.4s;
    -webkit-animation: rotate_loading 0.4s;
    animation-iteration-count: infinite; /*infinite*/
    /*-webkit-animation-iteration-count: infinite; /*Safari and Chrome*/
    line-height: 50px;
    width: 50px;
    height: 50px;
    color: #337ab7;
}

#loadingNotificationPanel {
        position:fixed;
        padding: 5px;
        top: 49%;
            right: calc(50% - 25px);
          z-index: 9999;
            border-radius: 50%;
        background-color: rgba(0,0,0,0.1);
            display:none;
            width:50px;
            animation: rotate_loading 0.4s;
            -webkit-animation:rotate_loading 0.4s;
            animation-iteration-count: infinite; /*infinite*/
            -webkit-animation-iteration-count:infinite; /*Safari and Chrome*/
}

@keyframes rotate_loading { /* Standard syntax */
        0% {
            -ms-transform: rotate(0deg); /* IE 9 */
            transform: rotate(0deg);
        }
        25%{
            -ms-transform: rotate(90deg); /* IE 9 */
            transform: rotate(90deg);   
        }
        50% {
            -ms-transform: rotate(180deg); /* IE 9 */
            transform: rotate(180deg);
        }
        75%{
            -ms-transform: rotate(270deg); /* IE 9 */
            transform: rotate(270deg);
        }
        100% {
            -ms-transform: rotate(360deg); /* IE 9 */
            transform: rotate(360deg);
        }
    }

@-webkit-keyframes rotate_loading /* Chrome, Safari, Opera */
        {
        0% {
            -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
        }
        25%{
            -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */    
        }
        50% {
            -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
        }
        75%{
            -webkit-transform: rotate(270deg); /* Chrome, Safari, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg); /* Chrome, Safari, Opera */
        }
    }


.lampeggiaSVG {
        animation: blinkSVG 2s;
        -webkit-animation:blinkSVG 2s;
        animation-iteration-count: infinite; /*infinite*/
        -webkit-animation-iteration-count:infinite; /*Safari and Chrome*/
}

.clock {
        animation: blink 2s;
        -webkit-animation:blink 2s;
        animation-iteration-count: infinite; /*infinite*/
        -webkit-animation-iteration-count:infinite; /*Safari and Chrome*/
}

.expandIcon {
       animation: expand 2s;
        -webkit-animation:expand 2s;
        animation-iteration-count: infinite; /*infinite*/
        -webkit-animation-iteration-count:infinite; /*Safari and Chrome*/
}

    @keyframes expand {
        0% {
            background:url("../Images/General/expand_white0.png") no-repeat #c6c6c6;
        }
        50% {
            background:url("../Images/General/expand_white1.png") no-repeat #c6c6c6;
        }
        100% {
            background:url("../Images/General/expand_white0.png") no-repeat #c6c6c6;
        }
    }

    @-webkit-keyframes expand  { /* Safari and Chrome */
        0% {
            background:url("../Images/General/expand_white0.png") no-repeat  #c6c6c6;
        }
        50% {
            background:url("../Images/General/expand_white1.png") no-repeat #c6c6c6;
        }
        100% {
            background:url("../Images/General/expand_white0.png") no-repeat #c6c6c6;
        }
    }

        @keyframes expandCrono {
        0% {
            background:url("../Images/General/expand_white0.png") no-repeat #4f4f4f;
        }
        50% {
            background:url("../Images/General/expand_white1.png") no-repeat #4f4f4f;
        }
        100% {
            background:url("../Images/General/expand_white0.png") no-repeat #4f4f4f;
        }
    }

    @-webkit-keyframes expandCrono  { /* Safari and Chrome */
        0% {
            background:url("../Images/General/expand_white0.png") no-repeat  #4f4f4f;
        }
        50% {
            background:url("../Images/General/expand_white1.png") no-repeat #4f4f4f;
        }
        100% {
            background:url("../Images/General/expand_white0.png") no-repeat #4f4f4f;
        }
    }


    @keyframes rotate {
    0% {
                /* Rotate div */
        transform:rotate(0deg);
        -ms-transform:rotate(0deg); /* IE 9 */
        -webkit-transform:rotate(0deg); /* Safari and Chrome */

    }
    40% {
        transform:rotate(-15deg);
        -ms-transform:rotate(-15deg); /* IE 9 */
        -webkit-transform:rotate(-15deg); /* Safari and Chrome */
    }
    60% {
        transform:rotate(0deg);
        -ms-transform:rotate(0deg); /* IE 9 */
        -webkit-transform:rotate(0deg); /* Safari and Chrome */
    }
    80% {
        /* Rotate div */
        transform:rotate(15deg);
        -ms-transform:rotate(15deg); /* IE 9 */
        -webkit-transform:rotate(15deg); /* Safari and Chrome */
    }
    100% {
        transform:rotate(0deg);
        -ms-transform:rotate(0deg); /* IE 9 */
        -webkit-transform:rotate(0deg); /* Safari and Chrome */
    }
}

@-webkit-keyframes rotate {
    0% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg); /* IE 9 */
        -webkit-transform: rotate(0deg); /* Safari and Chrome */
    }

    40% {
        transform: rotate(-15deg);
        -ms-transform: rotate(-15deg); /* IE 9 */
        -webkit-transform: rotate(-15deg); /* Safari and Chrome */
    }

    60% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg); /* IE 9 */
        -webkit-transform: rotate(0deg); /* Safari and Chrome */
    }

    80% {
        /* Rotate div */
        transform: rotate(15deg);
        -ms-transform: rotate(15deg); /* IE 9 */
        -webkit-transform: rotate(15deg); /* Safari and Chrome */
    }

    100% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg); /* IE 9 */
        -webkit-transform: rotate(0deg); /* Safari and Chrome */
    }
}


/*****************************************NOTIFICATION*******************************/

    .notification_number_area {
        border-radius: 5px;
        background: #f03436;
        min-width:14px;
        height:14px;
        padding:2px;
        font-size:11px;
        position:fixed;
        /*top:105px;
        left:15px;*/
        top: 2px;
        right: 5px;
        z-index: 99999;
        cursor:pointer;
        text-align:center;
        -moz-transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
		-webkit-transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -o-transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -ms-transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
         -webkit-box-shadow: 1px 1px 2px 0px rgba(50, 50, 50, 0.75);
        -moz-box-shadow:    1px 1px 2px 0px rgba(50, 50, 50, 0.75);
        box-shadow:         1px 1px 2px 0px rgba(50, 50, 50, 0.75);
    }

    .notification_list_panel {
        display:none;
        width:100%;
        height:100%;
    }


    .notification_number_area:hover {
        background: #A80000;
        animation: rotate 1s;
      -webkit-animation: rotate 1s;
      animation-iteration-count: infinite;
      -webkit-animation-iteration-count: infinite;
    }

    .notification_number_area > div {
        width:100%;
        -moz-transform: scale(1) rotate(-10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
		-webkit-transform: scale(1) rotate(-10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -o-transform: scale(1) rotate(-10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        -ms-transform: scale(1) rotate(-10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
        transform: scale(1) rotate(-10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    }

    .message_list {
        font-size:0;
        color: #72727D;
        margin:0;
        padding:0px;
        background:white;
        position:fixed;
        top:41px;
        right:0;
        z-index:99;
        min-width:250px;
        width:100%; /*25%*/
        height:100%;
        /*box-shadow: 0 1px 10px rgba(0, 0, 0, 0.45), 0 0 30px rgba(0, 0, 0, 0.07) inset;*/
        overflow: scroll;
    }

    .message_list > li {
        cursor:pointer;
          min-height: 35px;
          width: 96%;/*92%;*/
        padding: 1% 2%;/*3% 4%;*/
        text-align:left;
        display:inline-block;
          border-bottom: 1px solid #CBC9C9;
    }

    .message_list > li:hover {
          background:#F0F0F0; /*#f8f7f8 ; /*EFEFF2;*/
    }

    .message_title{
        cursor:pointer;
        display:inline-block;
        width:80%;
        font-size:15px;
        font-weight:bold;
        float:left;
    }

    .message_desc {
        width:95%;
        font-size:15px;
        /*clear: both;*/
        /*display: none;*/
        float: left;
    }

    .message_dt {
        width:20%;
        color: #a6a6a6;
        font-size:11px;
        float:right;
        display:inline-block;
        text-align:right;
    }

    .message_delete {
        float:right;
        width:5%;
        max-width: 30px;
        height:auto;
        display:inline-block;
    }

    .edit {
    cursor:pointer;
}
    .edit:hover {
        animation: rotate 1s;
        -webkit-animation:rotate 1s;
        animation-iteration-count: infinite; /*infinite*/
        -webkit-animation-iteration-count:infinite; /*Safari and Chrome*/
    }

    .link_notification {
          color: #FF5918;
        text-decoration: none;
    }

    .link_notification:hover {
        color:#CBC9C9;
    }

    .not_read {
        background:#dFDFD2;
    }

    .panel_overlay {
        background-color: #0A0A16;
        display:none;
        bottom: 0;
        left: 0;
        opacity: 0.4;
        width: 100%;
        height: 100%;
        position: fixed;
        right: 0;
        top: 0;
        z-index: 999;
        transition-property: opacity;
        transition-duration: 0.15s;
    }

    ::-webkit-scrollbar { 
    display: none; 
}

    
/****************************************************************************************/

        #credit_list {
        width:100%;
        padding:0;
        display:inline-block;
        font-size:1.1em;
        min-width:360px;
    }

    #credit_list > li {
        display: inline-block;
        border-bottom: solid 1px #ddd;
        width: calc(100% - 20px);
        padding:5px;
        margin:0 5px;
    }

    .credit_code {
        color: #337ab7;
        font-weight:bold;
        width:25%;
        height:21px;
        float:left;
        font-size: 0.9em;
        text-align: left;
        display:inline-block;
        word-wrap: break-word;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .credit_name {
        width:41%;
        height:21px;
        float:left;
        display:inline-block;
    }

    .credit_point {
        width:15%;
        /*height:21px;*/
        float:left;
        display:inline-block;
        text-align: right;
    }

    .credit_cost {
        width:18%;
        height:21px;
        float:left;
        display:inline-block;
    }

    .credit_operator {
        width:18%;
        height:21px;
        float:left;
        display:inline-block;
        text-align: center;
        font-size: 0.8em;
        line-height: 21px;
    }


/****************************************************************************************/


/****************************************************************************************/



    .device_list {
        position: absolute;
        z-index: 98;
        background: white;
        top: 40px;
        margin: 0;
        padding: 0 0 40px 0;
        width: 450px; /*40%;*/
        max-width: 450px;
         height: calc(100% - 40px);
        left: 0;
        /*box-shadow: 0 1px 10px rgba(0, 0, 0, 0.45), 0 0 30px rgba(0, 0, 0, 0.07) inset;*/
        border-right: 1px solid #c6c6c6;
        overflow: scroll;
    }


        .device_list > li {
            border-bottom: 1px solid #c6c6c6;
            display: inline-block;
            padding: 5px;
            margin: 0 5px;
            width: calc(50% - 20px);
            float: left;
        }

            .device_list > li > .text_container {
                cursor: pointer;
            }

            .device_list > li:hover {
                background: no-repeat right center #f3f3f3;
            }

    .text_container {
        display: inline-block;
        width: 85%;
        float: left;
        text-align: left;
    }

    .device_code {
        font-size: 1.2em;
        color: #337ab7;
    }

    .device_note {
        font-size: 1.4em;
    }


    .last_update {
        font-size: 0.7em;
    }

    .manager_icon {
        color: #333;
        width: 100%;
        display: inline-block;
        font-size: 10px;
        float:left;
    }

        .manager_icon:hover {
            color: #c6c6c6;
        }

    .onlineContainer {
        float: right;
        width: 10%;
        max-width: 80px;
        display: inline-block;
    }

    .online {
        width: 100%;
        height: auto;
        display: inline-block;
    }

    /****************************************************************************************/

    .device_control {
            width: 320px;
            padding: 5px;
            position: absolute;
            z-index: 999;
            display: inline-block;
            background: white;
            top: 51px;
            left: calc(50% - 165px);
            border: 1px solid #c6c6c6;
            border-radius:5px;
        }

        #digital_input {
            width: 320px;
            padding: 5px;
            position: absolute;
            bottom: 170px;
            display: inline-block;
            background: white;
            z-index: 999;
            left: calc(50% - 165px);
            border: 1px solid #c6c6c6;
            font-size:12px;
            border-radius:5px;
        }

        #analogic_input {
            width: 320px;
            padding: 5px;
            position: absolute;
            bottom: 120px;
            display: inline-block;
            background: white;
            z-index: 999;
            left: calc(50% - 165px);
            border: 1px solid #c6c6c6;
            font-size:12px;
            border-radius:5px;
        }

        #digital_output{
            width: 320px;
            padding: 5px;
            position: absolute;
            bottom: 70px;
            display: inline-block;
            background: white;
            z-index: 999;
            left: calc(50% - 165px);
            border: 1px solid #c6c6c6;
            font-size:12px;
            border-radius:5px;
        }

        .digital_input {
            display: inline-block;
            width: 25px;
            height: 25px;
            padding: 5px;
            border: 1px solid #c6c6c6;
            border-radius: 100%;
            line-height: 25px;
            
        }

         .analogic_input {
            display: inline-block;
            width: 25px;
            height: 25px;
            padding: 5px;
            border: 1px solid #c6c6c6;
            border-radius: 100%;
            line-height: 25px;
        }

        .digital_output {
            display: inline-block;
            width: 25px;
            height: 25px;
            padding: 5px;
            border: 1px solid #c6c6c6;
            border-radius: 25%;
            line-height: 25px;
            cursor:pointer;
        }

        .digital_output:hover {
            background:#c6c6c6!important;
            color:white!important;
        }

        .ntc{
            width:60px;
            border-radius: 10%;
        }

        .text_container_manager {
            text-align: center !important;
        }

        .text_container_manager {
            display: inline-block;
            width: calc(100% - 270px);
            min-width: 340px;
            float: left;
            text-align: left;
        }

        .btn-container {
            width: 270px;
            display: inline-block;
            float: right;
        }

        #index_motor {
            width: 35px;
            margin: 0 0 0 10px;
            height: 22px;
        }

        #gps_timer {
            width: 60px;
            margin: 0 0 0 10px;
            height: 22px;
        }

        #sms_number {
            width: 110px;
            margin: 0 0 0 10px;
            height: 22px;
            text-align: center;
        }

        .btn-dark {
            /* border-radius: 0; */
            color: #fff;
            background-color: rgba(0,0,0,0.4);
        }

        .btn-group-lg > .btn, .btn-lg {
            padding: 10px 16px;
            font-size: 18px;
            line-height: 1.3333333;
            border-radius: 6px;
        }

        .btn {
            height: 29px;
            display: block;
            padding: 6px 12px;
            margin-bottom: 0;
            font-size: 14px;
            font-weight: 400;
            line-height: 29px;
            text-align: center;
            white-space: nowrap;
            vertical-align: middle;
            -ms-touch-action: manipulation;
            touch-action: manipulation;
            cursor: pointer;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            background-image: none;
            border: 1px solid transparent;
            border-radius: 4px;
            margin: 5px 0;
            width: 240px;
            clear: both;
        }

        .set_do {
            width: 104px;
            clear: none;
            display: inline-block;
            margin: 0px 5px 5px 5px;
            margin-left: 0px;
            float: left;
        }

        .do_off {
            clear: both;
            display: block;
            margin-right: 5px;
        }

        .btn-input {
            height: 75px;
            cursor: default;
            border: 1px solid rgba(0,0,0,0.4);
        }

        .btn-set {
            width: 200px;
            margin: 5px auto;
            height: 20px;
            line-height: 20px;
        }

        .btn-dark:hover, .btn-dark:focus, .btn-dark:active {
            color: #fff;
            background-color: rgba(0,0,0,0.7);
        }

        /*.session_log {
            position: absolute;
            top: 131px;
            left: 10px;
            margin: 0;
            width: 300px;
            height: calc(100% - 203px);
            padding: 5px;
            z-index: 999;
            background: white;
            border: 1px solid #c6c6c6;
            border-radius:5px;
        }

            .session_log > li {
                margin: 2px 0;
                width: 100%;
                display: inline-block;
                border-bottom: 1px solid #c6c6c6;
                font-size: 0.9em;
            }*/

        #map {
            width: 100%;
            height: calc(100% - 40px);
            display: block;
            position: absolute;
            top: 40px;
            right: 0px;
        }

        .marker-label {
            width: 90px;
            height: 20px;
            border: 1px solid #337ab7;
            border-radius: 5px;
            background: white;
            text-align: center;
            line-height: 20px;
            font-weight: bold;
            font-size: 12px;
            color: #337ab7;
        }

        /****************************************************************************************/

/********************
*  Styles 1920px   *
********************/

@media only screen and (max-width: 1920px) {



}


/********************
*  Styles 1650px   *
********************/

@media only screen and (max-width: 1650px) {


}


/********************
*  Styles 1368px   *
********************/

@media only screen and (max-width: 1368px) {


}



/********************
*  Styles 1024px   *
********************/

@media only screen and (max-width: 1024px) {


}

/********************
*   Mobile Styles 768px   *
********************/

@media only screen and (max-width: 768px) {

    .formLogin {
        max-width: 220px;
        display: block;
        /* margin: 10% auto; */
        margin: 25% auto 10%;
    }

    .changeForm{
        display:none;
    }

    #showMenu {
        display:block;
    }

    #menuPrincipale {
        display:none;
    }

    .content-wrapper {
      padding-left: 0px;
      z-index: 99;
    }

    .k-image {
        height: 25px!important;
    }



    .k-link {
        font-size: 14px!important;
    }

    /*.menu, .notification_menu {
        width: 65.5px!important;
    }*/


    .message_list {
        width: 100%;
    }

    .notification_menu {
        right: 40px;
    }

    .message_list > li {
        width: 96%;
        padding: 1% 2%;
    }

    
    footer {
        display:none;
    }

    .notification_menu {
        top:initial;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 30px;
        padding: 5px 0;
        background-color: #4d4d4d;
        /*background-color: #0098d9;*/
        /*box-shadow: 0 1px 10px rgba(0, 0, 0, 0.45), 0 0 30px rgba(0, 0, 0, 0.07) inset;*/
    }

    .notification_menu > img {
        padding: 5px 0 0 0;
        height: 21px;
    }

    .notification_number_area {
        /*right: 45px;*/
        bottom: 18px;
        right: calc(50% - 25px);
        top: initial;
    }

    .notification_menu:hover {
        background: #9d9d9d;
    }

    /*.session_log {
        display:none;
    }*/

    .device_list{
        width:100%;
    }

    .device_list > li {
        width:calc(100% - 20px)
    }
}

/********************
*   Mobile Styles 340px   *
********************/

@media only screen and (max-width: 340px) {




}