/* #################################################
ROW */
.formRow {
min-width: 340px;
border: 0;
overflow: auto;
}


/* ################################################
ROW ITEM */
.formItem {
padding: 6px 0px 5px 0px;
display: inline-block;
border: 0;
vertical-align: middle;
}

/* #######################################################
INPUTS AND TEXTAREAS */

.formTextArea350px350px {
width:300px;
height: 300px;
outline: none;
color: White;
font-size: 14px;
background-image: url('../../img/shared/textArea350px350px.png');
background-color: transparent;
background-repeat: no-repeat;
background-size: 300px 300px;
border: 0;
padding: 20px 20px 20px 20px;
}


/* #######################################################
SEPARATOR */
.formSeparator {
height: 10px;
}

/* #######################################################
TWO WAY SELECTOR DIV */
.formYesOrNotDiv{
width: 200px;
height: 200px;
background-size: 400px 200px;
padding: 30px 10px 10px 190px;
}

/* #######################################################
WINDOWS */
.mainWindow {
display: block;
background: rgba(0, 0, 0, 0.8);
position: absolute;
box-shadow: 5px 5px 10px Black;
 -webkit-box-shadow: 5px 5px 10px 0px Black;
  -moz-box-shadow:    5px 5px 10px 0px Black;
border-radius: 15px;
border: 2px Solid Gray;
width: 400px;
}

.mainDivDragAndDrop {
height: 30px;
background: black;
cursor: move;
display: inline-block;
border: 0;
border-top-left-radius: 15px;
float: left;
}

.mainDivExit {
width: 30px;
height: 30px;
cursor: pointer;
background: black;
display: inline-block;
border-top-right-radius: 15px;
}

.exitCrossDiv {
text-align: center;
color: white;
font-weight: 200;
font-size: 18px;
margin-top: 1px;
border: 1px solid white;
border-radius: 20px;
}


.colorWhite {
color: white;
}

.textAlignCenter {
text-align: center;
}

.font18px {
font-size: 18px;
}

.formPanel {
color: white;
text-align: center;
font-weight: 100;
font-size: 22px;
padding: 125px 20px 0px 20px;
width: 100%;
}

.formOnOffSelector {
width: 80px;
height: 40px;
cursor: pointer;
}

.textAlignCenter { text-align: center; }

.suggestWindow {
	position: absolute;   
	background: rgba(0,0,0,0.8);
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	border:  1px solid gray; 
	margin-top: 1px; 
	padding: 5px; 
	cursor: default; 
	z-index: 1000;
	}
		
	.suggestLine {
	border: 1px Solid transparent;
	color: white;
	cursor: pointer;
	overflow: auto;
	margin-bottom: 5px;
	
	}
	
	.suggestLine:hover {
	background: #181818;
	border-bottom: 1px Solid gray;
	border-top: 1px Solid gray;
	box-shadow: 0px 4px 8px black;
	clear: none;
	margin-bottom: 5px;
	}


@media (min-width: 320px) {

	.mainWindow {
	width: 300px;	
	}
	
	.mainDivDragAndDrop {
	width: 265px;
	}
			
}


@media (min-width: 375px) {

	.mainWindow {
	width: 360px;	
	}
	
	.mainDivDragAndDrop {
	width: 325px;
	}
			
}


@media (min-width: 480px) {

	.mainWindow {
	width: 400px;	
	}
	
	.mainDivDragAndDrop {
	width: 365px;
	}
			
}


.formLineFocus400px{
border: 1px Solid transparent;
color: #ffffff;
cursor: pointer;
width: 300px;
clear: none;
border-radius: 10px;
}

.formLineFocus400px:hover {
background: rgba(0, 0, 0, 0.8);
color: #ffffff;
border-bottom: 1px Solid gray;
border-top: 1px Solid gray;
box-shadow: 0px 4px 8px black;
clear: none;
}