/* Colores básicos */

:root {
    --color1: #f30; /* Rojo  normal */
    --color2: #dd4627; /* Naranja hover */
    --color3: #666666; /* Gris */
}

.btn-primary {
    background-color: var(--color1);
}
.btn-primary:hover {
    background-color: var(--color2);
    border: var(--color2);
}

/* header */
.header-top {
    background-color: var(--color1);
}
.header-top-nav li a i{
    color: #fff;
}
.header-middle {
    background-color: #fff;
}
.header-middle li a {
    color: #333;
}
.header-middle .slogan h2 {
    color: #CCC; margin-top: 20px;
}

.main-menu .nav > li > a:hover,
.main-menu .nav > li > a:focus,
.main-menu .nav > li > a.selected {
    background-color: rgba(0, 0, 0, 0);
    color: inherit;
    border-bottom-style: solid;
    border-bottom-width: 3px;
    border-bottom-color: var(--color1);
}

/* Enlaces */
a {
    color: var(--color1);
}

a:hover {
    color: var(--color2);
    text-decoration: none;
}


/* menu */
.nav > ul > li {
    margin: 0 4px 0 32px;
    font-size: 0.9em;
    list-style-type: square;
    color: #ccc;
}

.nav-list > li > a {
    color: #333;
    font-weight: bold;
}

/* menu secundario */
.secondary-nav .nav > li > a:hover {
    color: var(--color2);
}


/* Cabecera libro */

.book-title {
    color: var(--color1);
    font-weight: bold;
}

a:hover .book-cover {
    -webkit-box-shadow: 0 1px 6px var(--color2);
    -moz-box-shadow: 0 1px 6px var(--color2);
    box-shadow: 0 1px 6px var(--color2);
}

.book-synopsis {
    color: var(--color3);
}

/* Price */

.box-price .price {
    color: var(--color1);
}

/* footer */
footer {
    background-color: var(--color1);
}

/* Responsive */


.btn_header .menu-bar {
    background-color: var(--color1);
}

.sidr.left, #sidr-search {
    background-color: var(--color1);
}

.sidr ul.navtoggle .separator,
.sidr ul li {
    border-bottom: none;
}

.sidr.left ul li a {
    color: #fff;
    border-bottom: 1px solid #fff;
}
.sidr.left ul li a:hover {
    background-color: var(--color2);
    color: #fff;
}

.secondary-nav a#more-links-toggle {
    background-color: var(--color1);
}


/* Logo */
@media (max-width: 767px) {
.image-logo {
        height: auto;
    }
}