/*** Display Opcion***/
/*** Display Opcion***/


.legend span {
    width: 10%;
    display: inline-block;
    text-align: center;
    cursor: pointer;
    color: white;
}

.test_width{
  width: 1600px;
}
#loginBackgroundLogo,#loginLogo{
  position: absolute;
}

.letter_gantt{
  position: relative; 
  background-color:rgba(255,255,255,0.9);
}

.button-required{
  position: absolute;
  padding-right: 27%;
  padding-top: 10%;
}
.container_scroll{
  height: auto;  
  width: 100%;
  overflow: hidden;
  padding-bottom: 15px;
}

.ui-sortable-helper{
  background-color: #f3f3f3 ;
  border-style: solid;
  border-width: 1px;
  border-color: #b5b5b5 ;
  display: inline-block;
}
.ui-sortable-placeholder{
  visibility: visible !important;
  background-color: #5ac747a1 !important;
  border: 2px dashed #5ac747 !important; 
  width: 100%;
  margin-top: 10px;
  display: inline-block;
}

.ui-state-highlight { 
  height: 1.5em; 
  line-height: 1.2em; 
}

#sortable { 
  list-style-type: none; 
  margin-left: 0%; 
  padding-left: 3%; 
  width: 80%; 
}

#sortable li { 
  position: static;
  height: 8.5em;
}

html>body #sortable li {
  line-height: 1.2em; 
}

.backgroundRfi{
  top: 2%;
  padding-top: 1%;
  padding-bottom: 2%;
  margin-left: 16%;
  background-color: #f3f3f3;
  border-radius: 7px;
  min-height: 400px;
  clear:both;
  display: inline-block;
  width: 49%;
  left: 0%;
  box-shadow: 0px 0px 13px 0px rgb(204, 204, 204);
}

.preview-design{
  width: 25%;
  min-height: 400px;
  margin-left: 67%;
  margin-top: -33%;
  position: fixed;
}

.iconRFI{
  opacity: 1 !important;
  font: 100 13px "Maven Pro", Arial, Helvetica, sans-serif !important;
  width: 48%;
  display: block;
  margin: 0 auto 3px;
  text-align: left;
  background: #e6e6e6;
  cursor: move !important;
  border-radius: 4px;
}

.modOptions{
  background-color: transparent;
  top: 35%;
  left: -3%;
  border-radius: 4px;
  position: fixed;
  user-select: none; 
}

.boxOptions{
  width: 27%;
}

.containerRfi{
  display: inline-block;
  margin-top: 2%;
  padding-bottom: 3%;
  width: 122%;
  height: auto !important;
  box-shadow: rgb(142, 142, 142) 0px 0px 14px 0px;
}

#boxRfi{
  margin-bottom: 0;
  padding-top: 2%;  
  padding-bottom: 3%;
  padding-right: 5%;
  top: 2%;
  left: 12%;
}  

#iconDeleteTitulo{
  left: 90%;
  bottom: 19%;
  position: absolute;
}

#iconDelete{
  left: 90%;
  bottom: 39%;
  position: absolute;
}
.element_titulo{
  margin-left: 18%;
  margin-top: 14%;
}

.element_text{
  margin-left: 18%;
  margin-top: 14%;
}

.radiovalue{
  float: right;
  left: 8px;
  text-align: center;
}

.radiovaluetext{
  left: 99%;
  padding: 0%;
  top: 10px;
  width: 15%;
}

#cloneRadio{
 margin-top: 0%;
 left: -16%;
}

.onlyradio{
  top: 7px;
  /*left: 47px;*/
}

.optionsRadio{
  margin-left: 25%;
  width: 44%;
  font-size:14px !important;
}

#optionsRadioPreview{
  margin-left: 25%;
  width: 44%;
  font-size:14px !important;
}


.positionRadio{
  height: 33px;
  margin-left: 20%;
}

.element_radio{
  margin-left: 18%;
  margin-top: 14%;
}

.conect_ra{
  padding-top: 1%;
}

#iconAddRadio{
  left: 61%;
  bottom: 14%;
  padding-left: 0%;
  padding-right: 0%;
  width: 25px;
  position: absolute;
}

#iconAddRadio_delete{
  left: 69%;
  bottom: 14%;
  padding-left: 0%;
  padding-right: 0%;
  width: 25px;
  position: absolute;
}


#iconDeleteText{
  margin-top: -7%;
  margin-left: 101%;
  padding: 0;
}

#iconDeleteOptionRadio{
  padding-left: 0%;
  padding-right: 0%;
  margin-top: 32px;
  left: 60%;
  width: 7%;
  position: absolute;
}

.optionsCheckbox{
  margin-left: 25%;
  width: 44%;
  font-size:14px;
}

.conect_checkbox{
  padding-top: 1%;
}

.onlycheckbox{
  left: 8%;
}

#iconAddCheckbox{
  left: 71%;
  bottom: 14%;
  padding-left: 0%;
  padding-right: 0%;
  width: 4%;
  position: absolute;
}

.positionCheckbox{
  left: 54%;
}

#iconDeleteCheckbox{
  padding-left: 0%;
  padding-right: 0%;
  margin-top: 36px;
  left: 60%;
  width: 7%;
  position: absolute;
}

#cloneCheckbox{
 margin-top: 0%;
 left: -15%;
}

.element_checkbox{
  margin-left: 18%;
  margin-top: 14%;
}

.checkboxvalue{
  float: right;
  left: 8px;
  text-align: center;

}

.checkboxvaluetext{
  left: 100%;
  padding: 0%;
  top: 10px;
  width: 15%;
}

#iconAddSelect{
  left: 71%;
  bottom: 14%;
  padding-left: 0%;
  padding-right: 0%;
  width: 4%;
  position: absolute;
}

#optionsSelect{
  margin-left: -13px;
  width: 57%;
}

#cloneSelect{
 margin-top: -2%;
 left: -14%;
}

.optionsSelect{
  margin-left: 60px;
  width: 54%;
  font-size: 14px;
}

.element_select{
  margin-left: 18%;
  margin-top: 14%;
}


#iconDeleteOptionSelect{
  padding-left: 0%;
  padding-right: 0%;
  margin-top: 36px;
  left: 65%;
  width: 7%;
  position: absolute;
}

.selectvalue{
  float: right;
  left: 8px;
  text-align: center;

}

.selectvaluetext{
  left: 96%;
  top: 10px;
  width: 23%;
}

.conect_table{
  top: 90%;
  flex-wrap: wrap;
  display: inline-flex;
}

/*.optionsTable{
  margin-top: 9px;
  width: 40%;
}*/

#cloneTable{
  margin-top: -4%;
  margin-left: -2%;
  width: 130%;
}

#iconAddTableHead{
  left: 67%;
  top: 33%;
  padding-left: 0%;
  padding-right: 0%;
  width: 4%;
  position: absolute;  
}

#iconDeleteTableHead{
  padding-left: 0%;
  padding-right: 0%;
  top: 69%;
  left: 86%;
  width: 7%;
  position: absolute;    
}

.tablerfiPreview{
  margin-top: 5%;
  margin-left: -15%;
  max-width: 180% !important;
  width: 154% !important;
}

.inputTable{
  text-align: center !important;
  font-size: 14px !important;
  width: 82%;
  margin-left: 13%;
  background: #fff!important;
}

#button-Table{
  background-color: #515151;
  color: white;
}

.element_table{
  margin-left: 2%;
  margin-top: 14%;
  width: 443px;
}

.textareatable{
  float: right;
  margin-top: 5%;
  margin-bottom: 6%;
  width: 148%;
  margin-right: -32%;
}

.textTabletotal{
  float: left;
  right: 63px;
  top: 30px;
}

.inputTableTotal{
  float: left;
  top: 18px;
  right: 86px;
}

.tablevalue{
  float: right;
  right: 50px;
  bottom: 17px;
  text-align: center;
  width: 27%;
}

.tablevaluetext{
  left: 85%;
  padding: 0%;
  bottom: 8px;
  width: 13%;
}

.textTotal{
  text-align: center;
  margin-top: 5%;
}

.textTotalbox{
  display: none;
  text-align: center;
}

.labelTable{
  padding-right: 1%;
  margin-top: 10%;
  width: 70%;
}

.element_button{
  margin-left: 17%;
  margin-top: 4%;
}

#iconDeleteDate{
  margin-top: -19%;
  margin-left: 102%;
  padding: 0;
}

.element_date{
  margin-left: 18%;
  margin-top: 14%;
}

#iconDeleteTextArea{
  margin-top: -50%;
  margin-left: 101%;
  padding: 0;
}

.element_area{
  margin-left: 17%;
  margin-top: 14%;
  margin-right: -33%;
}

.textareavalue{
  float: right;
  left: 15px;
  top: 6px;
  text-align: center;
}

.textareavaluetext{
  left: 338px;
  top: 17px;
}

#iconDeleteFile{
  margin-top: -10%;
  margin-left: 101%;
  padding: 0;
}

.filevalue{
  float: right;
  left: 15px;
  top: 6px;
}

.filevaluetext{
  left: 282px;
  top: 10px;
}

.element_file{
  margin-left: 17%;
  margin-top: 14%;
  margin-right: -33%;
}


#btnSaveRFI{
  background-color: #515151;
  color: white;
  position: fixed;
  left: 6%;
  margin-top: 7%;
  padding-left: 25px;
  padding-right: 27px;
}

#labelPorcentaje{
  margin-top:6%; 
  left:19%;
}

#inputPorcentaje{
  position: fixed;
  right: 86%;
  margin-top: 3%; 
}

#inputporcentajeGeneral{
  background-color: white;
  text-align: center;
}
 
#txt1{
  float: right;
  padding-right: 10%;
  padding-bottom: 3%;
  background: #fff;
  border-radius: 4px;
  width: 35%;
}

/*Editar RFI*/
#iconAddRadioEdit{
  left: 72%;
  padding-left: 0%;
  padding-right: 0%;
  width: 4%;
  margin-top: -29px;
}

#iconDeleteOptionRadioEdit {
  padding-left: 0%;
  padding-right: 0%;
  margin-top: -28px;
  left: 79%;
  width: 7%;
  position: absolute;
}

.radiovalueEdit {
  float: right;
  left: 90px;
  text-align: center;
}

.radiovaluetextEdit {
  left: 123%;
  padding: 0%;
  top: 10px;
  width: 15%;
}

/*Filtro RFI*/
#name_rfiFiltter{
  padding-bottom: 20px !important;
}

/**RFI EXTERNAL**/
.tituloRfiExternall{
  right: 13%;
  padding-bottom: 2%;
  margin-top: -1%;
}

.textRfiExternall{
  text-align: justify;
  width: 70%;
}

.textRfiExternallRequiered{
  text-align: left;
}
/*.boxRadioExternall{
  float: none !important;
}*/

.childRadioExternall{
  /*margin-left: 42%;*/
  margin-left: 8%;
  float: left;    
}
.childRadioLabelExternall{
  /*width: 50%;
  margin-top:-7%;
  margin-left:54%;*/
  margin-top: 3px;
  margin-left: 10%;
  
}

.checkboxRfiExternall{
  margin-top: 2%;
  margin-bottom: 2%;
  left: 5%;
}

.childCheckboxExternall{
  margin-left:40%; 
}

.childCheckboxLabelExternall{
  margin-top: -6%;
  margin-left: 60%;
}

.childCheckboxLabelExternall > label{
  width: 100%;
}

.selectRfiExternall{
  margin-top: 2%;
  left: 5%;
}

.selectOpRfiExternall{
  margin-top: 10px;
  margin-bottom: 8px; 
  left: 8%; 
  height: 15%;
}

.tableRfiExternall{
  margin-top: 2%;
  left: 5%;
}

.tableRfiEncabezadoExternall{
  text-align:center; 
  font-weight: bold; 
  height: 3em;
}

.tableRfiInputExternall{
  margin-left: 3%;
  margin-bottom: 3%;
}

.tableRfiInputExternallTotal{
  margin-left: 3%;
  margin-bottom: 3%;
  background: #fff !important;
}

.dateRfiExternall{
  margin-top: 2%;
  left: 5%;
}

.AreaNRfiExternall{
  margin-top: 2%;
  left: 5%;
}

.areaRfiExternall > label{
  width: 100%;
  text-align: left;
}

.areaRfiExternall{
  width: 35%;
  margin-top: 2%;
  left: 5%;
}
.conteiner_gantt{
  width: calc(100% + 17px);
  max-height: 300px;
  overflow-y: scroll;
  padding-right: 17px;
  box-sizing: content-box;
} 
#btnSaveExternall{
  background-color: #515151;
  color: white;
  margin-top: 2%;
  padding-left: 25px;
  padding-right: 27px;
}

/*** Display Opcion***/
.exitlogut{
  margin-top: 0.4%; 
}

.info_input_error{
  text-align: justify;
  font-size: 20px;
  font-family: 'Lato', sans-serif;
  padding-left: 10px !important;
}

.closeimg{
  background-color: gray;
  padding: 10px 13px;
  border-radius: 2px;
  color: white;
  opacity: 0.7;
  display: inline-block;
  font-size: 15px;
  width: 90px;
  height: 40px;
  font-family: 'Lato', sans-serif;
}

.titleShowStatus{
  padding-top: 11px;
  padding-left: 24px;
  padding-bottom: 60px;
  margin-bottom: 20px;
  border-radius: 11px; 
  font-size:36px; 
  text-align: center;
  height: 10%;
  background-color: #000;  
  min-height: 31px;
  font-family: 'Roboto Condensed', sans-serif;
}

#footerbutton{
  margin-top: 20px;
}

#icontype{
  font-family: 'Roboto Condensed', sans-serif;
  margin-right: 12px;
  padding-right: 8px;
  font-size: 30px;
  color: white;
  cursor: default;
  opacity: 3;
}

#chevron{
  top: 45%;
  font-size: 29px;
}

#SusseSubMenu{
  color: white;
  font-weight: bold;
}

#QuestSubMenu{
  color: white;
  font-weight: bold;
}

#AlertSubMenu{
  color: white;
  font-weight: bold;
}

.footStatusBar{
    background-color: white;
    color: white;
    text-align: center;
    padding-bottom: 20px;   
}

.spanBold10{
  font-weight: bold; 
  font-size: 10pt;
}

.c3-tooltip-container{
  display:block;
}

.internalContainer .headerSection .topNavigationExt {
    font: 400 15px "Maven Pro", Arial, Helvetica, sans-serif;
    height: 80px;
    line-height: 48px;
    background-color: rgba(220, 220, 220, 0.9);
    /* padding-left: 40px; */
    border-bottom: 1px solid #CCC;
    z-index: -1;
}

div#theContent{
  height: calc(100% - 82px);
  overflow-y: auto;
  border-bottom: 1px solid rgba(208, 208, 208, 0.2);
  /* margin-top: 1.2%; */
  margin-top: 20px;      
}

div#topBox{
  padding: 0px !important;
}

div#top_box_new{
  color:#fff;
  font-size:8.5pt; 
  background: url('/../../../styles/default/images/system/blBox/redBG.jpg') 50% 100% repeat-x rgb(204, 0, 0);
  margin: 1%; 
  width: 98%
}

div.counter{
  text-align: center;
  font-size: 25px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.4);
  opacity: .5;
  letter-spacing: -2px;
}

tr.footerstatus{
  background-color: rgba(0, 0, 0, 0.05);
  line-height: 40px;
  padding: 0 20px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  font-weight: 700;
}

.chart_body{
  height: 300px;
  width: 25%;
  margin-top: -25px;
  line-height: 25px;
  text-align: center;
  background-color: white;
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  margin: -25px auto 0;
  position: fixed;
  z-index: 0;
  bottom: 10%;
  right: 3%;
  border-style: outset;
  border-color: black;
}

.chatSection{
  height: 25px;
  width: 25%;
  margin-top: -25px;
  line-height: 25px;
  text-align: center;
  background-color: rgba(208, 208, 208, 0.9);
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  margin: -25px auto 0;
  position: fixed;
  z-index: 0;
  bottom: 5%;
  right: 3%;
}

.show{
	font: 100 14px "Maven Pro", Arial, Helvetica, sans-serif !important;
}

/*div#posinfo{
	color:white;
}*/

.RND_table{
  height: 300px;
  background-color: rgba(0,0,0,0.60);
  color: rgb(255,255,255);
  text-align: center;
  font-size:large;
}

.buttonFormat{
  float: left;
  padding-right: 5px;
}

.criteria_ofert{
  padding-top: 10px;
  text-align: center;
  font-weight: bold;
}

.icon_size_2{
  font-size: 1.8em;
}

.typcn{
  font: 100 12px "Maven Pro", Arial, Helvetica, sans-serif;
  cursor: pointer;
  opacity: .4;
}

.menuTypcn{
  font: 100 15px "Maven Pro", Arial, Helvetica, sans-serif;
  cursor: pointer;
  opacity: 100;
}

.icon_reverse{
  font: 400 30px "Maven Pro", Arial, Helvetica, sans-serif;
  opacity: 100;
}

/*****************/
.counterChecked{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  font-weight: bold;
  float: right;
  width: 15px;
  height: 15px;
  border: 4px solid #4d4b4b;
  border-width: 1px;
  border-radius: 12.5px;
  cursor: pointer;
  margin: -8px;
}
.dropdownList{
  display: none;
  margin-top: -10px;
  background: white;
  padding: 5px; 
  display: none; 
  top: 0%; 
  left: 99.8%; 
  z-index: 1000; 
  position: absolute; 
  min-width: 330px !important; 
  max-height: 400px !important; 
  border:0px solid gray;
  border-radius: 4px; 
  box-shadow: rgb(48, 47, 47) 0px 5px 8px;
}
.dropdownList_scroll{
  overflow-x: hidden;
  padding: 5px;
  border: 1px solid lightgray;
  border-radius: 4px;
  max-height: 315px !important;
  display: block;
}


/*****************/


/***************MENSAJE DE SESSION POR EXPIRAR*********************************/
#ventanaForm{
    position: fixed;
    /*bottom: 85.7%;*/    
    right: 8%;  
    /*padding: 3px;*/
    padding-bottom: 4px;
    padding-top: 4px;
    z-index: 901;
    width: 310px;
    height: auto;
    background-color: #292929;
    /*#f1f1f1 5DAFD9;*/
    border: solid 1px;
    border-color: #c3c3c3;
    /*border: double;
    border-color  : #AAA;*/
    display: none;
    visibility: hidden;
    opacity: 0.97;
    border-radius: 6px;
    /*11px*/
    color: #FFF;
    /*; 777*/
    font-family: tahoma;
    font-size: 100%;
    text-transform: uppercase;
}

#relojForm{
  color: #ffffff;
  /*0e185a;*/
  font-family: tahoma;
  text-align: center;
  font-size: 180%;
  /*110%;*/
  text-shadow: 1px 1px 0px #ccc;
  font-weight: bold;
  text-shadow: 1px 1px 0px #ccc;
  padding: 1%;
}

#countdownTimerSession{
  color: #ffffff;
  font-family: tahoma;
  text-align: center;
  font-size: 110%;
  padding: 1%;
  margin-top: 2%;
}

.color-full {
  background: #53bb74;
}

.color-half {
  background: #ebc85d;
}

.color-empty {
  background: #e5554e;
}

.btn_sessionAct {
  border-radius: 5px;
  padding: 5px 10px;
  font-size: 100%;
  margin: 3%;
  color: #fff;
  position: relative;
  background: #9c9a9a;
  /*border-color: #b1afab;*/
}
/***************MENSAJE DE SESSION POR EXPIRAR*********************************/

.taxesGlobalIncludeLow{
  color: #09542A;
  font-size:11px;
  /*font-weight: bold;*/
}
 
.taxesGlobalInclude{
  color: #B96F32;
  font-size:11px;
  /*font-weight: bold;*/
}

#sbmitsend{
    display: inline-block;
}

#statusBarContainer{
  /*background-color: #AAA;*/
  position: fixed;
  padding: 10px;
  z-index: 901;
  color: white;
  opacity: 1 !important;
}

#statusBarContent{
  font-family: 'Lato', sans-serif;
  margin-top: 45px;
  color: #0b0a0a;
  font-size: 28px;
  text-align: center;
  height: 65%;
  overflow-x: hidden;
}

#statusBar{
  background-color: #fff;
  width: 100%;
  position: static;
  padding: 10px;
  height: 125%;
  border-radius: 11px;
}
#blackScreen{
  position: fixed;
  width:100%;
  height:100%;
  top:0;
  left:0;
  text-align: center;
  background-color: rgba(0,0,0,0.8);
  z-index: 900; 
}
#mBoxContainer{
  z-index: 901;
  position: fixed;
  width: 51%;
  height: 34%;
}

#mBoxVideoContainer{
  z-index: 901;
  position: fixed;
  top: 12%;
  left: 35%;
  width: 30%;
  height: 70%;
  background-color: white;
  /*overflow: scroll;*/
  border-radius: 5px;
}

.close_label{
  background-color: #2c2c2c;
  width: auto;
  color: white;
  float: right;
  opacity: 1 !important;
  /* padding-right: 10px; */
  margin-right: 5px;
}

#mBoxBorder{
  height: 100%;
  position: static;
}

#mBox{
  background-color: #fff;
  width: 100%;
  position: static;
  padding: 10px;
  height: 140%;
  border-radius: 11px;
}

#mBoxTitleText{
  color: #F5F5F5;
}

#mBoxContent{
  font-family: 'Lato', sans-serif;
  margin-top: 20px;
  padding-top: 4%;
  color: #0b0a0a;
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  height: 88%;
  overflow-x: hidden;
}
#mBTitle{
  padding-top: 6px;
  padding-left: 3px;
  padding-bottom: 6px;
  margin-bottom: 17px;
  border-radius: 11px;
  /*font-size: 37px;*/
  text-align: center;
  height: 25%;
  color: #F5F5F5;
  background-color: #000;
  min-height: 31px;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 4vw;

  word-wrap: break-word;
  white-space: -moz-pre-wrap;
  white-space: pre-wrap;
}
/**Custom **/

.frameCharts{
  width: 100%; 
  height:300px; 
  position: absolute;
  visibility: inherit;
}


.chartMainInfo{
  -khtml-border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background-color:#F0F0F0;/*#000000*/
  /*border:1px solid #CCC;*/
  color:#FFF;
  font-size:10pt;
  font-weight:normal; 
  font-style:Arial;
  min-height:70pt;
}

.chartMainInfo td{
  color:#ff9966;
}

.chartMainInfo div{
  color:#255772;/*#ff9966*/
}

.titlechart{
  background-color:#F0F0F0; 
  font-style:Arial;
  font-size:13pt;
  font-weight:normal; 
  border:1px solid #CCC; color:#B6B6B6;
  text-align:center;
}

.modal{
  top:30% !important;
}

.hopcpro{
  height: 40px !important;
}

.linedesc{
  display: none;
}

.sizehmax{
  width: 100% !important;
}

.lineact{
  display: block;
}

blockquote{
  margin: 0.5em 0px !important;
}

li#editRecTabli.tab{
  display: none;
}

li#auctionNewli.tab{
  display: none;
}

li.tab{
  display: none !important;
}

/**Custom module*/
/**Proyectos**/
.protittlea{
  font-size: 20px;
  cursor: default;
  color: rgba(0, 0, 0, 0.7);
  text-decoration: none;
}

.procointainerli{
  color: rgba(0, 0, 0, 0.4);
  padding: 5px 5px 5px 26px;
}

/**Proyectos**/
/*********************************************Tablets-Desktop-Large desktop*****************************/
@media(max-width: 1025px){
  .search_text_box{
    width: 74%;
  }
}

/*only tablet Horizontal*/
@media (min-width: 770px) and (max-width: 1026px){
  .conteiner_gantt{
    width: 100% !important;
  }

  .show{
    font: 100 18px "Maven Pro", Arial, Helvetica, sans-serif !important;
  }

  .radio_tablet{
    width: 15% !important;
  }

  .radio_button_rev{
    width: 25px !important;
    height: 2em !important;
  }

  .radio_button_rev_tax{
    width: 20px !important;
    height: 2em !important;
  }

  #searchBarForm{
      margin-right: -28%;
  }
}

/*tablet vertical*/
@media (min-height: 770px) and (max-height: 1026px) and (max-width: 770px) and (min-width: 400px) {

  .tittleTexheader{
    /*width: 40% !important;*/
  }
  
  .toolbarIcons{
        /*width: 40% !important;*/
  }

  .div_tab_header{
    height: 10% !important;
  }

  .show{
    font: 100 18px "Maven Pro", Arial, Helvetica, sans-serif !important;
  }
  
  .radio_tablet{
    width: 15% !important;
  }
  
  .radio_button_rev{
    width: 25px !important;
    height: 2em !important;
  }  
  
  .radio_button_rev_tax{
    width: 20px !important;
    height: 2em !important;
  }
}

@media(min-width: 770px){

  .monthPhoto{
    margin-top:-13%; 
    margin-left:30%; 
    text-align:left; 
    font-size:119%; 
    letter-spacing:0.02em; 
    text-transform:uppercase;
  }

  .contentTAbImg{
    height: 85%;
    top: 6%;
    left: 5%;
  }

  .chosen-container {
    min-width: 190px;
  }

  .contentDIVImgIframe{
    height: 93%; 
  }

  #imgRespon{
    height: 95%;  
    margin-top: 4%;
    max-width: 100%;
    background-color: white;
  }

  #statusBarContainer{
    width: 50%;
    left: 25%;
    height: 40%;
    top: 20%;
  }

  #footerbutton {
    margin-top: 0px !important;
  }
  
  #buttonclosestatus{
    margin: 0px !important;
  }

  div#topBox_container.loadingBoxes{
    top: 30% !important;
    right: 5% !important;
    width: 210px !important;
  }

  .info_input_error {
    text-align: justify;
    font-size: 19px;
    font-family: 'Lato', sans-serif;
    padding-left: 15px !important;
  }

  .table_auction{
    display: flex;
    justify-content: center;
    align-items: center; 
  }

  td.largeList{
	 width: 60%;
  }

  td.smallList{
	 width: 40%;
  }

  div#agreementCriteriaContainer{
	 top:40% !important;
  }

  div#offerSaveContainer{
	 top:40% !important;
  }

  div#nullPricesAgreeContainer{
	 top:40% !important;
  }
 
  div#loginLogo_mobil{
    display: none;
  }
  
  p.tittleText{
    font-size: 15px;
    /*padding-left: 10%; */ 
  }

  .nav-show{
    display: none !important;
  }

  li.active{
    display: table-cell !important;
  }

  li.buttonTab{
    display: table-cell !important;
  }
  
  .tabmobile{
    display: none !important;
  }
  .tabdesktop{
    display: table-cell !important;
  }

  #theContent{
    display: block !important;
    /*margin-top: 20px;*/
  }

  .disabled{
    pointer-events: none;
  }

  .navbar{
    min-height: 1px !important;
    margin-bottom: 20px !important;
  }

  .navbar-nav>li>a{
    padding-top: 4.5px !important;
    padding-bottom: 4.5px !important; 
  }

  .customcolornav{
    height: 30px;
  }

  .tittleTexheader{
    /*width: 40% !important;*/
  }

  .toolbarIcons{
    /*width: 58% !important;*/
  }

  .exitlogut{
    width: 20% !important;
  }

  #mBoxBorder{
    height: 100%;
    position: static;
  }

  #mBox{
    background-color: #fff;
    width: 100%;
    position: static;
    padding: 10px;
    height: 160%;
    border-radius: 11px;
  }
}

#mBoxTitleText{
  color: #F5F5F5;
}

#mBoxContent{
  font-family: 'Lato', sans-serif;
  /*margin-top: 2%;/
  padding-top: 2%;*/
  /*color: #0b0a0a;*/
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  height: 58%;
  overflow-x: hidden;
  padding-top: 3%;
  padding-bottom: 3%;
  color: #666;

}

#mBTitle{
  padding-top: 6px;
  padding-left: 3px;
  padding-bottom: 6px;
  margin-bottom: 17px;
  border-radius: 11px;
  /*font-size: 37px;*/
  text-align: center;
  height: auto;
  color: #F5F5F5;
  background-color: #000;
  min-height: 31px;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 4vw;
}


/*#mBoxContent{

}*/

/*********************************************Tablets-Desktop-Large desktop*****************************/

/********Móviles en horizontal o tablets en vertical***************/
@media (min-width: 770px) {
  .monthPhoto{
    margin-top:0%; 
    margin-left:0%; 
    text-align:left; 
    letter-spacing:0.02em; 
    text-transform:uppercase;
  } 
  
  .checkMonth{
    max-width:70%;
  }

  #mBoxContainer{
    left: 42%;
  }

  #mBoxButtons{
    margin-top: 3%;
    /*margin-left: 19%;*/
    margin-right: 1%;
    margin-bottom: 3%;
  }
}


/********Tablets en horizontal y escritorios normales***************/
@media (min-width: 993px) { 
.monthPhoto{
  margin-top:-8%; 
  margin-left:22%; 
  text-align:left; 
  font-size:115%; 
  letter-spacing:0.02em; 
  text-transform:uppercase;
}
#mBTitle{
  padding-top: 2px;
}

#mBoxContainer{
    left: 26%;
    top: 16%;
  }
  .buttonStyle_content{
    padding: 10px 20px 10px 20px;
  }
}

/********Escritorios muy anchos*********/
@media (min-width: 1210px) { 
.monthPhoto{
  margin-top:-8%; 
  margin-left:22%; 
  text-align:left; 
  font-size:115%; 
  letter-spacing:0.02em; 
  text-transform:uppercase;
}

.checkboxPhoto{
  margin-top: -9px; 
  max-width:70%;
}
 #mBTitle{
  padding-top: 15px;
  padding-bottom: 15px;
  /*font-size: 43px;*/
  font-size: 2vw;
}

 /*#mBoxContainer{
    left: calc(50% - 377px);
    top: calc(50% - 245px);

}*/

.buttonStyle_content{
  padding: 10px 40px 10px 40px;
}

/*  #mBoxButtons{
  margin-top: 1%;
  margin-left: 3%;
  margin-bottom: 1%;
  margin-right: 3%;
}*/


}
@media(max-width: 992px){
  .namePhoto{
  font-size: 16px;
}
/*#mBTitle{
  padding-top: 2px;
}*/
  #mBoxContainer{
    left: 26%;
    top: 16%;
}

.title_help_letter{
  font-size: 100% !important;
}



.buttonStyle_content{
    padding: 10px 15px 10px 15px;
  }


  #mBoxVideoContainer{
    left: 25%;
    width: 50%;
  }

}

@media(min-width: 762px){
  .namePhoto{
  font-size: 16px;
}
  #mBTitle{
    /*padding-top: 6px;*/
    /*font-size: 43px;*/
    width: 100%;
    font-size: 2vw;
}
  


}
/*********************************************mobile*****************************/
@media(max-width: 744px){

  #nuldivAgree{
    margin-top: -119px !important;
  }

  #mBoxVideoContainer{
    left: 15%;
    width: 70%;
  }
}

@media(max-width: 768px){

  .conteiner_gantt{
    width: 100% !important;
  }



.tittleTexheader{
  /*width: 40%;
  float: left;
  padding-left: 2%;*/
}
 
#btnmobile{
  visibility: hidden;
} 



#mBTitle{
  padding-top: 3%;
  padding-bottom: 3%;
  width: 100%;
  border-radius: 11px;
}  

#mBox{
  width: 100%;
  border-radius: 11px;
  padding-bottom: 25px;
}

#mBoxContainer{ 
  width: 76%;
  left: 12%;
  top: 16%;
}

#mBoxBorder {
    /* background: #AAA; */
    /* padding: 2px; */
    width: 100%;
    height: 110%;
    position: static;
}
.buttonStyle_content{
    padding: 5px 15px 5px 15px;
    /*margin-top: 40px;*/
    display: block;
  }


  #mBoxButtons > div{
    margin-top: 10px !important;
  }

}

@media(max-width: 770px){
.logoutClass{
  display: none;  
}

.bar_top{
  /*display: none;*/
}
#mBoxContent{
  font-size: 23px;
  height: 48%;
}

#mBoxButtons{
  margin-top: 3%;
  margin-left: 3%;
  margin-right: 2%;
  margin-bottom: 1%;
}
.custommiddleh{
  display: none;
}

.custommiddlev{
  display: block !important;
}

.verticaltablet{
  width: 100%;
}

.monthPhoto{
  margin-top:0%; 
  margin-left:2%; 
  text-align:left; 
  font-size: 11px;
  letter-spacing:0.02em; 
  text-transform:uppercase;
}
a.linkHref{
  pointer-events:none;
  cursor: default;
}
.contentTAbImg{
  height: 60%; 
}

.chosen-container {
  min-width: 50px;
}
.contentDIVImgIframe{
  height: 88%; 
}

#imgRespon{
  height: 95%;  
  margin-top: 4%;
  background-color: white;
}

  #statusBarForm{
    display: none !important;
  }

  #statusBarFormAuc{
    display: none !important;
  }

  #statusBarContainer{
    width: 96%;
    left: 2%;
    height: 40%;
    top: 10%;
  }

  #footerbutton {
    margin-top: 0px !important;
  
  }

  #buttonclosestatus{
    margin: 0px !important;
  }

  .info_input_error {
    text-align: justify;
    font-size: 20px;
    font-family: 'Lato', sans-serif;
    padding-left: 10px;
  }

.tbsize{
  font-size: 10px;
}
.text_top_box{
 font-size: 10px; 
}
div#topBox_container.loadingBoxes {
    top: 85% !important;
    right: 10% !important;
    width: 80% !important;
}

div.tdoption_list{
  margin-top: 25px;
}
div.tdPrice{
      margin-top: 25px;
      font-size: 0.8em !important;
}
.internalTopLogoMobile{
   padding-left: 20%;
   margin-left: 10px !important;

}
table.listBlock tr.header td h1{
	font-size: 11px !important;
}
table.listBlock tr.header td h2{
	font-size: 9px !important;

}
div.tddate_list{
	font-size: 0.8em !important;
  margin-left: 25px;
  margin-top: 25px;
}
table.listBlock td.numeric{
	font-size: 9px !important;
}
td.largeList{
	width: 50%;
}
td.smallList{
	width: 50%;
}

.tdPrice{
	 width: 44% !important;
}
.tdOptcion{
	 width:0% !important;
}
div#agreementCriteriaContainer{
	top:25%;
}
div#offerSaveContainer{
	top:25%;
}
.toolBarTips{
  font-size: 1em !important; 
}  
/* #searchBarForm{
  display: none;
} */
div#loginLogo{
  display: none;
}
div#theHeader{
  height: 100%;
}

.contentBackground {
  width: 100% !important;
  left: 0% !important;
  right: 0% !important;
}
.topNavigation{
  /*height: 46px !important;*/
}
.topNavigationExt{
  height: 50px !important;
}
  #footchar_Reduccion{
        font-size: 11px !important;
        margin-bottom: 3px;
  }
  p.tittleText{
    font-size: 15px;
    /*padding-top: 0px !important;*/
  }
  #chartitle_auction{
    font-size: 10pt !important;
  }
.loginContainer .contentSection{
  height: 100% !important;
  top: 0% !important;
  bottom: 0% !important;
}


  .frameCharts{
    /*height: 100px !important; */
}
  #topBox_container{
    /*display: none !important;*/
  }
.nav-justified{

}
.nav-show{
display: block !important;
}
  li.active{
    display: none;
  }
  li.buttonTab{
    display: none;
  }
.tabmobile{
  display: table-cell !important;
}
.tabdesktop{
      display: none !important;

}
.disabled{
     pointer-events: auto;
}
.topBar{
}
.internalContainer .headerSection .topNavigation{
  /*padding-top: 40px;*/
}

.internalContainer .headerSection .topNavigationExt{
  padding-top: 40px;
}
.contentBackground{
  /*height: calc(96% - 100px) !important;
   top: 110px !important;*/
}
div#theContent{
  /*height: 90% !important;*/
}
.internalContainer .contentSection{
  padding-top: 90px !important;
}
.tabContainerDV{
  height: 93% !important;
}


.letter_gantt{
  margin-left: 0% !important;
}

.progress_gantt
{
  margin-left: 0% !important;
  width: 100% !important
}

label.required::after{
  top: 5px !important;
}
 .control-label{
  text-align: left !important;
 }
table.listBlock tr.subtotal td{
  text-align: left !important;
  font-size: 17px !important;
  font-weight: 200 !important;
  color: rgba(0, 0, 0, 0.7) !important;

}
table.listBlock td .advanced{
  width: 55px !important;
}
table.listBlock td h1{
  font-size: 12px !important;
  font-weight: 300 !important;
}

.content_Ext{top: 114px !important;}
}

@media(max-width: 360px){
  .tittleTexheader{
    /*width: 40%;
    float: left;*/
  }
}

@media(max-height: 370px){

  .topNavigation{
    height: 50px !important;
  }

  .sub_header_span{
    height: 0px !important;
  }

  #searchDivAdvanced{
    margin-top: 35px !important;
  }

  .search_text_box{
    width: 64%;
    float: left;
  }

  .search_text_icon
  {
    float: left !important;
  }

  .search_text{
    float: left;
  }
  .footerSection{
    display: none !important;
  }

  .fSection {
    display: none !important;
  }

  div#pageTabs.tabsNavigation{
    display: none;
  }

.internalContainer .headerSection{
    display: none !important;
  }

  .topBar{

}
.contentBackground{
    top: 4px !important;
    height: 98% !important;

}

  div#theContent {
    /* height:99%;*/
  }
.tabContainerDV{
      height: calc(90% - 20px) !important;

}
.internalContainer .contentSection{
  padding-top: 10px !important;
}

}
/*********************************************mobile*****************************/
@media(max-width: 480px){




  #mBoxVideoContainer{
    left: 0%;
    width: 100%;
  }

  /*.buttonStyle_content{
    margin-left: -11px; 
  }*/
}

@media(max-height: 587px){

  /*#mBTitle {
    padding-top: 2px;
    width: 117%;
    border-radius: 11px;
    height: 56%;
}*/
/*
  #mBox {
    width: 117%;
    height: 160%;
}
  #mBoxContent{
    margin-top: 3px;
    padding-top: 3%;
    height: 85%;
    font-size: 20px;
  }*/

  /*#mBoxContainer {

    left: 24%;
    top: 10%;
}*/

  /*.buttonStyle_content{
    margin-left: -8px;
  }*/

}

@media(max-width: 320px){
  /*#mBoxContent{
    font-size: 21px;
        height: 48%;
  }

  #mBoxBorder{
    height: 110%;
    width: 110%;
    margin-left: 5%;
  }

  .buttonStyle_content{
    margin-left: -3px !important;
    font-size: 17px;
    padding: 5px 15px 5px 15px;
    display: block;
  }

  #mBoxButtons > div{
    margin-top: 10px !important;
  }*/

}

.padding_cero_m{
  padding: 0 !important;
}




ul.tabList.nav.nav-tabs.nav-justified{

  max-height: 100%;
  overflow: auto;
}
div#pageTabs.tabsNavigation{
/*margin-right: 3%;
margin-left: 3%;*/
/*top: 139px;
left: 3%;
right: 3%;*/
position: relative;
width: 100%;
/*margin-left: 3%;*/

}

.breadcrumb{

  background-color: #ffffff;
}

div#listTab-content.tabContainerDV{

  margin-top: 10px;
}

#checkid{

  display: inline-block;
margin-top: 0;
margin-bottom: 0;
vertical-align: middle;

}
.calendar{
  display: block !important;
}

#serverTime{
  font-size: 20px;
  /*padding-top: 20px;*/
}

div#timeshow{
  font-size: 20px;
  padding-top: 20px;
}

#posinfo{
  width: 30%;
  float: left;
}

/*div#posinfo>p{
  font-size: 20px;
  float: left;
  margin-top: 20px;
}*/

.alert-error{

color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;

}


label.error.valid{
  display: none !important;
}
.caret{
  display: none !important;
}
.blockinfoauc{
  float: left;
  padding-top: 20px;
}

.paddingauc{
  padding-top:40px;
}

.hoverpoint{
  cursor: pointer;
}
.hoverpoint5:hover{
    cursor: pointer;
     text-decoration: underline; 

}

.hoveropc5:hover{
  cursor: pointer;
  opacity: .5 !important;
}
.hovershadow:hover{
text-shadow: 1px 1px 1px #aaa;
cursor: pointer;
}
.marginbot{
  margin-bottom: 20px;
}
.infohome{
  float: left;
  max-width: 400px;
  margin-right: 10px;
}

.customcolorWise{
  color: rgba(215, 128, 102, 0.8);
}
.customcolorWise:hover{
  color: #d78066 !important;
}

.customdiv100h{
  height: 100% !important;
  /*overflow-y:scroll;*/
}

.overflow-y{
  overflow-y:scroll;
}



.custommiddleh{

  top:37%;
  left: 20%;
  position: relative;

}




.loginpanelcont{

  top: calc(45% - 200px);
  position: relative;
  float: left;
  border-left: 3px solid rgba(255, 255, 255, 0.07);
  vertical-align: middle;
  text-align: left;
  padding-left: 5%;


}

@media (max-width: 770px){
.loginpanelcont{
  top:20px !important;
  margin-top: 0px !important;
  border-left: none !important;
  width: 60%;
  /* margin-left: 20%; */
  margin-right: 20%;
  margin-left: 15%;


  }
}

@media (max-width: 400px){
  .loginpanelcont{
  width: 90%;
  margin-right: 5%;
  margin-left: 0%; 
}

}


.verticaltablet{
  overflow-y:scroll; 
  max-height: 100% !important;
  top:0%;
}





@media (max-width: 770px){

.ist_mob{
  width: 100% !important;
}

  
.verticaltablet{
  border-left: none !important;
  top: 3% !important;
  text-align: center;
  max-height: 70% !important;
  }
}


@media (max-height: 500px){
  .verticaltablet{
    max-height: 75% !important;
    top: 0 !important;
}
}
@media(max-height: 400px){
.verticaltablet{
    max-height: 70% !important;
}
}


@media(max-height: 300px){
.verticaltablet{
    max-height: 70% !important;
}
}

@media (min-width: 770px) and (max-height: 500px){
.verticaltablet{

  top: 37% !important;
}
.loginpanelcont{

  top:0% ;
  margin-top: 0px;
}
}



.custommiddlev{
/*  left: 25%;*/
text-align: center;
}

/**Custm **/


.loginLog_mini{
  width: 100px;
  height: 50px;

}

@media (min-width: ){
.loginLog_mini{


}

}


/**Se vea bien la imagen en cualuier resolución**/
img#loginLog.img-responsive{
float: left;
width: 60%
}
/**Se vea bien la imagen en cualquier resolución**/
/*div.navtester{
  position: absolute;
  left: 60%;
  top:  40%;


}

                                          /**Estilo para el navegador en cualquier resolución**/

/*

.customcolornav{
  background-color: #193751 !important;
}
*/

/*.bar_top{
    background-color: #193751 !important;
}*/
.navbar-nav{
  /*float: right;
  margin-right: 50px;*/
}
li.dropdown{
  display: block !important;
}
/*ul.nav.navbar-nav>li:hover .dropdown-menu {
    display: block;
 }*/
 a.navletters{
  display: flex !important;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  align-items: center;
 }

/*ul.nav.navbar-nav{
  float: right;
}

/*.navCustom{
  background-image: none !important;
  background-color: rgba(245, 245, 245, 0) !important;
  border-color:  rgba(245, 245, 245, 0) !important;
  -webkit-box-shadow: none !important;


}
/*nav.navbar.navbar-default{
  width: 500px;
  left: 100%;
  margin-left: -500px;
  top: 39px;
}*/
.navbar-default{
  background-image: none !important;
   background-color: rgba(245, 245, 245, 0);
  border-color:  rgba(245, 245, 245, 0) !important;
  -webkit-box-shadow: none !important;
 
}
/*div#bs-example-navbar-collapse-1.navbar-collapse.collapse.in{
  background-color: black;
  text-align: right;
  /*  border-color:#ED891B !important;*/
  /*width: 250px;
  float: right;
  color: white;

 /* margin-left: 280px;*/
/*}
/**/
div#bs-example-navbar-collapse-1.navbar-collapse.collapsing{
  /*border-color:#ED891B !important;*/
  /*background-color: black;
  text-align: right;
  width: 250px;
  float: right;;*/
  /*text-align: right !important;*/
  z-index: 2000;

}
.navbar-collapse{
 /* text-align: right !important;*/
     z-index: 1000;

}
a#navletters{
/*color: rgb(189, 185, 182);*/
color: white;
/*height: 50px;*/
}/*
*//* para cada elemento del menu*/
.navbar-default .navbar-nav>.open>a{
  background-color: rgba(255, 255, 255, 0) !important;
}
.dropdown-menu{
  border-top: 2px solid #d78066;
}
.collapse.in{
  /*text-align: right;*/
      z-index: 1000;

}
.customcolorWise:hover{
  color: #d78066 !important;
}
.navbar-nav .open .dropdown-menu{
}
/* para cada elemento del menu*/

/**//*
.navbar-default .navbar-nav .open .dropdown-menu>li>a{
  text-align: right;
    /*color: white;*/
/*}/*
.dropdown-menu{
  left: 0px !important;
  right: 10px !important;
  min-width: 190px;
}*/

div#bs-example-navbar-collapse-1.navbar-collapse.collapse.in>.navbar-nav{
 /* margin-right: 65%;*/
  z-index: 3;
}

                                         /**Estilo para el navegador en cualquier resolución**/

/*****************************Form fieldBlock para formularios sencillos***************************************/
.fieldsBlock{
	border-bottom: 1px solid rgba(208, 208, 208, 0.2);
	
	
}

/*.fieldBlockcontener{
  position: fixed;
  width: 94%;
  height: 60%;
  overflow: auto;
	
}*/
.miniPannel li{
	height: 30px;
	padding-top: 5px;
}
.miniPannel li:hover{
	cursor: pointer;
	text-decoration: underline;
}
.fieldsBlock p{
	padding-top: 15px;
	/*height: 30px;*/
	/*float: right;*/
	padding-bottom: 15px;
}

.fieldsBlock h2#OculDiv:hover{
	cursor: pointer;
}
.fieldsBlock h2, .fieldsBlock h2#OculDiv, .fieldsBlock h2#OculDiv:hover{
	width: auto;
	height: auto;
	
}


.fieldsBlock h2#h21:before{
  font-family: 'WiSE';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  content: "\e0db";
  font-size: 14px;
  margin-right: 5px;
  margin-left: 2px;


}



.submitBlock{
	padding-top: 30px;
	padding-bottom: 5px;	
	
}

.fieldsBlock label{
	float: left;
	text-align: left;		
	}
.note{
	padding-top: 3px;
}
.infoBlock{
	padding-bottom: 15px;
}
/*****************************Form fieldBlock para formularios sencillos***************************************/

/*****************************Form Log para formularios sencillos***************************************/
.logsBlock .p{
	padding-top: 10px;
	padding-bottom: 10px;

}

.logsBlock .division{
	border-bottom: 1px solid rgba(208, 208, 208, 0.2);

}
.divisionH{
	border-right:  1px solid rgba(208, 208, 208, 0.2);
	width: 30px;
}
.logsBlock label{
	position: relative;
	float: right;
	top: 20px;
	/*text-align: left;*/
	/*padding-right: 25px;*/
}
  .fieldsBlock .hminfo:before{
  font-family: 'WiSE';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  content: "\25be";
  font-size: 14px;
  margin-right: 5px;
  margin-left: 2px;
}


/*****************************Form Log para formularios sencillos***************************************/
.footerpage{
  height: 25px;
  width: 100%;
  margin-top: -25px;
  line-height: 25px;
  text-align: center;
  background-color: rgba(208, 208, 208, 0.9);
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  margin: -25px auto 0;
  display: block;
  z-index: 10;
	
}

/* only xs*/
@media (max-width: 767px){
  
  .with_porcent_td{
    width: 5% !important;
    border: none !important;
  }

  .with_td_border{
    border: none !important;
  }



}


@media (max-width: 770px)
{
  #loginBackgroundLogo {
    display: none;
  }
}
/*.fieldsBlock tr {
	
	
}*/
@media(max-width: 768px){
  #mBoxContainer{ 
    left: 12% !important;
  }
}

@media(max-width: 321px){
  #mBoxContainer {
    /*left: 20% !important;*/
  }
}

/*@media(max-width: 281px){
  #mBoxButtons div:nth-child(2) {
    padding-left: 0px !important;
  }
  #mBoxButtons div:nth-child(1) {
    padding-bottom: 5px !important;
  }  
}*/

@media(max-width: 400px){
  #mBoxButtons div:nth-of-type(2) {
    width: 100% !important;
    padding-left: 0% !important;

    position: relative;
    top: 10px;

  }

  #mBoxButtons div:nth-of-type(1) {
    width: 100% !important;
  }

  #mBoxButtons div:nth-of-type(3) {
    width: 100% !important;
    padding-left: 0% !important;

    position: relative;
    top: 10px;
  }

  #buttonclosestatus{
    background-color: #dddd !important;
  }

}


@media(max-width: 450px){
  #mBoxButtons div:nth-child(3) {
    padding-left: 0px !important;
    padding-top: 5px !important;
  }
}


/* MObiLE EXTRA GUI*/
@media( max-width: 900px ){

  /* MENU */
  #showtabsm{
    display: block !important;
  }
  #menudisplay.hiddenbar{ width: 6%;}
  #photoretrat.hiddenbar {
    width: 40% !important;
    left: 3% !important;
  }
  #photoretrat.hiddenbar>#content>#Info_users{ display: none;}  
  #poshelpvideo{ display: none;}

  #posinfo{
    width: 100%;
  }

  #serverTime{
    font-size: 15px;
  }
  

  /* #photoretrat {
    width: 44% !important;
  }

  #photoretrat.active {
    width: 10% !important;
  } */

  #photoretrat >#content{
    padding: 0px 7% 0px 7%;
  }

  /* #headerSectionDiv {
    left: 44% !important;
    width: 56% !important;
  } */

  #generalconten {
    width: 100% !important;
    left: 0% !important;
  }

  #generalconten.active {
    width: 90% !important;
    left: 10% !important;
  }

  #generalconten.hiddenbar {
    width: 100% !important;
    left: 0% !important;
  }

  /* #headerSectionDiv.active {
    left: 10% !important;
    width: 90% !important;
  } */

  /*LIST PROYECTs*/
  .centermob{
    justify-content: center;
    padding: 5px;
  }

  .middlinermob{
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: center;
    padding: 5px;
    text-align: center;
  }

  .widthcoln60{
    width: 100%;
  }

  .widthcoln40{
    width: 100%;
  }

  .borderright{
    border: 0 !important;
  }

  .borderright_proy{
    border: 0 !important;
  }

  ul.nav-tabs {
    border-radius: 0px !important;
  }
}

/* ------------------------------- Apartado de autorizaciones WISE ---------------------------- */

@media screen and (min-width: 280px) {
  .button-box {
    display: flex;
    justify-content: center;
  }
}

@media screen and (min-width: 768px) {
  .button-box {
    justify-content: center;
  }
}

@media screen and (min-width: 1200px) {
  .button-box {
    justify-content: flex-end;
  }
  
}

@media screen and (min-width: 280px) {
  .box-infoW {
    flex-direction: column;
    align-items: center;
  }
  
}

@media screen and (min-width: 768px) {
  .box-infoW {
    flex-direction: column;
    align-items: center;
  }
  
}

@media screen and (min-width: 1200px) {
  .box-infoW {
    flex-direction: row;
  }
}


@media screen and (min-width: 280px) {
  .box-infoW .child1 {
    flex-direction: column;
    text-align: center;
    width: 100%;
  }  

  .box-infoW .child2 {
    width: 100%;
    margin: 1rem 0;
  }

  .box-infoW .child2 .elem1 {
    width: calc(60% / 3);
  }
  .box-infoW .child2 .elem2 {
    width: calc(40% / 3);
  }

  .box-infoW .child3{
    display: flex;
    flex-direction: column;
  }

  .box-infoW .child3 .icons:nth-child(2), .icons:nth-child(3){
    margin-top: 1rem;
  }
}

@media screen and (min-width: 768px) {
  .box-infoW .child2 {
    width: 100%;
    margin: 1rem 0;
  }
  .box-infoW .child2 .elem1 {
    width: calc(60% / 3);
  }
  .box-infoW .child2 .elem2 {
    width: calc(40% / 3);
  }

  .box-infoW .child3{
    width: 100%;
    flex-direction: row;
  }

  .box-infoW .child3 .icons{
    width: calc(100% / 3);
    margin-top: 0;
  }

  .box-infoW .child3 .icons:nth-child(2){
    margin-top: 0;
  }
}

@media screen and (min-width: 1200px) {
  .box-infoW .child1 {
    flex-direction: row;
    justify-content: unset;
    width: 30%;
    
  }

  .box-infoW .child1 .title {
    width: 50%;
  }
  .box-infoW .child1 .infoWtext {
    width: 50%;
  }

  .box-infoW .child2 {
    width: 30%;
  }
  
  .box-infoW .child3 {
    width: 40%;
  }

  .box-infoW .child3 .icons{
    width: calc(100% / 3);
  }

}


/*---------------------------------------------- userEdit--------------------------------------------------*/
@media screen and (min-width: 280px) {

  .userFlex1 {
    height: 110%;
    flex-direction: column;
  }

  .userBox {
    margin: 2rem auto;
    padding: 1rem 0;
    height: 100%;
    width: 70%;
  }

  .text1 {
    font-size: 1rem;
  }

  .iconSize {
    font-size: 3rem;
  }

}

@media screen and (min-width: 420px) {

  .userFlex1 {
    height: 100%;
  }

  .userBox {
    width: 60%;
  }

  .text1 {
    font-size: 1rem;
  }
  
  .iconSize {
    font-size: 3rem;
  }

}

@media screen and (min-width: 768px) {

  .userFlex1 {
    margin-top: 1rem;
  }

  .text1 {
    font-size: 2rem;
  }

  .iconSize {
    font-size: 5rem;
  }

}


@media screen and (min-width: 1200px) {
  .userFlex1 {
    height: 80%;
    flex-direction: row;
  }

  .userBox {
    margin: 2rem 0rem;
    padding: 0;
    height: 70%;
    flex-basis: 20%;
  }

  .iconSize {
    font-size: 5rem;
  }

  .text2 {
    font-size: 1.2rem;
  }

  .text1 {
    font-size: 1rem;
  }

}

@media screen and (min-width: 1800px) {

  .userFlex1 {
    height: 80%;
    margin-top: 3rem;
  }

  .userBox1 {
    margin: 2rem 0rem;
    height: 65%;
    flex-basis: 20%;
  }
  
  .iconSize {
    font-size: 6rem;
  }

  .text1 {
    font-size: 1.5rem;
  }

}


/*------------------------------------------------- Login --------------------------------------------------------*/

@media screen and (min-width: 280px) {
  .clase3 {
    height: 100%;
  }

  .clase3 .caja3{
    height: 100%;
  }

  .caja3 .help .ln {
    border-bottom: 1px solid black;
  }

  .text_passChild .logIcon {
    right: 1px;
  }
}

@media screen and (min-width: 280px), (orientation: landscape) {
  .clase3 .caja3{
    overflow: scroll;
  }
}


@media screen and (min-width: 768px) {
  .clase3 {
    height: unset;
  }

  .clase3 .caja3 {
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 30px 90px;
	  width: 70%;
    height: 80%;
  }

  .clase3 .caja4 {
    height: 80%;
    width: 100%;
  }

  .text_passChild .logIcon {
    right: -10px;
  }
}


@media screen and (min-width: 1200px) {
  .clase3 {
    width: 50%;
  }

  .clase3 .caja3 {
    height: unset;
    overflow: unset;
	  width: 50%;
  }

  .clase3 .caja4 {
    height: 92%;
    width: 50%;
  }

  .caja3 .help .ln {
    border-bottom: none;
  }
}

@media screen and (min-width: 1800px) {
  .clase3 .caja3 {
    height: unset;
  }

  .clase3 .caja4 {
    height: 68%;
    width: 50%;
  }
}


/*-----------------------------------------------------AuctionListTop-------------------------------------------------*/

@media screen and (min-width: 280px) {

  .auctionBody{
    padding-top: 1rem;
  }

  .auctionSection1 {
    padding: 0 1rem 0 1rem;
  }

  .auctionTitles {
    flex-direction: column;
    justify-content: center;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
  }

  .auctionTitles .title1{
    text-align: center;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
  }


  .auctionDescription {
    flex-direction: column;
  }

  .auctionDescription .details2,
  .auctionDescription .details {
    text-align: center;
    border-left: 1px solid #0000004d;
    border-bottom: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
  }


  .auctionDescription .files {
    flex-direction: row;
    border-bottom: 1px solid #0000004d;
    border-left: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
  }

  .auctionDescription .status {
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid #0000004d;
    border-left: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
    text-align: center;
  }
  
  .auctionPrice .sectionPrices1 {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .auctionPrice .buttonChange {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0.5rem 0;
  }

  .auctionPrice .porcent3 {
    text-align: center;
    border-bottom: 1px solid #0000004d;
  }

  .auctionPrice .sectionIncrement2 {
    text-align: center;
  }

  .auctionPrice .porcent4 {
    width: 100%;
    text-align: center;
  }
  
  .auctionPrice .sectionPrices2 {
    display: flex;
    flex-direction: column;
    width: 100%;
    text-align: center;
  }

  
  .auctionPrice .sectionPrices2 .buttonChange2 {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5rem;
  }

  .auctionPrice .buttonChange2 p,
  .auctionPrice .buttonChange p {
    width: 70%;
  }

  .auctionPrice .auctionPorcent {
    text-align: center;
    border-bottom: 1px solid #0000004d;
  }

  .auctionPrice .auctionPorcent3 {
    text-align: center;
  }

  .auctionPrice .auctionPorcent2 {
    width: 100%;
    text-align: center;
  }

  .auctionPrice .sectionProm {
    width: 100%;
    text-align: center;
  }

  .auctionPrice .sectionPrices2 .porcent2 p {
    width: 100%;
  }
}

@media screen and (min-width: 280px), (orientation: landscape) {
}

@media screen and (min-width: 420px) {

}

@media screen and (min-width: 768px) {

  .auctionSection1 {
    padding: 0 1rem 0 1.3rem;
  }

  .auctionTitles {
    flex-direction: row;
    justify-content: center;
    border-top-right-radius: 1rem;
  }

  .auctionTitles .title1{
    text-align: start;
    /* width: 60%; */
    width: 55%;
    border-top-right-radius: 0;
  }

  .negociation {
    width: 5%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .auctionTitles .title2{
    width: 95%;
  }

  .auctionTitles .auctionPrice{
    width: 40%;
    display: flex;
    /* justify-content: center; */
    align-items: center;
  }

  .auctionTitles .auctionPrice .sectionTaxes p,
  .auctionTitles .auctionPrice .sectionPrice p{
    padding-left: 0.5rem;
  }

  .auctionDescription {
    flex-direction: row;
  }

  .auctionDescription .details2,
  .auctionDescription .details{
    /* width: 60%; */
    width: 55%;
    text-align: start;
  }

  
  .auctionDescription .status {
    display: unset;
    /* width: 25%; */
    width: 30%;
    border-left: none;
    border-bottom: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
    text-align: start;
  }

  .auctionDescription .files {
    border-left: none;
    border-bottom: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
    width: 15%;
    flex-direction: column;
  }

  .auctionPrice .sectionPrices1 {
    width: 62.3%;
  }

  .auctionPrice .sectionIncrement {
    width: 37.7%;
    border-left: 1px solid #0000004d;
  }

  .auctionPrice .sectionIncrement p {
    padding-left: 0.5rem;
  }

  .auctionPrice .porcent3 {
    width: 62.3%;
    text-align: start;
    border-bottom: none;
    padding: 0.2rem 0;
  }

  .auctionPrice .sectionIncrement2 {
    width: 37.7%;
    border-left: 1px solid #0000004d;
    text-align: start;
  }

  .auctionPrice .porcent4 {
    text-align: start;
    padding: 0.2rem 0;
  }

  .auctionPrice .sectionPrices2 {
    flex-direction: row;
    text-align: start;
  }

  .auctionPrice .sectionPrices2 .porcent2 {
    width: 70%;
    padding: 0.2rem 0;
    display: flex;
    align-items: center;
    text-align: start;
  }

  .auctionPrice .sectionPrices2 .buttonChange2 {
    width: 30%;
  }

  .auctionPrice .auctionPorcent {
    width: 62.3%;
    text-align: start;
    border-bottom: none;
  }

  .auctionPrice .auctionPorcent p {
    padding-left: 0.5rem;
  }

  .auctionPrice .auctionPorcent3 {
    width: 37.7%;
    text-align: start;
    border-left: 1px solid #0000004d;
  }

  .auctionPrice .auctionPorcent3 p {
    padding-left: 0.5rem;
  }

  .auctionPrice .auctionPorcent2 {
    width: 100%;
    text-align: start;
    padding: 0.2rem 0;
  }

  .auctionPrice .auctionPorcent2 p {
    padding-left: 0.5rem;
  }
  
  .auctionPrice .sectionProm {
    width: 100%;
    text-align: start;
  }

  .auctionPrice .sectionProm p {
    padding-left: 0.5rem;
  }
  
}


@media screen and (min-width: 1200px) {

  .auctionBody{
    padding-top: 0;
  }

  .auctionSection1 {
    padding: 0 1rem 0 2rem;
  }

  .auctionDescription .files {
    flex-direction: row;
  }

  .auctionDescription .status {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }

  .auctionPrice .sectionPrices1 {
    flex-direction: row;
  }

  .auctionPrice .sectionPrices1 .porcent {
    width: 70%;
    height: 100%;
    
    padding: 0.2rem 0;
  }

  .auctionPrice .buttonChange {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30%;
    margin: 0;
  }

  .auctionPrice .sectionPrices2 .porcent2 {
    width: 53%;
  }

  .auctionPrice .sectionPrices2 .buttonChange2 {
    width: 20%;
  }

}

@media screen and (min-width: 1800px) {

  .auctionTitles .auctionPrice .buttonChange{
    justify-content: flex-start;
  }

  .auctionPrice .buttonChange2 p,
  .auctionPrice .buttonChange p {
    width: 50%;
  }

  .auctionPrice .sectionPrices2 .porcent2 {
    width: 45%;
  }
  
}


/*---------------------------------------------------- AuctionListBot ------------------------------------------------*/

@media screen and (min-width: 280px) {
  .advancedPrev {
    flex-direction: column;
  }

  .sectionImportant .importantDivision {
    flex-direction: column;
    border-bottom: 1px solid #0000004d;
  }

  .sectionImportant .importantDivision .importantButtons {
    border-bottom: 1px solid #0000004d;
  }

  .sectionImportant .importantDivision .importantSections {
    padding: 0;
    min-height: 20rem;
  }

  .importantSections .boxDates {
    width: 12rem;
  }

  .importantSections .boxDates2 {
    width: 12rem;
  }

  .importantSections .space1 {
    margin-bottom: 1rem;
  }

  .importantSections .comparativeBox {
    margin-bottom: 0.5rem;
  }

  .importantSections .comparativeText {
    text-align: center;
    margin: 0.5rem 2rem;
    text-decoration: underline;
  }
  .documentsTop {
    margin-bottom: 1rem;
  }

  .documentsTop .boxDocuments {
    width: 10rem;
  }
  .sectionSpace {
    flex-direction: column;
  }
  
  .sectionSpace .setcionInput input {
    width: 100%;
  }

  .staticOptions {
    flex-direction: column;
  }

  .documentOptions {
    padding: 0;
    height: 80%;
  }

  .statisticOption {
    padding: 0;
    height: 20%;
  }

  .statisticOption .optionStatic2 {
    display: flex;
    justify-content: center;
    text-align: center;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
  
  .statisticOption .optionStatic2 .boxstatistic {
    width: 65%;
  }

  .parraf {
    text-align: center;
  }

  .importantSections .space1 .boxDates2 .topTitle2 p {
    text-align: center;
  }


  .section_color {
    flex-direction: column;
  }

  .section_color .sectionInfo {
    flex-direction: column;
  }

  .section_color .sectionInfo .lineColor{
    flex-direction: column;
    margin: 1rem 0;
  }

  .section_color .sectionInfo .lineColor .tostartLine,
  .section_color .sectionInfo .lineColor .startedLine,
  .section_color .sectionInfo .lineColor .closedLine {
    margin-bottom: 0.5rem;
  }

  .importantSections .space1 .boxDatesDates {
    width: 12rem;
  }

  .importantSections .space1 .boxDatesDates .topTitleDates {
    width: 100%;
  }

  .boxDatesDates .boxDatesinfo {
    width: 100%;
  }

  .sizehmax2 {
    /* width: 50% !important; */
    text-align: start;
  }

  .importantSections .boxDatesDates .hightBox {
    justify-content: center;
  }
}

@media screen and (min-width: 280px), (orientation: landscape) {
}


@media screen and (min-width: 768px) {

  .sectionImportant .importantDivision {
    flex-direction: row;
  }

  .sectionImportant .importantDivision .importantButtons {
    width: 25%;
  }

  .sectionImportant .importantDivision .importantButtons {
    border-bottom: none;
  }

  .sectionImportant .importantDivision .importantSections {
    width: 75%;
    border-left: 1px solid #0000004d;
    padding: 1rem 2rem 2rem 2rem;
    min-height: 26rem;
  }

  .importantSections .space1 {
    margin-bottom: none;
  }


  .importantSections .comparativeText {
    text-align: start;
    margin: 0;
    padding-bottom: 0.5rem;
  }
  .documentsTop {
    margin-bottom: none;
  }

  .sectionSpace {
    flex-direction: row;
  }

  .sectionSpace .setcionInput input {
    width: 80%;
  }

  .staticOptions {
    flex-direction: row;
  }

  .documentOptions {
    height: 90%;
  }

  .statisticOption {
    height: 10%;
    border-top-width: 1px;
    border-top-style: solid;
  }

  .statisticOption .optionStatic2 {
    padding-top: none;
    padding-bottom: none;
  }

  .statisticOption .optionStatic2 .boxstatistic {
    width: 80%;
  }

  .panel_close {
    width: 90% !important;
  }

  .buttons_close {
    width: 10% !important;
  }

  .parraf {
    text-align: start;
  }

  .fourthBox {
    width: 90% !important;
  }
  
  .theerthBox {
    width: 10% !important;
  }
  .importantSections .space1 .boxDates2 .topTitle2 p {
    text-align: center;
  }

  .topTitle1 .iconSpan,
  .topTitle2 .iconSpan2 {
    right: 0.1rem;
  }

  .sectionEvents {
    height: 90%;
  }

  .section_color {
    flex-direction: row;
    height: 10%;
  }

  .section_color .iconInfo {
    width: 5%;
  }

  .section_color .sectionInfo {
    flex-direction: row;
    justify-content: space-evenly;
    width: 95%;
  }

  .section_color .sectionInfo .lineColor{
    flex-direction: row;
    margin: 0;
  }

  .section_color .sectionInfo .lineColor .tostartLine,
  .section_color .sectionInfo .lineColor .startedLine,
  .section_color .sectionInfo .lineColor .closedLine {
    margin-bottom: 0;
    margin-right: 0.5rem;
  }

  .importantSections .space1 .boxDatesDates {
    width: 15rem;
  }
}


@media screen and (min-width: 1200px) {

  .advancedPrev {
    flex-direction: row;
  }

  .sectionImportant {
    width: 80%;
  }

  .sectionImportant .importantTitle {
    border-right: 1px solid #0000004d;
  }

  .sectionImportant .importantDivision {
    border-right: 1px solid #0000004d;
    border-bottom: none;
  }

  .importantSections .boxDates {
    width: 20rem;
  }

  .importantSections .boxDates2 {
    width: 15rem;
  }

  .importantSections .space1 .boxDatesDates {
    width: 20rem;
  }

  .documentsTop .boxDocuments {
    width: 15rem;
  }

  .optionList {
    width: 20%;
  }

 /*Botones Ocultar*/
 
  .sectionImportant2 {
    width: 90% !important;
  }
  
  .optionList2 {
    width: 10% !important;
  }

  .optionList .optionOp .fOprion .separation3 {
    width: 100% !important;
  }

  .panel_close {
    width: 90% !important;
  }

  .buttons_close {
    width: 10% !important;
  }

  .firstBox {
    width: 90% !important;
  }

  .secondBox {
    width: 10% !important;
  }

  .fourthBox {
    width: 90% !important;
  }
  
  .theerthBox {
    width: 10% !important;
  }
  
  .statisticOption .optionStatic2 .boxstatistic {
    width: 65%;
  }

  .importantSections .space1 .boxDatesDates .topTitleDates {
    width: 40%;
  }

  .boxDatesDates .boxDatesinfo {
    width: 60%;
  }

  .importantSections .boxDatesDates .hightBox {
    justify-content: flex-start;
  }
}

@media screen and (min-width: 1800px) {

  /*Botones de ocultar*/

  .sectionImportant2 {
    width: 95% !important;
  }
  
  .optionList2 {
    width: 5% !important;
  }
  
  .optionList .optionOp .fOprion .separation3 {
    width: 100% !important;
  }

  .panel_close {
    width: 95% !important;
  }

  .buttons_close {
    width: 5% !important;
  }

  .firstBox {
    width: 95% !important;
  }

  .secondBox {
    width: 5% !important;
  }
  
  .fourthBox {
    width: 95% !important;
  }

  .theerthBox {
    width: 5% !important;
  }

  .importantSections .space1 .boxDatesDates .topTitle2 p,
  .importantSections .space1 .boxDates2 .topTitle2 p {
    text-align: center;
  }

  .topTitle1 .iconSpan,
  .topTitle2 .iconSpan2 {
    right: 1rem;
  }
}

/*------------------------------------------------- ForumList -------------------------------------------------------*/

@media screen and (min-width: 280px) {

  .forumTitles {
    text-align: center;
  }

  .containerStatusForum {
    flex-direction: column;
  }

  .containerStatusForum .firstforum_section {
    margin-bottom: 0.5rem;
  }

  .containerStatusForum .secondForum_section {
    text-align: center;
    margin-bottom: 0.5rem;
  }

  .iconContent {
    justify-content: center;
  }

  .answerContent .answerList .answerTop .ansCount {
    width: 100%;
    text-align: center;
  }
  
  .answerContent .answerList .answerTop .titleAnswer {
    width: 100%;
    text-align: center;
  }
  
  .answerContent .answerList .answerTop .iconAnsContent {
    width: 100%;
    text-align: center;
  }

  .answerContent .answerList .answerBot .infoAnswer {
    text-align: center;
  }

  .forumInfo .forumInfoFirst .forumInfoBase {
    flex-direction: column;
  }
}

@media screen and (min-width: 420px) {


}

@media screen and (min-width: 768px) {
  
  .forumTitles {
    text-align: start;
  }

  .containerStatusForum {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .containerStatusForum .firstforum_section {
    width: 10%;
    margin-bottom: 0;
  }

  .containerStatusForum .secondForum_section {
    text-align: start;
    width: 90%;
    margin-bottom: 0;
  }
  
  .containerStatusForum .iconContainer {
    width: 100%;
    margin-top: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    border-top: 1px solid #0000004d;
  }

  .iconContent {
    justify-content: center;
  }

  .answerContent .answerList .answerTop .ansCount {
    width: 10%;
    text-align: center;
  }
  
  .answerContent .answerList .answerTop .titleAnswer {
    width: 85%;
    text-align: start;
  }
  
  .answerContent .answerList .answerTop .iconAnsContent {
    width: 5%;
    text-align: center;
  }

  .answerContent .answerList .answerBot .boxClock {
    width: 50%;
  }

  .answerContent .answerList .answerBot .infoAnswer {
    text-align: start;
    width: 50%;
  }
  
  .answerContent .answerList .answerBot .awnserIcons {
    width: 100%;
  }

  .iconAnswerBox {
    justify-content: center;
  }

  .forumInfo .forumInfoFirst .forumInfoBase {
    flex-direction: row;
  }

  .forumInfo .forumInfoFirst .forumInfoBase .forumInfoInfo {
    width: calc(100%/3);
  }
}


@media screen and (min-width: 1200px) {
  .containerStatusForum .firstforum_section {
    width: 5%;
  }

  .containerStatusForum .secondForum_section {
    width: 95%;
  }
  
  .containerStatusForum .iconContainer {
    width: 100%;
    margin-top: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0;
    border-top: 1px solid #0000004d;
  }

  .answerContent .answerList .answerBot .boxClock {
    width: 10%;
  }

  .answerContent .answerList .answerBot .infoAnswer {
    width: 90%;
  }
  
  .answerContent .answerList .answerBot .awnserIcons {
    width: 100%;
    margin-top: 1rem;
  }

  .answerContent .answerList .answerBot .awnserIcons .container {
    width: 100%;
    padding-top: 0.5rem;
    border-top: 1px solid #0000004d;
  }

  .iconAnswerBox {
    justify-content: center;
  }


}

@media screen and (min-width: 1800px) {

  .answerContent .answerList .answerBot .boxClock {
    width: 10%;
  }

  .answerContent .answerList .answerBot .infoAnswer {
    width: 90%;
  }
  
  .answerContent .answerList .answerBot .awnserIcons {
    width: 100%;
  }
}

/*------------------------------------------------- BasesList -------------------------------------------------------*/

@media screen and (min-width: 280px) {
  .basesContent .baseForum .baseBox .basesTitles {
    flex-direction: column;
  }

  .basesContent .baseForum .baseBox .basesTitles .basetitle1 {
    text-align: center;
    border-left: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
  }
  
  .basesContent .baseForum .baseBox .basesTitles .basetitle2 {
    text-align: center;
    border-left: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
  }
  
  .basesContent .baseForum .baseBox .basesTitles .basetitle3 {
    text-align: center;
    border-left: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
  }

  .basesContent .baseForum .baseBox .basesDocument {
    flex-direction: column;
  }

  .basesContent .baseForum .baseBox .basesDocument .baseNum {
    width: 100%;
    border-bottom: 1px solid #0000004d;
    border-left: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
  }

  .basesContent .baseForum .baseBox .basesDocument .baseText {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #0000004d;
    border-left: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
  }

  .basesContent .baseForum .baseBox .basesDocument .basesDown {
    width: 100%;
    border-left: 1px solid #0000004d;
    border-right: 1px solid #0000004d;
  }

  .basesContent .baseForum .baseBox .basesDocument2 {
    flex-direction: column;
  }

  .basesContent .baseForum .baseBox .basesDocument2 .secondPart3{
    text-align: center;
  }

  .basesContent .baseForum .baseBox .basesSecondBox {
    flex-direction: column;	
  }

  .basesSecondBox .basesSecondInput {
    margin: 0.5rem;
  }

  .basesSecondBox .basesSecondS {
    margin: 0.5rem;
  }

  .basesSecondBox .basesThre {
    flex-direction: column;
    width: 100%;
  }

  .basesSecondBox .basesThre .basesThre1{
    text-align: center;
    margin: 0.5rem;
    width: 100%;
  }

  .basesSecondBox .basesThre .basesThre2 {
    flex-direction: column;
    width: 100%;
  }

  .basesSecondBox .basesThre .basesThre2 p {
    margin: 0.5rem;
  }

  .basesBotBox .basebotBor {
    flex-direction: column;
  }

  .basesBotBox .basebotBor .baseBotInput{
    margin: 0.5rem;
    width: 100%;
  }

  .basesBotBox .basebotBor .basebotCount {
    margin: 0.5rem;
    width: 100%;
  }

  .basesBotBox .basebotBor .basebotdata {
    width: 100%;
  }

  .basesBotBox .basebotBor .basebotdata .basebotdata1 {
    text-align: center;
  }

  .basesBotBox .basebotBor .basebotdata .basebotdata2 p {
    margin: 0.5rem;
    text-align: center;
  }

  .basesBotBox .basebotBor .basebotFile {
    width: 100%;
  }

}


@media screen and (min-width: 768px) {
  .basesContent .baseForum .baseBox .basesTitles {
    flex-direction: row;
  }

  .basesContent .baseForum .baseBox .basesTitles .basetitle1 {
    width: 10%;
    border-right: none;

  }
  
  .basesContent .baseForum .baseBox .basesTitles .basetitle2 {
    width: 70%;
    text-align: start;
    border-left: none;
    border-right: none;

  }
  
  .basesContent .baseForum .baseBox .basesTitles .basetitle3 {
    width: 20%;
    border-left: none;

  }

  .basesContent .baseForum .baseBox .basesDocument {
    flex-direction: row;
  }

  .basesContent .baseForum .baseBox .basesDocument .baseNum {
    width: 10%;
    border-bottom: none;
    border-right: none;
  }

  .basesContent .baseForum .baseBox .basesDocument .baseText {
    width: 70%;
    text-align: start;
    border-bottom: none;
    border-left: none;
    border-right: none;
  }

  .basesContent .baseForum .baseBox .basesDocument .basesDown {
    width: 20%;
    border-left: none;
  }

  .basesContent .baseForum .baseBox .basesDocument2 {
    flex-direction: row;
  }

  .basesContent .baseForum .baseBox .basesDocument2 .secondPart3{
    text-align: start;
  }

  .basesContent .baseForum .baseBox .basesSecondBox {
    flex-direction: row;	
  }

  .basesSecondBox .basesSecondInput {
    width: 10%;
    margin: 0;
  }

  .basesSecondBox .basesSecondS {
    width: 10%;
    margin: 0;
  }

  .basesSecondBox .basesThre {
    flex-direction: row;
    align-items: center;
    width: 60%;
  }

  .basesSecondBox .basesThre .basesThre1{
    text-align: start;
    margin: 0;
    width: 20%;
  }

  .basesSecondBox .basesThre .basesThre2 {
    flex-direction: row;
    width: 80%;
  }

  .basesSecondBox .basesThre .basesThre2 p {
    flex-direction: row;
    width: calc(100% /3);
    margin: 0;
  }

  .basesSecondBox .basesDownSecond {
    width: 20%;
  }

  .basesBotBox .basebotBor {
    flex-direction: row;
  }

  .basesBotBox .basebotBor .baseBotInput{
    margin: 0;
    width: 10%;
  }

  .basesBotBox .basebotBor .basebotCount {
    margin: 0;
    width: 10%;
  }

  .basesBotBox .basebotBor .basebotdata {
    width: 60%;
  }

  .basesBotBox .basebotBor .basebotdata .basebotdata1 {
    text-align: start;
  }

  .basesBotBox .basebotBor .basebotdata .basebotdata2 p {
    text-align: start;
  }


  .basesBotBox .basebotBor .basebotFile {
    width: 20%;
  }
}


@media screen and (min-width: 1200px) {

}

@media screen and (min-width: 1800px) {

}

/*---------------------------------------------- ExternalContainer -----------------------------------------------------*/

@media screen and (min-width: 280px) {

  
}

@media screen and (min-width: 768px) {

  .externalContainer .externalContentTop {
    height: 9%;
  }

  .externalContainer .externalContentMid {
    height: 80%;
  }

  .externalContainer .externalContentBot {
    height: 4%;
  }

}

@media screen and (min-width: 1200px) {


}

@media screen and (min-width: 1800px) {

  .externalContainer .externalContentTop {
    height: 7%;
  }

  .externalContainer .externalContentMid {
    height: 82%;
  }

  .externalContainer .externalContentBot {
    height: 3%;
  }

}

/*-------------------------------------------------- Graficas -------------------------------------------------------*/

@media screen and (min-width: 1200px) {
  .highClass {
    height: 22rem;
  }
}

/* -------------------------------------------------  Home  -------------------------------------------------------*/

@media screen and (min-width: 280px) {
  .firstHomeSection .subSectionHome .homeSquare{
    flex-direction: column;
    height: 200px;
    margin: 0.5rem 1rem;
    width: 98%;
  }

  .firstHomeSection .subSectionHome .homeSquareBig{
    flex-direction: column;
    height: 200px;
    margin: 0.5rem 1rem;
    width: 98%;
  }

  .firstHomeSection .subSectionHome .homeSquareBigG{
    flex-direction: column;
    height: 200px;
    margin: 0.5rem 1rem;
    width: 98%;
  }

  .middleLine {
    height: 2px;
    width: 80%;
  }

  .homeButtons {
    text-align: center;
  }



  .logoContentParent .logoContent {
    /*background-size: 50%;*/
    background-size: contain;
  }

  .descripHome {
    margin-bottom: 5px;
  }

  .descripHome .iconsHome {
    font-size: 40px;
    margin-bottom: 5px;
  }

  .homeSquareBig .descripHome .iconsHome,
  .homeSquareBigG .descripHome .iconsHome {
    font-size: 40px;
    margin-bottom: 5px;
  }

}

@media screen and (min-width: 768px) {

  .firstHomeSection .subSectionHome .homeSquare{
    flex-direction: row;
    height: 150px;
    margin: 0.5rem 1rem;
    width: 45%;
  }

  .firstHomeSection .subSectionHome .homeSquareBig{
    flex-direction: row;
    height: 150px;
    margin: 0.5rem 1rem;
    width: 95%;
  }

  
  .firstHomeSection .subSectionHome .homeSquareBigG{
    flex-direction: row;
    height: 150px;
    margin: 0.5rem 1rem;
    width: 95%;
  }

  .descripHome .iconsHome {
    margin-bottom: 0;
    font-size: 30px;
  }

  .homeSquareBig .descripHome .iconsHome,
  .homeSquareBigG .descripHome .iconsHome {
    margin-bottom: 0;
    font-size: 40px;
  }

  .descripHome {
    margin-right: 5px;
    margin-bottom: 0;
  }

  .middleLine {
    height: 100%;
    width: 2px;
  }

  .homeButtons {
    margin-left: 10px;
    text-align: start;
  }

  .logoContentParent .logoContent {
    /*background-size: 25%;*/
    background-size: contain;

  }

}

@media screen and (min-width: 1200px) {
  .firstHomeSection {
    height: 90%;
  }

  .firstHomeSection .subSectionHome .homeSquare{
    height: 100px;
    margin: 0.5rem 1rem;
    width: 30%;
  }

  .firstHomeSection .subSectionHome .homeSquareBig{
    height: 110px;
    margin: 0.5rem 1rem;
    width:45%;
  }

  .firstHomeSection .subSectionHome .homeSquareBigG{
    height: 155px;
    margin: 0.5rem 1rem;
    width:45%;
  }

  .descripHome .iconsHome {
    font-size: 30px;
  }

  .homeSquareBig .descripHome .iconsHome,
  .homeSquareBigG .descripHome .iconsHome {
    font-size: 50px;
  }
}

@media screen and (min-width: 1800px) {
  .firstHomeSection {
    height: 80%;
  }

  .firstHomeSection .subSectionHome .homeSquare{
    height: 110px;
    margin: 1rem;
  }

  .firstHomeSection .subSectionHome .homeSquareBig,
  .firstHomeSection .subSectionHome .homeSquareBigG {
    height: 140px;
    margin: 1rem;
  }

  .descripHome .iconsHome {
    font-size: 50px;
  }

  .homeSquareBig .descripHome .iconsHome,
  .homeSquareBigG .descripHome .iconsHome {
    font-size: 70px;
  }

}


/* ------------------------------- Seccion de alerta (Mensaje de espera )------------------------------------------*/

@media screen and (min-width: 280px) {
  .timeBoxSect {
    width: 13rem;
    height: 12rem;
    top: 14rem;
    right: 2rem;
  }

  .timeBoxSect_child .iconBoxSect{
    font-size: 3rem;
  }

}

@media screen and (min-width: 768px) {
  .timeBoxSect {
    width: 16rem;
    height: 16rem;
    top: 28rem;
    right: 18rem;
  }

  .timeBoxSect_child .iconBoxSect{
    font-size: 3rem;
  }

  
  .timeBoxSect_child .parrafTimeBox{
    font-size: 1.2rem;
    margin-top: 1rem;
  }

  .timeBoxSect_child .parrafTimeBox2{
    font-size: 1rem;
    margin-top: 0.5rem;
  }
}


@media screen and (min-width: 1200px) {
  .timeBoxSect {
    width: 18rem;
    height: 18rem;
    top: 12rem;
    right: 35rem;
  }

  .timeBoxSect_child .iconBoxSect{
    font-size: 4rem;
  }

  .timeBoxSect_child .parrafTimeBox{
    font-size: 1.2rem;
    margin-top: 1rem;
  }

  .timeBoxSect_child .parrafTimeBox2{
    font-size: 1rem;
    margin-top: 0.5rem;
  }
}


@media screen and (min-width: 1800px) {
  .timeBoxSect {
    width: 20rem;
    height: 20rem;
    top: 20rem;
    right: 50rem;
  }

  .timeBoxSect_child .iconBoxSect{
    font-size: 5rem;
  }

  
  .timeBoxSect_child .parrafTimeBox{
    font-size: 1.5rem;
    margin-top: 1rem;
  }

  .timeBoxSect_child .parrafTimeBox2{
    font-size: 1.2rem;
    margin-top: 0.5rem;
  }
}


/*--------------------------- Seccion Nueva Gobierno Auction List -----------------------*/

@media screen and (min-width: 280px) {

  .gobSection1 {
    padding: 0 1rem 0 1rem;
  }

  .gobSection1 .auctionGob1 .generalPart .generalPartChild {
    width: 100%;
  }
  
  .gobSection1 .auctionGob1 .generalPart .generalPartChild .sectionPGob{
    text-align: center;
  }

  
  .gobSection1 .auctionGob1 .contentGob .topSectionGob {
    flex-direction: column;
  }

  .topSectionGob .topGobName {
    text-align: center;
  }

  .gobSection1 .auctionGob1 .topBodyGob {
    flex-direction: column;
  }

  .topBodyGob .bodyGob1{
    text-align: center;
  }

  .topBodyGob .bodyGobStatus {
    text-align: center;
  }

  .topSectionGob .typeGob {
    flex-direction: column;
  }

  .topSectionGob .typeGob .topGobPrice_Part,
  .topSectionGob .typeGob .topGobPrice {
    flex-direction: column;
    align-items: center;
  }

  .topSectionGob .typeGob .bodyGobType {
    text-align: center;
  }

  .topSectionGob .typeGob .topGobPrice .incrementButton {
    margin-top: 1rem;
  }

  .contentGob .botBodyGob {
    flex-direction: column;
  }

}

@media screen and (min-width: 768px) {

  .gobSection1 {
    padding: 0 1rem 0 2rem;
  }

  .gobSection1 .auctionGob1 .generalPart .generalPartChild {
    flex-grow: 1;
    width: unset;
  }
  
  .gobSection1 .auctionGob1 .generalPart .generalPartChild .sectionPGob{
    text-align: center;
  }

  .gobSection1 .auctionGob1 .contentGob .topSectionGob {
    flex-direction: row;
  }

  .topSectionGob .topGobName {
    text-align: start;
    width: 60%;
    border-right: 1px solid #b8b8b8;
  }

  .topSectionGob .typeGob {
    flex-direction: column;
    width: 40%;
  }

  .topSectionGob .typeGob .bodyGobType {
    text-align: start;
    border-top: 1px solid #b8b8b8;
  }

  .topSectionGob .typeGob .topGobPrice_Part,
  .topSectionGob .typeGob .topGobPrice {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
  }

  .topSectionGob .typeGob .topGobPrice .incrementButton {
    margin-top: 0;
  }

  .gobSection1 .auctionGob1 .topBodyGob {
    flex-direction: row;
    border-top: 1px solid #b8b8b8;
  }

  .topBodyGob .bodyGob1 {
    text-align: start;
    width: 60%;
    border-right: 1px solid #b8b8b8;
  }

  .topBodyGob .bodyGobStatus {
    width: 40%;
    text-align: start;
  }

  .contentGob .botBodyGob {
    flex-direction: row;
  }

}

@media screen and (min-width: 1200px) {

  .gobSection1 .auctionGob1 .generalPart .generalPartChild {
    flex-grow: 1;
  }
  
  .gobSection1 .auctionGob1 .generalPart .generalPartChild .sectionPGob{
    text-align: center;
  }

  .topSectionGob .topGobName {
    width: 60%;
  }

  .topSectionGob .typeGob {
    flex-direction: row;
    width: 40%;
  }

  .topSectionGob .typeGob .topGobPrice_Part,
  .topSectionGob .typeGob .topGobPrice,
  .topSectionGob .typeGob .bodyGobType {
    width: 50%;
  }

  .topSectionGob .typeGob .bodyGobType {
    border-top: none;
  }

  .topSectionGob .typeGob .topGobPrice_Part,
  .topSectionGob .typeGob .topGobPrice {
    border-right: 1px solid #b8b8b8;
    justify-content: space-between;
    align-items: flex-start;
  }

  .gobSection1 .auctionGob1 .topBodyGob {
    border-top: 1px solid #b8b8b8;
  }

  .topBodyGob .bodyGob1 {
    width: 60%;
    border-right: 1px solid #b8b8b8;
  }

  .topBodyGob .bodyGobStatus {
    width: 40%;
  }

  .contentGob .botBodyGob .botBodyFSection {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    width: 80%;
  }

  .contentGob .botBodyGob .botBodyFSection .botBodyTitle {
    border-bottom: 1px solid #b8b8b8;
  }

  .contentGob .botBodyGob .botBodyFSection .botBodyInfo {
    display: flex;
    min-height: 18rem;
  }

  .contentGob .botBodyGob .botBodyFSection .botBodyInfo .botBodyDocuments{
    width: 30%;
    border-right: 1px solid #b8b8b8;
  }

  .contentGob .botBodyGob .botBodyFSection .botBodyInfo .botBodyDates{
    width: 70%;
  }

  .botBodyDates .botDatesGob,
  .botBodyDates .botDocumentsBob {
    width: 100%;
    height: 100%;
    padding: 0.5rem;
  }

  .contentGob .botBodyGob .botBodyOptions{
    flex-direction: column;
    width: 20%;
    border-left: 1px solid #b8b8b8;
  }

  .contentGob .botBodyGob .botBodyOptions .optionTitleGob {
    padding: 0.5rem;
    border-bottom: 1px solid #b8b8b8;
  }

  .contentGob .botBodyGob .botBodyOptions .botBodyOptions_chld .iconsGobs .iconsGobsCh {
    margin: 0.5rem;
  }

  .contentGob .botBodyGob .botBodyOptions .botBodyOptions_chld .iconsGobs p {
    text-align: start;
  }

}

/* --------------------------------------- Nueva Seccion 2 ----------------------------------------------*/

@media screen and (min-width: 280px) {

  .topBodySection {
    flex-direction: column;
  }

  .topBodySection .topInfoTitle {
    text-align: center;
    border-bottom: 1px solid #b8b8b8;
  }

  .topBodySection .topPriceGob {
    flex-direction: column;
    text-align: center;
    border-bottom: 1px solid #b8b8b8;
  }

  .topBodySection .topTypeGob {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #b8b8b8;
  }

  .topBodySecond .topBodyCh {
    text-align: center;
    border-bottom:  1px solid #b8b8b8;
  }

  .topBodySecond .topStatusBody {
    text-align: center;
  }

  .topBodyPartCh {
    flex-direction: column;
  }

  .topBodyPartInfo .topBodyPartDetails {
    width: 100%;
    text-align: center;
    padding: 0.5rem;
    border-top: 1px solid #b8b8b8;
    border-bottom: 1px solid #b8b8b8;
  }

  .topBodyPartInfo .topBodyPartPrice {
    flex-direction: column;
  }

  .topBodyPartInfo .topBodyPartPrice .topBodyStatus {
    text-align: center;
    border-top: 1px solid #b8b8b8;
  }

  .topBodyPartInfo .topBodyPartPrice .topBodyStatus p {
    width: 100%;
  }

  .topBodyPartInfo .topBodyPartPrice .topbodyPrice {
    flex-direction: column;
    text-align: center;
  }

  .botBodyGobN {
    flex-direction: column;
  }

  .botBodyGobN .botBodyPart_1 {
    flex-direction: column;
  }

  .botBodyGobN .botBodyPart_1 .botBodyTitle{
    border-bottom: 1px solid #b8b8b8;
    text-align: center;
  }

  .botBodyGobN .botBodyPart_1 .BotfirstInfo {
    flex-direction: column;
  }

  .botBodyGobN .botBodyPart_1 .BotfirstInfo .botFirstDetails {
    border-top: 1px solid #b8b8b8;
  }
  
  .botFirstOptions .ButtonBodyGob {
    flex-direction: column;
  }

  .botBodyGobN .botBodyPart_2 {
    border-top: 1px solid #b8b8b8;
    flex-direction: column;
    width: 100%;
  }

  .botBodyGobN .botBodyPart_2 .optionTitleGob {
    text-align: center;
    border-bottom: 1px solid #b8b8b8;
  }

  .botSecondInfo .iconsGobs{
    flex-direction: column;
    text-align: center;
    width: 100%;
    padding: 0.5rem;
  }

  .BoxDateGobF .BoxDateGobC {
    width: 10rem;
    min-height: 8rem;
  }

  .BoxDateGobF .BoxDateGobC .docsDownTitle {
    justify-content: center;
    align-items: center;
    min-height: 1.8rem;
  }

  .BoxDateGobF .BoxDateGobC .topBoxPanelGob {
    min-height: 3rem;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .panelIconGob {
    width: 30%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .panelIconGob .iconPanelGob{
    font-size: 2rem;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .dateSection {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .BoxDateGobF .BoxDateGobC .topBoxPanelGob .panelIconGob {
    right: 65px;
    bottom: 5px;
  }

  .botFirstDetails .InfoColorsGob {
    flex-direction: column;
    margin-top: 1rem;
  }

  .botFirstDetails .InfoColorsGob .infoIconGob {
    width: 100%;
    text-align: center;
  }

  .botFirstDetails .InfoColorsGob .InfoColorsGobLine {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }

  .InfoColorsGobLine .colorsGobs {
    flex-direction: column;
    align-items: center;
    margin-top: 1rem;
  }

  
  /** ------------------------------ Clases Para Activar ----------------------- **/

  /* -------------------- Se Cierra Panel Izquierdo --------------------- */

  .botFOpt1 {
    width: 100% !important;
  }

  .botFDet1 {
    width: 100% !important;
  }

  .iconsActive1 {
    justify-content: center !important;
  }


  /* ---------------------- Se Cierra Panel Derecho ----------------------- */

  .bodyP1 {
    width: 100% !important;
  }

  .bodyP2 {
    width: 100% !important;
  }

  .botFOpt2 {
    width: 100% !important;
  }

  .botFDet2 {
    width: 100% !important;
  }

  .iconsActive2 {
    justify-content: center !important;
  }

  /* ----------------------- Ambos Paneles Cerrados ------------------------- */
  .bodyP3 {
    width: 100% !important;
  }

  .bodyP4 {
    width: 100% !important;
  }

  .botFOpt3 {
    width: 100% !important;
  }

  .botFDet3 {
    width: 100% !important;
  }

  .leftActiveOpt {
    justify-content: center !important;
  }

  .rightActiveOpt {
    justify-content: center !important;
  }

  /** ----------------------------- Clases Para Activar --------------------- **/

}

@media screen and (min-width: 768px) {

  .topBodySection {
    flex-direction: row;
  }

  .topBodySection .topInfoTitle {
    text-align: start;
    width: 100%;
    border-bottom: 1px solid #b8b8b8;
  }

  .topBodySection .topPriceGob {
    width: 50%;
    text-align: start;
    flex-direction: row;
    border-right: 1px solid #b8b8b8;
    border-bottom: unset;
  }

  .topBodySection .topTypeGob {
    width: 50%;
    text-align: start;
    border-bottom: unset;
  }

  .topBodySecond .topBodyCh {
    text-align: start;
    border-bottom: unset;
  }

  .topBodySecond {
    flex-direction: column;
    border-top: 1px solid #b8b8b8;
  }

  .topBodySecond .topStatusBody {
    text-align: start;
    border-top: 1px solid #b8b8b8;
  }

  .topBodyPartCh {
    flex-direction: row;
  }

  .topBodyPartInfo {
    flex-direction: column;
  }

  .topBodyPartInfo .topBodyPartPrice {
    flex-direction: row;
    border-top: 1px solid #b8b8b8;
  }

  .topBodyPartInfo .topBodyPartPrice .topbodyPrice {
    width: 50%;
    border-right: 1px solid #b8b8b8;
  }

  .topBodyPartInfo .topBodyPartPrice .topbodyPrice .topBodyPriceCh1,
  .topBodyPartInfo .topBodyPartPrice .topbodyPrice .topBodyPriceCh2 {
    width: 50%;
    padding: 0.5rem;
  }

  .topBodyPartInfo .topBodyPartPrice .topbodyPrice .topBodyPriceCh1 {
    border-right: 1px solid #b8b8b8;
  }

  .topBodyPartInfo .topBodyPartPrice .topBodyStatus {
    border-top: unset;
    text-align: start;
    width: 50%;
  }

  .topBodyPartInfo .topBodyPartPrice .topbodyPrice {
    flex-direction: row;
    text-align: start;
  }

  .topBodyPartInfo .topBodyPartPrice .topBodyStatus p {
    width: unset;
  }

  .topBodyPartInfo .topBodyPartPrice .topBodyStatus p:last-child{
    margin-left: 0.5rem;
  }

  .topBodyPartInfo .topBodyPartDetails {
    width: unset;
    text-align: start;
    padding: 0.5rem;
    border-top: 1px solid #b8b8b8;
    border-bottom: unset;
  }

  .botBodyGobN {
    flex-direction: column;
  }

  .botBodyGobN .botBodyPart_1 {
    flex-direction: column;
  }

  .botBodyGobN .botBodyPart_1 .botBodyTitle{
    border-bottom: 1px solid #b8b8b8;
    text-align: start;
  }
  
  .botBodyGobN .botBodyPart_1 .BotfirstInfo {
    flex-direction: row;
    min-height: 20rem;
    width: 100%;
  }

  .botBodyGobN .botBodyPart_1 .BotfirstInfo .botFirstOptions {
    width: 25%;
    border-right: 1px solid #b8b8b8;
  }

  .botFirstOptions .ButtonBodyGob {
    flex-direction: row;
  }

  .botBodyGobN .botBodyPart_1 .BotfirstInfo .botFirstDetails {
    width: 75%;
    border-top: unset;
  }

  .botBodyGobN .botBodyPart_2 {
    border-top: 1px solid #b8b8b8;
    flex-direction: column;
    width: 100%;
  }

  .botBodyGobN .botBodyPart_2 .optionTitleGob {
    text-align: start;
    border-bottom: 1px solid #b8b8b8;
  }

  .botSecondInfo .iconsGobs{
    flex-direction: column;
    justify-content: center;
    text-align: start;
    width: 33%;
    padding: unset;
  }

  .BoxDateGobF .BoxDateGobC {
    width: 15rem;
    min-height: 6rem;
  }

  .BoxDateGobF .BoxDateGobC .topBoxPanelGob {
    justify-content: center;
    align-items: center;
    min-height: 1.8rem;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .panelIconGob {
    width: 30%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .panelIconGob .iconPanelGob{
    font-size: 2rem;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .dateSection {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .BoxDateGobF .BoxDateGobC .topBoxPanelGob .panelIconGob {
    position: absolute;
    right: 20px;
    top: 2px;
    bottom:unset;
  }

  .BoxDateGobF .BoxDateGobC .docsDownTitle {
    justify-content: center;
    align-items: center;
    min-height: 1.8rem;
  }
  
  .botFirstDetails .InfoColorsGob {
    flex-direction: row;
    margin-top: 0;
  }

  .botFirstDetails .InfoColorsGob .infoIconGob {
    width: 5%;
    text-align: start;
  }

  .botFirstDetails .InfoColorsGob .InfoColorsGobLine {
    flex-direction: row;
    width: 95%;
    justify-content: space-evenly;
    align-items: unset;
  }

  .InfoColorsGobLine .colorsGobs {
    flex-direction: row;
    align-items: center;
    margin-top: 0;
  }

  .InfoColorsGobLine .colorsGobs .toStartGob,
  .InfoColorsGobLine .colorsGobs .startedGob,
  .InfoColorsGobLine .colorsGobs .finishedGob {
    margin-right: 0.5rem;
  }

  /** ------------------------------ Clases Para Activar ----------------------- **/

  /* -------------------- Se Cierra Panel Izquierdo --------------------- */

  .botFOpt1 {
    width: 10% !important;
  }

  .botFDet1 {
    width: 90% !important;
  }

  .iconsActive1 {
    justify-content: center !important;
  }
  
  
  /* ---------------------- Se Cierra Panel Derecho ----------------------- */

  .bodyP1 {
    width: 100% !important;
  }

  .bodyP2 {
    width: 100% !important;
  }

  .botFOpt2 {
    width: 25% !important;
  }

  .botFDet2 {
    width: 75% !important;
  }

  .iconsActive2 {
    justify-content: center !important;
  }

  /* ----------------------- Ambos Paneles Cerrados ------------------------- */
  .bodyP3 {
    width: 100% !important;
  }

  .bodyP4 {
    width: 100% !important;
  }

  .botFOpt3 {
    width: 10% !important;
  }

  .botFDet3 {
    width: 90% !important;
  }

  .leftActiveOpt {
    justify-content: center !important;
  }

  .rightActiveOpt {
    justify-content: center !important;
  }

  /** ----------------------------- Clases Para Activar --------------------- **/

}


@media screen and (min-width: 1200px) {


  .topBodySection .topInfoTitle {
    text-align: start;
    width: 60%;
    border-right: 1px solid #b8b8b8;
    border-bottom: unset;
  }
  
  .topBodySection .topPriceGob {
    width: 20%;
    border-right: 1px solid #b8b8b8;
  }
  
  .topBodySection .topTypeGob {
    width: 20%;
  }

  .topBodySection .topPriceGob {
    justify-content: space-between;
  }

  .topBodySecond {
    flex-direction: row;
    border-top: 1px solid #b8b8b8;
  }

  .topBodySecond .topBodyCh {
    border-right: 1px solid #b8b8b8;
    width: 60%;
  }

  .topBodySecond .topStatusBody {
    border-top: unset;
    width: 40%;
  }

  .topBodyPartInfo {
    flex-direction: row;
    border-top: 1px solid #b8b8b8;
  }

  .topBodyPartInfo .topBodyPartDetails {
    width: 60%;
    padding: 0.5rem;
    border-right: 1px solid #b8b8b8;
    border-top: unset;
  }

  .topBodyPartInfo .topBodyPartPrice {
    border-top: unset;
    flex-direction: column;
    width: 40%;
  }

  .topBodyPartInfo .topBodyPartPrice .topbodyPrice {
    width: unset;
    border-right: unset;
  }

  .topBodyPartInfo .topBodyPartPrice .topbodyPrice .topBodyPriceCh1,
  .topBodyPartInfo .topBodyPartPrice .topbodyPrice .topBodyPriceCh2 {
    width: 50%;
    padding: 0.5rem;
  }

  .topBodyPartInfo .topBodyPartPrice .topbodyPrice .topBodyPriceCh1 {
    border-right: 1px solid #b8b8b8;
  }

  .topBodyPartInfo .topBodyPartPrice .topBodyStatus {
    width: unset;
    border-top: 1px solid #b8b8b8;
    flex-direction: row;
    align-items: center;
  }

  .topBodyPartInfo .topBodyPartPrice .topBodyStatus p:last-child{
    margin-left: 0.5rem;
  }

  .botBodyGobN {
    flex-direction: row;
    min-height: 26rem;
  }

  .botBodyGobN .botBodyPart_1 {
    flex-direction: column;
    width: 80%;
    border-right: 1px solid #b8b8b8;
  }

  .botBodyGobN .botBodyPart_1 .botBodyTitle{
    border-bottom: unset;
  }

  .botBodyGobN .botBodyPart_1 .BotfirstInfo {
    width: unset;
    flex-direction: row;
    border-top: 1px solid #b8b8b8;
    height: 100%;
    min-height: unset;
  }

  .botBodyGobN .botBodyPart_1 .BotfirstInfo .botFirstOptions {
    width: 25%;
    border-right: 1px solid #b8b8b8;
  }

  .botBodyGobN .botBodyPart_1 .BotfirstInfo .botFirstDetails {
    width: 75%;
  }

  .botBodyGobN .botBodyPart_2 {
    border-top: unset;
    flex-direction: column;
    width: 20%;
  }

  .botBodyGobN .botBodyPart_2 .optionTitleGob {
    border-bottom: 1px solid #b8b8b8;
  }

  .botSecondInfo .iconsGobs{
    flex-direction: row;
    justify-content: unset;
    width: 100%;
  }
  
  .botSecondInfo .iconsGobs .iconsGobsCh {
    margin: 0.5rem;
  }

  .botSecondInfo .iconsGobs p {
    text-align: start;
  }

  .botFirstDetails .sectionInfoGob {
    height: 100%;
    width: 100%;
  }

  .botFirstDetails .InfoColorsGob {
    height: 10%;
    width: 100%;
  }

  .botFirstDetails .InfoColorsGob .infoIconGob {
    width: 5%;
  }

  .botFirstDetails .InfoColorsGob .InfoColorsGobLine {
    width: 95%;
    justify-content: space-evenly;
  }

  .InfoColorsGobLine .colorsGobs {
    flex-direction: row;
    align-items: center;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .panelIconGob {
    width: 30%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .panelIconGob .iconPanelGob{
    font-size: 2rem;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .dateSection {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }


  /** ------------------------------ Clases Para Activar ----------------------- **/

  /* -------------------- Se Cierra Panel Izquierdo --------------------- */

  .botFOpt1 {
    width: 6% !important;
  }

  .botFDet1 {
    width: 94% !important;
  }

  .iconsActive1 {
    justify-content: center !important;
  }


  /* ---------------------- Se Cierra Panel Derecho ----------------------- */

  .bodyP1 {
    width: 94% !important;
  }

  .bodyP2 {
    width: 6% !important;
  }

  .botFOpt2 {
    width: 21.3% !important;
  }

  .botFDet2 {
    width: 78.7% !important;
  }

  .iconsActive2 {
    justify-content: center !important;
  }

  /* ----------------------- Ambos Paneles Cerrados ------------------------- */
  .bodyP3 {
    width: 94% !important;
  }

  .bodyP4 {
    width: 6% !important;
  }

  .botFOpt3 {
    width: 5% !important;
  }

  .botFDet3 {
    width: 95% !important;
  }

  .leftActiveOpt {
    justify-content: center !important;
  }

  .rightActiveOpt {
    justify-content: center !important;
  }

  /** ----------------------------- Clases Para Activar --------------------- **/
}


@media screen and (min-width: 1800px) {

  .botFirstDetails .sectionInfoGob {
    height: 100%;
    width: 100%;
  }

  .botFirstDetails .InfoColorsGob {
    height: 10%;
    width: 100%;
  }

  .botFirstDetails .InfoColorsGob .infoIconGob {
    width: 10%;
  }

  .botFirstDetails .InfoColorsGob .InfoColorsGobLine {
    width: 90%;
    justify-content: space-evenly;
  }

  .InfoColorsGobLine .colorsGobs {
    flex-direction: row;
    align-items: center;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .panelIconGob {
    width: 30%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .panelIconGob .iconPanelGob{
    font-size: 2rem;
  }

  .BoxDateGobF .BoxDateGobC .botBoxPanelGob2 .dateSection {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }




  /** ------------------------------ Clases Para Activar ----------------------- **/
  /* -------------------- Se Cierra Panel Izquierdo --------------------- */

  .botFOpt1 {
    width: 6% !important;
  }

  .botFDet1 {
    width: 94% !important;
  }

  .iconsActive1 {
    justify-content: center !important;
  }

  /* ---------------------- Se Cierra Panel Derecho ----------------------- */

  .bodyP1 {
    width: 95% !important;
  }

  .bodyP2 {
    width: 5% !important;
  }

  .botFOpt2 {
    width: 21.05% !important;
  }

  .botFDet2 {
    width: 78.95% !important;
  }

  .iconsActive2 {
    justify-content: center !important;
  }


  /* ----------------------- Ambos Paneles Cerrados ------------------------- */
  .bodyP3 {
    width: 95% !important;
  }

  .bodyP4 {
    width: 5% !important;
  }

  .botFOpt3 {
    width: 5% !important;
  }

  .botFDet3 {
    width: 95% !important;
  }

  .leftActiveOpt {
    justify-content: center !important;
  }

  .rightActiveOpt {
    justify-content: center !important;
  }

  /** ----------------------------- Clases Para Activar --------------------- **/
}



@media screen and (min-width: 280px) {

  .sectionPartsGob .bodyPartGob .iterationPart{ 
    width: 100%;
    text-align: center;
  }

  .sectionPartsGob .bodyPartGob .namePartGob{ 
    width: 100%;
    text-align: center;
  }

  .sectionPartsGob .bodyPartGob .topbodyPricePart{ 
    width: 100%;
    text-align: center;
  }

  .sectionPartsGob .bodyPartGob .bodyStatusPart{ 
    width: 70%;
    text-align: center;
  }

  .sectionPartsGob .bodyPartGob .optionsPartGob{ 
    width: 100%;
  }

  .sectionPartsGob .bodyPartGob .optionsPartGob .iconsGobs { 
    width: 100%;
  }

}

@media screen and (min-width: 768px) {

  .sectionPartsGob .bodyPartGob .iterationPart{ 
    width: 30%;
    text-align: center;
  }

  .sectionPartsGob .bodyPartGob .namePartGob{ 
    width: 70%;
    text-align: start;
  }

  .sectionPartsGob .bodyPartGob .topbodyPricePart{ 
    width: 30%;
    text-align: center;
  }

  .sectionPartsGob .bodyPartGob .bodyStatusPart{ 
    width: 70%;
    text-align: start;
  }

  .sectionPartsGob .bodyPartGob .optionsPartGob{ 
    width: 100%;
  }

  .sectionPartsGob .bodyPartGob .optionsPartGob .iconsGobs { 
    width: 25%;
  }

}

@media screen and (min-width: 1200px) {
  .sectionPartsGob .bodyPartGob .iterationPart{ 
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20%;
  }

  .sectionPartsGob .bodyPartGob .namePartGob{ 
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-right: 1px solid #b8b8b8; ;
    width: 40%;
  }

  .sectionPartsGob .bodyPartGob .topbodyPricePart{ 
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 15%;
    text-align: start;
  }

  .sectionPartsGob .bodyPartGob .bodyStatusPart{ 
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 25%;
  }

  .sectionPartsGob .bodyPartGob .optionsPartGob{ 
    border-top: 1px solid #b8b8b8;;
    width: 100%;
  }

  .sectionPartsGob .bodyPartGob .optionsPartGob .iconsGobs { 
    width: 20%;
  }

}


/*------------------------------------------- Graficas Generales --------------------------------------------*/
@media screen and (min-width: 280px) {

  .detailSection .infoGraph {
    flex-direction: column;
  }

  .detailSection .infoGraph .projectGraph {
    flex-direction: column;
    text-align: center;
  }

  .detailSection .infoGraph .macroSection {
    flex-direction: column;
  }

  .graphics_Donuts_2 {
    height: 56rem;
  }

  .graphics_Donuts_2 .donutsGraphs {
    height: 50rem;
  }

  .graphics_Donuts_2 .donutsGraphs .donutP1,
  .graphics_Donuts_2 .donutsGraphs .donutP2 {
	  width: 100%;
	  height: 50%;
  }

  .infoGraphsD .infodivG .pb1 {
    width: 100%;
  }

  .graphics_Donuts_1 {
    height: 64rem;
  }

  .graphics_Donuts_1 .donut_G1,
  .graphics_Donuts_1 .donut_G2 {
    width: 100%;
    height: 48%;
  }

  .button_returnG_1 {
    flex-direction: column;
    align-items: center;
  }

  .button_returnG_1 .bt_1{
    margin-top: 1rem;
  }

  .donutsContent .donutsContent_child {
    width: 100%;
    height: 50%;
  }

  .infoDivG1 .infodivG2 {
    width: 100%;
  }

}

@media screen and (min-width: 768px) {

  .detailSection .infoGraph {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .detailSection .infoGraph .projectGraph {
    flex-direction: row;
    align-items: center;
    padding-left: 1.5rem;
    text-align: unset;
    width: 60%;
  }

  .detailSection .infoGraph .macroSection {
    flex-direction: row;
    justify-content: flex-end;
    padding-right: 1.5rem;
    width: 40%;
  }

  .detailSection .infoGraph .macroSection .macroSelection {
    margin-right: 1rem;
  }

  .graphics_Donuts_2 {
    height: 56rem;
  }

  .graphics_Donuts_2 .donutsGraphs {
    height: 50rem;
  }

  .graphics_Donuts_2 .donutsGraphs .donutP1,
  .graphics_Donuts_2 .donutsGraphs .donutP2 {
	  width: 100%;
	  height: 50%;
  }

  .graphics_Donuts_1 {
    height: 64rem;
  }

  .graphics_Donuts_1 .donut_G1,
  .graphics_Donuts_1 .donut_G2 {
    width: 100%;
    height: 48%;
  }

  .graphsSelects #typeSelection {
    width: 35%;
  }

  .graphsSelects #sobrType {
	  width: 42%;
  }

  .button_returnG_1 {
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }

  .button_returnG_1 .bt_1{
    margin-left:2rem;
    margin-top: unset;
  }

  .infoDivG1 .infodivG2 {
    width: 50%;
  }

}


@media screen and (min-width: 1200px) {

  .graphics_Donuts_2 {
    height: 30rem;
  }

  .graphics_Donuts_2 .donutsGraphs {
    height: 22rem;
  }

  .graphics_Donuts_2 .donutsGraphs .donutP1,
  .graphics_Donuts_2 .donutsGraphs .donutP2 {
	  width: 50%;
	  height: 100%;
  }


  .infoGraphsD .infodivG .pb1 {
    width: 49%;
  }

  .graphics_Donuts_1 {
    height: 30rem;
  }

  .graphics_Donuts_1 .donut_G1,
  .graphics_Donuts_1 .donut_G2 {
    width: 49%;
    height: 100%;
  }

  .infoGraphsD .infodivG {
    width: 85%;
  }

  .graphsSelects #typeSelection,
  .graphsSelects #sobrType {
	  width: 35%;
  }

  .donutsContent .donutsContent_child {
    width: 50%;
    height: 100%;
  }

  
  .infoDivG1 .infodivG2 {
    width: 62%;
  }

}


@media screen and (min-width: 1800px) {
  .infoGraphsD .infodivG {
    width: 75%;
  }

  .infoDivG1 .infodivG2 {
    width: 50%;
  }
}

/*------------------------------------------- Graficas Desviasion --------------------------------------------*/

@media screen and (min-width: 768px) {
  .costvstime_selection .selectionCost {
    flex-wrap: wrap;
  }

  .costvstime_selection .selectionCost .cardContract_1 {
    width: 50%;
  }
}

@media screen and (min-width: 1200px) { 
  .costvstime_selection .selectionCost {
    flex-wrap: unset;
  }

  .costvstime_selection .selectionCost .cardContract_1 {
    width: unset;
    margin-right: 1rem;
  }
}

/* ----------------------------------- Cuadro de graficas en wbsys ---------------------------------*/

@media screen and (min-width: 280px) {
  .graphsPanel {
    flex-direction: column;
  }
}

@media screen and (min-width: 768px) {
  .graphsPanel {
    flex-direction: row;
  }
}


/* --------------------------------- Grafica De Gantt -------------------------------------- */

@media screen and (min-width: 280px) {

  .filterGantt .pageGantt {
    width: 100%;
    justify-content: center;
  }

  .filterGantt .pageGantt .textPage {
    width: 100%;
    text-align: center;
    margin-bottom: 0.5rem;
  }

  .filterGantt .pageGantt .selectionG {
    width: 100%;
    margin-bottom: 0.5rem;
  }

  .filterGantt .foundGantt .typeGantt {
    width: 100%;
  }

  .filterGantt .foundGantt .typeGantt .textTypeG {
    width: 100%;
    text-align: center;
    margin-bottom: 0.5rem;
  }

  .filterGantt .foundGantt .typeGantt .fil_change {
    width: 100%;
    margin-bottom: 0.5rem;
  }

  .filterGantt .foundGantt .porcentGantt {
    width: 100%;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.5rem;
  }

  .filterGantt .clickGantt {
    justify-content: center;
    width: 100%;
    margin-bottom: 0.5rem;
  }

  .filterGantt .contrGantt {
    width: 100%;
    justify-content: center;
  }

  .contentColor .contentColorB .colorSection {
    flex-direction: column;
  }

  .contentColor .contentColorB .colorSection .colorBody {
    text-align: center;
    margin-bottom: 1rem;
  }

}

@media screen and (min-width: 768px) {
  .filterGantt .pageGantt {
    width: 100%;
    justify-content: flex-start;
  }

  .filterGantt .pageGantt .textPage {
    width: 15%;
    text-align: start;
    margin-bottom: 0.5;
  }

  .filterGantt .pageGantt .selectionG {
    width: 60%;
    margin-bottom: 0;
  }

  .filterGantt .foundGantt {
    width: 100%;
    margin-top: 1rem;
  }

  .filterGantt .foundGantt .typeGantt {
    width: 80%;
    margin-right: 1rem;
  }

  .filterGantt .foundGantt .typeGantt .textTypeG {
    width: 19%;
    text-align: start;
    margin-bottom: 0;
  }

  .filterGantt .foundGantt .typeGantt .fil_change {
    width: 75%;
    margin-bottom: 0;
  }

  .filterGantt .foundGantt .porcentGantt {
    width: 15%;
    margin-bottom: 0;
  }

  .filterGantt .clickGantt {
    justify-content: end;
    margin-top: 1rem;
    margin-right: 1rem;
    margin-bottom: 0;
    width: 39%;
  }

  .filterGantt .contrGantt {
    width: 50%;
    justify-content: flex-start;
    margin-top: 1rem;
  }

  .contentColor .contentColorB .colorSection {
    flex-direction: row;
    justify-content: space-evenly;
  }

  .contentColor .contentColorB .colorSection .colorBody {
    text-align: start;
    margin-bottom: 0;
  }

}

@media screen and (min-width: 1250px) {
  .filterGantt .pageGantt {
    justify-content: space-evenly;
    width: 35%;
  }

  .filterGantt .pageGantt .textPage {
    width: 20%;
  }

  .filterGantt .foundGantt {
    width: 40%;
    margin-top: 0;
  }

  .filterGantt .foundGantt .typeGantt {
    justify-content: space-evenly;
    width: 70%;
  }
  

  .filterGantt .foundGantt .typeGantt .fil_change {
    width: 70%;
  }

  /* .filterGantt .foundGantt .porcentGantt {
    width: 30%;
  } */

  .filterGantt .clickGantt {
    margin-top: 0;
    margin-right: 0;
    justify-content: flex-start;
    align-items: center;
    width: 7%;
  }

  .filterGantt .contrGantt {
    width: 18%;
    justify-content: flex-start;
    align-items: center;
    margin-top: 0;
  }
}


/* --------------------------------- Graficas de Contrato -------------------------------- */

@media screen and (min-width: 280px) {
  .projectContr {
    width: 100%;
    margin-bottom: 0.5rem;
  }

  .nameContr {
    width: 100%;
  }

  .contentGraphContr .contrGraphSection .contrBox .contrBox_child {
    width: 100%;
  }

  .contentGraphContr .contrGraphSection .contrBox .contrBox_child:first-child {
    margin-bottom: 0.5rem;
  }  

  .infoContr1 .infoContr1_child .infoC {
    text-align: center;
  }

  .infoContr1 .infoContr1_child .infoC p {
    width: 100%;
  }

  .contentGraphContr .contrGraphSection .bodyContrGraph2 .bodyCGr {
    width: 100%;
  }

  .contentGraphContr .contrGraphSection .contrBox .contrBox_child .sectionBoxC p {
    width: 100%;
    text-align: center;
  }

  .btnGantt {
    white-space: normal;
  }

  .selectionContrG .selectTypeGantt {
    width: 100%;
    margin-bottom: 0.5rem;
    justify-content: center;
  }

  .selectionContrG .selectTypeGantt p {
    width: 100%;
    text-align: center;
    margin-bottom: 0.5rem;
  }

  .selectionContrG .selectTypeGantt .fil_change {
    width: 100%;
    margin-bottom: 0.5rem;
  }

}

@media screen and (min-width: 768px) {

  .projectContr {
    width: 50%;
    padding: 0 1.5rem;
    margin-bottom: 0;
  }

  .nameContr {
    width: 50%;
  }

  .infoContr1 .infoContr1_child {
    width: 60%;
  }

  .contentGraphContr .contrGraphSection .contrBox .contrBox_child {
    width: 48%;
  }
  .contentGraphContr .contrGraphSection .contrBox .contrBox_child:first-child {
    margin-bottom: 0;
  }  

  .selectionContrG .selectTypeGantt {
    width: 70%;
    margin-bottom: 0;
    justify-content: unset;
  }

  .selectionContrG .selectTypeGantt p {
    width: unset;
    text-align: start;
    margin-bottom: 0;
  }

  .selectionContrG .selectTypeGantt .fil_change {
    margin-right: 2rem;
    margin-bottom: 0;
    width: 50%;
  }

  .infoContr1 .infoContr1_child .infoC {
    text-align: start;
  }

  .infoContr1 .infoContr1_child .infoC p {
    width: unset;
  }

  .contentGraphContr .contrGraphSection .bodyContrGraph2 .bodyCGr {
    width: 50%;
  }

  .contentGraphContr .contrGraphSection .contrBox .contrBox_child .sectionBoxC p {
    width: unset;
    text-align: start;
  }

  .btnGantt {
    white-space: nowrap;
  }

}

@media screen and (min-width: 1250px) {

  .infoContr1 .infoContr1_child {
    width: 35%;
  }

  .contentGraphContr .contrGraphSection .contrBox .contrBox_child {
    width: 35%;
  }

  .selectionContrG .selectTypeGantt {
    width: 35%;
  }

}

@media screen and (min-width: 1800px) {
  .infoContr1 .infoContr1_child {
    width: 30%;
  }

  .contentGraphContr .contrGraphSection .contrBox .contrBox_child {
    width: 30%;
  }
}

/* --------------------------------- Ejecutive Report ----------------------------------- */

@media screen and (min-width: 280px) {
  .ejecutive_infoSqua .ejecutive_sectionS {
    width: 100%;
  }

  .ejecutiveReport .ejecutive_sectionTitle .ejecutive_title {
    width: 100%;
  }

  .ejecutiveReport .ejecutive_sectionTitle .info_child {
    width: 100%;
  }

  .info_child .ejecutive_select {
    width: 100%;
  }

  .info_child .chanjeEjecutive {
    width: 100%;
  }

  .ejecutive_graphSectionRight .ejecutive_principalGraphsR {
    width: 100%;
  }

  .ejecutive_graphSectionRight .ejecutive_BaseSectionR {
    width: 100%;
  }

  .ejecutive_graphSectionRight .ejecutive_BaseSectionR .ejecutive_BaseSquareR {
    width: 100%;
  }

  .baseSquare_title {
    text-align: center;
  }

  .scrollTable {
    overflow-x: scroll;
  }

  .ejecutive_send {
    margin-bottom: 1rem;
  }

  .totalText_box1,
  .totalText_box2 {
    text-align: center;
  } 
  
  .totalText_box1  p {
    width: 100%;
  }

  .scrollOferts {
    overflow-x: scroll;
  }

  .ejecutive_secondInfo .second_squareInfo .second_squareSection {
    width: 100%;

  }

  .ejecutive_principalGraphs1  .principalGrap {
    width: 100%;
  }

  .baseSquare_title2 {
    width: 90%;
  }

  .baseSquare_title2 p {
    width: 100%;
  }

  .baseSquare_title2 .ejectutive_Neg {
    width: 100%;
  }
}


@media screen and (min-width: 768px) {
  .ejecutive_infoSqua .ejecutive_sectionS {
    width: 32%;
  }

  .ejecutive_BaseSection .ejecutive_BaseSquare2 {
    width: 80%;
  }

  .ejecutiveReport .ejecutive_sectionTitle .ejecutive_title {
    width: 70%;
  }

  .ejecutiveReport .ejecutive_sectionTitle .info_child {
    width: 30%;
  }

  .info_child .ejecutive_select {
    width: 100%;
  }

  .info_child .chanjeEjecutive {
    width: 100%;
  }

  .ejecutive_graphSectionRight .ejecutive_BaseSectionR {
    width: 100%;
    justify-content: center;
    padding: 1rem;
  }
  
  .ejecutive_graphSectionRight .ejecutive_BaseSectionR .ejecutive_BaseSquareR {
    width: 80%;
  }

  .ejecutive_graphSectionRight .ejecutive_principalGraphsR {
    width: 100%;
  }

  .baseSquare_title {
    text-align: center;
  }

  .scrollTable {
    overflow-x: scroll;
  }

  .ejecutive_send {
    margin-bottom: 0;
  }

  .totalText_box1,
  .totalText_box2 {
    text-align: start;
  } 

  .totalText_box1  p {
    width: unset;
  }

  .scrollOferts {
    overflow-x: scroll;
  }
  
  .ejecutive_secondInfo .second_squareInfo .second_squareSection {
    width: 32%;
    margin-right: 1%;
  }

  .ejecutive_principalGraphs1  .principalGrap {
    width: 50%;
  }

  .baseSquare_title2 {
    width: 100%;
  }

  .baseSquare_title2 p {
    width: unset;
  }

  .baseSquare_title2 .ejectutive_Neg {
    width: unset;
  }

}


@media screen and (min-width: 1250px) {
  .ejecutive_infoSqua .ejecutive_sectionS {
    width: 24%;
  }

  .ejecutive_moneyChange .moneyChage_section {
    width: 24%;
  }

  .ejecutive_BaseSection .ejecutive_BaseSquare2 {
    width: 45%;

  }

  .info_child .ejecutive_select {
    width: 70%;
  }

  .info_child .chanjeEjecutive {
    width: 30%;
  }

  .ejecutive_graphSectionRight .ejecutive_BaseSectionR {
    width: 40%;
    justify-content: none;
  }

  .ejecutive_graphSectionRight .ejecutive_BaseSectionR .ejecutive_BaseSquareR {
    width: 90%;
  }

  .ejecutive_graphSectionRight .ejecutive_principalGraphsR {
    width: 60%;
  }

  .baseSquare_title {
    text-align: center;
  }

  .scrollTable {
    overflow-x: unset;
  }

  .ejecutive_secondInfo .second_squareInfo .second_squareSection {
    width: 24%;
  }

  .scrollOferts {
    overflow-x: unset;
  }

  .ejecutive_principalGraphs1  .principalGrap {
    width: 50%;
  }

}



/*-------------------------------------- Galeria de fotos wbsys ---------------------------------------*/

@media screen and (min-width: 1250px) {
  /* .imageBox {
    max-height: 40rem;
  } */

  .contentPhoto .imgPhoto {
    height: 32rem;
    max-width: 80%;
  }

  .contentPhoto .infoPhoto {
    height: 7rem;
  }

  .imageBox .iconLeft {
    bottom: 360px;
  }

  .imageBox .iconLeft {
    bottom: 335px;
  }

  .imageBox .iconRight {
    bottom: 335px;
  }


}

@media screen and (min-width: 1800px) {
  /* .imageBox {
    max-height: 46rem;
  } */

  .contentPhoto .imgPhoto {
    height: 36rem;
    max-width: 100%;
  }

  .contentPhoto .infoPhoto {
    height: 7rem;
  }

  .imageBox .iconLeft {
    bottom: 360px;
  }

  .imageBox .iconRight {
    bottom: 360px;
  }

}



/*-------------------------------- Listado De Firmas ----------------------------------*/
@media screen and (min-width: 280px) {
  .firms_botton .firmButtonBox {
    width: 100%;
  }

  .firms_botton .firmButtonBox .firmButton .iconFirm1,
  .firms_botton .firmButtonBox .firmButton .iconFirm2 {
    font-size: 3rem;
  }

  .sectionFirm .selectBoxSections .selectFirmPU .addCopy,
  .sectionFirm .selectBoxSections .selectFirmFin .addCopy,
  .sectionFirm .selectBoxSections .selectFirmContr .addCopy,
  .sectionFirm .selectBoxSections .selectFirmTec .addCopy,
  .sectionFirm .selectBoxSections .selectFirmDirect .addCopy {
    width: 100%;
  }

  .sectionFirm .contentFirm {
    justify-content: center;
  }


  .sectionFirm .contentFirm p {
    width: 100%;
    text-align: center;
  }
  
  .sectionFirm .contentFirm .plusLevel {
    margin-top: 1rem;
  }

  .sectionFirm .contentFirm .plusLevel .plusLevelBox {
    width: 10rem;

  }

  .sectionFirm .selectBoxSections .selectFirmContr .selectFirmControl,
  .sectionFirm .selectBoxSections .selectFirmPU .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmPU .selectFirmCopy,
  .sectionFirm .selectBoxSections .selectFirmFin .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmFin .selectFirmCopy,
  .sectionFirm .selectBoxSections .selectFirmTec .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmTec .selectFirmCopy {
	  width: 100%;
  }

  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirmCopy,
  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirmA,
  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirmCopyA {
	  width: 100%;
  }

  .firm_buttons {
    justify-content: center;
  }

  .selectFirmDirect .rangeFirmContent {
    width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .firms_botton .firmButtonBox {
    width: 33%;
  }

  .firms_botton .firmButtonBox .firmButton .iconFirm1,
  .firms_botton .firmButtonBox .firmButton .iconFirm2 {
    font-size: 3rem;
  }

  .firms_square .firms_Sections {
    min-height: 26rem;
  }

  .sectionFirm .selectBoxSections .selectFirmPU .addCopy,
  .sectionFirm .selectBoxSections .selectFirmFin .addCopy,
  .sectionFirm .selectBoxSections .selectFirmContr .addCopy,
  .sectionFirm .selectBoxSections .selectFirmTec .addCopy,
  .sectionFirm .selectBoxSections .selectFirmDirect .addCopy {
    width: 20%;
  }

  .sectionFirm .contentFirm {
    align-items: center;
    justify-content: space-between;
  }

  .sectionFirm .contentFirm p {
    width: 50%;
    text-align: start;
  }
  
  .sectionFirm .contentFirm .plusLevel {
    width: 25%;
    margin-top: unset;
  }

  .sectionFirm .contentFirm .plusLevel .plusLevelBox {
    width: 8rem;
  }

  .sectionFirm .selectBoxSections .selectFirmContr .selectFirmControl,
  .sectionFirm .selectBoxSections .selectFirmPU .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmPU .selectFirmCopy,
  .sectionFirm .selectBoxSections .selectFirmFin .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmFin .selectFirmCopy,
  .sectionFirm .selectBoxSections .selectFirmTec .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmTec .selectFirmCopy {
	  width: 40%;
  }

  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirmCopy {
	  width: 40%;
  }

  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirmA,
  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirmCopyA {
	  width: 30%;
  }

  .firm_buttons {
    justify-content: center;
  }

  .selectFirmDirect .rangeFirmContent {
    width: 40%;
  }
  
}

@media screen and (min-width: 1250px) {

  .firms_botton .firmButtonBox {
    width: 14%;
  }

  .firms_botton .firmButtonBox .firmButton .iconFirm1,
  .firms_botton .firmButtonBox .firmButton .iconFirm2 {
    font-size: 5rem;
  }

  .firms_botton .firmButtonBox .firmButton .iconFirm1,
  .firms_botton .firmButtonBox .firmButton .iconFirm2 {
    font-size: 3rem;
  }

  .firms_square .firms_Sections {
    min-height: 22rem;
  }

  .sectionFirm .selectBoxSections .selectFirmPU .addCopy,
  .sectionFirm .selectBoxSections .selectFirmFin .addCopy,
  .sectionFirm .selectBoxSections .selectFirmContr .addCopy,
  .sectionFirm .selectBoxSections .selectFirmTec .addCopy,
  .sectionFirm .selectBoxSections .selectFirmDirect .addCopy {
    width: 10%;
  }

  .sectionFirm .contentFirm {
    align-items: center;
    justify-content: space-between;
  }

  .sectionFirm .contentFirm p {
    width: 50%;
    text-align: start;
  }
  
  .sectionFirm .contentFirm .plusLevel {
    width: 25%;
    margin-top: unset;
  }

  .sectionFirm .contentFirm .plusLevel .plusLevelBox {
    width: 10rem;
  }

  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirmCopy {
	  width: 40%;
  }

  .firm_buttons {
    justify-content: end;
  }

  .firm_buttons .firm_button.butSave {
    margin-right: 2.5rem;
  }

}


@media screen and (min-width: 1800px) {

  .firms_botton .firmButtonBox .firmButton .iconFirm1,
  .firms_botton .firmButtonBox .firmButton .iconFirm2 {
    font-size: 4rem;
  }

  .firms_square .firms_Sections {
    min-height: 32rem;
  }

  .sectionFirm .contentFirm {
    align-items: center;
    justify-content: space-between;
  }

  .sectionFirm .contentFirm p {
    width: 50%;
    text-align: start;
  }
  
  .sectionFirm .contentFirm .plusLevel {
    width: 25%;
    margin-top: unset;
  }

  .sectionFirm .contentFirm .plusLevel .plusLevelBox {
    width: 10rem;

  }

  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirm,
  .sectionFirm .selectBoxSections .selectFirmDirect .selectFirmCopy {
	  width: 40%;
  }
}


/* --------------------------- Proyect List Update -------------------------- */

@media screen and (min-width: 280px) { 

  .ProyectsTitles .projectTitles_title {
    justify-content: center;
  }

  .ProyectsTitles .projectTitles_title .text_titleProj {
    text-align: center;
  }

  .ProyectsTitles .projectTitles_Num {
    justify-content: center;
  }

  .ProyectsTitles .justBet {
    justify-content: center;
  }

}

@media screen and (min-width: 768px) { 
  .ProyectsTitles .projectTitles_title .text_titleProj {
    text-align: start;
  }

  .ProyectsTitles .projectTitles_title {
    justify-content: flex-start;
  }

  .ProyectsTitles .projectTitles_Num {
    justify-content: unset;
  }

  .ProyectsTitles .justBet {
    justify-content: space-between;;
  }

}

/* -------------------------- serverTime --------------------*/

@media screen and (min-width: 280px) { 
  #posinfo {
    display: none;
  }

  #idconteinerlogo{ 
    display: none;
  }

  .wiseWbsysLogo {
    display: none;
  }

  .companyLogo {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }

  #infoban{ 
    display: none;
  }

  #theHeader{
    height: 100%;
    position: absolute;  
    width: 100%;
  }

  #headerSectionDiv {
    left: 15%;
    width: 85%;
  }

  #headerSectionDiv.active{
    left: 10%;
    width: 95%;
  }

  .ownertabs{ 
    width: 80%;
  }

  #sidebarblock {
    width: 100% !important;
  }

  #sidebarblock.active {
    width: 10% !important;
  }

  .cellInactive {
    display: none !important;
  }

  #photoretrat{
    width: 100%;
  }

  #photoretrat.active{
    width: 10%;
  }

  .details_scrol-x {
    overflow-x: scroll;
  }

  .details_width {
    width: 100%;
  }

  .details_width-50 {
    width: 50%;
  }

  .details_width-100 {
    width: 100%;
  }

  .sectionLogoC {
    display: flex; 
    align-items:center; 
    justify-content:center;
    width: 100%;
    height: 55px;
  }

  .sectionLogoC .sectionLogoC_Child{
    width: 18%;
    height: 100%;
    margin-top: 2rem;
  }

  .inactiveModuleWi {
    display: flex ;
  }

  .inactiveModuleWb {
    display: flex ;
  }

  /* .inactiveModuleWb {
    display: none ;
  }

  .buttonWHidden {
    display: none !important; 
  } */
  
  .pl-0 {
    left: 0;
  }

  .cellComparativeInput {
    display: none;
  }

}

@media screen and (min-width: 768px) { 
  #posinfo {
    display: none;
  }

  #idconteinerlogo{
    width: 40%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }
  .companyLogo {
    width:22%
  }

  #theHeader{
    height: 100%;
    width: 100%;
    position: absolute;  
  }

  #headerSectionDiv {
    left: 32%;
    width: 68%;
  }

  #headerSectionDiv.active{
    left: 10%;
    width: 95%;
  }

  .ownertabs{ 
    width: 45%;
  }

  #sidebarblock {
    width: 32% !important;
  }

  #sidebarblock.active {
    width: 10% !important;
  }

  .cellInactive {
    display: unset !important;
  }

  #photoretrat{
    width: 32%;
  }

  #photoretrat.active{
    width: 10%;
  }

  .details_scrol-x {
    overflow-x: unset;
  }

  .details_width {
    width: unset;
  }

  .sectionLogoC {
    display: none;
  }

}

@media screen and (min-width: 1250px) { 
  #posinfo {
    display: unset;
  }

  #idconteinerlogo{
    width: 40%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }
  .companyLogo {
    width:22%
  }

  #infoban{
    /*width: auto;
    height: 50px;
    margin-left: 280px;
    margin-top: 0px;*/
    font-size: 20px;
    height: 100%;
    left: 60%;
    width: 40%;
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }

  #theHeader{
    height: 100%;
    width: 70%;
    position: absolute;  
  }

  #headerSectionDiv {
    left: 15%;
    width: 85%;
  }

  #headerSectionDiv.active{
    left: 5%;
    width: 95%;
  }

  .ownertabs{ 
    width: 45%;
  }

  #sidebarblock {
    width: 15% !important;
  }

  #sidebarblock.active {
    width: 5% !important;
  }

  .cellInactive {
    display: unset !important;
  }

  #photoretrat{
    width: 15%;
  }

  #photoretrat.active{
    width: 5%;
  }

  .inactiveModuleWi {
    display: flex;
  }

  .inactiveModuleWb {
    display: flex;
  }

  .buttonWHidden {
    display: unset !important; 
  }

  .pl-0 {
    left: unset;
  }

  .details_width-50 {
    width: unset;
  }

  .details_width-100 {
    width: unset;
  }

  .cellComparativeInput {
    display: flex;
    align-items: center;
    margin: 0.5rem 0;
  }

}



@media screen and (min-width: 1250px) {
  .porcentAnt {
    text-align:start !important; 
    padding-left:1rem;
  }
}

@media screen and (min-width: 1800px) {
  .porcentAnt {
    text-align:start !important; 
    padding-left:3rem;
  }
}