@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Ubuntu');
@import url("https://fonts.googleapis.com/css?family=Open+Sans:700");
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");

* {
	font-family: FontAwesome, 'Ubuntu', sans-serif;
}
body {
	background: url(../img/bground.jpg) no-repeat fixed;
    background-position: center;
    background-size: cover;
}
body {
	margin: 0;
	padding: 0;
	margin-top: 25px;
}


.box-header {
background: #03aa51;
box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
padding: 5px 5px;
width: 90%;
color: #fff;
margin: -40px auto;
margin-bottom: -40px;
margin-bottom: 40px;
border-radius: 5px;
}
#mainlayer {
	position: relative;
	width: 1021px;
	text-align: left;
}
#produktnavigation {
	position: absolute;
	top: 30px;
	text-align: left;
	left: 392px;
	border-radius: 6px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	background: #ffffffe6;
}
header {
	min-height: 180px;
}
#bestellschein h2 {
	margin-left: 10px;
	margin-top: 10px;
}
h2 {
	font-size: 24px;
	text-shadow: -1px 1px 4px rgba(0, 0, 0, 0.33), 1px -1px 0px rgba(235, 235, 235, 0.8), 2px -2px 0px rgba(215, 215, 215, 0.3), -1px 1px 0px rgba(160, 160, 160, 0.4), -2px 2px 0px rgba(190, 190, 190, 0.4), -3px 3px 0px rgba(200, 200, 200, 1);
	text-align: center;
}/*, -4px 4px 0px rgba(165, 165, 165, 1), -5px 5px 0px rgba(130, 130, 130, 1), -2px 2px 6px rgba(0, 0, 0, 0.2), -2px 2px 9px rgba(0, 0, 0, 0.2), -2px 2px 10px rgba(0, 0, 0, 0.1), -3px 4px 10px rgba(0, 0, 0, 1)*/
h3 {
	text-align: center;
}
#centerlayer {
	width: 960px;
	margin: 0 auto;
	text-align: center;
}
#content {
	margin-top: 65px;
	z-index: 1;
}
.the_content {
    padding: 20px 0;
    border-bottom: 1px solid #ccc;
    display: inline-block;
    width: 100%;
}
#content {
	width: 960px;
	min-height: 1100px;
	border-radius: 6px;
	/*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
}
.bildbox {
	position: absolute;
	top: 10px;
	left: 100px;
}
.bildbox {
	display: none;
}
#wraps {
	position: relative;
}
.box {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	background-color: #fff6;
	padding: 10px;
	width: 95%;
	border-radius: 8px;
	margin-top: 50px;
}
.box h2 {
	font-size: 1em;
}
.button {
	font-family: 'Kelly Slab', Georgia, serif;
	height: 2em;
	padding: 0px 5px;
	margin: 15px 15px;
	cursor: pointer;
	display: inline-block;
	color: #FFF;
	font-size: 1em;
	border: 1px solid #eee;
	background: #eee;
	border-radius: 4px;
	line-height: 2em;
	border: 1px solid #aaa;
	text-decoration: none;
	-webkit-transition: all 0.3s linear;
	-khtml-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	transition: all 0.3s linear;
}
.button:hover {
	-webkit-box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
	-khtml-box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
	-moz-box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
	-o-box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
	box-shadow: rgba(0,0,0,0.7) 0px 5px 15px, inset rgba(0,0,0,0.15) 0px -10px 20px;
}
.button:active {
	-webkit-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
	-khtml-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
	-moz-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
	-o-box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
	box-shadow: rgba(255,255,255,0.25) 0px 1px 0px, inset rgba(255,255,255,0.03) 0px 20px 0px, inset rgba(0,0,0,0.15) 0px -20px 20px, inset rgba(255,255,255,0.05) 0px 20px 20px;
	text-shadow: 1px 1px 1px #eee;
}
/***********************************************************************
 * 	Black Background
 **********************************************************************/
.black {
	background: #7d7e7d; /* Old browsers */
	background: -moz-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7d7e7d), color-stop(100%, #0e0e0e)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* IE10+ */
	background: linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* W3C */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e', GradientType=0 ); /* IE6-9 */
}
#mainnavigation {
	position: absolute;
	top: -63px;
	left: 100px;
	width: 760px;
	height: 60px;
	z-index: 0;
}
#designhelper {
	position: absolute;
	top: 0;
	left: 99px;
	width: 770px;
	height: 20px;
	z-index: 1;
}
#topping {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 30px;
}
img {
	border: 0;
}
.inner {
	padding: 10px;
	width: 580px;
	margin: 15px;
    background: #fcfbfbb3;
    border-radius: 8px;
    border: 5px solid #fff;
}
iframe {
	
	width: 95%;
	height: 500px;
}
.inner2 {
	padding: 50px;
	width: 570px;
}
.inner h2 {
	padding-left: 20px;
	text-transform: uppercase;
}
#mainnavigation a {/*float:left;padding-top:7px;padding-left: 70px;*/
}
.circle {
	background: #fff;
	border-radius: 1em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	color: #000;
	display: inline-block;
	font-weight: bold;
	line-height: 2em;
	margin-right: 5px;
	text-align: center;
	width: 2em;
	border: 1px solid #104002;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
#produktnavigation ul {
	float: left;
	margin: 0;
	padding: 0;
	margin: 12px 0 0;
	padding: 10px 0 0 40px;
	width: 150px;
}
#produktnavigation li {
	line-height: 20px;
}
.sidebox {
	width: 315px;
	border-radius: 8px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	background-color: #ffffffe6;
}
.sidebox h2 {
	padding-top: 30px;
}
.info {
	min-height: 40px;
	font-size: 12px;
	padding-left: 24px;
	padding-bottom: 30px;
}
.info dt {
	margin: 0;
	padding: 0;
	float: left;
	width: 110px;
}
.info dl {
	margin: 0;
	padding: 0;
	clear: left;
}
#d_liefergebiet {
	width: 95%;/* min-height:500px;*/
}
#d_liefergebiet dl {
	margin: 0;
	padding: 0;
	min-height: 500px;
	padding-left: 40px;
	padding-top: 20px;
}
#footer {
	position: relative;
	width: 960px;
	height: 40px;
	margin-bottom: 8px;
	text-align: center;
}
.footerinner {
	position: absolute;
	top: 0;
	height: 40px;
	z-index: 0;
}/*left:180px;width:600px;*/
#footer dt {
	float: left;
	padding-left: 40px;
}
.copy {
	margin-bottom: 20px;
	font-size: 11px;
	display: block;
}
#mainnavigation a, #navigation a, #footer a {
	transition: color 1s ease-out 0s;
}
#produktnavigation ul a {
	width: 145px;
	padding: 4px;
	cursor: pointer;
}
#contenttable {
	width: 580px;
	min-height: 500px;
}
#contenttable .tb {
	height: 27px;
	padding: 0 8px;
}
.t_bestellschein, .t_bestellschein2 {
	width: 90%;
}
.t_bestellschein a {
	cursor: pointer;
}
.t_bestellschein a.z_btn {
	padding: 0;
}
.t_bestellschein .hidden {
	border: none;
	font-size: 1px;
}
.cl {
	clear: left;
}
table.p_details, table.p_details tr, table.p_details td {
	border: 0;
	border-collapse: collapse;
	empty-cells: hide;
	margin: 0;
	padding: 0;
}
table.p_details {
	width: 580px;
	text-align: left;
	vertical-align: top;
}
table.p_details td {
	padding: 10px 8px;
	vertical-align: top;
}
table.p_details .th td {
	padding: 0 8px;
	height: 27px;
	line-height: 26px;
}
table.p_details a {
	cursor: pointer;
}
table.p_details a:hover b {
	transition: background 2s ease-out 0s;
}
table.p_details a:hover b {
	transition: color 1s ease-out 0s;
}
table.p_details a b {
	padding: 2px;
}
table.p_details textarea {
	width: 520px;
}
#rightlayer {
	position: absolute;
	top: 290px;
	right: 85px;
	width: 315px;
	min-height: 600px;
	z-index: 2;
}
#rightlayerstartseite {
	position: absolute;
	top: 615px;
	right: 85px;
	width: 315px;
	min-height: 600px;
	z-index: 2;
}
#bestellschein {
	width: 315px;
	min-height: 200px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	background-color: #ffffffe6;;
}
#bestellschein {
	border-radius: 8px 8px 8px 8px;
    /*position: fixed;
    left: 150px;*/
}
#mainlayer table {
	width: 95%
}
.hinweis_o_spk {
	color: red;
	max-width: 480px;
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 6px 20px;
    font-size: 18px;
font-weight: bold;
text-shadow: -1px 1px 4px rgba(0, 0, 0, 0.33), 1px -1px 0px rgba(235, 235, 235, 0.8), 2px -2px 0px rgba(215, 215, 215, 0.3), -1px 1px 0px rgba(160, 160, 160, 0.4), -2px 2px 0px rgba(190, 190, 190, 0.4), -3px 3px 0px rgba(200, 200, 200, 1);
}
.p_details .desc_e {
	display: none;
}
.p_details .desc_e {
	color: #F53900;
}
.buttonbx {
	border: 1px solid #666;
	cursor: pointer;
	margin: 5px auto 0;
	padding: 5px;
	text-align: center;
	text-decoration: none;
	width: 140px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	background: #20c167;
	background-image: none;
	background-image: -moz-linear-gradient(top, #20c167, #157f44);
	background-image: -o-linear-gradient(top, #20c167, #157f44);
	background-image: -webkit-gradient(linear, center top, center bottom, from(#20c167), to(#157f44));
	background-image: linear-gradient(top, #20c167, #157f44);
	border-radius: 15px;
	color: #FFF;
	font-size: 1.5em;
	font-weight: bold;
	text-shadow: -1px -1px 0 #444;
}
.decline {
	border: 1px solid #666;
	cursor: pointer;
	margin: 5px auto 0;
	padding: 5px;
	text-align: center;
	text-decoration: none;
	width: 120px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	background: #ad232e;
	background-image: none;
	background-image: -moz-linear-gradient(top, #ff3443, #ad232e);
	background-image: -o-linear-gradient(top, #ff3443, #ad232e);
	background-image: -webkit-gradient(linear, center top, center bottom, from(#ff3443), to(#ad232e));
	background-image: linear-gradient(top, #ff3443, #ad232e);
	border-radius: 15px;
	color: #FFF;
	font-size: 1.5em;
	font-weight: bold;
	text-shadow: -1px -1px 0 #444;
}
.input_login {
	background: #f8f8f8 url(../img/login-sprite.png) no-repeat;
	padding: 15px 15px 15px 30px;
	margin: 0 0 10px 0;
	width: 353px;
	border: 1px solid #ccc;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
	-webkit-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
	box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
}
.username {
	background-position: 5px -2px !important;
}
.passwort {
	background-position: 5px -52px !important;
}
.pure-css-select-style {
	width: 99%;
	overflow: hidden;
}
.pure-css-select-style select {
	width: 100%;
	padding-right: 32px;
	border: none;
	box-shadow: none;
	background: transparent;
	background-image: none;
	-webkit-appearance: none;
	outline: none;
	cursor: pointer;
	/* Hide arrow on FF */
	-moz-appearance: none;
	text-indent: 0.01px;
	text-overflow: '';
}
/* Hide arrow on IE10*/
.pure-css-select-style select::-ms-expand {
 display: none;
}
/* IE9: To hide select arrow we make the select overflow on the right side there is not another way :( */
@media screen and (min-width:0\0) {
 .pure-css-select-style select {
 width: 130%;
}
}
/* Themes default ----------------------------------------------------------- */
.theme-default {
	border: 1px solid #bbb;
	border-radius: 2px;
	/* <svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 11 11"><path d="M4.33 8.5L0 1L8.66 1z" fill="#666"/></svg> */
	background: #fff url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%2211%22%20viewBox%3D%220%200%2011%2011%22%3E%3Cpath%20d%3D%22M4.33%208.5L0%201L8.66%201z%22%20fill%3D%22%23666%22%2F%3E%3C%2Fsvg%3E') right 10px center no-repeat;
}
.theme-default select {
	padding: 12px 32px 12px 8px;
	/* You can style text of the active select option */
	font: 400 18px/1 'Open Sans', sans-serif;
	color: #666;
}
/* Theme default with line -------------------------------------------------- */
.theme-default-w-line {
	position: relative;
	border: 1px solid #bbb;
	border-radius: 2px;
	/* <svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 11 11"><path d="M4.33 8.5L0 1L8.66 1z" fill="#666"/></svg> */
	background: #fff url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%2211%22%20viewBox%3D%220%200%2011%2011%22%3E%3Cpath%20d%3D%22M4.33%208.5L0%201L8.66%201z%22%20fill%3D%22%23666%22%2F%3E%3C%2Fsvg%3E') right 13px center no-repeat;
}
.theme-default-w-line:after {
	content: '';
	position: absolute;
	width: 1px;
	top: 0;
	bottom: 0;
	right: 40px;
	border-left: 1px solid #bbb;
}
.theme-default-w-line select {
	padding: 12px 40px 12px 8px;
	font: 400 18px/1 'Open Sans', sans-serif;
	color: #666;
}
/* Square ------------------------------------------------------------------- */
.theme-square {
	border: 3px solid #27ae60;
	/* <svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 11 11"><path d="M4.33 8.5L0 1L8.66 1z" fill="#27ae60"/></svg> */
	background: #fff url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%2211%22%20viewBox%3D%220%200%2011%2011%22%3E%3Cpath%20d%3D%22M4.33%208.5L0%201L8.66%201z%22%20fill%3D%22%2327ae60%22%2F%3E%3C%2Fsvg%3E') right 10px center no-repeat;
}
.theme-square select {
	padding: 12px 32px 12px 12px;
	/* You can style text of the active select option */
	font: 700 16px/1 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #27ae60;
}
/* Rounded ------------------------------------------------------------------ */
.theme-rounded {
	border: 2px solid #2980b9;
	border-radius: 50px;
	/* <svg xmlns="http://www.w3.org/2000/svg" width="18" height="22" viewBox="0 0 18 22"><path d="M9 17L2.07 5L15.93 5z" stroke-width="2" stroke="#2980b9" fill="transparent"/></svg> */
	background: #fff url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%3E%3Cpath%20d%3D%22M9%2017L2.07%205L15.93%205z%22%20stroke-width%3D%222%22%20stroke%3D%22%232980b9%22%20fill%3D%22transparent%22%2F%3E%3C%2Fsvg%3E') right 14px center no-repeat;
}
.theme-rounded select {
	padding: 12px 32px 12px 16px;
	font: 400 16px/1 'Montserrat', sans-serif;
	letter-spacing: 2px;
	color: #2980b9;
}
/* Rounded and filled ------------------------------------------------------- */
.theme-filled {
	border-radius: 50px;
	/* <svg xmlns="http://www.w3.org/2000/svg" width="18" height="22" viewBox="0 0 18 22"><path d="M9 17L2.07 5L15.93 5z" fill="#fff"/></svg> */
	background: #2980b9 url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%3E%3Cpath%20d%3D%22M9%2017L2.07%205L15.93%205z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E') right 14px center no-repeat;
	box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.25);
}
.theme-filled select {
	padding: 12px 32px 12px 16px;
	font: 400 16px/1 'Montserrat', sans-serif;
	letter-spacing: 2px;
	color: #fff;
}
.theme-filled select option {
	color: #333;
}
/* Background gradient ------------------------------------------------------ */
.theme-gradient {
	border: 1px solid #ccc;
	border-radius: 2px;
 #ecf0f1  #bdc3c7  background-color: #ecf0f1;
	/* <svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 11 11"><path d="M4.33 8.5L0 1L8.66 1z" fill="#666"/></svg> */
	background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%2211%22%20viewBox%3D%220%200%2011%2011%22%3E%3Cpath%20d%3D%22M4.33%208.5L0%201L8.66%201z%22%20fill%3D%22%23666%22%2F%3E%3C%2Fsvg%3E');
	background-position: right 10px center;
	background-repeat: no-repeat, repeat;
	background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%2211%22%20viewBox%3D%220%200%2011%2011%22%3E%3Cpath%20d%3D%22M4.33%208.5L0%201L8.66%201z%22%20fill%3D%22%23666%22%2F%3E%3C%2Fsvg%3E'), linear-gradient(#ecf0f1, #bdc3c7); /* W3C */
}
.theme-gradient select {
	padding: 12px 32px 12px 16px;
	font: 700 14px/1 'Open Sans', sans-serif;
	letter-spacing: 2px;
	color: #666;
}

/*FIRE AND EVENTS*/


 
    .row{width: 580px;}
    .event-list {
		list-style: none;
		font-family: 'Lato', sans-serif;
		margin: 0px;
		padding: 0px 0px 0px 20px;
	}
	.event-list > li {
		/*background-color: rgb(255, 255, 255);*/
		box-shadow: 4px 4px 8px rgba(51, 51, 51, 0.7);
		padding: 0px;
		margin: 0px 0px 20px;
	}
    .event-list > li:hover {
		/*background-color: rgb(255, 255, 255);*/
		box-shadow: 0px 0px 0px transparent;
		padding: 0px;
		margin: 0px 0px 20px;
	}
	.event-list > li > time {
		display: inline-block;
		width: 100%;
		color: rgb(255, 255, 255);
		background-color: rgb(197, 44, 102);
		padding: 5px;
		text-align: center;
		text-transform: uppercase;
	}
	.event-list > li:nth-child(even) > time {
		background-color: rgb(165, 82, 167);
	}
	.event-list > li > time > span {
		display: none;
	}
	.event-list > li > time > .day {
		display: block;
		font-size: 40pt;
		font-weight: 100;
		line-height: 1;
        margin-top: 25px;
        text-shadow: -1px 1px 4px rgb(0, 0, 0);
	}
	.event-list > li time > .month {
		display: block;
		font-size: 24pt;
		font-weight: 900;
		line-height: 1;
	}
	.event-list > li > img {
		width: 100%;
	}
	.event-list > li > .info {
		padding-top: 5px;
		text-align: center;
	}
	.event-list > li > .info > .title {
		font-size: 12pt;
		font-weight: 600;
		margin: 0px;
        text-shadow: -1px 1px 4px rgba(0, 0, 0, 0.33);
	}
	.event-list > li > .info > .desc {
		font-size: 10pt;
		font-weight: 600;
		margin: 0px;
	}
    .event-list > li > .info > .desc! {
		font-size: 8pt;
		font-weight: 600;
        color: red,
		margin: 0px;
	}
	.event-list > li > .info > ul,
	.event-list > li > .social > ul {
		display: table;
		list-style: none;
		margin: 10px 0px 0px;
		padding: 0px;
		width: 100%;
		text-align: center;
	}
	.event-list > li > .social > ul {
		margin: 0px;
	}
	.event-list > li > .info > ul > li,
	.event-list > li > .social > ul > li {
		display: table-cell;
		cursor: pointer;
		color: rgb(30, 30, 30);
		font-size: 11pt;
		font-weight: 300;
        padding: 3px 0px;
	}
    .event-list > li > .info > ul > li > a {
		display: block;
		width: 100%;
		color: rgb(30, 30, 30);
		text-decoration: none;
	} 
    .event-list > li > .info > ul > li > a:hover {
		/*display: block;
		width: 100%;
		color: rgb(30, 30, 30);
		text-decoration: none;*/
        background-color: red;
        color: #fff;
        border: 1px solid #fff;
	}     
    .event-list > li > .social > ul > li {    
        padding: 0px;
    }
    .event-list > li > .social > ul > li > a {
        padding: 3px 0px;
	} 
	.event-list > li > .info > ul > li:hover,
	.event-list > li > .social > ul > li:hover {
		color: rgb(30, 30, 30);
		/*background-color: rgb(200, 200, 200);*/
	}
	.facebook a,
	.twitter a,
	.google-plus a {
		display: block;
		width: 100%;
		color: rgb(75, 110, 168) !important;
	}
	.twitter a {
		color: rgb(79, 213, 248) !important;
	}
	.google-plus a {
		color: rgb(221, 75, 57) !important;
	}
	.facebook:hover a {
		color: rgb(255, 255, 255) !important;
		background-color: rgb(75, 110, 168) !important;
	}
	.twitter:hover a {
		color: rgb(255, 255, 255) !important;
		background-color: rgb(79, 213, 248) !important;
	}
	.google-plus:hover a {
		color: rgb(255, 255, 255) !important;
		background-color: rgb(221, 75, 57) !important;
	}

	@media (min-width: 768px) {
		.event-list > li {
			position: relative;
			display: block;
			width: 100%;
			height: 120px;
			padding: 0px;
		}
		.event-list > li > time,
		.event-list > li > img  {
			display: inline-block;
		}
		.event-list > li > time,
		.event-list > li > img {
			width: 120px;
			float: left;
		}
		.event-list > li > .info {
			background-color: rgb(245, 245, 245);
			overflow: hidden;
		}
		.event-list > li > time,
		.event-list > li > img {
			width: 120px;
			height: 120px;
			padding: 0px;
			margin: 0px;
		}
		.event-list > li > .info {
			position: relative;
			height: 120px;
			text-align: left;
			padding-right: 40px;
		}	
		.event-list > li > .info > .title, 
		.event-list > li > .info > .desc {
			padding: 0px 10px;
		}
		.event-list > li > .info > ul {
			position: absolute;
			left: 0px;
			bottom: 0px;
		}
		.event-list > li > .social {
			position: absolute;
			top: 0px;
			right: 0px;
			display: block;
			width: 40px;
		}
        .event-list > li > .social > ul {
            border-left: 1px solid rgb(230, 230, 230);
        }
		.event-list > li > .social > ul > li {			
			display: block;
            padding: 0px;
		}
		.event-list > li > .social > ul > li > a {
			display: block;
			width: 40px;
			padding: 10px 0px 9px;
		}
	}
        
        .fire {
  font-size: 24px;
  filter: blur(0.03em);
  -webkit-filter: blur(0.03em);
  /*margin: 3em auto 0 auto;*/
  position: relative;
  width: 10em;
  height: 9em;
}

.particle {
  animation: rise 1s ease-in infinite;
  background-image: radial-gradient(#ff5000 20%, rgba(255, 80, 0, 0) 70%);
  border-radius: 50%;
  mix-blend-mode: screen;
  opacity: 0;
  position: absolute;
  bottom: 0;
  width: 5em;
  height: 5em;
}
.particle:nth-of-type(1) {
  animation-delay: 0.5819676383s;
  left: calc((100% - 5em) * 0);
}
.particle:nth-of-type(2) {
  animation-delay: 0.7990621747s;
  left: calc((100% - 5em) * 0.02);
}
.particle:nth-of-type(3) {
  animation-delay: 0.6976708968s;
  left: calc((100% - 5em) * 0.04);
}
.particle:nth-of-type(4) {
  animation-delay: 0.5180495969s;
  left: calc((100% - 5em) * 0.06);
}
.particle:nth-of-type(5) {
  animation-delay: 0.5747438083s;
  left: calc((100% - 5em) * 0.08);
}
.particle:nth-of-type(6) {
  animation-delay: 0.5027819743s;
  left: calc((100% - 5em) * 0.1);
}
.particle:nth-of-type(7) {
  animation-delay: 0.1316587959s;
  left: calc((100% - 5em) * 0.12);
}
.particle:nth-of-type(8) {
  animation-delay: 0.5085287225s;
  left: calc((100% - 5em) * 0.14);
}
.particle:nth-of-type(9) {
  animation-delay: 0.598173261s;
  left: calc((100% - 5em) * 0.16);
}
.particle:nth-of-type(10) {
  animation-delay: 0.8622016642s;
  left: calc((100% - 5em) * 0.18);
}
.particle:nth-of-type(11) {
  animation-delay: 0.7165180489s;
  left: calc((100% - 5em) * 0.2);
}
.particle:nth-of-type(12) {
  animation-delay: 0.053225644s;
  left: calc((100% - 5em) * 0.22);
}
.particle:nth-of-type(13) {
  animation-delay: 0.7090031588s;
  left: calc((100% - 5em) * 0.24);
}
.particle:nth-of-type(14) {
  animation-delay: 0.5276562207s;
  left: calc((100% - 5em) * 0.26);
}
.particle:nth-of-type(15) {
  animation-delay: 0.8947642669s;
  left: calc((100% - 5em) * 0.28);
}
.particle:nth-of-type(16) {
  animation-delay: 0.3009349315s;
  left: calc((100% - 5em) * 0.3);
}
.particle:nth-of-type(17) {
  animation-delay: 0.503659083s;
  left: calc((100% - 5em) * 0.32);
}
.particle:nth-of-type(18) {
  animation-delay: 0.2490165266s;
  left: calc((100% - 5em) * 0.34);
}
.particle:nth-of-type(19) {
  animation-delay: 0.6333088375s;
  left: calc((100% - 5em) * 0.36);
}
.particle:nth-of-type(20) {
  animation-delay: 0.5190809977s;
  left: calc((100% - 5em) * 0.38);
}
.particle:nth-of-type(21) {
  animation-delay: 0.7308630938s;
  left: calc((100% - 5em) * 0.4);
}
.particle:nth-of-type(22) {
  animation-delay: 0.6055656775s;
  left: calc((100% - 5em) * 0.42);
}
.particle:nth-of-type(23) {
  animation-delay: 0.4545127244s;
  left: calc((100% - 5em) * 0.44);
}
.particle:nth-of-type(24) {
  animation-delay: 0.4172236495s;
  left: calc((100% - 5em) * 0.46);
}
.particle:nth-of-type(25) {
  animation-delay: 0.0727433626s;
  left: calc((100% - 5em) * 0.48);
}
.particle:nth-of-type(26) {
  animation-delay: 0.3946647699s;
  left: calc((100% - 5em) * 0.5);
}
.particle:nth-of-type(27) {
  animation-delay: 0.2638082419s;
  left: calc((100% - 5em) * 0.52);
}
.particle:nth-of-type(28) {
  animation-delay: 0.1675624995s;
  left: calc((100% - 5em) * 0.54);
}
.particle:nth-of-type(29) {
  animation-delay: 0.975867292s;
  left: calc((100% - 5em) * 0.56);
}
.particle:nth-of-type(30) {
  animation-delay: 0.2828060621s;
  left: calc((100% - 5em) * 0.58);
}
.particle:nth-of-type(31) {
  animation-delay: 0.8441935119s;
  left: calc((100% - 5em) * 0.6);
}
.particle:nth-of-type(32) {
  animation-delay: 0.3657778486s;
  left: calc((100% - 5em) * 0.62);
}
.particle:nth-of-type(33) {
  animation-delay: 0.9136766681s;
  left: calc((100% - 5em) * 0.64);
}
.particle:nth-of-type(34) {
  animation-delay: 0.7164651383s;
  left: calc((100% - 5em) * 0.66);
}
.particle:nth-of-type(35) {
  animation-delay: 0.3252338448s;
  left: calc((100% - 5em) * 0.68);
}
.particle:nth-of-type(36) {
  animation-delay: 0.2915701385s;
  left: calc((100% - 5em) * 0.7);
}
.particle:nth-of-type(37) {
  animation-delay: 0.3144883566s;
  left: calc((100% - 5em) * 0.72);
}
.particle:nth-of-type(38) {
  animation-delay: 0.8752925005s;
  left: calc((100% - 5em) * 0.74);
}
.particle:nth-of-type(39) {
  animation-delay: 0.8371342931s;
  left: calc((100% - 5em) * 0.76);
}
.particle:nth-of-type(40) {
  animation-delay: 0.9156055015s;
  left: calc((100% - 5em) * 0.78);
}
.particle:nth-of-type(41) {
  animation-delay: 0.1325353542s;
  left: calc((100% - 5em) * 0.8);
}
.particle:nth-of-type(42) {
  animation-delay: 0.7324387057s;
  left: calc((100% - 5em) * 0.82);
}
.particle:nth-of-type(43) {
  animation-delay: 0.50938097s;
  left: calc((100% - 5em) * 0.84);
}
.particle:nth-of-type(44) {
  animation-delay: 0.4453523511s;
  left: calc((100% - 5em) * 0.86);
}
.particle:nth-of-type(45) {
  animation-delay: 0.949458075s;
  left: calc((100% - 5em) * 0.88);
}
.particle:nth-of-type(46) {
  animation-delay: 0.8458283427s;
  left: calc((100% - 5em) * 0.9);
}
.particle:nth-of-type(47) {
  animation-delay: 0.5655791273s;
  left: calc((100% - 5em) * 0.92);
}
.particle:nth-of-type(48) {
  animation-delay: 0.8331608957s;
  left: calc((100% - 5em) * 0.94);
}
.particle:nth-of-type(49) {
  animation-delay: 0.3045955203s;
  left: calc((100% - 5em) * 0.96);
}
.particle:nth-of-type(50) {
  animation-delay: 0.4811107837s;
  left: calc((100% - 5em) * 0.98);
}

@keyframes rise {
  from {
    opacity: 0;
    transform: translateY(0) scale(1);
  }
  25% {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translateY(-10em) scale(0);
  }
}