/*
@font-face {
    font-family: 'ropa sans';
    src: url('fonts/ropasans-regular-webfont.eot');
    src: url('fonts/ropasans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ropasans-regular-webfont.woff') format('woff'),
         url('fonts/ropasans-regular-webfont.ttf') format('truetype'),
         url('fonts/ropasans-regular-webfont.svg#ropa_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ropa sans';
    src: url('fonts/ropasans-italic-webfont.eot');
    src: url('fonts/ropasans-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ropasans-italic-webfont.woff') format('woff'),
         url('fonts/ropasans-italic-webfont.ttf') format('truetype'),
         url('fonts/ropasans-italic-webfont.svg#ropa_sansitalic') format('svg');
    font-weight: normal;
    font-style: italic;
}
*/

@font-face {
    font-family: 'ropa sans';
    src: url('fonts/roboto-regular-webfont.eot');
    src: url('fonts/roboto-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto-regular-webfont.woff') format('woff'),
         url('fonts/roboto-regular-webfont.ttf') format('truetype'),
         url('fonts/roboto-regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ropa sans';
    src: url('fonts/roboto-bold-webfont.eot');
    src: url('fonts/roboto-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto-bold-webfont.woff') format('woff'),
         url('fonts/roboto-bold-webfont.ttf') format('truetype'),
         url('fonts/roboto-bold-webfont.svg#robotobold') format('svg');
    font-weight: bold;
    font-style: normal;

}

html, body{
	margin:0px;
	padding:0px;
	background:#ececec;
	font-family: 'ropa sans', arial, sans-serif;
}

a{
	color:black;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	-ms-transition: all .2s linear;
	-o-transition: all .2s linear;
	transition: all .2s linear;	
	text-decoration:none;
}

a img{
	border:none;
}

ul{
	margin:0px;
	padding:0px;
	list-style:none;
}


/*####################################### FORM #######################################*/

input[type=text],
input[type=password],
textarea{
	border:none;
	border:1px solid #dfdfde;
	background:white;
	font-size:20px;
	text-align:center;
	/*text-transform:uppercase;*/
	outline:none;
	font-family: 'ropa sans', arial, sans-serif;
}

input[type=text],
input[type=password]{
	text-align:center;
	height:33px;
	line-height:33px;
}

select{
	border:none;
	border:1px solid #dfdfde;
	background:white;
	font-size:20px;
	line-height:33px;
	height:33px;
	text-align:center;
	text-transform:uppercase;
	outline:none;
	font-family: 'ropa sans', arial, sans-serif;
}


a.btn,
input[type=submit],
input[type=button],
input[type=reset]{
	-webkit-appearance: none;
	border-radius: 0;
	border:none;
	padding:0px 10px 0px 10px;
	background:#ec8d1c;
	font-size:15px;
	text-align:center;
	text-transform:uppercase;
	outline:none;
	color:white;
	cursor:pointer;
	font-family: 'ropa sans', arial, sans-serif;
	
	-webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-ms-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;
}

input[type=submit]:disabled,
input[type=button]:disabled,
input[type=reset]:disabled{
	background:#CCCCCC !important;
	color:#AAAAAA !important;
	cursor:default;
}

.desktop a.btn:hover,
.desktop input[type=submit]:hover,
.desktop input[type=button]:hover,
.desktop input[type=reset]:hover{
	background:black;
	color:white;
}

.error_message{
	font-size:12px;
	color:#ec8d1c;
	line-height:18px;
}

.error_messages{
	padding:10px;
	border:1px solid #ec8d1c;
	background:#ffe4c4;
	color:#ec8d1c;
	text-transform:none;
	font-size:14px;
	margin:20px;
	display:none;
}
/*####################################### TABLE #######################################*/

table{
	width:100%;
	border:none;
	padding:0px;
}

table tr{
	vertical-align:top;
}

table th,
table td{
	padding:5px 0px 5px 0px;
}

table th{
	font-weight:normal;
	text-transform:uppercase;
}

table td{
	text-transform:none;
}

/*####################################### CONTAINER ALL #######################################*/

.container_all{
	max-width:1200px;
	min-width:1000px;
	width:100%;
	margin:auto;
	border:1px solid #cecece;
	border-bottom:none;
	border-top:3px solid #ec8b1d;
	background:white;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}


/*####################################### HEADER #######################################*/

.header{
	background:#f0f0f0;
}

/******************** TOP BAR ********************/

.header .top_bar{
	width:1000px;
	margin:auto;
	padding:5px 0px 5px 0px;
	position:relative;
}

/* NAV */

.header .top_bar ul.nav{
	
}

.header .top_bar ul.nav > li{
	display:inline-block;
	margin-right:25px;
	vertical-align:middle;
	font-size:14px;
	text-transform:uppercase;
	position:relative;
}

.header .top_bar ul.nav li a{
	color:#333333;	
}

.header .top_bar ul.nav li a.active,
.desktop .header .top_bar ul.nav li a:hover{
	color:#ec8d1c;	
}

.header .top_bar ul.nav li a.btn{
	background:#ec8d1c;
	display:block;
	padding:7px 5px 7px 5px;
	color:white;	
}

.desktop .header .top_bar ul.nav li a.btn:hover{
	background:black;
	color:white;
}

.header .top_bar ul.nav > li.has_sub_nav{
	padding:0px 3px 0px 3px;
}

.header .top_bar ul.nav > li.has_sub_nav:hover{
	color:white;
	background:#ec8d1c;
}

.header .top_bar ul.nav > li ul{
	position:absolute;
	width:100px;
	background:#ec8d1c;
	z-index:2;
	display:none;
	left:0px;
	top:100%;
}

.header .top_bar ul.nav > li:hover ul,
.header .top_bar ul.nav > li.active ul{
	display:block;
}

.header .top_bar ul.nav > li ul a{
	color:white !important;
	padding:3px;
}

/* LOCALE */

.header .top_bar ul.locale{
	position:absolute;
	top:5px;
	right:0px;
}

.header .top_bar ul.locale li{
	display:inline-block;
	margin-left:3px;
}

/******************** MAIN NAV ********************/

.header .main_nav{
	background:white;
	border-top:1px solid #d7e1e1;
}

.header .main_nav > ul{
	width:1100px;
	margin:auto;
	font-size:0px; /*hack to close gap between inline-block elements*/
}

.header .main_nav > ul > li{
	display:inline-block;
	vertical-align:bottom;
	text-align:center;
	position:relative;
}

.header .main_nav > ul > li > a{
	font-size:13px;
	display:block;
	width:145px;
	height:70px;
	color:#343434;
	padding-top:35px;
	position:relative;
	z-index:1;
}

.header .main_nav > ul > li > a strong{
	font-size:14px;
	text-transform:uppercase;
}

.header .main_nav > ul > li .active_indicator{
	position:absolute;
	top:0px;
	left:-1px;
	width:100%;
	height:100%;
	border:1px solid #d7e1e1;
	border-top:none;
	border-bottom:none;
	background:url(../im/nav_active_indicator.jpg) repeat-x 0px 0px;
	
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
	
	-webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-ms-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;
}

.desktop .header .main_nav > ul > li:hover .active_indicator,
.header .main_nav > ul > li.active .active_indicator{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
}

/* LOGO */
.header .main_nav > ul > li.logo{
	width:175px;
}

.header .main_nav > ul > li.logo h3{
	margin:0px;
	padding:0px;
}

.header .main_nav > ul > li.logo h3 a{
	display:block;
	background-image:url(../im/spritesheet.png);
	background-repeat:no-repeat;
	background-position:-18px 0px;
	width:158px;
	height:80px;
	text-indent:-10000px;
	margin:0px auto 10px auto;
	padding:0px;
}

/* SOCIAL */
.header .main_nav > ul > li.social{
	width:180px;
	text-align:right;
}

.header .main_nav > ul > li.social ul{
	margin-bottom:40px;
}

.header .main_nav > ul > li.social ul > li{
	display:inline-block;
	margin:0px 3px 0px 3px;
	vertical-align:middle;
}

.header .main_nav > ul > li.social ul > li.like{
	margin:0px 0px 0px 5px;
	padding-left:5px;
	border-left:1px solid #CCCCCC;
}

.header .main_nav > ul > li.social ul > li a{
	display:block;
	width:16px;
	height:16px;
	background-image:url(../im/spritesheet.png);
	background-repeat:no-repeat;
}

.header .main_nav > ul > li.social ul > li a.twitter{
	background-position:-188px 0px;
}

.header .main_nav > ul > li.social ul > li a.linked_in{
	background-position:-188px -20px;
}

.header .main_nav > ul > li.social ul > li a.facebook{
	background-position:-188px -39px;
}

/* SEPARATOR */
.header .main_nav > ul > li.separator{
	width:1px;
	height:95px;
	background-image:url(../im/spritesheet.png);
	background-position:-3px 0px;
	background-repeat:no-repeat;
}

/*####################################### SUB NAV #######################################*/
.sub_nav{
	background:#292929;
	color:white;
	line-height:60px;
	font-size:14px;
	border-bottom:1px solid white;
}

.sub_nav .sub_nav_contents{
	width:1000px;
	margin:auto;
}

.sub_nav ul{
	display:inline-block;
	vertical-align:middle;
}

.sub_nav ul li{
	display:inline-block;
	vertical-align:middle;
	margin:0px 20px 0px 0px;
}

.sub_nav ul li h2{
	font-size:26px;
	color:#ec961c;
	margin:0px;
	padding:0px;
	text-transform:uppercase;
}

.sub_nav ul li a{
	color:white;
	position:relative;
	display:block;
}

.sub_nav ul li a .active_indicator{
	width:16px;
	height:0px;
	background-image:url(../im/spritesheet.png);
	background-position:-21px -156px;
	display:block;
	position:absolute;
	bottom:0px;
	left:50%;
	margin-left:-8px;
	
	-webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-ms-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;
}

.sub_nav ul li a.active .active_indicator,
.desktop .sub_nav ul li a:hover .active_indicator{
	height:8px;
}

.sub_nav ul li.separator{
	width:1px;
	height:54px;
	background-image:url(../im/spritesheet.png);
	background-position:-9px 0px;
}

/*####################################### CONTENT AREA #######################################*/

.content_area{
	background:white;
}

/*####################################### FOOTER #######################################*/

.footer{
	background:#333132;
	color:white;
	padding:0px 45px 0px 45px;
	position:relative;
	z-index:3;
}

/******************** SITEMAP ********************/
.footer .sitemap {
	overflow:hidden;
	height:40px;
	
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;
}


.footer.expanded .sitemap,
.desktop .footer:hover .sitemap{
	height:344px;
	margin-top:-304px;
}

.footer .sitemap h6{
	cursor:pointer;
	margin:0px;
	padding:10px 0px 0px 0px;
	line-height:30px;
	font-size:13px;
	color:#ec8d1c;
	text-transform:uppercase;
	border-bottom:1px solid black;
}

.footer .sitemap > ul{
	border-top:1px solid #4d4e50;
	border-bottom:1px solid black;
	font-size:13px;
	padding-bottom:25px;
}

.footer .sitemap > ul strong{
	text-transform:uppercase;
	display:block;
	margin-top:25px;
}

.footer .sitemap > ul > li{
	display:inline-block;
	vertical-align:top;
	margin-right:45px;
}

.footer .sitemap > ul > li > ul{
	list-style:disc;
	margin-left:15px;
	margin-top:3px;
	line-height:18px;
}

.footer .sitemap > ul > li > ul a{
	color:white;
}

.desktop .footer .sitemap > ul > li > ul a:hover{
	color:#CCCCCC;
}




/******************** WHERE TO FIND US ********************/
.footer .where_to_find_us{
	position:absolute;
	top:0px;
	right:45px;
	overflow:hidden;
	height:40px;
	
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;	
}

.footer.expanded .where_to_find_us,
.desktop .footer:hover .where_to_find_us{
	height:340px;	
}

.footer .where_to_find_us h6{
	margin:0px;
	padding:10px 0px 0px 0px;
	line-height:30px;
	font-size:13px;
	color:#ec8d1c;
	text-transform:uppercase;
}

.footer .where_to_find_us > ul{
	font-size:13px;
}

.footer .where_to_find_us > ul strong{
	text-transform:uppercase;
	display:block;
	margin-bottom:10px;
}

.footer .where_to_find_us > ul > li{
	margin-top:20px;
}

.footer .where_to_find_us a{
	color:white;
}

.desktop .footer .where_to_find_us a:hover{
	color:#CCCCCC;
}


/******************** LEGAL BAR ********************/

.footer .legal_bar{
	font-size:11px;
	text-transform:uppercase;
	line-height:55px;
	position:relative;
	border-top:1px solid #4d4e50;
}

.footer .legal_bar ul{
	position:absolute;
	right:0px;
	top:0px;
}

.footer .legal_bar ul li{
	display:inline-block;
	margin-left:10px;
}

.footer .legal_bar ul li a{
	color:white;
	text-decoration:underline;
}