/* HANDIG VOOR JAVASCRIPT; ALTIJD BOVENAAN!!! */
.hide { display: none; }
.display { display: block; }

/* MEDIA WIDTH */
.sidebar0 { display: block;  }
.sidebar1 { display: none; }
.sidebar2 { display: none; }
.sidebar3 { display: none; }
.smartphone { display: none; }

/* start of desktop styles */

@media screen and (max-width: 1270px) {    
    .sidebar0 { display: none; }
    .sidebar1 { display: block; }
    .sidebar2 { display: none; }
    .sidebar3 { display: none; }
	 .smartphone { display: none; }
}

@media screen and (max-width: 972px) {
    .sidebar0 { display: none; }
    .sidebar1 { display: none; }
    .sidebar2 { display: block; }
    .sidebar3 { display: none; }
	 .smartphone { display: none; }
}

@media screen and (max-width: 913px) {
    .sidebar0 { display: none; }
    .sidebar1 { display: none; }
    .sidebar2 { display: none; }
    .sidebar3 { display: block; }
	 .smartphone { display: none; }
}

@media screen and (max-width: 590px) {
    .sidebar0 { display: none; }
    .sidebar1 { display: none; }
    .sidebar2 { display: none; }
    .sidebar3 { display: none; }
	 .smartphone { display: block; }
}

/*
html {
    height: 100%;
    width: 100%;    
    margin: 0;
	 padding: 0;
}
*/

body {
    background-color: var(--background);
	 /* background: linear-gradient(<angle>, color1 color1-stop-at, color2 color2-start-at); */
	 /* background: linear-gradient(110deg, #fdcd3b 60%, #ffed4b 60%); */
	 /* background: radial-gradient(110deg, #fdcd3b 60%, #ffed4b 60%); */
    color: #404040;
	 height: 100%;
    width: 100%;	 
	 /* 
	 height: 100vh;
	 width: 100vw;
	 */
    margin: 0;
    padding: 0;
}

/*
body {
  height: 100vh;
  width: 100vw;
  background-image: linear-gradient(red 33.33%, white 33.33%, white 66.66%, blue 66.66%);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  margin: 0px;
}
*/

/*
body {
  height: 100vh;
  width: 100vw;
  box-shadow: inset 0px 33.33vh 0px red, inset 0px 66.66vh 0px white, inset 0px 99.99vh 0px blue;
  margin: 0px;
}
*/

/* WERKT VOOR IE6, IE7, FF, OPERA (SLEEP-BUGGY) */
#wrap {  
    background-color: transparent;
	 color: #404040;
    width: 100%;
    margin: 0; 
}

/* MIDDENGEDEELTE VAN DE WEBSITE */
#inhoud { 
    margin: 0;
    border-left: 6px solid var(--background);
    border-right: 6px solid var(--background);
    background-color: transparent; 
}

/* WEBSITE HEADER (CONTAINER, ZELF INVULLEN) */
#header {
    clear: both;
    color: #505050;
    background-color: transparent;
    margin: 0;
    height: 130px;
}

#header img {
    width: 100%;
    height: 130px;
}

/* Komt van PollStart.php */
#stelling {
    padding: 0;
    margin: 0;
}

#stelling .radioButton {
    margin: 0;
    padding: 0;
    height: 14px;
    width: 14px;
    border: 0;
}

#stelling .pollTitel {
    font-size: 9pt;
    font-weight: normal;
    color: #909090;
    margin-bottom: 6px;
}

#stelling .pollTekst {
    font-size: 9pt;
    color: #505050;
    margin-top: 6px;
    margin-bottom: 3px;
}
#stelling .pollImage {
    padding-top: 2px;
}

/* --- MOET NAAR EIGEN CSS? --- */

#div_chat {
	background-color: var(--smiliebackground);
	height: 60%; 
	width: 90%; 
	overflow: auto; 
	border: 1px solid #555555; 
	padding: 5px; 
	margin-bottom: 5px;
	margin-left: 0px;
	color: var(--textmenucolor);
}

textarea {
  border: 1px solid #999999;
  width: 90%;
  margin: 5px 0;
  padding: 3px;
  margin-left: 0;
  background-color: var(--background);
  color: var(--textmenucolor);
}

select, input {
    margin-top: 6px;
    margin-bottom: 6px;	  
}

select {
	margin-top: 6px;
   margin-bottom: 6px;
	background-color: var(--background);
	border-style: solid;	 
	margin: 3px;
	padding: 3px;
	border: 1px solid #999999;
	color: var(--inputtextcolor);
}

label {
	color: #999999;
}

input[type=file] {
	background-color: var(--inputtypefile); 
	border-radius: 5px;
	padding-right: 8px;
	color: #666;
}

input[type=button] {	 
	/* height: 1.2em;	*/
	background-color: var(--inputtypecolor);
	border: none;
	color: white;
	text-decoration: none;
	padding: 4px;
	padding-left: 8px;
	padding-right: 8px;
	margin: 4px;
	margin-right: 0;
	margin-left: 0;
	cursor: pointer;
	border-radius: 5px;
}

input[type=submit] {
	width: 10em;  
	height: 2em;	 
	background-color: var(--inputtypecolor);
	border: none;
	color: white; /* var(--inputtextcolor); */
	text-decoration: none;
	margin: 4px 2px;
	margin-left: 0;
	cursor: pointer;
	border-radius: 5px;
}

input[type=text] {
    width: 14em;  
	 height: 1.2em;
	 color: var(--inputtextcolor);
	 margin: 4px 0 6px 0;
	 padding: 2px;
	 border-style: solid;	 
	 border: 1px solid #999999;	 
	 background-color: var(--background);
}

input[type=password] {
    width: 14em;  
	 height: 1.2em;
	 color: var(--inputtextcolor);
	 margin: 4px 0 6px 0;
	 padding: 2px;
	 border-style: solid;	 
	 border: 1px solid #999999;	 
	 background-color: var(--background);
}

/* Override Color when field is NOT empty */
input[type=text]:valid {
  background: var(--background);
}
input[type=password]:valid {
  background: var(--background);
}

textarea:focus, input:focus {
    outline: none; 
	 border: 1px solid var(--textareaborder);
	 box-shadow: none; 
}

/* Werkt niet
input[type=checkbox] {
    width: 14em;  height: 1.2em;
}
*/

/* IE6 TWEAKS
#i_sidebar .i_list_app {
    _display:inline;
}
*/