/*
Theme Name: BootstrapWP
Theme URI: http://bootstrapwp.rachelbaker.me
Author: Rachel Baker
Author URI: http://www.rachelbaker.me
Description: A semantic HTML/CSS framework base theme for WordPress Developers ported from Twitter Bootstrap
Version: 1.0
=======
License: GNU General Public License
License URI: license.txt

This theme, like WordPress, is licensed under the GPL.

The development of BootstrapWP was powered by Sublime Text 2 and lots of Diet Coke.
Use this starter theme to make something cool.  Please share the results with me via Twitter @rachelbaker.
Enjoy!

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

Comfortable with LESS?  Check out the /assets/css/less folder where the bootstrapwp.less file is the master complier

Not comfortable with LESS?  You can override the compiled bootstrapwp.css file by adding custom styles here.
-------------------------------------------------- */
body{font-family: 'Open Sans', sans-serif; font-size: 12px; line-height: 21px;}
p{ margin-bottom: 10px;}
h1, h2, h3, h4, h5, h6{font-weight: normal; font-family:'Armata', sans-serif;}
h1{color: #02aaad; font-size: 17px; font-family:'Armata', sans-serif;}
h2{ font-size: 14px; line-height: 15px; margin-bottom: 5px; margin-top: 0px; font-family:'Armata', sans-serif;}
h3{font-size: 12px; margin-bottom: 0px; margin-top: 0px; font-family:'Armata', sans-serif;}

h4{color: #252525; font-size: 21px;  margin-bottom: 10px; font-family:'Armata', sans-serif;}


#fondo_up{
    background: url(http://www.mc3arquitectos.com/img/bg_head.png) repeat-x;
    height: 10px;
}

#logotipo{
    margin-top: 60px;
    position: absolute;
    float: left;
}

#imagen1{
    margin-left: 85px;
   
}

#imagen2{
margin-left: 70px;
margin-top:-20px;
}

#menu .nav{
    margin: 0;
    margin-top: 35px;
    margin-left: 40px;
    float: left;
    clear: both;
}
#menu .nav li{
    list-style: none;
    display: inline-block;
    
}

#menu .nav li a{
    font-family:'Armata', sans-serif;
    font-size: 14px;
    text-decoration: none;
    font-weight: normal;
    color: #6c6c6c;
    cursor: pointer;
    display: block;
    padding: 15px 20px;
}

#menu .alt{
   color: #fff !important;
  
}
#menu .nav li a:hover, #menu .alt{
   background: #008c99;
   color: #fff;
   font-weight: normal;
   text-shadow: none;
}

.navbar{
    position: absolute;
    margin-top: -120px;
}

.navbar p{
    display: none;
}

.redes{
    margin-top: 57px;
    float: right;
    clear: both;
}
.redes ul li{
    list-style: none;
    display: inline-block;
}

.redes ul li a{
    text-decoration: none;
}

#facebook, #instagran, #linke{ background: url(http://www.mc3arquitectos.com/img/redes2.png) no-repeat; width: 18px; height: 18px; display: block; position: relative;}
#facebook{background-position: 0px 0px;}
#instagran{background-position: -24px 0px;margin-right: 7px;}
#linke{background-position: -51px 0px;}
#facebook:hover{background-position: 0px -20px;}
#instagran:hover{background-position: -24px -20px}
#linke:hover{background-position: -51px -20px}


#concretos{
    float: right;
    margin-top: 53px;
    clear: both;
}

footer{
    background: url(http://www.mc3arquitectos.com/img/bg_footer.png);
    margin-top: 70px;
    height: 100px;
    margin-bottom: -20px;
    
}

footer ul{
    margin: 0;
}
footer ul li{
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    color: #008c99;
    list-style: none;
    display: inline-block;
    height: 11px;
    line-height: 10px;
}

footer ul li a{
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    color: #008c99;
    cursor: pointer;
    height: 11px;
}

footer p{
    font-size: 11px;
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    color: #008c99;
}

#pie{
    height: 70px;
    padding-top: 20px;
}

#pie ul li{
    border-style: solid;
    border-width: 1px;
    border-color: #008c99;
    border-right: none;
    border-top: none;
    border-bottom: none;
    height: 11px;
    padding-right: 5px;
    padding-left: 5px;
}

#pie ul li:first-child {
    border-left:none ;
    padding-left: 0px;
}

#pie p a{
    font-size: 11px;
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    color: #008c99;
    cursor: pointer;
}

#pie2{
    padding-top: 20px;
}

#pie2 img{
    float: right;
    margin-bottom: 5px;
}

#redes2{
    float: right;
}
#facebook2, #instagran2, #linke2{ background: url(http://www.mc3arquitectos.com/img/redes2.png) no-repeat; width: 18px; height: 18px; display: block; position: relative;}
#facebook2{background-position: 0px -20px;}
#instagran2{background-position: -24px -20px;margin-right: 7px;}
#linke2{background-position: -51px -20px;}
#facebook2:hover{background-position: 0px 0px;}
#instagran2:hover{background-position: -24px 0px;}
#linke2:hover{background-position: -51px 0px;}



@media (max-width: 1200px) {
    /*estilos del nav y footer*/
  #terminos li:nth-child(3){border-style: none; margin-left: -5px;}
  #pie ul li:nth-child(9){border-style: none; margin-left: -5px;}
  .navbar{margin-top: -100px; margin-left: 20px;}
  #menu .nav li a{padding: 10px 10px;}
  footer ul li a{font-size: 10px;}
  footer ul li {margin-left: 0px;}
  footer{height: 150px;}
  .redes{margin-top: 12px;}
}

@media (min-width: 768px) and (max-width: 979px) {
    /*estilos del nav y footer*/
    .navbar .btn-navbar{display: none;}
    .nav-collapse, .nav-collapse.collapse {overflow:visible;}
    #pie ul li:nth-child(9){border-left: solid thin ;margin-left: 5px;}
    #pie ul li:nth-child(6){border-style: none; margin-left: -5px;}
    .navbar{margin-top: 10px; width: 720px; margin-left: -230px;}
    #menu .nav li a{padding: 15px 20px;}
    #menu{margin-bottom: 100px;}
    .redes{ margin-top: 40px;;}
    footer ul li{font-size: 10px;} 
}

@media (max-width: 767px){
    /*estilos del nav y footer*/
    .navbar .btn-navbar{display: none;}
    .nav-collapse, .nav-collapse.collapse {overflow:visible;}
    #menu{margin-top: 100px;}
    .redes{margin-top: -30px;}
    #concretos{margin-top: -100px; }
    #pie2{ margin-top: 20px;}
    #pie2 img{margin-right: 100px;}
    #redes2{margin-right: -300px margin-top:10px;}
}

@media (max-width: 730px) {
    /*estilos del nav y footer*/
    .navbar{position: relative;}
    
    #concretos{margin-top: 20px; float: left; margin-left: 250px;}
    .redes{margin-top: 15px; float:left; margin-left: 300px;}
    .navbar{margin-top: 100px; width: 590px; margin-left: 40px;}
    #pie ul li:nth-child(9){border-left: solid thin ;}
    #logos{margin-left: 90px;}
    #parrafo1 p{width: 500px;}
}

@media (max-width: 689px) {
    /*estilos del nav y footer*/
    .navbar .btn-navbar{display: block;}
    .nav-collapse, .nav-collapse.collapse {overflow:hidden;}
    .navbar p{display: block; text-align: center; font-size: 14px; margin: 10px 0px 0px 0px; color: #008c99; font-weight: bold; font-family:'Armata', sans-serif;}
    .navbar{width: 370px; border: 2px solid #008c99; border-radius: 5px; margin-left: 75px; background-color: #f5f2f2;}
    .icon-th-list{background: url(http://www.mc3arquitectos.com/img/menu.png); background-position-y: -2px;}
    .navbar .btn-navbar {margin-bottom: 2px;}
    .redes{margin-top: 12px; margin-left: 180px; background-size: auto;}
    #concretos{margin-left: 130px; }
    .nav li a{width: 270px; }
    #menu .nav{ margin-top: 0px; margin-left: 38px;}
    #pie #pie_oculto, #pie #terminos{display: none;}
    #pie2 #redes2{ margin-right: 280px; margin-top: -40px; margin-bottom: 0px;}
    #pie2 img{ margin-right: 200px;  margin-top: -60px; margin-bottom: 0px;}
    #pie p{ text-align: center;}
    .nav li{margin-left: 40px;}
    #logos{margin-left: 45px;}
    footer{height: 120px;}
}

@media (max-width:590px){
    #pie2 #redes2{ margin-right: 220px; margin-top: -40px; margin-bottom: 0px;}
    #pie2 img{ margin-right: 150px;  margin-top: -60px; margin-bottom: 0px;} 
}

@media (max-width: 476px){
    /*estilos del nav y footer*/
    #pie ul li:nth-child(5){border-style: none; margin-left: -5px;}
    #pie ul li:nth-child(7){border-left: solid thin ;}
    .redes{margin-top: 12px; margin-left: 150px;}
    .navbar{width: 300px; margin-left: 50px;}
    #concretos{margin-left: 100px;}
    footer{height: 120px;}
    #pie2 #redes2{ margin-right: 170px; margin-top: -40px; margin-bottom: 0px;}
    #pie2 img{ margin-right: 100px;  margin-top: -60px; margin-bottom: 0px;} 
    .nav li a{width: 200px; }
    #logos{margin-left: 0px;;}
}

@media (max-width: 460px){
    /*estilos del nav y footer*/
    #pie ul li:nth-child(5){border-style: none; margin-left: -5px;}
    #pie ul li:nth-child(6){border-left: solid thin ;}
    footer{height: 120px;}
    #pie2 #redes2{ margin-right: 160px; margin-top: -40px; margin-bottom: 0px;}
    #pie2 img{ margin-right: 80px;  margin-top: -60px; margin-bottom: 0px;} 
    .navbar{width: 300px;}   
}

@media (max-width: 390px){
    /*estilos del nav y footer*/
    #concretos img{width: 250px; margin-left: -30px;}
    .redes{margin-top: 12px; margin-left: 100px;}
    .navbar{width: 250px; margin-left: 18px;}
    #imagen1, #imagen2{width: 190px;}
    #logotipo{margin-top: 10px;}
    .nav li a{width: 150px; }
    footer{height: 120px;}
    #pie2 #redes2{ margin-right: 100px; margin-top: -40px; margin-bottom: 0px;}
    #pie2 img{ margin-right: 20px;  margin-top: -60px; margin-bottom: 0px;} 
}

@media (max-width: 390px){  
     #terminos li{line-height: 10px; text-align: center; font-size: 10px; margin-top: 10px;}
     #terminos {line-height: 35px; text-align: center; font-size: 10px;}
     #pie p{text-align: center; }
     #concretos{width: 300px; margin-left: 50px;}
     .redes{margin-right: 10px;}
     #pie_oculto{display: none}
}