/*Generales*/ * {margin:0; padding:0;} body {font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; color:#999; font-size:62.5%; background:url(img/bg.png) repeat top left; background-color:#ccc;} a {color:#151579; text-decoration:none;} a:hover {text-decoration:underline;} .clear {clear:both;} #MainContainer {width:1000px; background:url(img/main_bg.png) repeat-y top left; margin:0 auto;} #Wrapper {width:960px; margin: 0 auto 0; position:relative;} /**HEADER**/ #MainContainer #Wrapper #Header {padding-top:60px; position:relative; height:36px; margin-bottom:35px;} #MainContainer #Wrapper #Header h1 a {background:url(img/durakret_logo.png) no-repeat top left; width:180px; height:38px; display:block; margin-left:30px;} #MainContainer #Wrapper #Header h1 a span {display:none;} /*Nav*/ #MainContainer #Wrapper #Header ul#nav {float:right; list-style-type:none; width:320px; height:20px; position:absolute; bottom:-1px; right:30px;} #MainContainer #Wrapper #Header ul#nav li {display:inline;} #MainContainer #Wrapper #Header ul#nav li a {display:block; float:left; height:20px; background:url(img/nav.png) no-repeat top left; margin-right:20px;} #MainContainer #Wrapper #Header ul#nav li a span {display:none;} #MainContainer #Wrapper #Header ul#nav li.inicio a {width:32px; background-position:0 4px;} #MainContainer #Wrapper #Header ul#nav li.nosotros a {width:51px; background-position:-50px 4px;} #MainContainer #Wrapper #Header ul#nav li.productos a {width:58px; background-position:-120px 4px;} #MainContainer #Wrapper #Header ul#nav li.clientes a {width:47px; background-position:-197px 4px;} #MainContainer #Wrapper #Header ul#nav li.contacto a {width:52px; background-position:-265px 4px; margin:0;} #MainContainer #Wrapper #Header ul#nav li.inicio a.active, #MainContainer #Wrapper #Header ul#nav li.inicio a:hover {background-position:0 -25px;} #MainContainer #Wrapper #Header ul#nav li.nosotros a.active , #MainContainer #Wrapper #Header ul#nav li.nosotros a:hover {background-position:-50px -25px;} #MainContainer #Wrapper #Header ul#nav li.productos a.active, #MainContainer #Wrapper #Header ul#nav li.productos a:hover {background-position:-120px -25px;} #MainContainer #Wrapper #Header ul#nav li.clientes a.active, #MainContainer #Wrapper #Header ul#nav li.clientes a:hover {background-position:-197px -25px;} #MainContainer #Wrapper #Header ul#nav li.contacto a.active, #MainContainer #Wrapper #Header ul#nav li.contacto a:hover {background-position:-265px -25px;} /**ACCORDION**/ #MainContainer #Wrapper #menu {margin:0 auto 5px;width:900px;height:344px;border:0px solid #F00;overflow:hidden; padding:1px; border-bottom:1px solid #ebebeb; border-top:1px solid #ebebeb;} #MainContainer #Wrapper #slide {width:8000px;height:340px;} #MainContainer #Wrapper #menu #slide .opcion {float:left;height:344px;border:0px solid #000;overflow:hidden;} #MainContainer #Wrapper #menu #slide .opcion .tag {float:left;border-right:0px solid #000099;width:30px;height:345px;cursor:pointer; background:url(img/accordion.png) no-repeat top left;} #MainContainer #Wrapper #menu #slide #opcion1 {z-index:1;} #MainContainer #Wrapper #menu #slide #opcion2 {z-index:2;} #MainContainer #Wrapper #menu #slide #opcion3 {z-index:3;} #MainContainer #Wrapper #menu #slide #opcion4 {z-index:4;} #MainContainer #Wrapper #menu #slide #opcion5 {z-index:5;} #MainContainer #Wrapper #menu #slide #opcion1.opcion #tag1.tag {background-positon:0 0px;} #MainContainer #Wrapper #menu #slide #opcion2.opcion #tag2.tag {background-position:-30px 0px;} #MainContainer #Wrapper #menu #slide #opcion3.opcion #tag3.tag {background-position:-60px 0px;} #MainContainer #Wrapper #menu #slide #opcion4.opcion #tag4.tag {background-position:-90px 0px;} #MainContainer #Wrapper #menu #slide #opcion5.opcion #tag5.tag {background-position:-120px 0px;} #MainContainer #Wrapper #menu #slide #opcion1.opcion #tag1.tag.active, #MainContainer #Wrapper #menu #slide #opcion1.opcion #tag1.tag:hover {background-position:0 -348px;} #MainContainer #Wrapper #menu #slide #opcion2.opcion #tag2.tag.active, #MainContainer #Wrapper #menu #slide #opcion2.opcion #tag2.tag:hover {background-position:-30px -348px;} #MainContainer #Wrapper #menu #slide #opcion3.opcion #tag3.tag.active, #MainContainer #Wrapper #menu #slide #opcion3.opcion #tag3.tag:hover {background-position:-60px -348px;} #MainContainer #Wrapper #menu #slide #opcion4.opcion #tag4.tag.active, #MainContainer #Wrapper #menu #slide #opcion4.opcion #tag4.tag:hover {background-position:-90px -348px;} #MainContainer #Wrapper #menu #slide #opcion5.opcion #tag5.tag.active, #MainContainer #Wrapper #menu #slide #opcion5.opcion #tag5.tag:hover {background-position:-120px -348px;} #MainContainer #Wrapper #menu #slide #img1{background:url(img/main_factoryinside.jpg) no-repeat top left;float:left;width:750px;height:344px;} #MainContainer #Wrapper #menu #slide #img2{background:#333;float:left;width:750px;height:344px;background:url(img/main_alimenticio.jpg) no-repeat top left;} #MainContainer #Wrapper #menu #slide #img3{background:#555;float:left;width:750px;height:344px;background:url(img/main_gonzalez.jpg) no-repeat top left;} #MainContainer #Wrapper #menu #slide #img4{background:#777;float:left;width:750px;height:344px;background:url(img/main_taller.jpg) no-repeat top left;} #MainContainer #Wrapper #menu #slide #img5{background:url(img/main_extra.jpg) no-repeat top left; float:left;width:750px;height:344px;} /**SECONDARY INFO**/ #MainContainer #Wrapper #secondary_info {width:900px; margin-left:30px;} #MainContainer #Wrapper #secondary_info .block {width:300px; text-align:center; float:left; background:url(img/separador.png) no-repeat center right;height:140px;} #MainContainer #Wrapper #secondary_info .block h3 {padding-top:45px; font-size:1.3em; font-weight:normal;} #MainContainer #Wrapper #secondary_info .block h3 a#go {padding-top:55px; font-weight:bold;} #MainContainer #Wrapper #secondary_info .block p {color:#838383; font-size:1.2em; margin-top:10px;} #MainContainer #Wrapper #secondary_info .block.last {background:none;} #MainContainer #Wrapper #secondary_info .block a.more {background:url(img/ver_sprites.png) no-repeat top left; height:14px; display:block; margin:35px 0 0 100px; width:86px;} #MainContainer #Wrapper #secondary_info .block a.more.clientes {background-position:-86px top;} #MainContainer #Wrapper #secondary_info .block a.more.nosotros:hover {background-position:left bottom;} #MainContainer #Wrapper #secondary_info .block a.more.clientes:hover {background-position:-86px bottom;} #MainContainer #Wrapper #secondary_info .block a#contactanos {height:43px; width:197px; display:block; background:url(img/button_contactanos.png) no-repeat top left; margin:17px auto 0;} #MainContainer #Wrapper #secondary_info .block a#contactanos:hover {background-position:bottom left;} /**FOOTER**/ #MainContainer #Wrapper #footer {margin-top:12px; font-size:1em; margin:0 30px 0; height:30px; border-top:1px solid #ebebeb; padding-top:12px;} #MainContainer #Wrapper #footer span {margin:0 5px;} #MainContainer #Wrapper #footer ul {list-style-type:none; color:#acacac; float:left;} #MainContainer #Wrapper #footer ul li {display:inline;} #MainContainer #Wrapper #footer ul li a {color:#acacac;} #MainContainer #Wrapper #footer ul li a.active {font-weight:bold; color:#838383;} #MainContainer #Wrapper #footer p.right {float:right;} #MainContainer #Wrapper #footer p.right a {color:#acacac;} #MainContainer #Wrapper #footer #credito {margin-top:7px;} /******************************** NOSOTROS ********************************/ #MainContainer #Wrapper #main_info {margin-left:30px; width:590px; color:#6b6b6b; min-height:450px;} #MainContainer #Wrapper #main_info h2 {font-size:1.8em; padding-bottom:5px; border-bottom:1px solid #ebebeb; color:#4e7cb7; margin-bottom:15px;} #MainContainer #Wrapper #main_info h3 {font-size:1.3em; margin-bottom:8px;} #MainContainer #Wrapper #main_info p {font-size:1.3em; line-height:20px; margin-bottom:25px;} #MainContainer #Wrapper #main_info p#intro {margin-bottom:40px;} #MainContainer #Wrapper #main_info p.last {margin-bottom:35px;} #MainContainer #Wrapper #main_info p.again {margin-bottom:10px;} #MainContainer #Wrapper #contacto {float:right; width:280px; margin-right:30px; text-align:center;border-top:1px solid #ebebeb; color:#686868; margin-top:27px;} #MainContainer #Wrapper #contacto h3 {margin-top:30px; border:none; font-weight:normal;} #MainContainer #Wrapper #contacto a {color:#6b6b6b;} #MainContainer #Wrapper #contacto a {height:43px; width:197px; display:block; background:url(img/button_contactanos.png) no-repeat top left; margin:15px 0 0 44px;} #MainContainer #Wrapper #contacto a:hover {background-position:bottom left;} /******************************** PRODUCTOS ********************************/ #MainContainer #Wrapper #main_info .producto {margin-bottom:10px; clear:right;} #MainContainer #Wrapper #main_info .producto a.arriba{background:url(img/top.png) no-repeat center right; float:right; padding-right:10px;} #MainContainer #Wrapper #main_info .producto h3 {margin:0 0 15px 150px; color:#333; font-size:1.5em;} #MainContainer #Wrapper #main_info .producto .pic {float:left; width:120px;} #MainContainer #Wrapper #main_info .producto .pic a {margin-top:5px; font-size:1.0em; display:block; text-align:center;} #MainContainer #Wrapper #main_info .producto .pic a img {border:none;} #MainContainer #Wrapper #main_info .producto .pic a span {font-size:.8em;} #MainContainer #Wrapper #main_info .producto .specific{float:right; width:440px; margin-bottom:40px;} /******************************** CLIENTES ********************************/ #MainContainer #Wrapper #main_info .clientes {float:left; width:250px; margin:0 90px 30px 0;} #MainContainer #Wrapper #main_info .clientes.right {margin-right:0;} #MainContainer #Wrapper #main_info .clientes h3 {margin-bottom:20px; font-size:1.4em;} #MainContainer #Wrapper #main_info ul.lista_clientes {list-style-position:inside; list-style-type:square;} #MainContainer #Wrapper #main_info ul.lista_clientes li {color:#999; margin-bottom:7px;font-size:1.2em;} /******************************** CONTACTO ********************************/ #MainContainer #Wrapper #main_info form {margin-bottom:10px; font-size:1.2em;} #MainContainer #Wrapper #main_info form label{width:100px; float:left;} #MainContainer #Wrapper #main_info form input, #MainContainer #Wrapper #main_info form textarea {width:400px; margin-bottom:10px;} #MainContainer #Wrapper #main_info form input.submit-button {width:110px; float:right; height:30px; margin:0 86px 25px 0;} #MainContainer #Wrapper #main_info a.gracias {font-size:1.2em;} /*Derecha*/ #MainContainer #Wrapper #info_contacto {float:right; width:280px; margin-right:30px; border-top:1px solid #ebebeb; color:#686868; margin-top:28px; font-size:1.1em;height:500px;} #MainContainer #Wrapper #info_contacto h3 {margin:28px 0 10px 10px; text-decoration:underline;} #MainContainer #Wrapper #info_contacto ul {list-style-type:none; margin:0 0 20px 10px;} #MainContainer #Wrapper #info_contacto ul li {margin-bottom:5px;} #MainContainer #Wrapper #info_contacto a {margin:0 0 20px 10px; display:block;} #MainContainer #Wrapper #info_contacto #map_container {width:220px; background-color:#dfdfdf; height:180px; margin-left:10px;} #MainContainer #Wrapper #info_contacto #map_container iframe {margin:10px;}