:root{--nav_background_color:rgba(255,255,255,0.5);--nav_text_color:#202d68;--stress:#117fba;--content_width:1000px;--font-size:16px;--font-family:'Quicksand',sans-serif;}
input[type="radio"],input[type="checkbox"]{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;}
input[type="radio"] + label:before,input[type="checkbox"] + span:before{font-family:FontAwesome;display:inline-block;content:"\f1db";letter-spacing:10px;font-size:120%;color:#202d68;width:1.4em;margin-left:-24px;}
input[type="radio"]:checked + label:before{content:"\f13a";font-size:120%;color:#202d68;letter-spacing:5px;}
input[type="checkbox"]:checked + span:before{content:"\f00c";font-size:120%;color:#202d68;letter-spacing:5px;}
input[type="checkbox"] + span:before{content:"\f096";margin-left:-22px;}
input[type="checkbox"]:checked + span:before{content:"\f046";color:#202d68;}
input[type="radio"]:focus + label:before,input[type="checkbox"]:focus + span:before,input[type="radio"]:focus + label,input[type="checkbox"]:focus + span{color:var(--stress);}
*{outline:none;}
::-moz-focus-inner{border:0;}
input,textarea,button{background-color:white;color:#333;border:1px solid #BBB;border-radius:2px;}
button{cursor:pointer;}
textarea{resize:none;}
html,textarea,button{font-family:var(--font-family);font-size:var(--font-size);overflow-x:hidden;}
body{margin:0 auto;}
pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word;}
#overlay{position:fixed;display:flex;left:0;top:0;right:0;bottom:0;z-index:1000;overflow:hidden;background-color:rgba(0,0,0,0.8);justify-content:center;align-items:center;visibility:hidden;opacity:0;transition:visibility 0.5s ease-out,opacity 0.5s ease-out;}
.vis{opacity:1 !important;visibility:visible !important;}
#overlay-container{position:relative;width:80vw;max-width:800px;max-height:80vh;overflow-y:auto;background-color:white;border-radius:2px;padding:16px;font-size:100%;}
#overlay-close{position:absolute;font-size:32px;width:32px;color:#333;text-align:center;right:8px;top:4px;cursor:pointer;}
#overlay-changePassword{display:flex;flex-direction:column;}
#overlay-changePassword > span{margin-bottom:14px;}
#changePasswordButton{justify-content:center;flex-grow:100;}
.overlayButtonContainer > button,.overlayButtonContainer > div{flex-grow:1;margin:0 2px;border:1px solid rgba(128,128,128,0.5);box-shadow:none;}
#overlay-explanation{margin:8px 16px 16px 8px;padding:16px;}
#overlay-explanation > h1{margin:0;}
#explImg{margin-top:48px;width:100%;}
#overlay-report > textarea{margin-top:8px;width:calc(100% - 4px);}
#overlay-forgot > input{margin-top:8px;width:calc(100% - 18px);}
#overlay-forgot-error{margin-top:4px;}
nav{width:100%;text-align:center;background-color:var(--nav_background_color);font-size:120%;color:var(--nav_text_color);box-shadow:0px 0px 2px 0 black;z-index:117;position:relative;}
nav > .navContent{position:relative;width:calc(100% - 32px);max-width:var(--content_width);display:flex;justify-content:space-between;flex-wrap:wrap;align-items:stretch;margin:0 auto;}
nav .logo{margin-right:8px;//padding-left:8px;font-size:200%;z-index:10;cursor:pointer;}
nav .left{display:flex;align-items:center;flex-grow:99999;justify-content:left;}
nav .right{display:flex;flex-grow:1;justify-content:space-between;margin:4px;}
nav .navDes{font-size:100%;}
nav #navProfilButton{position:relative;display:flex;margin-right:16px;padding:0px;flex-wrap:wrap;width:36px;min-width:36px;max-width:36px;min-height:36px;max-height:36px;height:36px;align-self:center;background-color:var(--nav_text_color);border-radius:100%;justify-content:center;color:white;align-content:center;z-index:100;}
nav #navProfilButton > span{position:relative;display:flex;cursor:pointer;//margin:0 16px;padding:0px;font-size:140%;flex-wrap:wrap;width:36px;min-width:36px;max-width:36px;min-height:36px;max-height:36px;height:36px;align-self:center;border-radius:100%;justify-content:center;align-content:center;}
nav #navProfilMenu{position:absolute;display:flex;flex-wrap:wrap;top:50px;right:0;color:var(--nav_text_color);background-color:#FFF;border-radius:3px;padding:8px;box-shadow:0 0 3px 0 black;cursor:auto;width:100vw;max-width:300px;text-align:left;}
nav #navProfilMenu::after{content:" ";position:absolute;bottom:100%;right:8px;margin-left:-8px;border-width:10px;border-style:solid;border-color:transparent;border-bottom-color:white;}
nav #navProfilTop{width:100%;display:flex;border-bottom:1px solid #CCC;margin:4px;padding-bottom:8px;}
nav #navProfilFoto{width:90px;min-width:90px;height:90px;border-radius:100%;margin:0px;font-size:400%;color:white;display:flex;justify-content:center;align-items:center;}
nav #navProfilWelcome{margin-left:16px;display:flex;flex-direction:column;justify-content:center;}
nav #navProfilWelcome > span{}
nav #navMail{margin-top:8px;color:#888;font-size:80%;}
nav #navProfilMenu > button{flex-grow:1;padding:6px;margin:4px;}
nav .navBut{display:flex;cursor:pointer;margin:4px;padding:4px;background-color:rgba(255,255,255,0);box-shadow:0 0 25px 25px rgba(255,255,255,0);border-radius:20px;z-index:5;transition:all ease 0.4s,transform ease 0.05s;align-items:center;flex-wrap:wrap;justify-content:center;}
nav .navDes{position:relative;}
nav .navDes::after{position:absolute;content:" ";height:2px;right:0;left:0;transition:transform ease 0.2s,opacity ease 0.2s;bottom:-8px;opacity:0;}
nav .navBut:hover .navDes::after,nav .navBut:focus .navDes::after{transform:translateY(-4px);opacity:1;}
nav .navBut:hover,nav .navBut:focus{//background-color:rgba(0,0,0,0.5);//box-shadow:0 0 25px 25px rgba(0,0,0,0.5);//z-index:1;//color:white;//transform:scale(1.4);}
nav .navBut > .icon{padding-right:8px;position:relative;//transition:all linear 0.1s;}
nav .navBut:active{//transform:rotate(180deg);//transform:rotate3d(0,1,0,180deg);transform:scale(0.98);}
nav .icon{font-size:150%;}
header{position:relative;width:100%;background-color:#403F2F;margin:-13vw 0 -13vw 0;overflow:hidden;}
header img{position:relative;width:100%;vertical-align:bottom;margin-top:-10%;}
#explanationWrapper{position:absolute;top:0;right:0;bottom:0;left:0;}
#explanationContainer{width:calc(100% - 32px);max-width:var(--content_width);position:relative;height:100%;margin:0 auto;}
#pageExplanation{position:absolute;top:0;margin-top:13vw;bottom:0;padding-bottom:13vw;left:0;//padding-left:3vw;font-size:1.6vw;display:flex;align-items:center;flex-direction:row;font-weight:bold;color:var(--nav_text_color);background-color:rgba(255,255,255,0.5);box-shadow:0 0 64px 64px rgba(255,255,255,0.5);}
#pageExplanation ul{list-style:none;margin:0;padding:0;}
#pageExplanation li{margin-top:8px;}
#pageExplanation > .explanation{width:calc(454px - 9vw);}
#pageExplanation > .explanation > .big{font-size:140%;font-weight:bold;}
#explanationButton{margin:16px 0 0 0;padding:8px;border:thin solid var(--nav_text_color);border-radius:8px;background-color:white;color:var(--nav_text_color);font-weight:bold;font-size:1.6vw;;}
#headerFadeBottomContainer{position:relative;height:13vw;margin:0 0 -13vw 0;overflow:hidden;width:100%;}
#headerFadeBottom{width:calc(100% + 26vw);margin:0 -13vw 0 -13vw;box-shadow:inset 0px -3vw 2vw 0vw white;height:100%;}
#headerFadeTop{position:relative;height:13vw;margin:0 -13vw -3vw -13vw;width:calc(100% + 26vw);box-shadow:inset 0px 3vw 3vw 0vw white;z-index:2;}
#content{position:relative;transition:filter 0.5s ease-out;//overflow:hidden;border-radius:2px;max-width:var(--content_width);margin:0 auto 16px auto;background-color:white;padding:8px;//min-height:13vw;min-height:80vh;}
#contentShadow{position:relative;height:13vw;margin:0 auto -13vw auto;width:100%;max-width:calc(var(--content_width) + 16px);box-shadow:0 0 2px 0 black;border-radius:3px;}
.button{height:auto;text-align:center;text-decoration:none;cursor:pointer;user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;}
#explanationButton{cursor:pointer;transition:box-shadow ease 0.2s;}
#explanationButton:hover{box-shadow:0 0 2px 0 #0008;}
#explanationButton:active{box-shadow:inset 0 0 2px 0 #0008;}
@media all and (max-width:468px){#profileButton,#logoutButton{width:calc(100% - 8px) !important;}
}
#sortLabel{display:flex;flex-direction:column;align-items:center;width:28px;margin-top:10px;line-height:14px;font-weight:bold;color:#999;}
#sortLabel > i{margin-top:8px;}
.tooltipContainer{display:flex;justify-content:space-between;flex-grow:1;min-width:242px;}
.tooltipContainer > label{position:relative;cursor:pointer;}
.tooltipContainer > label > i{position:absolute;left:-28px;top:0px;font-size:100%;transition:transform ease 0.5s;}
.tooltipButton{position:relative;display:flex;justify-content:center;align-items:center;text-align:center;border:1px solid #AAA;padding:4px;border-radius:100%;color:#555;cursor:pointer;height:18px;width:18px;}
#registerForm .tooltip{width:200px;}
#list .tooltip{width:200px;}
.tooltip{visibility:hidden;color:#555;text-align:left;background-color:#FFF;border:1px solid #AAA;border-radius:2px;padding:8px;position:absolute;z-index:100;bottom:calc(100% + 8px);right:-1px;box-shadow:0 0 2px 0 #AAA;}
.tooltip::after{content:" ";position:absolute;top:100%;right:7px;margin-left:-6px;border-width:6px;border-style:solid;border-color:#AAA transparent transparent transparent;}
.tooltipButton:hover .tooltip,.tooltipButton:focus .tooltip{visibility:visible;}
.tooltip:hover{visibility:hidden !important;}
.fieldContainer{display:flex;//margin-left:8px;}
.field{display:flex;flex-wrap:wrap;text-align:left;margin-left:-2px;margin-right:-2px;margin-top:6px;margin-bottom:6px;}
.tooltipContainer,.mapsRegister,.field > input,.field > select,.field > textarea,.field > label,.field > span,.field > #regFamilyMemberButton,.field > .interestsContainer{margin:2px !important;}
#list .field{margin-right:16px;margin-left:28px;flex-grow:1;}
#degreeField .tooltipContainer label,#realmField .tooltipContainer label{margin-left:3px;}
.field label{display:flex;margin-top:5px;color:#555;}
#list .field label{flex-grow:1;align-items:center;}
.field > .dynInput{display:inline-flex;border:1px solid #AAA;border-radius:2px;width:160px;flex-grow:100;padding:3px 8px;}
.field > .slider{display:inline-flex;width:160px;flex-grow:1;margin:8px 0;}
.field #regFamilyMemberButton{display:inline-flex;width:160px;flex-grow:100;padding:0;flex-direction:column;justify-content:space-between;}
#familyMemberAdd{display:inline-flex;flex-grow:1;justify-content:space-between;flex-wrap:wrap;width:100%;}
#familyMemberRemove{display:inline-flex;flex-grow:1;justify-content:space-between;flex-wrap:wrap;}
#regDescriptionField > textarea{padding:8px;}
#registerForm{position:relative;}
#registerHead{margin:8px 8px 0 8px;}
.mapsContentRegister{margin:0 8px;}
#registerBody{margin:0 8px;}
#registerBody .memberButton{border:1px solid #c5c5c5;background-color:#f6f6f6;text-align:center;border-radius:2px;font-size:120%;display:flex;flex-grow:1;width:84px;}
.member{position:relative;border-radius:2px;border:1px solid rgba(128,128,128,0.5);padding:8px 8px 0 8px;margin-top:4px;width:100%;}
.member > i{font-size:140%;}
#registerBody .member .memberClose{display:block;padding:8px;position:absolute;right:0;top:0;cursor:pointer;}
select{padding-left:4px !important;padding-right:4px !important;background-color:white;}
#registerBody #familyMemberAdd .memberButton{flex-direction:row;justify-content:center;cursor:pointer;font-size:140%;color:#222;}
#registerBody #familyMemberAdd .memberButton i{margin:0 4px;padding:8px 0px;}
#registerBody #familyMemberAdd .memberButton .fa-plus{display:flex;align-items:center;transition:font-size 0.5s ease-in-out;}
#registerBody #familyMemberRemove .memberButton{flex-direction:column;margin-top:4px;}
#registerBody #familyMemberRemove .memberButton > i{cursor:pointer;padding:8px 0px;font-size:160%;color:#222;}
#registerBody .memberButton > input{text-align:center;flex-grow:1;border:none;margin:0;idth:100%;padding:4px 0;background-color:transparent;}
#registerBody .memberButton:hover{background-color:#ededed;}
#registerBody .memberButton:active{box-shadow:inset 0 0 4px 0 #CCC;}
#listcontainer .memberButton{border:1px solid #EEE;background-color:#f6f6f6;text-align:center;border-radius:2px;display:flex;flex-direction:column;flex-grow:1;width:60px;margin:2px;}
#listcontainer .memberButton > i{padding:8px 0px;width:100%;font-size:140%;}
#listcontainer .memberButton > span{text-align:center;flex-grow:1;border:none;margin:0;width:100%;padding:4px 0;background-color:transparent;}
#degreeField > .field > label,#realmField > .field > label{//margin-left:2px;}
#degreeField > .field,#realmField > .field{//margin-left:4px;}
.field > #degreeInput,.field > #realmInput{flex-direction:column;}
.checkLine{display:flex;align-items:center;margin:4px 0;cursor:pointer;}
.checkLine > span{display:flex;}
.checkLine > input{margin-left:-1px;margin-bottom:4px;margin-right:9px;margin-top:2px;width:20px;height:20px;}
#interestsField{display:flex;}
.interestsContainer{display:inline-flex;width:160px;flex-grow:100;flex-direction:column;}
#list .interestsContainer{padding-left:4px;}
.interestsContainerInputContainer > i{display:flex;align-items:center;padding:4px;border:1px solid rgba(128,128,128,0.5);border-top-right-radius:2px;border-bottom-right-radius:2px;cursor:pointer;background-color:#f6f6f6;width:16px;justify-content:center;}
.interestsContainerInputContainer > i:hover{background-color:#ededed;}
.interestsContainerInputContainer > i:active{box-shadow:inset 0 0 4px 0 #CCC;}
.interestsContainerInputContainer{display:flex;flex-grow:1;}
.interestsInput{padding:4px 8px;border:1px solid rgba(128,128,128,0.5);border-right:none;border-top-left-radius:2px;border-bottom-left-radius:2px;flex-grow:1;width:100px;}
#regInterestsList,#interestsList{display:flex;flex-wrap:wrap;margin:0px -2px;max-height:120px;overflow:auto;}
.interestsListElement{border:1px solid #ccc;background-color:#f6f6f6;padding:4px;border-radius:2px;margin:2px 2px 0px 2px;font-size:80%;}
.interestsListElement > i{margin-left:4px;cursor:pointer;}
.textHandle{width:2.0em !important;height:1.6em !important;top:50% !important;margin-top:-.8em;margin-left:-1em !important;text-align:center;line-height:1.6em;}
.fullSidebarVisible{width:100% !important;position:relative !important;padding:0 !important;padding-bottom:16px !important;}
.fullsidebar{position:relative !important;height:auto !important;width:100% !important;border:none !important;margin:0 !important;box-shadow:none !important;transform:translateX(0px) !important;}
#registerSaveButton{text-align:center;cursor:pointer;padding:8px;display:block;margin:8px 0 2px 0;}
#maps{max-width:var(--content_width);margin:0 auto;position:relative;width:100%;height:500px;max-height:80vh;text-align:center;}
.mapsRegister{border:1px solid rgba(128,128,128,0.5);border-radius:2px;flex-grow:100;min-width:245px;}
.smallMaps{height:120px;}
#map{height:100%;}
.mapbutton{background-color:white;border:none;margin:0;padding:9px;border-radius:2px;cursor:pointer;color:#555;border:1px solid #AAA;box-shadow:0 0 3px 0 #CCC;font-size:90%;height:12px;}
.mapbutton:hover,#registerButton:hover{color:#000 !important;background-color:#EEE !important;}
.mapbutton:focus{color:#000;}
.mapbutton:active{color:#000;background-color:#FFF;box-shadow:inset 0 0 3px 0 #CCC;}
.mapbutton:disabled{color:#CCC;}
.mainButton{background-color:white;border:1px solid rgba(128,128,128,0.5);margin:0;padding:8px;border-radius:2px;cursor:pointer;color:#666;font-size:90%;text-align:center;}
.mainButton:hover{color:#000;background-color:#EEE;}
.mainButton:focus{color:#000;}
#currentpos{position:absolute;z-index:5;top:10px;right:10px;}
#mapaddresscontainer{position:absolute;background-color:white;z-index:2;top:10px;right:51px;left:113px;border:1px solid #AAA;border-top-left-radius:2px;border-bottom-left-radius:2px;box-shadow:0 0 3px 0 #CCC;display:flex;padding:0px 8px;}
#mapaddress{position:relative;right:0;left:0;font-size:200%;font-weight:bold;color:#444;font-family:var(--font-family);width:calc(100% - 32px);border:none;}
#mapsearch{position:absolute;z-index:5;right:0;border-top-left-radius:0px;border-bottom-left-radius:0px;bottom:0;background-color:white;border:none;margin:0;padding:0;cursor:pointer;color:#555;border-left:1px solid #AAA;font-size:90%;height:100%;width:30px;display:flex;align-items:center;justify-content:center;}
#centerMarker{position:absolute;bottom:50%;z-index:5;font-size:300%;width:30px;margin-left:-15px;left:50%;}
#searchbutton{position:absolute;z-index:5;bottom:24px;left:50%;width:100px;margin-left:-50px;}
#list{display:flex;position:relative;flex-direction:row;width:100%;}
#sidebarOverlay{position:absolute;display:none;z-index:50;top:0;right:0;left:0;bottom:0;}
#sidebar{transition:transform 0.5s linear;width:300px;height:calc(100% - 40px);position:absolute;z-index:5;border-right:thin solid #DDD;background-color:white;text-align:left;color:#444;margin:8px 0;}
#sidebarIcon{position:absolute;z-index:5;display:none;background-color:#E9E9E9;height:100%;width:47px;padding-top:-8px;}
.menuIconLine{width:35px;height:5px;background-color:black;margin:0px 6px 6px 6px;}
.menuIconPlaceholder{width:35px;height:5px;background-color:transparent;margin:0px 6px;}
#sidebarVisible{width:300px;position:absolute;right:0;}
#sidebarTitle{position:absolute;right:16px;top:10px;font-size:200%;font-weight:bold;color:#999;}
#sidebarVisible h2{text-align:center;}
#sidebarVisible > input[type=range]{width:100%;margin:8px 0;padding:0;}
#sidebarVisible > input[type=button]{text-align:center;margin-left:3%;width:94%;line-height:38px;border-radius:3px;border:thin solid #CCC;}
#sidebarVisible > input{margin-bottom:16px;}
#emptyListText{padding:24px;color:#555;}
#registerButton{width:100%;max-width:320px;padding:4px;cursor:pointer;}
#listcontainer{flex-grow:1;min-height:777px;width:100%;padding-left:308px;background-color:white;text-align:center;display:inline-block;margin:68px 0 8px 0;transition:min-height ease 0.5s;}
#listTitle{position:absolute;right:0;left:308px;top:16px;text-align:right;font-size:200%;font-weight:bold;color:#999;}
.pubDescRight > ul > li{display:block;position:relative;}
.pubDescRight > ul > li:before{content:"\f105";font-family:FontAwesome;font-style:normal;font-weight:normal;text-decoration:inherit;color:#666;padding-right:-2em;margin-right:10px;position:absolute;top:-1px;left:-14px;}
#filterToggleButton{position:absolute;left:300px;top:22px;border-bottom-right-radius:4px;border:thin solid #DDD;padding:6px;border-top-right-radius:4px;background-color:white;font-size:200%;border-left:none;display:none;cursor:pointer;}
#filterToggleButtonIcon{transition:transform 0.5s linear;}
.rotate{transform:rotate(180deg);}
.table{text-align:center;display:inline-block;width:100%;}
.pubRow{margin-bottom:16px;text-align:left;border-radius:2px;border:thin solid #DDD;font-size:120%;}
.pubMain{width:calc(100% - 32px);display:flex;margin-bottom:-1px;overflow:hidden;align-items:center;justify-content:space-between;padding:8px 16px;cursor:pointer;flex-wrap:wrap;transition:box-shadow ease 0.5s;}
.pubRow:hover,.pubRow:focus,.pubFocus{box-shadow:0 0 2px 0 var(--stress);}
.pubVert,.pubHor{margin:8px;display:flex;flex-grow:1;justify-content:center;}
.pubHor{flex-direction:row;align-items:center;}
.pubVert{flex-direction:column;text-align:left;}
.pubHor .pubInfo{font-size:200%;margin-left:8px;min-width:46px;text-align:center;}
.pubFoto{width:60px;min-width:60px;height:60px;border-radius:100%;margin:8px 16px 8px 8px;font-size:250%;color:white;display:flex;justify-content:center;align-items:center;}
.pubDescBlock > label{font-size:90%;color:#666;display:block;}
.pubDescCont{display:flex;margin:0px -2px 16px -2px;flex-wrap:wrap;}
.pubDescCont .member{display:flex;margin:2px;padding:8px;flex-wrap:wrap;position:relative;flex-direction:column;}
.pubDescCont .member > div{//margin-right:54px;}
.pubDescCont .member label{color:#666;font-size:90%;margin-right:4px;width:110px;display:inline-block;}
.pubDescCont .member > i{position:absolute;top:0;right:0;bottom:0;align-items:center;display:flex;margin:24px;font-size:200%;}
.pubSmall{display:flex;flex-direction:row;margin:0px 0px;padding:8px 0px;flex-grow:1;flex-wrap:wrap;}
.pubSmallLeft{display:flex;justify-content:center;flex-direction:column;min-width:50%;}
.pubSmallRight{display:flex;justify-content:center;flex-direction:column;flex-grow:1;}
.pubLine{display:flex;flex-direction:column;margin:8px;}
.pubVert .pubLabel{font-size:80%;color:#666;}
.pubHor .pubLabel{font-size:95%;color:#666;}
.pubInfo{color:#333;}
.pubButtonIcon{display:flex;text-align:center;justify-content:center;border-left:1px solid #DDD;border-bottom:1px solid #DDD;font-size:200%;color:#333;width:auto;align-items:center;}
.pubButtonIcon > i{transition:transform 0.5s ease-out;}
.pubDesc{border-top:1px solid #CCC;padding:16px;}
.pubDescLine{display:flex;flex-direction:row;flex-wrap:wrap;}
.pubDescLeft{padding:0;font-size:90%;color:#666;width:142px;margin-left:-7px;}
.pubDescRight{padding:16px 8px;color:#333;flex-grow:1;}
.pubDescRight > ul{padding:0;margin:0;}
.pubDescCenter{width:100%;padding:16px;text-align:center;}
.pubButtons{text-align:center;display:flex;flex-direction:row;margin:16px -16px -16px -16px;}
.pubButton{background-color:#f6f6f6;padding:8px;cursor:pointer;}
.pubButton:hover{background-color:#ededed;}
.pubButton:active{box-shadow:inset 0 0 4px 0 #CCC;}
.pubContact{flex-grow:1;width:50%;border-top:1px solid #DDD;border-right:1px solid #DDD;}
.pubReport{flex-grow:1;width:50%;border-top:1px solid #DDD;border-left:1px solid #DDD;}
.sidePage{margin:8px;}
.sidePage h1,#registerHead h1,#overlay h1{margin:0px 0 16px 0;font-size:140%;font-weight:normal;border-bottom:1px solid var(--stress);color:var(--nav_text_color);}
.sidePage h2{margin-top:16px;font-size:110%;}
.sidePage .formRow{display:flex;flex-wrap:wrap;margin:16px 0px 4px 0;align-items:center;}
.sidePage .formRowClose{display:flex;flex-wrap:wrap;margin:8px 0px 4px 0;align-items:center;}
.sidePage label{color:#333;width:180px;margin:4px 0;}
.sidePage input{width:100%;max-width:320px;padding:4px;}
.sidePage input[type="submit"]{max-width:330px;cursor:pointer;margin-top:16px;}
#activationMsg{margin-bottom:14px;font-weight:bold;}
#loginForgotPassword,.dataPrivacyStatement{width:100%;max-width:330px;font-size:100%;color:#555;cursor:pointer;text-decoration:underline;}
#loginForgotPassword:hover,.dataPrivacyStatement:hover{text-decoration:underline;}
#loginError{display:block;font-weight:bold;margin-bottom:16px;color:#990000;}
#feedbackForm{display:flex;flex-direction:column;margin-top:12px;margin-bottom:8px;}
#feedbackMsg{padding:4px;margin-bottom:4px;}
#chatContainer{height:78vh;position:relative;overflow:hidden;min-height:400px;}
#chatContactContainer{width:40%;height:100%;background-color:white;z-index:5;box-shadow:0 0 2px 0 #CCC;position:absolute;transition:transform ease 0.2s;}
#chatMessageContainer{width:60%;height:100%;position:absolute;left:40%;transition:transform ease 0.2s;}
.chatContactRow{display:flex;align-items:center;padding:4px;border-bottom:1px solid #CCC;cursor:pointer;background-color:white;}
.chatContactRow:first-child{border-top:1px solid #CCC;}
.chatContactActive,.chatMessageActive{background-color:#E6EEFF;}
.chatContactIcon{position:relative;display:flex;padding:0px;flex-wrap:wrap;width:36px;min-width:36px;max-width:36px;min-height:36px;max-height:36px;height:36px;border-radius:100%;justify-content:center;color:var(--nav_background_color);font-size:200%;align-content:center;margin:4px;}
.chatContactCenterContainer{flex-grow:1;margin:4px;}
.chatContactNameContainer{display:flex;justify-content:space-between;//align-items:center;}
.chatContactTime{flex-grow:1;font-size:70%;color:#555;text-align:right;}
.chatContactMessage{font-size:80%;margin-top:4px;margin-left:1px;overflow:hidden;height:16px;}
.chatContactRightButton{display:flex;align-items:center;width:28px;min-width:28px;justify-content:center;margin:4px;}
#chatMessageHead{display:flex;flex-direction:row;align-items:center;position:absolute;top:0px;width:100%;height:44px;box-shadow:0 0 2px 0 #CCC;}
#chatMessageHeadButton{display:flex;align-items:center;padding:8px;width:28px;justify-content:center;visibility:hidden;cursor:pointer;}
#chatMessageHeadName{display:flex;align-items:center;flex-grow:1;padding:8px;justify-content:center;font-size:120%;}
#chatMessageHeadIcon{position:relative;display:flex;padding:0px;flex-wrap:wrap;width:36px;min-width:36px;max-width:36px;min-height:36px;max-height:36px;height:36px;border-radius:100%;justify-content:center;color:var(--nav_background_color);font-size:200%;align-content:center;margin:8px;}
#chatMessageBody{position:absolute;bottom:80px;height:auto;max-height:calc(100% - 124px);overflow-y:auto;overflow-x:hidden;width:100%;}
.chatMessageRow{display:flex;align-items:end;margin:4px;}
.chatRight{flex-direction:row-reverse;}
.chatLeft{flex-direction:row;}
.chatMessageIcon{position:relative;display:flex;padding:0px;flex-wrap:wrap;width:36px;min-width:36px;max-width:36px;min-height:36px;max-height:36px;height:36px;border-radius:100%;justify-content:center;color:var(--nav_background_color);font-size:200%;align-content:center;margin:4px;order:1;}
.chatMessageContent{margin:4px;padding:8px;border:1px solid #CCC;border-radius:3px;order:2;max-width:calc(100% - 114px);//max-width:calc(100% - 70px);position:relative;}
.chatRight > .chatMessageContent:after{left:100%;border-color:transparent transparent transparent #CCC;}
.chatLeft > .chatMessageContent:after{right:100%;border-color:transparent #CCC transparent transparent;}
.chatMessageContent:after{position:absolute;border-width:6px;bottom:10px;content:"";border-style:solid;height:0px;}
.chatMessageTime{font-size:80%;color:#666;float:right;margin:4px 0px -2px 12px;}
.chatMessageText{font-family:var(--font-family);}
#chatMessageFooter{display:flex;flex-direction:row;position:absolute;bottom:0px;width:100%;height:80px;box-shadow:0 0 2px 0 #CCC;}
#chatMessageInput{flex-grow:1;margin:4px;padding:4px;border-top-left-radius:3px;border-bottom-left-radius:3px;border:1px solid #CCC;margin:8px 0px 8px 8px;}
#chatMessageSendButton{display:flex;padding:8px;border:1px solid #CCC;border-left:none;border-top-right-radius:2px;border-bottom-right-radius:2px;margin:8px 8px 8px 0px;align-content:center;align-items:center;justify-content:center;background-color:white;}
#chatMessageSendButton:hover,#chatMessageSendButton:focus{box-shadow:0 0 2px 0 #999;}
#chatMessageSendButton:active{box-shadow:inset 0 0 2px 0 #999;}
.unreadIcon{background-color:#E00;position:absolute;border-radius:100%;display:flex;align-items:center;justify-content:center;color:wheat;font-weight:bold;}
#navChatButton .unreadIcon{width:14px;height:14px;right:4px;bottom:4px;font-size:40%;}
.chatContactIcon .unreadIcon{width:16px;height:16px;right:-4px;bottom:-4px;font-size:40%;}
#noFriendMsg{text-align:left;margin:0 8px 0 0;}
@media all and (max-width:916px){#content{border-radius:0px !important;}
}
@media all and (max-width:1032px){#pageExplanation > .explanation{width:35vw;}
}
@media all and (max-width:800px){#chatContactContainer{width:100%;box-shadow:none;}
#chatMessageHeadButton{visibility:visible;}
#chatMessageContainer{width:100%;left:100%;}
.moveLeft{transform:translateX(-100%);}
}
@media all and (max-width:800px){#sidebar{transform:translateX(-280px);display:block;height:calc(100% - 20px);margin:0px 0;padding-top:8px;}
#sidebarOverlay{display:block;}
#sidebarIcon{display:inherit;}
#filterToggleButton{display:inherit;}
#listcontainer{padding-left:28px;}
#listTitle{left:28px;}
.fullWidth{transform:translateX(0px) !important;}
}
@media all and (max-width:600px){.navContent,.navContent > .right{flex-direction:column;}
nav #navProfilButton{position:absolute;top:16px;right:0;}
#headerFadeTop,#headerFadeBottomContainer{display:none;}
header{margin-top:0;}
header > img{margin:0;}
#contentShadow{margin:13vw auto -13vw auto;}
#pageExplanation{margin-top:0;padding-bottom:0;padding-left:0;right:0;}
#pageExplanation,#explanationButton{font-size:4vw;}
#pageExplanation > .explanation{width:96vw;text-align:center;}
}
@media all and (min-width:1000px){#pageExplanation,#explanationButton{font-size:18px;}
}
.green{color:green !important;}
.yellow{color:#A50 !important;}
.red{color:red !important;}
.error{box-shadow:0 0 3px 0 red;}
.errormsg{flex-grow:100;color:red;}
.hidden{display:none !important;}
.bigBlur{-webkit-filter:blur(0.5vw);-moz-filter:blur(0.5vw);-o-filter:blur(0.5vw);-ms-filter:blur(0.5vw);filter:blur(0.5vw);}
.blur{-webkit-filter:blur(3px);-moz-filter:blur(3px);-o-filter:blur(3px);-ms-filter:blur(3px);filter:blur(3px);}
.background{display:none !important;}
.small{font-size:60%;}
.unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.untouchable{pointer-events:none;}
.rot90{opacity:0;//transform:rotate(180deg);//transform:rotate3d(0,1,0,90deg);}
.rotTrans{transition:opacity linear 0.1s;}
.topSpace{margin-top:48px !important;}
.spinner{margin:80px;text-align:center;}
.spinner > div{width:16px;height:16px;background-color:#555555;border-radius:100%;display:inline-block;-webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both;animation:sk-bouncedelay 1.4s infinite ease-in-out both;}
.spinner .bounce1{-webkit-animation-delay:-0.32s;animation-delay:-0.32s;}
.spinner .bounce2{-webkit-animation-delay:-0.16s;animation-delay:-0.16s;}
@-webkit-keyframes sk-bouncedelay{0%,80%,100%{ -webkit-transform:scale(0) }
40%{ -webkit-transform:scale(1.0) }
}
@keyframes sk-bouncedelay{0%,80%,100%{-webkit-transform:scale(0);transform:scale(0);}
 40%{-webkit-transform:scale(1.0);transform:scale(1.0);}
}