/* directory/style.css - styling for the /directory pages (Yahoo-style topic directory). */

body{font-family:"Times New Roman",Times,serif;font-size:17px;margin:0;background:#fff;color:#000;-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden;}
header{border-bottom:1px solid #ddd;}
.header-inner{max-width:640px;margin:0 auto;padding:16px 24px 12px;display:flex;align-items:center;justify-content:space-between;position:relative;}
.dir-title{font-family:Roboto,sans-serif;font-size:24px;font-weight:700;margin:0;}
.dir-title a:last-child{position:absolute;left:50%;transform:translateX(-50%);font-family:"Google Sans","Roboto",sans-serif;font-size:2rem;font-weight:500;letter-spacing:0;line-height:1;}
.dir-font-btn{font-family:"Roboto",sans-serif;font-size:18px;font-weight:700;color:#888;background:none;border:1px solid #ccc;border-radius:4px;width:34px;height:34px;cursor:pointer;line-height:1;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.dir-font-btn:hover{color:#555;border-color:#aaa;}
html.dir-sans body{font-family:"Roboto","Google Sans",sans-serif;}
html.dir-sans .dir-font-btn{font-family:"Times New Roman",Times,serif;}
html.dir-sans .dir-search-bar{display:flex;max-width:378px;margin-left:auto;margin-right:auto;background:#fff;border:1px solid #ebebeb;border-radius:24px;overflow:hidden;box-shadow:0 1px 6px rgba(0,0,0,0.08);}
html.dir-sans .dir-search-bar:focus-within{box-shadow:0 2px 12px rgba(0,0,0,0.14);border-color:#ccc;}
html.dir-sans .dir-search-bar input[type="text"]{flex:1;min-width:0;border:none;outline:none;padding:8px 16px;font-size:15px;background:transparent;color:#202124;}
html.dir-sans .dir-search-bar button{border:none;background:#4285F4;color:#fff;padding:8px 18px;font-size:15px;font-weight:500;cursor:pointer;border-radius:0;margin-left:0;flex-shrink:0;align-self:stretch;}
html.dir-sans .dir-search-bar button:hover{background:#3367d6;}
.dir-title a{color:#4285F4;text-decoration:none;}
.dir-home-link{display:inline-flex;align-items:center;margin-right:8px;margin-left:-20px;vertical-align:text-bottom;position:relative;top:-3px;transform:translateX(-16px);}
.dir-home-icon{width:22px;height:22px;display:block;}
.dir-home-brand{display:inline-flex;flex-direction:column;align-items:center;line-height:1.1;font-size:13px;font-weight:700;font-family:"Google Sans","Roboto",sans-serif;color:#4285F4;text-decoration:none;vertical-align:middle;margin-right:10px;}
.dir-home-brand:hover{opacity:.75;text-decoration:none;}
main{max-width:640px;margin:0 auto;padding:20px 24px 24px;}
h1{font-size:20px;margin:0 0 8px;}
.search-heading{color:#444;font-size:16px;font-weight:400;margin:0 0 8px;}
.desc{color:#444;font-size:15px;margin:0 0 20px;}
.dir-search{text-align:center;margin:0 0 24px;}
.dir-search input[type="text"]{font-family:inherit;font-size:15px;padding:6px 10px;width:30ch;border:1px solid #ccc;}
.dir-search button{font-family:inherit;font-size:15px;padding:6px 14px;margin-left:6px;border:1px solid #ccc;background:#f4f4f4;cursor:pointer;}
.dir-search button:hover{background:#eaeaea;}
.dir-search-scope{display:block;margin-top:8px;font-size:14px;color:#444;cursor:pointer;}
.dir-search-scope input{margin-right:6px;}
.cat-table{border-collapse:collapse;width:100%;}
.cat-table td{vertical-align:top;}
.cat-table td.col-right{padding-left:48px;}
.cat-table ul{list-style:disc;margin:0;padding-left:18px;}
.cat-table li{margin-bottom:14px;}
a.cat-name{font-weight:700;font-size:18px;color:#0000EE;text-decoration:underline;}
a.cat-name:hover{color:#551A8B;}
.teaser{font-size:14px;}
.teaser a{color:#0000EE;text-decoration:underline;}
.teaser a:hover{color:#551A8B;}
.child-list{list-style:disc;margin:0;padding-left:18px;}
.child-list li{margin-bottom:8px;}
.child-desc{color:#444;font-size:15px;}
.breadcrumb{font-size:14px;color:#444;margin:0 0 16px;}
.breadcrumb a{color:#0000EE;text-decoration:underline;}
.breadcrumb a:hover{color:#551A8B;}
.cat-result-list{list-style:none;margin:0 0 16px;padding:0;}
.cat-result-list li{margin-bottom:8px;}
a.cat-result,a.cat-result-sub{color:#0000EE;text-decoration:underline;}
a.cat-result:hover,a.cat-result-sub:hover{color:#551A8B;}
a.cat-result{font-weight:700;}
.crumb-1{font-size:18px;}
.crumb-2{font-size:16px;}
.cat-result-desc{color:#444;font-size:16px;}
.search-divider{border:none;border-top:1px solid #ddd;margin:20px 0;}
.empty{color:#666;}
.wide-section{width:75vw;max-width:75vw;margin:16px auto 24px;overflow-x:auto;}
.site-group-label{font-size:15px;font-weight:700;color:#444;margin:20px 0 8px;padding-bottom:4px;border-bottom:1px solid #ddd;}
.site-list{list-style:none;margin:0;padding:0;}
.site-list-featured{margin-bottom:20px;}
.site-list li{white-space:nowrap;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid #eee;}
a.site-name{font-weight:700;font-size:16px;color:#0000EE;text-decoration:underline;}
a.site-name:hover{color:#551A8B;}
.site-desc{color:#444;font-size:16px;display:inline-block;max-width:calc(75vw - 10rem);overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;white-space:nowrap;}
.new-this-week-label{font-style:italic;font-size:15px;color:#2563eb;margin:0 0 6px;}
.new-this-week-box{background:#f0f7ff;border:1px solid #93c5fd;border-radius:6px;padding:14px 18px;margin-bottom:20px;}
.new-this-week-list{list-style:none;margin:0;padding:0;}
.new-this-week-list li{white-space:nowrap;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid #dbeafe;}
.new-this-week-list li:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none;}
.mod-showcase{border:2px dashed #9B7FD4;border-radius:14px;padding:20px 32px;text-align:center;margin:20px 0 24px;display:inline-block;min-width:200px;cursor:default;position:relative;background:#F3EEFF;}
.mod-showcase-title{font-size:18px;font-weight:700;color:#4A2080;}
.mod-showcase-sub{font-size:15px;color:#7B5AAA;margin-top:6px;}
.mod-showcase-tip{display:none;position:absolute;background:#333;color:#fff;font-size:13px;padding:8px 12px;border-radius:8px;width:220px;left:50%;transform:translateX(-50%);top:calc(100% + 8px);z-index:100;line-height:1.4;text-align:left;}
.mod-showcase:hover .mod-showcase-tip,.mod-showcase.tip-open .mod-showcase-tip{display:block;}
.dir-footer{text-align:center;font-size:13px;color:#666;padding:20px 16px 12px;margin-top:20px;}
.dir-footer-tagline{font-size:13px;color:#666;margin:0 0 0;}
.dir-footer-links{border-top:1px solid #ddd;padding-top:10px;margin-top:10px;}
.dir-footer a{color:#0000EE;text-decoration:underline;margin:0 2px;}
.dir-footer a:hover{color:#551A8B;}
.dir-footer-break{display:none;}
.fb-form{max-width:calc(50vw + 10rem);min-width:280px;margin:0 auto;background:#f5f8fc;border:1px solid #b8cfe8;border-radius:8px;padding:24px 28px;}
.fb-form h1{margin-top:0;}
.fb-field{margin-bottom:16px;}
.fb-field label{display:block;font-size:15px;margin-bottom:4px;}
.fb-field textarea{width:100%;font-family:inherit;font-size:15px;padding:6px 8px;border:1px solid #c4d8ee;border-radius:5px;resize:vertical;box-sizing:border-box;background:#fff;}
.fb-field input[type="text"],.fb-field input[type="email"],.fb-field input[type="url"]{width:100%;font-family:inherit;font-size:15px;padding:6px 8px;border:1px solid #c4d8ee;border-radius:5px;box-sizing:border-box;background:#fff;}
.fb-field select{font-family:inherit;font-size:15px;padding:6px 8px;border:1px solid #c4d8ee;border-radius:5px;max-width:100%;background:#fff;}
.fb-website-select{width:100%;box-sizing:border-box;}
.fb-name-email{display:flex;gap:12px;margin-top:20px;}
.fb-name-email .fb-field{flex:0 0 auto;min-width:0;margin-bottom:0;}
.fb-field input[name="user_name"]{width:11rem!important;}
.fb-field input[name="email"]{width:15rem!important;}
input:focus::placeholder,textarea:focus::placeholder{color:transparent;}
.fb-cat-selects{display:flex;flex-wrap:wrap;gap:8px;}
.fb-cat-selects select{font-family:inherit;font-size:15px;padding:6px 8px;border:1px solid #c4d8ee;border-radius:5px;background:#fff;}
.fb-hint{display:block;font-size:12px;color:#888;margin-top:4px;}
.fb-static{font-size:15px;color:#444;}
.fb-error{color:#c00;font-size:15px;margin:0 0 12px;}
.fb-actions{display:flex;justify-content:flex-end;margin-top:8px;}
.fb-actions button{font-family:inherit;font-size:15px;padding:7px 20px;border:none;border-radius:6px;background:#2d6a4f;color:#fff;cursor:pointer;}
.fb-actions button:hover{background:#235740;}

@media (max-width:600px){
  body{padding-bottom:60px;}
  main{padding-top:25px;}
  .desc{margin-bottom:10px;}
  .wide-section{width:85vw;max-width:85vw;margin-top:8px;}
  .cat-table td.col-right{padding-left:24px;}
  .dir-home-link{margin-left:-10px;transform:none;}
  html.dir-sans .dir-search-bar{max-width:322px;}
  .dir-search button{color:#000;}
  .site-desc{max-width:none;overflow:visible;font-size:18px;}
  a.cat-name{font-size:20px;}
  a.site-name{font-size:18px;}
  .fb-form{max-width:100%;}
  .dir-footer{font-size:14px;line-height:2;padding-bottom:48px;}
  .dir-footer-break{display:inline;}
  .dir-footer-dot-break{display:none;}
}
