/* -----------------------------------------
Titulo		: SUM Agency	
Autor		: Juanma Teixido
URL 		: www.sumagency.com

Descripcion : CSS para nuestro sitio web

Creado 		: 24 de Diciembre, 2006
Modificado	: 3 de Enero, 2007

Tabla de
contenidos  : body
			  tipografia
			  links
			  layout
------------------------------------------ */

/*div {
	border: 1px solid Red;
}*/

body {
	margin-left: 0px;
	margin-top: 30px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: #f9f8f5;
	font-size: small;
	}
* 	html body { 
	font-size: x-small; /* para IE5/WIN */
	f\ont-size: small; /*for other IE versions*/
}
body,td,th {
	font-family: "Lucida Grande", Verdana, sans-serif;
	color: #666;
}

body#reel { 
	background-color: black;
}

div.wraper {
	width: 990px;
	/* width: 920px was the old size */
	display: block;
	margin-left: auto;
	margin-right: auto; 
	padding-left: 30px;
	padding-right: 30px;
}
div.wraper_footer { 
	width: 920px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 60px;
	padding-left: 30px;
	padding-right: 30px;
}

/*****************************************************/
/* TIPOGRAFIA                               		 */
/***************************************************/

/* H1, H2, H3
----------------------------------------------- */

h1 { 
	font-weight: normal;
	font-size: 195%;
	line-height: 130%;
	margin-top: 0px;
	color: #08b9c2;
}

div.sheet_bios h1 { 
	margin-bottom: 0;
}

body#reel h1 { 
	color: white;
	font-size: 130%;
}
#main h1 { 
	color: #fff;
	margin: 0;
	margin-bottom: 10px;
}
div.post h1 { 
	margin-top: 0px;
	margin-bottom: 0px;
}
span.category {
	font-style: italic;
}

span.category a {
	font-style: italic;
}

span.category a:hover {
	text-decoration: underline;
}

body#agency #main h1 { 
	color: #fff;
}

body#agency #main h3 {
	color: #EB1E25;
	font-weight: bold;
}

body#works #main h1 { 
	color: #fff;
}
body#clients #main h1 { 
	color: #fff;
}
body#services #main h1 { 
	color: #fff;
}
body#blog #main h1 { 
	color: #fff;
}
body#contact #main h1 { 
	color: #fff;
}
#footer h1 { 
	margin-bottom: 10px;
	margin-top: 0px;
	color: #fff;
	font-size: 160%;
}
body#reel #footer h1 { 
	color: #b8b8b8;
}

div.lista_servicio h1, div.lista_servicio_final h1 { 
	line-height: 95%;
}
h2 { 
	font-weight: normal;
	font-size: 150%;
	line-height: 130%;
	margin-top: 0px;
	color: #ed1d25;
	margin-bottom: 10px;
}
div.bios h2 { 
	font-weight: normal;
	font-size: 150%;
	line-height: 130%;
	margin-top: 0px;
	color: #ed1d25;
	margin-bottom: 0px;
}
span.blog_date { 
	font-weight: normal;
	font-size: 100%;
	line-height: 130%;
	margin: 0px;
	color: #ed1d25;
	margin-bottom: 10px;
}

h3 { 
	font-weight: normal;
	font-size: 120%;
	margin-top: 0px;
	color: #ec1d25;
	margin-bottom: 10px;
}

/* P, SPAN
----------------------------------------------- */
#main p, #main li { 
	line-height: 160%;
	margin: 0;
}
#columna_index_blog p { 
	font-size: 125%;
	line-height: 160%;
}
#blog_calendar p { 
	margin: 0;
	color: #5b5950;
	line-height: 100%;
}
#blog_calendar p#mes { 
	font-size: 80%;
	margin-bottom: -1px;
		font-weight: bold;
}
#blog_calendar p#dia { 
	font-size: 120%;
	font-weight: bold;
}
body#blog p.post_date { 
	color: #49321d;
	margin: 0;
	margin-bottom: -5px;
}
body#hello p.blog_read_more, body#blog p.blog_read_more { 
	font-size: 130%;
	text-align: right;
	color: #3ababb;
	margin-bottom: 0;
}
body#blog p.blog_back { 
	font-size: 130%;
	color: #49321d;
	margin-bottom: 0;
}

body#works p.post_date { 
	color: #08b9c1;
	margin: 0;
	margin-bottom: -5px;
}
body#works p.blog_read_more { 
	font-size: 130%;
	text-align: right;
	color: #08b9c1;
}
body#works p.blog_back { 
	font-size: 130%;
	color: #08b9c1;
}

small {
	font-size: 75%;
	font-style:italic;
	color:#CCCCCC;
}

/*****************************************************/
/* LINKS                               		 */
/***************************************************/

/* Links de colores para cada pagina
---------------------------------------*/
a { 
	color: #07bac1;
	text-decoration: none;
}
a:hover { 
	color: #07bac1;
}
ul a:hover { 
	text-decoration: underline;
}
#contenido p a, div.post p a { 
	border-bottom: 1px dotted #07bac1;
}
#contenido p a:hover, div.post p a:hover { 
	border-bottom: 1px solid #07bac1;
}

/* Links agency
---------------------------------------*/
body#agency #contenido_interna p a { 
	color: #08b9c1;
	border-bottom: 1px dotted #08b9c1;
}
body#agency #contenido_interna p a:hover{ 
	border-bottom: 1px solid #08b9c1;
}
body#agency #contenido_interna li a { 
	color: #738900;
	text-decoration: none;
}
body#agency #contenido_interna li a:hover { 
	color: #738900;
	text-decoration: none;
	border-bottom: 1px dotted #738900;
}

/* Links Works
---------------------------------------*/
body#works #contenido_interna p a, a.naranja { 
	color: #08b9c1;
	border-bottom: 1px dotted #08b9c1;
}
body#works #contenido_interna p a:hover, a.naranja:hover { 
	border-bottom: 1px solid #08b9c1;
}
body#works #columna_interna_2 li a { 
	color: #08b9c1;
}



/* Links clients
---------------------------------------*/
body#clients #contenido_interna p a{ 
	color: #e69801;
	border-bottom: 1px dotted #e69801;
}
body#clients #contenido_interna p a:hover { 
	border-bottom: 1px solid #08b9c1;
}

/* Links services
---------------------------------------*/
body#clients #contenido_interna p a { 
	color: #981b1b;
	border-bottom: 1px dotted #981b1b;
}
body#clients #contenido_interna p a:hover{ 
	border-bottom: 1px solid #981b1b;
}
#contenido p a, div.post p a { 
	border-bottom: 1px dotted #49321d;
}

#contenido p a:hover, div.post p a:hover { 
	border-bottom: 1px solid #49321d;
}
#columna_index_blog ul a{ 
	color: #666;
}
#footer a {
	color: #fff;
}
h1 a, h1 a:hover, h2 a, h2 a:hover { 
	color: #08b9c2;
	text-decoration: none;
}

body#agency #main a { 
	color: #08b9c3;
}
body#works #main a { 
	color: #08b9c3;
}
body#clients #main a { 
	color: #08b9c3;
}
body#services #main a { 
	color: #08b9c3;
}
body#blog #main a { 
	color: #08b9c3;
}
body#contact #main a { 
	color: #08b9c3;
}
body#agency #main a:hover, body#works #main a:hover, body#clients #main a:hover, body#services #main a:hover, body#blog #main a:hover, body#contact #main a:hover { 
	text-decoration: underline;
}

body#works #columna_interna_2 ul a,
body#blog #columna_interna_2 ul a{ 
	color: #666;
}

/* Links Reel
---------------------------------------*/
body#reel #columna_reel_2 p a{ 
	color: #fff;
/*	border-bottom: 1px dotted #fff;*/
}
body#reel #columna_reel_2 p a:hover { 
	border-bottom: 1px solid #fff;
}

/*****************************************************/
/* LAYOUT    	                            		 */
/***************************************************/

/* Cabecera
----------------------------------------------- */
#cabecera { 
	width: 670px;
	height: 157px;
	float: left;
	padding-right: 90px;
	/* old padding 90px */
}


#cabecera ul { 
	list-style: none;
	margin-left: 0px;
	padding-left: 0px;
}
#cabecera ul li { 
	float: left;
}
#cabecera ul li a { 
	padding: 7px 9px 7px 10px;
	display: block;
	text-decoration: none;
	color: #666;
	border-right: 1px solid #f9f8f5;
}




body#reel #cabecera li a { 
	border-right: 1px solid #000;
}
body#hello li#menu_menu_hello a,
body#agency li#menu_menu_agency a, 
body#works li#menu_menu_works a, 
body#clients li#menu_menu_clients a, 
body#services li#menu_menu_services a, 
body#blog li#menu_menu_blog a, 
body#contact li#menu_menu_contact a { 
	cursor: default;
}
body#hello li#menu_hello a, li#menu_hello a:hover { 
	background: #ed1d25;
	border-right: 1px solid #a52611;
	border-bottom: 1px solid #a52611;
	color: #fff;
}

body#agency li#menu_agency a, li#menu_agency a:hover { 
	background: #ed1d25;
	border-right: 1px solid #a52611;
	border-bottom: 1px solid #a52611;
	color: #fff;
}

body#works li#menu_works a, li#menu_works a:hover { 
	background: #ed1d25;
	border-right: 1px solid #a52611;
	border-bottom: 1px solid #a52611;
	color: #fff;
}
body#clients li#menu_clients a, li#menu_clients a:hover { 
	background: #ed1d25;
	border-right: 1px solid #a52611;
	border-bottom: 1px solid #a52611;
	color: #fff;
}
body#services li#menu_services a, li#menu_services a:hover { 
	background: #ed1d25;
	border-right: 1px solid #a52611;
	border-bottom: 1px solid #a52611;
	color: #fff;
}
body#blog li#menu_blog a, li#menu_blog a:hover { 
	background: #ed1d25;
	border-right: 1px solid #a52611;
	border-bottom: 1px solid #a52611;
	color: #fff;
}
body#contact li#menu_contact a, li#menu_contact a:hover { 
	background: #ed1d25;
	border-right: 1px solid #a52611;
	border-bottom: 1px solid #a52611;
	color: #fff;
}
body#intranet li#menu_intranet a, li#menu_intranet a:hover{ 
	background: #ed1d25;
	border-right: 1px solid #a52611;
	border-bottom: 1px solid #a52611;
	color: #fff;
}
#cabecera h1 { 
	clear: both;
	margin: 0;
	margin-top: 92px;
}
#logo { 
	float: left;
}

/* Main
----------------------------------------------- */

#main { 
	clear: both;
	background: #faf8f5 url(../gfx/background/back_main_indexnew.jpg) repeat-x bottom;
	height: 218px;
	margin-bottom: 60px;
	padding-top: 30px;
}
#featured { 
	float:left;
	width: 284px;
}
#featured_text { 
	float:left;
	width: 324px;
	background: url(../gfx/background/back_featured_dotted.gif) no-repeat right 10px;
	padding-right: 30px;
	margin-top: 60px;
	color: white;
}
#featured_text ul { 
	margin-left: 0px;
	padding-left: 0px;
	list-style: none;
	margin-top: 10px;
}
#featured_text ul li { 
	float: left;
	margin-right: 30px;
}
#fresh { 
	float:left;
	width: 222px;
	padding-left: 30px;
	margin-top: 60px;
}
#fresh ul { 
	margin: 0;
	padding: 0px;
	list-style: none;
}
#fresh ul li a { 
	background: url(../gfx/icons_and_bullets/bullet_main_still_freshnew.gif) no-repeat 0px 50%;
	padding-left: 20px;
	color: #fff;
}

/* twitter
----------------------------------------------- */

#twitter_div li {
	padding: 0px 0px 0px 0px;
}

#twitter_update_list li {
 list-style-type: none;
}

#twitter_update_list a {
color: #00b3ac;
}

#twitter_div ul {
	padding: 0px 0px 0px 0px;
}

/* Main inner pages
----------------------------------------------- */

body#agency #main { 
	clear: both;
	background: #f9f8f4 url(../gfx/background/back_main_background.jpg) repeat-x bottom;
	height: 218px;
	margin-bottom: 60px;
	padding-top: 30px;
}
body#works #main { 
	clear: both;
	background: #f9f8f4 url(../gfx/background/back_main_background.jpg) repeat-x bottom;
	height: 218px;
	margin-bottom: 60px;
	padding-top: 30px;
}
body#clients #main { 
	clear: both;
	background: #f9f8f4 url(../gfx/background/back_main_background.jpg) repeat-x bottom;
	height: 218px;
	margin-bottom: 60px;
	padding-top: 30px;
}
body#services #main { 
	clear: both;
	background: #f9f8f4 url(../gfx/background/back_main_background.jpg) repeat-x bottom;
	height: 218px;
	margin-bottom: 60px;
	padding-top: 30px;
}
body#blog #main { 
	clear: both;
	background: #f9f8f4 url(../gfx/background/back_main_background.jpg) repeat-x bottom;
	height: 218px;
	margin-bottom: 60px;
	padding-top: 30px;
}
body#contact #main { 
	clear: both;
	background: #f9f8f4 url(../gfx/background/back_main_background.jpg) repeat-x bottom;
	height: 218px;
	margin-bottom: 60px;
	padding-top: 30px;
}

body#agency #inner_featured_text_1 p, 
body#agency #inner_featured_text_2 p,
body#clients #inner_featured_text_1 p, 
body#clients #inner_featured_text_2 p, 
body#services #inner_featured_text_1 p, 
body#services #inner_featured_text_2 p, 
body#blog #inner_featured_text_1 p, 
body#blog #inner_featured_text_2 p,
body#contact #inner_featured_text_1 p, 
body#contact #inner_featured_text_2 p { 
	color: white;
}
body#works #inner_featured_text_1,  
body#works #inner_featured_text_2  {
	color: #fff;
	background-image: none;
}

body#services #inner_featured_text_1,  
body#services #inner_featured_text_2  {
	background-image: none;
}


#inner_featured_text_1 { 
	float:left;
	width: 400px;
	background: url(../gfx/background/back_featured_dotted.gif) no-repeat right 10px;
	padding-right: 30px;
	margin-top: 60px;
}
#inner_featured_text_2 { 
	float:left;
	width: 400px;
	margin-top: 60px;
	margin-left: 30px;
}

/* Contenido
----------------------------------------------- */

#contenido { 
	background: url(../gfx/background/back_contenido_dottednew.gif) repeat-y;
	float: left;
	margin-bottom: 60px;
	line-height: 160%;
}
#blog_calendar { 
	width: 69px;
	height: 60px;
	float: left;
	background: url(../gfx/background/back_blog_calendarnew.jpg) no-repeat;
	padding-top: 17px;
}
#blog_calendar_container { 
	text-align: center;
	width: 47px;
}
#columna_index_blog { 
	width: 354px;
	margin-right: 62px;
	float: left;
}
#columna_index_blog ul { 
	margin: 0;
	padding: 0;
	list-style: none;
}
#columna_index_blog ul li { 
	background: url(../gfx/icons_and_bullets/icon_main_blog_posts.jpg) no-repeat left 50%;
	padding-left: 23px;
	line-height: 200%;
}
#columna_index_1 img, #columna_index_2 img { 
	float: right;
	margin-left: 5px;
}
#columna_index_1 { 
	width: 190px;
	margin-right: 62px;
	float: left;
}
#columna_index_2 { 
	width: 190px;
	float: left;
}

/* Contenido Reel
----------------------------------------------- */

#columna_reel_1 { 
	width: 550px;
	margin-right: 30px;
	margin-top: 60px;
	margin-bottom: 60px;
	float: left;
}
#columna_reel_2 { 
	width: 125px;
	float: left;
	margin-top: 60px;
}
#columna_reel_texto { 
	height: 270px;
	color: #999;
}

/* Contenido interna
----------------------------------------------- */

#contenido_interna { 
	float: left;
	line-height: 160%;
}
body#services #columna_interna_full { 
	width: 860px;
	background: url(../gfx/background/back_contenido_services.gif) repeat-y 0px 15px;
	float: left;
	margin-bottom: 60px;
}
div.lista_servicio { 
	float: left;
	margin-right: 50px;
	width: 170px;
	line-height: 140%;
}
div.lista_servicio_final { 
	line-height: 140%;
	float: left;
	width: 185px;
	background-color: #ebe8e0;
	padding: 10px 5px 5px 10px;
}


body#clients #columna_interna_full { 
	width: 860px;
	background: url(../gfx/background/back_contenido_clients.gif) repeat-y 0px 15px;
	float: left;
	margin-bottom: 60px;
}
div.lista_clientes { 
	float: left;
	margin-right: 60px;
	width: 246px;
	line-height: 140%;
}
div.lista_clientes_final { 
	line-height: 140%;
	float: left;
	width: 246px;
}


#columna_interna_1 { 
	width: 400px;
	margin-right: 61px;
	float: left;
	line-height: 160%;
}
#columna_interna_2 { 
	width: 400px;
	float: left;
	line-height: 160%;	
}

#columna_interna_3 { 
	width: 810px;
	float: left;
	line-height: 160%;	
}

body#blog #columna_interna_1 { 
	width: 582px;
	margin-right: 30px;
	float: left;
	background: url(../gfx/background/back_contenido_blog.gif) repeat-y; 
}
body#works #columna_interna_1 { 
	width: 582px;
	margin-right: 30px;
	float: left;
	background: url(../gfx/background/back_contenido_works.gif) repeat-y; 
}
body#blog #columna_interna_2, body#works #columna_interna_2 { 
	width: 250px;
	float: left;
}

div.post { 
	margin-bottom: 60px;
	padding-right: 30px;
}

div.sheet { 
	margin-bottom: 60px;
	float: left;
}
div.sheet_bios { 
	margin-bottom: 60px;
	float: left;
	padding-bottom:40px;
	background:  url(../gfx/background/back_bios_dotted.gif) repeat-x bottom;
}

div.sheet p img { 
	margin-top: 10px;
	margin-bottom: 10px;
}

div.sheet p img.float_right { 
	margin-top: 0px;
	margin-left: 15px;
	margin-bottom: 0px;
	float: right;
}
div.sheet p img.float_left { 
	margin-top: 0px;
	margin-right: 15px;
	margin-bottom: 0px;
	float: left;
}


/* Bios para Team
----------------------------------------------- */

div.illustration { 
	float: left;
	width: 300px;
	margin-right: 10px;
}
div.bios { 
	float: left;
	width: 500px;
}
div.bios_container { 
	margin-bottom: 25px;
	float: left;

}

/* LI, LIST, Para todas las paginas
----------------------------------------------- */

#columna_interna_full ul,
body#works #columna_interna_1 ul,
body#blog #columna_interna_1 ul,
body#agency #columna_interna_1 ul,
body#agency #columna_interna_2 ul, #columna_interna_3 ul { 
	margin: 0;
	padding: 0;
	list-style: none;
}
body#works #columna_interna_2 ul,
body#blog #columna_interna_2 ul { 
	margin-top: 0;
	margin-left: 0;
	margin-bottom: 30px;
	padding: 0;
	list-style: none;
}


#columna_interna_2 ul { 
	padding-bottom: 20px;
}


body#clients #columna_interna_full li { 
	padding-left: 17px;
	background: url(../gfx/icons_and_bullets/add_blue.gif) no-repeat 0 4px;
	padding-bottom: 10px;
}
body#services #columna_interna_full li { 
	padding-left: 17px;
	background: url(../gfx/icons_and_bullets/add_blue.gif) no-repeat 0 5px;
	padding-bottom: 10px;
}
body#blog #columna_interna_1 li, body#blog #columna_interna_2 li { 
	padding-left: 17px;
	background: url(../gfx/icons_and_bullets/add_red.png) no-repeat 0 5px;
}
body#works #columna_interna_1 li, body#works #columna_interna_2 li { 
	padding-left: 17px;
	background: url(../gfx/icons_and_bullets/add_red.png) no-repeat 0 6px;
}
body#agency #columna_interna_1 li, body#agency #columna_interna_2 li { 
	padding-left: 17px;
	background: url(../gfx/icons_and_bullets/add_red.png) no-repeat 0 5px;
/*	padding-bottom: 10px;*/
}

body#agency #columna_interna_3 li { 
	padding-left: 17px;
	background: url(../gfx/icons_and_bullets/add_red.png) no-repeat 0 5px;
/*	padding-bottom: 10px;*/
}

/* Footer
----------------------------------------------- */

#footer { 
	clear: both;
	height: 200px;
	background: #3ababb url(../gfx/background/back_footernew.jpg) repeat-x top;
	padding-top: 55px;
	line-height: 140%;
}

body#reel #footer { 
	background: #151515 url(../gfx/background/back_footer_reel.jpg) repeat-x top;
}

#footer ul { 
	margin: 0;
	padding: 0;
	list-style: none;
	color:#FFFFFF;
}
#footer li { 
	float: left;
}
#our_offices { 
	background: url(../gfx/background/back_footer_dottednew.gif) no-repeat 0px 10px;
	float: left;
	width: 390px;
}

#our_offices li.abq { 
	width: 125px;
	margin-right: 25px;
}
#our_offices li.asu { 
	width: 120px;
}

body#reel #our_offices { 
	background: url(../gfx/background/back_footer_dotted_reel.gif) no-repeat 0px 10px;
	padding-left: 82px;
	float: left;
	width: 304px;
}
#contact_us { 
	float: left;
	width: 250px;
	padding-left: 30px;
}

.box{
	background-color: #eee;
	padding: 10px; 
}

.blank{
	width:350px;
}

.forms{
	width:350px;
}

.form-s{
	display:none;
	width:350px;
}