/* ============================================= INFOPAGE Build/Add Page ============================================= */

/* + ADD A NEW TAB Button */
.infopageaddcontrols {
	font-weight: bold;
	background-color: rgba(255, 255, 255, 0.35);
	border: 3px dotted white;
	text-align: center;
	border-radius: 8px 8px 8px 8px;
	display: inline-block;
	width: 28%;
	height: auto;
	margin: 0px 0px 25px 3%;
	transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
}
.controlpanel .infopageaddcontrols { background-color: rgba(0, 0, 0, 0.25); }

.infopageaddcontrols a {
  text-decoration: none;
  color: white;
  font-size: 42px;
  display: block;
  line-height: 164px;
}
.infopageaddcontrols:hover { background-color: rgb(41, 176, 255); }
.infopageaddcontrols.active {
	background-color: orange;
	border-color: white;
	transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;
}


/* help info */
.mediaHelp {
	height: auto;
	width: 54%;
	margin: 0px 2% 12px;
	padding: 15px 15px 15px 45px;
	border-radius: 10px 10px 10px 10px;
	float: right;
	background: url("/images/post_it_note/infopad_question.png") no-repeat 10px 10px white;
}
.mediaHelp a {
	display: block;
	text-align: center;
	line-height: 30px;
	text-decoration: none;
	background: #D0BD5B;
	color: #FFFFFF;
	padding: 5px 20px;
	font-size: 18px;
	border-radius: 12px 12px 12px 12px;
	margin: 7px 15px 0px 0px;
}
.mediaHelp a:hover { background: #2984EA; }
.mediaHelp a.active { background: orange; }

.mediaHelp.fullWidth { width:auto; }
.mediaHelp p {
	color: #5e5e5e;
	font-size: 17px;
	font-family: calibri, Helvetica, sans-serif;
	padding-bottom: 5px;
	margin-right: 10px;
	text-align: justify;
}

.mediaHelp h2.sub-area {
  padding: 0px 0px 3px;
  text-align: center;
  border-bottom: 1px solid #f0f0f0;
  margin: -7px -6% 8px;
  background: url("/images/post_it_note/infopad_question.png") no-repeat 6% 2px;
}

@media only screen and (max-width: 768px) {
	.infopageaddcontrols {
	  display: block;
	  width: 80%;
	  line-height: 90px;
	  margin: 0px auto 10px;
	}
	.mediaHelp {
	  width: 75%;
	  margin: 0px auto 12px;
	  padding: 15px 3% 15px 45px;
	  float: none;
	}
}
@media only screen and (max-width: 450px) {
	.infopageaddcontrols {
	  display: block;
	  width: 80%;
	  line-height: 90px;
	  margin: 0px auto 10px;
	}
	.mediaHelp {
	  width: 83%;
	  margin: 0px auto 12px;
	  padding: 15px 5% 15px;
	  background: white;
	}
	.mediaHelp p { font-size: 15px; }
	.mediaHelp a { 
	  padding: 3px 20px;
	  border-radius: 6px 6px 6px 6px;
	  margin: 6px 0px 0px 0px;
	  font-size: 14px;
	}
}


/* Edit/Delete tabs */
.infopageedit {
	background: #FFFFFF;
	height: 30px;
	line-height: 30px;
	border-radius: 5px 5px 0px 0px;
	overflow: hidden;
	border: 1px solid white;
}
.infopageeditcontrols { float:left; }
.infopagedeletecontrols { float:right; }

.infopageeditcontrols a,
.infopagedeletecontrols a{
	font-size: 15px;
	padding: 7px 10px 7px 27px;
	color: #838383;
	text-decoration: none;
}

/* icons for tabs */
.infopageeditcontrols a { background: url(/img/edit.png)no-repeat 5px 50% transparent; }
.infopagedeletecontrols a { background: url(/images/nfe/delete.png) no-repeat 5px 50% transparent; }

/* hover-over colours */
.infopageeditcontrols a:hover { color: white; background-color: rgb(75, 173, 204); }
.infopageeditcontrols a:active { background-color: rgb(20, 128, 201); }

.infopagedeletecontrols a:hover { color: white; background-color: rgb(238, 70, 63); }
.infopagedeletecontrols a:active { background-color: rgb(204, 1, 10); }



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

/* NEW TAB LAYOUT MARCH'15 ------------------------------------------------------------------------ */
.product_wrapper {
	display: inline-block;
	width: 30%;
	height: auto;
	margin: 0px 2.85% 25px 0%;
}


/* OLDER STYLING ------------------------------------------------------------------------ */

.tab-view  {	
	border-radius: 10px 10px 10px 10px;
	border: 1px solid #efefef;
	cursor: pointer;
	overflow: hidden;
	box-shadow: 0 17px 10px -15px rgba(82, 82, 82, 0.5);
		-moz-box-shadow: 0 17px 10px -15px rgba(82, 82, 82, 0.5); -webkit-box-shadow: 0 17px 10px -15px rgba(82, 82, 82, 0.5);
	transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; -o-transition: 0.3s
}
#Infopages.view .tab-view { border-radius: 0px 0px 10px 10px; }
.tab-view:hover {
	box-shadow: 0 21px 8px -14px rgba(82, 82, 82, 0.5); -moz-box-shadow: 0 21px 8px -14px rgba(82, 82, 82, 0.5); -webkit-box-shadow: 0 21px 8px -14px rgba(82, 82, 82, 0.5);
}
.tab-view:active { }


/* image/icon */
.product_result_image {
    height: 210px;
    background: no-repeat 50% /cover #333;
}


/* title */
.product_result_shop_name {
	padding: 8px 12px;
    line-height: 20px;
    max-width: 15%;
    font-size: 19px;
    background: rgba(21, 21, 21, 0.7);
    color: white;
    font-family: calibri, helvetica, sans-serif;
    border-radius: 8px 0px 3px 0px;
    position: absolute;
}
#Hubs .product_result_shop_name { background: rgb(19, 136, 116); }
#Infopages.view .product_result_shop_name { border-radius: 0px 0px 5px 0px; }
.tab-view:hover .product_result_shop_name { background: #fff!Important; color: #000; }
.tab-view:active .product_result_shop_name { padding-top: 12px; transition: 0.1s; -moz-transition: 0.1s; -webkit-transition: 0.1s; }

/* text */
.product_result_pricing {
	height: 100px;
	margin: 3px 10px 8px;
	font-size: 14px;
	color: #646464;
	display: inline-block;
	overflow: hidden;
	font-family: calibri, helvetica, sans-serif;
}
.product_result_pricing div,
.product_result_pricing p { font-family: calibri, helvetica, sans-serif; }


/* View Tab */
.product_result_more_info {
	background: #f0f0f0;
	background-image: linear-gradient(bottom, #CECECE 0%, #F3F3F3 100%);
	background-image: -o-linear-gradient(bottom, #CECECE 0%, #F3F3F3 100%);
	background-image: -moz-linear-gradient(bottom, #CECECE 0%, #F3F3F3 100%);
	background-image: -webkit-linear-gradient(bottom, #CECECE 0%, #F3F3F3 100%);
	background-image: -ms-linear-gradient(bottom, #CECECE 0%, #F3F3F3 100%);
	background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #CECECE), color-stop(1, #F3F3F3) );
	
	width: 100%;
	text-align: center;
	padding: 7px 0px;
	font-size: 19px;
	font-weight: bold;
	color: rgb(115, 115, 115);
	transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
}
.tab-view:hover .product_result_more_info { color: rgb(255, 255, 255); background: #0B69D5; }
.tab-view:active .product_result_more_info {
	color: #222;
	padding: 7px 0px;
	margin-bottom: -2px;
	background: yellow;
	transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;
}


/* ============================================= STYLING FOR INFOTABS ============================================= */

#infotab-inner-display{
	max-width: 900px;
	width: 85%;
	margin: 0px auto 50px;
	overflow: hidden;
}
#infotab-title {
	font-size: 25px;
	margin: 5px 1% 17px;
	font-weight: bold;
	line-height: 32px;
}
#infotab-description {
  margin: 0px 5%;
  text-align: left;
  font-size: 16px;
  color: white!Important;
}

#loadingInfotabsAjaxOption {
	margin-top: 15px;
	overflow: hidden;
	border: 1px solid #fff;
	background: #fff;
	border-radius: 3px 3px 3px 3px;
}

/* OLD DROPDOWN HOLDER STLYING */
.infopage_bigbox {
	display: none;
	width: 918px;
	height: auto;
	background: white;
	color: white;
	margin: -4px 0px 0px 20px;
	padding-top: 0px;
	text-align: left;
	font-size: 13px;
	overflow: hidden;
	box-shadow: 0 14px 24px -15px rgba(0, 0, 0, 0.5);
		-moz-box-shadow: 0 14px 24px -15px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 14px 24px -15px rgba(0, 0, 0, 0.5);
}

.infotabsbox { 
	display: inline-block;
	font-size: 1em;
	line-height: 20px;
	color: #5e5e5e;
	background-color: white;
	width: 50%;
	float: left;
	box-shadow: -1px 0px 0px 0px #dadada;
		-moz-box-shadow: -1px 0px 0px 0px #dadada; -webkit-box-shadow: -1px 0px 0px 0px #dadada; /* Puts subtle left side border against each item */
}


/* Title */
.infotabsbox h2 {
	background: #f0f0f0;
	margin: 0px;
	padding: 0px 5px;
	text-align: center;
	line-height: 32px;
}

.infotabsbox .type_wysiwyg_main,
.tab_element_size_double .type_wysiwyg_main h2 { background: none; padding: 3% 5%; }


/* TEXT BOX VIEW FORMATTING */
.infotabsbox.type_wysiwyg .type_wysiwyg_main p {
	padding: 0px;
	font-size: inherit;
	margin: 0px;
	text-align: inherit;
	display: inherit;
	line-height: inherit;
}
.infotabsbox.type_wysiwyg .type_wysiwyg_main span {
	padding: 0px;
	font-size: inherit;
	margin: 0px;
	text-align: inherit;
	line-height: inherit;
}
.infotabsbox.type_wysiwyg .type_wysiwyg_main strong { font-weight: bold;}
.infotabsbox.type_wysiwyg .type_wysiwyg_main ol,
.infotabsbox.type_wysiwyg .type_wysiwyg_main ul { list-style: initial; }



.type_image img {
	height: auto;
	width: auto;
	width: 100%;
}
div .tab_element_size_double {
  width: 100%;
  height: auto;
  overflow: hidden;
  border: none;
}
.tab_element_size_double img{ width: inherit; }


.infotabsbox p {
	color: #333333;
	padding: 2% 5% 3%;
	font-size: 14px;
	text-align: left;
	cursor: default;
	border: none;
	display: table;
	line-height: 22px;
}
.infotabsbox.tab_element_size_double p { padding: 1% 5% 1%; }

.infotabsbox.type_literaturefile p,
.infotabsbox.type_literature p,
.infotabsbox.type_literaturefile.tab_element_size_double p,
.infotabsbox.type_literature.tab_element_size_double p {
	padding: 15px 8%;
	border-top: 1px solid #dadada;
}

.type_wysiwyg_main { background: #f0f0f0; }


.type_video h3 {
	padding-bottom: 5px;
	cursor: default;
}

.flowplayerTGL{
	width: auto;
	height: auto;
	margin: 10px;
	margin-bottom: 7px
}

#sortable1 li .flowplayerTGL h2,
#sortable2 li .flowplayerTGL h2 { background: none; }


/* Embedded video player */
.infotabsbox.type_video iframe {
	height: auto;
    min-height: 284px;
    width: 100%;
}
.infotabsbox.type_video.tab_element_size_double iframe {	height: 450px; }

/* Audio player box */
.infotabsbox.type_music h1 { display: none; }
.infotabsbox.type_music  audio {
	width: 96%;
	border-radius: 0px;
	padding: 10px 2%;
	margin: 5px 0px 0px;
	background: #ECD52B;
	border: 1px solid #E4C900;
	transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
}
.infotabsbox.type_music audio:hover { background: #66C0FF; border-color: #8AD7FF; }


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


/* SCREEN SIZE VARIATIONS ------------------------------------------------------------------------ */

@media screen and (max-width: 550px) {
	.closeX { margin: 15px auto 20px; }
	.closeX a { padding: 5px 18px; font-size: 13px; }

	.infotabsbox { width: 100%; }
	#infotab-inner-display {
		width: 100%;
		margin: 0px 0px 5px;
	}	
	#infotab-title {
		font-size: 21px;
		line-height: 24px;
		margin: 0px 4% 12px;
	}
	#infotab-description { font-size: 14px; }
	
}

@media screen and (max-width: 450px) {
	#infotab-title {
		font-size: 18px;
		margin: 0px 10% 15px;
		line-height: 22px;
	}
	#infotab-description {
		font-size: 12px;
		line-height: 18px;
	}
}


/* ========================== Media Links (CURRENTLY ONLY LITERATURE AND WEBLINKS USED; POSS DELETE ALL OTHERS) ========================== */

/* Audio link icon */
.bng_audio { 
	background-image: url("/images/carousel/music.jpg");
	width: 126px;
	height: 126px;
	margin: 0px auto 20px auto;
}
.bng_music { background-image: url("/images/carousel/music.jpg");}

/* Video link icon */
.bng_video{ 
	background-image: url("/images/nfe/video-link_126px.png");
	width: 126px;
	height: 126px;
	margin: 0px auto 20px auto;
}

/* Photo link icon */
.bng_photo{ 
	background-image: url("/images/nfe/photo-link_126px.png");
	width: 126px;
	height: 126px;
	margin: 0px auto 20px auto;
}

/* Photo link image style - if image is displayed */
.type_photo img {
	width: auto;
	height: auto;
	max-width: 456px;
	max-height: 310px;
	margin: 0px 0px 5px;
}

/* Lit upload icon */
.bng_literaturefile { 
	background-image: url("/images/nfe/document_126px.png");
	width: 85px;
	height: 85px;
	background-size: 85px;
	margin: 10px 15px 10px 15px;
	float: left;
} 

/* Web link icon */
.bng_literature{ 
	background-image: url("/images/nfe/web-link_126px.png");
	width: 85px;
	height: 85px;
	background-size: 85px;
	margin: 10px 15px 10px 15px;
	float: left;
}

 /* Link text */
a.link_audio:link, a.link_music:link, a.link_video:link, a.link_literaturefile:link, a.link_literature:link  {
	color: white;
	font-size: 18px;
	line-height: 24px;
	height: 48px;
	font-family: Arial;
	font-weight: bold;
	background: #4B8DF1;
	margin: 22px 20px 22px 80px;
	padding: 6px 15px 6px 20px;
	display: block;
	text-decoration: none;
	border-right: 12px solid transparent;
	border-top-right-radius: 15px;
	border-bottom-right-radius: 15px;
	transition: ease, 0.4s; -moz-transition: ease, 0.4s; -webkit-transition: ease, 0.4s; -o-transition: ease, 0.4s;
	box-shadow: 0px 0px 0px 4px #CBDEEE;
		-moz-box-shadow: 0px 0px 0px 4px #CBDEEE; -webkit-box-shadow: 0px 0px 0px 4px #CBDEEE;
}
#sortable1 .ui-state-default a.link_literature:link,
#sortable1 .ui-state-default a.link_literaturefile:link {
	color: white;
	font-size: 13px;
	line-height: 16px;
	padding: 6px 0px 6px 15px;
}

a.link_audio:visited, a.link_music:visited, a.link_video:visited, a.link_literaturefile:visited, a.link_literature:visited 
{ color: white; background: #4B8DF1; border-color: transparent; }

a.link_audio:hover, a.link_music:hover, a.link_video:hover, a.link_literaturefile:hover, a.link_literature:hover {
	border-color: #FFCC00;
	border-top-right-radius: 65px 50%;
	border-bottom-right-radius: 65px 50%;
	box-shadow: 0px 0px 0px 4px #464542; -moz-box-shadow: 0px 0px 0px 4px #464542; -webkit-box-shadow: 0px 0px 0px 4px #464542;
}

a.link_audio:active, a.link_music:active, a.link_video:active, a.link_literaturefile:active, a.link_literature:active  {
	border-right: 10px solid #09D600;
	transition-duration: 0s;
}


.type_audio p, .type_photo p, .type_video p, .type_literature p, .type_literaturefile p  {
	margin-top: 15px;
	width: 84%;
	text-align: justify;
}
.type_photo p { margin: 0px; }





/* ========================== Infotabs Drag + Drop Build area ========================== */

#tab_header {
	background: #fff;
	max-width: 900px;
	margin: 0px auto 35px;
	overflow: hidden;
	border: 2px solid rgb(228, 228, 228);
	border-radius: 10px 10px 10px 10px;
	box-shadow: 0 10px 7px -7px rgba(51, 51, 51, 0.75);
		-moz-box-shadow: 0 10px 7px -7px rgba(51, 51, 51, 0.75); -webkit-box-shadow: 0 10px 7px -7px rgba(51, 51, 51, 0.75);
}
.tab-header-info {
  float: left;
  width: 36%;
  padding: 20px 4%;
}
.tab-header-info h3 {
  font-size: 21px;
  margin: 0px 0px 15px;
  padding: 0px 0px 10px;
  border-bottom: 1px solid #f0f0f0;
}
.tab-header-info p {
  color: #999;
  font-size: 15px;
  margin-bottom: 12px;
}

.tab_use-block {
  max-width: 900px;
  border: 3px solid #f0f0f0;
  margin: 0px auto 30px;
}
.tab_use {
	height: auto;
	overflow: hidden;
	background-color: white;
	line-height: 24px;
}

.tab-help {
  border: none;
  margin: 30px 0px 10px;
  border-radius: 5px 5px 5px 5px;
  overflow: hidden;
  cursor: pointer;
}
.tab-upload {
  float: left;
  width: 33.33%;
  line-height: 37px;
  cursor: pointer
}

.tab-help a,
.tab-upload a {
  display: block;
  color: rgb(255, 255, 255);
  font-family: calibri, helvetica, sans-serif;
  font-size: 21px;
  padding: 9px 20px 11px 60px;
  background-repeat: no-repeat;
  line-height: 26px;
  border-left: 1px solid #56A2F4;
}
.tab-help a {
	background-color: rgb(147, 108, 214);
	background-image: url("/images/post_it_note/infopad_question-black.png");
	background-position: 15px center;
	border: none;
	font-size: 18px;
	padding: 8px 20px 8px 60px;
	line-height: 20px;
}
.tab-help a:hover { background-color: rgb(134, 67, 235); }
.tab-upload a {
	background-image: url("/images/tgl3/upload_24px.png");
	background-color: rgb(52, 136, 228);
	background-position: 16px center;
}
.tab-upload.text a {
	background-image: url(/images/tgl3/media/text-box_26x32px.png);
	background-position: 13px center;
}
.tab-upload a:hover { background-color: rgb(74, 161, 255); }
.tab-upload a.mymedia {  background-image: url('/images/tgl3/media/multi-media-album-26x34px.png'); }

.tab-help a.active,
.tab-upload a.active,
.tab-upload a:active { background-color: orange; }

#uploadmedia_button { border: none; }


#tab_use-pop { }
#tab_use1.mediaHelp {
  width: 86%;
  max-width: 550px;
  padding: 20px 4%;
  margin: 0px auto;
  border-radius: 5px 5px 5px 5px;
  background-image: none;
  overflow: hidden;
  float: none;
}
#tab_use1.mediaHelp h1 {
	text-align: center;
	font-size: 19px;
	font-family: georgia;
	font-weight: normal;
	line-height: 25px;
	height: auto;
	padding: 0px;
}


#tab_use1 .tab_help { padding: 10px 5%; }

#tab_use1 .tab_help h2 {
	line-height: 32px;
	padding-left: 0px;
	margin-bottom: 8px;
	margin-top: 0px;
	font-size: 16px;
	padding-bottom: 1px;
	font-weight: bold;
	font-family: georgia;
	text-align: center;
	border-bottom: 1px solid #E0E0E0;
}
#tab_use1 .tab_help p {
  padding-bottom: 10px;
  margin: 0px 2%;
  font-size: 16px;
}
span.plus {
	float: left;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin: 1px 5px 0 0;
	display: block;
	width: 20px;
	line-height: 19px;
	background-color: #5B90CA;
	color: #ffffff;
}
.remove-img {
  margin: 0px 0px 1px;
  display: inline-block;
  width: 17px;
  height: 17px;
  background-color: #EEEEEE;
  color: #ffffff;
  border: 1px solid #dadada;
  background-image: url(/images/nfe/delete.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 11px;
}


ul#tab_uploader {
	background: rgb(49, 57, 61);
	padding: 15px 0px;
	overflow: hidden;
	margin: 0px;
	width: 100%;
}
#tab_uploader .left,
#tab_uploader .right {
  width: 440px;
  margin: 0px auto 20px;
}

#tab_uploader span.upload.title {
	font-weight: bold;
	float: left;
	font-size: 20px;
	padding: 7px 5px 6px 10px;
	color: #FFFFFF;
	background: #B9A228;
	border-top-left-radius: 5px; border-bottom-left-radius: 5px;
	display: block;
	width: 70px;
	cursor: default;
}
#tab_uploader input.title-input {
	width: 300px;
	height: 30px;
	margin-bottom: 6px;
	background: #FFF8CF;
	border-color: #B9A228;
	font-size: 18px;
	font-weight: bold;
	border-width: 2px;
	border-radius: 0px;
	border-top-right-radius: 6px; border-bottom-right-radius: 6px;
}
#tab_uploader .ui-corner-all {
	height: 25px;
	margin: 5px 10px 8px 0px;
	background: rgb(84, 132, 255);
	border-color: #000000;
}
#tab_uploader img.thumb { border: 1px solid #dadada; margin-bottom: -8px; }



#tab_uploader span.upload.description {
	font-weight: bold;
	display: block;
	font-size: 13px;
	text-align: center;
	margin: 0px;
	color: #fff;
	background: #000;
}
#tab_uploader .right textarea {
	float: right;
	width: 420px;
	height: 80px;
	padding: 5px 9px;
	background: #f0f0f0;	
	margin-bottom: 0px;
	margin-right: 0px;
	border-color: white;
	border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px;
}



/* about text */
.InfotabsText {
	margin: -25px 0 15px 0;
	padding: 10px 10px 5px 45px;
	border: 1px solid lightgrey;
	border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
	
	background-color: white;
	background-image: url("/images/post_it_note/infopad_question.png");
	background-repeat: no-repeat;
	background-position: 10px 10px;
}
.InfotabsText p {
	color: #5e5e5e;
	font-size: 17px;
	font-family: calibri, Helvetica, sans-serif;
	padding-bottom: 5px;
}


#tab_sizecontrol_bigger{ }
.ui-state-highlight .tab_sizecontrols {
   display: none; 
}
.ui-state-default .tab_sizecontrols {
    display: inline-block;
    left: 0;
    top: 0;
	width: 25px;
	height: 23px;
	background-color: #5B90CA;
    color: #ffffff;
    font-size: 1.5em;
    text-align: center;
    position: absolute;
}
.ui-state-default .tab_sizecontrols:hover { background-color: #0DB83D; }

.ui-state-highlight .remove_tab{ display: none;}
.ui-state-default .remove_tab {    
	right: 0;
	display: inline-block;
	top: 0;
	width: 24px;
	height: 21px;
	background-color: #EEEEEE;
	border: 1px solid rgb(224, 224, 224);
	position: absolute;
	background-image: url(/images/nfe/delete.png);
	background-position: center;
	background-repeat: no-repeat;
}
.ui-state-default .remove_tab:hover { background-color: #FFFFFF; border-color: rgb(236, 24, 24); }
.select_tab {    
	float: left;
	display: inline-block;
	width: 25px;
	height: 23px;
	background-color: #2FABFF;
	position: absolute;
	background-image: url("/images/tgl3/White_add_icon.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 13px; -moz-background-size: 13px; -webkit-background-size: 13px;
	cursor: pointer;
}
.select_tab:hover { background-color: #06D401; }



/* ===================== TAB PREVIEW Info AREA ===================== */
#InfotabAddForm,
#InfotabEditForm {
  padding: 1%;
  overflow: hidden;
  width: 54%;
  float: right;
}
.tab_basic_info .title {
  height: 43px;
  border: 1px solid #E7E7E7;
  margin: 0px 0px 10px;
}

.tab_basic_info { }

.tab_basic_info .form_50 { width: 100%; margin: 0px; }

.tab_basic_info .title .form_50 label {
  color: #363636;
  display: inline-block;
  line-height: 44px;
  font-size: 18px;
  font-weight: bold;
  width: 20%;
  padding: 0px;
  text-align: center;
  float: left;
}
.tab_basic_info .form_50 input {
	width: 76%;
	padding-left: 4%;
	height: 43px;
	font-size: 18px;
	float: left;
	margin: 0px;
	display: block;
	color: #777;
	font-weight: bold;
	background: #F6F6F6;
	border: none;
	border-radius: 0px 0px 0px 0px;
}
.tab_basic_info .form_50 input:hover { background: #FFFCBD; color: #222; }

.tab_basic_info .logo {
  border: 1px solid #E7E7E7;
  border-radius: 0px 0px 0px 0px;
  background-color: #F5F5F5;
  margin: 0px 0px 12px;
}
.tab_basic_info #logoContainer div p {
	line-height: 25px;
	padding-bottom: 5px;
	text-align: center;
}
.tab_basic_info #logoContainer.inputSections {
	margin-bottom: 0px;
	margin-top: 0px;
	overflow: hidden;
	min-height: 128px;
}
.tab_basic_info #logoContainer .html5Uploader { padding: 0px; border-top: 0px; }

.preview-description { border: 1px solid #E7E7E7; }
.tab_basic_info #showDescription label { padding: 0px; margin: 0px; }

.tab_basic_info .logo h2,
#main .tab_basic_info .descriptionSelector {
	font-size: 15px;
    padding: 5px 20px;
    margin: 0px;
    background: #FFFFFF;
    font-weight: bold;
    line-height: 28px;
    width: auto;
    color: #222;
    text-align: center;
}
.tab_basic_info .form_100 textarea {
  width: 96%;
  height: 126px;
  font-size: 14px;
  line-height: 21px;
  color: #5e5e5e;
  margin: 0px;
  padding: 5px 2%;
  background: rgb(245, 245, 245);
  border: none;
  border-radius: 0px 0px 0px 0px;
}



/* ================================ TAB ARRANGE AREA ============================= */

#tab_arrange_area {
	overflow: hidden;
	border-radius: 10px 10px 0px 0px;
	background: #fff;
	max-width: 865px;
	margin: 0px auto;
	box-shadow: 0px 24px 20px -20px rgba(32, 32, 32, 0.5);
		-moz-box-shadow: 0px 24px 20px -20px rgba(32, 32, 32, 0.5); -webkit-box-shadow: 0px 24px 20px -20px rgba(32, 32, 32, 0.5);
}
#tab_arrange_area h2.heading {
  text-align: center;
  height: 45px;
  line-height: 45px;
  padding-left: 12px;
  font-size: 21px;
  margin: 5px 3% 10px;
  border-bottom: 1px solid #EEEEEE;
}
#tab_arrange_area p { padding: 0px 3% 10px; font-size: 14px; }

/* headings */
.InfotabsTitles1 {
	background: #fff;
	font-family: calibri, helvetica, sans-serif;
	padding: 5px 5% 15px;
}
.InfotabsTitles1 h2 {
  height: 45px;
  line-height: 45px;
  padding-left: 12px;
  font-size: 21px;
  margin: 0px 0px 8px;
  border-bottom: 1px solid #f0f0f0;
}
.InfotabsTitles1 p { font-family: calibri, helvetica, sans-serif; margin: 0px 4%; }


/* left hand asset positioning */
/* main area */
#sortable1  {
	list-style-type: none;
	height: auto;
	padding: 1% 0 0 1%;
	background-color: #242424;
	overflow: hidden;
}
			  
/* asset items */
#sortable1 li {	
	margin: 0px 1% 1% 0;
	font-size: 0.9em;
	color: #5e5e5e;
	background-color: #898989;
	border: none;
	float: left;
	cursor: pointer;
	overflow: hidden;
    position: relative;
}
#sortable1 p {
  font-size: 11px;
  line-height: 16px;
  padding: 3px 5px;
}

/* IMAGES */
.ui-state-default img {
	height: auto;
	width: auto;
	max-height: 137px;
	max-width: 295px;
	border: 1px solid #f0f0f0;
	border-top: none;
	margin: 0px auto;
	display: block;
}
#sortable1 .tab_element_size_double img {
	width: auto;
	margin: 0px auto 10px;
	height: 137px;
}

#sortable1 li p { padding: 5px 10px; color: #000000; background: #f3f3f3; font-weight: normal; }

/* VIDEO PLAYER drag'n'drop area */ 
.ui-state-default .flowplayer { 
	height: 137px;
	width: 288px;
	border-left: 1px solid #f0f0f0;
	border-right: 1px solid #f0f0f0;
	margin: 0 auto;
	display: -webkit-box;
 }

/* Weblink/doc link small */
#sortable2 .bng_literature,
#sortable2 .bng_literaturefile {
	width: 70px;
	height: 70px;	
	background-size: 100%; -moz-background-size: 100%; -webkit-background-size: 100%;
	margin-top: 5px;
}
#sortable1 a.link_literature:link, #sortable1 a.link_literaturefile:link,
#sortable2 a.link_literature:link, #sortable2 a.link_literaturefile:link { display: none; }




/*drag drop section*/
.tab_element_size_single, #Infotabs .tab_element_size_double  { width: 49%; height: 155px; }
#Infotabs .tab_element_size_double { width: 99%; }


#sortable1 li .infotabsbox_header h2,
#sortable2 li .infotabsbox_header h2{
	color: #555555;
	background: #f3f3f3;
	border-bottom: 1px solid lightgrey;
	width: auto;
	height: 22px;
	margin: 0px;
	padding: 0px;
	line-height: 21px;
	font-size: 12px;
	text-align: center;
	overflow: hidden;
}

/* Embedded video h2 */
#sortable1 li h2, #sortable2 li h2  { 
	background: rgb(209, 125, 0);
	text-align: center;
	margin: 0px;
	color: white;
	padding: 1px 5px;
}


/* ----- right hand assets store ----- */

.InfotabsTitles2 {
	line-height: 35px;
	padding: 5px 0px;
	overflow: hidden;
	color: #FFFFFF;
	background: rgb(61, 61, 61);
}
.InfotabsTitles2 p {
  background-image: url('/images/tgl3/media/multi-media-album-26x34px.png');
  background-position: 2px center;
  background-repeat: no-repeat no-repeat;
  padding: 0px 0px 2px 49px;
  border-bottom: 1px solid #5E5E5E;
  margin: 2px 8px 2px;
  line-height: 35px;
  overflow: hidden;
  font-size: 17px;
  color: #FFFFFF;
}
.tab_use-block .closeX {
  float: right;
  margin: 1px 9px 0px -40px;
  font-weight: bold;
  background-color: #5E5E5E;
  padding: 0px 12px;
  border-radius: 2px 2px 2px 2px;
  font-size: 20px;
  line-height: 35px;
  cursor: pointer;
}
.tab_use-block .closeX:hover { background-color: #BD4444; }

/* menu */
#sortable2 { padding: 0.5% 0.5% 0px; }

/* individual asset */
#sortable2 li {
	font-size: 0.9em;
	margin: 2px 3px 7px;
	padding: 3px 0px 3px 3px;
	background-color: rgb(255, 255, 255);
	cursor: pointer;
	overflow: hidden;
	border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
	border: 2px solid #85837A;
	width: 48%;
	float: left;
}
#sortable2 li:hover {
	border: white;
	box-shadow: 0 6px 6px -4px #797979;
		-moz-box-shadow: 0 6px 6px -4px #797979; -webkit-box-shadow: 0 6px 6px -4px #797979;
}

#sortable2 li.boxselectable {
	background: #333333;
	border: 1px solid rgb(209, 209, 209);
	width: 48%;
	height: 107px;
	float: left;
	margin: 1% 1% 0px 0px;
	padding: 0px;
	border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px;
	box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none;
	cursor: default;
}

#sortable1 li:hover {
	border-color: #FFFFFF;
	box-shadow: 0 0px 0px 3px #379FE4;
		-moz-box-shadow: 0 0px 0px 3px #379FE4; -webkit-box-shadow: 0 0px 0px 3px #379FE4;
	background: #B2BFCE;
}
#sortable1 li:active { background: white; }

#sortable2 a.about_tgl span {
	float: left;
	font-weight: bold;
	font-size: 15px;
	color: #5e5e5e;
	line-height: 15px;
	width: 272px;
	padding: 8px 10px 8px 30px;
	background-image: url('/images/tgl3/media/multi-media-album-26x34px.png');
	background-position: 0px center;
	background-repeat: no-repeat;
	background-size: 25px auto;
}
#sortable2 li:hover a.about_tgl span { color: #215CDA;}

#sortable2 li.tab-trash span { background-image: url(/images/tgl3/trash-22px.png); }
#sortable2 a.about_tgl.trash span, #sortable2 li:hover a.about_tgl.trash span  { color: #D35B5B; }

.sortable2.connectedSortable.ui-sortable {
	background-image: url('/images/tgl3/media/multi-media-album-26x34px.png');
	background-position: 1px 4px;
	background-repeat: no-repeat;
}

#sortable2 li img,
#sortable2 li .flowplayer {
	width: auto;
	height: 84px;
	margin: 0px auto;
	display: block;
}
#sortable2 li .flowplayer { width: 137x; }


#infotab_add_form audio { width: 100%; }
li.boxselectable h1, li.ui-state-default h1 { display: none; }
#sortable2 li p {
	line-height: 15px;
	color: #5e5e5e;
	padding: 5px;
	font-size: 11px;
	background: #F3F3F3;
}

@media only screen and (max-width : 768px) {
	#sortable2 li {
		width: 90%;
		float: none;
		margin: 5px auto 6px;
	}
}


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

/* ======================================================= MYtgl Profile / HUB HOMEPAGES ======================================================= */

#mytgl_section_about { }
#mytgl_section_grid {
  padding-left: 8px;
  overflow: hidden;
  margin-bottom: 12px;
}

/* ============================ start of Horizontal carousel =========================== */
#search_section .carouselHold  {
	height: 90px;
	margin: 0px 0px 10px -8px;
	padding: 8px 0px 6px;
	overflow: hidden;
	background: url('/images/tgl3/backgrounds/border-02-light.png')rgb(99, 103, 103);
	border-bottom: 1px solid rgb(208, 208, 208);
	box-shadow: 0 6px 6px -4px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 6px 6px -4px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 6px 6px -4px rgba(0, 0, 0, 0.3);
}

/* Left button */
#search_section .leftBtn {
	height: 86px;
	width: 35px;
	position: absolute;
	margin-left: 10px;
}
#search_section button.prev {
	display: block;
	position: absolute;
	width: 30px;
	height: 100%;
	background: url(/images/tgl3/black_arrow_left.png) no-repeat 50% 50% transparent;
	outline: none;
	border: none;
	cursor: pointer;
	border-radius: 16px 16px 16px 16px;
	transition: 0.2s; -moz-transition: 0.2s; -webkit-transition: 0.2s; -o-transition: 0.2s;
}

/* Right button */
#search_section .rightBtn {
	height: 86px;
	width: 35px;
	margin-left: 920px;
	margin-top: -88px;
	position: absolute;
}
#search_section button.next {
	border: none;
	display: block;
	position: absolute;
	width: 30px;
	height: 100%;
	border-radius: 16px 16px 16px 16px;
	background: url(/images/tgl3/black_arrow_right.png) no-repeat 50% 50% transparent;
	transition: 0.2s; -moz-transition: 0.2s; -webkit-transition: 0.2s; -o-transition: 0.2s;
	cursor: pointer;
}

/* Action */
#search_section button.prev:hover,
#search_section button.next:hover { background-color: rgba(255, 255, 255, 0.6); }
#search_section button.prev:active,
#search_section button.next:active {
	transition: 0s; -moz-transition: 0s; -webkit-transition: 0s; -o-transition: 0s;
	box-shadow: 0 0 5px -1px white; -moz-box-shadow: 0 0 5px -1px white; -webkit-box-shadow: 0 0 5px -1px white;
	background-color: white;
}

/* *********** */

#search_section .anyClass {
	visibility: visible;
	overflow: hidden;
	position: relative;
	z-index: 2;
	left: 0px;
	max-width: 870px;
	width: 92%;
	margin:0 auto;
	height: 90px;
}
#search_section ul.carHoriz {
	display:block;
	overflow:hidden;
	width: 845px;
	height: 90px;
}

#search_section ul.carHoriz li {
	display: block;
	float: left;
	width: 90px;
	height: 85px;
	text-align: center;
	margin: 2px 5px 0 2px;
	cursor: pointer;
	
	background: none repeat scroll 0 0 rgb(235, 235, 235);
	background-color: rgba(245, 245, 245, 0.8);	
	border-radius: 3px 3px 3px 3px;
	box-shadow: 0 0px 5px rgba(70, 112, 90, 0.56);	-moz-box-shadow: 0 0px 5px rgba(70, 112, 90, 0.56);	-webkit-box-shadow: 0 0px 5px rgba(70, 112, 90, 0.56);
	transition: 0.45s; -moz-transition: 0.45s;-webkit-transition: 0.45s; -o-transition: 0.45s;
}

#search_section ul.carHoriz li:hover {
	box-shadow: 0 3px 10px -2px #798880;
		-moz-box-shadow: 0 3px 10px -2px #798880; -webkit-box-shadow: 0 3px 10px -2px #798880;
	background: white;
}
#search_section ul.carHoriz li:active,
#search_section ul.carHoriz li.active {
	background: orange;
	color: white;
	box-shadow: 0 0px 0px 2px white;
		-moz-box-shadow: 0 0px 0px 2px white; -webkit-box-shadow: 0 0px 0px 2px white;
	transition: 0s; -moz-transition: 0s;-webkit-transition: 0s;
}

#search_section ul.carHoriz li div {
	height: 100%;
	width: 100%;
	background-repeat: no-repeat;
	background-position: 50% 80%;
	background-size: auto 50px; -moz-background-size: auto 50px; -webkit-background-size: auto 50px;
}


/* tile header */
#search_section ul.carHoriz li span {
	color: #333;
	font-size: 13px;
	line-height: 28px;
	display: block;
}


#search_section ul.carHoriz li span.titleContent{
	display:block;
	text-align:center;
	cursor:pointer;
	font-size: 12px;
	font-weight:bold;
	font-style:normal;
	color: #333333;
	line-height:15px;
	width:125px;
	margin-top: 4px;
}

#mytgl_scroller_anyclass{ }

/*-- end of Horizontal carousel code (SEARCH) --*/


/* ========================================= HUBS HORIZONTAL carousel ==================================== */

#search_section .carouselHold.Hubs{
	height: 165px;
	width: 100%;
	border-radius: 0px 0px 0px 0px;
	border-left: none;
	border-right: none;
	margin: 0px 0px 0px 0px;
}
#search_section #hubs_carousel.anyClass.Hubs,
#search_section #hubs_carousel.Hubs ul.carHoriz.Hubs {
	height: 165px;
}

#search_section ul.Hubs li {
    width:130px;
	height:155px;
	text-align: center;
}

/* Prev / Next */
#search_section .leftBtnHubs {
    margin-top: 33px;
}
#search_section .rightBtnHubs {
    margin-left: 920px;
	margin-top: -127px;
}

/* HUB service Provider img */
#search_section ul.Hubs li a{
	text-decoration: none;
	display: block;
	height: 100%;
	width: 100%;
	margin: 0px 0px 0px;
}
#search_section ul.Hubs li img{
	margin: 0px;
	max-width: 124px;
	max-height: 120px;
	width: auto;
	height: auto;
	border-radius: 0px 0px 0px 0px;
	border: 3px solid #000000;
	opacity: 0.85;
}


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

/* NEW OFFERS LIST Sept'15 ----------------------------------------------------------------------------------------------------- */
.offers_list {
    width: 20%;
    float: left;
    margin: 0px 0px 0px -8px;
    padding: 0px;
}
ul.offers_list_vertical li {
	display: block;
    width: 100%;
    height: 32px;
    text-align: center;
    padding: 4px 0px 4px 0px;
    margin: 0px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    transition: 0.45s; -moz-transition: 0.45s; -webkit-transition: 0.45s;  -o-transition: 0.45s;
}
ul.offers_list_vertical li:hover {
    background-color: #4E9FFF;
    border-color: #005ECE;
}
ul.offers_list_vertical li:hover span { color: #fff; }

ul.offers_list_vertical li div {
	background-repeat: no-repeat;
	background-position: 13px 50%;
	background-size: auto 23px; -moz-background-size: auto 23px; -webkit-background-size: auto 23px;
}
ul.offers_list_vertical li span {
    color: #333;
    font-size: 13px;
    line-height: 32px;
    display: block;
    text-align: left;
    padding-left: 52px;
    font-weight: bold;
}

ul.offers_list_vertical li div.volunteer { background-position: 20px 50%; }
ul.offers_list_vertical li div.audio,
ul.offers_list_vertical li div.video,
ul.offers_list_vertical li div.photo,
ul.offers_list_vertical li div.lit {
    background-size: 27px auto; -moz-background-size: 27px auto; -webkit-background-size: 27px auto;
}


/* ============================= proto widget for grid view ==================================== */

/* NEW OFFERS GRID DISPLAY Sept'15 --------------------------------------------------------------------------------------------- */

.grid_results { float: right; width: 80%; padding-bottom: 13px; }
.protowidget_wrapper {
    width: 46.3%;
    float: left;
    margin: 2.5% 0px 0px 2.5%;
    border-radius: 5px 5px 5px 5px;
    overflow: hidden;
    height: 230px;
    background: url('/images/tgl3/backgrounds/border.png') #454545;
	
	box-shadow: 0px 12px 10px -10px rgba(0, 0, 0, 0.5);
		-moz-box-shadow: 0px 12px 10px -10px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 12px 10px -10px rgba(0, 0, 0, 0.5);
	transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
}
.protowidget_wrapper:hover,
.protowidget_wrapper.active {	
	box-shadow: 0px 20px 10px -14px rgba(0, 0, 0, 0.65);
		-moz-box-shadow: 0px 20px 10px -14px rgba(0, 0, 0, 0.65); -webkit-box-shadow: 0px 20px 10px -14px rgba(0, 0, 0, 0.65);
}
.protowidget_wrapper:active {
	transition: 0.1s; -moz-transition: 0.1s; -webkit-transition: 0.1s; -o-transition: 0.1s;
	box-shadow: 0px 9px 5px -6px rgba(0, 0, 0, 0.95);
		-moz-box-shadow: 0px 9px 5px -6px rgba(0, 0, 0, 0.95); -webkit-box-shadow: 0px 9px 5px -6px rgba(0, 0, 0, 0.95);
}

.protowidget_wrapper a {
    text-decoration: none;
    width: 100%;
    height: 100%;
	float: left;
}

/* image/logo */
.protowidget_result_image { height: 100%; text-align: center; }



/* TITLE */
.protowidget_result_shop_name {
	font-size: 15px;
    font-weight: bold;
    line-height: 18px;
    position: absolute;
    max-width: 15%;
    border-radius: 5px 0px 5px 0px;
    color: white;
    padding: 6px 10px 6px 40px;
    overflow: hidden;
    transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
	background: rgb(24, 32, 33) no-repeat 8px center / 23px;
}
span.sub-note {
    font-weight: normal;
    color: rgba(255, 255, 255, 0.75);
    font-size: 12px;
    display: block;
}
.protowidget_wrapper:hover .protowidget_result_shop_name { background-color: white!Important; color: #222!Important }
.protowidget_wrapper:hover span.sub-note { color: rgb(155, 155, 155); }
#mytgl_section_grid .protowidget_wrapper.active .protowidget_result_shop_name { background-color: orange; color: white; }



/* AREA ICONS */
.offers_list div.the_all_div { background-image: url("/images/tgl3/5-hearts-B_50px.png"); }
#expandableCompanies .protowidget_result_shop_name,
.offers_list div.co-orgs { background-image: url("/images/tgl3/members/co-circle_red_50px.png"); }
#expandableOfferH .protowidget_result_shop_name,
.Offer .protowidget_result_shop_name .sub-note,
.offers_list div.offers { background-image: url("/images/tgl3/flag_blue.png"); }
#expandableWantH .protowidget_result_shop_name,
.Want .protowidget_result_shop_name .sub-note,
.offers_list div.wants { background-image: url("/images/tgl3/flag_yellow.png"); }
#expandableShopH .protowidget_result_shop_name,
.Shop .protowidget_result_shop_name .sub-note,
.offers_list div.shops { background-image: url("/images/tgl3/village_shops_35x39px.png"); }
#expandableServiceH .protowidget_result_shop_name,
.Service .protowidget_result_shop_name .sub-note,
.offers_list div.services { background-image: url("/images/tgl3/village_services_35px.png"); }
/*
#expandableSwapH .protowidget_result_shop_name,
.Volunteer .protowidget_result_shop_name,
.offers_list div.swaps { background-image: url("/images/tgl3/village_swaps_35px.png"); }
*/
#expandableCourseH .protowidget_result_shop_name,
.Course .protowidget_result_shop_name .sub-note,
.offers_list div.courses { background-image: url("/images/tgl3/village_courses_35x38px.png"); }
#expandableProjectH .protowidget_result_shop_name,
.Project .protowidget_result_shop_name .sub-note,
.offers_list div.projects { background-image: url("/images/tgl3/village_projects_35px.png"); }
#expandableVolunteerH .protowidget_result_shop_name,
.Volunteer .protowidget_result_shop_name .sub-note,
.offers_list div.volunteer { background-image: url("/images/tgl3/village_volunteer_22x35px.png"); }
#expandablePaygrouplH .protowidget_result_shop_name,
.offers_list div.paygroupl { background-image: url("/images/tgl3/drop_down_icons/Drop_down_Paygroupl_Icon.png"); }


/* Media types */
#expandableVideoH .protowidget_result_shop_name,
.offers_list div.video { background-image: url("/images/tgl3/area_icons_35px/yellow_video-icon_35px.png"); }
#expandableAudioH .protowidget_result_shop_name,
.offers_list div.audio { background-image: url("/images/tgl3/area_icons_35px/yellow_audio-icon_35px.png"); }
#expandablePhotoH .protowidget_result_shop_name,
.offers_list div.photo { background-image: url("/images/tgl3/area_icons_35px/yellow_photo-icon_35px.png"); }
#expandableLiteratureH .protowidget_result_shop_name,
.offers_list div.lit { background-image: url("/images/tgl3/area_icons_35px/yellow_literature-icon_35px.png"); }
#expandableBlogsH .protowidget_result_shop_name,
.offers_list div.blog { background-image: url("/images/tgl3/area_icons_35px/yellow_blogs-icon_35px.png"); }
#expandableWebsiteH .protowidget_result_shop_name,
.offers_list div.web { background-image: url("/images/tgl3/area_icons_35px/yellow_website-icon_35px.png"); }

/* LTBV */
.offers_list div.ltbv { background-image: url("/images/tgl3/area_icons_35px/offer-icon_35px.jpg"); }


/* Companies/HUB colour */
#expandableCompanies .protowidget_wrapper { background-color: rgb(108, 49, 59); }
#expandableCompanies .protowidget_result_shop_name { background-color: rgb(165, 17, 42); }

#expandableCompanies .protowidget_wrapper.company-with-hub { background-color: rgb(71, 108, 101); }
#expandableCompanies .protowidget_result_shop_name.company-with-hub {
    background-color: #00A187;
    background-image: url("/images/tglhub/tgl-HUB_icon_33x34px.png");
}

/* Shopping Village colour */
.mainDivShopVil .protowidget_wrapper { background-color: #199057; }
.mainDivShopVil .protowidget_wrapper .protowidget_result_shop_name ,
.Shop .protowidget_result_shop_name,
.Service .protowidget_result_shop_name  { background-color: rgb(21, 124, 72); }

/* Skills Exchange colour */
.mainDivSkillsEx .protowidget_wrapper { background-color: #63452D; }
.mainDivSkillsEx .protowidget_wrapper .protowidget_result_shop_name ,
.Course .protowidget_result_shop_name,
.Project .protowidget_result_shop_name,
.Volunteer .protowidget_result_shop_name { background-color: rgb(184, 95, 17); }
#expandableVolunteerH .protowidget_result_shop_name {
	background-position: 10px 50%;
    background-size: auto 28px; -moz-background-size: auto 28px; -webkit-background-size: auto 28px;
}

/* Pay Group items colour */
.mainDivSkillsEx #expandablePaygrouplH .protowidget_wrapper { background-color: #36638D; }
#expandablePaygrouplH .protowidget_result_shop_name { background-color: rgb(15, 57, 95); }

/* Media Libraries colour */
.mainDivMediaLib .protowidget_wrapper { background-color: #d3b103; }
.mainDivMediaLib .protowidget_wrapper .protowidget_result_shop_name { border-color: rgb(243, 220, 16); }

/* LTBV - offers/Wants */
.mainDivSkillsEx #expandableOfferH .protowidget_wrapper,
.mainDivSkillsEx #expandableWantH .protowidget_wrapper { background-color: #368D71; }
.mainDivSkillsEx #expandableOfferH .protowidget_wrapper .protowidget_result_shop_name,
.mainDivSkillsEx #expandableWantH .protowidget_wrapper .protowidget_result_shop_name { border-color: rgb(146, 178, 167); }



/* HUB PROVIDERS OFFERS ------------------------------------- */
#hub_grid .protowidget_wrapper {
    width: 30%;
    height: 200px;
    background: rgb(239, 239, 239);
	border: 1px solid #eee;
}
#hub_grid .protowidget_left {
	height: 200px;
    width: 50%;
    float: left;
}
#hub_grid .protowidget_result_shop_name {
	font-size: 15px;
    font-weight: bold;
    line-height: 19px;
    position: inherit;    
    max-width: none;    
    border-radius: 0px 0px 0px 0px;
    padding: 5px 12px;
}
#hub_grid .protowidget_result_shop_name .sub-note {
    height: 15px;
    margin: 2px 0px; 
	text-indent: 22px;
    background-repeat: no-repeat;
    background-size: contain; 
}
#hub_grid .Volunteer .protowidget_result_shop_name .sub-note { text-indent: 15px; }
span.offer-logo {
	height: 152px;
    display: block;
    background-size: cover;
    background-position: 50%;
}
#hub_grid .protowidget_description {
	font-size: 12px;
    padding: 6px 3% 0px;
    height: 186px;
    float: left;
    width: 44%;
    color: #333;
    line-height: 19px;
}



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

/* ============================================= MyCONTACTS BLOCK ============================================= */

/* If no contacts yet --- */
.no-contacts {
    max-width: 600px;
    width: 90%;
    margin: 20px auto 30px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid #E3E2E2;
}
.no-contacts h1 {
	margin: 0px;
    line-height: 40px;
    height: 40px;
    background: #DDD;
    color: #222;
    font-size: 20px;
    text-align: center;
    font-weight: normal;
}
.no-contacts p {
	font-size: 21px;
    line-height: 30px;
	padding: 4% 7%;
}

#mytgl_section_contacts { }
.loadingAjaxViewhome { }

#mytgl-contacts-list { padding: 5px 15px 0px 0px; overflow: hidden; }
#mytgl-contacts-list .paginator {
  font-size: 14px;
  color: #333333;
  margin: 0px 1.5% 10px;
  overflow: hidden;
}

#mytgl-contacts-list .searches-row {
  background-color: white;
  width: 48.25%;
  float: left;
  margin: 0px 0px 1.5% 1.5%;
  border: 1px solid #D2D2D2;
  border-radius: 3px;
  overflow: hidden;
  height: 100px;
}

#mytgl-contacts-list .search-meta-img {
	width: 100px;
	height: 100px;
	padding-right: 3px;
	cursor: pointer;
}
#mytgl-contacts-list .search-meta-img img {
    max-width: 100%;
    height: 100%;
}
#mytgl-contacts-list .search-meta-img:hover { background-color: rgb(49, 151, 250); } 
#mytgl-contacts-list .search-meta-img.active,
#mytgl-contacts-list .search-meta-img.active:hover { background-color: orange; cursor: default; } 
#mytgl-contacts-list .search-meta-head { line-height: 16px; }
#mytgl-contacts-list .search-meta-head .offer-title { padding: 6px 10px; }
#mytgl-contacts-list .offer-description {
  height: 64px;
  overflow: hidden;
  color: #838383;
  font-size: 12px;
  margin-top: 1px;
  margin-right: 10px;
}

#mytgl-contacts-list .searches-row .marker-icon {
	width: 70px;
	padding-top: 70px;
    font-size: 11px;
    text-align: center;
    color: #fff;
}
#mytgl-contacts-list .searches-row .marker-icon.member { background: url("/images/tgl3/members/member-1_26x50.png") no-repeat 50% 15px #A2A2A2; }
#mytgl-contacts-list .searches-row .marker-icon.member.co-org { background: url("/images/tgl3/members/co-man_30x50.png") no-repeat 50% 15px #C7344C; }

/* Messgae link */
#mytgl-contacts-list .search-meta-head span.msg {
	padding: 7px 19px;
	height: 14px;
	background-image:url(/img/1315314254_Mail_compose.png);
	background-repeat: no-repeat;
	background-position: 3px 0px;
	background-size: 30px auto;
}


/* ============================================= INFOPAGE VIEW ============================================= */

#search_section h3.tabs { background-image: none;}


/* Header bar Back button */
#add_edit_section .hub_header_bar.bk .category { width: 715px; padding-left: 56px;}
#add_edit_section .hub_header_bar.bk a.back_button {
	margin-top: -1px;
	margin-right: -1px;
	padding: 1px 38px 0px 5px;
	float: right;
	width: 80px;
	background-position: 95px 3px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	border-color: rgb(255, 255, 255);
	background-color: #34A1DF;
	font-size: 16px;
	text-shadow: 1px 1px 2px rgb(22, 94, 172);
}
#add_edit_section .hub_header_bar.bk a.back_button:hover { background-color: #4DC5F3;}
#add_edit_section .hub_header_bar.bk a.back_button:active { background-color: #E49C31; top:0px;}



/* buttons */
.helpButtons a,
#add_edit_section a.back_button {
	width: 135px;
	padding: 5px 35px 5px 5px;
	margin-bottom: 5px;
	margin-right: 20px;
	border-color: white;
	float: right;
	text-align: right;
	background-repeat: no-repeat;
	background-size: 21px;
	background-position: 146px 4px;
}
.helpButtons.Pers a { background-color: #BE7C84;}
.helpButtons.Hub a,
#add_edit_section a.back_button { background-color: #55A08B;}

.helpButtons a.Media {background-image: url("/images/tgl3/mixed-media_icon_23px.png"); }
.helpButtons a.back_button, .back_button { background-image: url("/images/tgl3/back-grey-23px.png"); }


.ManageTabs a {
	width: 135px;
	color: white;
	padding: 5px 35px 5px 5px;
	margin-bottom: 0px;
	text-decoration: none;
	font-size: 14px;
	float: right;
	text-align: right;
	border: 1px solid white;
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
	
	background-image: url("/images/tgl3/mixed-media_icon_23px.png");
	background-repeat: no-repeat;
	background-size: 21px;
	background-position: 146px 4px;
}
.ManageTabs a {	background-color: rgb(213, 104, 117); }
.ManageTabs a:hover, .helpButtons.Pers a:hover { background-color: rgb(216, 15, 71);}
.ManageTabs a:active , .helpButtons.Pers a:active { position:relative; top:1px;}



/* Add Tab upload button */
.PersonalMedia.upload {
	background-image: url("/images/tgl3/upload_24px.png");
	background-color: rgb(81, 142, 209);
	background-position: 146px 5px;
}
.PersonalMedia.upload:hover { background-color: rgb(0, 122, 255);}


/* ============================================= BUILD / EDIT ============================================= */


/* text headings */
.descriptionSelector_createInfopage,
.keywordsSelector {
    border-bottom: 1px solid lightgrey;
    color: #5A5A5A;
    cursor: default;
    display: block;
    font-size: 13px;
    font-weight: 900;
    margin-top: 0;
    padding-bottom: 5px;
    padding-top: 0px;
    width: 424px;
}


/* Add TEXT WYSYWIG BOX */
#dialog_linfotab label { font-weight: bold; text-align: center; }
#InfotabTextUploadName {
  width: 300px;
  border-color: #dadada;
  line-height: 25px;
  height: 34px;
  font-size: 18px;
  font-family: calibri, verdana, sans-aserif;
  margin-bottom: 10px;
}
.mce-panel { border-color: #B7B7B7; }

input.mlmbutons.submit {
  margin: 0px 20% 0px;
  width: 60%;
  background-color: rgb(66, 125, 70);
  color: rgb(255, 255, 255);
  height: 35px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 3px 3px 3px 3px;
  cursor: pointer;
}
input.mlmbutons.submit:hover {
	background-color: rgb(19, 154, 28);
	box-shadow: 0px 7px 3px -5px #989898; -moz-box-shadow: 0px 7px 3px -5px #989898; -webkit-box-shadow: 0px 7px 3px -5px #989898;
}


/* submit button */
#infotab_add_form .submit {
	width: 550px;
	height: 48px;
	margin: 30px auto;
}
#infotab_add_form .submit input {
	margin: 0px;
	width: 550px;
	padding: 10px 0px;
	height: auto;
	background: #48925D;
	color: #FFFFFF;
	border: 1px solid rgba(255, 255, 255, 0.5);
	font-size: 21px;
	font-weight: normal;
	font-family: calibri, helvetica, sans-serif;
	transition: 0.25s; -moz-transition: 0.25s; -webkit-transition: 0.25s; -o-transition: 0.25s;
}
#infotab_add_form .submit input:hover {
	border: 1px solid rgb(219, 219, 219);
	background: #0AA035;
	box-shadow: 0 5px 6px -5px #333333; -moz-box-shadow: 0 5px 6px -5px #333333; -webkit-box-shadow: 0 5px 6px -5px #333333;
}
#infotab_add_form .submit input:active {
	background: #0FC744;
	top: 2px;
	position: relative;
}

/* ADAPTIVE STYLING  ------------------------------------------------------------  */
@media screen and (max-width: 1050px) {

	#mytgl-contacts-list .searches-row {
		width: 90%;
		max-width: 600px;
		float: none;
		margin: 0px auto 1.5%;
	}
	
	#hub_grid .protowidget_wrapper { width: 46%; }
	
}

@media screen and (max-width: 950px) {
	
	.hub_about { width: 240px; }
	.hub_about_inner { padding: 12px 8% 10px; }
	.hub_about_inner h2 {
		margin: 0px 0px 6px;
		font-size: 18px;
		padding: 0px 0px 1px;
		line-height: 29px;
	}
	.hub_about_inner_text { line-height: 20px; }

	.product_wrapper {
		width: 44.5%;
		margin: 0px 5% 25px 0%;
	}
}

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

	.infotabsbox {
		width: 100%;
		float: none;
	}

}

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

	.hub_about { width: auto; float: none; }
	.hub_about_inner { padding: 15px 8% 0px; min-height: 0px; }
	.about-tabs { padding: 0px 0px 5px 4%; }
	a.about_member {
		margin-bottom: 20px;
		line-height: 22px;
		padding: 0px 15px;
		font-size: 13px;
		display: inline-block;
	}
	
	.product_result_image { height: 180px; }


	.tab-header-info {
	  float: none;
	  width: 90%;
	  padding: 10px 4% 20px;
	}
	.tab-help {
	  float: none;
	  border: none;
	  margin: 14px 0% 0px;
	}
	#InfotabAddForm,
	#InfotabEditForm {
	  padding: 0px 2% 2%;
	  width: 96%;
	  float: none;
	}
	#tab_header,
	.tab_use-block { max-width: 560px; }
	
	.tab-header-info h3 { font-size: 18px; padding: 0px 0px 5px; }
	.InfotabsTitles1 h2,
	#tab_arrange_area h2.heading { font-size: 18px; line-height: 40px;  height: 40px; }
	
	.tab_basic_info .title { height: 37px; }
	.tab_basic_info .title .form_50 label { line-height: 38px; font-size: 13px; }
	.tab_basic_info .form_50 input {
	  height: 37px;
	  font-size: 15px;
	}
	
	.tab_basic_info .logo { width: 100%; }
	.preview-description { width: 100%; }

	.tab-upload { float: none; width: 100%; }
	.tab-upload a {
	  font-size: 16px;
	  padding: 5px 20px 5px 60px;
	  line-height: 26px;
	  border-top: 1px solid #56A2F4;
	  border-left: none;
	  background-size: auto 25px; -moz-background-size: auto 25px; -webkit-background-size: auto 25px;
	}
	.tab-upload a.mymedia { background-position: 10px center; }
}

@media screen and (max-width: 700px) {
	#hub_grid .protowidget_wrapper {
		width: 90%;
		max-width: 500px;
		margin: 15px auto 15px;
		float: none;
		height: 165px;
	}
	.product_result_shop_name {
		padding: 7px 12px;
		line-height: 20px;
		max-width: 35%;
		font-size: 17px;
	}
}

@media screen and (max-width: 550px) {
	.about-tabs { padding: 0 ; }
	.product_wrapper {
		display: block;
		width: 90%;
		max-width: 325px;
		margin: 0% auto 6%;
	}

	ul#tab_uploader { padding: 15px 2.5%; width: 95%; }
	ul#tab_uploader .closeX {
	  margin: -9px -5px 0px 0px;
	  padding: 0px 10px;
	  font-size: 15px;
	  line-height: 30px;
	}
	#tab_uploader .left, #tab_uploader .right {
	  width: auto;
	  margin: 0px auto 10px;
	}
	#tab_uploader span.upload.title { font-size: 14px; width: 13%; padding: 4px 5px 4px 10px; }
	#tab_uploader input.title-input { width: 64%; height: 25px; font-size: 14px; }
	#tab_uploader .right textarea { width: 93% }
	
	#infotab_add_form .submit { width: 100%; text-align: center; }
	#infotab_add_form .submit input { width: 95%; }
	
	.tab-header-info p { font-size: 12px; margin-bottom: 7px; }
	.tab-help a {
	  font-size: 15px;
	  padding: 5px 10px 5px 50px;
	  background-size: 22px;
	}
	.tab_basic_info .form_100 textarea {
	  height: 115px;
	  font-size: 12px;
	  line-height: 19px;
	}
}