/* CSS Created by SoFoDev */

* {

	color: #3391ff;

	background-color:#131415;

}



h1 {

	color: #3391ff;

	text-align: center;		

}



b {

	color: #3391ff;

	text-align: center;

	margin: 4px 20px;

	margin-left: 35%;

}



input[type=text] {

	text-align: center;

}



input[type=text] {

	border: 1px solid #757575;

	background-color: #3f3f40;

	color:white;

	padding: 6px 6px;

	margin: 2px 20px;

	margin-left: 35%;

}



input[type=text]:focus {

	border: 1px solid #757575;

	background-color: #383839;

    outline: none;

	color:white;

	padding: 6px 6px;

	margin: 2px 20px;

	margin-left: 35%;

}



button {

	background-color: #3f3f40;

	border: none;

	color: white;

	padding: 16px 32px;

	text-decoration: none;

	margin: 4px 20px;

	cursor: pointer;

	margin-left: 35%;

}



button:focus {

	background-color: #383839;

    outline: none;

}



::selection {

  color: #fff;

  background: #3391ff;

}



body {

  font-family: Roboto, 'Segoe UI', Tahoma, sans-serif;

  font-size: 81.25%;

}



/* Create a custom checkbox */

#BigImage {

  height: 20px;

  width: 20px;

  background-color: #3f3f40;

}



/* On mouse-over, add a grey background color */

input[type=checkmark]:hover ~ #BigImage {

  background-color: #3f3f40;

}



/* When the checkbox is checked, add a blue background */

input[type=checkmark]:checked ~ #BigImage {

  background-color: #2196F3;

}



/* Create the checkmark/indicator (hidden when not checked) */

#BigImage:after {

  content: "";

  position: absolute;

  display: none;

}



/* Show the checkmark when checked */

input[type=checkmark]:checked ~ #BigImage:after {

  display: block;

}



/* Style the checkmark/indicator */

.container #BigImage:after {

  left: 9px;

  top: 5px;

  width: 5px;

  height: 10px;

  border: solid #3f3f40;

  border-width: 0 3px 3px 0;

  -webkit-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  transform: rotate(45deg);

}