/************************************/ /************************************/ /** CSJN MAIN INTERIOR CSS **/ /** Copyright 2016 **/ /************************************/ /************************************/ * {-webkit-font-feature-settings: "lnum"; -moz-font-feature-settings: "lnum"; -ms-font-feature-settings: "lnum"; -o-font-feature-settings: "lnum"; font-feature-settings: "lnum"; } /*NAV BAR*/ section.display {margin-top: 35px;} /* estadisticas */ section.display .top-bar h1 { font-size: 29px;margin-bottom: 30px;} section.display .top-bar h1 .arrow { color: #DCDCDC;margin-right: 9px;} section.display .top-bar .path {height: auto;border-bottom: 1px solid #BFBFBF;margin-bottom: 68px;padding-bottom: 16px;} section.display .top-bar .path .inicio {font-size: 13px;font-weight: 500;display: inline-table;margin-right: 16px;height: 27px;line-height: 18px;} section.display .top-bar .flecha {margin: 0px 16px 0px 0px;font-size: 25px;display: inline-table;height: 27px;font-weight: 300;} section.display .top-bar .flecha.less-spacing {margin-right: 8px!important;} section.display .top-bar .section-icon {margin-top: -17px;display: inline;position: relative;margin-right: 8px;line-height: 18px;overflow: hidden;height: 44px;width: 57px;} section.display .top-bar .section-icon img {height: 40px;position: relative;top: 13px!important;} section.display .top-bar .section-home { font-size: 13px; font-weight: 500; display: inline-table; height: 27px; line-height: 18px; position: relative;} section.display .top-bar .section-tree-home { font-size: 13px; font-weight: 500;display: inline-table;margin-right: 16px;height: 27px;line-height: 18px;position: relative;display: none;text-transform: uppercase;} section.display .top-bar .section-tree-sub-section { font-size: 13px; font-weight: 500;display: inline-table;height: 27px;line-height: 18px;display: none;text-transform: uppercase;margin-right: 16px;} section.display .top-bar span.text { position: relative; top: -2px;} section.display .top-bar span#section-tree-home-name br {display:none} section.display .buscador_estadisticas {background: rgb(245, 245, 245);clear: both;border-radius: 5px;box-shadow: 0px 4px 10px -6px #9c9c9c;margin-bottom: 47px;} select{font-family:"Encode Sans"} .chart {width: 100%;margin-bottom: 20px;background: rgba(243, 243, 243, 0);height: auto;border-radius: 9px;} .period.no-margin-right.total select { width: 100%!important;} .period.no-margin-right.total .campo {width: 100%!important;margin-bottom: 22px;} .group.part-3.clearfix.total { border-top: 0px!important;} .helper { font-size: 11px; font-weight: 500;} .rotation-need {display:none} /* DESKTOP */ @media only screen and (min-width: 980px) { /* CONTENIDO */ .section-content { margin-bottom: 50px;} /* estadisticas */ .section-content .estadisticas {width: 100%;position: relative;} .section-content .estadisticas .title { text-align: center;} .section-content .estadisticas .title h1 {font-size: 45px; margin-bottom: 8px;} .section-content .estadisticas .subtitle { text-align: center;} .section-content .estadisticas .subtitle h2 {font-size: 27px; color: #009FD5;} .section-content .estadisticas .img-full {width: 800px;margin: 0 auto;margin-top: 40px;} .section-content .estadisticas .img-full img {width: 800px; height: auto;text-align: center;margin: 0 auto;} .section-content .estadisticas p {text-align: justify; font-size: 15px;width: 800px;margin: 23px auto;} .section-content .estadisticas h3 {font-weight: bold; margin: 33px 0px;} .section-content .estadisticas p.footer-grey { font-size: 13px!important; text-align: right!important;color: #A7A7A7!important;} .section-content .estadisticas .titulo {font-size: 15px;margin-bottom: 17px;font-weight: 500;} .section-content .estadisticas .group {background: rgb(245, 245, 245);float: left;margin-right: 41px;margin: 28px;border-radius: 2px;width: auto;} .section-content .estadisticas .group .period {float: left;margin-right: 42px;} .section-content .estadisticas .group .period:last-child{margin-right: 0px;margin-bottom: 0px;} .section-content .estadisticas .group .period.no-margin-right{margin-right: 0px;} .section-content .estadisticas .group .period .text{float:left;margin-right: 18px;margin-top: 11px;font-size: 13px;} .section-content .estadisticas .group .period .campo { float: left;} .section-content .estadisticas .period .campo input, .section-content .estadisticas .period .campo select {border: 1px solid #eee;background: rgb(255, 255, 255);width: 163px;height: 21px;padding: 8px;float: left;font-size: 13px;color: rgb(101, 101, 101);} .section-content .estadisticas .group .period .text.radio{ margin-top: 3px; margin-left: 12px;} .section-content .estadisticas .period .campo select{height: 39px;width: 287px;} .section-content .estadisticas .period .campo input[type="radio"]{background: rgb(214, 214, 214);border: none;padding: 0px;width: 16px;height: 16px;margin-left: 0px;border-radius: 100%;} .section-content .estadisticas .group.part-2 {margin-right: 0px;float: right;width: auto;border-right: 0px;border-left: 1px solid rgb(226, 226, 226);padding-left: 28px;padding-right: 28px;} .section-content .estadisticas .group.part-3 {margin-top:0px;width: calc(100% - 56px);padding-top: 28px;border-top: 1px solid rgb(226, 226, 226);} .section-content .estadisticas .group.part-3 .period{ width: 100%;} .section-content .estadisticas .group.part-3 .period .campo{margin-right: 40px;height: 18px;margin-top: 6px;} .section-content .estadisticas .period .campo .container {display: block;position: relative;padding-left: 29px;margin-bottom: 0px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;font-size: 13px;padding-top: 1px;} .section-content .estadisticas .period .campo input[type="radio"] {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .section-content .estadisticas .period .campo .checkmark {position: absolute;top: 0;left: 0;height: 18px;width: 18px;background-color: rgb(228, 228, 228);border-radius: 50%;} .section-content .estadisticas .period .campo:container input[type="radio"] ~ .checkmark { background-color: #ccc; } .section-content .estadisticas .period .campo input[type="radio"]:checked ~ .checkmark {background-color: rgb(0, 165, 222);} .section-content .estadisticas .period .campo .checkmark:after { content: ""; position: absolute; display: none; } .section-content .estadisticas .period .campo input[type="radio"]:checked ~ .checkmark:after { display: block; } .section-content .estadisticas .period .campo .checkmark:after {top: 6px;left: 6px;width: 6px;height: 6px;border-radius: 50%;background: white;} } /* TABLET AND MOBILE */ @media only screen and (max-width: 979px) { section.display .top-bar .path {margin-bottom: 39px;padding-bottom: 16px;} /* estadisticas */ .section-content .estadisticas {width: 100%;position: relative;height: auto;clear: both;} .section-content .estadisticas .title { text-align: center;} .section-content .estadisticas .title h1 {font-size: 45px; margin-bottom: 8px;} .section-content .estadisticas .subtitle { text-align: center;} .section-content .estadisticas .subtitle h2 {font-size: 27px; color: #009FD5;} .section-content .estadisticas .img-full { width: 100%;margin: 40px 0px 0px 0px;} .section-content .estadisticas .img-full img { width: 100%; height: auto;} .section-content .estadisticas p {text-align: justify; margin: 23px 0px; font-size: 15px;} .section-content .estadisticas h3 {font-weight: bold; margin: 33px 0px;} .section-content .estadisticas p.footer-grey { font-size: 13px!important; text-align: right!important;color: #A7A7A7!important;} .section-content .estadisticas .titulo {font-size: 15px;margin-bottom: 17px;font-weight: 500;} .section-content .estadisticas .group {float: left;margin: 22px;border-radius: 2px;width: calc(100% - 353px);margin-right: 22px;border-right: 1px solid rgb(226, 226, 226);padding-right: 22px;} .section-content .estadisticas .group .period {float: left;margin-right: 0px;height: 39px;margin-bottom: 22px;width: 100%;} .section-content .estadisticas .group .period:last-child{margin-right:0px;margin-bottom: 0px;} .section-content .estadisticas .group .period.no-margin-right{margin-right: 0px;height: auto;margin-bottom: 0px;} .section-content .estadisticas .group .period .text{float:left;margin-right: 18px;margin-top: 11px;font-size: 13px;width: 40px;} .section-content .estadisticas .group .period .campo {float: left;width: calc(100% - 60px);} .section-content .estadisticas .period .campo input, .section-content .estadisticas .period .campo select {border: 1px solid #eee;background: rgb(255, 255, 255);width: calc(100% - 17px);height: 21px;padding: 8px;float: left;font-size: 13px;color: rgb(101, 101, 101);} .section-content .estadisticas .group .period .text.radio{ margin-top: 3px; margin-left: 12px;} .section-content .estadisticas .period .campo select{height: 39px;width: 232px;} .section-content .estadisticas .period .campo input[type="radio"]{background: rgb(214, 214, 214);border: none;padding: 0px;width: 16px;height: 16px;margin-left: 0px;border-radius: 100%;} .section-content .estadisticas .group.part-2 {margin-right: 0px;float: right;width: 262px;border-right: 0px;padding-right: 0px;} .section-content .estadisticas .group.part-3 {margin-top:0px;width: calc(100% - 44px);border-top: 1px solid rgb(226, 226, 226);padding-top: 28px;border-right: 0px;border-bottom: 0px;padding-bottom: 0px;height: auto;padding-right: 0px;} .section-content .estadisticas .group.part-3 .period{width: 100%;height: auto;} .section-content .estadisticas .group.part-3 .period .campo{margin-right: 40px;height: 18px;margin-top: 6px;width: auto;} .section-content .estadisticas .period .campo .container {display: block;position: relative;padding-left: 29px;margin-bottom: 0px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;font-size: 13px;padding-top: 1px;} .section-content .estadisticas .period .campo input[type="radio"] {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .section-content .estadisticas .period .campo .checkmark {position: absolute;top: 0;left: 0;height: 18px;width: 18px;background-color: rgb(228, 228, 228);border-radius: 50%;} .section-content .estadisticas .period .campo:container input[type="radio"] ~ .checkmark { background-color: #ccc; } .section-content .estadisticas .period .campo input[type="radio"]:checked ~ .checkmark {background-color: rgb(0, 165, 222);} .section-content .estadisticas .period .campo .checkmark:after { content: ""; position: absolute; display: none; } .section-content .estadisticas .period .campo input[type="radio"]:checked ~ .checkmark:after { display: block; } .section-content .estadisticas .period .campo .checkmark:after {top: 6px;left: 6px;width: 6px;height: 6px;border-radius: 50%;background: white;} } /* MOBILE */ @media only screen and (max-width: 600px) { .rotation-need {position: fixed;top: 0px;left: 0px;width: 100%;height: 100%;z-index: 10000000000000000000000000000000000000000000000000000000000;background: rgb(0, 165, 222);color: #fff;text-align: center;display: block;} .rotation-need .text {position: absolute;width: 100%;text-align: center;top: 50%;font-size: 23px;margin-top: -44px;} .rotation-need .text span{ display: block;} .rotation-need .text span svg{width: 36px;position: relative;top: 5px;margin-bottom: 19px;filter: invert(100);} /* CONTENIDO */ .section-content { margin-bottom: 50px;} .section-content .estadisticas .title { text-align: center;} .section-content .estadisticas .title h1 {font-size: 35px; margin-bottom: 8px;} .section-content .estadisticas .subtitle { text-align: center;} .section-content .estadisticas .subtitle h2 {font-size: 22px; color: #009FD5;} .section-content .estadisticas h3 {font-weight: bold; margin: 33px 0px;} .section-content .estadisticas .titulo {font-size: 15px;margin-bottom: 17px;font-weight: 500;} .section-content .estadisticas .group {background: rgb(245, 245, 245);float: none;padding: 0px;border-radius: 2px;width: auto;clear: both;border-bottom: 1px solid rgb(226, 226, 226);border-right: 0px;padding-bottom: 22px;} .section-content .estadisticas .group .period {float: left;margin-right: 22px;width: calc(50% - 14px);position: relative;height: auto;margin-bottom: 0px;} .section-content .estadisticas .group .period:last-child{margin-right:0px;width: calc(50% - 8px);margin-bottom: 0px;} .section-content .estadisticas .group .period.no-margin-right{margin-right: 0px;width: 100%;} .section-content .estadisticas .group .period .text{float:left;margin-right: 18px;margin-top: 5px;font-size: 13px;margin-bottom: 10px;} .section-content .estadisticas .group .period .campo {float: left;width: 100%;} .section-content .estadisticas .period .campo input, .section-content .estadisticas .period .campo select {border: 1px solid #eee;background: rgb(255, 255, 255);width: calc(100% - 20px);height: 21px;padding: 8px;float: left;font-size: 13px;color: rgb(101, 101, 101);} .section-content .estadisticas .period .campo select{height: 39px;width: calc(100% - 20px);margin-top: 5px;} .section-content .estadisticas .group .period .text.radio{ margin-top: 3px; margin-left: 12px;} .section-content .estadisticas .period .campo input[type="radio"]{background: rgb(214, 214, 214);border: none;padding: 0px;width: 16px;height: 16px;margin-left: 0px;border-radius: 100%;} .section-content .estadisticas .group.part-2 {float: none;width: auto;border: 0px;padding-bottom: 0px;} .section-content .estadisticas .group.part-3 {margin-top:0px;width: auto;border-top: 1px solid rgb(226, 226, 226);padding-top: 28px;border-bottom: 0px;padding-bottom: 0px;margin-right: 18px;} .section-content .estadisticas .group.part-3 .period{ width: 100%;} .section-content .estadisticas .group.part-3 .period .campo{margin-right: 40px;height: 18px;margin-top: 6px;} .section-content .estadisticas .period .campo .container {display: block;position: relative;padding-left: 29px;margin-bottom: 0px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;font-size: 13px;padding-top: 1px;} .section-content .estadisticas .period .campo input[type="radio"] {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .section-content .estadisticas .period .campo .checkmark {position: absolute;top: 0;left: 0;height: 18px;width: 18px;background-color: rgb(228, 228, 228);border-radius: 50%;} .section-content .estadisticas .period .campo:container input[type="radio"] ~ .checkmark { background-color: #ccc; } .section-content .estadisticas .period .campo input[type="radio"]:checked ~ .checkmark {background-color: rgb(0, 165, 222);} .section-content .estadisticas .period .campo .checkmark:after { content: ""; position: absolute; display: none; } .section-content .estadisticas .period .campo input[type="radio"]:checked ~ .checkmark:after { display: block; } .section-content .estadisticas .period .campo .checkmark:after {top: 6px;left: 6px;width: 6px;height: 6px;border-radius: 50%;background: white;} } /* TABLET AND MOBILE */ @media only screen and (max-width: 500px) { /* CONTENIDO */ .section-content { margin-bottom: 50px;} .section-content .estadisticas .titulo {font-size: 15px;margin-bottom: 17px;font-weight: 500;} .section-content .estadisticas .group {background: rgb(245, 245, 245);float: none;padding: 0px;border-radius: 2px;width: auto;margin-bottom: 0px;border-bottom: 1px solid rgb(226, 226, 226);padding-bottom: 22px;} .section-content .estadisticas .group .period {float: left;margin-right: 0px;margin-bottom: 10px;height: auto;clear: both;width: 100%!important;} .section-content .estadisticas .group .period.no-margin-right{margin-right: 0px;} .section-content .estadisticas .group .period .text{float: left;margin-right: 0px;margin-top: 11px;font-size: 13px;margin-bottom: 9px;width: 100%;} .section-content .estadisticas .group .period .campo {float: left;width: 100%;} .section-content .estadisticas .period .campo input, .section-content .estadisticas .period .campo select {border: 1px solid #eee;background: rgb(255, 255, 255);width: calc(100% - 19px);height: 21px;padding: 8px;float: left;font-size: 13px;color: rgb(101, 101, 101);} .section-content .estadisticas .period .campo select{height: 39px;width: calc(100% - 19px);} .section-content .estadisticas .group.part-2 {margin-right: 0px;float: none;width: auto;margin-bottom: 22px;} .section-content .estadisticas .group.part-3 {margin-top:0px;width: calc(100% - 41px);border-top: 1px solid rgb(226, 226, 226);padding-top: 28px;margin-bottom: 28px;} .section-content .estadisticas .group.part-3 .period{ width: 100%;} .section-content .estadisticas .group.part-3 .period .campo{margin-right: 40px;height: 18px;margin-top: 6px;} .section-content .estadisticas .period .campo .container {display: block;position: relative;padding-left: 29px;margin-bottom: 0px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;font-size: 13px;padding-top: 1px;} .section-content .estadisticas .period .campo input[type="radio"] {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .section-content .estadisticas .period .campo .checkmark {position: absolute;top: 0;left: 0;height: 18px;width: 18px;background-color: rgb(228, 228, 228);border-radius: 50%;} .section-content .estadisticas .period .campo:container input[type="radio"] ~ .checkmark { background-color: #ccc; } .section-content .estadisticas .period .campo input[type="radio"]:checked ~ .checkmark {background-color: rgb(0, 165, 222);} .section-content .estadisticas .period .campo .checkmark:after { content: ""; position: absolute; display: none; } .section-content .estadisticas .period .campo input[type="radio"]:checked ~ .checkmark:after { display: block; } .section-content .estadisticas .period .campo .checkmark:after {top: 6px;left: 6px;width: 6px;height: 6px;border-radius: 50%;background: white;} }