html 
{
	/*font-size: 20px;*/
}

/*
@media (min-width:501px) and (max-width:1000px) 
{  
	html
	{
		font-size: 2vw;
	
	}

}*/

#PageInfo
{
	width:100%;
	margin:  0 0 2.5% 2.5%;
	height auto;
}

.Lan
{
	width:32.778%;
	float:left;
	margin: 0 0 0 0;
	padding: 0;

}

.Lan input, .Lan textarea, .Lan select, .ql-toolbar, .HtmlEditor
{
	width:90%;
}

.Lan textarea
{
	resize: none;
	height:10em;
}


body
{
	font-size: 1rem;
   width:100%;
   height:100%;
}


#BOLogin
{
	padding: 1em;
	position:relative;
	top:calc(50vh - 7.7em);
	height:14em;
	width:22em;
   font-size: 1em;
   border-radius: .5em;
   
   margin:auto;
	
	color:black;
	
	background-color:white;
	
	border: .2em solid rgb(   0, 87, 113 );
}


/*
@media 
 (max-width: 800px),
 (-webkit-min-device-pixel-ratio: 1.1)  and (orientation:portrait), 
 (min--moz-device-pixel-ratio: 1.1) and (orientation:portrait), 
 (-o-min-device-pixel-ratio: 1.1/1) and (orientation:portrait), 
 (min-device-pixel-ratio: 1.1) and (orientation:portrait), 
 (min-resolution: 100dpi) and (orientation:portrait), 
 (min-resolution: 1.1dppx) and (orientation:portrait) */
@media 
 (max-width: 700px),
 (-webkit-min-device-pixel-ratio: 1.1),  
 (min--moz-device-pixel-ratio: 1.1), 
 (-o-min-device-pixel-ratio: 1.1/1), 
 (min-device-pixel-ratio: 1.1), 
 (min-resolution: 100dpi), 
 (min-resolution: 1.1dppx) 
{  


  #BOLogin
   {
      padding: .7em;
      top:calc(50vh - 7em);
      height:14em;
      width:18em;
      font-size: 1em;
      border-radius: .5em;
      border-width: .2em;
   }  
	
   #BOMENU .CanHide
     {
      display:none;   
   }
   
   
   body
    {
      font-size: 3rem;
   }
	
	.Lan
	{
		width:100%;
	}
	
	#PageInfo[lang=nl] .InputContainer *[lang=en]
	{
		display:none;
	}
	
	#PageInfo[lang=nl] .InputContainer *[lang=es]
	{
		display:none;
	}
	
	#PageInfo[lang=en] .InputContainer *[lang=nl]
	{
		display:none;
	}
	
	#PageInfo[lang=en] .InputContainer *[lang=es]
	{
		display:none;
	}
	
	#PageInfo[lang=es] .InputContainer *[lang=nl]
	{
		display:none;
	}
	
	#PageInfo[lang=es] .InputContainer *[lang=en]
	{
		display:none;
	}
	
 }

@media

 (max-width: 700px) and (max-height: 80vw),
 (-webkit-min-device-pixel-ratio: 1.1) and (max-height: 80vw),  
 (min--moz-device-pixel-ratio: 1.1) and (max-height: 80vw), 
 (-o-min-device-pixel-ratio: 1.1/1) and (max-height: 80vw), 
 (min-device-pixel-ratio: 1.1) and (max-height: 80vw), 
 (min-resolution: 100dpi) and (max-height: 80vw), 
 (min-resolution: 1.1dppx)and (max-height: 80vw) 
{
   #BOLogin
      {
      top:.7em;
   }
}
 
@media (max-height: 30vw) 
{
   #BOLogin
      {
      top:.7em;
   }
}
 
 

@font-face 
{
   font-family: OpenSans;
   src: url('/font/OpenSans-Regular.eot'); /* IE9 Compat Modes */
   src: url('/font/OpenSans-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	  url('/font/OpenSans-Regular.woff') format('woff'), /* Pretty Modern Browsers */
	  url('/font/OpenSans-Regular.ttf')  format('truetype'), /* Safari, Android, iOS */
	  url('/font/OpenSans-Regular.svg#svgFontName') format('svg'); /* Legacy iOS */
	  
	font-weight:normal;

}

@font-face 
{
   font-family: OpenSans;
   src: url('/font/OpenSans-Bold.eot'); /* IE9 Compat Modes */
   src: url('/font/OpenSans-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	  url('/font/OpenSans-Bold.woff') format('woff'), /* Pretty Modern Browsers */
	  url('/font/OpenSans-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
	  url('/font/OpenSans-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */
	font-weight:bold;
}

html
{
	/*overflow-x:hidden;*/
}

body{margin:0;background-color: #f0f0f0;}




.InputContainer 
{
	clear:both;
}

#BOMENU
{
	width:100%;
	height:1.9em;
	background-color: rgb(   0, 87, 113 );
	/*border:.05em solid rgb(   0, 87, 113 );*/
	font-size: .8em;
	padding: .2em;
}

#BOMENU a
{
	display:inline-block;
	height:1.4em;
	padding-left:.2em;
	padding-right:.2em;
	/*
	background-color:rgb(   255, 255, 255 );
	color:rgb(   0, 175, 227 );
	*/
	
	background-color:rgb(   0, 175, 227 );
	color:white;
	border-right:.05em solid rgb(   0, 87, 113 );
	/*
	
	*/
}

#BOMENU a.LoginAction
{
	float:right;
}



html,body,h1,h2,h3,h4,h5{font-family:OpenSans;}

	.Label, label
	{
	   font-family:OpenSans;
	   font-size:.9em;
		padding:0;
		margin:0;
		color:rgb(   0, 112, 137 );
	}
				
   textarea
   {
      height:30em;
   }
            
	input, button, select, textarea, .HtmlEditor
	{
	   font-family:OpenSans;
	   font-size:.9em;
	}
	
	.dropable
	{
		
	}
	
	input, select, textarea,  .ql-editor 
	{
		padding: 0.2em 0.0em;
		margin: .05em 0.05em;
		border-radius: .2em;
		border: .05em solid rgb(   0, 175, 227 );
		background-color:white;
	}
	
	.ql-container.ql-snow
	{
		border:none;
	}
							
	input, select, textarea 
	{

		display: inline-block;
		box-sizing: border-box;
	}

	select
	{
	   width: 10em;
	}

	input[type=submit],button {

		background-color: rgb(  57, 151,  26 );
		color: white;
		 
		padding: 0.2em 0.6em;
		margin: 0.05em 0.05em;
		border-radius: .2em;
		border:  rgb(  28, 75,  13 )0.1em  solid;
		cursor: pointer;
	}

	input[type=date] {
	   width:calc(7.5em + 25px);
	}

	input[type=time] 
	{
	   width:calc(5.25em + 25px);
	}
	 
	
	#MenuBar
	{
		width:100%;
		height:2em;
		display:block;
		background-color: gray;
	}
	
	
	
	.PreviewImage
	{
		width:20em;
		height:15em;
	}
	
	.dropable
	{
		font-weight: bold;
		font-size:1.5em;
		text-align: center;
		padding: 1em 0;
		/*margin: 1em 0;*/
		color: rgb(   0, 175, 227 );
		
		border: 2px dashed rgb(   0, 175, 227 );
		border-radius: .3em;
		cursor: default;
		height:5em;
		width:95%;
	}

	.Gallery
	{
		color: rgb(   0, 175, 227 );
	}

	.dropable:hover
	{
		color: rgb(   0, 175, 227 );
		border: .05em solid rgb(   0, 175, 227 );
		box-shadow: inset 0 3px 4px #888;
	}
	

input.Locker[type=checkbox] 
{
	display:none; 
} 

input.Locker[type=checkbox] + label:before 
{
  font-family: FontAwesome;
  display: inline-block;
}

/* Unchecked */
input.Locker[type=checkbox] + label:before 
{
  color:#888;
  content: "\f09c"; 

}

/* Checked */
input.Locker[type=checkbox]:checked + label:before 
{ 
  color:#000;
  content: "\f023";

} 

.ql-snow
{
	color:black;
}