/*--------------------------------------------
 * Support items layout
 * 
 * Copyright (c) 2013 by Jan Van Liedekerke
 * http://www.designrequest.be
 *
--------------------------------------------*/

/*--------------------------------
 	Info & support
-------------------------------*/

#supportarea		{ position: relative; width: 100%; height: calc(100vh - 400px); margin-top: 10vh; text-align: center; }
#qform			{ display: inline-block; width: 100%; width: 540px; max-width: 80vw; }
#supportarea form p	{ text-align: right; margin-top: 4px; }
#supportarea form p a	{ margin: 0 0 0 15px; }
#pagesearch p a		{ margin: 0 15px 0 0; }

/* Searchpage */
#pagesearch		{ display: inline-block; width: 100%; max-width: 600px; }
#pagesearch #qfield	{
	width: 80%; height: 25px; font-size: 1.4em;
	background: #FFF; color: #666; padding: 8px; text-indent: 3px;
	margin: 0;
	border-radius: 3px 0 0 3px;
	border-width: 1px 0 1px 1px;
}

#pagesearch_submit	{
	float: right; margin: 0; height: 31px; position: absolute; background: #FFF;
	border-width: 1px 1px 1px 0; border-style: solid; border-color: #CCC; border-radius: 0 3px 3px 0;
}


p.num_results		{ color: #999; }

#supportarea #qfield			{
	width: 100%; margin-top: 160px; height: 25px; font-size: 1.4em;

	background-color: #FFF; color: #666; border: 0px solid #999; border-radius: 10px; padding: 8px; text-indent: 3px;
	-webkit-box-shadow: 0px 0px 25px 0px rgba(165, 165, 165, 0.7);
	-moz-box-shadow:    0px 0px 25px 0px rgba(165, 165, 165, 0.7);
	box-shadow:         0px 0px 25px 0px rgba(165, 165, 165, 0.7);
}

/* Shows loading bar and contains scripting */
#supportscript2		{
	position: absolute; width: 200px; margin-top: 15px; margin-left: -8px;
}

#supportscript2	p	{ display: inline; }



.balloon		{
	position: absolute; display: inline-block; visibility: hidden;
	min-width: 30px; min-height: 30px; line-height: 30px;
	 color: #EEE; font-size: 1.3em; padding: 8px 11px 8px 11px; text-align: center;
	/*text-shadow: 1px 1px 3px #999;*/

	border-radius: 10px;
	-webkit-box-shadow: 0px 0px 25px 0px rgba(165, 165, 165, 0.7);
	-moz-box-shadow:    0px 0px 25px 0px rgba(165, 165, 165, 0.7);
	box-shadow:         0px 0px 25px 0px rgba(165, 165, 165, 0.7);

	cursor: pointer;
}

.page_answer		{
	font-size: 1.2em; margin: 5px 0 5px 0; padding-left: 5px; list-style: none !important;
	line-height: 30px;
}


.balloon.doc		{ background-color: #06C; }
.balloon.faq		{ background-color: #F80; }
.balloon.err		{ background-color: #C00; }
.balloon.pag		{ background-color: #0C0; }

.balloon.doc:hover	{ background-color: #06E; }
.balloon.faq:hover	{ background-color: #F90; }
.balloon.err:hover	{ background-color: #E00; }
.balloon.pag:hover	{ background-color: #0E0; }

#balloon1		{ left: 20px; top: 290px; }	/* Under 2  -  Left  */
#balloon2		{ top: 0; right: 0; }		/* Top   1  -  Right */
#balloon3		{ top: 55px; }			/* Top   2  -  Left  */
#balloon4		{ top: 350px; left: 100px; }	/* Under 3  -  Left  */
#balloon5		{ top: 240px; right: 0; }	/* Under 1  -  Right  */
#balloon6		{ top: 105px; right: 20px; }	/* Top   3  -  Right  */
#balloon7		{ top: 415px; right: 0; }	/* Top   3  -  Right - Read more balloon */

#qlog			{
	font-family: monospace; white-space: pre-wrap;	
}

#supportscript4 a	{
	line-height: 20px;
}

/*--------------------------------
 	Contact page
-------------------------------*/

dl.faq dt		{ color: #666; padding: 12px 0 0 0; }
dl.faq dt:hover		{ color: #222; cursor: pointer; }
dl.faq dd		{ max-height: 0px; padding-top: 0; padding-bottom: 0; transition: max-height 1s, padding 0.5s; overflow: hidden; }
#ticket_id		{ display: inline-block; margin: 0; padding: 10px 26px; color: #06c; font-size: 1.8em; font-weight: bold; border: 1px solid #06c; }
#cpinfo			{ visibility: hidden; }
#tr_ticket_id td:last-child { font-weight: bold; color: #06c; }
#tr_ticket_id input	{ text-align: center; font-weight: bold; color: #06c; }
div.walletlogos		{ display: flex; gap: 30px; align-items: center; flex-wrap: wrap; }

#tabs			{ min-height: 130px; }
#tabs > div		{ display: none; }
#tabs > div.ta		{ display: block; }

#quiz > div		{ display: none; }
#quiz > div:first-child	{ display: block; }
#quiz > div > form	{ padding: 6px 0 0 12px; }

/*--------------------------------
 	Support form
-------------------------------*/
.contactimg				{ float: left; margin: 0 30px 12px 0 }
@media all and (max-width: 480px) {
	.contactimg			{ float: none; width: 100vw; margin: 12px -8px; }

}
#ticket_form input[name="subject"],
#ticket_form textarea			{ font-size: 1.4em; }
#ticket_form #tr_website,
#tr_priority_support_tip		{ display: none; }
#tr_priority_support_tip td		{ background: none; padding: 30px 0 0 0; }