@font-face {font-family: 'Exo';     src: url('../fonts/exo2.0-regular.otf');}
@font-face {font-family: 'Lobster'; src: url('../fonts/lobster_1.4.otf');}
@font-face {font-family: 'Mool';    src: url('../fonts/moolbor.otf');}/**/





*{margin: 0px;padding: 0px;color: #fff;}
html{ font-family: 'Exo', sans-serif; color: #fff; }

a, a:hover, a:focus{ text-decoration: none; color: #fff;outline:0px;}



h1,h2 { font-weight: normal;}

h1, .h1 {font-size: 30px;font-family: 'Mool'; text-transform: uppercase;}
h2, .h2 {font-size: 18px;}
p, .p, address   {font-size: 16px;}

.row {margin:0px;}

.contenedor{
    margin: 30px auto;
    max-width: 1000px;
    /*min-width: 682px;*/
    border-radius: 10px;
    background: url('../img/fondo.jpg') no-repeat center center fixed;
    background-size: cover;

    /*max-height: 480px;
    overflow: hidden;/**/
}

#top{height: 125px;}

#logo{float: left;}
#logoimage {  padding: 20px 0px 0px 20px; /*width: 27px;*/ /*float: left;/**/   /*padding-right: 10px;*/}


#logotitle {
    /*float: none;/**/
    font-weight: 100;
    color: #fff;
    text-shadow: 0px 0px 5px #000;
    width: 150px;
    font-size: 1.2em;
    text-transform: capitalize;
    visibility: hidden;
    height: 0px;
}
/*#top{box-shadow: 0px 0px 5px #f00; background-color: rgba(50,0,0,.2);}*/

nav       {float: right; }
nav ul    {padding-right: 30px; }
nav ul li {
    font-family: "Exo";
    text-transform: uppercase;
    font-size: 0.90em;
    display: inline-block;
    /*float: left;/**/
    text-align: center;
    padding: 8px 0px;
    padding-top: 50px;
}
nav ul li:hover{ background-color: rgba(0,0,0,.5);}

nav ul li a{padding: 8px;}

header{
    font-weight: lighter;
    font-size: 0.6em;
    clear: both;
    float: none;
    padding: 120px 120px;
    /*box-shadow: 0px 0px 5px #000;*/
}
header h1 {font-size: 24px; font-family: 'Lobster';text-transform: none; text-shadow: 0px 0px 3px #000;}
header h2 {text-align: right; font-family: 'Lobster'; text-shadow: 0px 0px 4px #000;}

.separador {height: 20px;}
.SV {background-color: #AD5;}
.SB {background-color: #fff;}
.SO {background-color: #BE6;}

.fotoAT{background: #fff url('../img/alejandroTorres.jpg') no-repeat 20px center;}

#presentacion{background-color: #fff;padding: 30px;}
#presentacion img    { float: left; padding: 20px}
#presentacion h1     {color: #AD5; text-transform: uppercase; margin: 20px;}
#presentacion p,
#presentacion a      {margin: 20px;color: #333}
#presentacion li     {color: #AD5; margin-left:60px;}
#presentacion b      {color: #2a2a2a; font-weight: normal;}

#presentacion{

top: 0px;
height: 100%;
overflow: auto;
/*border: 1px solid red;/**/
}
/*#presentacion {display: none}/**/


#consulta{background-color: #FBB03B;color: #fff;padding: 30px;}

#especialidades{
    background: url('../img/fondo02.jpg') no-repeat center center fixed;
    background-size: cover;
    color: #000;
    padding: 30px;}
#especialidades h1 {color: #fff; text-transform: uppercase; margin: 20px; font-family: 'Mool'}

.especialidad{ min-height: 30px;}
#Tratamiento_Psicologico,#Jovenes_Adolescentes,#Terapia_Pareja,#Evaluacion_Psicologica,#Terapia_RV{display: none;}

.especialidad p{ font-size: 1em;}
.especialidad ul, .especialidad ol{
    margin-left: 50px;
} 

.caja_color{
    
    background-color: #fff;/**/
    color: #7C4A19;/**/
    /*margin: 10px 10px 10px 20px;/**/
    /*height: 200px;/**/
    line-height: 1.2em;
    padding: 60px 20px;/**/
    text-align: center;/**/
    text-transform: uppercase;/**/
    font-family: 'Mool';/**/
    font-size: 1.6em;
    vertical-align:bottom;
    cursor: pointer;/**/
    /*border: 3px solid green;/**/
}
.caja_color2{padding: 74px 20px 73px 20px;/**/}
.caja_color3{padding: 47px 20px 46px 20px;/**/}
.caja_color:hover{background-color: #7C4A19;color: #fff;}

.textos_esp{margin-top: 20px;}

.fotoBiblio{background: url('../img/fondo03.jpg') no-repeat center center; background-size: cover;}

#biblioteca{background-color: #fff;color: #000;padding: 30px;}
#biblioteca img     { float: left; padding: 20px}
#biblioteca h1      {color: #AD5; text-transform: uppercase; margin: 20px;}
#biblioteca p,
#biblioteca a       {margin: 20px 20px 20px 20px;color: #333}
#biblioteca li      {color: #AD5; margin-left:60px; list-style-position: inside; text-indent: -2.2em; line-height: 1.3em; margin-bottom: 1em;}



#contacto{background-color: #999;color: #fff;padding: 30px;}
#contacto span{color: #666}

#map{
    display: block;
    height: 390px;
    margin: auto;
    -moz-box-shadow: 0px 5px 10px #555;
    -webkit-box-shadow: 0px 5px 10px #555;
    box-shadow: 0px 5px 10px #555;
    border-radius: 4px;
}

#gmap_canvas{width: 100%;height: 390px;border-radius: 4px;}

#contacto2{
    font-family: "Exo";
    background-color: #666;
    color: #fff;
    padding: 30px;
    min-height: 200px;
    margin-bottom: 20px;
    border-radius: 0px 0px 10px 10px ;
}
#contacto2 p{font-size: 1em;}


.formulario,.textoform{
    width: 100%;
    border: 1px solid #ccc;
            transition: all 0.25s ease-in-out;
    -webkit-transition: all 0.25s ease-in-out;
       -moz-transition: all 0.25s ease-in-out;
}
.formulario{
    background: #666;
    padding: 4px 5px 5px 5px;
    margin-bottom: 4px;
    overflow: hidden;
    height: 29px;
}
.textoform{
    background: #eee;
    color: #666;
    height: 62px;
    line-height: 20px;
    overflow: auto;
}

.iconoSocial img{ width: 30px; height: 30px; padding: 2px}


.formulario:focus, .textoform:focus{
    
            box-shadow: 0 0 5px #ad5;
    -webkit-box-shadow: 0 0 5px #ad5;
       -moz-box-shadow: 0 0 5px #ad5;
}


/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    .contenedor {margin: 0px auto;border-radius: 0px;}
    p {font-size: 14px;}
    #presentacion h1, #especialidades h1, #biblioteca h1  { margin: 0px;}
    #presentacion p {margin: 0px 0px 10px 0px;}
    #logo{ clear: both; float: none; text-align: center;}
    #logoimage{ padding: 0px; padding-top: 20px}
    nav ul li{ padding: 0px;}
    header {  padding: 20px 20px;}
    header h1 {font-size: 18px; text-shadow: 0px 0px 2px #000;}
    .caja_color {font-size: 1.4em; padding: 0px; line-height: 1.6em;margin: 0px 0px 2px 0px; padding-top: 10px;}
    .col-xs-12{ padding: 0px;}
    #biblioteca li {margin-left: 30px;}
    #biblioteca a {margin: 10px;}
    #contacto2 p { margin-top: 30px}
    .especialidad { height: auto; -moz-column-count: 1; }
}
/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px) {}
/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) { body{border: 1px solid black;}}
/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    .contenedor {margin: 0px auto; border-radius: 0px 0px 10px 10px;}
    .caja_color {
        font-size: 1.4em;
        padding: 50px 20px;
        line-height: 1em;
        /*margin: 0px 0px 2px 0px/**/
    }

}
/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {}
/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {}
/* Desktops and laptops ----------- */
@media only screen and (min-width : 1224px) {}
/* Large screens ----------- */
@media only screen and (min-width : 1824px) {}
/* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5),only screen and (min-device-pixel-ratio : 1.5) {}