/*********************/
/* DESKTOP           */
/*********************/

/* EVERYWHERE        */

#logo {
	display: flex;
	max-width: 50%;
	align-items: center;
	justify-content: left;
}

div#margin-wrapper {
	margin: 0 95px;
}

div#header {
	display: flex;
	justify-content: space-between;
	padding: 5px 25px;
	margin-top: 10px;
	margin-bottom: 50px;
	border-bottom: 2px solid #337ab7;
	flex-wrap: wrap;
}

#menu{
	width: 50%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	page-break-after: always;
	break-after: always;
}

div#help, div#contact, div#survey, div#donate, div#discord{
	cursor: pointer;
	margin: 0px 10px;
	width: 50px;
	height: 50%;
	position: relative;
}

div#discord{
	width: 125px;
}

#logo img, #discord img{
	max-width: 100%;
}

#help span{
	color: #337ab7;
	font-size: 2em;
}

#survey span{
	color: #337ab7;
	font-size: 2.5em;
	cursor: pointer;
}

#contact img, #help img, #donate img {
	position:absolute;
	left:0;
	width: 50px;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}

#contact img.transparent {
	opacity:0;
}

div#footer{
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	position: relative;
	margin-top: 20px;
}

#footer img {
	cursor: pointer;
}

#footer form{
	width: auto;
	margin: 0;
}

.coinLogo{
	margin: 10px 15px;
}

.address{
	word-wrap: break-word;
}

/****Survey Modal****/
#surveyModal .control-label{
	text-align: right;
	font-weight: bold;
}

#surveyModal .row{
	transition:background-color 1s ease;
	background-color: transparent;
}

#surveyModal .error{
	background-color: rgba(220, 53, 69, 0.7);
}

#surveyModal input[type='checkbox'],
#surveyModal input[type='radio'] {
  display: inline;
  margin-right: 10px;
  font-size: 16px;
}

/* INDEX             */

form {
	width: 40%;
	margin: auto;
}

button#submit, #list {
	width: 100%;
}

#nnImg{
	width: 50%;
	margin: 15px auto;
	display: block;
}

/* RESULTS           */

#results-header {
	display: flex;
	margin-top: 10px;
	padding: 5px 25px;
	border-bottom: 2px solid #337ab7;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

#header-form {
	width: 50%;
	margin: 10px auto;
	display: flex;
	align-items: center;
	justify-content: space-around;
}

#header-form > .form-group {
	margin-bottom: 0 !important;
}

/*********************/
/* MOBILE            */
/*********************/
@media only screen and (min-device-width: 320px) and (max-device-width: 800px) {

	/* EVERYWHERE        */
	#logo {
		display: block;
		text-align: center;
	}
	
	#menu {
		align-items: start;
	}
	
	#help span{
		font-size: 1em;
	}

	#contact span{
		font-size: 1.5em;
	}

	#survey span{
		font-size: 1.5em;
	}
	
	#surveyModal .control-label {
		text-align: center;
	}

	/* INDEX             */
	#logo > img {
		width: 100%;
	}

	#search{
		width: 80%;
		text-align: center;
	}
	/* RESULTS           */
	#results-header {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin-top:5px;
		border-bottom: 2px solid #337ab7;
	}

	#results-header #logo > img {
		width: 50%;
	}

	#header-form {
		width: 100%;
		margin-bottom: 5px;
	}

	#header-form .form-group {
		margin: 0;
	}

	#header-form .form-control {
		width: 100%;
	}

	#contact {
		width: 100%;
		text-align: center;
	}

	#margin-wrapper {
		margin: 0 15px !important;
	}

	#margin-wrapper #manufacturer {
		text-align: center;
	}

	table#results {
	    width: 100% !important;
	}
}

/*********************/
/* NOT MOBILE        */
/*********************/
@media only screen and (min-width: 768px) {
  .table-responsive {
    overflow-x: hidden;
    width: 99%;
    padding: 5px;
  }
}

/********************/
/*PULSING CSS       */
/********************/
@-webkit-keyframes pulse {
    0% { -webkit-transform: scale(0.9); opacity: 0.7; }
    50% { -webkit-transform: scale(1); opacity: 1; }
    100% { -webkit-transform: scale(0.9); opacity: 0.7; }
}

@-moz-keyframes pulse {
    0% { transform: scale(0.9); opacity: 0.7; }
    50% { transform: scale(1); opacity: 1; }
    100% { transform: scale(0.9); opacity: 0.7; }
}

@keyframes pulse {
    0% { transform: scale(0.9); opacity: 0.7; }
    50% { transform: scale(1); opacity: 1; }
    100% { transform: scale(0.9); opacity: 0.7; }
}