/* 
    Document   : estilos
    Created on : 18/07/2011, 08:53:47 AM
    Author     : allan
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

@import "dropdown.css";
@import "default.css";
@import "plusslider.css";
@import "carousel.css";
@import "pagstyle.css";
@import "colorbox.css";

body {
    background: url('../images/background.jpg') repeat top left;
    padding: 0;
    margin: 0;
    font-size: 12px;
    font-family: 'Lucida Sans', 'Lucida Grande',sans-serif;
    color: #ffffff;
}

a {
    color: #ffffff;
}

a:hover { color: #CC2127; }

a img {
    border: none;
}

#main-container {
    width: 915px;
    margin: 0 auto;
    margin-top: 20px;
    background-color: #000000;
    border: 1px solid #605f5f;
}

#header {
    width: 915px;
    height: 188px;
}

#logo {
    width: 314px;
    height: 122px;
    padding: 18px 144px 7px 310px;
    float: left;
}

#top-menu {
    width: 127px;
    height: 127px;
    float: left;
    padding: 10px;
    color: #ffffff;
    text-align: right;
    line-height: 12px;
}

#top-menu a { padding: 0 5px; }

#main-menu {
    width: 913px;
    height: 39px;
    border: 1px solid #a6503b;
}

#content {
    width: 905px;
    padding: 5px;
}

#content-pages {
    padding: 15px 40px;
    width: 825px;
}

#content-pages h3 { 
    text-transform: capitalize;
    font-size: 16px;
}

#content-pages .image {
    margin: 0 15px 15px 0;
}

#productos-container .producto, 
#galeria-container .galeria,
#galeria-container .imagen,
#content-pages .image {
    float: left;
    padding: 3px;
    background-color: #ffffff;
    border: 1px solid #666666;
    color: #605f5f;
    text-align: center;
}

#galeria-container .galeria {
    width: 170px;
}

#productos-container .producto .imagen,
#galeria-container .galeria .imagen, 
#galeria-container .imagen {
    width: 160px;
    height: 140px;
}

#productos-bicicletas .producto {
    float: left;
    width: 260px;
    margin: 0 15px 15px 0;
}

#productos-bicicletas .producto img { 
    width: 260px;
    height: 164px;
}

#servicios-container {
    width: 825px;
}

#servicios-container .listado {
    width: 325px;
    float: left;
}

#servicios-container .listado a { text-decoration: none; }

#servicios-container .listado ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#servicios-container .listado ul li {
    padding: 5px 0;
}

#servicios-container .descripcion h4,
#servicios-container a.active,
#content-pages h4 {
    color: #cc2128;
}

#servicios-container .imagen {
    width: 500px;
    float: left;
    min-height: 330px;
}

#banner-home {
    width: 905px;
    height: 310px;
}

#carousel {
    margin-top: 16px;
    width: 905px;
    background-color: #ffffff;
    height: 150px;
}

#carousel .title {
    height: 15px;
    line-height: 15px;
    padding: 8px 10px;
    font-size: 15px;
    color: #ffffff;
}

#carousel .content {
    width: 905px;
    height: 118px;
}

#calendar {
    background-color: #ffffff;
    color: #605f5f;
}

.box ,
#calendar a { color: #605f5f; }

#footer {
    width: 885px;
    padding: 20px 15px 10px 15px;
    color: #ffffff;
    border-top: 1px solid #605f5f;
}

#footer-logo {
    width: 141px;
    height: 50px;
    float: left;
}

#foot-lima {
    width: 885px;
    margin: 0 auto;
    font-size: 10px;
    text-align: center;
    padding: 10px 0;
}

#contact-info {
    width: 704px;
    height: 26px;
    float: left;
    padding: 12px 20px;
}

ul.navigation li:last-child  { border-right: none; }
ul.navigation ul li { border-right: none; }
ul.navigation li ul li:last-child  { border-bottom: none; }

ul.navigation li a:hover { color: #ffffff; }

ul.navigation li a.menu1 { width: 182px; }
ul.navigation li a.menu2 { width: 108px; }
ul.navigation li a.menu3 { width: 128px; }
ul.navigation li a.menu4 { width: 204px; }
ul.navigation li a.menu5 { width: 98px; }
ul.navigation li a.menu6 { width: 78px; }
ul.navigation li a.menu7 { width: 108px; }

#main-menu,
ul.navigation li a,
.box .title,
#content .title,
.zend_form .button {
    background: #cc2128; /* Old browsers */
    background: -moz-linear-gradient(top, #cc2128 0%, #9c212d 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cc2128), color-stop(100%,#9c212d)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #cc2128 0%,#9c212d 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #cc2128 0%,#9c212d 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #cc2128 0%,#9c212d 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc2128', endColorstr='#9c212d',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #cc2128 0%,#9c212d 100%); /* W3C */
}

ul.navigation li:hover a:hover ,
.zend_form .button:hover {
    background: #9c212d; /* Old browsers */
    background: -moz-linear-gradient(top, #9c212d 1%, #cc2128 96%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#9c212d), color-stop(96%,#cc2128)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #9c212d 1%,#cc2128 96%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #9c212d 1%,#cc2128 96%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #9c212d 1%,#cc2128 96%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9c212d', endColorstr='#cc2128',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #9c212d 1%,#cc2128 96%); /* W3C */
}

.box {
    width: 291px;
    height: 170px;
    float: left;
    background-color: #ffffff;
    margin-right: 16px;
    margin-top: 16px;
}

.box .title {
    height: 15px;
    line-height: 15px;
    padding: 8px 10px;
    font-size: 15px;
    color: #ffffff;
}

.box .title a { text-decoration: none; }
.box .title a:hover  { 
    color: #ffffff;
    text-decoration: underline;
}

.box .title img {
    padding-left: 8px;
}

.box .content {
    padding: 10px;
}

.box .content .image {
    width: 150px;
    height: 120px;
    float: left;
}

.box .content .text {
    padding-left: 10px;
    width: 110px;
    float: left;
}

.box .rojo { 
    color: #cc2128;
    display: block;
}

.last { margin-right: 0; }

.news .new {
    padding: 10px 0;
    border-bottom: 1px dotted #9c212d;
    margin-bottom: 10px;
}

.news h4 {
    padding-top: 0;
    margin-top: 0;
}

.news .content {
    padding-bottom: 10px;
}

.news .public-date {
    font-size: 10px;
    width: 50%;
    text-align: left;
    display: block;
    float: left;
}

.news .read-more {
    width: 50%;
    text-align: right;
    float: left;
    font-size: 10px;
}

.clear { clear: both; }
