/* #RESET MENU
================================================== */

    @media only screen and (min-width: 960px) {
	
	ul#nav				{display:block !important;}

	
	}
	

  /* #ALL
================================================== */
	
	@media only screen and (max-width: 959px) {
	
		a.back		{top:60px}
		.responsive-clear_both	{ clear:both;}
	
		.add_event_button{
			width: 35px;
			height: 35px;
			bottom: 10px;
			right: 10px;
		}
		.add_event_button span:before{
			content:"";
			background: #fff;
			height: 16px;
			width: 2px;
			position: absolute;
			left: 16px;
			top: 10px;
		}
		.add_event_button span:after{
			content:"";
			height: 2px;
			width: 16px;
			background: #fff;
			position: absolute;
			left: 9px;
			top: 17px;
		}
		
		.dhx_form50	{width:100% !important}
	
	}
	
/* #Tablet (Portrait)
================================================== *

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {

	
	.responsive_menu	{display:block;}


	#top2 ul#nav {float:none;  padding:0; position:relative; left:auto; display:none;}
	#top2 ul#nav li {float:none;position:relative; right:auto; border-top: 1px #aaaaaa solid}
	#top2 ul#nav > li:hover			{border-bottom: 1px solid transparent;border-left: 1px solid transparent;border-right: 1px solid transparent;}
	#top2 ul#nav li a.selected 		{border: 1px solid transparent;}


	/* ------------------------ SOUS MENU ------------------------ */

	#top2 ul#nav ul  					{position:relative;top:0;width:100%;-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);}
	#top2 ul#nav li ul 					{float:inherit;width:100%; overflow:hidden}
	#top2 ul#nav ul li 					{float:inherit;width:100%;border-bottom:none}
	#top2 ul#nav > li li 				{float:inherit; width:100%; z-index:1000000; background-color:#fafafa;border-bottom:none}
	#top2 ul#nav ul li a 				{text-align:center;}
		

	}


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */
    @media only screen and (min-width: 480px) and (max-width: 767px) {
		
		
	.twocol			{width:100% !important;}
	.treecol			{width:50% !important;}

	.container_full					{margin:0}
	
	.responsive_menu				{display:block;}

	#top1,
	#top2 							{padding:0 10px}
	#top1 ul.settings_help				{margin-right:40px;}
	#top2 ul#nav 					{float:none;  padding:0; position:relative; left:auto; display:none;}
	#top2 ul#nav li 					{float:none;position:relative; right:auto; border-top: 1px #aaaaaa solid}
	#top2 ul#nav > li:hover			{border-bottom: 1px solid transparent;border-left: 1px solid transparent;border-right: 1px solid transparent;}
	#top2 ul#nav li a.selected 		{border: 1px solid transparent;}

			/* ------------------------ SOUS MENU ------------------------ */

		#top2 ul#nav ul  				{position:relative;top:0;width:100%;-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);}
		#top2 ul#nav li ul 				{float:inherit;width:100%; overflow:hidden}
		#top2 ul#nav ul li 				{float:inherit;width:100%;border-bottom:none}
		#top2 ul#nav > li li 			{float:inherit; width:100%; z-index:1000000; background-color:#fafafa;border-bottom:none}
		#top2 ul#nav ul li a 			{text-align:center;}


	.responsive_left				{ float:inherit; text-align:left;width:100%; overflow:hidden}
	.responsive_right				{ float:inherit; text-align:right;width:100%; overflow:hidden}
	.responsive_center				{ float:inherit; text-align:center;width:100%; overflow:hidden}
	.responsive_center_table		{ float:inherit; margin-left:auto !important; margin-right:auto !important; text-align:center; display:table}
	.responsive_border-top			{border-top:1px #fff solid}
	.responsive_border-bottom		{border-bottom:1px #ddd solid}
	
	.responsive_margin-top			{margin-top:10px}
	.responsive_margin-bottom		{margin-bottom:10px}
	.responsive_padding-top			{padding-top:10px !important}
	.responsive_padding-bottom		{padding-bottom:10px !important}
	.responsive_hidden				{display:none}


    }



/*  #Mobile (Portrait)
================================================== */

/* Note: Design for a width of 320px */
@media only screen and (max-width: 479px) {


	.twocol			{width:100% !important;}
	.treecol			{width:100% !important;}
	.container_full			{margin:0}
	
	.responsive_menu	{display:block;}
	#top1,
	#top2 {padding:0 10px}
	#top1 ul.settings_help				{margin-right:40px;}	
	#top2 ul#nav {float:none; padding:0; position:relative; left:auto; display:none;}
	#top2 ul#nav li {float:none;position:relative; right:auto; border-top: 1px #aaaaaa solid}
	#top2 ul#nav > li:hover			{border-bottom: 1px solid transparent;border-left: 1px solid transparent;border-right: 1px solid transparent;}
	#top2 ul#nav li a.selected 		{border: 1px solid transparent;}

			/* ------------------------ SOUS MENU ------------------------ */

		#top2 ul#nav ul  				{position:relative;top:0;width:100%;-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);}
		#top2 ul#nav li ul 				{float:inherit;width:100%; overflow:hidden}
		#top2 ul#nav ul li 				{float:inherit;width:100%;border-bottom:none}
		#top2 ul#nav > li li 			{float:inherit; width:100%; z-index:1000000; background-color:#fafafa;border-bottom:none}
		#top2 ul#nav ul li a 			{text-align:center;}

	.responsive_left				{ float:inherit; text-align:left;width:100%; overflow:hidden}
	.responsive_right				{ float:inherit; text-align:right;width:100%; overflow:hidden}
	.responsive_center				{ float:inherit; text-align:center;width:100%; overflow:hidden}
	.responsive_center_table		{ float:inherit; margin-left:auto !important; margin-right:auto !important; text-align:center; display:table}
	.responsive_border-top			{border-top:1px #fff solid}
	.responsive_border-bottom		{border-bottom:1px #ddd solid}
	
	.responsive_margin-top			{margin-top:10px}
	.responsive_margin-bottom		{margin-bottom:10px}
	.responsive_padding-top			{padding-top:10px !important}
	.responsive_padding-bottom		{padding-bottom:10px !important}
	.responsive_hidden				{display:none}

	.img_left						{float:inherit; margin:0 0 10px 0}
	
	#popup_content					{margin-left:inherit !important; left:0 !important;width:100% !important;}

}




/*  too small
================================================== */

    /* Note: Design for a width < 320px */
    @media only screen and (max-width: 319px) {
	#content_view					{display:none}
	.toosmall  	{display:block}


    }