/*******************************************************************************
Project   Hunghaefae App

  Web App consist of HTML5, CSS and Javascript files. Native built with phonegap
  Designed by Markus Rähle
================================================================================
$HeadURL: file:///C:/Users/mr/OneDrive/SwProject/WebApp/trunk/web_app/app_source/css/app-style.css $
$Id: app-style.css 8 2019-02-20 13:35:48Z mr $
*******************************************************************************/


@import "app-style_club.css";


.do_not_show_link
{
	text-decoration: none;
	font-weight: normal;
}


/*****************************************************************************/
/* flip switch text psition */
.flipswitch_div
{
	clear: both;
	min-height: 45px;
}

.article_add_flipswitch_label
{
	position:relative;
	min-width: 140px; 
	float: left;
	padding-top: 15px;
}


.gallery_flipswitch_label
{
	position:relative;
	min-width: 140px; 
	float: left;
	padding-top: 15px;
}

.help_add_flipswitch_label
{
	position:relative;
	min-width: 130px; 
	float: left;
	padding-top: 15px;
}

.interesent_flipswitch_label
{
	position:relative;
	min-width: 250px; 
	float: left;
	padding-top: 15px;
}

.member_flipswitch_label
{
	position:relative;
	min-width: 150px; 
	float: left;
	padding-top: 15px;
}

.news_add_flipswitch_label
{
	position:relative;
	min-width: 120px; 
	float: left;
	padding-top: 15px;
}

.program_flipswitch_label
{
	position:relative;
	min-width: 110px; 
	float: left;
	padding-top: 15px;
}

.program_add_flipswitch_label
{
	position:relative;
	min-width: 120px; 
	float: left;
	padding-top: 15px;
}

.upload_flipswitch_label
{
	position:relative;
	min-width: 160px; 
	float: left;
	padding-top: 15px;
}


/*****************************************************************************/
/* wrap text*/
.ui-page .ui-content .ui-listview .ui-li-desc 
{
    white-space : normal; /* wrap text*/
}


/*****************************************************************************/
/* design for loader (spinner)*/
#spinnerBackground
{
    width: 100%;
    height: 100%;
    z-index: 1500;
	top:0;
    padding: 0;
    margin: 0;
    background: white;
    opacity: 0.3;
	position: fixed; 
}
.ui-loader{
    z-index: 1501;
}

.fileinput-button 
{
	position: relative;
	overflow: hidden;
	margin-right: 4px;
	height: 60px;
	line-height: 30px; /* use two lines*/
}
.fileinput-button input 
{
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	opacity: 0;
	filter: alpha(opacity=0);
	transform: translate(-300px, 0) scale(4);
	font-size: 23px;
	direction: ltr;
	cursor: pointer;
}

.center
{
	text-align: center; 
}


/*****************************************************************************/
/*rotate text in table */
.table-header-rotated th.row-header
{
	width: auto ;
}
.table-header-rotated th.rotate-45
{
	min-width: 30px;
	height: 180px;
	position: relative;
	vertical-align: bottom;
	padding: 0;
	font-size: 12px;
	line-height: 0.8;
	text-align: center;
}
.table-header-rotated th.rotate-45 span 
{
	transform:skew(45deg,0deg) rotate(315deg);
	position: absolute;
	bottom: 30px; /* 40 cos(45) = 28 with an additional 2px margin*/
	left: -25px; /*Because it looked good, but there is probably a mathematical link here as well*/
	display: inline-block;
	width: 90px; /* 90 / cos(45) - 90 cos (45) = 90 where 90 is the height of the cell, 90 the width of the cell and 45 the transform angle*/
	text-align: center;
}
.table-header-rotated th:first-of-type,.table-header-rotated td:first-of-type
{
    text-align: left;
}

THEAD { display: table-header-group }
TBODY { display: table-row-group }
TFOOT { display: table-footer-group }


/*****************************************************************************/
/* overlay icon */
.overlay_text
{
	width: 100%; 
	text-align: center;
}

.overlay_text_rotate
{
	height: 24px; 
    border-radius: 8px; /* one half of ( (border * 2) + height + padding ) */
    padding: 0px 15px 0px 15px;
   	width = 100%;
    margin-top: 11px;
	-ms-transform: rotate(20deg); /* IE 9 */
    -webkit-transform: rotate(20deg); /* Chrome, Safari, Opera */
    transform: rotate(20deg);
}


/*****************************************************************************/
/* home content */
.contentTable 
{
	border-collapse: collapse;
	border-spacing: 0;
	text-shadow: 0px 0px 0px;
}
.contentTable thead th 
{
	padding: 10px;
	text-align: center;
}
.contentTable-rounded 
{
	border: none;
}
.contentTable-rounded thead th:first-child 
{
	border-radius: 0px 0 0 0;
}
.contentTable-rounded thead th:last-child 
{
	border-radius: 3px 30px 0 0;
}
/*.contentTable-rounded tbody td 
{
	border: none;
	background-color: #EEE;
}*/
.contentTable-rounded tbody tr:last-child td:first-child 
{
	border-radius: 0 0 0 0;
}
.contentTable-rounded tbody tr:last-child td:last-child 
{
	border-radius: 0 0 0px 0;
}