﻿/* latino microsite stylesheet */

/*
** Colors
*/
.latinoGreen
{
	color: #639630;
}
.black
{
	color: black;
}
.darkGray
{
	color: #5A666A;
}
.gray
{
	color: #666666;
}
/*
** Links
*/
/* Use <a class="underlinedLink" ...> for a link that's always underlined */
A.underlinedLink:link, A.underlinedLink:visited
{
	text-decoration: underline;
}
A.underlinedLink:hover, A.underlinedLink:active
{
	text-decoration: underline;
}

A.darkGrayUnderlinedLink:link, A.darkGrayUnderlinedLink:visited
{
	color: #5A666A;
	text-decoration: underline;
}
A.darkGrayUnderlinedLink:hover, A.darkGrayUnderlinedLink:active
{
	color: #5A666A;
	text-decoration: underline;
}

/* Use <a class="uhoverLink" ...> for a link that's underlined only when it's hovered over. */
A.uhoverLink:link, A.uhoverLink:visited
{
	text-decoration: none;
}
A.uhoverLink:hover, A.uhoverLink:active
{
	text-decoration: underline;
}

/* Class to indicate the current page in the sidebar (latinoGreen and bold) */
A.currentLink:link, A.currentLink:visited
{
	color: #639630;
	font-weight: bold;
	text-decoration: none;
}
A.currentLink:hover, A.currentLink:active
{
	color: #639630;
	font-weight: bold;
	text-decoration: underline;
}

/* Use green text when hovering over a link in the sidebar */
#UpperSidebar a:hover
{
	color: #639630; /* latinoGreen */
	font-weight: bold;
}

/*
** Text classes 
*/
H1
{
	font-family: Trebuchet MS, Arial, Sans-Serif;
	font-size: 30px;
	color: #639630;
	font-weight: bold;
}
H2, .suSucioSpanishH2
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 18px;
	color: #639630;
	font-weight: bold;
}
H3
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 15px;
	color: #639630;
	font-weight: bold;
}
.latinoTreb18
{
	font-family: Trebuchet MS, Arial, Sans-Serif;
	font-size: 18px;
}
.latinoTreb14
{
	font-family: Trebuchet MS, Arial, Sans-Serif;
	font-size: 14px;
}
.latinoTreb12
{
	font-family: Trebuchet MS, Arial, Sans-Serif;
	font-size: 12px;
}
.latinoArial20
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 20px;
}
.latinoArial18
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 18px;
}
.latinoArial16
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 16px;
}
.latinoArial15
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 15px;
}
.latinoArial13, .latinoArial13Tight
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 13px;
}
.latinoArial13Tight
{
	line-height: 14px;
}
.latinoArial12
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 12px;
}
.latinoArial11
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 11px;
}
.boldText
{
	font-weight: bold;
}
.latinoArialNarrow
{
	font-family: Arial Narrow, Helvetica, Sans-Serif;
}
/*
** Master
** From http://www.pmob.co.uk/temp/left-column-example.htm
*/
*
{
	margin: 0px;
	padding: 0px;
}
html, body
{
	height: 100%;
}
body
{
	margin: 0px;
	text-align: center;
	background-image: url(/Content/Images/pageBackground.png);
	background-repeat: repeat-x;
	background-color: White;
}
#outer
{
	min-height: 100%;
	width: 960px;
	background: #ffffff;
	position: relative;
	margin: auto;
	text-align: left;
}
* html #outer
{
	height: 100%;
}
#MasterMain
{
	width: 960px;
	min-height: 300px;
}
td { color: Black; }
img { border: 0px; }
/*
** Header 
*/
#Header
{
	background-color: #F0F0F0;
}
#HeaderTop
{
	border-bottom: solid 2px #7ECC30;
	width: 960px;
	height: 68px;
	background-image: url(/Content/Images/headerBackground.png);
	background-repeat: repeat-x;
}
#HeaderTopLink
{
	font-weight: bold;
	text-align: right;
	padding-right: 10px;
	margin-top: 15px;
}
#HeaderTopLogo
{
	width: 260px;
	float: left;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 17px;
	height: 53px;
}
#HeaderTopMiddle
{
	width: 400px;
	float: left;
	height: 70px;	
}
#HeaderTopRight
{
	width: 280px;
	float: left;
	vertical-align: top;
	height: 70px;
}
#HeaderTopPhone
{
	text-align: right;
	/*padding-right: 10px;*/
	/* Use 8px padding instead of 10px so that the phone and En Espanol text */
	/* are right aligned when viewed closely; here we want the text to align, i.e. */
	/* the "l" in En Espanol lines up with the "1" in the default phone number */
	/* instead of the boxes used to surround the text. */
	padding-right: 8px;
}
#HeaderPhone
{
	color: #59666A;
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 22px;
	font-weight: bold;
}
#HeaderBottom
{
	background-color: #333333;
	height: 32px;
	text-align: left;
	padding-left: 10px;
	color: white;
}
#HeaderLinks
{
	padding-top: 7px;
	color: white;
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 13px;
	font-weight: bold;
}
#HeaderLinks A
{
	color: White;
}
.linkBarSeparator
{
	display: inline;
	padding-left: 10px;
	padding-right: 10px;
}
/*
** Footer
*/
#Footer
{
	width: 960px;
	padding-top: 10px;
	text-align: center;
	border-top: solid 2px #7ECC30;
	margin-top: 5px;
	padding-bottom: 5px;
}
/*
** Home Page
*/
#HomeUpper, #HomeLower
{
	width: 920px;
	margin-left: 20px;
}
#HomeUpper
{
	background-image: url(/Content/Images/homeUpperBackground.png);
	height: 320px;
	margin-top: 20px;
	margin-left: 20px;
}
#HomeLowerTable
{
	margin-left: 20px;
	margin-top: 25px;
}
#HomeLowerTable H2
{
	margin-top: 20px;
	margin-left: 15px;
}
.homeRoundedRect
{
	background-image: url(/Content/Images/roundedRect.png);
	background-repeat: no-repeat;
	width: 455px;
	height: 220px;
}
.homeLowerIcon
{
	float: left;
	padding-left: 15px;
	padding-top: 15px;
	padding-right: 15px; /*background-color: Silver;/* debug */
}
.hoverButton /* used by script in Site.Master */
{
	width: 162px;
	height: 58px;
}
.homeHoverButton
{
}

/*
** SidebarMaster 
*/
#LowerSidebar
{
	width: 235px;
}
#LowerSidebarBusiness
{
	margin-left: 15px;
	margin-top: 15px;
}
#LowerEmailSidebar
{
	margin-top: 15px;
}
#UpperSidebar
{
	background-image: url(/Content/Images/sidebarBackground.png);
	background-repeat: no-repeat;
	height: 215px;
	width: 250px;
}
#UpperSidebar250x250  /* for spanish pages */
{
	background-image: url(/Content/Images/sidebarBackground250x250.png);
	background-repeat: no-repeat;
	height: 250px;
	width: 250px;
}
#UpperSidebar250x250 li
{
	padding-bottom: 5px;
}
#SidebarContainer
{
	padding-left: 20px;
	margin-top: 20px;
	float: left;
	vertical-align: top;
}
#SidebarCaptionedContentContainer
{
	vertical-align: top;
	float: left;
	width: 660px;
	margin-top: 20px;
	margin-left: 10px;
}
#SidebarCaptionedContent
{
	padding-left: 15px;
}
#SidebarContainer ul
{
	list-style-type: none;
}
.sidebarContainerFirstItem
{
	font-weight: bold;
	padding-left: 20px;
	padding-top: 15px;
}

#UpperSidebar ul li
{
	padding-bottom: 4px;
}

.lowerSidebarEmail
{
	width: 250px;
	height: 416px;
	background-image: url(/Content/Images/lowerSidebarMailBackground.png);
	background-repeat: no-repeat;
	background-color: White;
}

/* Use either upperSidebarLink or upperSidebarCurrentLink, but not both */
.upperSidebarLink
{
	padding-left: 30px;
	display: block; /* needed for two-line links */
}
.upperSidebarCurrentLink
{
	margin-left: 23px;
	padding-left: 7px; /* these must sum up to upperSidebarLink's paddingLeft value, i.e. 30px */
	background-image: url(/Content/Images/smallGreenTriangle.gif);
	background-position: left top;
	background-repeat: no-repeat;
	font-weight: bold;
	display: block; /* needed for two-line links */
}
#SidebarContentContainer
{
	min-height: 300px;
}

/*
** Contact Us 
*/
.contactUsContent
{
	/* to push the footer down the page */
	min-height: 350px;
	height: 350px;
}
.contactUsImage
{
	width: 38px;
	padding-right: 10px;
	float: left;
}
.contactUsImageTextContainer
{
	padding-top: 15px;
}
.contactUsImageText
{
	width: 75px;
	float: left;
}
.ventas
{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 15px;
	color: #5A666A;
	font-weight: bold;
}

/*
** SiteMap
*/

/*
** Caption backgrounds
*/
.captionContainer660x70
{
	width: 660px;
	height: 70px;
	background-image: url(/Content/Images/captionBackground70.png);
	background-repeat: no-repeat;
	background-color: White;
	margin-bottom: 15px;
}
.captionContainer660x150
{
	width: 660px;
	height: 150px;
	background-image: url(/Content/Images/captionBackground660x150.png);
	background-repeat: no-repeat;
	background-color: White;
	margin-bottom: 15px;
}
.captionContainer660x190
{
	width: 660px;
	height: 190px;
	background-image: url(/Content/Images/captionBackground660x190.png);
	background-repeat: no-repeat;
	background-color: White;
	margin-bottom: 15px;
}
#Caption660
{
	width: 600px;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 20px;
	padding-right: 20px;
}

.captionContainer920x70
{
	width: 920px;
	height: 70px;
	background-image: url(/Content/Images/captionBackground920x70.png);
	background-repeat: no-repeat;
	margin-bottom: 15px;
	background-color: White;
}
#Caption920
{
	width: 920px;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 20px;
	padding-right: 20px;
}

/*
** RoundedRects 
*/
.roundedRect300x220
{
	background-image: url(/Content/Images/roundedRect300x220.png);
	background-repeat: no-repeat;
	width: 300px;
	height: 220px;
}
.leftTab300x220
{
	background-image: url(/Content/Images/leftTab300x220.png);
	background-repeat: no-repeat;
	width: 300px;
	height: 220px;
}
.rightTab300x220
{
	background-image: url(/Content/Images/rightTab300x220.png);
	background-repeat: no-repeat;
	width: 300px;
	height: 220px;
}
.roundedRect300x220Spacer
{
	margin-left: 10px;
}

/*
** SuSocio
*/
#SuSocioUpper
{
	background-image: url(/Content/Images/suSocioBackground.png);
	background-repeat: no-repeat;
	width: 920px;
	height: 320px;
	margin-top: 20px;
	margin-left: 20px;
	padding-left: 20px;
}
#SuSocioRoundedRectBar
{
	height: 220px;
	margin-top: 25px;
	margin-left: 20px;
}
#SuSocioRoundedRectBar .roundedRect300x220
{
	float: left;
	width: 300px;
	vertical-align: top;
}
#SuSocioRoundedRectBar H2
{
	padding-top: 20px;
}
.suSucioSpanishH2
{
	padding-top: 10px;
}
.suSocioHoverButton
{
	padding-left: 70px;
}
.indent20
{
	padding-left: 20px;
}
#SuSocioRoundedRectBar .indent20 /* to get the bottom of the hover buttons to line up with the bottom of the rounded rects */
{
	min-height: 161px;
	height: 161px;
}

/*
** SuGuia
*/
#SuGuiaUpper
{
	background-image: url(/Content/Images/suGuiaBackground.png);
	background-repeat: no-repeat;
	width: 920px;
	height: 320px;
	margin-top: 20px;
	margin-left: 20px;
	padding-left: 20px;
}
#SuGuiaRoundedRectBar
{
	height: 220px;
	margin-top: 25px;
	margin-left: 20px;
}
#SuGuiaRoundedRectBar .roundedRect300x220, #SuGuiaRoundedRectBar .leftTab300x220, #SuGuiaRoundedRectBar .rightTab300x220
{
	float: left;
	width: 300px;
	vertical-align: top;
}
#SuGuiaRoundedRectBar h2
{
	padding-top: 20px;
}
.suGuiaHoverButton
{
	padding-left: 70px;
}
#SuGuiaRoundedRectBar .indent20 /* to get the bottom of the hover buttons to line up with the bottom of the rounded rects */
{
	min-height: 161px;
	height: 161px;
}
/* Tabs */
.tabTitleAreaRow
{
	width: 300px;
	height: 47px;
}
.tabTitleArea
{
	width: 150px;
	height: 47px;
	vertical-align: top;
	cursor: pointer;
}
.tabTitleAreaLeft
{
	float: left;
	vertical-align: top;
}
.tabTitleAreaRight
{
	float: right;
	vertical-align: top;
}
.tabTitle
{
	padding-left: 15px;
	padding-top: 15px;
}
.tabTitleSpanish
{
	padding-left: 5px;
	padding-top: 10px;
	letter-spacing: -1px;
}
.tabContents
{
	padding-left: 15px;
	padding-right: 15px;
	width: 270px;
	padding-top: 10px;
	padding-bottom: 10px;
	height: 94px;
}

/*
** Small Business Solutions
*/
.SBSRoundedRect
{
	background-image: url(/Content/Images/roundedRect660x580.png);
	width: 660px;
	height: 580px;
	background-repeat: no-repeat;
}
.SBSText
{
	line-height: 17px;
}

#DirectMailBottomDiv
{
	background-color: #F3F3F1; 
	width: 659px; 
	height: 385px; 
	padding-left: 15px; 
	padding-top: 11px;
}


/*
** Sidebar
*/
/* "Header" links (su guia, su socio, et cetera) */
.sidebarHeaderLink
{
}
A.sidebarHeaderLink:link, A.sidebarHeaderLink:visited
{
	text-decoration: none;
	color: black;
}
A.sidebarHeaderLink:hover, A.sidebarHeaderLink:active
{
	text-decoration: underline;
	color: #639630;
}
/* A "normal" sidebar link, i.e. not a link to the current page; the union of these classes: upperSidebarLink uhoverLink black */
.sidebarLink
{
	padding-left: 30px;
	display: block; /* needed for two-line links */
}
A.sidebarLink:link, A.sidebarLink:visited
{
	text-decoration: none;
	color: black;
}
A.sidebarLink:hover, A.sidebarLink:active
{
	text-decoration: underline;
	color: #639630;
}

/* The current link on the sidebar; the union of these classes: upperSidebarCurrentLink uhoverLink currentLink */
.currentSidebarLink
{
	margin-left: 23px;
	padding-left: 7px; /* these must sum up to upperSidebarLink's paddingLeft value, i.e. 30px */
	background-image: url(/Content/Images/smallGreenTriangle.gif);
	background-position: left top;
	background-repeat: no-repeat;
	display: block; /* needed for two-line links */
	color: #639630;
	font-weight: bold;
}
A.sidebarCurrentLink:link, A.sidebarCurrentLink:visited
{
	text-decoration: none;
}
A.sidebarCurrentLink:hover, A.sidebarCurrentLink:active
{
	text-decoration: underline;
}


#SalesLeadsAndMailingListsUnorderedList li
{
	padding-bottom: 3px;
}