@font-face     { font-family: lollipop; src: url(/css/fonts/lollipop.otf); }


body          { font-size: 100%; padding: 0; margin: 0; color: #000; }
h2           { font-size: 1.2em; margin-top: 0; margin-bottom: 10px;  }

#topbar         { transition: all 0.4s; position: fixed; top: 0; left: 0; right: 0; z-index: 100; width: 100%; }



.recent           { background-repeat: no-repeat; }

.r_escort.recent     { background-color: #fff;}
.r_escort .r_in      {  }

.r_massage.recent      { background-color: #fff;}
.r_massage .r_in       {  }

.r_privat.recent      { background-color: #fff;}
.r_privat .r_in       {  }

.r_bdsm.recent      { background-color: #fff;}
.r_bdsm .r_in       {  }


.r_club.recent      { background-color: #fff;}
.r_club .r_in       {  }

.recent h2 a          { color: #000; text-transform: uppercase; letter-spacing: 2px; font-weight: 400; font-size: 38px; }
.recent h2 a:hover    { text-decoration: underline }

.sheet         { text-decoration: none;}
.sheet:hover   { }

.sheet .asp         {  }
a.sheet:hover .asp   { }

.r_escort .sheet       { background-color: #fff ;  }
.r_escort .sheet:hover { background-color: #fff;  }
.r_escort .foot        { background-color: #fff }
.r_escort .foot a      { color: #000 }

.r_massage .sheet       { background-color: #fff; }
.r_massage .sheet:hover { background-color: #fff; }
.r_massage .foot        { background-color: #fff }
.r_massage .foot a      { color: #000 }


.r_privat .sheet       { background-color: #fff; }
.r_privat .sheet:hover { background-color: #fff ; }
.r_privat .foot        { background-color: #fff }
.r_privat .foot a      { color: #000  }

.r_bdsm .sheet       { background-color: #fff; }
.r_bdsm .sheet:hover { background-color: #fff ; }
.r_bdsm .foot        { background-color: #fff }
.r_bdsm .foot a      { color: #000 }

.r_club .sheet       { background-color: #fff; }
.r_club .sheet:hover { background-color: #fff; }
.r_club .foot        { background-color: #fff }
.r_club  .foot a      { color: #000 }



.recent h2 a       { text-decoration: none }


.recent .it          { padding: 10px 10px 10px 0; float: left; }
.recent .sheet       { }
.recent .foot        { padding: 2px 5px; text-align: right;  margin: 0 10px; }



.sheet .asp         { background: #d0d0d0; overflow: hidden  }
.sheet .are img     { line-height: 1.2em; color: #666 }

.sheet         { display: block; line-height: 0;    }
.sheet:hover   { background-color: #dedede }
.sheet  p      { line-height: 1.4em; background: #d00 }


.sheet .o_escort img { width: 24px ;height: 24px }
.sheet .o_phone img  { width: 36px ;height: 36px }

.slider    { padding: 0 5px; line-height: 1.4em; width: 100%; border-top: 1px solid #000; background-image: url(../img/overlay.png); color: #fff;  }


a.params             { padding: 0 10px; line-height: 2em; border-style: solid; border-color: #deddd7; background-color: #fff; color: #000; display: block; text-decoration: none; transition: box-shadow 0.3s linear}
a.params:hover       {  }



a.params b               { }
a.params strong          { line-height: 1em; white-space: nowrap; font-weight: normal; display: inline-block; background-color: #336c84; color: #fff; padding: 2px 5px 4px 5px; border-radius: 3px 3px; text-shadow: 0 0px 1px #fff}





#geo                { float: left; }
#geo .load, #geo a, #geo .geo  { padding-right: 10px; }
#geo .load img, #geo .geo img { width: 36px; height: 36px; border: 0; vertical-align: middle}
#geo a               { text-decoration: none }

#geo .geo           { display: none; }
#geo .detecting:hover, #geo .load:hover { cursor: wait }
#geo .denied:hover, #geo .disabled:hover, #geo .ko:hover    { cursor: help}





#girls              { }
#girls .it          { float: left; padding: 0 10px 10px 0; color: #000; }
#girls .sheet       { background-color: #deddd7; padding: 5px; }
#girls .sheet:hover { background-color: #deddd7; padding: 5px; }
#girls .foot        { text-align: right; padding: 2px 5px; margin: 0 5px; white-space: nowrap; overflow: hidden}
#girls .foot p      { float: left; color: #000; font-weight: bold }

#dir              {  }
#dir .it          { float: left; padding: 0 10px 10px 0; }
#dir .sheet       { background-color: #deddd7; padding: 5px; }
#dir .sheet:hover { background-color: #deddd7; padding: 5px; }
#dir .foot        { text-align: right; padding: 2px 5px; margin: 0 5px; white-space: nowrap; overflow: hidden}
#dir .foot p      { float: left; color: #000; font-weight: bold }

#empty            { border-style: solid; border-color: #E4E4E4; background: #ffc; padding: 10px; }

#seekbar a      { background: #deddd7; color: #000; display: inline-block; transition: all 0.2s linear; padding: 5px 10px; text-decoration: none;  }
#seekbar a:hover, #seekbar a.selected { background: #696864; color: #FFF;  }


#cities                        { border-top: 1px solid #999;  }
#cities a                      { color: #666; text-decoration: none; display: inline-block; margin-right: 10px }
#cities a:hover, #cities a.sel { color: #eb5d74 }



#thumbs              { text-align: center; background: #deddd7; padding: 10px; white-space: nowrap; overflow-y: hidden; }
.thumb, .thumb_sel   { display: inline-block; line-height: 0; margin: 0 5px 0 0; }
.thumb img           { border: 3px solid #c8c6bd; background: #f0f0f0; color: #000; }
.thumb_sel img       { border: 3px solid #000; background: #f0f0f0; color: #000;  }




#info        {  }
#data, #services, #program, #facilities        { background-color: #fff; margin-bottom: 20px; }
#data        { line-height: 34px; padding: 10px 0; }
#data .l     { padding-right: 20px; width: 40%; text-align: right;  float: left;}
#data .r     { padding-left: 20px;  width: 60%; float: left; border-left: 1px solid #d0d0d0;  }

#data .maplink, #data .email, #data .phone, #data .escort  { line-height: 1.2em; text-transform: uppercase; letter-spacing: 2px; }
#data .maplink, #data .email { padding: 2px 15px; letter-spacing: 1.5px }

#data img       {  width: 20px; height: 20px; margin-right: 5px; vertical-align: middle;}


#data .phone      { display: inline-block;  margin-right: 10px;  }



#data .maplink    { background: #eb5d74;  color: #fff; text-decoration: none; border: 2px solid #eb5d74; display: inline-block; margin-left: 10px }
#data .maplink:hover {  background: #eb5d74 }

#data .email      { background: #000; color: #eb5d74;  display: inline-block; text-decoration: none; border: 2px solid #000; }
#data .email:hover {  background: #000 }



#data .escort     { display: inline-block; color: #e8596d; font-weight: bold  }

#data, #services, #program, #facilities    { position: relative;  }
#services p, #program p, #facilities p { background: #deddd7; color: #000; display: inline-block; text-transform: uppercase; letter-spacing: 2px; }


#result .label  { background: #eb5d74; color: #fff; }

#additional   {  border-style: solid; border-color: #deddd7; clear: both; background: #fff }


#about       { clear: both; margin-bottom: 20px; line-height: 2em;  }

#about a     { background-color: #eb5d74; line-height: 1.2em; color: #fff; display: inline-block; white-space: nowrap; padding: 2px 6px; text-decoration: none; letter-spacing: 1.5px; margin: 0 5px }
#about a:hover { background-color: #eb5d74 }





#bottom           {  }


#links                 { margin-bottom: -5px;}
#links div a           { text-decoration: none; color: #e9e6dd; font-family: 'Poppins', sans-serif; font-size: 14px;}
#links div a:hover     { color: #e8596d; }

#disclaimer           { background: #000; color: #f6f4ec; margin-bottom: -5px; }


#foot                  { color: #fff; }
#foot a                { color: #fff }


#lang a          { display: inline-block; color :#fff; text-decoration: none; padding: 10px 15px ; border: 1px solid #e8596d; background: #000; text-transform: uppercase; letter-spacing: 2px;
}


#lang a:hover {
  background: #000;

}




#content     { line-height: 1.4em; background-color: #fff;  }

.geo_help   { }
.geo_help p  { padding: 10px 0 }
.geo_help img { vertical-align: middle; margin-right: 10px; width: 36px; height: 36px;   }




#search .field              { }
#search .cell               { }
#search .ncell              { }
#search .nr                 { }

#search .topic              { color: #eb5d74; border-bottom: 1px solid #eb5d74}


#search input[type="text"], #search label, #search select, #search .nr button[type="number"], #search button[type="submit"], #search button[type="button"]
{ height: 42px;  font-size: 16px; font-family: Arial, Verdana, Tahoma, sans-serif; border-width: 2px; border-style: solid;   }

#search label      { padding: 2px 10px 2px 0; line-height: 36px; white-space: nowrap; overflow: hidden; display: block; cursor: pointer}
#search label img  { width: 36px; height: 36px; margin-right: 5px;  float: left; }
#search label p    { display: inline-block; line-height: 2.2em}

#search .button input       { display: none }



#search select, #search input[type="text"]               { width: 100%; padding-left: 10px; padding-right: 10px; }
#search option              { background: #fff; color: #000;  padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px;  }

#search button[type="submit"], #search button[type="button"] { width: 100% }

#search input[type="number"] { box-shadow: none }
#search .button label, #search select, #search input[type="number"][data-chosen=""]  { background-color: #deddd7; border-color: #deddd7; color: #000 }
#search .button.chosen label, #search select.chosen, #search input[type="number"]  {
	color: #000;
	border-color: #82817c;
	background-color: #82817c;

}
#search .button.chosen label { background-color: #82817c; border-color: #82817c; color: #fff; }
#search input[type="text"]        { background-color: #fff; border-color: #deddd7; color: #000 }
#search input[type="text"].chosen { background-color: #82817c; border-color: #82817c; color: #fff; text-shadow: 0 0 3px #fff;}
#search .button:hover label  { background-color: #82817c; color: #fff; border-color: #82817c; }
#search .button .checked            { display: none }
#search .button .unchecked          { display: block}
#search .button.chosen .unchecked   { display: none }
#search .button.chosen .checked     { display: block}

#search .nr                           { width: 50%; padding-right: 10px; float: left; }
#search .nr input[type="number"]      { width: 100%; margin: 0; padding: 10px }




#search button[type="submit"] { border-color: #eb5d74; color: #fff;
	                             background: #eb5d74;; 
                             	}

#search button[type="button"] { background-color: #000; color: #fff; border-color: #000}

button[type="submit"], button[type="button"] { cursor: pointer }

body, p, ul, li { margin: 0; padding: 0; }
a, div, p, ul, li, form, input, select, textarea, label, h1, h2  { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

a                  { color: #000;}
a img { border: 0 }
a:hover, a.sel     { text-decoration:none; }

.hi, .sel     { color: #c00; }
.mid          { color: #69c; }
.lo           { color: #909090; }


.nb              { border: 0 }
.tc              { text-align: center; }
.lh0             { line-height: 0; }
.di              { display: inline }
.dn              { display: none }
.wn              { white-space: nowrap }
.oh              { overflow: hidden }
.w100            { width: 100%; height: auto;}
.h100            { height: 100%; width: auto;}
.ttl             { text-transform: lowercase }
.pr              { position: relative }

.cf:before, .cf:after { content:""; display:table; }
.cf:after             { clear:both; }
.cf                   { zoom:1; }

.asp     { position: relative; line-height: 0;  }
.rat     { width: 100%; border: 0}
.are     { position: absolute; top: 0; bottom: 0; right: 0; left: 0; } 

.o_name   { position: absolute; top: 3px; left: 5px; font-size: 14px; font-weight: bold; line-height: 1.2em; color: #fff; text-transform: uppercase; letter-spacing: 2px; text-shadow: 1px 1px 1px #000;}
.o_phone  { position: absolute; top: 3px; right: 3px; }
.o_escort { position: absolute; top: 0px; right: 0;  }
.o_b    {  color: #fff; text-shadow: 1px 1px 1px #000; padding: 2px 10px 2px 0; line-height: 1.2em; position: absolute; bottom: 0; left: 0; right: 0; text-align: right; }


#search  input[type="radio"] ,input[type="checkbox"] {
	 display: none;
}

#search input[type="radio"] + label,input[type="checkbox"]+ label {
	/*
	width: 47%;
	float: left;

	 */
	padding-right: 10px;
	padding-left: 40px;
	margin-right: 10px;
	margin-bottom: 10px;
	background-color: #deddd7;
	border-color: #deddd7;
	color: #000;
	background-image: url("/static/img/ico_diode_off.png");
	background-position: left center;
	background-size: auto 100%;
	background-repeat: no-repeat;
}

#search input[type="radio"]:checked + label {
	background-color: #82817c;
	color: #fff;
	border-color: #82817c;
	background-image: url("/static/img/ico_diode_on.png");

}
#search .half  input[type="radio"] + label{
	width: 47%;
	float: left;
}


#search .ikonnow input[type="checkbox"]+ label {
	background-image: url("/static/img/form_phone_unchecked.png");
	padding-left: 40px;

}

#search .ikonnow input[type="checkbox"]:checked + label {
	background-image: url("/static/img/form_phone_checked.png");
	 padding-left: 40px;

}

#search .ikonescort input[type="checkbox"]+ label {
	background-image: url("/static/img/ico_escort_unchecked.png");
	padding-left: 40px;

}

#search .ikonescort input[type="checkbox"]:checked + label {
	background-image: url("/static/img/ico_escort_on.png");
	padding-left: 40px;

}

/* schovani polozky protoze prehazi, ale diky tomu ze hair jsou nepovinne, tak ji symfony generuje*/

#search input[id="search_subjects_params_hairs_placeholder"] + label[for=search_subjects_params_hairs_placeholder]{
	display: none;
}
#search input[id="search_facilities_params_type_placeholder"] + label[for=search_facilities_params_type_placeholder]{
	display: none;
}

/* DISCLAIMER */
#over           { background: #000; z-index: 1000; opacity: 0.7; position: fixed; top: 0; left: 0; width: 100%; height: 100%; }
#page           { text-align: center;  z-index: 1100; position: absolute; top: 5%; left: 0; right: 0; bottom: 0; }
#entry          { max-width: 680px; padding: 30px 20px 10px 20px; display: inline-block;  margin: 0 5%; background-color: #000000; color: #ffffff; border: 5px solid #333; border-radius: 6px;  }
#entry .mb      { margin-bottom: 15px;}
#entry .link    { background: #eb5d74; color: #fff; text-decoration: none; border: 2px solid #eb5d74;  display: inline-block; padding: 15px; margin: 10px 20px 20px 0; cursor: pointer; }
#entry a        { color: #fff;}
#entry .text-left { text-align: left; }
#entry .box     { color: #000; background-color: #fff; padding: 10px;}
#entry ul       { padding-left: 25px;}

/* desktop.css*/

#resolution           { background-color: #fff; color: #000}
#resolution strong    { display: none }
#resolution span:after  { content:"0: non media query enabled up to 359" }

html          { background-color: #f8f5f0; margin: 0; padding: 0 }
body          { font-family: 'Oswald', sans-serif; margin: 0; padding: 0; padding-top: 80px !important; }

#wrap        { min-width: 320px; max-width: 1280px; margin: 0 auto; padding-top: 50px; }
@media all and (max-width: 320px){
	#wrap    { padding-top: 80px; }
}

@media (min-width: 351px) and (max-width: 376px) {
	#wrap    { padding-top: 80px; }
}

#topbar       { }
#top          { background-color: #000; min-width: 320px; max-width: 1280px; padding: 5px 0 5px 10px; margin: 0 auto; }

#nav { display:flex;}
#nav > li:nth-child(1) {font-weight: bold;}
#nav > li:nth-child(1) > a { display: flex; align-items: center;}
#nav > li:nth-child(1) > a > span:nth-child(1) { }


#logo        { line-height: 0; float:left; }
#logo img    { height: 20px; width: auto; margin-bottom: 10px; margin-top: 5px;}

#nav                               { float: right; padding-top: 3px; }
#nav li                            { display: inline-block; list-style-type:none;  }
#nav li a                          { color: #e9e6dd; margin-right: 10px; padding: 6px 10px; display: block; text-decoration: none;
	background: #eb5d74;

}
#nav li a:hover, #nav li a.sel     { }
#nav li a.sel  { box-shadow: none }

#main                 { }


#header               { background-color: #000; margin-bottom: 10px; padding: 5px 10px; text-transform: uppercase; letter-spacing: 2px; font-weight: 200;}
@media all and (min-width: 1024px) {
	#header               { background-color: #000; margin-bottom: 5px; padding: 5px 10px; text-transform: uppercase; letter-spacing: 2px; font-weight: 200; height: 150px; background-image: url(../img/header.webp); background-position: center right; background-repeat: no-repeat;}
}
h1                    { margin: 0; font-size: 1.4em;  font-weight: normal; color: #fff;}
a.params              { margin: 0 10px 20px 10px; border-width: 2px; border-radius: 3px; }
a.params img          { float: left; }
.h1-home         { margin-top: 20px }
.color           { color: #eb5d74; }

#intro             { color: white; background-color: #6a6f6e; font-family: 'Poppins', sans-serif; font-size: 14px;}
#intro div        {  padding: 10px;}
#intro img         { float: right; }
#intro a         {color: #e9e6dd; }

.table { display: table; }
.table-cell { display: table-cell;height: 100%; vertical-align: top; }

.introbanner {
    text-align: center;
    max-width: 320px;
    margin: 0 auto;
}

.introbanner a {
    display: inline-block;
    background-color: #deddd7;
    padding: 5px;
}
.introbanner .small { font-size: 0.8em; text-align: left; width; 100%; padding-left: 5px;}

.intro #intro.table-cell { width: 100%; display: block;}
.intro .banner.table-cell {width: 100%; display: block;}
.intro.table { width: 100%; }


.recent            { padding-left: 10px; margin-bottom: 20px }
.recent h2         { margin-left: -10px; padding: 5px 10px }
.r_escort h2       { background-color: #fff}
.r_massage h2      { background-color: #fff }
.r_privat h2       { background-color: #fff }
.r_bdsm h2         { background-color: #fff  }
.r_club h2         { background-color: #fff  }


.recent .perex { font-family: 'Poppins', sans-serif; font-size: 14px; padding-right: 15px; padding-bottom: 15px; }

.slider    { position: absolute; bottom: 0; left: 0; right: 0}

#bar            { margin: 0 10px 20px 10px; }

#bar .r         { float: right }
#bar .r a, #geo .load, #geo .geo, #sort     { color: #000; background-color: #deddd7; border-color: #deddd7; height: 35px; font-size: 16px;  }
#bar .r a       { display: block; text-decoration: none}
#bar .r a img   { width: 36px; height: 36px; vertical-align: middle; }
#bar .r a span  { display: none}


#sort             { float: left;  margin-right: 10px; overflow: hidden  }
#sort select      { width: 140px; height: 36px; border: 0; background-color: transparent; }
#sort a           { display: block; height: 36px; text-decoration: none; color: #000; line-height: 32px; padding: 0 10px }

#geo .sel, #sort.sel               { background: #E0F5FF; box-shadow: 1px 1px 2px #999 inset}


#girls                   { padding-left: 10px }
.recent .it, #girls .it  { width: 50%; }

#dir                     { padding-left: 10px }
#dir .it                 { width: 100% }

#empty       { margin: 0 10px 20px 10px; border-width: 2px;  }


#seekbar          { }
#counts           { text-align: center; margin-bottom: 10px }
#pages            { padding: 0 10px; margin-bottom: 10px}
#pages div        { width: 50%; float: left;  }
#pages .l         { float: left; padding-right: 10px }
#pages .r         { float: right; padding-left: 10px }
#pages a          { display: block; text-align: center }

#cities          { padding: 10px }
#cities a        { margin: 0 10px 10px 0}

#content         { font-family: 'Poppins', sans-serif; font-size: 14px; padding: 20px 10px 20px 10px; line-height: 1.6em; }
.app            { margin-bottom: 20px }
.app a          { max-width: 50%; display: block; float: left; padding-right: 10px; padding-bottom: 10px; line-height: 0; }
.app a img      { width: 100%;   }

#result          { }
#gallery         { padding: 0 10px; margin-bottom: 20px;  }

#photo         { }
#frame         { margin-bottom: 10px}
.scale         { position: relative; line-height: 0;  }
.scale img     { border: 0;  }
.area          { text-align: center; display: block; line-height: 0; }
.area img      { cursor: pointer; }

#photo .holder     { display: none }
.area              { }
.area img          { width: 100% }


#thumbs        { }

#data        { line-height: 40px; }
#data .phone    { padding: 5px 10px; text-decoration: none;  margin-bottom: 10px; }



.phone.on   {
	background: #9bdeac;
}
a.phone.on:hover   {
	background: #9bdeac;
}

.phone.off { background: #94938d; color: #fff; border: 1px solid #94938d; }

.label  {  position: absolute; text-align: center; top: -12px; right: 10px; padding: 3px 10px; font-size: 14px; line-height: 18px;}


#services, #program, #facilities       { padding: 20px 0 10px 10px ; }
#services p, #program p, #facilities p { margin: 0 10px 10px 0;  padding: 3px 10px;}

#additional { border-width: 5px 0; padding: 10px; font-family: 'Poppins', sans-serif; font-size: 14px;}


#extra       { font-size: 0.8em; padding: 10px; color: #333 }
#extra .l    { margin-bottom: 10px }
#extra .r    { margin-bottom: 10px }

#search                     { padding-left: 10px }
#search .topic              { margin-bottom: 10px; margin-right: 10px; }

#search .field              { margin-bottom: 20px; }
#search .cell               { width: 50%; float: left; padding-right: 10px; margin-bottom: 10px}
#search .ncell              { width: 50%; float: left;  }

#search .button label               { text-align: center }
#search .button .checked            { display: none }
#search .button .unchecked          { display: none }
#search .button.chosen .unchecked   { display: none }
#search .button.chosen .checked     { display: none }

.bg-dark      { background-color: #000;}

#links            { padding: 50px 10px 50px 10px; background-color: #000; background-image: url(../img/footer.webp); background-position: top center; background-repeat: no-repeat; background-size: cover}
#links div        { padding-bottom: 20px }
#links div h2     { clear: both; font-weight: normal; margin-bottom: 10px; padding-top: 10px; text-transform: uppercase; letter-spacing: 2px; color: #fff; font-size: 16px;}
#links div a      { display: block; width: 50%; float: left; margin-bottom: 10px; }



#disclaimer           { padding: 20px 10px 15px 10px; color: #e9e6dd; font-family: 'Poppins', sans-serif; font-size: 12px;}
#disclaimer img       { width: 150px; height: auto; float: left; margin-right: 20px; font-family: 'Poppins', sans-serif; font-size: 12px;}

#foot                 { padding: 10px 10px 0 10px}
#foot .l              { margin-bottom: 10px; margin-top: 10px; }
#foot .r              { margin-bottom: 10px; text-align: left }

#app                  { color: #fff; display: inline-block; float: left; margin-bottom: 80px; text-decoration: none}
#app:hover            {  }
#app img              { vertical-align: middle; margin-right: 10px; width: 36px; height: 36px }
#lang                 { float: none; text-align: right; padding: 0 10px; margin-bottom: 20px; }
#lang a 				{ }


.mb { margin-bottom: 20px; }

@media all and (min-width: 360px) {
	#resolution { background-color: #66FF33; color: #000}
	#resolution strong      { display: none }
	#resolution span:after  { content:"1: better smartphones 360 and up" }

	#search .button label               { text-align: left}
	#search .button .checked            { display: none }
	#search .button .unchecked          { display: block}
	#search .button.chosen .unchecked   { display: none }
	#search .button.chosen .checked     { display: block}


}



@media all and (min-width: 480px) {
	#resolution { background-color: #FFFF33; color: #000}
	#resolution span:after  { content:"2: cool smartphones 480 and up portrait" }

	#bar .r a       { padding: 0 10px 0 5px}
	#bar .r a img   { margin-right: 5px}
	#bar .r a span  { display: inline}

	#sort select      { width: auto }

	.recent .it { width: 33.333333%; }
	#girls .it  { width: 33.333333%; }

	#dir .it                 { width: 50% }

	#extra .l    { float: left; }
	#extra .r    { float: right }

	#links div        { width: 50%; float: left;  }
	#links div a      { width: auto; float: none; }






}

@media all and (min-width: 600px) {
	#resolution { background-color: #009; color: #fff}
	#resolution span:after  { content:"3: nexus portrait 600 and up; better smartphones landscape" }



	#photo .holder   { display: block; width: 100%;  }
	.area            { position: absolute; top: 0; bottom: 0; right: 0; left: 0; }
	.area img        { height: 100%; width: auto }

	#data, #services, #program, #facilities { overflow: hidden;  }
	#services, #program, #facilities    { padding-right: 60px }
	.label  { width: 140px; top: -25px; right: -70px; padding: 5px 40px; font-size: 14px; line-height: 18px;
		transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform-origin: left top;
		-ms-transform-origin: left top;
		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-o-transform-origin: left top;
	}

	#search .field              { width: 50%; float: left; padding-left: 0; }
	#links div        { width: 25%; }

	#foot .l              { float: left}
	#foot .r              { float: right}

.intro #intro.table-cell { width: 60%; display: table-cell; border-top: #f8f5f0 solid 1.2em;}
.intro .banner.table-cell {width: 40%; display: table-cell;}
}



@media all and (min-width: 768px) {
	#resolution { background-color: #c00; color: #fff}
	#resolution span:after  { content:"4: Ipad portrait, Nexus landscape 768 and up" }

	.recent .it { width: 25%; }
	.recent .it.of_4, .recent .it.of_5 { display: none }

	#girls .it  { width: 25%; }
	#dir .it                 { width: 33.333333% }

	#gallery         { width: 60%; float: left; padding-right: 20px}
	#photo .holder   { display: block; width: 100%;  }
	.area            { position: absolute; top: 0; bottom: 0; right: 0; left: 0; }
	.area img        { height: 100%; width: auto }

	#data, #services, #program, #facilities {  border-radius: 5px 0 0 5px }

	#info           { width: 40%; float: left }

	.app a          { max-width: 25%; }


.intro #intro.table-cell { width: 75%;}
.intro .banner.table-cell {width: 25%;}
}



@media all and (min-width: 1024px) {
	#resolution { background-color: #FF00CC; color: #fff}
	#resolution span:after  { content:"5: Ipad landscape 1024 and up to 1279" }

	.recent .it { width: 20%; }
	.recent .it.of_4 { display: block}

	#girls .it  { width: 16.666666%; }
	h1 { font-size: 2.5em; }

	#top          { background-color: #000; min-width: 320px; max-width: 1280px; padding: 5px 0 5px 10px; margin: 0 auto; }
    #intro {font-size: 1em;}
}

@media all and (min-width: 1280px) {
	#resolution { background-color: #f60; color: #000}
	#resolution span:after  { content:"6: 1280 cap" }


	#wrap { border-width: 0 1px; border-style: solid; border-color: #d0d0d0}


	.recent .it      { width: 16.666666%; }
	.recent .it.of_5 { display: block}

	#dir .it                 { width: 25% }

	#gallery         { width: 55%; }
	#info            { width: 45%; }

	#top          { background-color: #000; min-width: 320px; max-width: 1280px; padding: 5px 0 5px 10px; margin: 0 auto; border-right-width: 1px; border-right-style: solid; border-right-color: #d0d0d0; border-left-width: 1px; border-left-style: solid; border-left-color: #d0d0d0;}
}

@media all and (max-width: 380px){
	#register {display:none;}
	#nav > li:nth-child(1) > a > span:nth-child(1) > span { display:none;}
}
@media all and (max-width: 350px){
	#nav li a { margin-right: 2px; padding: 10px 5px;}
}

.asp img.w100 {
  height: auto;
  aspect-ratio: 180 / 260; 
}

#cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.9);
  color: white;
  padding: 15px;
  z-index: 9999;
  box-sizing: border-box;
  text-align: center;
}
#cookie-banner p {
  margin: 0;
}
#cookie-banner button {
  margin-left: 15px;
}