#helper {
    position: absolute;
    display: block;
    z-index: 9999;
    top: 0;
    left: 0;
/*    background-color: #dfc56e;*/
    background-color: rgba(170, 10, 15, 1);
            
    text-align: center;
    opacity: 1;

    -webkit-user-select: none; /* Chrome/Safari */        
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */

    /* Rules below not implemented in browsers yet */
    -o-user-select: none;
    user-select: none;
}

.helper-box {
     background-repeat: no-repeat;
     background-position: center;
     background-size: contain;
}

.helper-frame {
    display: block;
    float: left;
    width: 240px;
    height: 291px;
    font-size: 13px; 
    font-family: 'Roboto', sans-serif;
    padding: 5px;
    overflow: hidden;
    position:relative;
}

.helper-avatar {
    margin-bottom: 20px;
    opacity: 1;
}

.helper-button {
    display: block;
    float: right;
    color: #FFFFFF;
    font-weight: bolder;
    font-size: 21px; 
    font-family: 'Roboto', sans-serif;
    margin: 5px;
    cursor: pointer;
    width: 17px;
    height: 17px;
    background-size: contain;
    background-repeat: no-repeat;
}

.helper-title {
    padding-top: 15px;
    padding-bottom: 15px;
    margin-bottom: 10px;
    color: white;
    opacity: 1;
    cursor: default;
}

.helper-box {
    position: relative;
    width: 240px;
    height: 160px;
    overflow: hidden;
    margin: auto;
    margin-bottom: 15px;
}

.helper-roi {
    top: 15%;
    left: 20%;
    width: 60%;
    height: 70%;
    border: 2px solid red;
    position: absolute;
    z-index: 300;
    pointer-events: none;
    display: none;
}

.helper-logo {
    position: absolute;
    bottom: 0;
    left: 0;
    background-image: url(../../img/_COP.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height: 24px;
    margin: 24px 0px 24px 0px;
}

.helper-box.helper-settings {
   width: 214px;
   height: 137px;
}

.button {
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 10px;
    border: 2px solid white;
    letter-spacing: 10px;
    font-weight: bold;
    cursor: pointer !important;
}

.button:hover {
    color: #e41b1f !important;
    background-color: white;
}

.helper-settings-frame {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    display: none;
    background-color: rgba(170, 10, 15, 1);
}



.helper-settings-button {
    position: absolute;
    display: block;
    bottom: 5px;
    right: 5px;
    color: #FFFFFF;
    font-weight: bolder;
    font-family: 'Roboto', sans-serif;
    padding: 5px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAQAAACROWYpAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAADdcAAA3XAUIom3gAAAAHdElNRQfgBBYNDjjkOxniAAADK0lEQVQ4y5XVS2zWVRAF8PMVNpZQhLRAQQLRIgESiAIRUOnGIMSdCW268R2Ke+OSoqLRBuJGQaSQFBPf7kVCXLAQKCVpjZDwCCAEF0KwPBvSfj8X36MPHtG7+s+dmXvnnjNz/skDls/cVlR0XUcevoz7ttYNpx100AXXLL43YpyhVqMpCkniHaxPEm+4qy1JFEw1y6Qx6eXUGT5x1Q+Wm6zej2gSBauxy3R1nvOzW7aZMe52M3yBE246a4dThpws3zHNJcPO2Ouyq/qwq5ReSZ3kU+wx1wb97ujxoWVqkkSNZ3zgiJuOekmjLmwvHVxKfgzHy+U85VWzKw+qFKdRm0VJYqY+g5WIJOr1uOT5cTjelxMvuuKgaUlSwnZC1ubb9Ob1woVECkkszqrMSXIxvxX+qO4+me48npYcKhRHznvUNwZsKFu1OvQrgqJ+W0wqe1pd123KWLSnO6On9BK1duOYdmus0a4HXWXsZzrsrIaRxIVa7VT0UdnuQJcmE0pP0mQ3tpS97xvylXarSqHX3MVlzyaJRfr1ahoDVJMe/RYniWXOYdiA7XHdJZs0ayjz+qZhm0yodl7p9nZFb5V5n2yJFmfciqJfEwWVwC1ovoekNXhvzIG/KNZUvIX8/1WTwcz2QuapVVNIkospZpGJY8vOwsjFpBA16rJUa57InfjcDfC7ZVXAjps/DrDeKmArnC8D1pnEOu/6yVCVqs3YY76JVaq6qOiJrYZ022jl6O4+pcesJPGIL3Hc25o126QXu9WWB+SoU6ObJInJdhj0WrU9N+s3DIb161Bb9rS5Ya+6klUoQ/10vs9gXin0Vkdg0ajBOFHdXZDuzEtLDhWq0zrFd25r+08juc4V+00d2Wz0t5PmJok5XtZ4XzFYkCRm6XOzhE5FNz9Gl3qrHXDNUVutqMrQclsdccNh682yB50l+EYEcCeO+dM/vnbakPPqUoLynCGn7fWXK/qwc5QAVqV3u6Ij1pmiwT4sFbEE+zSos8Z+N3WOk14VDZ2tvlxsu2GtSaLFsI2jRL/2Af+MUZiuMuCsAw44a8DKh/xu7kvLNrcUFd3S+aCYfwExQ9c9rQW0yAAAAABJRU5ErkJggg==');
    background-size: contain;
    display: block;
}

.helper-settings-button {
    position: absolute;
    display: block;
    bottom: 5px;
    right: 5px;
    color: #FFFFFF;
    font-weight: bolder;
    font-family: 'Roboto', sans-serif;
    padding: 5px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAQAAACROWYpAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAADdcAAA3XAUIom3gAAAAHdElNRQfgBBYNDjjkOxniAAADK0lEQVQ4y5XVS2zWVRAF8PMVNpZQhLRAQQLRIgESiAIRUOnGIMSdCW268R2Ke+OSoqLRBuJGQaSQFBPf7kVCXLAQKCVpjZDwCCAEF0KwPBvSfj8X36MPHtG7+s+dmXvnnjNz/skDls/cVlR0XUcevoz7ttYNpx100AXXLL43YpyhVqMpCkniHaxPEm+4qy1JFEw1y6Qx6eXUGT5x1Q+Wm6zej2gSBauxy3R1nvOzW7aZMe52M3yBE246a4dThpws3zHNJcPO2Ouyq/qwq5ReSZ3kU+wx1wb97ujxoWVqkkSNZ3zgiJuOekmjLmwvHVxKfgzHy+U85VWzKw+qFKdRm0VJYqY+g5WIJOr1uOT5cTjelxMvuuKgaUlSwnZC1ubb9Ob1woVECkkszqrMSXIxvxX+qO4+me48npYcKhRHznvUNwZsKFu1OvQrgqJ+W0wqe1pd123KWLSnO6On9BK1duOYdmus0a4HXWXsZzrsrIaRxIVa7VT0UdnuQJcmE0pP0mQ3tpS97xvylXarSqHX3MVlzyaJRfr1ahoDVJMe/RYniWXOYdiA7XHdJZs0ayjz+qZhm0yodl7p9nZFb5V5n2yJFmfciqJfEwWVwC1ovoekNXhvzIG/KNZUvIX8/1WTwcz2QuapVVNIkospZpGJY8vOwsjFpBA16rJUa57InfjcDfC7ZVXAjps/DrDeKmArnC8D1pnEOu/6yVCVqs3YY76JVaq6qOiJrYZ022jl6O4+pcesJPGIL3Hc25o126QXu9WWB+SoU6ObJInJdhj0WrU9N+s3DIb161Bb9rS5Ya+6klUoQ/10vs9gXin0Vkdg0ajBOFHdXZDuzEtLDhWq0zrFd25r+08juc4V+00d2Wz0t5PmJok5XtZ4XzFYkCRm6XOzhE5FNz9Gl3qrHXDNUVutqMrQclsdccNh682yB50l+EYEcCeO+dM/vnbakPPqUoLynCGn7fWXK/qwc5QAVqV3u6Ij1pmiwT4sFbEE+zSos8Z+N3WOk14VDZ2tvlxsu2GtSaLFsI2jRL/2Af+MUZiuMuCsAw44a8DKh/xu7kvLNrcUFd3S+aCYfwExQ9c9rQW0yAAAAABJRU5ErkJggg==');
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
}


.helper-tutorial-button {
    position: absolute;
    display: block;
    bottom: 30px;
    right: 1px;
    color: #FFFFFF;
    font-weight: bolder;
    font-family: 'Roboto', sans-serif;
    padding: 5px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAVCAYAAACdbmSKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RUQ1RDFBRTgxOEY3MTFFNkFEMzRCQzZDQTNFMTMwRjAiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MzQzQUY3OUExOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MzQzQUY3OTIxOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MzQzQUY3OTMxOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz67z4AyAAAAzUlEQVR42pyU4RGCMAyFQ88FukIdwRXqCK7ACl3BFXQEV8ARcAQZAUaowWuP8C7S4rv7foTmNSHhoBgjCQLTx7Xe6bnNeTnZpcMtjYyXppJBGp0hosA4WjQxZ6ZhjswgzizTzlUecFuA97zAeT9XOtFaL4gniO0htbAli5cYKquF+EnQPyl7Q7m9hlbuqcYQ8IuQ2LTEn2vQTLiXG+Zo03MQ3zGhxjRgQvPtcacM/SHN5JmRmVvolM9InR6O+1ozvbKUSl5U6+S/IfMRYAD6ZPrOpKPiLAAAAABJRU5ErkJggg==');
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
}

.hslider {
    margin-right: 12px;
    width: 50% !important;
    float: right !important;
}

.slider-txt {
    margin-left: 12px;
    font-size: 0.8em;
    text-transform: uppercase;
    float: left;
}

.scontainer {
    margin-top: 2px;
    display: inline-block;
    width: 100%;
}

.first-row {
    margin-top: 9px !important;
}

.slider-track {
    height: 6px !important;
}

.slider-selection {
    background: white;
}

.slider-track-high {
    background: #dcdcdc;
}

.slider-handle {
    width: 17px !important;
    height: 17px !important;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dcdcdc+0,ffffff+100 */
    background: #dcdcdc; /* Old browsers */
    background: -moz-linear-gradient(top,  #dcdcdc 0%, #ffffff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #dcdcdc 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #dcdcdc 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dcdcdc', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}


.helper-button-x {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAVCAYAAACkCdXRAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MzQzQUY3OTcxOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MzQzQUY3OTYxOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MzQzQUY3OTIxOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MzQzQUY3OTMxOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6R2Wa8AAAA3UlEQVR42pSUUREDIQxEmTo4C1ioBSycBSxgAQtUwlUCFrCAhasEysfRYehu4JjJDxseIbNBlVJUjVT+l740FAfIN03UQAwEZFhunxRA0hPA4pBz1thG2HYJ/YoLVbmmj7c61ItOz4OW+/OoJ5lUZ8FF+wyGnmKFS0QYanJZsQ6D6QnIo3NKMKYnoJ8Vxngovt5k/1XjAxWhsnCnX9IzzaRnxx1YAn2SzExhlhxMkvsRTJpPcS4RzE+aHSWbzIwaVv+yERYXLUD/vZawr44MeUFsMA1+BDoyQnXuK8AAk9Ql4nqUm2wAAAAASUVORK5CYII=');
}


.helper-button-k {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAXCAYAAAALHW+jAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgTWFjaW50b3NoIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjM0M0FGNzkyMThGNDExRTZBRDM0QkM2Q0EzRTEzMEYwIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjM0M0FGNzkzMThGNDExRTZBRDM0QkM2Q0EzRTEzMEYwIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MzQzQUY3OTAxOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MzQzQUY3OTExOEY0MTFFNkFEMzRCQzZDQTNFMTMwRjAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5V/MglAAABlUlEQVR42pTVTyiEQRjH8dlolcgBKcX6c3JwEEmbowPhrI0tJ+Xg5kpJLSklLi4OclJEUS5ykBz9aXNwUDhg3TasP6XXd/JMprmYeepzeN7e/e3sszPvq6Io2oh+q4AuDOJbrs1DeZjGraabEpxKwDOaMBn91ZhH4JK52VyokW/QdY1KrEmvV9sXGqi14kWun6Acx9K/oi00UDnz20QVbqR/QH1ooHLmt4AW5KW/QkVooLLmp2scvdbKDxEPDYxb89NB/ZiwvmQdsZBAJf+0md8b2rFqhc6EBipnfo9olp9sajQ0UDnzu0Ct7FVdX0iGBir5t00tys83dY/lkMAGOZLmaDZi1zma3ivUpyUr936iGxlntd4zLMKe9eE0hq1+X+7xDpy3Pjwnj7YP6bOyeu9tk7bCdpDAk/Q5mav3SUnKvHSdoRrn1hyTIWc5ISswG7kOW9ZqR0KeNmW4tF4HHZi1wjIhz8OYs7eGkLL6bedh8G+gvbem0Il3a46lvq+AYqVUD1K4wxFWcIAc8hhAQXnWjwADAO+r5lRw24F7AAAAAElFTkSuQmCC');
}


.helper-arrow-stay      {background-image: none;}
.helper-arrow-up        {background-image: url('../../img/arrows/su.png');}
.helper-arrow-up-right  {background-image: url('../../img/arrows/su-destra.png');}
.helper-arrow-up-left   {background-image: url('../../img/arrows/su-sinistra.png');}
.helper-arrow-down      {background-image: url('../../img/arrows/giu.png');}
.helper-arrow-down-right{background-image: url('../../img/arrows/giu-destra.png');}
.helper-arrow-down-left {background-image: url('../../img/arrows/giu-sinistra.png');}
.helper-arrow-right     {background-image: url('../../img/arrows/destra.png');}
.helper-arrow-left      {background-image: url('../../img/arrows/sinistra.png');}