/*	page layout and card css	*/
body
	{padding:0;
	line-height: 1.5; font-family: 'Raleway', sans-serif; }
@media only screen and (orientation: portrait) and (max-width: 700px)
{
.gallery img
	{ width:25px;height:auto;transition:0.8s;}
table.LuscherResult
	{display:block; border-collapse: collapse;font-size:10pt;}
.ctrl_btn
	{font-size:20pt;}
}

@media only screen and (orientation: portrait) and (min-width: 700px)
{
.gallery img
	{ width:60px;height:auto;transition:0.8s;}
table.LuscherResult
	{display:block; border-collapse: collapse;font-size:14pt;}
}

@media only screen and (orientation: landscape) and (max-width: 850px)
{
.reorder_ul
	{width:100%; min-height:120px;}
.gallery img
	{ width:50px;height:auto;transition:0.8s;}
}

@media only screen and (orientation: landscape) and (min-width: 850px) and (max-width: 1150px)
{
.reorder_ul
	{width:100%; min-height:180px;}
.gallery img
	{ width:85px;height:auto;transition:0.8s;}
}

@media only screen and (orientation: landscape) and (min-width: 1150px) and (max-width: 1360px)
{
.reorder_ul
	{width:100%; min-height:260px;}
.gallery img
	{ width:120px;height:auto;transition:0.8s;}
}

@media only screen and (orientation: landscape) and (min-width: 1360px)
{
.reorder_ul
	{width:100%; min-height:320px;}
.gallery img
	{ width:150px;height:auto;transition:0.8s;}
}

#top_menu
	{display:none;padding: 15px 15px;text-align:center; text-transform:uppercase;}

#luscher_page {	
	display: grid;
	grid-template-areas:
		"luscher_page_menu"
		"card_area"
		"result_area"
		"end";
	grid-gap: 0;
	grid-template-rows: auto;
	grid-template-columns: 1fr;}
#luscher_page
	{margin:0;}
#luscher_page > luscher_page_menu	{
	grid-area: luscher_page_menu;
	background-color: #fff;	color: #555555; font-weight: bold; font-size: 12pt; 
	min-height:50px;}
#luscher_page > card_area	{
	grid-area: card_area;
	background-color: #fff;text-align: center;
	padding:0;}
#luscher_page > result_area	{
	grid-area: result_area;
	text-align: center; }
#luscher_page > end	{
	grid-area: end;
	background-color: #e1e3e4;}

.gallery img
	{border-radius:10px;}

.ctrl_btn {
    color: #3675B4;
    border: solid 2px #3675B4;
    border-radius: 3px;
    text-transform: uppercase;
    background: #fff;
    padding: 10px 20px;
    margin: 20px;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.35s;
    -moz-transition: all 0.35s;
    -webkit-transition: all 0.35s;
    -o-transition: all 0.35s;
}
.ctrl_btn:hover {
    color: #fff;
    border: solid 2px #3675B4;
    background: #3675B4;
    box-shadow: none;
}
#reorder-helper, #luscher-guide
	{display:block; margin: 100px auto;}
.light_box {
    background: #efefef;
    padding: 20px 50px;
    margin: 10px 0;
    text-align: center;
    font-size: 1.2em;
}

.gallery{ display:none;width:auto; margin:20px 0;}
.gallery ul{ margin:0; padding:0; list-style-type:none;}
.gallery ul li{ padding:0; display:inline-block; margin:10px 7px; background:none; }


table.LuscherResult
	{display:block;margin:auto; border-collapse: collapse;width:100%;}
table.LuscherResult th
	{text-transform:uppercase;font-weight:bold;background:#3675B4;}
table.LuscherResult th, table.LuscherResult td
	{border: 2px solid #555555; padding:5px;}
table.LuscherResult tr:nth-child(even)
	{background-color: #f2f2f2;}




/* NOTICE */
.notice, .notice a{ color: #fff !important; }
.notice { z-index: 8888; }
.notice a { font-weight: bold; }
.notice_error { background: #E46360; }
.notice_success { background: #657E3F; }