.row.special {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
  flex-wrap: nowrap;    
  height:100%;
  margin:0;
  padding:0;

}
.row.special > [class*='col-'] {
  display:flex;
  flex-direction:column;
  padding:2% 0%;
}

.img-responsive {margin:auto auto;}


.grayBox{    
   background-color:rgba(250,250,250,.8);
}

.textBoxBlue {
    background-color: #3BB7D2;
    /*height:15.5em;*/
}

.textBoxGreen {
    background-color: #015787;
    /*height:15.5em;*/
}

h3.White
{
    color:white;
}

.colorBoxesLeft
{
    width:68%;
    margin-left:27%;
    /*margin-top:5%;*/
    /*margin-bottom:2% !important;*/
}

.colorBoxesRight
{
    width:68%;
    margin-left:6%;    
        
    /*margin-bottom:2% !important;*/
}

h3.AboutUsText
{
    font-size:1.1em;
    font-family:Roboto-Light;
    text-align:left;
    padding-bottom:5%;
}

h3.ourprocess{
    font-family:Roboto-Light;
    font-size:1.2em;
}

h3{
    text-align:left;
    line-height:1.8em;
}

h3.highlight
{
    font-size:1.225em;
    color:#084876;
    font-family:Roboto-Thin;
}

h3.highlightBottom
{    
    color:#656160;
    font-family:Roboto-Light;
}

h3.mostBottom
{
    line-height:1.2em;
    font-size:1.87em;
    color:#004876;
    font-family:Roboto-Medium;
    margin-bottom:15%;
} 

h1.calculatorTextUp
{
    font-family:Roboto-Medium;
    font-size:2em;
    text-align:left;
}
h1.calculatorTextDown
{
    text-align:left;
    font-family:Roboto;
    font-size:1.55em;
}

.buttonText
{
    padding:0;
    font-family:Roboto-Bold;
    font-size:1.2223em;
    color:white;
    text-align:center;
}
.btnStart
{
    background-color:#5CCAF4;
    padding:12% 18%;
    border-radius:0;
    text-align:center;    
    border:none;
    display:block;
}

.lowerSectionLeft
{
    width:56%; 
    padding-top:2%;
}

.lowerSectionLeft>.left{
    margin-left:22%;
}

.lowerSectionRight
{
    width:44%;
}

.lowerSectionRight>.left{
    width:25%; 
    padding-bottom:5%;
}
.lowerSectionRight>.right{
    width:75%; 
    padding-top:3.5%; 
    padding-left:0;
}

.histories:hover
{
    cursor:pointer;        
    -webkit-filter: drop-shadow(0px 0px 40px black); /* Safari */
    filter: drop-shadow(0px 0px 20px white);
    z-index:9999;
}

/* Control del tamaño gral de los textos */
@media all and (min-width: 960px) and (max-width: 1200px)
{
.colorBoxesLeft
    {
        width:90%;
        margin-left:6%;
    }

.colorBoxesRight
    {
        width:90%;
        margin-left:6%;
    }

}
 
@media all and (max-width: 959px) and (min-width: 600px) {
.colorBoxesLeft
    {
        width:70.75%;
        margin-left:6%;
    }
}
 
@media all and (max-width: 599px) and (min-width: 320px) {
.colorBoxesLeft
    {
        width:80.75%;
        margin-left:6%;
    }
 .colorBoxesRight
    {
        width:80.75%;
        margin-left:6%;
    }
.lowerSectionLeft
{
    width:inherit; 
    padding-top:2%;
}

.lowerSectionLeft>.left{
    margin-left:6%;
}

.lowerSectionRight
{
    width:inherit;
}

.lowerSectionRight>.left{
    width:25%; 
    padding-bottom:5%;
    padding-top:3.5%;
}

.lowerSectionRight>.right{
    width:75%; 
    padding-top:3.5%; 
    padding-left:0;
}

}

/* ============================================================================================================================
== BUBBLE WITH AN ISOCELES TRIANGLE DARK BLUE
** ============================================================================================================================ */

.triangle-isosceles-cian {
  position:relative;
  background-color:#015787
}

/* Variant : for right positioned triangle
------------------------------------------ */

.triangle-isosceles-cian.right {
  /*margin-right:50px;*/
  background-color:#015787
}

/* THE TRIANGLE
------------------------------------------------------------------------------------------------------------------------------- */

/* creates triangle */
.triangle-isosceles-cian:after {
  content:"";
  position:absolute;
  bottom:-44px; /* value = - border-top-width - border-bottom-width */
  left:360px; /* controls horizontal position */
  border-width:45px 35px 0; /* vary these values to change the angle of the vertex */
  border-style:solid;
  border-color:#015787 transparent;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
  z-index:100;
}

/* Variant : right
------------------------------------------ */

.triangle-isosceles-cian.right:after {
  top:auto; /* controls vertical position */
  right:-2.5%; /* value = - border-left-width - border-right-width */
  bottom:50%;
  left:auto;
  border-width:1.5em 0 1.5em 1.5em;
  border-color:transparent #015787;
  z-index:99999;
}