/* UNIQUE SCROLLERS */

body ::-webkit-scrollbar { width: 10px; }
#main-hub-menu::-webkit-scrollbar { width: 15px; } 
body ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
	background-color:rgba(0,0,0,0.3);
} 
body ::-webkit-scrollbar-thumb {
    border-radius: 10px 10px 10px 10px;
	background-color:#f0f0f0;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}


/* Spacing at the top of pages */
.dataContainer { margin-top: 70px; }

/* Reduced spacing for pages which touch the top rail */
#Towns .dataContainer,
#Datas.myoffers .dataContainer,
#Libraries.manage_index .dataContainer,
#Infopages .dataContainer,
#Members .dataContainer,
#Companies .dataContainer { margin-top: 46px; }

#Members.viewhome .dataContainer,
#Hubs.hub_home .dataContainer { margin-top: 56px; }

.admin_class .dataContainer { margin-top: 74px!Important; }
body.controlpanel .dataContainer { margin-top: 77px!Important; }

#Banks.controlpanel .dataContainer { margin-top: 100px!Important; }


/* Hide / Display for device sizes ------------------------------- 

.tablet-hide : content displays on desktop, but is hidden for tablet view - under 768px
.tablet-show : content hidden on desktop, but displays for tablet view - under 768px

.tablet-small-hide : content displays on desktop, but is hidden for tablet view - under 650px
.tablet-small-show : content hidden on desktop, but displays for tablet view - under 650px

.mobile-hide : content displays on desktop + tablet, but is hidden for mobile view - under 400px
.mobile-show : content hidden on desktop + tablet, but displays for mobile view - under 400px

*/

.tablet-hide { display: block!Important; } 
.tablet-show { display: none!Important; }

.tablet-small-hide { display: block!Important; } 
.tablet-small-show { display: none!Important; }

.hide-550px { display: block!Important; }
.show-550px { display: none!Important; }

.hide-450px { display: block!Important; }
.show-450px { display: none!Important; }

.mobile-hide { display: block!Important; }
.mobile-show { display: none!Important; }

@media only screen and (max-width: 768px) {
	.tablet-hide { display: none!Important; }
	.tablet-show { display: block!Important; }
}
@media only screen and (max-width: 650px) {
	.tablet-small-hide { display: none!Important; }
	.tablet-small-show { display: block!Important; }
}
@media only screen and (max-width: 550px) {
	.hide-550px { display: none!Important; }
	.show-550px { display: block!Important; }
}
@media only screen and (max-width: 450px) {
	.hide-450px { display: none!Important; }
	.show-450px { display: block!Important; }
}
@media only screen and (max-width: 400px) {
	.mobile-hide { display: none!Important; }
	.mobile-show { display: block!Important; }
}

/*  ---------------------------------------------------------------- */
/*  ---------------------------------------------------------------- */

body, ul, li {
    font-size:14px;
    font-family:Arial, Helvetica, sans-serif;
    line-height:21px;
    text-align:left;
    margin:0px;
}

/* default styling */
span { line-height: inherit; }
.strong, strong, .bold { font-weight:bold!important; font-family: inherit!important; }
.italic { font-style: italic!important;}
.center { text-align: center!important; }

.container {
  position: relative;
  max-width: 1000px;
  width: 90%;
  margin: 0 auto;
  padding: 0;
}

body #sthoverbuttons { z-index: 10!important; }
@media only screen and (max-width: 768px) {
	body #sthoverbuttons { display: none; }
}

h3 {
	font-weight: bold;
	padding: 0px 0px 15px;
	text-align: center;
}
@media only screen and (max-width: 650px) {
	h3 { font-size: 15px; }
	a.back { display:none!Important; }	
}

/* =========================================== TOP RAIL BAR =========================================== */

.dashboard_holder.loggedout,
.dashboard_holder.loggedin { height: 52px; }

.dashboard_holder {
    width:100%;
	position: fixed;
    background: #222;
    z-index: 21;
}
.dashboard_holder.loggedout { text-align: center; }
#Pages.landing_class .dashboard_holder,
#Pages.home .dashboard_holder,
#Pages.homeVillage .dashboard_holder {
  background: transparent;
  border-bottom: none;
  box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none;
}

/* NEW MINI LOGGED OUT MENU FOR HUBS ---------------------------- */
body#Hubs.hub-layout-002 .dashboard_holder.loggedout.mini {
	background: transparent;
	border: none;
	box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none;
	z-index: 20;
	width: auto;
	right: 0px;
}
.loggedout.mini #menu {
	float: right;
	height: 0px;
	max-width:100%;
}
.loggedout.mini #menu .tgllogo_home {
  padding: 0px;
  margin-top: 10px;
  margin-right: 10px;
  float: right;
}

#hidden-mini-menu {
	top: 10px;
	right: -240px;
	transition: 0.5s;
	position: fixed;
	width: 230px;
	border-radius: 10px 0px 0px 10px;
	overflow: hidden;
	text-align: center;
	background: rgb(81, 196, 88);
	border: 1px solid #019728;
	color: white;
	box-shadow: -8px 8px 8px -6px #333; -moz-box-shadow: -8px 8px 8px -6px #333; -webkit-box-shadow: -8px 8px 8px -6px #333;
	box-shadow: -8px 8px 8px -6px rgba(0, 0, 0, 0.4); -moz-box-shadow: -8px 8px 8px -6px rgba(0, 0, 0, 0.4); -webkit-box-shadow: -8px 8px 8px -6px rgba(0, 0, 0, 0.4);
}
#hidden-mini-menu.active { right: -1px; }
#hidden-mini-menu .close {
  background: rgb(183, 227, 186);
  background: rgba(255, 255, 255, 0.4);
  color: white;
  line-height: 30px;
  font-size: 15px;
  font-weight: bold;
  cursor: pointer;
  transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
}
#hidden-mini-menu .close:hover {
	background: rgb(66, 87, 67);
	background: rgba(0, 0, 0, 0.5);
}
#hidden-mini-menu .close:active {
	background: #000;
	transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;
}
#hidden-mini-menu .close strong {
	transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
	left: 0px;
	position: relative;
}
#hidden-mini-menu .close:hover strong { left: 3px; font-size: 19px; }
#hidden-mini-menu .close:active strong { left: 7px; }


#mini-menu {
  line-height: 28px;
  font-size: 18px;
  padding: 15px 25px;
}
#mini-menu a { text-decoration: none; color: white; }

.login-link { margin-top: 15px; }
#login_lightbox.mini-drop { top: -25px; }

#menu #mini-menu p {
	font-size: 14px;
	line-height: 18px;
	margin-bottom: 10px;
	text-align: left;
	width: auto;
}


/* Top Rail border + shadow colours ---------------------------- */

.shops_class .dashboard_holder { border-color: #25A76E; }
.skills_class .dashboard_holder { border-color: #DF7A4B; }
/* Member colour
.personal_class .dashboard_holder,
#Infopages .dashboard_holder { border-color: #A82F43; }
*/
.manage_index.media_class .dashboard_holder { border-color: #F2D81B; }
/*Banking colour
.banks_class .dashboard_holder {
    box-shadow: 0 4px 10px -4px rgba(54, 95, 168, 0.7); -moz-box-shadow: 0 4px 10px -4px rgba(54, 95, 168, 0.7); -webkit-box-shadow: 0 4px 10px -4px rgba(54, 95, 168, 0.7);
}
*/
/*Hubs colour */
#Hubs .dashboard_holder { border-color: #459980; }
/*Towns colour */
#Towns .dashboard_holder { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; border-color: #43A3E5; }


.footer_holder {
	display: none; /* TEMP ADDITION TILL WORKING PROPERLY */
    width:100%;
    background: #2E3233;
    height:27px;
    z-index: 18;
    box-shadow: 0 0px 1px #333333; -moz-box-shadow: 0 0px 1px #333333;  -webkit-box-shadow: 0 0px 1px #333333;
}
/* HIDE FOOTER */
#Towns .footer_holder { display: none; }


#menu {
    list-style: none;
    max-width: 958px;
    margin: 0px auto;
    height: 52px;
}


#menu li,
#menu li.tiny_tglmail_logo {
    float: left;
    display: block;
    text-align: center;
    position: relative;
    border: none;
    transition: 0.30s; -moz-transition: 0.30s;  -webkit-transition: 0.30s;
}

/* ##### hover states icons ##### */
#menu li.memberinfo_tab:hover,
#menu li.memberinfo_tab.active { background-color: #8B98A1; }


#menu li a,
#menu li.memberinfo_tab a {
    font-family: Calibri, Helvetica, sans-serif;
    font-size: 15px;
    color: white;
    display: block;
    outline: 0;
    text-decoration: none;
	cursor: pointer;
}


/* =================================== Logged out header menu =================================== */
/* tgl logo - used on pennyon mini version */
#menu .tgllogo_home a {
  background-image: url("/images/tgl3/tgl_logo_landing-beta_hover.png");
  background-repeat: no-repeat;
  background-position: -1px 1px;
  height: 62px;
  width: 59px;
  background-size: 58px auto; -moz-background-size: 58px auto; -webkit-background-size: 58px auto;
  cursor: pointer;
}

/* Home logo */
.dashboard_holder.loggedout p { margin-bottom: -52px; height: 52px; }
.dashboard_holder.loggedout p a {
  background: url("/images/hearts/3Dheart-green_50px.png") no-repeat 5px center / 21px auto;
  padding: 14px 15px 14px 35px;
  color: white;
  height: 20px;
  font-size: 17px;
  text-shadow: 0px 0px 3px #333;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
}
.dashboard_holder.loggedout p a:hover { text-decoration: underline;}

.dashboard_holder.loggedout p.mobile-show a {
  background: url("/images/tgl3/tgl_logo_landing-beta2.png") no-repeat 3px 2px / 42px auto;
  padding: 14px 24px
}

.loggedout #menu {
  height: 52px;
  width: auto;
  margin: 0px 10px;
  display: table-cell;
  float: right;
}

/* language logged out */
#menu li.loggedout_language_icons {
	margin: 2px 2px 0px 0px;
	height: 46px;
	width: 70px;
	border-radius: 8px 8px 0px 0px;
	transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;
}
#menu li.loggedout_language_icons:hover { background-color: #9EA9AD; }

#menu li.loggedout_language_icons .aLanguage { line-height: 36px; }
#menu li.loggedout_language_icons .aLanguage span img {
	border: 1px solid rgba(66, 66, 66, 1);
	box-shadow: 0 0 0px 2px #dadada; -moz-box-shadow: 0 0 0px 2px #dadada; -webkit-box-shadow: 0 0 0px 2px #dadada;
	box-shadow: 0 0 0px 2px rgba(227, 229, 202, 0.28); -moz-box-shadow: 0 0 0px 2px rgba(227, 229, 202, 0.28); -webkit-box-shadow: 0 0 0px 2px rgba(227, 229, 202, 0.28);
	border-radius: 2px 2px 2px 2px;
	width: 37px;
}

#menu li.loggedout_language_icons .dropdown_1column.language { width: auto; padding: 0px; margin-top: 5px; border-radius: 0px 3px 3px 3px; }
#menu li.loggedout_language_icons ul.ulLang { margin: 0px;}

#menu li.loggedout_language_icons ul.ulLang span{
    float: left;
    height: 30px;
    padding: 0 7px 0 0;
    border-bottom: 1px solid #E6E6E6;
    min-width: 100px;
    width: auto;
}
#menu li.loggedout_language_icons ul.ulLang span:hover { background-color: white; }
#menu li.loggedout_language_icons ul.ulLang span a{
    float: right;
    height: 20px;
}
#menu li.loggedout_language_icons ul.ulLang span a.aText {
    color: #5e5e5e;
    float: left;
    padding: 5px 7px;
    width: 55px;
}

#menu li.loggedout_language_icons ul.ulLang img{
    margin: 7px 2px;
    border: 1px solid #CACACA;
    width: 25px;
}
#menu li.loggedout_language_icons ul.ulLang span:hover img {
    border: 1px solid #D5F0FF;
    box-shadow: 0 0 2px #3178C5;
    transition: 0.30s;
    -moz-transition: 0.30s;
    -webkit-transition: 0.30s;
}
#menu li.loggedout_language_icons ul.ulLang span:active { background-color: white; }


/* ========== JOIN / LOGIN BUTTONS ========== */
#menu li.loggedout-link {
  padding: 7px 0px;
  width: 100px;
  margin: 5px 4px;
  line-height: 25px;
  float: right;
  border-radius: 3px 3px 3px 3px;
  border: 1px solid #999;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
li.loggedout-link.login { background: #0E8DF1; }
li.loggedout-link.join { background: #EC7E18; }


#menu li.loggedout-link:hover { background: #31C45D; }
#menu li.loggedout-link:active,
#menu li.loggedout-link.login.active:active { background: orange; transition:0s; -moz-transition:0s; -webkit-transition:0s; -o-transition:0s; }
#menu li.loggedout-link.active { box-shadow: 0 0 0 2px white; -moz-box-shadow: 0 0 0 2px white; -webkit-box-shadow: 0 0 0 2px white; }



/*  ======================= LOGIN DROP LITEBOX  ======================= */
#login_lightbox {
    position: fixed;
    width: 100%;
    z-index: 20;
	margin-top: -20px;
}
.registrationComplete #login_lightbox { margin-top: -95px; }

#login_lightbox .outer{ }
#login_lightbox .inner {
    z-index: 2;
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.36); -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.36); -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.36);
    border-bottom: 1px solid #CCCCCC;
}
.login_dropdownbox {
	height: 0px;
	overflow: hidden;
	transition: 1s; -z-transition: 1s; -webkit-transition: 1s; -o-transition: 1s;
}
.active .login_dropdownbox{ margin-top: 60px; height: 310px; }

.loginbox {
    margin: 30px auto;
    width: 300px;
    text-align: center;
}

.inner .loginbox .closeX {
    float: none;
    margin: 20px auto;
    width: auto;
    position: inherit;
}
.inner .loginbox .closeX a { background: #444444; color: white; }
.inner .loginbox .closeX a:hover { background: #0C81D5; }
.inner .loginbox .closeX a:active { background: orange; }

#login_message {
    padding: 10px 25px;
    color: rgb(230, 0, 0);
    background: #FFF4F4;
    border-radius: 3px;
    border: 1px solid #E98686;
    width: 50%;
    text-align: center;
    margin: 14px auto -20px;
}
#login_message a {
    float: right;
    margin: -10px -25px 0 0px;
    color: white;
    font-weight: bold;
    text-decoration: none;
    background-color: #C79C9C;
    padding: 1px 6px;
    border-top-right-radius: 2px;
    font-size: 16px;
}



#menu li#logintab form {
    margin-left: 19px;
}

/* membername / password boxes */
.loginbox input[type="text"].inputbox_membername ,
.loginbox input[type="text"].inputbox_password,
.loginbox input#password.inputbox_password {
    margin: 5px auto;
    width: 250px;
    height: 45px;
    font-size: 25px;
    padding: 0 20px;
    border: 3px solid rgb(200, 200, 200);
    background: #FFFFFF;
    color: rgb(63, 155, 96);
    border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
}
.loginbox input[type="text"].inputbox_membername:hover ,
.loginbox input[type="text"].inputbox_password:hover,
.loginbox input#password.inputbox_password:hover  {
    box-shadow: 0 3px 5px -2px #333; -moz-box-shadow: 0 3px 5px -2px #333; -webkit-box-shadow: 0 3px 5px -2px #333;
	box-shadow: 0 3px 5px -2px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 3px 5px -2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 3px 5px -2px rgba(0, 0, 0, 0.5);
    border-color: rgb(79, 194, 115);
}

/* login button */
.inputbox_login {
    margin: 15px 0px 10px;
    padding: 1px 15px;
	min-width: 120px;
    height: 42px;
	border: 1px solid #dadada;
    border: 1px solid rgba(255, 255, 255, 0.5);
    font-weight: bold;
    font-size: 20px;
    font-family: calibri, helvetica, sans-serif;
    color: #FFFFFF;
    background: rgb(67, 148, 84);
    cursor: pointer;
}
.inputbox_login:hover {
    border-color: white;
    background: rgb(24, 163, 53);
    box-shadow: 1px 1px 2px #646464; -moz-box-shadow: 1px 1px 2px #646464; -webkit-box-shadow: 1px 1px 2px #646464;
}
.inputbox_login:active {
	background: rgb(34, 144, 218);
    margin-top: 17px;
    margin-bottom: 8px;
}
.inputbox_login.active { background: rgb(34, 144, 218); }

.forgotlogin a {
    color: #dadada;
    text-align: center;
    display: block;
    text-decoration: none;
    padding: 15px 20px 5px;
}
.forgotlogin a:hover { text-decoration: underline; }
.forgotlogin a:active { color: white; }


/* =================================================================== LANDING PAGE ============================================================== */

#Pages.landing_class,
#Pages.home,
#Pages.homeVillage { background: white; }

#Pages.landing_class #pageframe,
#Pages.home #pageframe,
#Pages.homeVillage #pageframe {
	width: 100%;
	background: transparent;
	margin-bottom: 0px;
	min-height: 0px;
	padding-bottom: 0px;
	box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none;
}
#Pages.landing_class #mainHold,
#Pages.home #mainHold,
#Pages.homeVillage #mainHold  { width: 100%; margin-left: 0px; }


/* logged out spacing */
#Pages.landing_class .dataContainer,
#Pages.home .dataContainer,
#Pages.homeVillage .dataContainer  { margin-top: 0px; }


/* Logged out landing menu & Pageframe */
#Pages.home.landing_class #pageframe,
#Pages.homeVillage.landing_class #pageframe,
#Members.login #pageframe {
    padding-bottom: 0;
    margin-bottom: -60px;
    background: none;
    box-shadow: none;	-moz-box-shadow: none;	-webkit-box-shadow: none;
}


/* Top banner */
.welcome-header {
  margin: -10px 0px 0px;
  height: 600px;
  text-align: center;
  background: url(/images/large/festival_stalls_banner.jpg) 50% /cover;
}
.logo-large {
	text-align: center;
    width: auto;
    padding: 30px 3%;
    display: inline-block;
    margin-top: 190px;
    background-color: rgba(255,255,255,0.94);
    font-size: 65px;
    font-weight: 100;
    line-height: 104px;
	color: #000;
	font-family: calibri;
	border-radius: 100px 100px 100px 100px;
	border: 6px solid #fff;
	box-shadow: 0px 0px 35px 10px rgba(255, 255, 255, 0.35); -moz-box-shadow: 0px 0px 35px 10px rgba(255, 255, 255, 0.35); -webkit-box-shadow: 0px 0px 35px 10px rgba(255, 255, 255, 0.35);
}
.logo-large span {
    background: no-repeat 0px 50% / contain;
    width: auto;
    padding-left: 100px;
    height: 105px;
	margin: 0px 14px;
	display: inline-block;
}
.logo-large span.logo-large-tgl { background-image: url(/images/hearts/3Dlogo-110px.png); }
.logo-large span.logo-large-Lbank {
	background-image: url(/images/hearts/3D-LBank-110px.png);
	padding-left: 107px;
	color: #3379B4;
	font-family: inherit;
}

.inner-banner {
	background-color: transparent;
	font-size: 87px;
	font-weight: 100;
	width: 100%;
	color: #fff;
	text-align: center;
	height: 150px;
	margin-top: -150px;
    text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.4);
	font-family: calibri;
	box-shadow: inset 0px -105px 160px -20px rgba(0, 0, 0, 0.55); -moz-box-shadow: inset 0px -105px 160px -20px rgba(0, 0, 0, 0.55); -webkit-box-shadow: inset 0px -105px 160px -20px rgba(0, 0, 0, 0.55);
}

img.side-leaner {
    position: absolute;
    right: 0px;
    margin-top: 32px;
    width: 170px;
    height: 95px;
}

/* welcome text ---------------------------------------------------------------------- */

/* tgl is for everyone */
.landing-page p { padding-bottom: 15px; }

.welcome-text.container {
	max-width: 780px;
	margin: 6% auto;
	overflow: hidden;
}

.inner-text { width: 350px; float: left; }
.inner-text h2 {
	font-size: 37px;
    font-weight: normal;
    font-family: calibri;
    color: #B8B8B8;
    text-align: center;
    font-weight: 100;
    padding: 58px 0px 12px;
    margin: 0px 0px 15px;
	background: url(/images/stickmen/heart-swap_01.png) no-repeat 50% 0px / 75px;
}
.inner-text p {
	color: #222222;
	font-family: "Open Sans",verdana,sans-serif;
	padding-bottom: 26px;
	line-height: 30px;
	font-size: 15px;
}
.inner-text p.your-bank {
    text-align: center;
    font-size: 38px;
    color: #3379B4;
    line-height: 35px;
    font-weight: 100;
    font-family: calibri;
 }
.inner-text p.your-bank span { font-family: inherit; }


/* get paid to tgl box */
.tgling {
  width: 310px;
  overflow: hidden;
  cursor: default;
  height: auto;
  text-align: center;
  margin: 3% 0% 0px;
  float: right;
}
.tgling h2 {
    font-size: 28px;
    color: #222;
    font-weight: normal;
    margin: 14px 0px 23px;
}

.tgling-inner {
  margin: 15px 8px 30px;
  overflow: hidden;
  border-radius: 15px 15px 15px 15px;  
  border: 4px solid rgb(255, 255, 255);
  box-shadow: 0px 3px 20px -7px #333; -moz-box-shadow: 0px 3px 20px -7px #333; -webkit-box-shadow: 0px 3px 20px -7px #333;
  box-shadow: 0px 3px 20px -7px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0px 3px 20px -7px rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0px 3px 20px -7px rgba(0, 0, 0, 0.8);
}

.introBlock {
  line-height: 25px;
  height: auto;
  padding: 5px 15px 5px 75px;
  text-align: left;
  cursor: default;
  font-size: 26px;
  color: white;
  font-weight: normal;
  background-repeat: no-repeat;
  background-position: 13px center;
  background-size: auto 44px; -moz-background-size: auto 44px; -webkit-background-size: auto 44px;
}
.introBlock.teaching {
	background-color: #34B66C;
	background-image: url(/images/tgling/teaching-white_50px.png);
	background-size: 40px 44px; -moz-background-size: auto 40px; -webkit-background-size: auto 40px;
}
.introBlock.giving {
	background-color: #FF852D;
	background-image: url(/images/tgling/giving-white_50px.png);
}
.introBlock.learning {
	background-color: #F7EB0D;
	color: #242424;
	background-image: url(/images/tgling/learning-black_50px.png);
	background-position: 13px center;
	background-size: auto 48px; -moz-background-size: auto 48px; -webkit-background-size: auto 48px;
}
.introBlock span { display: block; padding: 9px 0px 4px; }
.introBlock p {
  font-size: 14px;
  line-height: 24px;
  clear: both;
}


/* What is tgl? 3 popups ------------------------------------------------------------------------------ */
.whats-tgl {
    padding: 42px 4%;
    background-color: #E7FFD4;
	box-shadow: inset 0px 8px 15px -10px rgba(0, 0, 0, 0.35); -moz-box-shadow: inset 0px 8px 15px -10px rgba(0, 0, 0, 0.35); -webkit-box-shadow: inset 0px 8px 15px -10px rgba(0, 0, 0, 0.35);
}
.whats-tgl .head_intro {
    color: #555;
    overflow: hidden;
}
.whats-tgl .head_intro h2 {
    color: #000;
    text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.65);
}
.whats-tgl .head_intro p {
    text-shadow: none;
    padding: 10px 5px 20px;
    font-size: 16px;
}
.introCircle-holder { max-width: 850px; margin: auto; }
.introCircle {
    width: 28%;
    float: left;
    margin: 2.65%;
    text-align: center;
    text-shadow: 0px 0px 40px rgba(0, 0, 0, 0.5);
    height: 230px;
    vertical-align: middle;
    border-radius: 140px 140px 140px 140px;
    cursor: pointer;
	box-shadow: inset 0px -10px 20px 5px rgba(0, 0, 0, 0.15);
		-moz-box-shadow: inset 0px -10px 20px 5px rgba(0, 0, 0, 0.15); -webkit-box-shadow: inset 0px -10px 20px 5px rgba(0, 0, 0, 0.15);
	transition:0.35s; -moz-transition:0.35s; -webkit-transition:0.35s; -o-transition:0.35s;
}
.introCircle.banking { background: #2E7BAD; }
.introCircle.barter_market  { background: #52A738; }
.introCircle.tglhubs { background: #5ABA93; }
.introCircle:hover {
	background: orange;
    box-shadow: inset 0px 5px 15px 5px rgba(255, 255, 255, 0.48);
		-moz-box-shadow: inset 0px 5px 15px 5px rgba(255, 255, 255, 0.48); -webkit-box-shadow: inset 0px 5px 15px 5px rgba(255, 255, 255, 0.48);
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.35);
}

.introCircle h2 {
    font-size: 2.5em;
    line-height: 1em;
    margin: 25% 8% 15px;
    font-family: calibri;
    color: #fff;
}
.introCircle.barter_market h2 { margin-top: 22%; }
.introCircle p {
    color: #eee;
	color: rgba(255, 255, 255, 0.85);
    padding: 0px 20px;
    line-height: 1.5em;
    font-size: 1.15em;
}


/* market place + tgltools ------------------------------------------------------------------------------ */

.market {
  background: url('/images/large/market_full.jpg') 20% top;
  background-size: cover; -moz-background-size: cover; -webkit-background-size: cover;
  width: 100%;
  text-align: center;
  overflow: hidden;
}
.market-text {
	background: #333;
	background: rgba(0, 0, 0, 0.78);
    max-width: 550px;
    width: auto;
    margin: 8% auto;
    color: white;
    font-size: 16px;
    padding: 0px 10px;
    border-radius: 20px 20px 20px 20px;
    border: 2px solid #fff;
    overflow: hidden;
}
.market-text-left {
  text-align: right;
  color: white;
  width: 165px;
  float: left;
  margin: 5% 20px 0px;
}
.market-text-left h2 {
  font-size: 28px;
  line-height: 38px;
  color: white;
  font-weight: normal;
  margin: 0px 0px 24px;
}
.market-text-left p { line-height: 24px; padding-left: 15px; }
.market-text-right {
  float: left;
  text-align: left;
  border-left: 1px solid #f0f0f0;
  border-left: 1px solid rgba(255, 255, 255, 0.45);
  margin: 0px 10px;
  padding: 10px 10px;
  font-size: 22px;
}
.market-text-right p {
    padding: 15px 5px 15px 60px;
    background: no-repeat 10px center /31px;
    font-size: 23px;
    font-weight: 100;
    font-family: calibri
}
.market-text-right p.skills { background-image: url("/images/hearts/3Dheart-SK_50px.png"); }
.market-text-right p.trade { background-image: url("/images/hearts/3Dheart-SV_50px.png"); }
.market-text-right p.banking { background-image: url("/images/hearts/3Dheart-BA_50px.png"); }
.market-text-right p.mytgl { background-image: url("/images/hearts/3Dheart-PQ_50px.png"); }
.market-text-right p.media { background-image: url("/images/hearts/3Dheart-ML_50px.png"); }
.market-text-right p.barter { background-image: url("/images/hearts/barter-50px.png"); }
.market-text-right p.hubs { background-image: url("/images/tglhub/tgl-HUB_icon_55px.png"); }
.market-text-right p.maps { background: url("/images/tgl3/map-icon-large.png") no-repeat 7px center / auto 30px; }
.market-text-right p.searches { background-image: url("/images/tgl3/magnifine_glass_light-50px.png"); }
.market-text-right p.pennyon { background-image: url("/images/pennyon/po-logo-50px.png"); }



/* how-it-works display --------------------------------------------------------------------- */
.dark-wood {
  background: url(/images/tgl3/backgrounds/textures/tileable-wood-colored.png) #3A3A31;
  border-top: 22px solid #000;
}

.how-it-works.container {
  margin: 20px auto 0px;
  max-width: 1300px;
  overflow: hidden;
  padding: 20px 20px 5%;
}

.head_intro { color: #fff; text-align: center; }
.head_intro h2 {
    margin: 30px 0px 25px;
    font-size: 50px;
    color: #fff;
    font-family: 'Sorts Mill Goudy', serif;
    font-weight: normal;
    text-shadow: 1px 4px 2px rgba(0, 0, 0, 0.45);
}
.head_intro p {
    text-shadow: 0px 2px 3px rgb(0, 0, 0);
    font-size: 17px;
}

.step-block {
    width: 42%;
    float: left;
    margin: 30px 4%;
	background: url(/images/tgl3/backgrounds/textures/green-dust-and-scratches.png) rgb(238, 238, 238);
	border-radius: 12px 12px 12px 12px;
	box-shadow: 0px 12px 8px -8px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 12px 8px -8px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0px 12px 8px -8px rgba(0, 0, 0, 0.4);
	transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; -o-transition: 0.3s;
	overflow: hidden;
	cursor: pointer;
}
.step-block:hover {
    box-shadow: 0px 0px 0px 5px #fff; -moz-box-shadow: 0px 0px 0px 5px #fff; -webkit-box-shadow: 0px 0px 0px 5px #fff;
}
.step-block:active {
    box-shadow: 0px 0px 0px 5px rgb(246, 255, 9); -moz-box-shadow: 0px 0px 0px 5px rgb(246, 255, 9); -webkit-box-shadow: 0px 0px 0px 5px rgb(246, 255, 9);
	transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;
}

.step-block.step2, .step-block.step4 { float: right; }

.step-block h3 {
  margin: 0px 0px;
  padding: 0px 10px;
  background: #4492ED;
  color: white;
  border: 2px solid rgba(255, 255, 255, 0.5);
  border-radius: 12px 12px 0px 0px;
  border-bottom: none;
  box-shadow: inset 0px 15px 15px -12px rgba(255, 255, 255, 0.5);
	-moz-box-shadow: inset 0px 15px 15px -12px rgba(255, 255, 255, 0.5); -webkit-box-shadow: inset 0px 15px 15px -12px rgba(255, 255, 255, 0.5);
}
.step-block h3 span {
  font-size: 22px;
  line-height: 35px;
  padding: 12px 10px;
  display: inline-block;
  text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.18)
}
.step-block h3 strong {
  width: 30px;
  display: inline-block;
  text-align: center;
  background-color: white;
  color: #4492ED;
  height: 30px;
  font-size: 15px;
  line-height: 31px;
  text-shadow: none;
  margin: 3px 5px 3px 0px;
  border-radius: 20px;
  box-shadow: inset 0px -1px 5px #BCBCBC; -moz-box-shadow: inset 0px -1px 5px #BCBCBC; -webkit-box-shadow: inset 0px -1px 5px #BCBCBC;
}
.step-block.step2 h3 { background-color: #F59325; } .step-block.step2 h3 strong { color: #F59325; }
.step-block.step3 h3 { background-color: rgb(12, 136, 67); } .step-block.step3 h3 strong { color: rgb(12, 136, 67); }
.step-block.step4 h3 { background-color: rgb(209, 26, 50); } .step-block.step4 h3 strong { color: rgb(209, 26, 50); }

.step-block p {
  font-weight: normal;
  text-align: center;
  font-size: 18px;
  padding: 12px;
  background-color: #FFFFFF;
  color: #222222;
   box-shadow: 0px 1px 6px -2px rgba(18, 77, 0, 0.22); -moz-box-shadow: 0px 1px 6px -2px rgba(18, 77, 0, 0.22); -webkit-box-shadow: 0px 1px 6px -2px rgba(18, 77, 0, 0.22);
}

.step-pic { text-align: center; }
.step-pic img {
    max-width: 85%;
    max-height: 100%;
    width: auto;
    height: auto;
    padding: 2% 1% 3%;
}

ul.ticks { background-color: white; padding: 15px 0px; }
ul.ticks li {
    padding: 7px 0px 7px 30px;
    background: url(/images/NHome/tick.png) no-repeat 0px 50%;
    width: 85%;
    max-width: 400px;
    margin: 0px auto;
    font-size: 14px;
    font-family: "Open Sans",verdana,sans-serif;
}

.step1 .step-pic-inner-text {
  height: 30px;
  margin: 3% 3% -10%;
  padding: 2px 3%;
  float: left;
  text-align: left;
  width: 20%;
  font-size: 14px;
  line-height: 16px;
  color: #4492ED;
}
.step3 .step-pic-inner-text {
  height: 14px;
  margin: -40px 2% 0px 0px;
  padding: 2px 0%;
  font-size: 14px;
  width: 32%;
  line-height: 16px;
  color: #222;
  float: right;
  text-align: left;
  font-weight: bold;
}

.step4 .step-pic-inner-text {
  height: 50px;
  line-height: 55px;
  margin-bottom: -50px;
}
.step4 .step-pic-inner-text span {
  display: inline-block;
  padding: 0px 19px 0px 40px;
  font-size: 35px;
  background: url("/images/hearts/3Dheart-PQ_50px.png") no-repeat 0px center /38px;
  color: #747474;
}
.step4 .step-pic-inner-text strong { color: #CA223C; margin-left: -8px; }

/* CUSTOM SCREEN SIZE STYLING TO STOP TEXT CLIPPING */
@media only screen and (max-width: 1150px) and (min-width: 768px) {
	.step3 .step-pic-inner-text { font-size: 12px; line-height: 14px; }
	.step4 .step-pic-inner-text { height: 55px; margin-bottom: -12%; }
	.step4 .step-pic-inner-text span {
	  padding-left: 35px;
	  font-size: 28px;
	  background-size: 30px;
	}
}
@media only screen and (max-width: 500px) {
	.step4 .step-pic-inner-text { margin-bottom: -10%; }
	.step3 .step-pic-inner-text { margin-top: -36px; font-size: 11px; line-height: 13px; }
}
@media only screen and (max-width: 400px) {
	.step4 .step-pic-inner-text span {
	  padding-left: 30px;
	  font-size: 26px;
	  background-size: 26px;
	}
}



/* landing tab links + popups --------------------------------------------------------------------- */

.white-brick { background: url(/images/tgl3/backgrounds/textures/brick-wall.png) #fff; overflow: hidden; }
.white-brick hr.hr2 { border-bottom: 3px solid #fff; margin-bottom: 22px; }
.white-brick h3 {
  font-size: 29px;
  margin: 20px 10px 30px;
  padding: 0px;
  color: #000;
  font-family: calibri, helvatica, sans-serif;
}
.white-brick .container { max-width: 90%; margin: 40px auto; }

.intro-tabs p {
  width: 460px;
  margin: auto;
  line-height: 25px;
  color: #727272;
  font-size: 17px;
}
.intro-tabs strong { color: #999; font-size: 14px; }


.HomeText {
    background-color: white;
    cursor: default;
    padding: 15px 0px 15px 25px;    
    margin-bottom: 30px;
	border-bottom: 1px solid #f0f0f0;
    border-radius: 0 0 15px 15px;
    box-shadow: 0 9px 13px -5px #5e5e5e; -moz-box-shadow: 0 9px 13px -5px #5e5e5e; -webkit-box-shadow: 0 9px 13px -5px #5e5e5e;
}
.HomeText p {
    font-size: 20px;
    line-height: 32px;
    width: 500px;
    text-align: justify;
    margin: 2% 0 0% 3%;
    padding-bottom: 3%;
    float: left;
    font-family: calibri, Helvetica, sans-serif;
}
.HomeText p span { font-family: calibri, Helvetica, sans-serif; }
.HomeText p.p1, .HomeText p.p2 { border-bottom: 1px solid #dadada; }


/* welcome video */
.WelcomeVideo {
	border: 15px solid #E4E5E4;
	height: 178px;
	width: 320px;
    float: right;
    text-align: center;    
	margin: 30px 40px 25px;
    transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; -o-transition: 0.3s;
}
.WelcomeVideo:hover { border-color: #59CA89; }


.Welcome_links_right {
    height: auto;
    width: 350px;
    float: right;
    margin-right: 40px;
}
.Welcome_links_right div {    
    font-size: 16px;
    font-weight: bold;
	text-decoration: none;
	text-align: center;
	display: block;  
    background: url('/images/tgl3/backgrounds/border.png') #FFFFFF;    
    margin-bottom: 13px; 
	border-radius: 20px 20px 20px 20px;  
    border: 1px solid #F2F2F2;
    box-shadow: inset 0px -6px 15px -5px rgb(181, 181, 181);
		-moz-box-shadow: inset 0px -6px 15px -5px rgb(181, 181, 181); -webkit-box-shadow: inset 0px -6px 15px -5px rgb(181, 181, 181);
	transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; -o-transition: 0.3s;
}
.Welcome_links_right a {
    padding: 15px 20px 15px 75px;  
    background-repeat: no-repeat;
    display: block;
    text-decoration: none;
    color: rgb(76, 76, 76);
    text-shadow: 1px 2px 0px white;
    text-align: left;
}
.Welcome_links_right .linkVid a { background: url("/images/tgl3/yellow_video-icon.png") no-repeat 13px center / auto 25px; }
.Welcome_links_right .linkPres a { background: url("/images/tgl3/tgl_logo_landing-2.png") no-repeat 15px center / auto 35px; }
.Welcome_links_right div:hover {
	background-color: #0069EE;
	border-color: #0060DB;
	box-shadow: inset 0px 6px 15px -5px white; -moz-box-shadow: inset 0px 6px 15px -5px white;  -webkit-box-shadow: inset 0px 6px 15px -5px white; 
}
.Welcome_links_right div.active {
	background-color: orange;
	border-color: white;
	transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;
}

.Welcome_links_right div:hover a,
.Welcome_links_right div.active a { color: white; text-shadow: none; }



/* Map slide */
.logged-out-map {
	background: url('/images/large/maps-02_1000px.jpg') -8px 0px;
	height: 374px;
	width: 988px;
	margin: 30px 0px 30px;
	display: block;
	text-align: center;
	border: 6px solid rgb(34, 34, 34);
	cursor: pointer;
	border-radius: 15px 15px 15px 15px;
	transition: 0.7s;  -moz-transition: 0.7s;  -webkit-transition: 0.7s;  -o-transition: 0.7s;
	box-shadow: 0 9px 13px -5px #5e5e5e; -moz-box-shadow: 0 9px 13px -5px #5e5e5e; -webkit-box-shadow: 0 9px 13px -5px #5e5e5e;
}
.logged-out-map:hover { border-color: white; }

.logged-out-map .text {
	float: left;
	display: block;
	font-size: 26px;
	line-height: 37px;
	font-family: georgia;
	text-decoration: none;
	padding: 25px 35px;
	background: url('/images/tgl3/backgrounds/border.png') rgb(69, 87, 95);
	width: 190px;
	color: white;
	text-shadow: 0px 1px 2px #333;
	text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.24);
	margin: 45px 0px 45px 110px;
	border-radius: 3px 3px 3px 3px;
	border: 3px solid rgb(255, 255, 255);
	box-shadow: -8px 8px 7px 0px #333; -moz-box-shadow: -8px 8px 7px 0px #333; -webkit-box-shadow: -8px 8px 7px 0px #333;
	box-shadow: -8px 8px 7px 0px rgba(0, 0, 0, 0.25); -moz-box-shadow: -8px 8px 7px 0px rgba(0, 0, 0, 0.25); -webkit-box-shadow: -8px 8px 7px 0px rgba(0, 0, 0, 0.25);
	transition: 0.4s; -moz-transition: 0.4s;  -webkit-transition: 0.4s; -o-transition: 0.4s;
	transition-delay: 0.5s; -moz-transition-delay: 0.5s; -webkit-transition-delay: 0.5s; -o-transition-delay: 0.5s;
}
.logged-out-map:hover .text { box-shadow: 0px 0px 4px 3px rgb(0, 120, 213); -moz-box-shadow: 0px 0px 4px 3px rgb(0, 120, 213); -webkit-box-shadow: 0px 0px 4px 3px rgb(0, 120, 213); }
.logged-out-map.active .text,
.logged-out-map.active:hover .text { box-shadow: 0px 0px 10px 5px white; -moz-box-shadow: 0px 0px 10px 5px white; -webkit-box-shadow: 0px 0px 10px 5px white; }

.logged-out-map .text strong { font-family: sans-serif; }
.logged-out-map .text div {
	display: block;
	margin: 22px -35px -25px;
	line-height: 26px;
	font-size: 20px;
	color: rgb(255, 255, 255);
	text-shadow: none;
	font-weight: bold;
	background: rgb(42, 202, 0);
	padding: 12px 20px;
	transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
	transition-delay: inherit; -moz-transition-delay: inherit; -webkit-transition-delay: inherit; -o-transition-delay: inherit;
}
.logged-out-map:hover .text div { background: rgb(26, 145, 229); }
.logged-out-map.active .text div,
.logged-out-map.active:hover .text div{ background: orange; transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s; }




/* join button */
.join_button { }
.join_button  a {
    display:block;
    font-size: 25px;
    font-weight: bold;
    color: white;
    line-height: 50px;
    text-decoration:none;
    text-align: center;
	margin: 45px auto 30px;
    text-shadow: 2px 1px 1px rgba(0, 0, 0, 0.24);
	background-color: #EC7E18;
    width: 75%;
	border: 2px solid #fff;
    border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px;
    box-shadow: 0 0 8px -1px rgb(255, 177, 79); -moz-box-shadow: 0 0 8px -1px rgb(255, 177, 79); -webkit-box-shadow: 0 0 8px -1px rgb(255, 177, 79);
    transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s;
}
.join_button a:hover {
	background: #31C45D;
    box-shadow: 0 0 10px 1px rgb(50, 217, 100); -moz-box-shadow: 0 0 10px 1px rgb(50, 217, 100); -webkit-box-shadow: 0 0 10px 1px rgb(50, 217, 100);
}
.join_button a:active {    
    position: relative;
    top: 2px;
	background: #2DABFF;
    box-shadow: 0 0 10px 1px rgb(74, 189, 255); -moz-box-shadow: 0 0 10px 1px rgb(74, 189, 255); -webkit-box-shadow: 0 0 10px 1px rgb(74, 189, 255);
    transition: 0s; -moz-transition: 0s; -webkit-transition: 0s;
}
.lite-box-new .join_button a {
    margin-top: 0px;
    max-width: 400px;
    font-size: 22px;
    line-height: 43px;
}



/* beta phase text -------------------------------- */
.new_text {
  color: white;
  font-size: 16px;
  padding: 15px 20px 15px 42px;
  margin: 30px auto;
  border-radius: 5px;
  max-width: 750px;
  border: 2px solid white;
  cursor: default;
  background: url("/images/tgl3/UnderConstruction_24px.png") no-repeat 10px center rgb(32, 152, 210);
}
.new_text a { text-decoration: none; color: rgb(254, 254, 61); }
.new_text a:hover { text-decoration: underline; }
.new_text a:active {	color: orange; }




/* Homepage tabs + header */
.whattgl {
    width: 958px;
    background: rgb(87, 131, 197);
    padding: 8px 0px;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
    margin-left: -20px;
    text-align: center;
    cursor: default;
    border-top: 1px solid white;
    box-shadow: 0 -4px 10px -2px rgb(162, 199, 233); -moz-box-shadow: 0 -4px 10px -2px rgb(162, 199, 233); -webkit-box-shadow: 0 -4px 10px -2px rgb(162, 199, 233);
}

.hometabs {	margin-top: 272px;	margin-left: 20px;}
.slidingDiv ul.social_iconframe li { float:left; margin: 0 5px;}



/* =============================================================================================================== */
/* ===================================== NEW LANDING PAGE ADAPTIVE STYLING ======================================= */


@media only screen and (max-width: 1000px) {
	#menu li.loggedout-link { width: 84px; }
	
	.welcome-header { height: 450px }
	
	.inner-banner {
	    font-size: 60px;
		line-height: 0px;
		height: 95px;
		margin-top: -95px;
		box-shadow: inset 0px -70px 94px -20px rgba(0, 0, 0, 0.55); -moz-box-shadow: inset 0px -70px 94px -20px rgba(0, 0, 0, 0.55); -webkit-box-shadow: inset 0px -70px 94px -20px rgba(0, 0, 0, 0.55);
	}
	.inner-banner img {
	  width: 150px;
	  height: auto;
	  margin-top: 55px;
	}
	.logo-large span {
		background-size: 80px auto; -moz-background-size: 80px auto; -webkit-background-size: 80px auto;
		padding-left: 82px;
		height: 90px;
		margin: 0px 6px;
	}
	
	.logo-large {
		padding: 18px 3%;
		font-size: 56px;
		margin-top: 140px;
		line-height: 90px;
	}
	.logo-large span.logo-large-Lbank { padding-left: 90px; line-height: 86px }
	
	.how-it-works.container { margin: 0px auto 0px; padding: 4% 20px 5%; }
	.head_intro h2 { margin: 20px 0px 20px; font-size: 43px; }
	.step-block { width: 45%; margin: 20px 1% 0px; }
	.step-block h3 span { font-size: 21px; padding: 8px 10px; }
	.step-block p { font-size: 15px; padding: 10px; }
	ul.ticks { padding: 10px 0px; }
	ul.ticks li { line-height: 19px; font-size: 13px; }
	.step-pic img { max-width: 84%; }
	.step1 .step-pic-inner-text { font-size: 12px; }
		
}

@media only screen and (max-width: 768px) {
	
	.welcome-header { height: 300px; }
	.logo-large {
		text-align: center;
		width: auto;
		padding: 10px 2.5%;
		margin-top: 95px;
		font-size: 36px;
		line-height: 45px;
		border-radius: 45px 45px 45px 45px;
		border: 4px solid #fff;
		box-shadow: 0px 0px 15px 10px rgba(255, 255, 255, 0.35); -moz-box-shadow: 0px 0px 15px 10px rgba(255, 255, 255, 0.35); -webkit-box-shadow: 0px 0px 15px 10px rgba(255, 255, 255, 0.35);
	}	
	.logo-large span {
		background-size: 45px auto; -moz-background-size: 45px auto; -webkit-background-size: 45px auto;
		padding-left: 46px;
		height: 50px;
		margin: 0px 4px 0px 4px;
	}	
	.logo-large span.logo-large-tgl { background-image: url(/images/hearts/3Dlogo-85px.png); }
	.logo-large span.logo-large-Lbank {
		background-image: url(/images/hearts/3D-LBank-85px.png);
		padding-left: 52px;
		line-height: 50px;
	}
	
	.inner-banner {
		font-size: 45px;
		height: 75px;
		margin-top: -75px
	}
	img.side-leaner {
		width: 110px;
		height: 65px;
		margin-top: 20px;
	}

	.inner-text { max-width: 420px; width: 80%; float: none; margin: auto; }
	.tgling {
	  width: auto;
	  max-width: 400px;
	  margin: 20px auto 0px;
	  float: none;
	}
	.tgling h2 { font-size: 26px; }
	
	.how-it-works.container { padding: 3% 0px; }
	.head_intro h2 { font-size: 35px; }
	.how-it-works .step-block {
	  width: 90%;
	  max-width: 500px;
	  float: none;
	  margin: 2% auto 5%;
	  overflow: hidden;
	}
	.step-block h3 span { font-size: 19px;  padding: 7px 10px; }
	.step-block h3 strong {
		width: 25px;
		height: 25px;
		font-size: 13px;
		line-height: 26px;
		margin: 0px 2px 6px 0px;
	}
	ul.ticks li {
		padding: 6px 0px 6px 30px;
		background-position: 5px 50%;
		background-size: 17px auto; -moz-background-size: 17px auto; -webkit-background-size: 17px auto;
		width: 78%;
	}
	
	.AboutAreas.footer .container {
	  max-width: 650px;
	  margin: 0px 5%;
	  width: 90%;
	}
	.AboutAreas li { width: 100%; }
	
	.market-text {
		max-width: 425px;
		width: 88%;
		font-size: 13px;
		border-width: 1px;
		padding: 10px 4% 15px;
		border-radius: 10px 10px 10px 10px;
	}
	.market-text-left {
	  text-align: left;
	  width: auto;
	  float: left;
	  margin: 5px 10px 0px;
	}
	.market-text-left h2 {
	  font-size: 24px;
	  line-height: 34px;
	  margin: 0px 0px 10px;
	}
	.market-text-left p { line-height: 18px; padding: 0px 0px 12px; }
	
	.market-text-right {
	  float: none;
	  text-align: left;
	  border: none;
	  margin: 0px 0px;
	  padding: 0px 0px;
	}
	.market-text-right p {
	  padding: 7px 5px 7px 35px;
	  background: no-repeat 2px center /23px;
	  font-size: 18px;
	  width: 40%;
	  float: left;
	}
	.market-text-right p.maps { background: url("/images/tgl3/map-icon-large.png") no-repeat 0px center / auto 21px; }
	
}

@media only screen and (max-width: 600px) {

	img.side-leaner { width: 85px; height: 50px; }
	
	.white-brick .container {
		width: 90%;
		max-width: 380px;
		margin: 30px auto;
	}	
	.white-brick h3 { font-size: 22px; }	
	.home .join_button,
	.homeVillage .join_button,
	.login .join_button { margin: 28px auto 25px; }
	.join_button a {
	    max-width: 275px;
		font-size: 18px;
		line-height: 40px;
		margin: 30px auto 25px;
	}
	.new_text {
	  color: white;
	  font-size: 13px;
	  padding: 10px 20px 10px 42px;
	  margin: 5px auto;
	}

}

@media only screen and (max-width: 500px) {

	.container { margin-top: 25px; }
	.inner-banner {
	  font-size: 40px;
	  line-height: 30px;
	}
	img.side-leaner { display: none; }

	.logo-large span {
	  background-size: 40px auto;
	  padding-left: 40px;
	  height: 44px;
	  margin: 0px 4px 0px 4px;
	}
	.logo-large span.logo-large-Lbank { padding-left: 44px; line-height: 41px; }
	
	.market-text { width: 82%; }
	.market-text-left h2 { font-size: 20px; }
	.market-text-right p { font-size: 15px; width: 35%; }
	
	.head_intro h2 { margin: 20px 0px 15px; font-size: 32px; }
	.head_intro p { font-size: 14px; }
	
}

@media only screen and (max-width: 400px) {
	.welcome-header { height: 230px; }
	.welcome-text.container { margin: 25px auto 20px; }
  	.logo-large {
		padding: 7px 2.5%;
		margin-top: 85px;
		font-size: 25px;
		line-height: 36px;
		border-width: 2px;
	}
	.logo-large span {
		background-size: 29px auto; -moz-background-size: 29px auto; -webkit-background-size: 29px auto;
		padding-left: 30px;
		height: 36px;
	}
	.logo-large span.logo-large-Lbank { padding-left: 34px; line-height: 36px; }
	
	.inner-banner {
		font-size: 26px;
		height: 60px;
		margin-top: -60px;
		box-shadow: inset 0px -30px 50px -10px rgba(0, 0, 0, 0.55); -moz-box-shadow: inset 0px -30px 50px -10px rgba(0, 0, 0, 0.55); -webkit-box-shadow: inset 0px -30px 50px -10px rgba(0, 0, 0, 0.55)
	}
	
	.inner-text h2 {
	  font-size: 28px;
	  padding: 42px 0px 15px;
	  margin: 0px 0px 3px;
	  background: url(/images/stickmen/heart-swap_01.png) no-repeat 50% 0px / 58px;
	}
	.inner-text p {
	  padding-bottom: 16px;
	  line-height: 25px;
	  font-size: 14px;
	}
	.inner-text p.your-bank { font-size: 25px; }
	
	.tgling { margin-top: 5px; }
	.tgling h2 { font-size: 22px; }
	.tgling-inner {
	  margin: 12px auto 10px;
	  max-width: 300px;
	  width: 85%;
	  border-radius: 10px 10px 10px 10px;
	  border: 2px solid rgb(255, 255, 255);
	  box-shadow: 0px 0px 7px -2px rgba(0, 0, 0, 0.65); -moz-box-shadow: 0px 0px 7px -2px rgba(0, 0, 0, 0.65); -webkit-box-shadow: 0px 0px 7px -2px rgba(0, 0, 0, 0.65);
	}
	.introBlock { padding: 5px 15px 0px 60px; background-size: auto 32px; -moz-background-size: auto 32px; -webkit-background-size: auto 32px; }
	.introBlock p { font-size: 12px; line-height: 17px; padding-bottom: 10px; }
	.introBlock span { padding: 4px 0px 4px; font-size: 23px; }
	.introBlock.teaching { background-size: auto 31px; -moz-background-size: auto 31px; -webkit-background-size: auto 31px; }
	.introBlock.learning { background-size: auto 38px; -moz-background-size: auto 38px; -webkit-background-size: auto 38px; }
	
	.market-text-right p {
	  padding: 7px 0px 7px 32px;
	  background: no-repeat 2px center / 21px;
	  font-size: 15px;
	  width: 37%;
	  line-height: 18px;
	}
	.market-text-left h2 {
	  font-size: 20px;
	  line-height: 24px;
	  margin: 0px 0px 10px;
	}
	
	.head_intro h2 { margin: 12px 0px 0px; font-size: 30px; }
	.how-it-works p {
	  font-size: 13px;
	  padding: 7px;
	  font-weight: bold;
	}
	.step-block h3 span { font-size: 19px; line-height: 35px; }
	
	.AboutAreas.footer { padding: 20px 0px 10px; }
	.AboutAreas.footer .container { margin: 0px; width: 100%; }
	
}


@media only screen and (max-width: 300px) {

	.inner-text h2 {
	  font-size: 20px;
	  padding: 35px 0px 15px;
	  margin: 0px 0px 0px;
	  background: url(/images/stickmen/heart-swap_01.png) no-repeat 50% 0px / 50px;
	}
	.inner-text p {
	  font-family: arial;
	  padding-bottom: 14px;
	  line-height: 22px;
	  font-size: 12px;
	}
	.inner-text p.your-bank { font-size: 21px; }

	.market-text-right p {
	  padding: 6px 8px 6px 35px;
	  background: no-repeat 2px center /20px;
	  font-size: 17px;
	  width: 55%;
	  float: none;
	  line-height: 18px;
	  margin: 0px auto;
	}
}


/* ===================================== OLD LANDING PAGE INTRO BLOCKS ======================================= */

/* flag banners */
.ban_container {
    text-align: center;
    overflow: auto;
}
.outer-center {
    float: right;
    right: 50%;
    position: relative;
}
.inner-center {
    float: right;
    right: -50%;
    position: relative;
}

.Ban-left {
    background-image: url(/images/tgl3/bannerMed-left.png);
    width: 74px;
    height: 57px;
    float: left;
}
.Ban-mid {
    background-image: url(/images/tgl3/bannerMed-mid.png);
    width: auto;
    height: 57px;
    padding: 0px 15px;
    float: left;
}
.Ban-right {
    background-image: url(/images/tgl3/bannerMed-right.png);
    width: 74px;
    height: 57px;
    float: left;
}

.Ban-mid p {
    font-size: 27px;
    text-align: center;
    margin-bottom: auto;
    color: rgb(75, 87, 94);
    line-height: 45px;
    font-family: calibri, Helvetica, sans-serif;
}

.ban_container .Ban-mid p span {
    font-family: calibri, Helvetica, sans-serif;
    font-style: italic;
    font-weight: bold;
}

.introTabs {
    background-color: rgb(213, 213, 213);
    padding: 1px 20px 17px;
    margin: 40px 0px 50px;
    border: 3px solid rgb(192, 192, 192);
    border-radius: 25px; -moz-border-radius: 25px; -webkit-border-radius: 25px;
    box-shadow: 0 8px 10px -5px #5e5e5e; -moz-box-shadow: 0 8px 10px -5px #5e5e5e; -webkit-box-shadow: 0 8px 10px -5px #5e5e5e;
}


.introContainer {
    height: 90px;
    width: 953px;
    border: 1px solid white;
    transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
}
.introContainer:hover {
    border-color:white;
    box-shadow: 0 0 10px 3px #60A0E6; -moz-box-shadow: 0 0 10px 3px #60A0E6; -webkit-box-shadow: 0 0 10px 3px #60A0E6;
}

.introHeading {
    float: left;
    width: 297px;
    height: 80px;
    line-height: 48px;
    font-size: 36px;
    color: white;
    padding: 5px 10px;
    font-weight: normal;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: 13px 10px;
    background-size: auto 45px; -webkit-background-size: auto 45px;
}
.introHeading span {
    float: left;
    font-family: calibri, Helvetica, sans-serif;
    width: 95%;
    padding-left: 6%;
    text-align: center;
}
.introHeading p {
    font-size: 19px;
    line-height: 32px;
    font-family: calibri, Helvetica, sans-serif;
    text-align: center;
}

.introHeading.Search {
    background-color: #3A75C2;
    background-image: url(/images/tgl3/mag-glass_45x48px.png);
    background-position: 14px 9px;
}
.introHeading.Build {
    background-color: #3F9633;
    background-image: url(/images/tgl3/build-white_45px.png);
    border-right: 1px solid white;
    border-left: 1px solid white;
}
.introHeading.Profile {
    background-color: #C72741;
    background-image: url(/images/tgl3/Member-details_icon-45x37px.png);
    background-position: 17px 11px;
}

.introHeading.tglVIL {
    background-color: #919A9B;
    background-image: url(/images/tgl3/5-hearts-B_50px.png);
    background-position: 14px 11px;
}
.introHeading.tglHUB {
    background-color: #5AA293;
    background-image: url("/images/tglhub/tgl-HUB_icon_33x34px.png");
    border-right: 1px solid white;
    border-left: 1px solid white;
}
.introHeading.tglTOWN {
    background-color: #5BAECE;
    background-image: url("/images/tglhub/Towns-icon_34px.png");
}

.introHeading.bank {
    background-color: #CDDCF3;
    color: #5e5e5e;
    background-image: url(/images/hearts/LBlue_50px.png);
    background-position: 14px 10px;
}
.introHeading.learn {
    background-color: #EBD7C4;
    color: #5e5e5e;
    background-image: url(/images/hearts/Learn-Heart_50px.png);
    background-position: 14px 10px;
    border-right: 1px solid white;
    border-left: 1px solid white;
}
.introHeading.trade {
    background-color: #C7DFDC;
    color: #5e5e5e;
    background-image: url(/images/tgl3/shop_results/Barter_Symbol.png);
    background-position: 12px 9px;
    background-size: auto;
    -webkit-background-size: auto;
}

.ban_container.row1,
.ban_container.row2,
.ban_container.row3 { margin: 25px 0px; }

.introTabs span.click {
	color: #696969;
	text-align: center;
	display: block;
	font-size: 21px;
	margin: 20px 0px -10px;
	font-family: calibri;
}

.row1 span {
    color: #747474;
    text-align: center;
    float: left;
    line-height: 55px;
    font-size: 17px;
}

.introOpen {
    display: block;
    overflow: hidden;
    background-color: white;
    padding-bottom:5px;
    width: 946px;
    margin-left: 1px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    border-width: 3px;
    border-style: none solid solid;
    border-color: rgb(116, 116, 116);
    box-shadow: rgb(153, 153, 153) 0px 8px 10px -5px; -moz-box-shadow: rgb(153, 153, 153) 0px 8px 10px -5px; -webkit-box-shadow: rgb(153, 153, 153) 0px 8px 10px -5px;
}

.introTitle {
    width: 100%;
    font-size: 24px;
    color: #5E5E5E;
    text-align: center;
    padding: 5px 0;
    line-height: 1.6em;
    background-color: #dadada;
    float: left;
    border-bottom: 1px solid #E7E7E7;
}

.introOpen .column-breaker ul li {
    list-style-type: circle;
    padding: 7px 20px 7px 5px;
    margin-left: 38px;
    font-size: 18px;
    font-family: calibri, Helvetica, sans-serif;
}
.introOpen .column-breaker ul li span { font-size: 17px; }



/* -------- LOGGEDIN LANDING PAGE WIDTH -------- */
.login #pageframe { width: 1000px; }
body#Members.login .dataContainer { margin-top: -65px; }
.login #mainHold { width: 1000px; margin-left: 0px; margin-bottom: 40px; }

#Members.login .new_text { margin: 0 0 0 -10px; }

#Members.login .AboutAreas { background: rgb(231, 231, 231); margin-bottom: -10px; }



/* =========================== Account Activated page - /members/activateRegistration ======================= */

.activateRegistration #pageframe {
	width: auto;
	max-width: 958px;
	margin: 0 auto;
	padding-bottom: 0px;
	background: transparent;
	box-shadow: none;-moz-box-shadow: none; -webkit-box-shadow: none;
}

.activateRegistration #mainHold { margin-left: 0px; width: 100%; }
.activateRegistration #main { width: 100%; }

#registrationPage {
	width: 80%;
	min-width: 450px;
	margin: 20px auto;
	background: white;
	border: 4px solid #2E3233;
	border-radius: 20px 20px 20px 20px;
	box-shadow: 0 8px 15px -7px #5e5e5e; -moz-box-shadow: 0 8px 15px -7px #5e5e5e; -webkit-box-shadow: 0 8px 15px -7px #5e5e5e;
	overflow: hidden;
}

#registrationPage h1 {
	margin: 0px;
	color: white;
	width: 100%;
	font-size: 1.85em;
	font-family: calibri, helvetica, sans-serif;
	line-height: 55px;
	height: 55px;
	padding: 0px;
	text-align: center;
}
#registrationPage h1.success { background: rgb(2, 186, 21); }
#registrationPage h1.fail { background: rgb(221, 20, 20); }

#registrationPage .registered {
	padding: 20px;
	line-height: 30px;
	font-size: 25px;
	text-align: center;
}
#registrationPage .registered p.expired {
	color: rgb(52, 171, 244);
	font-style: italic;
	padding-top: 10px;
}



/* =========================================================================================================================================== */


/* =================================== Logged in Header bar =================================== */

.loggedin #menu li a:hover { background-color: #0081BA; }
.loggedin #menu li a:active { background-color: orange; color: white;}


/* ------------ logo -------------- */
#menu li.main-logo a {
    background: url("/images/hearts/white_15x16px.png") no-repeat 50% 9px rgb(40, 175, 65);
    height: 52px;
	padding: 0px 8px 0px 10px;
    line-height: 70px;
    color: #fff;
    letter-spacing: 1.2px;    
    font-size: 15px;    
}


/* ============================= member's profile thumb + name ============================= */
#menu li.memberinfo_tab.tiny_memberinfo_logo {
    padding: 0px;
    height: 52px;
    float: right;
}
#menu li.memberinfo_tab .member_loggedin img {
    width: auto;
    height: 34px;
    padding: 9px 0px 9px 8px;
}
.member_loggedin { height: 52px; cursor: pointer; }
.member_loggedin:hover  { background-color: #8B98A1; }
.member_loggedin:active { background-color: orange; }
.member_loggedin.active { background-color: #64ACD8; }
.member_loggedin.active:hover { background-color: #1F9DEA; }

#menu li.memberinfo_tab a.memberdetailstab {
	line-height: 52px;
	height: 52px;
	font-size: 15px;
	float: right;
	padding: 0px 30px 0px 8px;
	background: url('/img/menu_arrow_closed.png') no-repeat 90% center transparent;
}	
#menu .member_loggedin:hover a.memberdetailstab { background-image: url('/img/menu_arrow_open.png'); background-color: transparent; }
#menu .member_loggedin:active a.memberdetailstab { background-position: 90% 26px }
#menu .member_loggedin.active a.memberdetailstab { background-image: url('/img/menu_arrow_open.png'); }
#menu .member_loggedin.active:hover a.memberdetailstab { background-image: url('/img/menu_arrow_up.png'); }
#menu .member_loggedin.active:active a.memberdetailstab { background-position: 90% 22px }


/* logged in membername dropdown */
#menu #membername_dropdown { float: right; }
#menu #membername_dropdown > ul,
#menu #search_dropdown > ul {
	background: #F2F2F2;
    width: 246px;
    float: right;
    margin-left: -250px;
	color: #5e5e5e;
	position: absolute;
	border-radius: 0px 0px 5px 5px;
	border: 2px solid #fff;
	border-top: 0px solid;
	overflow: hidden;
	box-shadow: 0 3px 8px -3px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 3px 8px -3px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 3px 8px -3px rgba(0, 0, 0, 0.3);
}
#menu #membername_dropdown ul a {
	padding: 10px 10px 10px 40px;
	display: block;
	color: #5e5e5e;
	font-size: 16px;
	line-height: 21px;
	background-repeat: no-repeat;
	background-position: 10px center;
}
#menu #membername_dropdown ul a:hover { background-color: white; }
#menu #membername_dropdown ul li.active a,
#menu #membername_dropdown ul li.active a:hover { background-color: orange!Important; color: white!Important; cursor: default; }

/* icons */
#menu #membername_dropdown .ViewProfile a,
#menu #membername_dropdown .CoOrg a,
#menu #membername_dropdown .co_staff a {
	background-size: 24px; -moz-background-size: 24px; -webkit-background-size: 24px;
	background-position: 6px center;
}
#menu #membername_dropdown .Settings a { background-image: url("/images/tgl3/manage-cog.png"); }
#menu #membername_dropdown .LOGOUT a {
    background: url("/images/tgl3/logout-on_16px.png") no-repeat 12px 50% / 12px #FFFFFF;
    font-size: 15px;
    padding: 4px 10px 4px 40px;
    color: #BEBEBE;
    border-top: 2px solid #EBEBEB;
}
#menu #membername_dropdown .LOGOUT a:hover { color: #EF3E3E; border-color: rgb(237, 168, 168); }
#menu #membername_dropdown .LOGOUT a.active {
    color: #FFFFFF;
    border-color: rgb(97, 97, 97);
    background-color: #EF3E3E;
    cursor: default;
}


/* Sub menu dropdowns */
#menu #membername_dropdown .menu_drop div { 
	padding: 7px 26px 7px 6px;
	background: url('/img/menu_arrow_temp_closed2.gif') no-repeat 93% center;
	border-top: 1px solid white;
    cursor: pointer;
    font-size: 13px;
	transition: 0.35s; -moz-transition: 0.35s; -webkit-transition: 0.35s; -o-transition: 0.35s;
}
#menu #membername_dropdown .menu_drop div:hover,
#menu #membername_dropdown .menu_drop div.active {
    background-image: url('/img/menu_arrow_temp_open2.gif');
    background-color: #E9EEF5;
    color: #548BDB;
    border-color: #B6C4E5;
    padding-left: 12px;
    background-position: 94% 50%;
}
#menu #membername_dropdown .menu_drop div:active { background-position: 93% 55% ; background-color: rgb(255, 246, 153); color: #000000; }
#menu #membername_dropdown .menu_drop div.active:hover { background-image: url('/img/menu_arrow_temp_up.gif'); color: #2197FF; padding-left: 6px }
#menu #membername_dropdown .menu_drop div.active:active {
	background-position: 93% 45%;
	background-color: rgb(255, 246, 153);
	color: #000000;
}
#menu #membername_dropdown .menu_drop div:active { transition-property: background-color; transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s; }

#menu #membername_dropdown .menu_drop_div {
	background-color:#fff;
	margin: 0px;
	border-bottom: 2px solid #EBEBEB;
    max-height: 225px;
    overflow-y: auto;
    overflow-x: hidden;
}
#menu #membername_dropdown .menu_drop_div a { border-bottom: 1px solid #F1F1F1; }
#menu #membername_dropdown .menu_drop_div a:hover { background-color: #FFFF64; color: #222; }

/* co-org switch ----------------------------------- */
#company_switch div {
    font-size: 13px;
    color: #FFFFFF;
    text-align: center;
    padding: 3px 13px 3px;
    background: #82D289;
}

/* change language logged in */
#menu #membername_dropdown .menu_drop_div.lang a { padding: 5px 5px 5px 10px; }
#menu #membername_dropdown .menu_drop_div.lang a.current {
	background-color: #FFFFFF!Important;
    color: #80AEED!Important;
    cursor: default!Important;
    text-decoration: underline;
}
#menu #membername_dropdown .menu_drop_div.lang a img{
	padding: 5px 11px 0px 3px;
    height: 12px;
    width: auto;
    float: left;
}
#menu #membername_dropdown .menu_drop_div.lang a span { font-family: Calibri, Helvetica, sans-serif; }




/* ------------ MAIN MENU -------------- */
#menu li.Menu-btn a {
    font-size: 19px;
	height: 52px;
    line-height: 52px;
	padding: 0px 12px 0px 45px;
	background-image: url(/images/tgl3/MENU_50px.png);
    background-size: 30px auto; -moz-background-size: 30px auto;
	background-repeat: no-repeat;
    background-position: 8px center;
}


/* ------------ Search tgl link & dropdown -------------- */
#menu li.search-link a.search_btn {
    background-image: url('/img/menu_arrow_closed.png');
	background-repeat: no-repeat;
	background-position: 90% center;
    padding-right: 35px;
}
#menu li.search-link a.search_btn:hover { background-image: url('/img/menu_arrow_open.png');}
#menu li.search-link a.search_btn:active { background-position: 90% 26px; }
#menu li.search-link a.search_btn.active { background-image: url('/img/menu_arrow_open.png'); background-color: #4F4F4F; }
#menu li.search-link a.search_btn.active:hover { background-image: url('/img/menu_arrow_up.png'); background-color: #0081BA; }
#menu li.search-link a.search_btn.active:active { background-position: 90% 22px }

#menu li.search-link a.search_btn  p {
	font-size: 19px;
    height: 52px;
    line-height: 52px;
	padding: 0px 0px 0px 40px;
    background-image: url(/images/tgl3/magnifine_glass_light-24px.png);   
    background-size: 19px auto; -moz-background-size: 19px auto;
    background-repeat: no-repeat;
    background-position: 10px center;
    font-family: calibri;
    width: auto;
}
#menu #search_dropdown > ul {
	height: 0px;
	overflow: hidden;
	transition: 0.6s; -moz-transition: 0.6s; -webkit-transition: 0.6s; -o-transition: 0.6s;
    background: #444;
    position: absolute;
    margin: 0px 0px 0px -2px;
	border-bottom-width: 0px;
}
#menu #search_dropdown > ul.active { height: 207px; }
#menu #search_dropdown > ul.extra.active { height: 225px; }

#menu #search_dropdown ul a {
    font-size: 19px;
    color: #fff;
}
#menu #search_dropdown ul li.searchtab a {
    background-image: url(/images/tgl3/tgl_logo_landing-2.png);
	background-repeat: no-repeat;
	background-position: 12px 50%;
    background-size: 19px; -moz-background-size: 19px;
    padding: 10px 10px 10px 45px;
}
#menu #search_dropdown ul a:hover { background-color: #787878; }
#menu #search_dropdown ul a:active,
#menu #search_dropdown ul a.active { background: orange!Important; }


/*============================ HOME / MAP LINK ============================ */

#menu li.home-map-link .home_map { height: 52px; line-height: 52px; }
#menu li.home-map-link .home_map.active,
#menu li.home-map-link .home_map.active:hover { background-color: orange; }

#menu li.home-map-link .home_map p {
    background: url('/images/tgl3/map-icon-large.png') no-repeat 10px 50% / 28px auto;
    font-size: 19px;
    line-height: 52px;
    padding: 0px 10px 0px 45px;
    width: auto;
    float: left;
    font-family: Calibri, Helvetica, sans-serif;
}
#menu li.home-map-link .home_map span {
	font-size: 13px;
    text-align: center;
    display: block;
    font-family: georgia;
    float: left;
    line-height: 54px;
    height: 52px;
    font-style: italic;
    color: #DBDF35;
    padding: 0px 8px 0px 0px;
}
#menu #search_dropdown ul a.set-address {
	font-size: 14px;
    text-align: center;
    background: #84C290;
    line-height: 25px;
}
#menu #search_dropdown ul a.set-address:hover { background: #28AF41; }


/* TOWNS search in dropdown */
.towns-menu {
    background: #fff;
    padding: 5px 10px 30px;
    overflow: hidden;
}
.towns-menu input#tgl_town_search {
    width: 94%;
    background: url(/images/tgl3/magnifine_glass_light-24px.png) no-repeat 11px center / 17px #F5F5F5;
    border: none;
    border-radius: 0px 0px 0px 0px;
    line-height: 30px;
	text-indent: 30px;
    height: 30px;
}
.towns-menu input#tgl_town_search:hover {
    box-shadow: 0px 3px 3px -3px #999; -moz-box-shadow: 0px 3px 3px -3px #999; -webkit-box-shadow: 0px 3px 3px -3px #999;
}

.towns-menu button {
    color: #fff;
    border: none;
    padding: 5px 12px;
    background: #6BD270;
    font-size: 13px;
    border-radius: 2px 2px 2px 2px;
	cursor: pointer;
}
.towns-menu button:hover { background-color: #0098FF; }
.towns-menu button.active,
.towns-menu button.active:hover { background-color: orange; cursor: default; }


/* Flash popup messages ---------------------------------------------------------------- */
#flash_message .menu-pop {
    max-width: 650px;
    color: #555;
    line-height: 26px;
    border: none;
	box-shadow: 0px 12px 11px -11px rgba(0, 0, 0, 0.15);
		-moz-box-shadow: 0px 12px 11px -11px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0px 12px 11px -11px rgba(0, 0, 0, 0.15);
}

.flash_message_div {
	width: 100%;
    position: absolute;
    left: 0px;
    text-align: center;
	opacity: 1;
	transition: 0.6s; -moz-transition: 0.6s; -webkit-transition: 0.6s; -o-transition: 0.6s;
}
#flash_message.hide { opacity:0; }
.flash.flash_message { padding: 3% 65px; }
.fail .flash_message { background: url(/images/tgl3/warning_22x20px.png) no-repeat 20px 50%; }

.success .inner .closeX a { background: rgb(81, 188, 41); color: #fff; }

.flash_message p {
    padding: 10px 0px 0px;
    line-height: 28px;
    border-top: 1px solid #f0f0f0;
    margin-top: 12px;
    color: #333;
}
.fail p { color: #F71717; }
.success p {
	color: #51BC29;
    font-size: 23px;
    line-height: 45px;
}



/* Other sitewide warning messages */
#flashMessage,
div.message {
  background: url(/images/tgl3/warning_22x20px.png) no-repeat 15px center #858585;
  position: fixed;
  border: 2px solid #ACACAC;
  color: rgb(255, 255, 255);
  box-shadow: 0px 8px 7px -7px #333; -moz-box-shadow: 0px 8px 7px -7px #333; -webkit-box-shadow: 0px 8px 7px -7px #333;
  box-shadow: 0px 8px 7px -7px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 8px 7px -7px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 8px 7px -7px rgba(0, 0, 0, 0.5);
  margin: 0px auto 5px;
  top: 8%;
    padding: 12px 15px 12px 55px;
    left: 25%;
    font-size: 17px;
    line-height: 28px;
  width: 45%;
  z-index: 4;
  border-radius: 5px 5px 5px 5px;
}
div.message p.note {
	color: #dadada;
    padding-top: 5px;
    border-top: 1px solid #999;
    margin-top: 10px;
}


/*============================ MAIN / SEARCH / BUILD  MENUS ============================ */
.lite-box-new {
	position: fixed;
	width: 100%;
	z-index: 500;
	overflow: hidden;
	overflow-y: auto;
	height: 100%;
	left: 0px;
	top: 0px;
}
.widget {
	position:relative;
        max-width: 300px;
	overflow: hidden;
	overflow-y: auto;
	max-height: 220px;

}
.outer {
    position: relative;
    left: 50%;
    float: left;
    width: 100%;
	height: 100%;
}
.inner {
	left: -50%;
	position: relative;
	background: url("/images/tgl3/backgrounds/textures/tweed.png"); /* Used if browser cannot display opacity colours */
	background: rgba(30, 30, 30, 0.9);
	overflow: hidden;
	overflow-y: auto;
	height: 100%;
}
.inner.white ,
#manage-discussion-thread .inner,
#main-hub-menu .inner { background: rgba(210, 210, 210, 0.92); }


.closeX {
	margin: 15px auto;
    right: 20px;
    position: fixed;
}
.inner .closeX a {
    color: #8F8F8F;
    background: #fff;
    padding: 5px 15px;
    text-decoration: none;
    font-size: 17px;
    opacity: 0.85;
    font-weight: bold;
    border-radius: 5px;
    border: 1px solid #dadada;
    border: 1px solid rgba(255, 255, 255, 0.5);
    transition: 0.1s; -moz-transition: 0.1s; -webkit-transition: 0.1s; -o-transition: 0.1s;
}
.inner .closeX a:hover {
	background: #288FE9;
    color: white;
    opacity: 1;
}
#flash_message .closeX {
    position: inherit;
    right: auto;
    display: block;
    text-align: center;
}

.menu-pop {
	overflow: hidden;
	background-color: white;
	margin: 20px auto;
	border: 1px solid #DCDCDC;
	border-radius: 10px 10px 10px 10px;
	max-width: 800px;
	min-width: 450px;
}


/* ============ MAIN MENU =============== */
#MAINMENU {
	position: fixed;
    width: 408px;
    padding: 0px 20px;
    z-index: 150;
    left: -550px;
    overflow: hidden;
    overflow-y: auto;
    height: 100%;
	background: rgb(210, 215, 213);
	box-shadow: 0px 0px 16px 5px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 0px 16px 5px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 0px 16px 5px rgba(0, 0, 0, 0.3);
	transition: 0.5s ease-out; -moz-transition: 0.5s ease-out; -webkit-transition: 0.5s ease-out; -o-transition: 0.5s ease-out;
}
#MAINMENU.active { left: 0px; }

.close-menu a {
	text-align: center;
    margin: 0px -20px 9px;
    padding: 1px 15px 2px;
    line-height: 30px;
    color: #FFFFFF;
    display: table;
    float: right;
    background: rgb(148, 151, 150);
    text-decoration: none;
    font-size: 14px;
    border-radius: 0px 0px 0px 6px;
    cursor: pointer;
}
.close-menu a:hover { background-color: rgb(194, 17, 17); }
.close-menu a:active{ background-color: red; }

.main-title {
    text-align: center;
    background: #fff;
    color: #222;
    font-weight: 100;
    line-height: 26px;
    font-family: calibri;
    font-size: 19px;
    padding: 3px 15px;
    margin-top: 5%;
    border-radius: 5px 5px 0px 0px;
}

.menu-Main {
    border: none;
    margin: 0px auto 25px;
    padding: 0px 8px 8px 0px;
    overflow: hidden;
    background-color: #F0F0F0;
    box-shadow: 0px 7px 5px -5px rgba(0, 0, 0, 0.14); -moz-box-shadow: 0px 7px 5px -5px rgba(0, 0, 0, 0.14); -webkit-box-shadow: 0px 7px 5px -5px rgba(0, 0, 0, 0.14);
}


/* Drop sub-menus ---------------- */
.menu-Main .drop { background: url('/img/menu_arrow_temp_closed2.gif') no-repeat 95% center #fff; }
.menu-Main .drop:hover { background: url('/img/menu_arrow_open.png') no-repeat 95% center; color: #fff; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; }
.menu-Main .drop:active { background: url('/img/menu_arrow_open.png') no-repeat 95% 28px; color: #fff; }
.menu-Main .drop.active { background: url('/img/menu_arrow_open.png') no-repeat 95% center; border-radius: 3px 3px 0px 0px;  }
.menu-Main .drop.active:hover { background: url('/img/menu_arrow_up.png') no-repeat 95% center; }
.menu-Main .drop.active:active { background: url('/img/menu_arrow_up.png') no-repeat 95% 23px; }
.menu-Main .aboutTgl.drop:active { background-position: 95% 23px; }
.menu-Main .aboutTgl.drop.active:active { background-position: 95% 17px; }

.menu-drop-list {
	height: 0px;
	overflow: hidden;
	width: 98%;
	margin: 0px 0px 0px 8px;
	background: #666;
    box-shadow: 0 10px 5px -5px rgba(0, 0, 0, 0.35); -moz-box-shadow: 0 10px 5px -5px rgba(0, 0, 0, 0.35); -webkit-box-shadow: 0 10px 5px -5px rgba(0, 0, 0, 0.35);
	transition: 0.5s; -moz-transition: 0.5s; -webkit-transition: 0.5s; -o-transition: 0.5s;
}
.menu-drop-list.active { margin-bottom: 5px; }

.menu-drop-list li { height: auto; width: 100%; padding: 0px; }
.menu-drop-list li a {
	font-size: 17px;
	display: block;
	text-align: left;
	color: white;
	text-decoration: none;
	font-family: calibri, helvetica, sans-serif;
	cursor: pointer;
	padding: 14px 20px 14px 66px;
	line-height: 17px;
	background-repeat: no-repeat;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	background-position: 18px center;
	background-size: 24px auto; -moz-background-size: 24px auto; -webkit-background-size: 24px auto;
}
#MAINMENU .menu-drop-list li a:hover {
	border-color: white;
	background-color: #6DB1F0;
    color: #fff;
    text-decoration: none;
}
#MAINMENU .menu-drop-list li.active a,
#MAINMENU .menu-drop-list li.active a:hover { background-color: orange; }


/* Main links ----------------- */
.tile {
	margin: 8px 0px 0px 7px;
    width: 98%;
    float: left;
    font-size: 27px;
    line-height: 30px;
    display: block;
    text-align: left;
    color: #454545;
    text-decoration: none;
    background-color: #fff;
    border-radius: 2px 2px 2px 2px;
    font-weight: 100;
    border: 1px solid #E7E6E6;
    cursor: pointer;
}
.menu-Main .tile:hover { color: #fff; }

.menu-Main .tile.active p,
.menu-Main .tile.active:hover p { color: white; }


/* ============= MAIN MENU SECTION ============= */

.tile p {
	line-height: 38px;
	font-weight: 100;
	font-family: calibri, helvetica, sans-serif;
	padding: 9px 10px 9px 65px;
	background-repeat: no-repeat;
	background-position: 14px 50%;
	background-size: 34px auto; -moz-background-size: 34px auto; -webkit-background-size: 34px auto;
}
.searchtab p { background-image: url(/images/tgl3/mag-glass_45x48px.png); }
.buildtab p { background: url(/images/tgl3/flag_yellow.png) no-repeat 15px 50%; }
.tiny_hub_logo p { background-image: url("/images/tglhub/tgl-HUB_icon_33x34px.png"); }


/* Getting Started Guide */
.tile.get_started {
	background: rgb(52, 192, 78);
    color: #fff;
    border-radius: 22px;
    font-size: 22px;
    text-align: center;
    margin: 12px 0px 4px 7px;
    border: none;
    transition: 0.35s; -moz-transition: 0.35s; -webkit-transition: 0.35s; -o-transition: 0.35s;
}
.tile.get_started:hover {
    background-color: rgb(0, 223, 39);
    box-shadow: 0px 6px 5px -6px rgba(0, 0, 0, 0.55); -moz-box-shadow: 0px 6px 5px -6px rgba(0, 0, 0, 0.55); -webkit-box-shadow: 0px 6px 5px -6px rgba(0, 0, 0, 0.55);
}
.tile.get_started p {
	background: url(/images/hearts/white_47x50px.png) no-repeat 14px 50% / 20px auto;
    line-height: 35px;
    padding: 4px 10px 4px 45px;
    display: inline-block;
}


/* Search -- ONLY DISPLAYS BELOW 768px */
.tile.searchtab { }
.tile.searchtab:hover { background-color: rgb(71, 165, 255); }
.tile.searchtab.drop.active { background-color: #34C04E; }

#search-drop.active { height: 195px; }
#search-drop li.searchtab a { background-image: url(/images/tgl3/tgl_logo_landing-2.png); }
#search-drop li.home-map-link a {
    background-image: url('/images/tgl3/map-icon-large.png');
	background-position: 14px center;
    background-size: 34px auto; -webkit-background-size: 34px auto; -moz-background-size: 34px auto;
}
#search-drop .towns-menu ul {  margin-bottom: 8px; }

/* Build / Search */
.tile.buildtab { color: rgb(30, 126, 229); }
.tile.buildtab.drop:hover  { background-color: rgb(133, 217, 19); }
.tile.buildtab.drop.active { background-color: #149ED5; }

#offer-drop.active { height: 92px; }


/* L BANK */
.tile.bank_logo { }
.tile.bank_logo:hover { background-color: rgb(8, 144, 229); }
.tile.bank_logo.active { background-color: orange; }
.tile.bank_logo p.title {
	font-size: 32px;
    cursor: pointer;
    display: inline;
    background: url(/images/hearts/LBlue_50px.png) no-repeat 16% center / 36px transparent;
    padding: 0px 10px 0px 65px;
    line-height: 60px;
    float: left;
    color: #5095C0;
}

.tile.bank_logo .balance {
    height: 60px;
    min-width: 32%;
    float: right;
    font-size: 16px;
    line-height: 20px;
    background: rgb(80, 149, 192);
}
.tile.bank_logo:hover .balance {  background: rgb(44, 44, 44); }
.tile.bank_logo:hover p.title,
.tile.bank_logo.active p.title { color: white; }
.tile.bank_logo .balance p { line-height: inherit; padding: 5px 10px 5px; text-align: center; color: #fff }
.tile.bank_logo .balance p.balance-amount { background: #F0F8FE; color: #4071A6; }


/* Mytgl section */
.tile.MyProfile.drop:hover  { background-color: rgb(167, 49, 49); }
.tile.MyProfile.drop:hover span  { color: #eee; }
.tile.MyProfile.drop.active { background-color: rgb(216, 21, 50); }

.tile.MyProfile .avatar {
	float: left;
    margin: 0px 13px 0px 0px;
    height: 56px;
    width: 56px;
    text-align: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%;
    background-color: #222;
}
.tile.MyProfile span {
	font-size: 13px;
	color: #C5C5C5;
	padding-left: 3px;
	line-height: 34px;
}
.tile.MyProfile:hover p,
.tile.MyProfile:hover strong ,
.tile.MyProfile.active strong,
.tile.MyProfile.active span{ color:white!Important; }


#mytgl-edit { background: rgb(118, 73, 79);}
#mytgl-edit.active { height: 276px; }

.ViewProfile a { background-image: url("/images/tgl3/members/member-circle_50px.png"); }
.EditHeader a { background-image: url("/images/tgl3/Member-details_icon-45x37px.png"); }
.EditTab a { background-image: url("/images/tgl3/grid-view_icon_19px-white.png"); }
.CoOrg a { background: url("/images/tgl3/members/co-circle_red_50px.png"); }
.co_staff a { background-image: url("/images/tgl3/members/member-star-02_50px.png"); }
.Settings a { background-image: url("/images/tgl3/manage-cog.png"); }
.newoffer a { background-image: url(/images/tgl3/flag_blue.png); }
.my-offers a { background-image: url(/images/tgl3/5-hearts-B_50px.png); }

.menu-drop-list li.MyMedia a { font-family: georgia; background-image: url("/images/hearts/3Dheart-ML_50px.png"); }
.MyMedia a strong { font-family: sans-serif!Important; }

#mytgl-edit .ViewProfile a,
#mytgl-edit .co_staff a,
#mytgl-edit .CoOrg a {
    background-position: 16px 50%;
    background-size: 28px auto; -moz-background-size: 28px auto; -webkit-background-size: 28px auto;
}
/* NOTE (#mytgl-edit a.CoOrg) = member account, (#mytgl-edit .CoOrg a) = co/org account */
#mytgl-edit a.btn-click.active { background-color: orange; color: white; }



/* HUBS */
.tile.tiny_hub_logo { color: #1C5D51;}
.tile.tiny_hub_logo:hover { background: rgb(29, 108, 95); }
.tile.tiny_hub_logo:active { background: orange; }



/* ============== ABOUT tgl section ============== */

.tile.aboutTgl p {
    padding: 6px 10px 6px 65px;    
    font-size: 25px;
	color: #5C269F;
    background-image: url("/images/post_it_note/infopad_question-purple.png");
    background-size: auto; -moz-background-size: auto;
	background-position: 18px center;
}
.tile.aboutTgl:hover p {
    background-image: url("/images/post_it_note/infopad_question-black.png");
    background-position: 16px center;
    color: #fff;
}
.tile.aboutTgl:active p { background-image: url("/images/post_it_note/infopad_question-black.png"); }

.menu-Main a.tile.about-btn:hover { background-color: rgb(146, 85, 237); }
.menu-Main a.tile.about-btn:active { background-color: orange; }



/* ======================= Search & Build Pop-ups ======================= */

/* NEW TABLE LAYOUT */
.menu-pop table {
	background: #f0f0f0;
	background-size: 15px; -moz-background-size: 15px; -webkit-background-size: 15px;
	margin: 0px;
	border: none;
}
.menu-pop h1 {
	margin: 0px;
	padding: 5px;
    text-align: center;
	overflow: hidden;
}

.menu-pop.Search h1,
#my-towns-menu #new-map-search  { background-color: rgb(16, 118, 190); overflow: hidden; }


.menu-pop h1 p {
	font-size: 25px;
	text-align: center;
	color: white;
	padding: 15px 50px;
	display: inline-block;
	text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.15);

	background-repeat: no-repeat;
	background-position: 0px center;
	background-size: 35px auto; -moz-background-size: 35px auto; -webkit-background-size: 35px auto;
}
.menu-pop.Search h1 p { background-image: url(/images/tgl3/magnifine_glass_light-50px.png); display: table; float: left; }
.menu-pop.Build h1 p { background-image: url(/images/tgl3/build-white_45px.png); }


.menu-pop th { width: 34%; background: white; } /* SETS WIDTH FOR ALL COLUMNS */
tr.subHeader th {
	text-align: center;
	padding: 10px 5px;
	font-size: 16px;
	letter-spacing: 0.5px;
	font-weight: bold;
	border-bottom: 1px solid;
}
tr.subHeader th.shop-vil { color: #30B46F; border-bottom: 1px solid #B0DACC; }
tr.subHeader th.skills-ex { color: #F78D42; border-bottom-color: #FFD8BD; }
tr.subHeader th.more { color: #5690E7; border-color: #DADADA; }

.menu-pop td { padding: 0px; vertical-align: top; }
table .skills-ex { border-left: 1px solid #dadada; border-right: 1px solid #dadada; }

.menu-pop a {
	text-decoration: none;
	font-size: 18px;
	display: block;
	font-family: Calibri, Helvetica, sans-serif;
	line-height: 25px;
	color: #333333;
	padding: 11px 10px 11px 50px;
	background-repeat: no-repeat;
}

/* AREA ICONS */
.menu-pop .product a { background-image: url(/images/tgl3/shop_baskets/Cart_55px.png); }
.menu-pop .product.active a { background-image: url(/images/tgl3/shop_baskets/Cart-white_55px.png); }
.menu-pop .shop a { background-image: url(/images/tgl3/village_shops_35x39px.png); }
.menu-pop .service a { background-image: url(/images/tgl3/village_services_35px.png); }
.menu-pop .swap a { background-image: url(/images/tgl3/village_swaps_35px.png); }

.menu-pop .offer a { background-image: url(/images/tgl3/flag_blue.png); }
.menu-pop .want a { background-image: url(/images/tgl3/flag_silver.png); }

.menu-pop .course a { background-image: url(/images/tgl3/village_courses_35x38px.png); }
.menu-pop .project a { background-image: url(/images/tgl3/village_projects_35px.png); }
.menu-pop .volunteer a { background-image: url(/images/tgl3/village_volunteer_22x35px.png); }

.menu-pop .hub a { background-image: url("/images/tglhub/tgl-HUB_icon_33x34px.png"); }
.menu-pop .member a { background-image: url("/images/tgl3/members/member-circle_50px.png"); }

.menu-pop a:hover { background-color: white; color: #000000; }
.menu-pop .shop-vil a:hover { color: #009E6C; }
.menu-pop .skills-ex a:hover { color: #F87314; }
.menu-pop .member a:hover{ color: #E50F31; }
.menu-pop .media a:hover{ color: #A59800; }

.menu-pop a:active,
.menu-pop .shop-vil a:active,
.menu-pop .skills-ex a:active,
.menu-pop .member a:active,
.menu-pop .media a:active { background-color: #74B3EE; color: white; }

.menu-pop .active a,
.menu-pop .active a:hover { background-color:orange; color: white; }


/* BUILD ----------------------------------------------------- */
.menu-pop.Build {
    max-width: 425px;
    min-width: 0px;
    width: 92%;
}
.menu-pop.Build h1 { border-bottom: 1px solid #eee; }
.menu-pop.Build h1 p {
	background: url(/images/tgl3/flag_yellow.png) no-repeat 0px 50% /21px;
    text-shadow: none;
    font-size: 21px;
    padding: 10px 10px 10px 30px;
    color: #777;
    font-weight: 100;
}
.menu-pop.Build ul { background: #f0f0f0; }
.menu-pop.Build ul li { }
.menu-pop.Build ul li a {
    font-size: 19px;
	padding: 19px 10px 18px 65px;
    border-bottom: 1px solid #fff;
    background-position: 15px center;
    background-size: 28px auto; -moz-background-size: 28px auto; -webkit-background-size: 28px auto;
}
.menu-pop.Build ul li.course a {
	background-size: 33px auto; -moz-background-size: 33px auto; -webkit-background-size: 33px auto;
}
.menu-pop.Build ul li.volunteer a {
	background-position: 20px center;
	background-size: auto 34px; -moz-background-size: auto 34px; -webkit-background-size: auto 34px;
}


/* OFFER/WANT ADD/EDIT ----------------------------------------------------- */
.menu-pop.Item {
    max-width: 550px;
    border-radius: 0px 0px 0px 0px;
    border: none;
	min-width: 0px;
    width: 92%;
	box-shadow: 0px 11px 7px -5px; -moz-box-shadow: 0px 11px 7px -5px; -webkit-box-shadow: 0px 11px 7px -5px;
}
.menu-pop.Item h1 {  background-color: #000; }
.Item h1 p {
	background: url(/images/tgl3/flag_blue.png) no-repeat 0px 50% / 28px;
    padding: 6px 38px;
    font-weight: normal;
    font-family: calibri;
    font-size: 30px;    
}
.Item form { padding: 5.5% 7.5%; }
.item.select {
    font-size: 23px;
    font-family: calibri;
	margin-bottom: 15px;
}
.item.select input {
    margin: 0px 7px 0px 15px;
    height: 20px;
    width: 18px;
    cursor: pointer;
}

.item.title input {
    font-size: 27px;
    height: auto;
    line-height: 46px;
    border-radius: 0px 0px 0px 0px;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.12);
    background-color: #FFF8DC;
    color: #000;
    font-family: calibri;
    margin-bottom: 20px;
    padding-left: 4%;
    width: 96%;
}
textarea.product,
textarea.product.keywords {
    font-size: 20px;
    height: auto;
    min-height: 100px;
    border-radius: 0px 0px 0px 0px;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.12);
    background-color: #F2F2F2;
    color: #000;
    font-family: calibri;
    padding: 2% 3%;
    width: 93%;
}
textarea.product.keywords { background-color: #fff; }

#ItemExtras {
    background-color: #F4F4F4;
    padding: 3% 5% 2%;
    border-radius: 0px 0px 8px 8px;
    box-shadow: 0px 9px 9px -10px #999; -moz-box-shadow: 0px 9px 9px -10px #999; -webkit-box-shadow: 0px 9px 9px -10px #999;
}
#ItemExtras hr { border-bottom: 2px solid #FFFFFF; }

#ItemExtras #l_div {
    float: none;
    display: flex;
    line-height: 32px;
    font-size: 16px;
    color: #3E3E3E;
}
#ItemExtras #l_div input {
    width: 85px;
    height: 30px;
    margin: 0px 10px;
    text-indent: 20px;
    background-color: #FFFFFF;
}
.currencySpan {
    position: absolute;
    margin-left: 18px;
    font-size: 19px;
    color: #2899DD;
}

p.submit_confirm {
    background-color: #0195F0;
    padding: 15px;
    font-size: 21px;
    color: #FFF;
    font-family: calibri;
    text-align: center;
}


/* ============================== NOTIFICATIONS / Quicklinks ============================ */
#menu li.quicklinks-link { float: right; width: 54px; }
#menu li.quicklinks-link a.icon {
    background: url(/images/tgl3/notification-icon-32_grey.png) no-repeat 50%;
    padding: 0px;        
    height: 52px;
    cursor: pointer;
}
#menu li.quicklinks-link a.icon.active { background-color: #fff; }

#menu li.quicklinks-link a.icon:hover,
#menu li.quicklinks-link a.icon.active:hover { background-color: #2985DF; }
#menu li.quicklinks-link a.icon:active { background-color: orange!Important; }

#menu #notifications_drop {
    max-height: 379px;
	width: 400px;
	margin-left: -348px;
    display: block;
    background-color: white;
    border: 1px solid #D7D7D7;
	border-top: none;
    border-radius: 0px 0px 5px 5px;
    overflow: hidden;
	box-shadow: 4px 4px 3px 0px rgba(0, 0, 0, 0.16); -moz-box-shadow: 4px 4px 3px 0px rgba(0, 0, 0, 0.16); -webkit-box-shadow: 4px 4px 3px 0px rgba(0, 0, 0, 0.16);
}
.notification-count{
    display: none;
    position: fixed;
    min-width: 12px;
    padding: 1px 5px;
    background-color: red;
    color: white;
    border-radius: 15px 15px 15px 15px;
    margin-left: 5px;
    margin-top: -16px;
    font-size: 12px;
    font-weight: 800;
	text-align: center;
    border: 2px solid;
}

.notification-header { background: #EEE; overflow: hidden; }
.notification-header span {
    font-size: 13px;
    padding: 5px 14px;
    display: inline-block;
    float: left;
    cursor: pointer;
}
.notification-header span:hover { text-decoration: underline; background: #fff; }
.notification-header span.active,
.notification-header span.active:hover {
    font-weight: bold;    
    background: #2CA0FF;
    color: #fff;
	cursor: default;
	text-decoration: none;
}


#menu #subscribed-to-notifications {
    max-height: 350px;
    overflow: hidden;
    overflow-y: scroll;    
	cursor: default;
}
#subscribed-to-notifications .thread-notification {
    background-color: #FFFFFF;
    padding: 6px 8px 2px;
    border-bottom: 1px solid #eee;
}
#subscribed-to-notifications .thread-notification.active{ background: #FFFF9B; border-color: rgb(189, 189, 189); }

.notification_head { line-height: 18px; }
#subscribed-to-notifications li span a {
    color: #2C81FF;
    display: inline-block;
    padding: 0px 3px;
}
#menu #subscribed-to-notifications li a:hover {
    background: none;
    text-decoration: underline;
}
#menu #subscribed-to-notifications li a:active { color: orange; }

.follow a, .unfollow { float: right; }
.follow a, .unfollow a {
    color: #dadada;
    padding: 4px 6px;
    display: block;
    text-decoration: none;
}
.follow a:hover, .unfollow a:hover { color: #fff; background-color: #3C8AEB; }
.follow a:active, .unfollow a:active { color: orange; }



#quicklinks-drop { }

#quicklinks-drop th { padding: 0px; width: 100%  }
#quicklinks-drop th a {
    padding: 12px 10px 12px 50px;
    color: #555;
    display: block;
    font-size: 15px;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: 10px center;
    background-size: 25px auto;
    border-bottom: 1px solid #dadada;
	transition: 0.2s; -moz-transition: 0.2s; -webkit-transition: 0.2s; -o-transition: 0.2s;
}
#quicklinks-drop th a span { font-weight: normal; }

#quicklinks-drop tr.update a { color: #000; background-color: rgb(251, 255, 194); }
#quicklinks-drop tr.update th.qlnumber { background-color: #F9F958; color: #000; }

/*Hover*/
#quicklinks-drop tr a:hover,
#quicklinks-drop tr.update a:hover {
	background-color: rgb(0, 10, 17);
    border-color: rgba(255, 255, 255, 0.15);
    color: #fff;
}
#quicklinks-drop tr a.active { background-color: orange; transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;}

/*Icons */
#quicklinks-drop tr.new-orders a { background-image: url("/images/tgl3/shop_baskets/Cart-NEW_2_55px.png"); }
#quicklinks-drop tr.completed-orders a  { background-image: url("/images/tgl3/shop_baskets/Cart-TICK_2_55px.png"); }
#quicklinks-drop tr.baskets a { background-image: url("/images/tgl3/shop_baskets/Cart-NEW_2-white_55px.png"); }
#quicklinks-drop tr.purchases a { background-image: url("/images/tgl3/shop_baskets/Cart-TICK_2-white_55px.png"); }
#quicklinks-drop tr.tglmail a {
	background-image:url(/img/1315314254_Mail_compose.png);
	background-size: 32px auto;
	background-position: 6px center;
}
#quicklinks-drop tr.services a { background-image: url("/images/tgl3/village_services_35px.png"); }
#quicklinks-drop tr.swaps a { background-image: url("/images/tgl3/village_swaps_35px.png"); }
#quicklinks-drop tr.courses a { background-image: url("/images/tgl3/village_courses_35x38px.png"); }
#quicklinks-drop tr.volunteer a {
	background-image: url(/images/tgl3/village_volunteer_22x35px.png);
	background-size: auto 28px;
	background-position: 14px center;
}
#quicklinks-drop tr.discussions a { background-image: url("/images/tgl3/discussion_24px.png"); }
#quicklinks-drop tr.subscriptions a {  }
#quicklinks-drop tr.l-balance a { background-image: url(/images/hearts/LBank_glow-33px.png); }

/* number */
#quicklinks-drop th.qlnumber {
    width: 55px;
    text-align: center;
    color: #5e5e5e;
    font-size: 15px;
    display: block;
    font-weight: bold;
    vertical-align: middle;
    background-color: rgb(255, 255, 255);
    cursor: default;
    padding: 12px 8px;
}




/* ============================ tglmail ============================ */
.loggedin #menu li.tiny_tglmail_logo {
	background: url(/img/1315314254_Mail_compose.png) no-repeat 6px 60% / 38px auto transparent;
    padding: 0px;
    height: 52px;
    float: right;
    width: 90px;
    cursor: pointer;
}
.loggedin #menu li.tiny_tglmail_logo.active { background-color: #95388E; }
.loggedin #menu li.tiny_tglmail_logo:hover { background-color: #2192E3!Important; }
.loggedin #menu li.tiny_tglmail_logo:active { background-color: orange; transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; }

/* tglmail counter */
.loggedin .msgcount_css {
	background: rgba(255, 255, 255, 0.2);
    padding: 0px 8px;
    color: #FFFFFF;
    border-radius: 10px 10px 10px 10px;
    font-size: 14px;
    margin-top: 13px;
    margin-left: 6px;
    line-height: 24px;
    position: absolute;
}
.loggedin #menu li.tiny_tglmail_logo:hover .msgcount_css { }
.loggedin #menu li.tiny_tglmail_logo.active .msgcount_css {
    font-weight: bold;
}

/* text */
.loggedin #menu li.tiny_tglmail_logo a.barText { height: 52px; display: inline-block; }

/* tglmail Dropdown */
.loggedin #menu li.tiny_tglmail_logo .dropdown_1column,
.admin #menu li.tiny_tglmail_logo.admin .dropdown_1column { width:auto; min-width: 125px; padding: 0px; }

.admin #menu li.tiny_tglmail_logo.admin .dropdown_1column {
    position: relative;
    margin-top: -42px;
    border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px;
}

.loggedin #menu li.tiny_tglmail_logo .dropdown_1column ul,
.admin #menu li.tiny_tglmail_logo.admin .dropdown_1column ul { margin:0px; }
.loggedin #menu li.tiny_tglmail_logo .dropdown_1column li,
.admin #menu li.tiny_tglmail_logo.admin .dropdown_1column li { width:auto; border-bottom: 1px solid #ECECEC; }
.loggedin #menu li.tiny_tglmail_logo .dropdown_1column li:hover,
.admin #menu li.tiny_tglmail_logo.admin .dropdown_1column li:hover { border-color: #A4CCE7;}
.loggedin #menu li.tiny_tglmail_logo .dropdown_1column li a,
.admin #menu li.tiny_tglmail_logo.admin .dropdown_1column li a {
    color: #5e5e5e;
    min-width: 105px;
    width: auto;
    font-size: 14px;
    padding: 5px 10px;
    transition: 0.30s; -moz-transition: 0.30s; -webkit-transition: 0.30s;
}
.loggedin #menu li.tiny_tglmail_logo .dropdown_1column li a:hover,
.admin #menu li.tiny_tglmail_logo.admin .dropdown_1column li a:hover { background-color: #E0E6E9; color: #0083DA; padding: 5px 5px 5px 15px;}
.loggedin #menu li.tiny_tglmail_logo .dropdown_1column li a:active,
.admin #menu li.tiny_tglmail_logo.admin .dropdown_1column li a:active {
    background-color: #AADEF7;
    transition: 0.1s; -moz-transition: 0.1s;  -webkit-transition: 0.1s;
}



/* =================================================  ============================================ */



/* ================================================= RE-SIZING TOP RAIL FOR SMALLER SCREEN SIZES ============================================ */


/*  LOGGED OUT TOP RAIL ADAPTIVE STYLING ------------------------------------------------------------ */
@media screen and (max-width: 1020px) {	
	.dashboard_holder.loggedout #menu { margin: 0px 5px; }	
}

@media screen and (max-width: 768px) {
	
	.dashboard_holder.loggedout, #Pages .dashboard_holder.loggedout { height: 43px; }

	.dashboard_holder.loggedout p a {
	  background: url("/images/hearts/3Dheart-green_50px.png") no-repeat 5px center / 18px auto;
	  padding: 11px 15px 11px 31px;
	  color: white;
	  font-size: 15px;
	  float: left;
	}
	#menu li.loggedout-link { width: auto; padding: 3px 20px; margin-top: 5px; }
	
	
	#menu li.loggedout_language_icons,
	#Pages #menu li.loggedout_language_icons {
		margin: 4px 7px 0px 0px;
		height: 36px;
		width: 45px;
		border-radius: 3px 3px 0px 0px;
	}
	#menu li.loggedout_language_icons .aLanguage { line-height: 28px; }
	#menu li.loggedout_language_icons .aLanguage span img {
		width: 30px;
		border: 1px solid rgb(66, 66, 66);		
		border-radius: 0px 0px 0px 0px;
		box-shadow: 0 0 0px 1px rgba(255, 255, 255, 0.2);
		  -moz-box-shadow: 0 0 0px 1px rgba(255, 255, 255, 0.2); -webkit-box-shadow: 0 0 0px 1px rgba(255, 255, 255, 0.2);
	}
	#menu li.loggedout_language_icons .dropdown_1column.language { margin-top: -5px; }

}
@media screen and (max-width: 400px) {
	.dashboard_holder.loggedout, #Pages .dashboard_holder.loggedout { height: 38px; }
	.dashboard_holder.loggedout #menu { margin: 0px 2px; }
	#menu li a, #menu li.memberinfo_tab a { font-size: 13px; }
	#menu li.loggedout-link {
	  padding: 1px 15px;
	  margin: 4px 3px;
	}
}


	
/*  LOGGED IN TOP RAIL ADAPTIVE STYLING  ------------------------------------------------------------  */

@media screen and (max-width: 768px) {
	
	.dashboard_holder.loggedin { position: absolute; height: 38px; }
	

	/* Reduced spacing for pages which touch the top rail */
	.dataContainer { margin-top: 58px; }
	#Towns .dataContainer,
	#Datas.myoffers .dataContainer,
	#Libraries.manage_index .dataContainer,
	#Infopages .dataContainer,
	#Members .dataContainer,
	#Companies .dataContainer,
	#Hubs.hub_home .dataContainer { margin-top: 32px; }
	#Pages .dataContainer { margin-top: 30px; }

	.member_loggedin,
	#menu li.home-map-link .home_map,
	.loggedin #menu li.memberinfo_tab.tiny_memberinfo_logo { height: 38px; line-height: 38px; padding: 0px 0px 0px 0px; }
	.loggedin #menu li.memberinfo_tab .member_loggedin img	{ height: 24px; max-width: 30px; padding: 7px 0px 7px 7px; }

	
	#menu li.main-logo {
		height: 38px;
		font-size: 9px;
		background-size: 13px;
		background-position: 50% 6px;
		line-height: 55px;
	}
	#menu li.main-logo a {
		background: url("/images/hearts/white_15x16px.png") no-repeat 50% 6px / 11px rgb(40, 175, 65);
		height: 38px;
		padding: 0px 7px 0px 9px;
		line-height: 52px;
		letter-spacing: 0.4px;
		font-size: 12px;
	}
		
	
	#menu li.Menu-btn a {
		height: 38px;
		line-height: 38px;
		font-size: 16px;
		background-size: 30px; -moz-background-size: 30px; -webkit-background-size: 30px;
	}
	#menu li.quicklinks-link { width: 44px; }
	#menu li.quicklinks-link a.icon {
		width: 44px;
		height: 38px;
		background-size: 20px; -moz-background-size: 20px; -webkit-background-size: 20px;
	}
	#menu #notifications_drop { width: 320px; margin-left: -278px; }

	/* SEARCH NOW MOVED INTO MAIN MENU UNDER 768px -----
	#menu li.search-link a.search_btn {
		padding-right: 24px;
		background-size: 6px 5px;
	}
	#menu li.search-link a.search_btn p {
		font-size: 13px;
		height: 38px;
		line-height: 38px;
		padding: 0px 0px 0px 28px;
		background-size: 15px auto; -moz-background-size: 15px auto;
		background-position: 7px center;
	}
	#menu #search_dropdown > ul { width: 210px; }
	#menu #search_dropdown > ul.active { height: 178px; }
	#menu #search_dropdown ul li.searchtab a,
	#menu li.home-map-link .home_map p {
		font-size: 16px;
		line-height: 36px;
		padding: 0px 10px 0px 40px;
		background-size: 18px auto; -moz-background-size: 18px auto;
	}
	#menu li.home-map-link .home_map span { line-height: 38px; font-size: 12px; padding: 0px 7px 0px 0px; }
	END TOP RAIL SEARCH DEVICE DISPLAYS	*/
	
	.loggedin #menu li.tiny_tglmail_logo {
		height: 38px;
		width: 68px;
		background-position: 1px 3px;
		background-size: 36px auto; -moz-background-size: 36px auto; -webkit-background-size: 36px auto;
	}
	.loggedin .msgcount_css {
	  font-size: 12px;
	  margin-top: 9px;
	  margin-left: 6px;
	  line-height: 20px;
      padding: 0px 6px;
	}
	
	.loggedin #menu li.memberinfo_tab a.memberdetailstab {
	  font-size: 12px;
	  line-height: 28px;
	  height: 28px;
	  padding: 5px 20px 5px 7px;
	  background-position: 93% center;
	  background-size: 6px 5px;
	}	
	.loggedin #menu li.member_loggedin:active a.memberdetailstab { background-position: center 26px }
	.loggedin #menu li.member_loggedin.active:active a.memberdetailstab { background-position: center 20px }
}
@media screen and (max-width: 550px) {

	#menu #notifications_drop {
		width: 100%;
		position: fixed;
		margin-left: 0px;
		left: 0px;
	}

	#MAINMENU { width: 100%; padding: 0px; }
	.close-menu a {
		float: none;
		font-size: 12px;
		margin: 0px auto 0px;
		width: auto;
		display: block;
		line-height: 27px;
		border-radius: 0px 0px 0px 0px;
	}
	.menu-Main { width: 92%; max-width: 360px; }
	.main-title {
	    width: 92%;
		max-width: 360px;
		margin: 17px auto 0px;
		font-size: 17px;
		padding: 3px 4px;
	}

	.tile.bank_logo p.title {
	  font-size: 25px;
	  background: url(/images/hearts/LBlue_50px.png) no-repeat 17% 50% / 29px transparent;
	  padding: 6px 10px 6px 60px;
	  line-height: 40px;
	}
	.tile.bank_logo .balance {
		height: 48px;
		float: right;
		font-size: 20px;
		line-height: 20px;
	}
	.tile.bank_logo .balance p { padding: 2px 10px 3px; font-size: 13px; }
	.tile.bank_logo .balance p.balance-amount { padding: 3px 10px 4px; font-size: 15px; }
	
	.tile p {
		font-size: 21px;
		padding: 6px 10px 7px 60px;
		background-position: 13px 50%;
		background-size: 26px auto; -moz-background-size: 26px auto; -webkit-background-size: 26px auto;
	}

	#mytgl-edit.active { height: 220px; }
	#about-menu.AboutAreas.active { padding-bottom: 5px; height: 388px; }
	
	.menu-drop-list li a {
	  padding: 12px 10px 12px 45px;
	  background-position: 10px center!Important;
	  font-size: 14px;
	  line-height: 18px;
	  background-size: 19px auto!Important; -moz-background-size: 19px auto!Important; -webkit-background-size: 19px auto!Important;
	}
	
	.tile.MyProfile .avatar { height: 50px; width: 50px; }
	.tile.MyProfile span { font-size: 12px; }
	.menu-drop-list li a {
	  background-position: 7px center;
	  background-size: auto 25px; -moz-background-size: auto 25px;  -webkit-background-size: auto 25px;
	}
	
	#about-menu.AboutAreas li a.linkVid {
		background-position: 4px center;
		background-size: auto 19px; -moz-background-size: auto 19px; -webkit-background-size: auto 19px;	
	}
}
@media screen and (max-width: 450px) {
	
	#menu li.Menu-btn a{
	    width: 46px;
		padding: 0px;
		font-size: 0px;
	}
	
	/* SEARCH NOW MOVED INTO MAIN MENU UNDER 768px -----
	#menu li.home-map-link .home_map p { background: url('/images/tgl3/map-icon-large.png') no-repeat 50% / 30px auto; width: 44px; }
	#menu li.home-map-link .home_map span { display: none; }
	END TOP RAIL SEARCH DEVICE DISPLAYS	*/
	
	#menu li.quicklinks-link ,
	#menu li.quicklinks-link a.icon { width: 38px; }
	
	
	.loggedin #menu li.tiny_tglmail_logo { width: 62px; }
	.loggedin .msgcount_css {
	  font-size: 10px;
	  margin-left: 8px;
	  padding: 0px 5px;
	}
	
	.loggedin #menu li.memberinfo_tab a.memberdetailstab { font-size: 11px; padding: 5px 15px 5px 5px; }
	#menu li a, #menu li.memberinfo_tab a { font-size: 15px; }
}

@media screen and (max-width: 320px) {

	.tile, .tile.full { height: 46px; }
	
	.tile.bank_logo .balance { height: 44px; }
	.tile.bank_logo .balance p { padding: 1px 10px 1px; font-size: 11px; }
	.tile.bank_logo .balance p.balance-amount { font-size: 13px;  padding: 2px 10px 2px; }
	
	.tile.MyProfile .avatar { height: 46px; width: 40px; margin: 0px 10px 0px 0px; }
	
	.tile p,
	a.tile.full.bank_logo p.title,
	.tile.tiny_hub_logo p {
	  font-size: 19px;
	  padding: 4px 10px 4px 50px;
	  background-position: 8px 50%;
	  background-size: 21px auto; -moz-background-size: 21px auto; -webkit-background-size: 21px auto;
	}
	#MAINMENU .tile.aboutTgl { height: 40px; }
	#MAINMENU .tile.aboutTgl p {
		font-size: 15px;
		text-align: left;
		padding: 5px 10px 5px 52px;
		line-height: 29px;
	}
	
	.tile.MyProfile span { display: none; }
	#mytgl-edit.active ,
	#about-menu.AboutAreas.active { height: auto; }
	
}
	

/* =================================================  ============================================ */


/* ================================================== HEADER BACK BUTTONS ================================================= */

a.back {
	display: block;
	color: white;
	font-size: 19px;
	text-decoration: none;
	font-weight: bold;
	float: right;
	padding: 0px 20px 0px 47px;
	border-bottom-right-radius: 13px;
	font-family: sans-serif;
	text-shadow: none;
	background: url("/images/tgl3/back-grey-23px.png") no-repeat 13px center #999;
	background: url("/images/tgl3/back-grey-23px.png") no-repeat 13px center rgba(255, 255, 255, 0.4);
	transition: 0.2s; -moz-transition: 0.2s; -webkit-transition: 0.2s; -o-transition: 0.2s;
	cursor: pointer;
}
a.back:hover { background-color: rgb(29, 143, 255); color: white; }
a.back.active {
    background-color: orange;
    color: white;
    text-shadow: 1px 1px 2px rgb(77, 56, 56);
    transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;
}

.mytgl_header a.back { background-color: rgba(255, 60, 89, 0.5); }


/* ================================================== MANAGE YOUR PROFILE LINKS ================================================= */

.mytgl_edit_icon.v2 {
	margin: 0px;
	padding: 0px;
	line-height: 55px;
	height: 55px;
	text-indent: 0px;
	min-width: 230px;
	width: auto;
	float: left;
	font-size: 17px;
	font-weight: normal;
	border-bottom-left-radius: 13px;
	background: #5e5e5e;
	background: rgba(0, 0, 0, 0.2);
	transition: 0.15s; -moz-transition: 0.15s; -webkit-transition: 0.15s; -o-transition: 0.15s;
	cursor: pointer;
}
.mytgl_edit_icon.v2:hover { background-color: white; color: #222;  }
.mytgl_edit_icon.v2:active { background-color: orange; }

.mytgl_edit_icon.v2 span.area {
	float: left;
	font-weight: normal;
	padding-left: 70px;
	padding-right: 20px;
	font-size: 25px;
	background: no-repeat 20px center / 35px transparent;
}
.myoffers-head .mytgl_edit_icon.v2 span.area { background-image: url(/images/tgl3/5-hearts-B_50px.png); }
h2.hubs_title.MyMedia span.area { background-image: url("/images/hearts/3Dheart-ML_50px.png"); font-family: georgia; }
.mytgl_header .mytgl_edit_icon.v2 span.area { background-image: url("/images/hearts/3Dheart-PQ_50px.png"); }

div.sub-area {
	color: #f0f0f0;
	float: left;
	padding-left: 10px;
}

.mytgl_edit_icon.v2 span.manage {
	background: url("/img/menu_arrow_closed.png") no-repeat 95% 50%;
	font-size: 14px;
	display: block;
	padding-right: 30px;
	text-align: right;
	border-bottom-left-radius: 13px;
}
.mytgl_edit_icon.v2:hover span.manage { background: url("/img/menu_arrow_temp_open.gif") no-repeat 96.5% 50%; }
.mytgl_edit_icon.v2:active span.manage { background: url("/img/menu_arrow_temp_open.gif") no-repeat 96.5% 55%; }
.mytgl_edit_icon.v2.active span.manage { background: url("/img/menu_arrow_temp_open.gif") no-repeat 96.5% 50%; }
.mytgl_edit_icon.v2.active  span.manage:hover { background: url("/img/menu_arrow_temp_up.gif") no-repeat 96.5% 50% white; }
.mytgl_edit_icon.v2.active  span.manage:active { background: url("/img/menu_arrow_temp_up.gif") no-repeat 96.5% 44% orange; }

/* MyMedia / MyOffers changes */
#Libraries .mytgl_edit_icon.v2.active { background-color: rgb(255, 217, 23); color: #222; }
#Datas .mytgl_edit_icon.v2.active,
.mytgl_header .mytgl_edit_icon.v2.active { background-color: #119CE5; color: #FFF; }


#Datas .mytgl_edit_icon.v2 span.manage { background: url("/img/menu_arrow_temp_closed2.gif") no-repeat 95% 50%; }
#Datas .mytgl_edit_icon.v2:hover span.manage { background: url("/img/menu_arrow_temp_open.gif") no-repeat 96.5% 50%; }
#Datas .mytgl_edit_icon.v2:active span.manage { background: url("/img/menu_arrow_temp_open.gif") no-repeat 96.5% 55%; }
#Datas .mytgl_edit_icon.v2.active span.manage { background: url("/img/menu_arrow_open.png") no-repeat 96.5% 50%; }
#Datas .mytgl_edit_icon.v2.active  span:hover,
.mytgl_header .mytgl_edit_icon.v2.active  span:hover { color: #222; }
#Datas .mytgl_edit_icon.v2.active  span.manage:hover { background: url("/img/menu_arrow_temp_up.gif") no-repeat 96.5% 50% white; }
#Datas .mytgl_edit_icon.v2.active  span.manage:active { background: url("/img/menu_arrow_temp_up.gif") no-repeat 96.5% 44% orange; }


#mytgl-edit.profile-edit-links {
	width: 19%;
	margin-right: 10px;
	float: left;
	height: auto;
	list-style: none;
/*	background-color: #333;	*/
	border-radius: 3px 3px 3px 3px;
	box-shadow: -7px 8px 5px -5px rgba(0, 0, 0, 0.45); -moz-box-shadow: -7px 8px 5px -5px rgba(0, 0, 0, 0.45); -webkit-box-shadow: -7px 8px 5px -5px rgba(0, 0, 0, 0.45);
	overflow: hidden;
}
#mytgl-edit.profile-edit-links p {
	color: rgb(34, 34, 34);
	font-weight: bold;
	text-align: center;
	line-height: 36px;
	background: #FFFFFF;
	font-family: calibri;
	font-size: 14px;
}
#mytgl-edit.profile-edit-links li a {
	font-size: 17px;
	padding: 16px 10px 16px 45px;
	line-height: 22px;
	display: block;
	text-align: left;
	color: white;
	text-decoration: none;
	font-family: calibri, helvetica, sans-serif;
	cursor: pointer;
	border-color: #dadada;
	border-color: rgba(255, 255, 255, 0.12);
	background-size: 22px auto;
	background-position: 12px 50%;
    background-repeat: no-repeat;
    text-shadow: none;
}
#mytgl-edit.profile-edit-links .ViewProfile a,
#mytgl-edit.profile-edit-links .CoOrg a {
	background-position: 7px center;
	background-size: 30px auto; -moz-background-size: 30px auto; -webkit-background-size: 30px auto;
}
#mytgl-edit.profile-edit-links .Settings a { border: none; }

#mytgl-edit.profile-edit-links li a:hover { border-color: white; background-color: #6DB1F0; }
#mytgl-edit.profile-edit-links li.active a,
#mytgl-edit.profile-edit-links li.active a:hover { background-color: orange; }

#mytgl-edit.profile-edit-links li.current a,
#mytgl-edit.profile-edit-links li.current a:hover { background-color: #DD2E4A; cursor: default; border: none; }

#mytgl-edit.profile-edit-links .others { background-color: rgb(229, 229, 229); }
#mytgl-edit.profile-edit-links .others li a { border-color: #C0C0C0; color: #333; }
#mytgl-edit.profile-edit-links .others li a:hover { border-color: white; color: white; }
#mytgl-edit.profile-edit-links li.MyOffers a { background-image: url(/images/tgl3/5-hearts-B_50px.png); }
#mytgl-edit.profile-edit-links li.MyMedia a { font-family: georgia; font-weight: normal; background-image: url("/images/hearts/3Dheart-ML_50px.png"); border: none; }
#mytgl-edit.profile-edit-links li.MyMedia strong { font-family: sans-serif; }



/* DROP-DOWN VIEW */
#manage-links {
	position: absolute;
	display: block;
	height: 0px;
	margin-left: -10px;
	z-index: 10;
	overflow: hidden;
	transition: 1s; -moz-transition: 1s; -webkit-transition: 1s; -o-transition: 1s;
}
#manage-links #mytgl-edit.profile-edit-links { width: auto; margin: 0px 8px 0px 8px; }
#manage-links.active,
.v2 #manage-links.long.active { height: 455px; }

.v2 #manage-links #mytgl-edit.profile-edit-links { width: 92%; margin: 0px 5px 5px 10px; }
.v2 #manage-links.active { height: 265px; }

.viewhome #mytgl-edit.profile-edit-links p,
.viewhome #mytgl-edit.profile-edit-links li.ViewProfile,
#Datas #mytgl-edit.profile-edit-links li.MyOffers,
#Libraries #mytgl-edit.profile-edit-links li.MyMedia,
#Libraries #mytgl-edit.profile-edit-links li.CoOrg.add,
#Libraries #mytgl-edit.profile-edit-links li.Settings { display: none; }


@media screen and (max-width: 650px) {
	#mytgl-edit.profile-edit-links.active  { height: 345px; }
	#mytgl-edit.profile-edit-links  li a {
	  font-size: 15px;
	  padding: 12px 10px 12px 45px;
	  line-height: 17px
	}
	#mytgl-edit.profile-edit-links .ViewProfile a,
	#mytgl-edit.profile-edit-links .CoOrg a {
	  background-position: 11px center;
	  background-size: 25px auto; -moz-background-size: 25px auto; -webkit-background-size: 25px auto;
	}
	div.sub-area { font-size: 14px; }
	
	.v2 #manage-links.long.active { height: 385px; }

	.header-new.mytgl_header,
	.header-new.myoffers-head,
	h2.header-new.hubs_title.MyMedia {
		height: 44px;
		line-height: 44px;
		font-size: 14px;
		margin-bottom: 15px;
	}
	
	.mytgl_edit_icon.v2 {
	  line-height: 44px;
	  height: 44px;
	  margin: 0px auto;
	}
	.mytgl_edit_icon.v2 span.area {
	  padding-left: 60px;
	  padding-right: 15px;
	  font-size: 20px;
	  background: no-repeat 20px center / 25px transparent;
	}
}




/* ====================================================================================================================================== */

#navigationMenu li{
    list-style:none;
    height:48px;
    padding:2px;
    width:45px;
}

#navigationMenu span{
    /* Container properties */
    width:0;
    left:45px;
    padding:0;
    position:absolute;
    overflow:hidden;
    margin-top: 2px;
    height: 36px;

    /* Text properties */
    font-family:'Myriad Pro',Arial, Helvetica, sans-serif;
    font-size:14px;
    font-weight:bold;
    color: rgb(18, 139, 177);
    letter-spacing:0.6px;
    white-space:nowrap;
    line-height:30px;

    /* CSS3 Transition: */
    -webkit-transition: 0.25s;

    /* Future proofing (these do not work yet): */
    -moz-transition: 0.25s;
    transition: 0.25s;
}



/* ========== Share this ========== */
#sharethisdiv {
    height: 32px;
    padding: 2px 5px;
    background: rgba(0, 0, 0, 0.19);
    border-left: 1px solid#A3A3A3;
}
.serpUtilityBar #sharethisdiv { margin-top: -2px; }



/* ============================== NEW HUBS FULLSCREEN MENU ============================== */
.menu-holder {
    max-width: 875px;
    margin: auto;
    padding: 2%;
    overflow: hidden;
}
.menu-header {
    height: 40px;
    width: 350px;
    overflow: hidden;
    background: #fff;
    border-radius: 10px 10px 10px 10px;
    margin: 0px auto 20px;
}
#main-towns-menu .menu-header { background-color: rgb(60, 188, 255); }
.menu-header div { float: left; }

/* About hubs */
.hubs_about {
    border-right: 1px solid #eee;
    width: 244px;
}
.hubs_about a {
	cursor: pointer;
    color: rgb(103, 103, 103);
    font-size: 15px;
    height: 40px;
    line-height: 40px;
    text-indent: 50px;
    display: block;
    background: url("/images/post_it_note/infopad_question.png") no-repeat 16px 50% / 22px;
}
.hubs_about:hover a { background-color: rgb(34, 34, 34); color: white;}

.close-hub a {
    color: rgb(177, 177, 177);
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    line-height: 40px;
    padding: 0px 30px 0px 10px;
    width: 65px;
    display: block;
    background: url('/images/nfe/fancy_close.png') no-repeat 70px 50% / 21px;
}
.close-hub a:hover { background-color: rgb(197, 36, 48); color: #fff; }


/* tglHubs / MYhubs */
.menu-body { }

.side_hub_menu {
	cursor: default;
	width: 48%;
	float: right;
	overflow: hidden;
	border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;
}
.side_hub_menu.tgl-hubs { margin-left: 4%; }

h2.hubs_title {
    color: #FFFFFF;
    height: auto;
    line-height: 38px;
    padding-left: 42px;
    margin-top: 0px;
    margin-bottom: 0px;
    font-size: 15px;
    text-align: left;
}
.side_hub_menu h2.hubs_title { background: url("/images/tglhub/tgl-HUB_icon_33x34px.png") no-repeat 13px center /18px #222; }
.tgl-hubs h2.hubs_title {}

span.hub-member-type {
    float: right;
    font-size: 12px;
    padding: 0px 10px;
    color: #3A99FE;
}

/* tglHUBS search */
ul.hubSearch { padding: 8px 17px; background: #8CC0B0; }
ul.hubSearch li { padding-bottom: 5px; }
ul.hubSearch li a { text-decoration: none; }
ul.hubSearch li a:hover { color: rgb(72, 184, 148); }
ul.hubSearch li a:active { color: rgb(28, 156, 241); }

.hubSearch_text{
	font-size: 15px;
	color: #FFFFFF;
	line-height: 21px;
	padding-bottom: 5px;
	display: block;
	font-weight: normal;
	font-family: calibri, helvetica, sans-serif;
}
input#tgl_hub_location_search {
	padding: 0 0 0 32px;
	width: 90%;
	height: 30px;
	font-size: 17px;
	color: #222222;
	border: none;
	border-radius: 3px 3px 3px 3px;
	background: url(/images/tgl3/magnifine_glass_16px.png) no-repeat 8px center #fff;
}

span.hub-count {
    float: right;
    padding: 0px 10px;
    line-height: 34px;
    font-weight: bold;
    margin-top: -9px;
    background: yellow;
    color: #000;
}


/* ====================================================== END OF SIDE HUB STUFF =================================================== */



/* HTML5 MEDIA PLAYER BUTTONS */
#mainHold .flowplayer .fp-fullscreen,
#mainHold  .flowplayer .fp-unload,
#mainHold .flowplayer .fp-mute,
#mainHold .flowplayer .fp-embed,
#mainHold .flowplayer .fp-close,
#mainHold .flowplayer .fp-play { background-image: url(/images/media-blue.png);}

#mainHold .is-splash.flowplayer .fp-ui,
#mainHold .is-paused.flowplayer .fp-ui { background-image: url(/images/play-blue.png);}

#mainHold .flowplayer .fp-fullscreen { height: 21px; }



/* ===================================  OLD STYLING AND GENERIC STYLING  =================================== */


.fontcolor_grey1 { color:#5e5e5e;}
.fontcolor_white { color: white;}
.fontcolor_tgl {	color:#13B834;}
.fontcolor_sv {	color:#117452;}
.fontcolor_se  {	color:#E36100;}
.fontcolor_pq { color:#CA223C;}
.fontcolor_ml { color:#C99800;}
.fontcolor_ba { color:#0071C9;}
.fontcolor_hub { color:#2F9279;}
.fontcolor_town { color:#2E76B9;}
.fontcolor_co-lab { color: #20CF59;}

#menu .fontcolor_ql  li a {color:#444444;}
#menu .fontcolor_sv  li a {color:#117452;}
#menu .fontcolor_se  li a {color:#E36100;}
#menu .fontcolor_pq  li a {color:#DE003F;}
#menu .fontcolor_ml  li a {color:#C99800;}
.col_1.pq, .col_1.pq a { width: 110px; }

/* font color for each districts */
p.fontcolor_sv {	font-weight:bold; color:#117452;}
p.fontcolor_se {	font-weight:bold; color:#E36100;}
p.fontcolor_pq {	font-weight:bold; color:#CA223C;}
p.fontcolor_ml {	font-weight:bold; color:#C3A117;}



/* OLD MENU STYLING RULES - Used by logged out language select */
#menu li.menu_right div.dropdown_1column div.col_1 ul.simple li a { color:#333333; }

.dropdown_1column ,
.dropdown_2columns,
.dropdown_3columns,
.dropdown_4columns,
.dropdown_5columns {
    margin: 11px auto;
    float:left;
    position:absolute;
    left:-999em; 		
    z-index:115;
    text-align:left;
    padding:10px 5px;
    background:#F5F5F5;
    border-radius: 0px 0px 2px 2px;
}

#menu li:hover .dropdown_1column,
#menu li:hover .dropdown_2columns {
    left: 0px;
    top: 41px;
    cursor: default;
	-moz-box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.15); box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.15);
}

.col_0,
.col_1,
.col_2,
.col_3,
.col_4,
.col_5 {
    display:inline;
    float: left;
    position: relative;
    margin-left: 5px;
    margin-right: 5px;
}
.col_0 {width:50px;}
.col_1 {width:140px;}
.col_2 {	width:445px;}
.col_3 {width:410px;}
.col_4 {width:550px;}
.col_5 {width:690px;}

.col_1.pq {width:110px;}

#menu .menu_right { margin-right:0px;}


#menu p, #menu h2, #menu h3, #menu ul li {
    font-family:Arial, Helvetica, sans-serif;
    line-height:24px;
    font-size:15px;
    text-align:center;
}
#menu h2 {
    font-size:21px;
    font-weight:400;
    letter-spacing:-1px;
    width: auto;
    box-shadow: none;
    background: none;
    border-radius: 0;
    border: 0;
    margin: 0px 0 5px 0;
    height: auto;
    padding-bottom:8px;
    border-bottom:1px solid #BABABA;
    color:#3D3C3D;
}


#menu h3 {
    font-size:14px;
    margin:7px 0 14px 0;
    padding-bottom:7px;
    border-bottom:1px solid #888888;
}

#menu p {
    line-height:18px;
    margin:0 0 0 0;
    width: 100px;
    text-align: left;
    padding-left: 5px;
}


.imgshadow {
    background:#FFFFFF;
    padding:4px;
    border:1px solid #777777;
    margin-top:5px;
    -moz-box-shadow:0px 0px 5px #666666;
    -webkit-box-shadow:0px 0px 5px #666666;
    box-shadow:0px 0px 5px #666666;
}
.img_left { 
    width:auto;
    float:left;
    margin:5px 15px 5px 5px;
}

#menu li .black_box {
    background-color:#333333;
    color: #eeeeee;
    text-shadow: 1px 1px 1px #000;
    padding:4px 6px 4px 6px;


    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;


    -webkit-box-shadow:inset 0 0 3px #000000;
    -moz-box-shadow:inset 0 0 3px #000000;
    box-shadow:inset 0 0 3px #000000;
}

#menu li ul {
    list-style:none;
    padding:0;
    margin:0 0 12px 0;
}
#menu li ul li {
    font-size:12px;
    line-height:24px;
    position:relative;

    padding:0;
    margin:0;
    float:none;
    text-align:left;
    width: auto;
}

#menu li .greybox li {
    background:#F3F3F3;
    border:1px solid #bbbbbb;
    margin:0px 0px 4px 0px;
    padding:4px 6px 4px 6px;
    width:116px;


    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
}
#menu li .greybox li:hover {
    background:#F3F3F3;
    border:1px solid #aaaaaa;
    padding:4px 6px 4px 6px;
    margin:0px 0px 4px 0px;
}
li.member-keywords:hover{ cursor: pointer; color: blue;}
.popup.wide.MAIN3 { color: #efefef;}
.popup.wide.MAIN3 .Title h1{ color: #efefef; font-size: 52px; padding: 0;}
.tglpopup-content{ max-width: 1000px; margin-left: 120px; margin-right: 120px;}