﻿/*SUPPORT*/
.desktop-only {display: block !important;}
.mobile-only {display: none !important;}



/*SWITCHES*/
input[type="checkbox"].switch {width: 44px; height: 24px;}
input[type="checkbox"].switch:after {width: 18px; height: 18px; top: 3px; left: 3px;}
input[type="checkbox"].switch:checked:after {left: 23px;}

/*BUTTONS*/
.button {height: 42px; line-height: 42px; padding: 0 20px; font-size: 0.95em; border-radius: 20px;}
.btn-small {height: 30px; line-height: 30px; font-size: 0.75em;}

/*BUTTON ICONS*/
.btn-small.btn-icon-left {background-position: 6px center; background-size: 20px 20px;}
.btn-small.btn-icon-right {background-position: calc(100% - 6px) center; background-size: 20px 20px;}
.btn-icon-left {background-position: 9px center; padding-left: 45px; background-size: 24px 24px;}
.btn-icon-right {background-position: calc(100% - 9px) center; padding-right: 45px; background-size: 24px 24px;}

/*TABLES*/
.table .table-container {margin-left: 0; margin-right: 0;}
.table table {border-radius: 18px; margin: 0;}
.table table td, .table table th {padding: 20px; font-size: 0.9em;}
.table table a {width: 24px; height: 24px;}

/*TOOLTIP*/
.tooltip-container {position: relative; top: 41px; left: 46px; z-index: 100;}

/*COLUMNS*/
.columns:after {content: ''; clear: both; display: block;}
.columns .col {float: left;}
.columns-2 .col-1 {width: calc(50% - 24px); margin: 0 12px;}
.columns-2 .col-1:first-child, .columns-2 .col-1:last-child {width: calc(50% - 12px);}
.columns-3 .col-1 {width: calc(33.33% - 16px);}
.columns-3 .col-2 {width: calc(66.66% - 8px);}
.columns-4 .col-1 {width: calc(25% - 18px);}
.columns-4 .col-2 {width: calc(50% - 6px);}
.columns-4 .col-3 {width: calc(75% - 12px);}
.columns-5 .col-1 {width: calc(20% );}
.columns-5 .col-2 {width: calc(40% - 4.8px);}
.columns-5 .col-3 {width: calc(60% );}
.columns-5 .col-4 {width: calc(80% );}
.columns-6 .col-1 {width: calc(16.66% );}
.columns-6 .col-2 {width: calc(33.33% );}
.columns-6 .col-3 {width: calc(50% );}
.columns-6 .col-4 {width: calc(66.66% );}
.columns-6 .col-5 {width: calc(83.33% );}
.columns-7 .col-1 {width: calc(14.28% );}
.columns-7 .col-2 {width: calc(28.57% );}
.columns-7 .col-3 {width: calc(42.85% );}
.columns-7 .col-4 {width: calc(57.14% );}
.columns-7 .col-5 {width: calc(71.42% );}
.columns-7 .col-6 {width: calc(85.71% );}
.columns-8 .col-1 {width: calc(12.5% );}
.columns-8 .col-2 {width: calc(25% );}
.columns-8 .col-3 {width: calc(37.5% - 12px);}
.columns-8 .col-4 {width: calc(50% );}
.columns-8 .col-5 {width: calc(62.5% - 12px);}
.columns-8 .col-6 {width: calc(75% );}
.columns-8 .col-7 {width: calc(87.5% );}
.columns-9 .col-1 {width: calc(11.11% );}
.columns-9 .col-2 {width: calc(22.22% );}
.columns-9 .col-3 {width: calc(33.33% );}
.columns-9 .col-4 {width: calc(44.44% );}
.columns-9 .col-5 {width: calc(55.55% );}
.columns-9 .col-6 {width: calc(66.66% );}
.columns-9 .col-7 {width: calc(77.77% );}
.columns-9 .col-8 {width: calc(88.88% );}
.columns-10 .col-1 {width: calc(10% );}
.columns-10 .col-2 {width: calc(20% );}
.columns-10 .col-3 {width: calc(30% );}
.columns-10 .col-4 {width: calc(40% );}
.columns-10 .col-5 {width: calc(50% );}
.columns-10 .col-6 {width: calc(60% );}
.columns-10 .col-7 {width: calc(70% );}
.columns-10 .col-8 {width: calc(80% );}
.columns-10 .col-9 {width: calc(90% );}
.columns .col:first-child {margin: 0 12px 0 0 !important;}
.columns .col:last-child {margin: 0 0 0 12px !important;}

/*MENU*/
.menu {height: 100%; width: 270px;}
.menu header {height: auto; padding: 24px 0; background: #e6e6e6;}
.menu header:after {display: none;}
.menu header .iso {display: none;}
.menu header .logo {width: 190px; display: block; margin: 0 auto;}
.menu header .ic-menu {display: none;}
.menu .menu-list {height:calc(100% - 180px); padding: 0; background: #e6e6e6; overflow:auto;}
.menu .menu-list li > div, .menu .menu-list li > a {padding: 0 30px; border-top-left-radius: 0; border-bottom-left-radius: 0;}
.menu .menu-list li > div.drop-down:after {top: 13px; right: 15px; background-image: url('../Images/Controls/arrow_down_gray.svg');}
.menu .menu-list li .menu-item {margin-right: 15px; height: 50px; background: none;}
.menu .menu-list li .menu-item label {font-size: 0.7em; line-height: 50px; color: #7f7f7f;}
.menu .menu-list li:hover .menu-item, .menu .menu-list li.active .menu-item {background: #FF784A;}
.menu .menu-list li:hover .menu-item label, .menu .menu-list li.active .menu-item label {color: #fff;}
.menu .menu-list li:hover > div.drop-down:after, .menu .menu-list li.active > div.drop-down:after {background-image: url('../Images/Controls/arrow_down_white.svg');}
.menu .menu-list li .submenu-list li {margin: 0;}
.menu .menu-list li .submenu-list li .submenu-item {background: none; border-radius: 0; margin: 0 20px !important;}
.menu .menu-list li .submenu-list li .submenu-item label {font-size: 0.6em; line-height: 36px;}
.menu .menu-list li .submenu-list li:not(:first-child) .submenu-item {border-top: 1px solid #ddd;}
.menu .menu-list li.active .submenu-list {margin: 10px 0 20px 0;}
.menu .menu-list li.active .submenu-list li .submenu-item {height: 36px;}

/*PROGRESS BAR*/
.progress-bar {height: 18px; position: relative; background: #bbb; border-radius: 20px;}
.progress-bar .progress {background: #00646B; width: 0; height: 100%; position:absolute; top:0; left: 0; border-radius: 20px;}
.progress-bar .circle {width: 14px; height: 14px; border-width: 5px; }

/*CONTENT AND STRUCTURE*/
.content {width: auto; max-width: initial; margin-top: 0; margin-left: 270px;}
.content > header {height: 80px; background: #f1f1f1;}
.content > header:after {content: ''; display: block; clear: both;}
.content > header .info {padding: 20px 30px; float: left;}
.content > header .actions {float: right; margin: 20px;}
.content > header .actions .ic-settings {width: 32px; height: 32px; display: inline-block; vertical-align: middle; margin-right: 15px;}
.content > header .actions .user-options {display: inline-block; vertical-align: middle; position: relative; z-index: 2;}
.content > header .actions .user-options:hover{transform:scale(1.03);}
.content > header .actions .user-options .user {height: 38px; padding: 0 40px 0 10px; border-radius: 40px; position: relative; overflow: hidden; display: inline-block; cursor: pointer; vertical-align: middle;}
.content > header .actions .user-options .user:after {content: ''; display: block; width: 25px; height: 25px; background: transparent url('../Images/Controls/arrow_down_gray.svg') center no-repeat; position: absolute; top: 7px; right: 5px; transition: transform 0.3s ease-in-out; -webkit-transition: transform 0.3s ease-in-out; -moz-transition: transform 0.3s ease-in-out; -o-transition: transform 0.3s ease-in-out;}
.content > header .actions .user-options .user .ic-user-foto {margin-left:10px; width: 35px; height: 35px; display: inline-block; vertical-align: middle; border-radius:50%; background-size:cover;}
.content > header .actions .user-options .user .ic-user {margin-left:10px; width: 35px; height: 35px; display: inline-block; vertical-align: middle;}
.content > header .actions .user-options .user label {font-size: 0.7em; margin-left: 10px; line-height: 38px; display: inline-block; vertical-align: middle; pointer-events: none;}
.content > header .actions .user-options .submenu-list {width: 300px; opacity: 0; pointer-events: none; position: absolute; right: 0; top: 45px; background: #e6e6e6; padding: 20px; border-radius: 18px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);}
.content > header .actions .user-options .submenu-list.active {opacity: 1; pointer-events: all;}
.content > header .actions .user-options .submenu-list .submenu-item {background: #fff; margin-bottom: 5px; padding: 0 20px; border-radius: 40px; position: relative; overflow: hidden; display: block; cursor: pointer;}
.content > header .actions .user-options .submenu-list .submenu-item label {font-size: 0.7em; line-height: 30px; display: block;}
.content > header .actions .user-options .submenu-list .submenu-item label:hover{color:#00646B; transform:scale(1.03);}
.content > header .actions .user-options .submenu-list .submenu-item .submenu-icon {width: 22px; height: 22px; position: absolute; right: 4px; top: 4px; border-radius: 12px;}
.content > .centered {width: calc(100% - 60px); max-width: 1000px; margin: 30px auto;}

/*LOGIN*/
.login .background {width: calc(100% - 500px);}
.login .background:after {display: none;}
.login .panel {left: calc(100% - 250px);}
.login .panel .forget-password, .login .panel .step-password{ text-align:center; color:#606060;}
.login .panel .new-password{color:#00646B; border-bottom:1px solid #00646B; display:inline;}
.login .panel .new-password:hover{color:#00646B; border-bottom:1.5px solid #00646B; font-weight:bold; transform: scale(1.1); -webkit-transform: scale(1.1);-ms-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1);}


/*DETALLE USUARIO*/
.detalle-usuario .action-perfil {margin-bottom: 30px;}
.detalle-usuario .user-content {margin-top: 20px;}

/*POWER BY*/
.footer{height: 42px; position:fixed; bottom:0; left:0;z-index:3; background-color:#e6e6e6; width:270px; padding:20px 0px 15px 0px; margin:0;}
.footer.contact{padding-bottom: 58px;}
.footer.contact {padding-bottom: 58px;}
/*.create-by .power-by{width:30px; height:50px; }*/

/*ORGANIGRAMA*/
.organigrama .subordinados-organigrama .cargar-imagen{width:90px; height:90px; border:none;}
.organigrama .subordinados-organigrama:after{top: -171px; height:calc(100% + 105px);}
.organigrama .subordinados-organigrama:before{top: -171px;}

/*CONFIGURACION GENERAL*/
.general .general-info select{width:initial; margin:initial;}
.general .answer-description .description .input-description{width:50%;}

/*CONFIGURACION DE ENCUESTA*/
.configuracion-factor table thead tr .nombre-factor{margin-left:40px; width:calc(100% - 40px);}
.configuracion-factor table tbody tr .header-pregunta select{margin-left:0px; margin-top:0px; width:initial;}
.configuracion-factor table tbody tr .contenido-pregunta .header-pregunta {position:relative;}
.configuracion-factor table tbody tr .contenido-pregunta .header-pregunta select{position:absolute; top:0px; right:20px;}
.configuracion-factor table tbody tr .contenido-pregunta .header-pregunta div *{display:inline-block; vertical-align:middle;}
.configuracion-factor table tbody tr .header-pregunta .nombre-pregunta{margin-left:5px; width:74%;}
.configuracion-factor table tbody tr .contenido-pregunta .body-pregunta .puntaje{width:15%;}
.configuracion-factor table tbody tr .contenido-pregunta .body-pregunta .opcion{width:75%;}
.configuracion-factor table tbody tr .contenido-pregunta .footer-pregunta{margin-top:10px; margin-left:40px; position:relative;}
.configuracion-factor table tbody tr .contenido-pregunta .footer-pregunta .subir-evidencia{position:absolute; top:15px; right:70px;}
.configuracion-factor table tbody tr .contenido-pregunta .footer-pregunta textarea{width:77%;}
.configuracion-factor table tbody .delete-ask-factor a{position:absolute; top:25px; left:0px;}

/*PREGUNTAS DE LA ENCUESTA*/
.poll .poll-list {margin:80px auto 20px auto; width:70%;}
.poll .content-evidencia{width:70%; margin:0 auto;}

/*DASHBOARD*/
.dashboard .especific-results .company-name{width:107%; border-radius: 25px 0 0 0;}
.dashboard .especific-results .person-name{border-radius: 0 25px 0 0; text-align:right;}
.dashboard .especific-results .person-name label:last-child{margin-left:20px; margin-right:20px;}
#buscar input{width:calc(100% - 200px)!important;}
#buscadorTipo .search-input .suggest.active{margin-left:200px; width:calc(100% - 200px); margin-top:32px;}

/*MENSAJE*/
.mensaje{position: fixed; top: calc(50% + 40px); left: calc(50% + 135px); transform: translate(-50%, -50%);margin-top:0;}
.mensajeFP {background-image: url('../Images/Carpeta/mensajeFP.png'); background-repeat:no-repeat; background-size:contain; width:400px; height:200px; margin:0 auto;}

/*evidencia*/
.buscar-empresa{text-align:initial; position:relative;}
.buscar-empresa .content-busqueda .volver-evidencia{left:0;margin-top:30px;}
.buscar-empresa .dowload-evidence{position:absolute; top:10px; right:0;}
.buscar-empresa .dowload-evidence.button{padding-right:16px;}
.buscar-empresa .content-busqueda .buscarNombreEmpresa{width: 50%; margin-left:46px;}

    
section.evidencias .container-combo select{width:initial;}
section.evidencias .reportes .tipo-reporte > * {display:inline-block;}
section.evidencias .reportes .tipo-reporte .label{width:100px;}
section.evidencias .reportes .tipo-reporte .container-combo{width: calc(100% - 100px);text-align:left;position:relative;}
section.evidencias .reportes .tipo-reporte .container-combo select{width:initial;}
section.evidencias .reportes .container-combo > .buttons {width:initial;padding-left:40px;padding-right:20px;position:absolute;right:0;padding-right: 40px;}



section.evidencias .content-busqueda  .search-input{margin-top:-36px;margin-left: 100px;}
.buscar-empresa .content-busqueda .btn-descargar {margin-top: 10px;}
.buscar-empresa .content-busqueda h3 { margin-bottom: 20px;}
.buscar-empresa .content-busqueda .volver-evidencia{margin-top: 10px;}
