/* ######### CSS for Gerobok ######### */

body { font-family: Arial, sans-serif;} 
form { font-size: 10pt}
img { border:0 }
h1 { font: 18pt  Arial, sans-serif; font-weight: bold; color: #666666  }
h2 { font: 16pt  Arial, sans-serif; font-weight: bold; color: #666666 }
h3 { font: 12pt  Arial, sans-serif; font-weight: bold; color: #666666 }
h4 { font: 10pt  Arial, sans-serif; font-weight: bold; color: #666666 }
td { font: 10pt  Arial, sans-serif; color: #666666 }
th { font: 10pt  Arial, sans-serif; font-weight: bold; color: #666666 }
p { font: 10pt  Arial, sans-serif; color: #666666 }
a { font: 10pt  Arial, sans-serif; font-weight: normal; color: #666666; text-decoration: none }
a:active { font-weight: normal; color: #666666; text-decoration: none  }
a:visited { font-weight: normal; color: #666666; text-decoration: none }
b { font: 10pt  Arial, sans-serif; font-weight: bold; }
table, td, th{border: 0px solid black;}
label{color: #666666;}
input{color:#666666;}
textarea{resize: none;color:#666666;font: 11pt  Arial, sans-serif; font-weight: normal;}
textarea#file_list{resize: none;font: 10pt  Arial, sans-serif; font-weight: normal;}

.form_table{
	border: 0px solid black; 
	cellpadding:2; 
	color:#666666; 
	background-color: #EEEEED;
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); 
	-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	-webkit-border-radius: 12px;
	-moz-border-radius: 7px; 
	border-radius: 7px;
}

.form_field {
	color:#666666; 
	font: 11pt  Arial, sans-serif; 
	font-weight: normal;
	/*height:30px;*/
	/*line-height: 30px;*/
	height:20px; 
	line-height: 20px;
	background-color: #FFFFC8;

}
.form_option{color:#666666; height: 25px; background-color: #FFFFC8;font: 11pt  Arial, sans-serif; }
.form_button{ font: 10pt  Arial, sans-serif; font-weight: bold; color: #666666; }
.form_title{ font: 12pt  Arial, sans-serif; font-weight: normal; color: #666666; }
.form_sub_title{ font: 10pt  Arial, sans-serif; font-weight: normal; color: #666666; line-height:2; padding-left:20px;padding-right:20px; margin:0}
.form_label{ font: 10pt  Arial, sans-serif; font-weight: bold; color: #666666; }
.desc { font: 8pt  Arial, sans-serif; font-weight: normal; color: #666666; }
.descb { font: 8pt  Arial, sans-serif; font-weight: normal; color: #666666}
.descc { font: 8pt  Arial, sans-serif; color: #666666 }
.menu_font{ font: 9pt  Arial, sans-serif; font-weight: normal; color: #666666; }
.search_field {
	float:left;
	color:#666666; 
	font: 10pt  Arial, sans-serif; 
	font-weight: normal;
	padding-left:5px;
	height:20px; 
	width: 250px;
	background-color: #FFFFC8;
	line-height: 20px;

}
.search_img{float:left;color:#666666; vertical-align:top; padding-left:2px}
.footer {
	font-size: 10px;
	font-family:  Arial, sans-serif;
	color: #666666;
	text-align: right;
}
.feature_list{list-style-image: url(../pix/tick.png);}
.feature_list li {margin-top: 10px; padding:0 0 0 10px;}

.menu_bar {
	/*height:50px;*/
	/*padding: top right bottom left*/
	padding:3px 5px 2px 5px;
	color: #666666;
	background-color: #EEEEED;
	font-family:  Arial, sans-serif
	font-size: 12px;
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); 
	-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	-webkit-border-radius: 12px;
	-moz-border-radius: 7px; 
	border-radius: 7px;

}




.box{
	color: #666666;
	border-color: #FFFFFF;
	background-color: #EEEEED;
	font-family:  Arial, sans-serif
	font-size: 12px;
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); 
	-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	-webkit-border-radius: 12px;
	-moz-border-radius: 7px; 
	border-radius: 7px;

}

/* 	Light gray - background-color: #EEEEED; */
/*  Darker gray #E6E6E6 */
.main_caption{
	width:600;		
	min-width:500;
	font-size: 16px;
	font-weight: normal;
	color: #666666;
	padding-left:70px; 		
}
.sub_caption 
{
	margin:0 auto; 
	padding-top:10px; 
	font-size: 14px;
	color: #666666;
	font-style: normal;
	padding-left:100px; 
}
.sub_caption_2 {
	font-size: 14px; 
	color: #666666; 
	font-style: italic; 
}
.header {
	font-size: 14px;
	font-style: italic;
	color: #666666;
}

#f1_upload_process{   
	z-index:100;   
	visibility:hidden;   
	text-align:center;   
}

.file_upload {display:none;}
.text_upload{	background: White;}

.popUp { 
	position: absolute; 
	top: 1000px; 
	left: 200px; 
	text-align: center; 
	padding: 5px; 
	border: 1px solid black; 
	background: white; 
}



.gerobok_canvas{
	align: center; 
	margin:0 auto; 
	padding-left:20px; 
	padding-right:20px; 
	min-width:1024px;
}
.gerobok_canvas_ie{
	align: center; 
	margin:0 auto; 
	padding-left:20px; 
	padding-right:20px; 
	min-width:1024px;
	float:left;		/* This is extremely important for ie */
}

.work_canvas{
	align: center; 
	margin:0 auto; 
	padding-left:20px; 
	padding-right:20px; 
	min-width:800px;
}

.work_canvas_ie{
	align: center; 
	margin:0 auto; 
	padding-left:20px; 
	padding-right:20px; 
	min-width:800px;
	float:left;		/*This is extremely important for ie*/
}
.no_frill{
	color: Red;
	font-weight: bold
}

.simple{
	color: Blue;
	font-weight: bold
}

.fast{
	color: Green;
	font-weight: bold
}

.easy_to_use{
	color: Purple;
	font-weight: bold
}

.textbottom {vertical-align:text-bottom;} 


.file_listing tr:nth-child(even) {
    background-color: #F2F2F2;
}

.file_listing th {
    background-color: #E6E6E6;
}

.file_listing #file_name{max-width:500px}
.file_listing #file_name{min-width:500px}
.file_listing #file_size{min-width:70px}
.file_listing #file_date{min-width:150px}
.file_listing #file_select{min-width:80px}


td#file_dir{min-width:790px;}
td#file_storage{min-width:90px}

div .file_listing{
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); 
	-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	-webkit-border-radius: 12px;
	-moz-border-radius: 7px; 
	border-radius: 7px;
}

div .button_listing{
	width: 175px;
	height: 175px;
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); 
	-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	box-shadow: 0px 1px 6px rgba(0, 69, 88, .3);
	-webkit-border-radius: 12px;
	-moz-border-radius: 7px; 
	border-radius: 7px;
}
.info_table{
	width:640px;
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); 
	-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	-webkit-border-radius: 12px;
	-moz-border-radius: 7px; 
	border-radius: 7px;
}

.dialog_title{
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	line-height: 1.75em;
	color: white !important;
	background: #F16022;
	border: solid 1px #FFF;
	border-bottom: solid 1px #999;
	cursor: default;
	padding: 0em;
	margin: 0em;
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); 
	-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	box-shadow: 0px 1px 6px rgba(23, 69, 88, .3);
	-webkit-border-radius: 12px;
	-moz-border-radius: 7px; 
	border-radius: 7px;	
}

html.busy, html.busy * {  
  cursor: wait !important;  
}

/*----------------------------------------------------------------------*/
/* Media Queries
/* 																		*/
/* No changes for screen with width between 960 - 1280					*/
/*----------------------------------------------------------------------*/
/* For very large screens increes the margins*/
@media screen and (min-width:1281px) 
{
	body
	{
		margin-left:10%;
		margin-right:10%;
	}
}


/*----------------------------------------------------------------------*/
/* IPad 																*/
/*----------------------------------------------------------------------*/
/*
@media screen and (max-width:981px) 
{

	div .file_listing{
	width: 70%;
	}
	
	#header_table {width:90%}
	.box{width:80%}
	
	.gerobok_canvas{width:80%}
	.gerobok_canvas_ie{width:80%}
	.work_canvas{width:80%}
	.work_canvas_ie{width:80%}
	
	.main_caption{width:80%; padding-left:20px;}
	.sub_caption{width:80%;padding-left:0px;}

}
*/
/* For more smaller Screens (iPad) */
@media screen and (max-width:700px) 
{
}

/* iPhone and real small devicces */
@media screen and (max-width:480px) 
{
}