
/* BASIC HTML TAGS */

	BODY
	{
		SCROLLBAR-FACE-COLOR: #d4e8e6;
		SCROLLBAR-HIGHLIGHT-COLOR: #d4e8e6;
		SCROLLBAR-SHADOW-COLOR: #69bcbc;
		SCROLLBAR-3DLIGHT-COLOR: #ddffdd;
		SCROLLBAR-ARROW-COLOR: #458259;
		SCROLLBAR-TRACK-COLOR: #edfff6;
		SCROLLBAR-DARKSHADOW-COLOR: #825945;
		
		
		margin: 0px;
	}
	SELECT
	{
		SCROLLBAR-FACE-COLOR: #ffd9b4;
		SCROLLBAR-HIGHLIGHT-COLOR: #ffeeee;
		SCROLLBAR-SHADOW-COLOR: #666666;
		SCROLLBAR-3DLIGHT-COLOR: #ffdddd;
		SCROLLBAR-ARROW-COLOR: #825945;
		SCROLLBAR-TRACK-COLOR: #fff6ed;
		SCROLLBAR-DARKSHADOW-COLOR: #825945
	}


	BODY, TABLE,OL,UL,SELECT,INPUT,BUTTON, TEXTAREA
	{
		box-sizing: inherit;
		color: #333;
		FONT-FAMILY: Arial, Verdana, Tahoma, 'Book Antiqua', 'Times New Roman';
		font-size: 12pt;

	}
	/* 
		TABLE,OL,UL,BODY,SELECT,INPUT,BUTTON, TEXTAREA,DIV, SPAN,FONT
		font-weight: 400;

		vertical-align: baseline;  
		transition: none !important; 
		animation:  none !important;
		-webkit-text-size-adjust: none; 
	   font: inherit;
		COLOR: #002211;

	*/

	H1
	{
		FONT-SIZE: 15px
	}

	A
	{
		COLOR: #336666;
		TEXT-DECORATION: none
	}

	A:link
	{
		TEXT-DECORATION: none 
	}
	A:hover
	{
		COLOR: #009966;
		TEXT-DECORATION: underline;
	}

/*****************************************************************/

	.clearfix::after {
	  content: "";
	  clear: both;
	  display: table;
	}

		
/*****************************************************************/
/* HIDE / SHOW */
/*****************************************************************/

	.sys_display_hide	{	  display: none;	}

	.sys_display_show	{	  display: inline;	}


		
/*****************************************************************/
/* OVERFLOW */
/*****************************************************************/

.sys_box_nowrap
{    
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*****************************************************************/

	.cursor_auto           	 	{ cursor: auto; }
	.cursor_deafult         		{ cursor: default; }
	.cursor_none            		{ cursor: none; }
	.cursor_context-menu   	{ cursor: context-menu; }
	.cursor_help            		{ cursor: help; }
	.cursor_pointer         		{ cursor: pointer; }
	.cursor_progress        	{ cursor: progress; }
	.cursor_wait            		{ cursor: wait; }
	.cursor_cell            		{ cursor: cell; }
	.cursor_crosshair       	{ cursor: crosshair; }
	.cursor_text            		{ cursor: text; }
	.cursor_vertical-text   	{ cursor: vertical-text; }
	.cursor_alias           		{ cursor: alias; }
	.cursor_copy            		{ cursor: copy; }
	.cursor_move            		{ cursor: move; }
	.cursor_no-drop         		{ cursor: no-drop; }
	.cursor_not-allowed     	{ cursor: not-allowed; }
	.cursor_all-scroll      { cursor: all-scroll; }
	.cursor_col-resize      { cursor: col-resize; }
	.cursor_row-resize      { cursor: row-resize; }
	.cursor_n-resize        { cursor: n-resize; }
	.cursor_e-resize        { cursor: e-resize; }
	.cursor_s-resize        { cursor: s-resize; }
	.cursor_w-resize        { cursor: w-resize; }
	.cursor_ns-resize       { cursor: ns-resize; }
	.cursor_ew-resize       { cursor: ew-resize; }
	.cursor_ne-resize       { cursor: ne-resize; }
	.cursor_nw-resize       { cursor: nw-resize; }
	.cursor_se-resize       { cursor: se-resize; }
	.cursor_sw-resize       { cursor: sw-resize; }
	.cursor_nesw-resize     { cursor: nesw-resize; }
	.cursor_nwse-resize     { cursor: nwse-resize; }

		
/*****************************************************************/

			
	.sys_left { float: left; }
	.sys_right{ float: right; }
	.sys_top{      margin-bottom: auto; }
	.sys_bottom{   margin-top: auto; }
	.sys_flip_h{   transform: rotateY(180deg); }
	.sys_flip_v{   transform: rotateX(180deg); }
	  
  

	
/*****************************************************************/

	
	.bordered_blue	{	border: 1px solid blue;	}
	.bordered_red	{	border: 1px solid red;	}
		
	
/*****************************************************************/

	.center_items
	{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	
	.sys_flex_rows, .sys_flex_rows_wrap, .sys_flex_rows_nowrap, 
	.sys_flex_cols, .sys_flex_cols_wrap, .sys_flex_cols_nowrap
	{
		display:       flex;
	}


	.sys_flex_rows, .sys_flex_rows_wrap, .sys_flex_rows_nowrap
	{
		flex-direction:row;
	}

	.sys_flex_cols, .sys_flex_cols_wrap, .sys_flex_cols_nowrap
	{
		flex-direction:column;
		align-items:   center;
		align-content: space-between;
	}

	.sys_flex_rows_wrap{	  flex-wrap:wrap; }
	.sys_flex_rows_nowrap{	  flex-wrap:nowrap; }


/*****************************************************************/

	.sys_flex_space_start,  .sys_flex_space_end,    .sys_flex_space_center, 
	.sys_flex_space_around, .sys_flex_space_evenly, .sys_flex_space_between
	{
		display:       flex;
	}

	.sys_flex_space_start   {  justify-content:flex-start; }
	.sys_flex_space_end     {  justify-content:flex-end; }
	.sys_flex_space_center  {  justify-content:center; }
	.sys_flex_space_around  {  justify-content:space-around;  }
	.sys_flex_space_evenly  {  justify-content:space-evenly;  }
	.sys_flex_space_between {  justify-content:space-between; }

	.sys_align_center_h {  margin-left:auto; margin-right: auto; }
	.sys_align_center_v {  margin-top: auto; margin-bottom:auto; }
	.sys_align_center     {  margin:auto; }
	
/*****************************************************************/

	.align-vertical 
	{  
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  flex-direction: row;
	}

	.align-horizontal 
	{  
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  flex-direction: column;
	}



	.grad_color_label_link, .grad_color_label_link span
	{
	   text-decoration:none !important;
	}


	.grad_color_label
	{
	  text-decoration:none;
	  font-family:  "Arial","Trebuchet MS", "Lucida Grande",  "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	  -webkit-background-clip: text;
	  color: transparent;
	  background-color: #DDDDDD;

	}

	.grad_color_label_thin
	{
	  font-weight: 500;
	  font-size:   24px; 
	  line-height: 25px;
	}

	.grad_color_label_thick
	{
	  font-weight: 700;
	  font-size:   26px; 
	  line-height: 28px;
	  letter-spacing: -1px;
	}

	.grad_color_litgreen_green
	{
	  background-image: -moz-linear-gradient(top, #32CD32, #006400);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #32CD32), color-stop(1.0, #006400));
	}
	.grad_color_litgreen_green:hover
	{
	  background-image: -moz-linear-gradient(top, #006400, #32CD32);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #006400), color-stop(1.0, #32CD32));
	}

	.grad_color_green_litgreen
	{
	  background-image: -moz-linear-gradient(top, #006400, #32CD32);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #006400), color-stop(1.0, #32CD32));
	}
	.grad_color_green_litgreen:hover
	{
	  background-image: -moz-linear-gradient(top, #32CD32, #006400);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #32CD32), color-stop(1.0, #006400));
	}


	.grad_color_yellow_ocra
	{
	  background-image: -moz-linear-gradient(top, #ffba42, #e49305);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #ffba42), color-stop(1.0, #e49305));
	}
	.grad_color_yellow_ocra:hover
	{
	  background-image: -moz-linear-gradient(top, #e49305, #ffba42);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #e49305), color-stop(1.0, #ffba42));
	}


	.grad_color_ocra_yellow
	{
	  background-image: -moz-linear-gradient(top, #e49305, #ffba42);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #e49305), color-stop(1.0, #ffba42));
	}
	.grad_color_ocra_yellow:hover
	{
	  background-image: -moz-linear-gradient(top, #ffba42, #e49305);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #ffba42), color-stop(1.0, #e49305));
	}


	  
	.grad_color_litorange_orange
	{
	  background-image: -moz-linear-gradient(top, #f78d10, #d96307);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #f78d10), color-stop(1.0, #d96307));
	}
	.grad_color_litorange_orange:hover
	{
	  background-image: -moz-linear-gradient(top, #d96307, #f78d10);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #d96307), color-stop(1.0, #f78d10));
	}


	.grad_color_orange_litorange
	{
	  background-image: -moz-linear-gradient(top, #d96307, #f78d10);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #d96307), color-stop(1.0, #f78d10));
	}
	.grad_color_orange_litorange:hover
	{
	  background-image: -moz-linear-gradient(top, #f78d10, #d96307);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #f78d10), color-stop(1.0, #d96307));
	}


	.grad_color_litblue_blue
	{
	  background-image: -moz-linear-gradient(top, #3ca5e7, #0b65a0);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #3ca5e7), color-stop(1.0, #0b65a0));
	}
	.grad_color_litblue_blue:hover
	{
	  background-image: -moz-linear-gradient(top, #0b65a0, #3ca5e7);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #0b65a0), color-stop(1.0, #3ca5e7));
	}

	.grad_color_blue_litblue
	{
	  background-image: -moz-linear-gradient(top, #0b65a0, #3ca5e7);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #0b65a0), color-stop(1.0, #3ca5e7));
	}
	.grad_color_blue_litblue:hover
	{
	  background-image: -moz-linear-gradient(top, #3ca5e7, #0b65a0);
	  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #3ca5e7), color-stop(1.0, #0b65a0));
	}

/*************************************************************/

	.font_white_shadowed
	{
		width: 120px;
		height: 22px;
		color: #FFF;
		font-family: Lato, Helvetica, Arial, sans-serif;
		font-weight: bold;
		text-align: center;
		text-shadow: 1px 1px 1px black, 0 0 1em rgb(21, 21, 22), 0 0 0.2em rgb(18, 18, 19);
	}

/*************************************************************/

	.greyed_image
	{
		-webkit-filter: grayscale(100%);
		   -moz-filter: grayscale(100%);
			 -o-filter: grayscale(100%);
			-ms-filter: grayscale(100%);
				filter: grayscale(100%); 
	}   

	.greyed_lighter_image
	{
		-webkit-filter: grayscale(100%) brightness(150%);
		   -moz-filter: grayscale(100%) brightness(150%);
			 -o-filter: grayscale(100%) brightness(150%);
			-ms-filter: grayscale(100%) brightness(150%);
				filter: grayscale(100%) brightness(150%); 
	}   

	.greyed_lighter_image_110
	{
		-webkit-filter: grayscale(100%) brightness(110%);
		   -moz-filter: grayscale(100%) brightness(110%);
			 -o-filter: grayscale(100%) brightness(110%);
			-ms-filter: grayscale(100%) brightness(110%);
				filter: grayscale(100%) brightness(110%); 
	}   
	.greyed_lighter_image_120
	{
		-webkit-filter: grayscale(100%) brightness(120%);
		   -moz-filter: grayscale(100%) brightness(120%);
			 -o-filter: grayscale(100%) brightness(120%);
			-ms-filter: grayscale(100%) brightness(120%);
				filter: grayscale(100%) brightness(120%); 
	}   
	.greyed_lighter_image_130
	{
		-webkit-filter: grayscale(100%) brightness(130%);
		   -moz-filter: grayscale(100%) brightness(130%);
			 -o-filter: grayscale(100%) brightness(130%);
			-ms-filter: grayscale(100%) brightness(130%);
				filter: grayscale(100%) brightness(130%); 
	}   
	.greyed_lighter_image_140
	{
		-webkit-filter: grayscale(100%) brightness(140%);
		   -moz-filter: grayscale(100%) brightness(140%);
			 -o-filter: grayscale(100%) brightness(140%);
			-ms-filter: grayscale(100%) brightness(140%);
				filter: grayscale(100%) brightness(140%); 
	}   

	.lighter_image_10
	{
		-webkit-filter: brightness(110%);
		   -moz-filter: brightness(110%);
			 -o-filter: brightness(110%);
			-ms-filter: brightness(110%);
				filter: brightness(110%); 
	}   
	.lighter_image_30
	{
		-webkit-filter: brightness(130%);
		   -moz-filter: brightness(130%);
			 -o-filter: brightness(130%);
			-ms-filter: brightness(130%);
				filter: brightness(130%); 
	}   
	.lighter_image_50
	{
		-webkit-filter: brightness(150%);
		   -moz-filter: brightness(150%);
			 -o-filter: brightness(150%);
			-ms-filter: brightness(150%);
				filter: brightness(150%); 
	}   


	.text_upper_case
	{
	  text-transform: uppercase;
	}

	.text_lower_case
	{
		text-transform: lowercase;
	}

	.text_capitalize
	{
		text-transform: capitalize;
	}

/******************************************************
 SHADOW 4 IMAGE
 ******************************************************/
	  
	.img_shadowed_1{ 	-webkit-filter: drop-shadow( 1px 1px 1px #565656 );
						   -moz-filter: drop-shadow( 1px 1px 1px #565656 );
								filter: drop-shadow( 1px 1px 1px #565656 ); }
	.img_shadowed_1_2{ 	-webkit-filter: drop-shadow( 1px 1px 2px #232323 );
						   -moz-filter: drop-shadow( 1px 1px 2px #232323 );
								filter: drop-shadow( 1px 1px 2px #232323 ); }
	.img_shadowed_2{ 	-webkit-filter: drop-shadow( 2px 2px 2px #232323 );
						   -moz-filter: drop-shadow( 2px 2px 2px #232323 );
								filter: drop-shadow( 2px 2px 2px #232323 ); }
	.img_shadowed_3{ 	-webkit-filter: drop-shadow( 3px 3px 3px #232323 );
						   -moz-filter: drop-shadow( 3px 3px 3px #232323 );
								filter: drop-shadow( 3px 3px 3px #232323 ); }
	.img_shadowed_4{ 	-webkit-filter: drop-shadow( 4px 4px 4px #232323 );
						   -moz-filter: drop-shadow( 4px 4px 4px #232323 );
								filter: drop-shadow( 4px 4px 4px #232323 ); }
	.img_shadowed_5{ 	-webkit-filter: drop-shadow( 4px 4px 4px #232323 );
						   -moz-filter: drop-shadow( 4px 4px 4px #232323 );
								filter: drop-shadow( 4px 4px 4px #232323 ); }
	.img_shadowed_6{ 	-webkit-filter: drop-shadow( 6px 6px 6px #232323 );
						   -moz-filter: drop-shadow( 6px 6px 6px #232323 );
								filter: drop-shadow( 6px 6px 6px #232323 ); }
	.img_shadowed_7{ 	-webkit-filter: drop-shadow( 7px 7px 7px #232323 );
						   -moz-filter: drop-shadow( 7px 7px 7px #232323 );
								filter: drop-shadow( 7px 7px 7px #232323 ); }
								
/******************************************************
 SHADOW 4 BOX
 ******************************************************/
	  
	.box_shadowed_1{ 	-webkit-box-shadow: 1px 1px 2px #808080;
						   -moz-box-shadow: 1px 1px 2px #808080;
								box-shadow: 1px 1px 2px #808080; }
		
	.box_shadowed_2{ 	-webkit-box-shadow: 2px 2px 2px #808080;
						   -moz-box-shadow: 2px 2px 2px #808080;
								box-shadow: 2px 2px 2px #808080; }
		
	.box_shadowed_3{ 	-webkit-box-shadow: 3px 3px 3px #808080;
						   -moz-box-shadow: 3px 3px 3px #808080;
								box-shadow: 3px 3px 3px #808080; }
		
	.box_shadowed_4{ 	-webkit-box-shadow: 4px 4px 4px #808080;
						   -moz-box-shadow: 4px 4px 4px #808080;
								box-shadow: 4px 4px 4px #808080; }
		
	.box_shadowed_5{ 	-webkit-box-shadow: 4px 4px 4px #808080;
						   -moz-box-shadow: 4px 4px 4px #808080;
								box-shadow: 4px 4px 4px #808080; }
		
	.box_shadowed_6{ 	-webkit-box-shadow: 6px 6px 6px #808080;
						   -moz-box-shadow: 6px 6px 6px #808080;
								box-shadow: 6px 6px 6px #808080; }
	 
	.box_shadowed_7{ 	-webkit-box-shadow: 7px 7px 7px #808080;
						   -moz-box-shadow: 7px 7px 7px #808080;
								box-shadow: 7px 7px 7px #808080; }
	 
/******************************************************
 SHADOW DIRECTION
 ******************************************************/
	 
	.shadow_top {	  box-shadow:  0px -15px  10px -15px #111;   	}
	.shadow_bottom_fading{   box-shadow:  0px  15px  20px -15px #39f;      }
	.shadow_bottom{   box-shadow:  0px  15px   7px -15px #003;      }
	.shadow_left {    box-shadow:  -15px   0px  10px -15px #111;     }
	.shadow_right {   box-shadow:   15px   0px  10px -15px #111;   	}
	
/******************************************************
 ROUNDED BOX
 ******************************************************/
	 
	.box_rounded_1{ 	-webkit-border-radius: 1px;
						   -moz-border-radius: 1px;
								border-radius: 1px;  }

	.box_rounded_2{ 	-webkit-border-radius: 2px;
						   -moz-border-radius: 2px;
								border-radius: 2px;  }

	.box_rounded_3{ 	-webkit-border-radius: 3px;
						   -moz-border-radius: 3px;
								border-radius: 3px;  }

	.box_rounded_4{ 	-webkit-border-radius: 4px;
						   -moz-border-radius: 4px;
								border-radius: 4px;  }

	.box_rounded_5{ 	-webkit-border-radius: 5px;
						   -moz-border-radius: 5px;
								border-radius: 5px;  }

	.box_rounded_6{ 	-webkit-border-radius: 6px;
						   -moz-border-radius: 6px;
								border-radius: 6px;  }

	.box_rounded_7{ 	-webkit-border-radius: 7px;
						   -moz-border-radius: 7px;
								border-radius: 7px;  }