﻿html {
    scroll-behavior: smooth;
  }

body { 
    font-family: 'Roboto', sans-serif; 
    
}
footer {
    font-family: 'Roboto slab', serif;
    font-weight: normal;
    padding: 10px 0 10px 0;
}

h1, h2, h3, h4, h5    { 
    font-family: 'Roboto slab', serif;
    font-weight: normal;
}

.backgris h4 {
    color:#00AAF7;
}

@media (max-width: 750px) {
h1{
    font-size: 30px;
}
}

@media (max-width: 400px) {
    h1{
        font-size: 25px;
    }
    }

h6 {
    font-family: 'Roboto', sans-serif;
}



a.links {
    color: #02A6DD;
}

a.links:hover {
    color: #255EDA;
    
}


.a:hover{ 
    text-decoration: none;
}

a.botonera{
    color: #343a40;
}

a.botonera:hover  {
    color: #02A6DD;
}

a.botonera1 {
    color: #02A6DD;
}

.menu {
    text-align: right;
    margin-top: 110px;
}



.marco {
    padding-top: 60px;
    padding-bottom: 60px;
}

ul {
    list-style-image: url("../images/bulletazul.png");
}

.backgris ul {
    list-style-image: url("../images/bulletblanco.png");
}

.azul {
    list-style-image: url("../images/bullet255EDA.png");
}

.verde {
    list-style-image: url("../images/bullet39afa7.png");
}

.celeste {
    list-style-image: url("../images/bullet02a6dd.png");
}

.gris {
    list-style-image: url("../images/bullet949494.png");
}

.btn-primary:hover, .btn-primary.active {
    color: #fff;
    background-color: #00A8F5;
    border: none;
    transition: 0.4s ease;
}

.card-header:hover{
    color: #fff;
    background-color: #006DFC;
    border: none;
    transition: 0.4s ease;
}
.btn-primary {
    background-color: #006DFC;
    border: none;
}

.rounded{
    padding: 40px;
}

.cuadro-fallos {
    background-image: url('../images/obras/obra_Aforo_Rio_Blanco.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    min-height: 600px;
    padding-top: 15%;

}

.cuadro-fallos div.rounded {
        background-color: rgba(255, 255, 255, 1);
        position:absolute;
        margin-left:auto;
        margin-right:auto;
        left:0;
        right:0;
        
    }

    .backgris {
        background-color: #00AAF7;  
        color:#f1f1f1;
    }

.objetivo-auditorias {
    background-image: url('../images/obras/b_beltran_norte_maipu.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    min-height: 600px;
    padding-top: 10%;
}

.objetivo-auditorias div.rounded {
        background-color: rgb(255, 255, 255, 1);
        position:absolute;
        margin-left:auto;
        margin-right:auto;
        left:0;
        right:0;
        
    }

.modal-header {
    background-color: #02A6DD;
}

.modal-title{
    color: white;
}

.card{
background-color: #CECECE;
}


.card-header{
    background-color: #00A8F5;
    border: none;
    
}

.backgris .card-header{
 background-color: white;
  
}


.stream { position: relative; padding: 10px 0; }
.stream:first-child .stream-badge:before { top: 10px; }
.stream:last-child .stream-badge:before { height: 30px; }
.stream .stream-badge { width: 50px; } 
.stream .stream-badge i { border: 3px solid #006DFC; border-radius: 50%; padding: 4px; color: #006DFC; position: absolute; background-color: #ffffff; left: 15px; }
.stream .stream-badge i.bg-success { color: #ffffff; background-color: #1c84c6; border-color: #1c84c6; }
.stream .stream-badge i.bg-primary { color: #ffffff; background-color: #1ab394; border-color: #1ab394; }
.stream .stream-badge i.bg-warning { color: #ffffff; background-color: #f8ac59; border-color: #f8ac59; }
.stream .stream-badge i.bg-info { color: #ffffff; background-color: #23c6c8; border-color: #23c6c8; }
.stream .stream-badge i.bg-danger { color: #ffffff; background-color: #ed5565; border-color: #ed5565; }
.stream .stream-badge i.bg-edit {color: #f8ac59; background-color: #ffffff;  border-color: #f8ac59;}
.stream .stream-badge:before { content: ''; width: 3px; background-color: #006DFC; position: absolute; top: 0; bottom: 0; left: 28px; }
.stream .stream-info { font-size: 12px; margin-bottom: 5px; }
.stream .stream-info img { border-radius: 50%; width: 18px; height: 18px; margin-right: 2px; margin-top: -4px; }
.stream .stream-info .date {  color: #9a9d9f; font-size: 80%; }
.stream .stream-panel { margin-left: 80px; }
.stream-small { margin: 10px 0; } 
.stream-small .label { padding: 2px 6px; margin-right: 2px; }







.carousel-control-prev-icon {
    
    width: 15%;
    height: 15%;
   }
   
   .carousel-control-next-icon {
     
     width: 15%;
    height: 15%;
   }

   .carousel-indicators li {
    background-color: #fff;
    height: 7px;
}

.img-carousel{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    min-height: 600px;
}
.img-carousel.i01 {
    background-image: url('../images/capacitaciones/cap_online1.jpg');
}
.img-carousel.i02 {
    background-image: url('../images/capacitaciones/cap_online_20.jpg');
}
.img-carousel.i03 {
    background-image: url('../images/capacitaciones/cap_online2.jpg');
}





.img-carousel.bid01 {
    background-image: url('../images/obras/Refuncionalizacion_Tunel_n_1_RP_82.jpg');
}

.img-carousel.bid02 {
    background-image: url('../images/obras/refuncionalizacio_RP_n_82.jpg');
}

.img-carousel.bid03 {
    background-image: url('../images/obras/cubierta_club_Villa_Hipodromo.jpg');
}

.img-carousel.bid04 {
    background-image: url('../images/obras/Modificacion_de_tomas_de_Canal_San_Martin.jpg');
}

.img-carousel.bid05 {
    background-image: url('../images/obras/multiespacio_cultural_maipu.jpg');
}





.desplegable {
 margin-top: 15px;
}

.repfisc {
    display: inline-flex;
    text-align: center;
}

.fondoimg {
    background-image: url('../images/fondo_construccion_1.png');
    background-repeat: no-repeat;
    padding-bottom: 150px;
}

.circulo {
    font-size: 10px!important;
}

.bullet {
    font-size: 15px!important;
}

.bg-01 { background-color: #006DFC!important; }
.bg-02 { background-color: #0E6BA8!important; }
.bg-03 { background-color: #0E35AA!important; }
.bg-04 { background-color: #2C2C2C!important; }
.bg-05 { background-color: #006DFC!important; }


.progress h6 {
    padding-top: 20px;
    position: absolute;
    margin-left: 220px;   
}

.modal-body {
    padding-left: 40px;
    padding-right: 40px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.articulos {
    margin-left: 14px;
    margin-right: 14px;
    
}

#wrapper {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
}

#container {
    float: left;
    padding: 1em;
    width: 100%;
}

ol.organizational-chart,
ol.organizational-chart ol,
ol.organizational-chart li,
ol.organizational-chart li > div {
    position: relative;
}

ol.organizational-chart,
ol.organizational-chart ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

ol.organizational-chart {
    text-align: center;
    color: white;
}

ol.organizational-chart ol {
    padding-top: 1em;
}

ol.organizational-chart ol:before,
ol.organizational-chart ol:after,
ol.organizational-chart li:before,
ol.organizational-chart li:after,
ol.organizational-chart > li > div:before,
ol.organizational-chart > li > div:after {
    background-color: #39AFA7;
    content: '';
    position: absolute;
}

ol.organizational-chart ol > li {
    padding: 1em 0 0 1em;
}

ol.organizational-chart > li ol:before {
    height: 1em;
    left: 50%;
    top: 0;
    width: 3px;
}

ol.organizational-chart > li ol:after {
    height: 3px;
    left: 3px;
    top: 1em;
    width: 50%;
}

ol.organizational-chart > li ol > li:not(:last-of-type):before {
    height: 3px;
    left: 0;
    top: 2em;
    width: 1em;
}

ol.organizational-chart > li ol > li:not(:last-of-type):after {
    height: 100%;
    left: 0;
    top: 0;
    width: 3px;
}

ol.organizational-chart > li ol > li:last-of-type:before {
    height: 3px;
    left: 0;
    top: 2em;
    width: 1em;
}

ol.organizational-chart > li ol > li:last-of-type:after {
    height: 2em;
    left: 0;
    top: 0;
    width: 3px;
}

ol.organizational-chart li > div {
    background-color: #fff;
    border-radius: 3px;
    min-height: 2em;
    padding: 0.5em;
}

/*** PRIMARY ***/
ol.organizational-chart > li > div {
    background-color: #05756E;
    margin-right: 1em;
}

ol.organizational-chart > li > div:before {
    bottom: 2em;
    height: 3px;
    right: -1em;
    width: 1em;
}

ol.organizational-chart > li > div:first-of-type:after {
    bottom: 0;
    height: 2em;
    right: -1em;
    width: 3px;
}

ol.organizational-chart > li > div + div {
    margin-top: 1em;
}

ol.organizational-chart > li > div + div:after {
    height: calc(100% + 1em);
    right: -1em;
    top: -1em;
    width: 3px;
}

/*** SECONDARY ***/
ol.organizational-chart > li > ol:before {
    left: inherit;
    right: 0;
}

ol.organizational-chart > li > ol:after {
    left: 0;
    width: 100%;
}

ol.organizational-chart > li > ol > li > div {
    background-color: #108880;
}

/*** TERTIARY ***/
ol.organizational-chart > li > ol > li > ol > li > div {
    background-color: #209C94;
}

/*** QUATERNARY ***/
ol.organizational-chart > li > ol > li > ol > li > ol > li > div {
    background-color: #39AFA7;
}

/*** QUINARY ***/
ol.organizational-chart > li > ol > li > ol > li > ol > li > ol > li > div {
    background-color: #5CBFB9;
}


/*** SENARY	 ***/
ol.organizational-chart > li > ol > li > ol > li > ol > li > ol > li > ol > li > div {
    background-color: #6EC8C2;


}
/*** MEDIA QUERIES ***/
@media only screen and ( min-width: 64em ) {

    ol.organizational-chart {
        margin-left: -1em;
        margin-right: -1em;
    }

    /* PRIMARY */
    ol.organizational-chart > li > div {
        display: inline-block;
        float: none;
        margin: 0 1em 1em 1em;
        vertical-align: bottom;
    }

    ol.organizational-chart > li > div:only-of-type {
        margin-bottom: 0;
        width: calc((100% / 1) - 2em - 4px);
    }

    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(2),
    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(2) ~ div {
        width: calc((100% / 2) - 2em - 4px);
    }

    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(3),
    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(3) ~ div {
        width: calc((100% / 3) - 2em - 4px);
    }

    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(4),
    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(4) ~ div {
        width: calc((100% / 4) - 2em - 4px);
    }

    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(5),
    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(5) ~ div {
        width: calc((100% / 5) - 2em - 4px);
    }

    ol.organizational-chart > li > div:before,
    ol.organizational-chart > li > div:after {
        bottom: -1em!important;
        top: inherit!important;
    }

    ol.organizational-chart > li > div:before {
        height: 1em!important;
        left: 50%!important;
        width: 3px!important;
    }

    ol.organizational-chart > li > div:only-of-type:after {
        display: none;
    }

    ol.organizational-chart > li > div:first-of-type:not(:only-of-type):after,
    ol.organizational-chart > li > div:last-of-type:not(:only-of-type):after {
        bottom: -1em;
        height: 3px;
        width: calc(50% + 1em + 3px);
    }

    ol.organizational-chart > li > div:first-of-type:not(:only-of-type):after {
        left: calc(50% + 3px);
    }

    ol.organizational-chart > li > div:last-of-type:not(:only-of-type):after {
        left: calc(-1em - 3px);
    }

    ol.organizational-chart > li > div + div:not(:last-of-type):after {
        height: 3px;
        left: -2em;
        width: calc(100% + 4em);
    }

    /* SECONDARY */
    ol.organizational-chart > li > ol {
        display: flex;
        flex-wrap: nowrap;
    }

    ol.organizational-chart > li > ol:before,
    ol.organizational-chart > li > ol > li:before {
        height: 1em!important;
        left: 50%!important;
        top: 0!important;
        width: 3px!important;
    }

    ol.organizational-chart > li > ol:after {
        display: none;
    }

    ol.organizational-chart > li > ol > li {
        flex-grow: 1;
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 1em;
    }

    ol.organizational-chart > li > ol > li:only-of-type {
        padding-top: 0;
    }

    ol.organizational-chart > li > ol > li:only-of-type:before,
    ol.organizational-chart > li > ol > li:only-of-type:after {
        display: none;
    }

    ol.organizational-chart > li > ol > li:first-of-type:not(:only-of-type):after,
    ol.organizational-chart > li > ol > li:last-of-type:not(:only-of-type):after {
        height: 3px;
        top: 0;
        width: 50%;
    }

    ol.organizational-chart > li > ol > li:first-of-type:not(:only-of-type):after {
        left: 50%;
    }

    ol.organizational-chart > li > ol > li:last-of-type:not(:only-of-type):after {
        left: 0;
    }

    ol.organizational-chart > li > ol > li + li:not(:last-of-type):after {
        height: 3px;
        left: 0;
        top: 0;
        width: 100%;
    }
    .organizational-chart h1, .organizational-chart h2, .organizational-chart h3, .organizational-chart h4, .organizational-chart h5, .organizational-chart h6{
        margin-bottom: 0px;
    }

    .organizational-chart h6{ 
        font-family: 'Lora', serif;
    }
    
}
    

.btn.focus, .btn:focus {
    outline: 0;
    box-shadow: none;
  }


  .collapsing {
   
    transition: height 1s ease;
  }

      .accordion h4 {
        margin-bottom: 0px;

      }
      .accordion h5 {
        margin-left: 3px;

      }

      .accordion .card-body {
          padding: 32px 30px;
          background-color: white;
          
      }

      .backgris .card-body {
          background-color: #3fb6ec;
      }

      .accordion ul {
          padding: 0px;
          margin: 0px;
        margin-left: 5px;
        margin-top: 5px;
        margin-bottom: 5px;
      } 

      .accordion li {
        padding: 0px;
        margin: 0px;
      margin-left: 15px;
      margin-bottom: 5px;
    } 

    .accordion p {
        margin-bottom: 0px;
        margin-left: 5px;
    }

    .btnceleste {
        background-color: #02A6DD!important;
    }

    .title{
        margin-bottom: 0px;
        margin-left: 36px;
        color: white!important;
    }

    .dos{
        margin-bottom: 0px;
        margin-left: 49px;
        color: white;
    }
    
    .ibox-title {
        margin-left: 12px;
        color: black;
    }

    th {
        border-top: none!important;
    }

    

    .multa {
        font-size: 20px;
        margin-top: 12px;
        
    }

    .separacion{
        margin-top: 25px;
    }

    .separacion1{
        margin-top: 40px;
    }

    

    

    .navbar-expand-lg {
        background-color: white;
        
    }

    .navbar-light .navbar-nav .nav-link.active {
        color: #02A6DD;
        
        
    }
    .navbar-light .navbar-nav .nav-link:hover {
        color: #02A6DD;
        transition: 0.8s ease;
    }

    .func {
        color: white;
    }

    .func:hover {
        color: white;
        background-color: #006DFC;
    }
    .nav-tabs .nav-link.active.func {
        background-color: #006DFC;
        border-bottom: none;
        color: white;
        
    }

    .nav-tabs .nav-link.active.org {
        background-color: #f8f8f8;
        border-bottom: none;
    }

    .nav-tabs .nav-link .tabin{
        color: white;
    }

    .backgris .nav-link {
        padding: 7px!important;
    }
    .navbar-light .navbar-toggler-icon {
        background-image: url("../images/icon-hamburguesa.png");
    }
    
    .navbar-toggler:focus, .navbar-toggler:hover {
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(2, 166, 221, 0.438);
      
    }

    .navbar-toggler {
        margin-bottom: 15px;
    }

    @media (min-width: 750px) {
        .cuadro-fallos div.rounded {margin: 0 20% 0 20%;}
    }

    @media (min-width: 750px) {
        .objetivo-auditorias div.rounded {margin: 0 20% 0 20%;}
    }

    @media (max-width: 750px) {
        .cuadro-fallos {
            padding-top: 20%;
            }

        .cuadro-fallos div.rounded {
            position:absolute;
            margin-left: 20px;
            margin-right: 20px;
            left:0;
            right:0;
            margin-top: 50px;
        }

        .objetivo-auditorias div.rounded {
            position:absolute;
            margin-left: 20px;
            margin-right: 20px;
            left:0;
            right:0;
            margin-top: 150px;
        }

        #btnart181 {
            margin-bottom: 30px;
        }

        .disp {
            margin-top: 20px;
        }

        .nav-link{
            width: 100%;
        }
      }
     
  

      
    

      .order-first {
        -ms-flex-order: -1;
        order: -1;
        margin-top: 15px;
        margin-bottom: 15px;
      }
      
      .order-last {
        -ms-flex-order: 13;
        order: 13;
        margin-top: 15px;
        margin-bottom: 15px;
      }
      
      .order-2 {
        -ms-flex-order: 2;
        order: 2;
        margin-top: 15px;
        margin-bottom: 15px;
      }
      
      .order-3 {
        -ms-flex-order: 3;
        order: 3;
        margin-top: 15px;
        margin-bottom: 15px;
      }
      
    .form-row{
        padding-left: 10px;
    padding-right: 10px;
    
    }

    .modal.fade .modal-dialog {
        transition: -webkit-transform 0.4s ease-out;
        transition: transform 0.4s ease-out;
        transition: transform 0.4s ease-out, -webkit-transform 0.4s ease-out;
       
      }


      @media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-top:40px!important;
		text-align:left;
	}
	
	td:before { 
		position: absolute;
		top: 5px;
		left: 12px;
		width: 100%; 
		display:block;
		white-space: nowrap;
		font-weight: bold;
	}
	
	/*
	Label the data
	*/
	#modufa td:nth-of-type(1):before { content: "Número"; }
	#modufa td:nth-of-type(2):before { content: "Organismo"; }
	#modufa td:nth-of-type(3):before { content: "Multa"; }
	#modufa td:nth-of-type(4):before { content: "Cargo"; }


	#eModal1 td:nth-of-type(1):before { content: "Organismo"; }
	#eModal1 td:nth-of-type(2):before { content: "Recibidas durante 2019"; }
	#eModal1 td:nth-of-type(3):before { content: "Falladas durante 2019"; }
	



}



.fa-chart-line, .fa-file-invoice-dollar  {
    
    padding-left: 60px;
    font-size: 150px;
    
}

.tablapersonal{
    background-color:#00A8F5;
    color: white;
}

.rounded-pill{
    background-color: white!important;
    color:#00A8F5!important;
    font-size: large!important;
}

.quality´{
    background-color: white!important;
}