@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed|Roboto:400,700&display=swap&subset=latin-ext');

:root
{
 --site-max-width: 1200px;
 --popup-max-width: 800px;
 --color-blue: #009999;
 --color-lightblue: #b0e0e0;
 --color-red: #ff0000;
 --color-gray: #4d4d4d;
 --color-membership: #f203f2;

 --color-school: #009999;
 --color-developer: #6a0a9e;
 --color-studentgroup: #358dd1;
 --color-kindergarten: #9e520b;
 --color-nursery: #9e520b;
 --color-sport: #c40707;

 --color-dot1: #0ae061;
 --color-dot2: #65707f;
 --color-dot3: #c8a9ad;
 --color-dot4: #9f2232;
 --color-dot5: #009999;
 --color-dot6: #82549d;
 --color-dot7: #d8b72b;
 --color-dot8: #4472c4;
 --color-dot9: #f203f2;
}

*
{
 padding: 0;
 margin: 0;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 font-family: 'Roboto', sans-serif;
}

html
{
 overflow-y: scroll;
 min-height: 100%;
}

body
{
 height: 100%;
 margin: 0;
 font-family: 'Roboto', sans-serif;
 color: var(--color-gray);
 font-size: 11pt;
}

a
{
 cursor: pointer;
 text-decoration: none;
 color: var(--color-blue);
}

p
{
 font-weight: normal;
 line-height: 1.5em;
 margin-bottom: 1em;
 color: var(--color-gray);
}

small,
.small
{
 font-size: .8em;
}

.blue
{
 color: var(--color-blue);
}

li
{
 color: var(--color-gray);
}

td
{
 font-size: 11pt;
}

.mobile-only
{
 visibility: hidden;
}

.right-mobile-only
{
 display: none;
}

.compare-mobile-only
{
 display: none;
}

.compare-desktop-only
{
 display: block;
}

.clr
{
 clear: both;
}

.left
{
 text-align: left;
}

.right
{
 text-align: right !important;
}

.center
{
 text-align: center;
}

.float-left
{
 float: left;
 margin-right: 20px;
}

.float-right
{
 float: right;
 margin-left: 20px;
}

.nowrap
{
 white-space: nowrap;
}

.fullwidth
{
 width: 100%;
}

input.halfwidth
{
 width: 50%;
 min-width: 15em;
 max-width: 100%;
}

.maxfullwidth
{
 max-width: 100%;
}

h1
{
 font-size: 20pt;
 font-weight: bold;
 color: var(--color-gray);
 padding-bottom: 5px;
 margin-bottom: 1em;
 border-bottom: 1px solid var(--color-blue);
}

h2
{
 font-size: 16pt;
 font-weight: bold;
 color: var(--color-blue);
 margin-bottom: .5em;
}

h3
{
 font-size: 14pt;
 font-weight: bold;
 color: var(--color-gray);
 margin-bottom: .5em;
}

#right h3,
#righttop h3
{
 font-size: 13pt;
 font-weight: bold;
 text-transform: uppercase;
 color: var(--color-blue);
 padding-bottom: 5px;
 margin-bottom: 1em;
 border-bottom: 1px solid var(--color-blue);
}

ul.disc
{
 margin: 0 0 1em 1.5em;
 list-style: disc;
 font-size: 11pt;
 line-height: 1.5em;
}

.container
{
 width: 98%;
 max-width: var(--site-max-width);
 margin: 0 auto;
}

#ad-top
{
 clear: both;
 text-align: center;
 margin-bottom: 1em;
}

.adzone
{
 text-align: center;
 margin-bottom: 1em;
}

.color-blue {color: var(--color-blue);}
.color-school {color: var(--color-school) !important;}
.color-developer {color: var(--color-developer) !important;}
.color-studentgroup {color: var(--color-studentgroup) !important;}
.color-kindergarten {color: var(--color-kindergarten) !important;}
.color-nursery {color: var(--color-nursery) !important;}
.color-sport {color: var(--color-sport) !important;}
.bgcolor-blue {background-color: var(--color-blue) !important;}
.bgcolor-school {background-color: var(--color-school) !important;}
.bgcolor-developer {background-color: var(--color-developer) !important;}
.bgcolor-studentgroup {background-color: var(--color-studentgroup) !important;}
.bgcolor-kindergarten {background-color: var(--color-kindergarten) !important;}
.bgcolor-nursery {background-color: var(--color-nursery) !important;}
.bgcolor-sport {background-color: var(--color-sport) !important;}
.bbcolor-blue {border-bottom: 1px solid var(--color-blue);}
.bbcolor-school {border-bottom: 1px solid var(--color-school);}
.bbcolor-developer {border-bottom: 1px solid var(--color-developer);}
.bbcolor-studentgroup {border-bottom: 1px solid var(--color-studentgroup);}
.bbcolor-kindergarten {border-bottom: 1px solid var(--color-kindergarten);}
.bbcolor-nursery {border-bottom: 1px solid var(--color-nursery);}
.bbcolor-sport {border-bottom: 1px solid var(--color-sport);}
.btcolor-blue {border-top: 1px solid var(--color-blue);}
.btcolor-school {border-top: 1px solid var(--color-school);}
.btcolor-developer {border-top: 1px solid var(--color-developer);}
.btcolor-studentgroup {border-top: 1px solid var(--color-studentgroup);}
.btcolor-kindergarten {border-top: 1px solid var(--color-kindergarten);}
.btcolor-nursery {border-top: 1px solid var(--color-nursery);}
.btcolor-sport {border-top: 1px solid var(--color-sport);}
.bcolor-blue {border: 1px solid var(--color-blue) !important;}
.bcolor-school {border: 1px solid var(--color-school) !important;}
.bcolor-developer {border: 1px solid var(--color-developer) !important;}
.bcolor-studentgroup {border: 1px solid var(--color-studentgroup) !important;}
.bcolor-kindergarten {border: 1px solid var(--color-kindergarten) !important;}
.bcolor-nursery {border: 1px solid var(--color-nursery) !important;}
.bcolor-sport {border: 1px solid var(--color-sport) !important;}

/* */

.sharethis-inline-share-buttons
{
 margin-bottom: 20px;
}

.button
{
 cursor: pointer;
 box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
 transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
 font-family: Roboto, sans-serif;
 -moz-osx-font-smoothing: grayscale;
 -webkit-font-smoothing: antialiased;
 font-size: 0.875rem;
 line-height: 2.25rem;
 font-weight: 500;
 letter-spacing: 0.04em;
 text-decoration: none;
 text-transform: uppercase;
 -webkit-tap-highlight-color: transparent;
 will-change: transform, opacity;
 display: inline-block;
 position: relative;
 box-sizing: border-box;
 min-width: 64px;
 height: 36px;
 padding: 0 16px;
 border: none;
 outline: none;
 text-align: center;
 webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 -webkit-appearance: none;
 overflow: hidden;
 vertical-align: middle;
 border-radius: 2px;
 background-color: var(--color-blue);
 color: #fff !important;
 margin-bottom: .5em;
}

.button:disabled,
.button:disabled:hover,
.button-disabled,
.button-disabled:hover
{
 background-color: #888 !important;
 cursor: default !important;
}

.button:hover
{
 background-color: #fff !important;
 color: var(--color-blue) !important;
}

.button.bgcolor-school:hover {color: var(--color-school) !important;}
.button.bgcolor-developer:hover {color: var(--color-developer) !important;}
.button.bgcolor-studentgroup:hover {color: var(--color-studentgroup) !important;}
.button.bgcolor-kindergarten:hover {color: var(--color-kindergarten) !important;}
.button.bgcolor-nursery:hover {color: var(--color-nursery) !important;}
.button.bgcolor-sport:hover {color: var(--color-sport) !important;}

.button-gray
{
 background-color: #444;
 cursor: pointer;
}

.button-small
{
 height: 18px;
 min-width: 40px;
 font-size: .7rem;
 line-height: 1.3rem;
}

.button-login
{
 background-image: url(/img/icon-user.png);
 background-repeat: no-repeat;
 background-position: 5px 3px;
 padding-left: 40px;
 padding-top: 1px;
}

.button-login:hover
{
 background-image: url(/img/icon-user-gray.gif);
}

.text-button
{
 font-family: 'Roboto Condensed', sans-serif;
 cursor: pointer;
 font-weight: bold;
 letter-spacing: 0.04em;
 text-decoration: none;
 text-transform: uppercase;
 color: var(--color-blue);
 padding: 5px;
 border: 0;
 background-color: transparent;
}

.text-button:hover
{
 background-color: rgba(0, 153, 153, .1);
}

.text-button-small
{
 font-size: .7rem;
}

input,
select,
textarea
{
 padding: 5px;
 border: 0;
 outline: 0;
 background-color: #eee;
 font-size: 14px;
}

select
{
 appearance: none;
 -moz-appearance: none;
 -webkit-appearance: none;
 border-width: 1px;
 color: var(--color-gray);
 background: #eee url(/img/select-arrow.png) no-repeat right;
 padding-right: 35px;
 max-width: 100%;
}

select[multiple]
{
 background: #eee;
 width: 100%;
 height: auto;
 padding: 3px;
 margin: 0;
 border: 0;
}

textarea
{
 resize: vertical;
}

input[type="file"]
{
 border: none;
}

input.alert
{
 background-color: #fcc;
}

input.notempty
{
 background-color: var(--color-lightblue);
}

#login-facebook
{
 background: #4267b2 url(/img/login-facebook-logo.jpg) 5px 5px no-repeat;
 background-size: 25px 25px;
 padding: 12px 10px 15px 38px;
 font-size: 12px;
 line-height: 1em;
 height: 35px;
}

#login-google
{
 background: #4285f4 url(/img/login-google-logo.svg) -2px -2px no-repeat;
 background-size: 40px 40px;
 padding: 6px 10px 1px 45px;
 font-size: 12px;
 line-height: 24px;
 height: 35px;
}

#login-facebook:hover,
#login-google:hover
{
 color: var(--color-gray);
}

.ui-widget
{
 font-family: 'Roboto', sans-serif !important;
 font-size: 14px !important;
}

#notifications
{
 position: fixed;
 top: 10px;
 left: 50%;
 transform: translate(-50%);
 z-index: 2500;
}

.notification-popup
{
 border: 2px solid var(--color-blue);
 background-color: #fff;
 padding: 20px;
 margin-bottom: 10px;
 position: relative;
 min-width: 20em;
 text-align: center;
 border-radius: 5px;
 -webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, .4);
 -moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, .4);
 box-shadow: 2px 2px 10px rgba(0, 0, 0, .4);
}

.notification-popup.error
{
 border: 2px solid #a00;
}

.notification-popup:after
{
 content: '\00d7';
 font-size: 12px;
 position: absolute;
 top: 5px;
 right: 5px;
 color: #800;
}

.membership-info
{
 background-color: var(--color-membership);
 border-radius: 5px;
 color: #fff;
 width: 100%;
 padding: 5px 10px;
 margin-bottom: 1em;
 cursor: pointer;
}

.membership-required-text
{
 color: var(--color-membership) !important;
}

/* */

header
{
 width: 100%;
 background-color: #fff;
 padding: 10px 0 0 0;
 position: fixed;
 top: 0;
 z-index: 1250;
}

#header-user
{
 float: right;
 text-align: right;
}

#header-user > div
{
 display: inline-block;
 vertical-align: middle;
 margin-left: 15px;
}

#header-user > div img
{
 display: inline-block;
 vertical-align: middle;
}

#header-user > div > p
{
 display: inline-block;
 vertical-align: middle;
 font-size: 10pt;
 line-height: 1.3em;
 text-align: left;
 margin-bottom: 0;
}

#header-user > div p,
#header-user > div p a
{
 color: var(--color-blue);
 text-decoration: none;
}

#header-language
{
 position: relative;
}

#header-language-select
{
 position: absolute;
 top: -11px;
 left: -11px;
 display: none;
 background-color: #fff;
 border: 1px solid var(--color-blue);
}

#header-language:hover #header-language-select
{
 display: block;
}

#header-language-select > a
{
 display: block;
 padding: 10px;
}

#search
{
 cursor: pointer;
}

#search-form .ui-multiselect
{
 border: 1px solid #dcb;
 border-radius: 0;
 margin-right: .5em;
}

#search-popup
{
 display: none;
 text-align: center;
 background-color: #fff;
 width: 100%;
 padding: 20px 0;
 -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, .4);
 -moz-box-shadow: 0 2px 10px rgba(0, 0, 0, .4);
 box-shadow: 0 2px 10px rgba(0, 0, 0, .4);
}

#search-popup.is-visible
{
 display: block;
 position: fixed;
 width: 100%;
 top: 103px;
 z-index: 1200;
}

#search-popup input,
#search-popup select
{
 padding: 5px;
 margin-right: .5em;
}

#search-distance
{
 display: inline-block;
 vertical-align: middle;
 margin-right: .5em;
}

#search-detailed
{
 width: 30em;
 max-width: 90%;
 margin: 0 auto;
}

#search-detailed input[type=text],
#search-detailed select
{
 width: 100%;
}

#search-detailed .ui-multiselect
{
 border: 1px solid var(--color-blue);
 border-radius: 0;
 width: 100%;
}

#distance-value
{
 display: inline-block;
 width: 1.5em;
 text-align: right;
}

#profile
{
 position: relative;
}

#profile-submenu
{
 display: none;
 position: absolute;
 top: 30px;
 left: 34px;
 font-size: 10pt;
 line-height: 1.3em;
}

#profile-submenu a
{
 text-decoration: none;
 color: var(--color-gray);
}

#profile-submenu:hover,
#profile:hover > #profile-submenu
{
 display: block;
}

#headline
{
 position: relative;
 width: 100%;
 height: 260px;
 margin-top: 50px;
 background-image: url(/content/headline-2.jpg);
 background-position: center;
 background-size: cover;
}

#headline-slogan
{
 position: absolute;
 top: 12.5%;
 left: 50%;
 width: 90%;
 transform: translate(-50%);
 text-align: center;
 font-size: 16pt;
 color: #fff;
 text-transform: uppercase;
}

#headline-instit-reg
{
 position: absolute;
 bottom: 12.5%;
 left: 50%;
 width: 90%;
 transform: translate(-50%);
 text-align: center;
 font-size: 16pt;
 color: #fff;
}

#headline-instit-reg > a
{
 font-family: 'Roboto Condensed', sans-serif;
 text-transform: uppercase;
 color: #fff;
}

#search-index
{
 position: absolute;
 width: 100%;
 top: 50%;
 transform: translate(0, -50%);
 text-align: center;
 display: none;
}

#search-index > div
{
 display: inline-block;
 max-width: 90%;
 margin: 0 auto;
 background-color: rgba(255, 255, 255, .8);
 border-radius: 30px;
 color: var(--color-blue);
 font-weight: bold;
 padding: 15px 20px 10px 20px;
 border: 3px solid #dcb;
}

#search-index-button
{
 position: absolute;
 background-color: #fff;
 color: var(--color-blue);
 opacity: .8;
 border-radius: 100px;
 border: 3px solid #dcb;
 padding: 20px 30px;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 text-align: center;
 cursor: pointer;
 font-size: 16pt;
}

#search-index-button > img
{
 margin-right: 1em;
}

#search-index-button > *
{
 display: inline-block;
 vertical-align: middle;
}

#search-index input[type=text],
#search-index select
{
 padding: 5px;
 width: 125px;
 height: 30px;
 margin: 0 10px 10px 0;
 border: 1px solid #dcb;
}

#search-popup input[type=text],
#search-popup select
{
 border: 1px solid #dcb;
}

nav#main-menu
{
 background-color: var(--color-blue);
 text-align: center;
 width: 100%;
 z-index: 1150;
}

nav#main-menu.fix
{
 position: fixed;
 top: 60px;
 z-index: 1200;
}

ul#menu
{
 width: 98%;
 max-width: var(--site-max-width);
 font-size: 14pt;
 margin: 0 auto;
 list-style: none;
 position: relative;
}

ul#menu > li
{
 display: inline-block;
 margin: 0 1em;
 color: #fff;
}

ul#menu > li > a
{
 display: inline-block;
 padding: 10px;
 text-decoration: none;
 text-transform: uppercase;
 color: #fff;
}

.mega-menu
{
 left: 0;
 right: 0;
 display: none;
 min-height: 100%;
 background-color: #fff;
 color: var(--color-gray);
 font-weight: normal;
 text-align: left;
 border-left: 1px solid var(--color-blue);
 border-bottom: 1px solid var(--color-blue);
 border-right: 1px solid var(--color-blue);
 z-index: 1200;
}

.mega-menu > ul
{
 list-style: none;
 width: 45%;
 background-color: #f0f0f0;
 border-right: 1px solid var(--color-blue);
 position: relative;
 font-size: 11pt;
 min-height: 13em;
}

.mega-menu > ul.fullwidth
{
 width: 100%;
}

.mega-menu > ul > li > a
{
 display: block;
 color: var(--color-gray);
 text-decoration: none;
 padding: 15px;
}

/*
.mega-menu > ul > li:hover
{
 position: relative;
}
*/
.mega-menu > ul > li:hover > a
{
 color: var(--color-blue);
 background-color: #fff;
}

.mega-menu > ul > li:hover > a:after
{
 content: " ";
 display: inline-block;
 position: absolute;
 left: 100%;
 margin-top: -15px;
 width: 18px;
 height: 50px;
 background: url(/img/mega-menu-arrow.png) no-repeat;
}

.mega-menu:hover,
.mega-drop-down a:hover+.mega-menu
{
 display: block;
}

.mega-info
{
 display: none;
 position: absolute;
 width: 110%;
 height: 100%;
 left: 100%;
 right: 0;
 top: 10px;
 padding-left: 30px;
 line-height: 1.4em;
}

.mega-info ul
{
 margin-left: 0;
 list-style: none;
}

.mega-info:hover,
.mega-menu > ul a:hover+.mega-info
{
 display: inline-block;
}

#menu-h {display: none !important; cursor: pointer;}
#menu-h > svg {fill: var(--color-blue);}
#menu-h:hover > svg {}

footer
{
 width: 100%;
 background-color: #666;
 color: #fff;
 padding: 1em 0;
}

footer p,
footer a
{
 color: #fff;
}

#footer-barion-cards
{
 float: right;
}

#content
{
 display: inline-block;
 vertical-align: top;
 width: 66.666666%;
}

#rightmap
{
 float: right;
 clear: right;
 width: 30%;
 margin-bottom: 20px;
}

#righttop
{
 float: right;
 clear: right;
 width: 30%;
 margin-bottom: 20px;
}

#content.fullwidth,
#rightmap.fullwidth
{
 float: none;
 clear: both;
 width: 100%;
}

#right
{
 float: right;
 clear: right;
 width: 30%;
}

#content img,
#right img,
#righttop img
{
 max-width: 100%;
}

ul.instit-types,
ul#top,
ul#lastvisited,
ul#favourites
{
 list-style: none;
 margin: 0 0 40px 0;
 line-height: 1.5em;
}

ul#favourites
{
 margin-bottom: 20px;
}

ul.instit-types > li > a,
ul#top > li > a
{
 color: var(--color-gray);
 text-decoration: none;
 display: inline-block;
 vertical-align: middle;
 padding-top: 10px;
}

ul#top > li > a
{
 font-weight: bold;
 color: var(--color-blue);
 text-transform: uppercase;
}

ul.instit-types > li:before
{
 content: ' \25CF';
 font-size: 60px;
 display: inline-block;
 vertical-align: middle
}

ul.instit-filter
{
 list-style: none;
}

.instit-search-map-filter
{
 display: none;
 cursor: pointer;
 overflow: hidden;
}

.instit-search-map-filter > span
{
 display: inline-block;
 vertical-align: middle;
 padding: 10px 0 2px 0;
}

.instit-search-map-filter.inactive
{
 color: #ccc;
}

.leaflet-popup-content > img
{
 width: 35px;
 height: 35px;
 display: inline-block:
 vertical-align: top;
 margin-right: 10px;
}

.leaflet-popup-content > a
{
 display: inline-block;
 vertical-align: top;
}

ul.instit-types > li.inactive:before
{
 opacity: .2;
}

ul.activities > li
{
 margin: 0 0 .5em 31px;
}

ul.activities > li img
{
 display: inline-block;
 vertical-align: text-bottom;
 margin-right: .25em;
}

ul.activities > li > div
{
 margin-top: 1em;
}

ul.activities > li > span >img
{
 margin-left: -31px;
}

ul.instit-types > li.school:before {color: var(--color-school);}
ul.instit-types > li.developer:before {color: var(--color-developer);}
ul.instit-types > li.studentgroup:before {color: var(--color-studentgroup);}
ul.instit-types > li.kindergarten:before {color: var(--color-kindergarten);}
ul.instit-types > li.nursery:before {color: var(--color-nursery);}
ul.instit-types > li.sport:before {color: var(--color-sport);}

ul#lastvisited a,
ul#favourites a
{
 text-decoration: none;
 color: inherit;
}

ul#lastvisited,
ul#favourites
{
 list-style: none;
}

ul#lastvisited:after,
ul#favourites:after
{
 content:  " ";
 visibility: hidden;
 display: block;
 height: 0;
 clear: both;
}

ul#lastvisited li
{
 clear: both;
 line-height: 1.3em;
 height: 40px;
 overflow: hidden;
 margin-bottom: 10px;
}

ul#favourites li
{
 clear: both;
}

ul#lastvisited li > img,
ul#favourites li img
{
 float: left;
 width: 40px;
 height: 40px;
 vertical-align: text-top;
 margin: 0 10px 10px 0;
}

ul#reg-claimed-instits
{
 margin-left: 1.5em;
}

ul#reg-claimed-instits > li
{
 margin-bottom: .5em;
}

/* */

#main
{
 margin-top: 120px;
 margin-bottom: 20px;
}

.cols-2
{
 display: inline-block;
 vertical-align: top;
 width: 48%;
}

.cols-2:first-of-type
{
 margin-right: 3%;
}

.index-article
{
 position: relative;
 margin-bottom: 1em;
}

.index-article img
{
 width: 23%;
 display: inline-block;
 vertical-align: top;
}

.index-article > .index-article-text
{
 width: 75%;
 margin-left: 2%;
 display: inline-block;
 vertical-align: top;
}

.index-article:nth-child(1),
.index-article:nth-child(2)
{
 width: 49%;
 display: inline-block;
 vertical-align: top;
}

.index-article:nth-child(1)
{
 margin-right: 2%;
}

.index-article:nth-child(1) img,
.index-article:nth-child(2) img
{
 width: 100%;
 display: block;
}

.index-article:nth-child(1) > .index-article-text,
.index-article:nth-child(2) > .index-article-text
{
 position: absolute;
 bottom: 0;
 left: 0;
 width: 100%;
 padding: 10px;
 margin-left: 0;
 background-color: rgba(0, 153, 153, .8);
 color: #fff;
 pointer-events: none;
}

.index-article:nth-child(1) > .index-article-text > h3,
.index-article:nth-child(2) > .index-article-text > h3
{
 border-bottom: none;
 margin-bottom: .25em;
 font-size: 16pt;
 color: #fff;
}

.index-article:nth-child(1) > .index-article-text > h3 > a,
.index-article:nth-child(2) > .index-article-text > h3 > a
{
 color: #fff;
}

.index-article:nth-child(1) > .index-article-text > p,
.index-article:nth-child(2) > .index-article-text > p
{
 margin-bottom: 0;
 color: #fff;
}

#trainings-popup
{
 position: fixed;
 right: 20px;
 bottom: 20px;
 text-align: center;
}

#trainings-popup > a > span
{
 display: block;
 color: #000;
 text-transform: uppercase;
 font-size: 14pt;
 background-color: rgba(255, 255, 255, .7);
 padding: 5px 10px;
}

/* institutions */

article#instit h1
{
 margin-bottom: 0;
 position: relative;
 transition: all .5s ease;
 padding-right: 30px;
}

article#eval h1
{
 position: relative;
 padding-right: 30px;
 transition: all .5s ease;
}

#instit-title-headline.fix
{
 position: fixed;
 top: 103px;
 background-color: #fff;
 padding: 10px 0 0 0;
 z-index: 1150;
}

#instit-title-headline.fix h1
{
 font-size: 14pt;
}

h1#instit-title a
{
 color: var(--color-gray);
}

article.school a {color: var(--color-school);}
article.developer a {color: var(--color-developer);}
article.studentgroup a {color: var(--color-studentgroup);}
article.kindergarten a {color: var(--color-kindergarten);}
article.nursery a {color: var(--color-nursery);}
article.sport a {color: var(--color-sport);}

article#instit h2,
article#eval h2,
article#reg h2,
article#login h2,
article#user h2
{
 font-weight: bold;
 font-size: 16pt;
 text-transform: uppercase;
 margin-bottom: 20px;
 color: var(--color-gray);
}

article#instit ul,
article#eval ul
{
 list-style: none;
}

article#instit ul
{
 margin-bottom: 1em;
}

article#eval > ul > li
{
 display: inline-block;
}

#instit-menu
{
 position: absolute;
 right: 0;
 bottom: 0;
 margin: 5px 0 0 5px;
}

#instit-menu-h
{
 cursor: pointer;
 position: relative;
}

#instit-menu-list
{
 display: none;
 position: absolute;
 right: 0;
 top: 100%;
 font-size: 12pt;
 font-weight: normal;
 background-color: var(--color-blue);
 padding: 1px;
 z-index: 1000;
}

#instit-menu-list ul
{
 margin-bottom: 0 !important;
 background-color: #fff;
}

#instit-menu-list ul li
{
 margin-bottom: 0 !important;
}

#instit-menu-list ul li:hover
{
 background-color: #eee;
}

#instit-menu-list ul li ul
{
 list-style: none !important;
 margin-left: 0 !important;
}

#instit-menu-list ul li ul li
{
 padding: 0 0 0 1em !important;
 display: block !important;
 border: 0 !important;
}

#instit-menu-list a
{
 display: inline-block;
 color: #888;
 white-space: nowrap;
 width: 100%;
 margin: 0;
 padding: .25em 1em;
 font-size: 11pt;
}

.anchor
{
 display: block;
 visibility: hidden;
 height: 170px;
 margin-top: -170px;
}

.instit-score
{
 font-size: 14px;
}

.instit-rate
{
 font-size: 14px;
 font-weight: bold;
}

.instit-data
{
 display: inline-block;
 margin: 0 1em .5em 0;
 font-size: 11pt;
 color: var(--color-gray);
}

.instit-data > div
{
 display: inline-block;
 margin-right: 1em;
 line-height: 1.5em;
}

.instit-data > span
{
 display: inline-block;
 vertical-align: text-bottom;
}

.instit-data a
{
 color: var(--color-gray);
 text-decoration: none;
}

.instit-data img
{
 vertical-align: text-bottom;
}

.block,
.instit-block
{
 margin-bottom: 40px;
}

#instit-map-fb
{
 display: flex;
}

#instit-map
{
 flex: 1;
}

#instit-fb
{
 width: 340px;
 margin-left: 20px;
}

ul.instit-comp-links
{
 list-style: none;
 text-align: center;
}

ul.instit-comp-links > li
{
 display: inline-block;
 width: 20%;
 margin: 0 2.5%;
 vertical-align: top;
 line-height: 1.5em !important;
}

ul.instit-comp-links > li img
{
 display: inline-block;
 margin-bottom: 1em;
}

#instit-details
{
 max-height: 6em;
 position: relative;
 overflow: hidden;
}

#instit-details .more,
ul.activities .more
{
 position: absolute;
 bottom: 0;
 left: 0;
 width: 100%;
 text-align: center;
 margin: 0;
 padding-top: 3em;
 background-image: linear-gradient(to bottom, transparent, white);
}

h2.has-icon,
h3.has-icon
{
 display: flex;
 border-bottom: none !important;
}

h3.has-icon > span:first-child
{
 margin-right: 10px;
}

h2.has-icon > span.h2-title,
h3.has-icon > span.h3-title
{
 flex: 1;
 margin-top: 12px;
}

#right h3.has-icon > span.h3-title,
#righttop h3.has-icon > span.h3-title
{
 margin-top: 12px;
 margin-bottom: 7px;
}

.h2-icon,
.h3-icon
{
 display: inline-block;
 vertical-align: middle;
 margin-right: 10px;
 width: 60px;
 height: 60px;
 border-radius: 50%;
}

.h2-icon-sm
{
 display: inline-block;
 vertical-align: bottom;
 margin-right: 10px;
}

#instit-list-size-select
{
 float: right;
}

.instit-list-item
{
 display: flex;
 margin-bottom: 3em;
 width: 100%;
}

.instit-list-item h3
{
 font-size: 14pt;
 font-weight: bold;
 padding-bottom: 5px;
 margin-bottom: 0;
}

.instit-list-item h3 > a
{
 text-decoration: none;
 color: inherit;
}

.instit-type
{
 display: inline-block;
 padding: 2px 15px;
 color: #fff;
 margin: 0 5px 10px 0;
 font-size: 14px
}

.instit-more
{
 display: inline-block;
 font-weight: bold;
 margin-right: 1em;
}

.instit-more > a
{
 text-decoration: none;
}

.instit-compare,
.instit-fav
{
 display: inline-block;
 font-weight: bold;
 cursor: pointer;
 margin-right: 1em;
}

.instit-compare.inactive
{
 color: #ccc;
 cursor: default;
}

.instit-list-image
{
 display: block;
 position: relative;
 width: 150px;
 height: 150px;
 vertical-align: top;
 margin-right: 20px;
 text-align: center;
}

.instit-list-image > img
{
 display: block;
 width: 100%;
 height: auto;
}

.instit-list-image > div
{
 position: absolute;
 text-align: center;
 width: 100%;
 bottom: 0;
 color: #fff;
 font-size: 14px;
 padding: 5px;
 background-color: rgba(0, 0, 0, .5);
}

.instit-list-info
{
 flex: 1;
 vertical-align: top;
}

.instit-list-title
{
 overflow: hidden;
 font-size: 14px;
}

.instit-rank
{
 float: left;
 min-width: 3em;
 margin: 0 10px 10px 0;
 text-align: center;
 border: 1px solid var(--color-blue);
 background-color: var(--color-blue);
 color: #fff;
 font-size: 14pt;
 font-weight: bold;
}

.instit-rank > span
{
 display: block;
 padding: 2px 10px 1px 10px;
}

.instit-rank-noshow
{
 float: left;
 width: 80px;
 padding: 5px;
 border-radius: 5px;
 margin: 0 10px 10px 0;
 text-align: center;
 background-color: var(--color-membership);
 color: #fff;
 text-align: center;
 font-size: 12px;
}


.instit-rank-filter
{
 display: inline-block;
 margin: 0 0 0 5px;
 vertical-align: middle;
}

.instit-rank-change
{
 clear: both;
 width: 100%;
 padding: 4px 0 1px 0;
 font-size: 14pt;
 background-color: #fff;
}

.instit-rank-up
{
 color: var(--color-blue);
}

.instit-rank-down
{
 color: var(--color-red);
}

.instit-rank-membership-required
{
 background-color: var(--color-membership);
 font-weight: normal;
}

.instit-rank-membership-required > a
{
 color: #fff;
}

ul.instit-subject-list
{
 list-style: none;
 margin-bottom: 1em;
}

ul.instit-subject-list > li
{
 display: inline-block;
 margin: 0 10px 10px 0;
 padding: 2px 10px;
 border: 1px solid var(--color-school);
 font-size: 14px;
}

ul.instit-subject-list > li > a
{
 color: inherit;
}

table.instit-subject-list
{
 width: 100%;
}

table.instit-subject-list td
{
 padding-bottom: .5em;
}

table.instit-subject-list tr.hidden
{
 display: none;
}

.instit-list-item.school ul.instit-subject-list > li {border: 1px solid var(--color-school);}
.instit-list-item.developer ul.instit-subject-list > li {border: 1px solid var(--color-developer);}
.instit-list-item.studentgroup ul.instit-subject-list > li {border: 1px solid var(--color-studentgroup);}
.instit-list-item.kindergarten ul.instit-subject-list > li {border: 1px solid var(--color-kindergarten);}
.instit-list-item.nursery ul.instit-subject-list > li {border: 1px solid var(--color-nursery);}
.instit-list-item.sport ul.instit-subject-list > li {border: 1px solid var(--color-sport);}

ul.instit-eval-list
{
 list-style: none;
 margin-bottom: 1em;
}

ul.instit-eval-list > li
{
 display: inline-block;
 margin: 0 10px 10px 0;
 font-size: 14px;
}

ul.instit-eval-list > li > ul,
article#eval ul > li > ul
{
 display: inline-block;
 list-style: none;
 margin-left: 10px;
}

ul.instit-eval-list > li > ul
{
 margin-left: 0;
}

ul.instit-eval-list > li > ul > li,
article#eval ul > li > ul > li
{
 padding: 2px 0 2px 5px;
 margin-right: 2px;
 display: inline-block;
}

article#eval ul > li > ul > li
{
 padding: 0 0 0 5px;
}

ul.instit-eval-list > li > ul > li.a,
article#eval ul > li > ul > li.a
{
 padding: 2px 5px;
}

ul.instit-eval-list > li > ul > li > span,
article#eval ul > li > ul > li > span
{
 margin-left: 5px;
 color: #fff;
 padding: 2px 5px;
}

article.school ul.instit-eval-list > li > ul > li, article#eval.school ul > li > ul > li {border: 1px solid var(--color-school);}
article.developer ul.instit-eval-list > li > ul > li, article#eval.developer ul > li > ul > li {border: 1px solid var(--color-developer);}
article.studentgroup ul.instit-eval-list > li > ul > li, article#eval.studentgroup ul > li > ul > li {border: 1px solid var(--color-studentgroup);}
article.kindergarten ul.instit-eval-list > li > ul > li, article#eval.kindergarten ul > li > ul > li {border: 1px solid var(--color-kindergarten);}
article.nursery ul.instit-eval-list > li > ul > li, article#eval.nursery ul > li > ul > li {border: 1px solid var(--color-nursery);}
article.sport ul.instit-eval-list > li > ul > li, article#eval.sport ul > li > ul > li {border: 1px solid var(--color-sport);}
article.school ul.instit-eval-list > li > ul > li.noborder, article#eval.school ul > li > ul > li.noborder {border: 0;}
article.developer ul.instit-eval-list > li > ul > li.noborder, article#eval.developer ul > li > ul > li.noborder {border: 0;}
article.studentgroup ul.instit-eval-list > li > ul > li.noborder, article#eval.studentgroup ul > li > ul > li.noborder {border: 0;}
article.kindergarten ul.instit-eval-list > li > ul > li.noborder, article#eval.kindergarten ul > li > ul > li.noborder {border: 0;}
article.nursery ul.instit-eval-list > li > ul > li.noborder, article#eval.nursery ul > li > ul > li.noborder {border: 0;}
article.sport ul.instit-eval-list > li > ul > li.noborder, article#eval.sport ul > li > ul > li.noborder {border: 0;}

article.school ul.instit-eval-list > li > ul > li > span, article#eval.school ul > li > ul > li > span {background-color: var(--color-school);}
article.developer ul.instit-eval-list > li > ul > li > span, article#eval.developer ul > li > ul > li > span {background-color: var(--color-developer);}
article.studentgroup ul.instit-eval-list > li > ul > li > span, article#eval.studentgroup ul > li > ul > li > span {background-color: var(--color-studentgroup);}
article.kindergarten ul.instit-eval-list > li > ul > li > span, article#eval.kindergarten ul > li > ul > li > span {background-color: var(--color-kindergarten);}
article.nursery ul.instit-eval-list > li > ul > li > span, article#eval.nursery ul > li > ul > li > span {background-color: var(--color-nursery);}
article.sport ul.instit-eval-list > li > ul > li > span, article#eval.sport ul > li > ul > li > span {background-color: var(--color-sport);}

ul.instit-eval-list > li ul
{
 display: inline-block;
 margin-bottom: 0 !important;
}

ul.instit-eval-list > li ul > li
{
 display: inline-block;
 margin-left: .25em;
 color: inherit;
}

.instit-list-item ul.instit-subject-list > li.more
{
 border: 0;
 padding: 0;
}

.instit-list-item ul.instit-subject-list > li > span
{
 color: var(--color-red);
}

.instit-nearby-item
{
 display: inline-block;
 vertical-align: top;
 width: 19%;
 margin: 0 1% 1em 0;
}

.instit-nearby-distance
{
 font-size: 10pt;
 margin-bottom: 10px;
}

.instit-nearby-text
{
 position: relative;
 font-size: 10pt;
 line-height: 1.2em;
 max-height: 5em;
 overflow: hidden;
}

.instit-nearby-text:after
{
 content: " ";
 position: absolute;
 top: 3em;
 left: 0;
 width: 100%;
 height: 2em;
 background-image: linear-gradient(to bottom, transparent, white);
 pointer-events: none;
}

.instit-nearby-item:last-child
{
 margin: 0 0 1em 0;
}

.instit-nearby-item > a
{
 text-decoration: none;
 display: inline-block;
 width: 100%;
background-color: yellow;
}

.instit-nearby-item .instit-list-image
{
 display: block;
 width: 100%;
 height: auto;
 margin-bottom: 10px;
}

table.instit-table td
{
 padding-bottom: .5em;
 vertical-align: top;
 margin-right: 1em;
}

table.instit-table td.bottom
{
 vertical-align: bottom;
}

table.instit-table td:first-child
{
 padding-right: .5em;
}

ul.instit-ranking strong
{
 background-color: var(--color-school);
 color: #fff;
 padding: 3px 10px;
 white-space: nowrap;
}

ul.instit-ranking li
{
 line-height: 1.5em;
 padding-bottom: 10px;
}

#map-large
{
 cursor: pointer;
 text-align: right;
}

.pagination
{
 text-align: center;
 margin-bottom: 1em;
}

.pagination > a
{
 display: inline-block;
 padding: 5px;
 width: 2.5em;
 text-align: center;
 background-color: #eee;
 margin: 0 5px 5px 0;
 text-decoration: none;
 color: var(--color-gray);
}

.pagination > span
{
 display: inline-block;
 padding: 5px;
 width: 3em;
 text-align: center;
 margin: 0 5px 5px 0;
 color: var(--color-gray);
}

.pagination a.active
{
 color: #fff;
 background-color: var(--color-blue);
}

ul#instit-gallery,
ul#instit-edit-gallery
{
 list-style: none;
}

ul#instit-gallery > li
{
 display: inline-block;
 vertical-align: top;
 position: relative;
 margin: 0;
}

ul#instit-gallery .gallery-image
{
 width: 100%;
 height: 0;
 padding-top: 56.25%;
 background-size: cover;
 background-position: center;
}

ul#instit-gallery .gallery-image .noimage
{
 position: absolute;
 text-align: center;
 width: 100%;
 bottom: 0;
 color: #fff;
 font-size: 24px;
 padding: 20px;
 background-color: rgba(0, 0, 0, .5);
}

.gallery-youtube
{
 position: relative;
 padding-bottom: 56.25%;
 height: 0;
 overflow: hidden;
 max-width: 100%;
}

.gallery-youtube iframe,
.gallery-youtube object,
.gallery-youtube embed
{
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

ul#instit-edit-gallery > li
{
 display: inline-block;
 position: relative;
 margin: 0 0 10px 10px;
 width: 150px;
 height: 100px;
}

ul#instit-edit-gallery > li img
{
 max-width: 100%;
 max-height: 100%;
}

.gallery-thumb-video
{
 position: absolute;
 pointer-events: none;
 padding: 5px 5px 0 5px;
 background-color: #fff;
 margin-left: 50%;
 top: 50%;
 margin-top: -20px;
 transform: translate(-50%);
 opacity: .9;
}

.gallery-thumb-video > img
{
 display: inline-block;
}

ul.instit-ul
{
 list-style: none;
 line-height: 1.5em;
 font-size: 11pt;
}

.tooltip
{
 display: inline-block;
 background: url(/img/icons-info.gif) no-repeat;
 background-size: cover;
 width: 17px;
 height: 17px;
 position: relative;
}

article.school .tooltip {background-position: 0 0;}
article.developer .tooltip {background-position: -17px 0;}
article.studentgroup .tooltip {background-position: -34px 0;}
article.kindergarten .tooltip {background-position: -51px 0;}
article.nursery .tooltip {background-position: -51px 0;}
article.sport .tooltip {background-position: -68px 0;}

.tooltip > span
{
 visibility: hidden;
 position: absolute;
 z-index: 100;
 width: 400px;
 top: 20px;
 right: 0;
 font-size: 10pt;
 line-height: 1.3em;
 padding: 10px;
 color: var(--color-gray);
 border: 1px solid var(--color-blue);
 background-color: #fff;
 border-radius: 5px;
 text-transform: none;
 font-weight: normal;
}

.tooltip > span.r
{
 left: 0;
 right: auto;
}

.tooltip-rank
{
 background: url(/img/icon-info-rank.gif) no-repeat;
}

article.school .tooltip > span {border: 1px solid var(--color-school);}
article.developer .tooltip > span {border: 1px solid var(--color-developer);}
article.studentgroup .tooltip > span {border: 1px solid var(--color-studentgroup);}
article.kindergarten .tooltip > span {border: 1px solid var(--color-kindergarten);}
article.nursery .tooltip > span {border: 1px solid var(--color-nursery);}
article.sport .tooltip > span {border: 1px solid var(--color-sport);}

.tooltip:hover > span
{
 visibility: visible;
}

.chart
{
 max-width: 100%;
}

.score
{
 display: inline-block;
 vertical-align: text-top;
 width: 91px;
 height: 15px;
 overflow: hidden;
 background-image: url(/img/score-stars.png);
 background-repeat: no-repeat;
}
.score-0_0.school {background-position: -91px -1px;}
.score-1_0.school {background-position: -73px -1px;}
.score-2_0.school {background-position: -55px -1px;}
.score-3_0.school {background-position: -37px -1px;}
.score-4_0.school {background-position: -19px -1px;}
.score-5_0.school {background-position: -1px -1px;}
.score-0_5.school {background-position: -256px -1px;}
.score-1_5.school {background-position: -238px -1px;}
.score-2_5.school {background-position: -220px -1px;}
.score-3_5.school {background-position: -202px -1px;}
.score-4_5.school {background-position: -184px -1px;}
.score-0_0.developer {background-position: -91px -18px;}
.score-1_0.developer {background-position: -73px -18px;}
.score-2_0.developer {background-position: -55px -18px;}
.score-3_0.developer {background-position: -37px -18px;}
.score-4_0.developer {background-position: -19px -18px;}
.score-5_0.developer {background-position: -1px -18px;}
.score-0_5.developer {background-position: -256px -18px;}
.score-1_5.developer {background-position: -238px -18px;}
.score-2_5.developer {background-position: -220px -18px;}
.score-3_5.developer {background-position: -202px -18px;}
.score-4_5.developer {background-position: -184px -18px;}
.score-0_0.studentgroup {background-position: -91px -35px;}
.score-1_0.studentgroup {background-position: -73px -35px;}
.score-2_0.studentgroup {background-position: -55px -35px;}
.score-3_0.studentgroup {background-position: -37px -35px;}
.score-4_0.studentgroup {background-position: -19px -35px;}
.score-5_0.studentgroup {background-position: -1px -35px;}
.score-0_5.studentgroup {background-position: -256px -35px;}
.score-1_5.studentgroup {background-position: -238px -35px;}
.score-2_5.studentgroup {background-position: -220px -35px;}
.score-3_5.studentgroup {background-position: -202px -35px;}
.score-4_5.studentgroup {background-position: -184px -35px;}
.score-0_0.kindergarten {background-position: -91px -52px;}
.score-1_0.kindergarten {background-position: -73px -52px;}
.score-2_0.kindergarten {background-position: -55px -52px;}
.score-3_0.kindergarten {background-position: -37px -52px;}
.score-4_0.kindergarten {background-position: -19px -52px;}
.score-5_0.kindergarten {background-position: -1px -52px;}
.score-0_5.kindergarten {background-position: -256px -52px;}
.score-1_5.kindergarten {background-position: -238px -52px;}
.score-2_5.kindergarten {background-position: -220px -52px;}
.score-3_5.kindergarten {background-position: -202px -52px;}
.score-4_5.kindergarten {background-position: -184px -52px;}
.score-0_0.nursery {background-position: -91px -52px;}
.score-1_0.nursery {background-position: -73px -52px;}
.score-2_0.nursery {background-position: -55px -52px;}
.score-3_0.nursery {background-position: -37px -52px;}
.score-4_0.nursery {background-position: -19px -52px;}
.score-5_0.nursery {background-position: -1px -52px;}
.score-0_5.nursery {background-position: -256px -52px;}
.score-1_5.nursery {background-position: -238px -52px;}
.score-2_5.nursery {background-position: -220px -52px;}
.score-3_5.nursery {background-position: -202px -52px;}
.score-4_5.nursery {background-position: -184px -52px;}
.score-0_0.sport {background-position: -91px -69px;}
.score-1_0.sport {background-position: -73px -69px;}
.score-2_0.sport {background-position: -55px -69px;}
.score-3_0.sport {background-position: -37px -69px;}
.score-4_0.sport {background-position: -19px -69px;}
.score-5_0.sport {background-position: -1px -69px;}
.score-0_5.sport {background-position: -256px -69px;}
.score-1_5.sport {background-position: -238px -69px;}
.score-2_5.sport {background-position: -220px -69px;}
.score-3_5.sport {background-position: -202px -69px;}
.score-4_5.sport {background-position: -184px -69px;}

.article-recommendation
{
 width: 32%;
 display: inline-block;
 vertical-align: top;
 margin-right: 2%;
}

.article-recommendation:last-child
{
 margin-right: 0;
}

.article-recommendation img
{
 display: block;
 width: 100%;
 margin-bottom: 10px;
}

#right-recommendation > div
{
 margin-bottom: 1em;
}

/* evaluation */

article#eval li
{
 font-size: 11pt;
 line-height: 1.5em;
}

article#eval > div > ul > li
{
 margin-bottom: .5em;
}

.eval-popup-close
{
 float: right;
 font-size: 40px;
 font-weight: bold;
 margin-top: -15px;
 cursor: pointer;
 color: var(--color-blue);
}

.eval-ansnum
{
 background-color: var(--color-blue);
 display: inline-block;
 color: #fff;
 border-radius: 50%;
 padding: 1px 4px;
 font-size: 12px;
 width: 16px;
 height: 16px;
}

.range-value
{
 margin-left: 1em;
 font-size: 18pt;
 font-weight: bold;
}

.eval-review-item
{
 margin-bottom: .5em;
}

.eval-review-item div.long
{
 max-height: 6em;
 position: relative;
 overflow: hidden;
}

.eval-review-item p.more
{
 position: absolute;
 bottom: 0;
 left: 0;
 width: 100%;
 text-align: center;
 margin: 0;
 padding-top: 3em;
 background-image: linear-gradient(to bottom, transparent, white);
}

.eval-review-item:hover
{
 background-color: #eee;
}

.eval-answer-input
{
 margin-bottom: 2em;
}

.eval-answer-input > input[type=range]
{
 width: 500px;
 max-width: 70%;
}

.eval-answer-input.cols
{
 column-count: 3;
}

.eval-group-toggle:before {content: "+"; display: block; position: absolute; top: 0; left: -23px; width: 46px; height: 44px; background: url(/img/compare-block-close.png) no-repeat 0 center; transition: background .5s;}
.eval-group-toggle.closed:before {content: "-"; transition: all .5s;}

.eval-procon
{
 text-align: right;
 vertical-align: middle;
}

.eval-procon span,
.eval-procon > a
{
 display: inline-block;
 vertical-align: middle;
}

.eval-procon > a
{
 margin-left: .5em;
 color: var(--color-gray);
}

/* icons */

.i-instit
{
 display: inline-block;
 background-image: url(/img/icons-instit.gif);
 background-repeat: no-repeat;
}

.i-instit-info {width: 24px; height: 29px; background-position: 0 0;}
.i-instit-gallery {width: 32px; height: 29px; background-position: -24px 0;}
.i-instit-map {width: 21px; height: 29px; background-position: -58px 0;}
.i-instit-activities {width: 31px; height: 29px; background-position: -80px 0;}

.i-pro,
.i-con
{
 display: inline-block;
 background-image: url(/img/eval-review-useful.gif);
 background-repeat: no-repeat;
 width: 20px;
 height: 27px;
}
.i-pro.school {background-position: 0 0;}
.i-pro.developer {background-position: -20px 0;}
.i-pro.studentgroup {background-position: -40px 0;}
.i-pro.kindergarten {background-position: -60px 0;}
.i-pro.nursery {background-position: -60px 0;}
.i-pro.sport {background-position: -80px 0;}
.i-con.school {background-position: 0  -27px;}
.i-con.developer {background-position: -20px  -27px;}
.i-con.studentgroup {background-position: -40px  -27px;}
.i-con.kindergarten {background-position: -60px  -27px;}
.i-con.nursery {background-position: -60px  -27px;}
.i-con.sport {background-position: -80px  -27px;}

/* user profile */

table#user-membership-levels
{
 width: 100%;
}

table#user-membership-levels tr > td:first-child
{
 width: 50px;
 padding-right: 10px;
}

table#user-membership-levels td
{
 vertical-align: top;
}

ul.user-membership-info
{
 display: none;
 margin: 0 0 1em 0;
 list-style: none;
}

ul.user-membership-info li
{
 padding-left: 1.5em;
 text-indent: -1.1em;
}

ul.user-membership-info li:before
{
 content: "\2022";
 font-size: 20px;
 color: var(--color-blue);
 padding-right: .5em;
}

ul#user-instit,
ul#children
{
 list-style: none;
 margin-bottom: 20px;
}

ul#user-instit li,
ul#children li
{
 line-height: 1.5em;
}

ul#children > li > div
{
 background-color: var(--color-blue);
 color: #fff;
 padding: 5px 10px;
 margin-bottom: 10px;
}

ul#children > li > div > a
{
 color: #fff;
}

ul#children > li ul li a
{
 margin-right: 10px;
}

ul#children > li > div > a > img
{
 vertical-align: text-bottom;
}

ul#children > li > div > img
{
 display: inline-block;
 vertical-align: bottom;
 margin-right: 10px;
}

ul#children > li > ul
{
 list-style: none;
 margin-left: 1em;
 margin-bottom: 20px;
}

ul#user-instit img,
ul#children ul img
{
 width: 40px;
 height: 40px;
 vertical-align: text-top;
 margin: 0 10px 10px  0;
}


ul#children ul img
{
 vertical-align: middle;
}

.user-children-instit-edit
{
 text-transform: uppercase;
 font-family: 'Roboto Condensed', sans-serif;
}

.user-children-instit-edit > img
{
 width: 16px !important;
 height: 24px !important;
 vertical-align: middle !important;
 margin: 0 0 10px 0 !important;
}

.grade-inactive
{
 color: #888;
}

#popup,
.popup
{
 position: fixed;
 opacity: 0;
 visibility: hidden;
 z-index: 2000;
 left: 0;
 top: 0;
 width: 100%;
 height: 100%;
}

#popup.is-visible,
.popup.is-visible
{
 opacity: 1;
 visibility: visible;
 background-color: rgb(0, 0, 0);
 background-color: rgba(0, 0, 0, 0.7);
}

#membership-popup.is-visible
{
 background-color: rgba(0, 0, 0, 0.9);
}

#popup-content,
.popup > div
{
 background-color: #fff;
 margin: 10% auto 0 auto;
 width: 70%;
 max-width: var(--popup-max-width);
 max-height: 75%;
 padding: 20px;
 z-index: 2000;
 overflow-y: auto;
}

.popup-close
{
 cursor: pointer;
}

ul.ui-autocomplete {z-index: 2000;}

/* compare */

#compare-popup
{
 display: none;
 position: fixed;
 right: -100px;
 top: 50%;
 width: 160px;
 transform: translate(0, -50%);
 background-color: #fff;
 border-top: 1px solid var(--color-blue);
 border-left: 1px solid var(--color-blue);
 border-bottom: 1px solid var(--color-blue);
 padding: 10px;
 -webkit-box-shadow: 0 -2px 10px rgba(0, 0, 0, .6);
 -moz-box-shadow: 0 -2px 10px rgba(0, 0, 0, .6);
 box-shadow: 0 -2px 10px rgba(0, 0, 0, .6);
 z-index: 1100;
 transition: all .5s ease;
}

#compare-popup:hover
{
 right: 0;
}

#compare-popup-title
{
 margin: 10px 0;
}

#compare-del-all
{
 float: right;
 margin: 0 0 5px 5px;
 cursor: pointer;
}

.compare-title
{
 display: inline-block;
 padding: 3px 10px;
 color: #fff;
 font-size: 14px;
}

/*
#compare-popup > a
{
 display: inline-block;
 color: var(--color-blue);
 text-decoration: none;
}*/

.compare-item
{
 margin-bottom: 10px;
}

.compare-item-image
{
 display: inline-block;
 vertical-align: top;
 position: relative;
 width: 100px;
 height: 100px;
 overflow: hidden;
}

.compare-item img
{
 display: block;
 width: 100%;
 height: 100%;
}

.compare-item-del
{
 display: inline-block;
 vertical-align: top;
 cursor: pointer;
 margin-left: 5px;
}

.compare-item-name
{
 position: absolute;
 width: 100%;
 top: 0;
 color: #fff;
 font-size: 10px;
 padding: 5px;
 background-color: rgba(0, 0, 0, .5);
}

.compare-item-remove
{
 margin-left: 5px;
}

.compare-toggle {position: relative; height: 45px; background-color: var(--color-blue); font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase; color: #fff; font-weight: bold; margin-left: -23px; padding: 13px 10px 10px 55px; width: calc(100%+23px); cursor: pointer; border-top: 1px solid #fff; transition: background .5s;}
.compare-toggle:before {content: " "; display: block; position: absolute; top: 0; left: 0; width: 46px; height: 44px; background: url(/img/compare-block-close.png) no-repeat 0 center; transition: background .5s;}
.compare-toggle.closed:before {background: url(/img/compare-block-open.png) no-repeat 0 center; transition: background .5s;}
table.compare {padding: 0; border-spacing: 0; margin-bottom: 20px;}
table.compare-headline {margin-bottom: 0;}
table.compare-headline th {font-family: 'Roboto Condensed', sans-serif; font-weight: normal; font-size: 14pt; color: var(--color-blue);}
table.compare-headline th:first-child {text-transform: uppercase;}
table.compare td, table.compare th {font-family: 'Roboto Condensed', sans-serif;}
table.compare th {vertical-align: top; text-align: left; width: 240px; padding: 10px; font-size: 14px; font-weight: bold;}
table.compare tbody tr:nth-child(3n) {background-color: #eee;}
table.compare tbody td {width: 240px; vertical-align: top; padding: 10px; font-size: 11pt; text-align: left;}
table.compare th:first-child {font-size: 14pt; text-align: center; vertical-align: middle;}
table.compare tbody tr:nth-child(3n+2) td {border-top: 1px solid #ccc;}
table.compare tbody td:first-child {background-color: #eee; color: var(--color-blue); font-weight: bold; border-top: 1px solid #fff;}
table.compare tbody tr:nth-child(3n+2) td:first-child {border-top: 1px solid #fff;}
table.compare a.instit-list-image {display: inline-block; margin-right: 0;}
table.compare tr.nodiff-hide {opacity: .3;}
table.compare tbody td ul {list-style: none;}
table.compare tbody td ul > li {display: inline-block; margin-right: .5em; color: inherit;}
table.compare tbody td ul > li > span:before {content: " (";}
table.compare tbody td ul > li > span:after {content: ")";}
table.compare tbody td .instit-info {color: var(--color-blue);}
#compare-headline-names.fix {position: fixed; top: 100px; background-color: #fff; z-index: 1100; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, .4); -moz-box-shadow: 0px 2px 4px rgba(0, 0, 0, .4); box-shadow: 0px 2px 4px rgba(0, 0, 0, .4);}

/* trainings */

#training-categories > div
{
 display: inline-block;
 vertical-align: top;
 width: 21%;
 margin: 0 2% 20px 2%;
 text-align: center;
 color: #fff;
}

.button.training
{
 width: 100%;
 border-radius: 10px;
}

.training-category-preschool {background-color: #a42737;}
.training-category-primaryschool {background-color: #dabb2f;}
.training-category-secondaryschool {background-color: #4a79c8;}
.training-category-parents {background-color: #6a7684;}

#training-how-it-works > div
{
 display: inline-block;
 vertical-align: top;
 width: 30%;
 margin: 0 1.66666666% 20px 1.66666666%;
 padding: 10px;
 border-radius: 10px;
 text-align: center;
 background-color: var(--color-blue);
}

#training-how-it-works > div > div.number
{
 display: inline-block;
 margin: .5em auto 1em auto;
 border-radius: 50%;
 width: 2.5em;
 height: 2.5em;
 line-height: 2.5em;
 text-align: center;
 font-size: 22pt;
 font-weight: bold;
 background-color: #fff;
 color: var(--color-blue);
}

#training-how-it-works > div > p,
#training-how-it-works > div > h2
{
 color: #fff;
}

#training-categories > div > h2
{
 width: 100%;
 padding: 10px;
 font-size: 14pt;
 text-align: center;
 color: #fff;
 font-weight: normal;
 border-radius: 10px;
}

#training-categories ul
{
 list-style: none;
 width: 100%;
 text-align: left;
 margin: 0 0 .5em 0;
 padding: 1em;
 line-height: 2em;
 border-radius: 10px;
 text-align: center;
}

#training-categories ul > li
{
 cursor: pointer;
 color: #fff;
 line-height: 1.5em;
 margin-bottom: 1em;
}

#training-categories ul > li:hover
{
# color: var(--color-blue);
}


/* info */

#info-packages
{
 border-collapse: collapse;
 width: 100%;
}

#info-packages td,
#info-packages th
{
 font-family: 'Roboto Condensed', sans-serif;
 font-size: 10pt;
 border: 1px solid #ddd;
 padding: 5px;
}

#info-packages tbody tr:nth-child(3n)
{
 background-color: #eee;
}

#info-packages tbody tr:hover
{
 background-color: #ddd !important;
}

#info-packages th
{
 padding: 10px 5px;
 text-align: left;
 background-color: var(--color-blue);
 color: #fff;
}

/* registration */

#goodid-intro
{
 display: none;
}

#goodid-intro-open
{
 cursor: pointer;
}

/* ocokie popup */

#cookie-popup
{
 width: 100%;
 padding: 1em;
 text-align: center;
 position: fixed;
 bottom: 0;
 left: 0;
 background: #ccc;
 border-top: 1px solid var(--color-blue);
 z-index: 99999;
}

/* icons */

.icon-fav {background-image: url(/img/icon-fav.gif); width: 22px; height: 22px; display: inline-block;}
.icon-fav-school {background-position: 0px 0px;}
.icon-fav-developer {background-position: -22px 0px;}
.icon-fav-studentgroup {background-position: -44px 0px;}
.icon-fav-kindergarten {background-position: -66px 0px;}
.icon-fav-nursery {background-position: -66px 0px;}
.icon-fav-sport {background-position: -88px 0px;}
.icon-fav-school.active {background-position: 0px 22px;}
.icon-fav-developer.active {background-position: -22px 22px;}
.icon-fav-studentgroup.active {background-position: -44px 22px;}
.icon-fav-kindergarten.active {background-position: -66px 22px;}
.icon-fav-nursery.active {background-position: -66px 22px;}
.icon-fav-sport.active {background-position: -88px 22px;}
.icon-instit-compare {background-image: url(/img/icon-instit-compare.gif); width: 26px; height: 22px; display: inline-block;}
.icon-instit-compare-school {background-position: 0px 0px;}
.icon-instit-compare-developer {background-position: -26px 0px;}
.icon-instit-compare-studentgroup {background-position: -52px 0px;}
.icon-instit-compare-kindergarten {background-position: -78px 0px;}
.icon-instit-compare-nursery {background-position: -78px 0px;}
.icon-instit-compare-sport {background-position: -104px 0px;}

/* range */

input[type=range] {
 -webkit-appearance: none;
 margin: 5px;
 padding: 0;
 width: 125px;
 border: 0;
 background-color: transparent;
 vertical-align: middle;
}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
 width: 100%;
 height: 3px;
 cursor: pointer;
 animate: 0.2s;
 background: var(--color-blue);
}
input[type=range]::-webkit-slider-thumb {
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: var(--color-blue);
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  animate: 0.2s;
  background: var(--color-blue);
}
input[type=range]::-moz-range-thumb {
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: var(--color-blue);
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  border-width: 8px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #009999;
  border: .2px solid var(--color-blue);
}
input[type=range]::-ms-fill-upper {
  background: #009999;
}
input[type=range]::-ms-thumb {
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #009999;
  cursor: pointer;
 margin-top: 1px;
}
input[type=range]:focus::-ms-fill-lower {
}
input[type=range]:focus::-ms-fill-upper {
}

/* jquery.multiselect */

.ui-multiselect {padding: 5px 0 5px 3px; text-align:left; outline: none; font-size: 14px;}
.ui-multiselect span.ui-icon {float:right }
.ui-multiselect-single .ui-multiselect-checkboxes input {left:-9999px; position:absolute !important; top: auto !important;}
.ui-multiselect-single .ui-multiselect-checkboxes label {padding:5px !important }

.ui-multiselect-header {margin-bottom:3px; padding:3px 0 3px 4px; }
.ui-multiselect-header ul {font-size:0.9em }
.ui-multiselect-header ul li {float:left; padding:0 10px 0 0; }
.ui-multiselect-header a {text-decoration:none; }
.ui-multiselect-header a:hover {text-decoration:underline; }
.ui-multiselect-header span.ui-icon {float:left; }
.ui-multiselect-header .ui-multiselect-close {float:right; padding-right:0; text-align:right; }

.ui-multiselect-menu {display:none; padding:3px; position:absolute; text-align: left; z-index: 1200;}
.ui-multiselect-checkboxes {overflow-y:auto; position:relative; }
.ui-multiselect-checkboxes label {border:1px solid transparent; cursor:default; display:block; padding:3px 1px; }
.ui-multiselect-checkboxes label input {position:relative; top:1px }
.ui-multiselect-checkboxes label img {height: 30px; vertical-align: middle; padding-right: 3px;}
.ui-multiselect-checkboxes li {clear:both; font-size:0.9em; list-style: none; padding-right:3px; }
.ui-multiselect-checkboxes .ui-multiselect-optgroup {padding: 3px; }
.ui-multiselect-columns {display: inline-block; vertical-align: top; }
.ui-multiselect-checkboxes .ui-multiselect-optgroup a {border-bottom:1px solid; cursor: pointer; display:block; font-weight:bold; margin:1px 0; padding:3px; text-align:center; text-decoration:none; }

@media print
{
 .ui-multiselect-menu {display: none;}
}

/* media queries */

@media screen and (max-width: 1200px)
{
 ul#menu > li {margin: 0;}
}

@media screen and (max-width: 1020px)
{
 ul#menu {font-size: 12pt;}
 #trainings-popup {bottom: 50px;}
 #trainings-popup img {height: 150px;}
}

@media screen and (max-width: 820px)
{
 #menu-h {display: inline-block !important; width: 35px; height: 35px;}
 ul#menu {display: none; float: right; list-style-type: none; background-color: rgba(0, 0, 0, .8); width: 100%; position: absolute; top: 40px; right: 0; height: auto; z-index: 9999; padding: 10px 0 0 0; margin-right: 0;}
 ul#menu > li {display: block; text-align: right; padding: 5px 0; margin: 0 10px 5px 10px;}
 ul#menu > li > a {display: inline-block; text-decoration: none; text-transform: uppercase; color: #fff;}
 ul#menu > li:hover > a {color: var(--color-blue);}
 .mega-menu:hover, .mega-drop-down a:hover+.mega-menu {display: none !important;}
 nav#main-menu.fix {top: 10px;}
 #logo {width: 200px; padding-top: 5px;}
 #logo img {width: 100%;}
 header {-webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, .4); -moz-box-shadow: 0px 2px 4px rgba(0, 0, 0, .4); box-shadow: 0px 2px 4px rgba(0, 0, 0, .4); padding: 5px 0;}
 #headline {height: 300px; background-image: url(/content/headline-m.jpg);}
 .header-condensed {display: none !important;}
 #header-user > div {margin-left: 0;}
 #headline-slogan {top: 10%; font-size: 14pt;}
 #headline-instit-reg {bottom: 10%; font-size: 14pt;}
 .right-mobile-only {display: block;}

 .cols-2 {display: block; width: 100%;}
 .cols-2:first-of-type {margin-right: 0; margin-bottom: 1em;}
 .instit-list-image {width: 100px; height: 100px;}
 .instit-list-image > div {font-size: 12px;}
 #main {display: flex; flex-direction: column; margin-top: 60px;}
 .index #main {margin-top: 20px;}
 #content {width: 96%; margin: 0 auto 20px auto; order: 2;}
 #rightmap {width: 96%; margin: 0 auto 20px auto; float: none; clear: both; order: 1;}
 #righttop {width: 96%; margin: 0 auto 20px auto; float: none; clear: both; order: 2;}
 #right {width: 96%; margin: 0 auto; float: none; clear: both; order: 4;}
 #map-large {display: none;}
 #popup-content {width: 90%; max-width: 90%; margin: 3% auto;}

 .index-article, .index-article:nth-child(1), .index-article:nth-child(2) {width: 100%;}
 .index-article img {width: 30%;}
 .index-article > .index-article-text {width: 68%;}

 #training-categories > div {width: 46%;}
 #training-how-it-works > div {width: 96%; margin: 0 2% 20px 2%;}
 #training-how-it-works > div > div.number {margin: .5em auto .5em auto; width: 2em; height: 2em; line-height: 2em; font-size: 18pt;}
}

@media screen and (max-width: 680px)
{
 #logo {width: 150px;}
 table.compare th:first-child {font-size: 9pt;}
 #header-social {display: none !important;}
 #headline {margin-top: 45px;}
 #headline-slogan {top: 5%; font-size: 14pt;}
 #headline-instit-reg {bottom: 5%; font-size: 14pt;}
 #footer-barion-cards {float: none; display: block; margin-bottom: 1em;}

 #instit-map-fb {display: block;}
 #instit-map {margin-bottom: 40px;}
 #instit-fb {width: 100%; margin-left: 0;}

 .instit-nearby-item {width: 24%;}
 .instit-nearby-item:last-child {display: none;}
 .eval-answer-input.cols {column-count: 2;}
 .instit-list-image {display: none;}

 .membership-info {display: block;}
 #search-distance {display: block; margin: 1em 0;}

 #trainings-popup {right: 10px;}
 #trainings-popup > a > span {font-size: 12pt;}
 #trainings-popup img {height: 120px;}
}

@media screen and (max-width: 480px)
{
 .mobile-only {visibility: visible;}
 #content, #right {display: block;}
 #content {border-bottom: 20px;}
 #search-index-button > img {margin-right: 0; display: inline-block;}

 #compare-popup {width: 160px; top: auto; right: 0; bottom: 50px; transform: none;}
 .compare-item-image {width: 75px; height: 75px;}
 #compare-del-all {float: none; margin: 0;}
 #compare-popup.open #compare-mobile-open {margin-bottom: 10px;}
 #compare-popup-headline {border-bottom: none;}
 .compare-mobile-only {display: block;}
 .compare-desktop-only {display: none;}

 .range-value {display: block; margin-left: 0; margin-top: .5em;}
 .eval-answer-input > input[type=range] {max-width: 60%;}
 .user-children-instit-edit {margin-left: 0; float: none; display: block;}
 ul#children ul img, ul#user-instit img {float: left; vertical-align: top; clear: both;}
 ul#user-instit li, ul#children li {margin-bottom: 20px;}
 ul#favourites li {margin-bottom: 10px;}
 .tooltip > span {width: 250px;}

 #eval-popup-next-button {font-size: 12px;}
 #training-categories > div {width: 96%;}
 #trainings-popup > a > span {font-size: 10pt;}
 #trainings-popup img {height: 100px;}
}

@media screen and (max-height: 800px)
{
 .compare-item-image {width: 75px; height: 75px;}
}

@media screen and (max-height: 660px)
{
 .compare-item-image {width: 50px; height: 50px;}
}

@media screen and (max-height: 480px)
{
 #compare-popup {width: 160px; top: auto; right: 0; bottom: 50px; transform: none;}
 .compare-item-image {width: 75px; height: 75px;}
 #compare-del-all {float: none; margin: 0;}
 #compare-popup.open {width: 480px; height: 150px;}
 #compare-popup.open #compare-mobile-open {margin-bottom: 10px;}
 #compare-popup-headline {border-bottom: none;}
 .compare-mobile-only {display: block;}
 .compare-desktop-only {display: none;}
 .compare-item {display: inline-block; vertical-align: top;}
}

@media (min-width: 767px)
{
 #menu > li > a {display: block;}
 .mega-menu {position: absolute;}
}