@import "bulma.min.css";

*,
*::before,
*::after {
	margin: 0;
	padding: 0;
	font: inherit;
	box-sizing: border-box;
}
/* @import "flag-icons.css"; */


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

body {   
	overflow-x: hidden; /* workaround for https://github.com/jgthms/bulma/issues/449 */
	/* hyphens: auto; */

	/* background-color: hsl(0, 0%, 29%); */
	/* color: white; */
  /* font-family: latin_script; */
	/* height: 100vh; */

	/* margin: 0px; */
	/* padding: 0px; */
  /* text-align: left; */
}

@media screen and (max-width: 1024px) { /* workaround for https://github.com/jgthms/bulma/issues/449 */
  .columns {
    margin-left: 0;
    margin-right: 0;
  }
}


@input-placeholder {                                                                                                                                                    
	color: #999;                                                                                                                                                          
}                                                                                                                                                                       

::placeholder {                                                                                                                                                         
	opacity: 1;  // For Firefox.                                                                                                                                          
}        

/* @font-face { */
/* 		/1* font-display: swap; *1/ */
/* 		/1* font-style: normal; *1/ */
/* 		/1* font-weight: 400; *1/ */
/*     font-family: "latin_script"; */
/*     src: url("/latin_script.woff2") format("woff2"); */
/* } */


@font-face {
		/* font-display: swap; */
		/* font-style: normal; */
		/* font-weight: 400; */
    font-family: "latin_script_roboto_mono";
    src: url("/latin_script_roboto_mono.woff2") format("woff2");
}




/* @font-face { */
/*     font-family: "arabic_script"; */
/*     src:url("/arabic_script.woff") format("woff"); */
/* } */



/* @font-face { */
/*     font-family: "japanese_script"; */
/*     src:url("/japanese_script.woff") format("woff"); */
/* } */



/* @font-face { */
/*     font-family: "korean_script"; */
/*     src:url("/korean_script.woff") format("woff"); */
/* } */


/* @font-face { */
/*     font-family: "hindi_script"; */
/*     src:url("/hindi_script.woff") format("woff"); */
/* } */


/* @font-face { */
/*     font-family: "bengali_script"; */
/*     src:url("/bengali_script.woff") format("woff"); */
/* } */



/* @font-face { */
/*     font-family: "traditional_chinese_script"; */
/*     src:url("/traditional_chinese_script.woff") format("woff"); */
/* } */



/* @font-face { */
/*     font-family: "simplified_chinese_script"; */
/*     src:url("/simplified_chinese_script.woff") format("woff"); */
/* } */



/* @font-face { */
/*     font-family: "hebrew_script"; */
/*     src:url("/hebrew_script.woff") format("woff"); */
/* } */


/* Navbarburger implemented with pure css */

@media screen and (max-width: 1023px) {
    /* show mavbar-menu on screen less than 1024px */
    #menu-toggle:checked ~ #puzzlesNavbarMenu { display: block; }

    /* make navbar-burger become cross on screen less than 1024px */
    #menu-toggle:checked + .navbar-burger span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
    #menu-toggle:checked + .navbar-burger span:nth-child(2) { opacity: 0; }
    #menu-toggle:checked + .navbar-burger span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }
    /* you can also replace + with ~ in above three rules and get the same result */

    #puzzlesNavbarMenu { left:0; right:0; top:100%; position: absolute; }
  }

/* /Navbarburger */


.small-right-margin {
  margin-right: 0.3em;
	margin-left: 0.7em;
  padding: 0em;
}

/* .small-left-margin { */
/*   margin-left: 0.2em; */
/* 	margin-right: 0.5em */
/*   padding: 0em; */
/* } */

.small-margin {
  margin: 0.3em;
  padding: 0em;
}

.no-margin {
  margin: 0em;
  padding: 0em;
}

.is-narrow {
  margin: 0px;
  padding: 0px;
}

.latin-script {
  /* font-family: latin_script; */
  font-family: Arial, sans-serif;
}

.latin-script-roboto-mono {
  font-family: latin_script_roboto_mono;
}

/* .traditional-chinese-script { */
/*   font-family: traditional_chinese_script; */
/* } */


.dark {
	overflow-x: hidden; /* workaround for https://github.com/jgthms/bulma/issues/449 */
	background-color: hsl(0, 0%, 29%);
	height: 100vh;
	color: white;
  /* font-family: latin_script; */
  font-family: Arial, sans-serif;
}


.dark-latin {
	overflow-x: hidden; /* workaround for https://github.com/jgthms/bulma/issues/449 */
	background-color: hsl(0, 0%, 29%);
	height: 100vh;
	color: white;
  /* font-family: latin_script; */
  font-family: Arial, sans-serif;
}

.light {
	overflow-x: hidden; /* workaround for https://github.com/jgthms/bulma/issues/449 */
	height: 100vh;
  /* font-family: latin_script; */
  font-family: Arial, sans-serif;
}

.light-latin {
	overflow-x: hidden; /* workaround for https://github.com/jgthms/bulma/issues/449 */
	height: 100vh;
  /* font-family: latin_script; */
  font-family: Arial, sans-serif;
}


.text-align-left {
  text-align: left;
}

.text-align-center {
  text-align: center;
}

.text-color-white {
	color: white; 
}


.text-color-dark {
	color: hsl(0, 0%, 21%); 
}

.text-color-grey {
	color: hsl(0, 0%, 48%); 
}

.text-color-green {
	color: green; 
}

.text-color-red {
	color: red; 
}

.hallo {
	color: green;
}


.table.is-borderless th, .table.is-borderless td {
 border: 0;
}

 

.table.is-fixed {
 table-layout: fixed;
}

.table.is-bordered th, .table.is-bordered td {
	border: 1px solid;
  border-collapse: collapse;
}

.table.is-white-bordered th, .table.is-white-bordered td {
	border: 5px solid white;
  border-collapse: collapse;
}

.small {
 min-width: 1.2em;
 max-width: 1.2em;
}

.invisible {
	color: transparent;
	/* visibility: hidden; */
}

.w6 {
	font-size : 0.85rem;
	margin: -0.5rem;
	padding: 0;
	text-align: center;
	font-weight: bold;
}

.w7 {
	width: 0.7em;
	margin-right: -0.3em;
	margin-left: -0.3em;
	padding-right: 0rem;
	padding-left: 0rem;
	text-align: center;
}

/* HIER! */

.w7light {
	background-color: hsl(0, 0%, 29%);
	/* color: hsl(0, 0%, 29%); */
	color: transparent; 
}

.w7dark {
	background-color: hsl(0, 0%, 29%);
	/* color: hsl(0, 0%, 29%); */
	color: transparent;
}



.w8 {
	width: 0.8em;
	text-align: center;
}


.w9 {
 width: 0.9em;
}

.w10 {
 width: 1em;
}

.w11 {
 width: 1.1em;
}

.w12 {
 width: 1.2em;
}

.w13 {
 width: 1.3em;
}

.w14 {
 width: 1.4em;
}

.w15 {
 width: 1.5em;
}


.dummy {
 width: 1.5em;
 color: white;
}

.is-centered {
	margin-left: auto; 
	margin-right: auto;
}

.hangman-container {
	margin-left : -2rem;
	margin-right : -2rem;
	padding : 0;
	/* margin-left: auto; */
	/* margin-right: auto; */
	text-align: center;
	/* background-color: grey; */

}

.hangman-table {
	/* font-size: 90%; */
	margin-left: auto; 
	margin-right: auto;
	/* background-color: pink; */
}

.dark-hangman-table {
	/* font-size: 90%; */
	margin-left: auto; 
	margin-right: auto;
	background-color: hsl(0, 0%, 29%);
}

thead {
	font-weight: bold;
}

table {
	text-align: left;
}

/* sudoku */

.cell-not-given {
	background-color: transparent;
	color: black;
}

.cell-given {
	background-color: lightgrey;
	color: black;
}

.select-not-given {
	appearance: none;
	border: none;
	background-color: transparent;
	color: black;
}


.select-given {
	appearance: none;
	border: none;
	background-color: transparent;
	color: black;
}

.select-invisible {
	appearance: none;
	border: none;
	background-color: white;
	color: white;
}


.puzzles-blue {
	color: hsl(217, 71%, 53%);
	/* color: hsl(0, 0%, 4%); */
}

/* <l> */

#l1 {
  border-top: 2px solid;
  border-left: 2px solid;
}

#l2 {
  border-top: 2px solid;
}


#l3 {
  border-top: 2px solid;
  border-right: 2px solid;
}

#l4 {
  border-top: 2px solid;
}

#l5 {
  border-top: 2px solid;
}

#l6 {
  border-top: 2px solid;
  border-right: 2px solid;
}

#l7 {
  border-top: 2px solid;
}

#l8 {
  border-top: 2px solid;
}

#l9 {
  border-top: 2px solid;
  border-right: 2px solid;
} 

#l10 {
  border-left: 2px solid;
} 

#l12 {
  border-right: 2px solid;
}

#l15 {
  border-right: 2px solid;
}

#l18 {
  border-right: 2px solid;
}

#l19 {
  border-left: 2px solid;
  border-bottom: 2px solid;
}

#l20 {
  border-bottom: 2px solid;
}

#l21 {
  border-right: 2px solid;
  border-bottom: 2px solid;
}

#l22 {
  border-bottom: 2px solid;
}

#l23 {
  border-bottom: 2px solid;
}

#l24 {
  border-right: 2px solid;
  border-bottom: 2px solid;
}

#l25 {
  border-bottom: 2px solid;
}

#l26 {
  border-bottom: 2px solid;
}

#l27 {
  border-bottom: 2px solid;
  border-right: 2px solid;
}

#l28 {
  border-left: 2px solid;
}

#l30 {
  border-right: 2px solid;
}

#l33 {
  border-right: 2px solid;
}

#l36 {
  border-right: 2px solid;
}

#l37 {
  border-left: 2px solid;
}

#l39 {
  border-right: 2px solid;
}

#l42 {
  border-right: 2px solid;
}

#l45 {
  border-right: 2px solid;
}

#l46 {
  border-left: 2px solid;
  border-bottom: 2px solid;
}

#l47 {
  border-bottom: 2px solid;
}

#l48 {
  border-bottom: 2px solid;
  border-right: 2px solid;
}

#l49 {
  border-bottom: 2px solid;
}

#l50 {
  border-bottom: 2px solid;
}

#l51 {
  border-bottom: 2px solid;
  border-right: 2px solid;
}

#l52 {
  border-bottom: 2px solid;
}

#l53 {
  border-bottom: 2px solid;
}

#l54 {
  border-right: 2px solid;
  border-bottom: 2px solid;
}

#l55 {
  border-left: 2px solid;
} 


#l57 {
  border-right: 2px solid;
}

#l60 {
  border-right: 2px solid;
}

#l63 {
  border-right: 2px solid;
}

#l64 {
  border-left: 2px solid;
}

#l66 {
  border-right: 2px solid;
}

#l69 {
  border-right: 2px solid;
}

#l72 {
  border-right: 2px solid;
}

#l73 {
  border-left: 2px solid;
  border-bottom: 2px solid;
}

#l74 {
  border-bottom: 2px solid;
}

#l75 {
  border-right: 2px solid;
  border-bottom: 2px solid;
}

#l76 {
  border-bottom: 2px solid;
}

#l77 {
  border-bottom: 2px solid;
}

#l78 {
  border-right: 2px solid;
  border-bottom: 2px solid;
}

#l79 {
  border-bottom: 2px solid;
}

#l80 {
  border-bottom: 2px solid;
}

#l81 {
  border-right: 2px solid;
  border-bottom: 2px solid;
}

/* </l> */

/* HIER */

/* <d> */

#d1 {
  border-top: 2px solid white;
  border-left: 2px solid white;
}

#d2 {
  border-top: 2px solid white;
}


#d3 {
  border-top: 2px solid white;
  border-right: 2px solid white;
}

#d4 {
  border-top: 2px solid white;
}

#d5 {
  border-top: 2px solid white;
}

#d6 {
  border-top: 2px solid white;
  border-right: 2px solid white;
}

#d7 {
  border-top: 2px solid white;
}

#d8 {
  border-top: 2px solid white;
}

#d9 {
  border-top: 2px solid white;
  border-right: 2px solid white;
} 

#d10 {
  border-left: 2px solid white;
} 

#d12 {
  border-right: 2px solid white;
}

#d15 {
  border-right: 2px solid white;
}

#d18 {
  border-right: 2px solid white;
}

#d19 {
  border-left: 2px solid white;
  border-bottom: 2px solid white;
}

#d20 {
  border-bottom: 2px solid white;
}

#d21 {
  border-right: 2px solid white;
  border-bottom: 2px solid white;
}

#d22 {
  border-bottom: 2px solid white;
}

#d23 {
  border-bottom: 2px solid white;
}

#d24 {
  border-right: 2px solid white;
  border-bottom: 2px solid white;
}

#d25 {
  border-bottom: 2px solid white;
}

#d26 {
  border-bottom: 2px solid white;
}

#d27 {
  border-bottom: 2px solid white;
  border-right: 2px solid white;
}

#d28 {
  border-left: 2px solid white;
}

#d30 {
  border-right: 2px solid white;
}

#d33 {
  border-right: 2px solid white;
}

#d36 {
  border-right: 2px solid white;
}

#d37 {
  border-left: 2px solid white;
}

#d39 {
  border-right: 2px solid white;
}

#d42 {
  border-right: 2px solid white;
}

#d45 {
  border-right: 2px solid white;
}

#d46 {
  border-left: 2px solid white;
  border-bottom: 2px solid white;
}

#d47 {
  border-bottom: 2px solid white;
}

#d48 {
  border-bottom: 2px solid white;
  border-right: 2px solid white;
}

#d49 {
  border-bottom: 2px solid white;
}

#d50 {
  border-bottom: 2px solid white;
}

#d51 {
  border-bottom: 2px solid white;
  border-right: 2px solid white;
}

#d52 {
  border-bottom: 2px solid white;
}

#d53 {
  border-bottom: 2px solid white;
}

#d54 {
  border-right: 2px solid white;
  border-bottom: 2px solid white;
}

#d55 {
  border-left: 2px solid white;
} 


#d57 {
  border-right: 2px solid white;
}

#d60 {
  border-right: 2px solid white;
}

#d63 {
  border-right: 2px solid white;
}

#d64 {
  border-left: 2px solid white;
}

#d66 {
  border-right: 2px solid white;
}

#d69 {
  border-right: 2px solid white;
}

#d72 {
  border-right: 2px solid white;
}

#d73 {
  border-left: 2px solid white;
  border-bottom: 2px solid white;
}

#d74 {
  border-bottom: 2px solid white;
}

#d75 {
  border-right: 2px solid white;
  border-bottom: 2px solid white;
}

#d76 {
  border-bottom: 2px solid white;
}

#d77 {
  border-bottom: 2px solid white;
}

#d78 {
  border-right: 2px solid white;
  border-bottom: 2px solid white;
}

#d79 {
  border-bottom: 2px solid white;
}

#d80 {
  border-bottom: 2px solid white;
}

#d81 {
  border-right: 2px solid white;
  border-bottom: 2px solid white;
}