*{ font-family: 'Yanone Kaffeesatz', 'Corbel', Arial, 'Arial Unicode MS', Helvetica, Sans-Serif; margin: 0px; padding: 0px; letter-spacing: 0.1em} 
html {width: 100%; height: 100%; margin: 0px; padding: 0px;}
body {width:100%; height:100%; margin: 0px; padding: 0px; background: rgba(35, 35, 35, 1);}

.bg {position:fixed; top: 0; left: 0; width: 100%; height: 100%; background:-webkit-linear-gradient(bottom, rgba(148, 37, 18, 0.2), rgba(148, 37, 18, 0.2)),url(../img/homepage/bg.jpg); background:linear-gradient(0deg, rgba(148, 37, 18, 0.2), rgba(148, 37, 18, 0.2)),url(../img/homepage/bg.jpg); background-size: cover; background-repeat:no-repeat; background-position: center center; z-index: -1;}

#modalContent{z-index: 100; }

/*#header {background: rgba(148, 37, 18, 1);}*/
#header {position: fixed; top: 0px; left: 0px; width: 100%; text-align: center; z-index: 10; color: rgb(255, 255, 255); font-size: 1.1em}
#header > a {text-decoration: none; color: rgb(255, 255, 255);}

#dropbtn {background-color: rgba(148, 37, 18, 0); color: white; padding: 5px; border: none; cursor: pointer; z-index: 20;font-size: 1.1em}
#dropdown {position: fixed; top: 0px; right: 5px; z-index: 20;}
#dropdown-content {display: none; position: absolute; background-color: #f9f9f9; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 20;}
#dropdown-content a {color: black; padding: 5px; text-decoration: none; display: block;}
#dropdown:hover #dropdown-content {display: block;}

#content {max-width: 100%; min-height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center}

#footer {position: fixed; bottom: 0px; left: 0px; width: 100%; background-color: #3b3b3b; opacity: 0.9; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; z-index: 10; color: #ffffff; text-align: center}
#footer > a {text-decoration: none; font-size: 0.8em; font-weight: bold; color: #ffffff; margin: 0px 10px}

#containerPrez {background: rgba(35, 35, 35, 0.7); z-index:2; padding: 0px 20px; margin-top: 40px; z-index: 10; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
#prezWidth {width: 420px}

#socialLinks{display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-pack: distribute; justify-content: space-around; padding: 10px 0px 10px 0px}
#socialIMG{width: 35px}

#prez {text-align: justify; color: rgb(255,255,255); font-size: 1.4em; font-weight:normal; border: 4px solid rgb(255,255,255); padding: 10px; line-height: 2em}
#prezHighlight {color: rgb(242, 140, 44); font-weight:bold}

#filter {display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; color: rgb(255, 255, 255); font-weight: bold; font-size: 1.3em; padding: 10px 0px 0px 0px}

.filterContent {z-index: 10; overflow:hidden; width:100%; display:block; background-color: rgba(35, 35, 35, 0.7);}
.filterContent > div {overflow:hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; margin-top: 10px}
#closeFilter {color: white; font-size:2em; font-weight: bold; text-decoration: none; display: none; -ms-flex-item-align: end; align-self: flex-end}

.Htreg {display: inline-block; width: 300px; vertical-align: top; margin: 15px; color: rgb(255,255,255); text-align: center; border-radius: 10px}
.Htreg > a img { width: 300px; border-radius: 10px}
.Htreg > img { width: 200px}
.Htreg > div {width: 100%; height: 150px}
.Htreg > div > a {color: rgb(242, 140, 44);font-weight:bold}


#modalBG { display: none; position: fixed; z-index: 100; left: 0; top: 0; width: 100%; height: 100%; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.6); -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center }
#modalWindow { background-color: #fefefe; padding: 20px; max-width:70%; max-height: 70%; overflow-y: auto; border-radius: 10px}
#closeModal { color: #aaaaaa; font-size: 28px; font-weight: bold; text-decoration: none}
#closeModal:hover {cursor: pointer}

.field-wrapper {display: block; position: relative; outline: none; padding: 20px 0px 5px 5px}
.field-wrapper.focused label {-webkit-transition: all .2s linear;transition: all .2s linear; top: 2px; font-weight: bold; font-size: 0.9em; background: rgba(0, 0, 0, 0); padding: 0px} 
label {position: relative; white-space: nowrap; overflow: hidden; font-size: 1em; position: absolute; top: 20px; display: inline-block; line-height: 1.2em; -webkit-transition: all .2s linear; transition: all .2s linear; text-transform: capitalize;background: #ffffff; padding: 2px 50px 2px 2px; margin: 4px 0px 0px 3px; }
input[type="text"], input[type="email"], input[type="date"], input[type="number"], input[type="password"], input[type="color"], textarea, select {padding: 5px; width: 300px; border: 1px solid #b5b5b5; font-size:1.1em}
input[type="date"]{font-size:0.8em; background:#fff}
select{width: 310px; background:#fff}
input[type="submit"] {padding: 10px; border: 1px solid #b5b5b5; width: 200px}

.break {-ms-flex-preferred-size: 100%;flex-basis: 100%; height: 0;}
.break-column {-ms-flex-preferred-size: 100%;flex-basis: 100%; width: 0;}

#form{display:-webkit-box;display:-ms-flexbox;display:flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 800px}

@media (max-width: 576px) {  
	#header {font-size: 0.8em}
	#prezWidth {width: 100%;}
	#filter {font-size: 1.1em;}
	#modalWindow {width: 100%; max-width: 100%}
}

::-webkit-scrollbar { width: 15px; }
::-webkit-scrollbar-track { border-radius: 10px; }
::-webkit-scrollbar-thumb { background: #404040; border-radius: 10px; }