/*
Theme Name: Blackcolors
Theme URI: http://antsanchez.com/en/blackcolors
Author: Antonio Sanchez
Author URI: http://antsanchez.com
Description: Blackcolors is a highly customizable theme with a responsive-design and a minimalist-style, which tries to be so quick and efficient as possible.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blue, purple, yellow, red, orange, one-column, two-columns, left-sidebar, responsive-layout, custom-header, custom-menu, featured-images, post-formats, threaded-comments
Text Domain: Blackcolors

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* = Contents:
 *
 * 1. WordPress Core (Commons WP & Theme CSS tags)
 * 2. Links 
 * 3. Banner (header)
 * 4. Head Menu
 * 5. Sidebar
 * 6. Responsive Design Layout 
 * 7. Post
 * 8. Galleries
 * 9. Attachment Page for images
 * 10. Comments
 * 11. Foot Note
 *
-------------------------------------------------------------- */

/* =WordPress Core
-------------------------------------------------------------- */
.bypostauthor, .fecha{
    float:left;
    display:inline-block;
    margin:0 0 0 0.5em;
    padding:5px 0 5px 0;
}

.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #3498db;
    border: 1px solid #3498db;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 6px 4px 11px;
    text-align: center;
    border-radius:5px;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright{
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
    border:1px solid black;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
    font-style:italic;
}

table{
    margin:10px;
    padding:0;
    border:1px solid;
    border-radius: 5px;
}

thead th{
    text-align:center;
    background-color:#e74c3c;
}

td{
    padding:0.5em;
}

pre{
    overflow:scroll;
}

blockquote{
    font-family: Georgia, serif;
    font-style: italic;
    width:80%;
    margin-left:10%;
    padding:0.25em 0.25em 0.25em 2em;
    background-color:white;
    line-height: 1.45;
    position: relative;
    color: #383838;
    border-radius:5px;
}

blockquote:before{
    display: block;
    content: "\201C";
    font-size: 80px;
    position: absolute;
    left: -20px;
    top: -20px;
    color: #7a7a7a;
}

blockquote cite {
    color: #999999;
    font-size: 14px;
    display: block;
    margin-top: 5px;
}
 
blockquote cite:before {
    content: "\2014 \2009";
}

cite{
    width:80%;
    margin-left:10%;
}

.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
	max-width: 100%;
	height: auto;
}

.tags{
    font-size:0.9em;
}

/* End of WordPress Core
-------------------------------------------------------------- */
body{
    margin:0;
    padding:0;
    min-height:100%;
    background-color:#34495e;
    color:white;
    font-family: Georgia, serif;
}

#main{
    clear:both;
}

.sup{
    clear:both;
    visibility:hidden;
}


/* = Links
-------------------------------------------------------------- */
a, a:link, a:visited{
    text-decoration:none;
    color: #e67e22;
}

a:hover{
    text-decoration:none;
    color: #f1c40f;
}

.enlacesuperior, .enlacesuperio:link, .enlacesuperior:visited{
    color: white;
}

.button-pag{
    display:inline-block;
    padding:0.7em 1em 0.7em 1em;
    border-radius:10px;
    background-color:#2c3e50;
}
/* End of Links
-------------------------------------------------------------- */


/* = Banner
-------------------------------------------------------------- */
#logo img{
    max-width:200px;
    max-height:200px;
}
/* End of Banner
-------------------------------------------------------------- */


/* = Head Menu
-------------------------------------------------------------- */
    
#open-menu{
    display:block;
    font-size:3em;
}

@media(min-width:770px){
    #open-menu{
	display:none;
    }
}

#menu-principal{
    text-transform: uppercase;
    margin:0;
    padding:0;
}

#menu-principal ul{
    margin:0;
    padding:0;
}

#menu-principal li{
    padding-top:0.5em;
}

#menu-principal ul ul{
    display: none;
}

/* End of Head Menu
-------------------------------------------------------------- */

/* = Sidebar
-------------------------------------------------------------- */
#barra-lateral{
    text-align:right;
    overflow: hidden;
    color:white;
    
}

#barra-lateral li{
    list-style:none;
}

.sidebar-lateral{
    padding-top:2em;
}

.xoxo{
    margin:0;
    padding:0;
}

.xoxo li{
    list-style:none;
}

.xoxo ul{
    margin: 0;
    padding: 0;
}

.search-field{
    padding:0.4em;
}

.search-submit{
    margin-top:5px;
    padding:0.4em;
}
/* End of Sidebar
-------------------------------------------------------------- */


/* = Responsive Design Layout
-------------------------------------------------------------- */
#contenidos, #contenidos-gallery{
    clear:both;
    color:white;
    padding:1em 1em 1em 0.5em;
}

#end-contenidos{
    clear:both;
    float:right;
    margin-top:2em;
    display:inline-block;
}

@media(max-width:770px){
    
    #barra-lateral{
        margin-top:50px;
	text-align:center;
	padding: 0.5em;
    }
    
    #barra-superior{
        position:absolute;
        height:50px;
        top:0;
        right:0;
        left:0;
    }
    
    .caja-superior{
        display:inline;
        float:left;
        width:20%;
        height:50px;
    }
    
    .caja-centrado{
        width:100%;
        margin-top:17px;
        text-align:center;
        color:inherit;
        font-size:1em;
    }
    
    #contenidos, #contenidos-gallery{
	margin-top:20px;
	overflow:hidden;
    }
}


@media(min-width:770px){
     #open-menu{
	display:none;
    }
    
    #barra-lateral{
        position:fixed;
        width:200px;
        top:0;
        bottom:0;
        left:0;
        background-color:#2c3e50;
        padding:10px;
    }
    
    #barra-superior{
        position:absolute;
        height:100px;
        top:0;
        right:0;
    }
    
    #contenidos{
	padding-top:120px;
	padding-left:250px;
	padding-right:1em;
    }
    
    #contenidos-gallery{
	padding:120px 1em 1em 1em;
    }
    
    .caja-superior{
        display:inline;
        float:left;
        width:100px;
        height:100px;
    }
    
    .caja-centrado{
        width:100%;
        margin-top:22px;
        text-align:center;
        color:inherit;
    }
    
    .caja-centrado i{
        font-size:3em;
    }
}

#pie{
    clear:both;
    margin-top:100px;
    margin-left:240px;
}


.caja-amarilla{background-color:#f1c40f;}
.caja-amarilla-2{background-color:#f39c12;}
.caja-naranja{background-color:#e67e22;}
.caja-naranja-2{background-color:#d35400;}
.caja-roja{background-color: #e74c3c;}
.caja-roja-2{background-color: #c0392b;}
.caja-azul{background-color: #3498db;}
.caja-azul-2{background-color: #2980b9;}
.caja-turquesa{background-color: #1abc9c;}
.caja-turquesa-2{background-color: #1abc9c;}
.caja-purple{background-color:#9b59b6;}
.caja-purple-2{background-color: #8e44ad;}

.caja-centrado-texto{
        display:none;
        font-size:1em;
    }
    
    .caja-centrado:hover .caja-centrado-texto{
        display:block;
    }

/* End of Responsive Design Layout
-------------------------------------------------------------- */

/* = Post, article
-------------------------------------------------------------- */
.sticky{
    background-color:#2980b9;
    border-radius:10px;
}

/*.caja-amarilla{background-color:#f1c40f;}
.caja-amarilla-2{background-color:#f39c12;}
.caja-naranja{background-color:#e67e22;}
.caja-naranja-2{background-color:#d35400;}
.caja-roja{background-color: #e74c3c;}
.caja-roja-2{background-color: #c0392b;}
.caja-azul{background-color: #3498db;}
.caja-azul-2{background-color: #2980b9;}
.caja-turquesa{background-color: #1abc9c;}
.caja-turquesa-2{background-color: #1abc9c;}
.caja-purple{background-color:#9b59b6;}
.caja-purple-2{background-color: #8e44ad;}*/

.sticky a, .sticky a:visited{
    color: #f1c40f;;
}

.post-article{
    max-width:1200px;
    margin:0 auto;
    overflow:hidden;
}

.post-article img{
    max-width:100%;
}

.post-article-thumbnail{
	width:80%;
	margin:0 10%;
    }

@media(max-width:770px){
    .post-index{
	clear:both;
	margin-bottom:50px;
    }

}

@media(min-width:770px){
    .post-index{
	float:left;
	width:48%;
	padding:1%;
	height:700px;
	max-height:700px;
    }
    
    .post-index-thumbnail{
	max-height:215px;
    }
    
    .post-article-thumbnail{
	max-width:100%;
    }
}

@media(min-width:968px){
    .post-index{
	float:left;
	width:30%;
	padding:1%;
    }
    
    .post-index-thumbnail{
	max-height:180px;
    }
}

@media(min-width:1200px){
    .post-index{
	float:left;
	width:23%;
	padding:1%;
	height:750px;
	max-height:750px;
    }
}

@media(min-width:1400px){
    .post-index{
	float:left;
	width:18%;
	padding:1%;
	height:750px;
	max-height:750px;
    }
}

.post-index-thumbnail{
    width:100%;
}

.post-mas{
    clear:both;
}

.post-mas-izq{
    float:left;
    display:inline-block;
    width:70%;
    text-align:left;
}

.post-mas-der{
    float:right;
    display:inline-block;
    width:30%;
    text-align:right;
}

.post-edit{
    float:right;
    width:30%;
    padding:1em 0 1em 0;
    text-align:right;
}

.post-title-gallery{
    text-align:center;
    font-size:3em;
    color:#9b59b6;
}

/* End of post, article
-------------------------------------------------------------- */

/* = Galleries
-------------------------------------------------------------- */
.gallery{
   clear:both;
   border:1px solid white;
   margin:0 auto;
}
    .gallery-item {
        float: left;
        margin: 0;
	padding: 20px 0 20px 0;
        overflow: hidden;
        text-align:center;
    }
    
    .gallery-columns-1 .gallery-item { width: 100%;}
    .gallery-columns-2 .gallery-item { width: 50%;}
    .gallery-columns-3 .gallery-item { width: 33.3%;}
    .gallery-columns-4 .gallery-item { width: 25%;}
    .gallery-columns-5 .gallery-item { width: 22.5%;}
    .gallery-columns-6 .gallery-item { width: 16.66%;}
    .gallery-columns-7 .gallery-item { width: 14.2%;}
    .gallery-columns-8 .gallery-item { width: 12.5%;}
    .gallery-columns-9 .gallery-item { width: 11.1%; }

.attachment-thumbnail{
    border:2px solid;
}

.gallery-caption {
    position:relative;
    top:-2em;
    text-align: center;
    width: 100%;
    font-size:0.8em;
    font-style: italic;
    color:#34495e;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.gallery-columns-7 .gallery-caption,
.gallery-columns-8 .gallery-caption,
.gallery-columns-9 .gallery-caption {
    display: none;
}
/* End of Galleries
-------------------------------------------------------------- */

/* = Attachment Image
-------------------------------------------------------------- */
.imagenadjunta{
    text-align:center;
    max-width:90%;
    margin:5% auto;
}
/* End of Attachment Image
-------------------------------------------------------------- */

/* = Comments
-------------------------------------------------------------- */
#comentarios{
    clear:both;
    padding:3em 0 0 0;;
    
}

.listacomentarios{
    margin:0;
    padding:0;
}

.listacomentarios li{
    list-style:none;
}

.comment-author{
    margin-top:0.3em;
}

.comment-content{
    background-color:#ecf0f1;
    color:#34495e;
    padding:0.5em;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
}

.reply{
    background-color:white;
    padding:0.5em;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
}

@media(min-width:770px){
    .comment-content{
	width:90%;
	margin: 0 5% 0 5%;
	padding:0.5em;
    }
    
    .reply{
	width:90%;
	margin: 0 5% 1em 5%;
	padding:0.5em;
	text-align:right;
    }
    
}




#comment{
    width:90%;
}

#respond{
    clear:both;
}

.campo-comment{
    display:inline;
    float:left;
    width:100px;
}

.campo-comment-d{
    display:inline;
}

.comment-form input, .comment-form textarea{
    padding:0.4em;
}
/* End of comments
-------------------------------------------------------------- */

/* = Foot Note Developed by
-------------------------------------------------------------- */
@media(max-width:770px){
    #thefoot{
	margin-top:20px;
	overflow:hidden;
    }
}

@media(min-width:770px){
    #thefoot{
	clear:both;
	padding-top:20px;
	padding-bottom:20px;
	padding-left:250px;
	padding-right:1em;
    }
    
    .pie{
	float:left;
	width:30%;
	margin:1%;
    }
}

#creadopor{
    float:right;
    clear:both;
    font-size:0.9em;
}
/* End of Foot Note
-------------------------------------------------------------- */