/*********************************************************************************************************/
/***************** rayngap base css file, DO NOT CHANGE UNTIL YOU REALLY KNOW WHAT YOU DO  ***************/
/* Copyright 2014-2018 Dominik Hofer, provided under GNU General Public License, see GNU GPL LICENSE.txt */
/*********************************************************************************************************/

body{
position:relative;
}

.ray_box {
	width: 100%;
	height: 100%;
}

.ray_lay_hov01 {
	background:rgb(99,209,62);
	background:rgba(99,209,62,0.3);
}

.ray_lay_act01 {
	background:rgb(5, 40, 216);
	background:rgba(5, 40, 216,0.3);
}

.ray_child_act01 {
	outline-style:solid;
	outline-width:2px;
	outline-color:red;
	outline-offset:-2px;
}

.ray_child_act02 {
	outline-style:solid;
	outline-width:2px;
	outline-color:yellow;
	outline-offset:0px;
}

.ray_child_act03 {
	background:rgb(255, 0, 0);
	background:rgba(255, 0, 0,0.3);
}

.ray_backbox01 {
position:absolute; width:100%; height:100%;	left:0;	top:0;
opacity:0.5; filter:alpha(opacity=50);
}

.ray_backbox02 {
position:absolute; width:100%; height:100%;	left:0;	top:0;
}

.ray_shadow_thin {
	box-shadow: 0px 0px 1.5px 0px #1C1C1C;
}

p.ray_pol {
	font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
	margin: 0px;
	padding: 0px 0px 3px 0px;
	color: #1C1C1C;
	overflow:hidden;
	white-space: nowrap;
}

.ray.overlaybox {
	background-color:#dfdde1;
	box-shadow: 0px 0px 5px 1px #1C1C1C;
}

.ray.overlayboxhead {
	background-color:#B7B3BB;
	padding:3px;
}

.ray.overlayboxcont {
	padding:3px;
}

.ray.overlayinfield {                      /* for normal input field */
	font-size: 12px;
	padding:0px;
	color: #1C1C1C;
	border-width:thin;
}

.ray_ali_ttb{
}

.ray_ali_btt{
	/*seems to be a challenge to be solved lateron*/
}

.ray_ali_rtl{
	float:right;
}

.ray_ali_ltr{
	float:left;
}

.tinymce_blank{
	
}

/************************************* rayngap standard switch design **************************************/
.ray_switch01{
  position: relative;
  display: inline-block;
  width: 50px;
  height: 28px;
}
.ray_switch01 input {display:none;}

.ray_slider01 {
  border-radius: 28px;
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #cccccc;
  transition: .4s;
}
.ray_slider01:before {
	border-radius: 50%;
  position: absolute;
  content: "";
  height: 22px;
  width: 22px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  transition: .4s;
}

input:checked + .ray_slider01 {
  background-color: #616161;
}

input:focus + .ray_slider01 {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .ray_slider01:before {
  transform: translateX(22px);
}
/************************** classes for control elements with material icon font ********************************/
.ray_mif_ico_bas{
	cursor:pointer;
	display:inline-block;
	vertical-align:bottom;
	transition:opacity 0.5s;
}
.ray_mif_ico_std{
	font-size:1.2rem;
}
.ray_mif_ico_std:hover{
	background-color:rgba(125,125,125,0.7);
}
.ray_mif_checkbox{
	font-size:1.1em;
	vertical-align:bottom;
	cursor:default;
}
.ray_mif_checkbox:hover{
	background-color:rgba(30,30,30,0.1);
}
.ray_mif_checkbox:active{
	background-color:rgba(30,30,30,0.2);
}
/************************** highlighting classes for structures, i. e. media manager ********************************/
.ray_media_high{
}
.ray_media_high:hover{
	box-shadow: 0px 0px 1px 1px rgba(30,30,30,0.3) inset;
}
.ray_media_high:active{
	box-shadow: 0px 0px 1px 1px rgba(30,30,30,0.7) inset;
}
.ray_media_high_drag{
	box-shadow: 0px 0px 1px 1px rgba(30,30,30,0.3) inset;
}
.ray_media_sel{
	box-shadow: 0px 0px 1px 1px rgba(30,30,30,0.7) inset;
}

/************************************** standard classes ***************************************************/
.ray_unselectable{
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none; /* Chrome/Safari/Opera */
	-khtml-user-select: none; /* Konqueror */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
	user-select: none;
}

/*************************** ellipsis/scroll for overlong text in field/p **************************************/
.ray_ellipscroll{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: 2s; 
	transition-timing-function: linear;
}
.ray_ellipscroll:hover{
	margin-left: -100px;
}

/********************************** transitions to divs ***************************************************/
.ray_trans01 {
	transition: height 0.5s ease, width 0.5s ease, opacity 0.5s ease;
}

.ray_snapback {
	transition: left 0.3s ease, top 0.3s ease, right 0.3s ease;
}

.ray_slidediv01 {
	white-space:nowrap;
	transition: width 0.5s ease, height 0.5s ease;
}

/********************************** background video styling **************************************/
video.ray_bgvid { 
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	z-index: -100;
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	transition: 1s opacity;
}

video.ray_stopfade {
	opacity: .5;
}
/********************* responsive image class(es) **************************************/
.ray_rsp_img_01 {
	max-width: 100%;
	height: auto;
}
/************* responsive list design *************/
.ray_rsp_tab_01{
	width:100%;
}
.ray_rsp_tab_01 tr{
	border-collapse:collapse;

}
.ray_rsp_tab_01 th{
	border-collapse:collapse;
	vertical-align:top;
	background-color: rgba(255, 255, 255, 0);
	border:none;
	padding:0.4rem 0 0 0;
	font-size:1rem;
	font-weight:700;
	width:13rem;
	display:block;
}
.ray_rsp_tab_01 td{
	border-collapse:collapse;
	background-color: rgba(255, 255, 255, 0);
	border:none;
	padding:0;
	font-size:1rem;
	font-weight:400;
	display:block;
}
@media only screen and (min-width: 768px){
	.ray_rsp_tab_01 th{display:table-cell;}
	.ray_rsp_tab_01 td{
		padding:0.4rem 0 0 0;
		display:table-cell;
	}
}
.ray_rsp_tab_rem_01{
	font-size:0.9em;
	font-style:italic;
}