/* Generated by bin/css_bundle.php - do not edit. */

/* ---- assets/css/qs-fonts.css ---- */
/* Self-hosted Google fonts — generated by tools/build_fonts_local.php. EDIT THE TOOL, not this file. */
/* arabic */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN2DHV20Lg.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* math */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN36HV20Lg.woff2) format('woff2');
  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN3oHV20Lg.woff2) format('woff2');
  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* latin-ext */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN2IHV20Lg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN2GHV0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN2DHV20Lg.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* math */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN36HV20Lg.woff2) format('woff2');
  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN3oHV20Lg.woff2) format('woff2');
  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* latin-ext */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN2IHV20Lg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/RrQKbpV-9Dd1b1OAGA6M9PkyDuVBeN2GHV0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
  font-family: 'Noto Nastaliq Urdu';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/LhW4MUPbN-oZdNFcBy1-DJYsEoTq5pu3SvoMC9Y.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* latin-ext */
@font-face {
  font-family: 'Noto Nastaliq Urdu';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/LhW4MUPbN-oZdNFcBy1-DJYsEoTq5pu3QfoMC9Y.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Noto Nastaliq Urdu';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/LhW4MUPbN-oZdNFcBy1-DJYsEoTq5pu3T_oM.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
  font-family: 'Noto Nastaliq Urdu';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/LhW4MUPbN-oZdNFcBy1-DJYsEoTq5pu3SvoMC9Y.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* latin-ext */
@font-face {
  font-family: 'Noto Nastaliq Urdu';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/LhW4MUPbN-oZdNFcBy1-DJYsEoTq5pu3QfoMC9Y.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Noto Nastaliq Urdu';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/LhW4MUPbN-oZdNFcBy1-DJYsEoTq5pu3T_oM.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3GUBGEe.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3iUBGEe.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3CUBGEe.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3-UBGEe.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* math */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMawCUBGEe.woff2) format('woff2');
  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMaxKUBGEe.woff2) format('woff2');
  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3OUBGEe.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3KUBGEe.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3yUBA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3GUBGEe.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3iUBGEe.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3CUBGEe.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3-UBGEe.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* math */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMawCUBGEe.woff2) format('woff2');
  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMaxKUBGEe.woff2) format('woff2');
  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3OUBGEe.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3KUBGEe.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3yUBA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3GUBGEe.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3iUBGEe.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3CUBGEe.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3-UBGEe.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* math */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMawCUBGEe.woff2) format('woff2');
  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMaxKUBGEe.woff2) format('woff2');
  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3OUBGEe.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3KUBGEe.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3yUBA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3GUBGEe.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3iUBGEe.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3CUBGEe.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3-UBGEe.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* math */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMawCUBGEe.woff2) format('woff2');
  unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
}
/* symbols */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMaxKUBGEe.woff2) format('woff2');
  unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3OUBGEe.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3KUBGEe.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3yUBA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Fallback faces whose line metrics are pinned to the webfonts' own, so the
   font swap cannot move the layout. Nastaliq genuinely needs a 2.5em line box
   (ascent 190.4% + descent 59.6%) — the fallback reserves it from first paint. */
@font-face {
    font-family: 'Qs Nastaliq Fallback';
    src: local('Noto Naskh Arabic'), local('Geeza Pro'), local('Segoe UI'), local('Tahoma'), local('Arial');
    ascent-override: 190.4%; descent-override: 59.6%; line-gap-override: 0%;
}
@font-face {
    font-family: 'Qs Naskh Fallback';
    src: local('Noto Naskh Arabic'), local('Geeza Pro'), local('Segoe UI'), local('Tahoma'), local('Arial');
    ascent-override: 106.9%; descent-override: 63.4%; line-gap-override: 0%;
}

/* ---- assets/vendor/fontawesome/css/subset.min.css ---- */
/*!
 * Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2024 Fonticons, Inc.
 */
.fa{font-family:var(--fa-style-family,"Font Awesome 6 Free");font-weight:var(--fa-style,900)}.fa,.fa-brands,.fa-classic,.fa-regular,.fa-sharp,.fa-solid,.fab,.far,.fas{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:var(--fa-display,inline-block);font-style:normal;font-variant:normal;line-height:1;text-rendering:auto}.fa-classic,.fa-regular,.fa-solid,.far,.fas{font-family:"Font Awesome 6 Free"}.fa-brands,.fab{font-family:"Font Awesome 6 Brands"}.fa-1x{font-size:1em}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-6x{font-size:6em}.fa-7x{font-size:7em}.fa-8x{font-size:8em}.fa-9x{font-size:9em}.fa-10x{font-size:10em}.fa-2xs{font-size:.625em;line-height:.1em;vertical-align:.225em}.fa-xs{font-size:.75em;line-height:.08333em;vertical-align:.125em}.fa-sm{font-size:.875em;line-height:.07143em;vertical-align:.05357em}.fa-lg{font-size:1.25em;line-height:.05em;vertical-align:-.075em}.fa-xl{font-size:1.5em;line-height:.04167em;vertical-align:-.125em}.fa-2xl{font-size:2em;line-height:.03125em;vertical-align:-.1875em}.fa-fw{text-align:center;width:1.25em}.fa-ul{list-style-type:none;margin-left:var(--fa-li-margin,2.5em);padding-left:0}.fa-ul>li{position:relative}.fa-li{left:calc(var(--fa-li-width, 2em)*-1);position:absolute;text-align:center;width:var(--fa-li-width,2em);line-height:inherit}.fa-border{border-radius:var(--fa-border-radius,.1em);border:var(--fa-border-width,.08em) var(--fa-border-style,solid) var(--fa-border-color,#eee);padding:var(--fa-border-padding,.2em .25em .15em)}.fa-pull-left{float:left;margin-right:var(--fa-pull-margin,.3em)}.fa-pull-right{float:right;margin-left:var(--fa-pull-margin,.3em)}.fa-beat{-webkit-animation-name:fa-beat;animation-name:fa-beat;-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,ease-in-out);animation-timing-function:var(--fa-animation-timing,ease-in-out)}.fa-bounce{-webkit-animation-name:fa-bounce;animation-name:fa-bounce;-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,cubic-bezier(.28,.84,.42,1));animation-timing-function:var(--fa-animation-timing,cubic-bezier(.28,.84,.42,1))}.fa-fade{-webkit-animation-name:fa-fade;animation-name:fa-fade;-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1));animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1))}.fa-beat-fade,.fa-fade{-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s)}.fa-beat-fade{-webkit-animation-name:fa-beat-fade;animation-name:fa-beat-fade;-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1));animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1))}.fa-flip{-webkit-animation-name:fa-flip;animation-name:fa-flip;-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,ease-in-out);animation-timing-function:var(--fa-animation-timing,ease-in-out)}.fa-shake{-webkit-animation-name:fa-shake;animation-name:fa-shake;-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,linear);animation-timing-function:var(--fa-animation-timing,linear)}.fa-shake,.fa-spin{-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal)}.fa-spin{-webkit-animation-name:fa-spin;animation-name:fa-spin;-webkit-animation-duration:var(--fa-animation-duration,2s);animation-duration:var(--fa-animation-duration,2s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,linear);animation-timing-function:var(--fa-animation-timing,linear)}.fa-spin-reverse{--fa-animation-direction:reverse}.fa-pulse,.fa-spin-pulse{-webkit-animation-name:fa-spin;animation-name:fa-spin;-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,steps(8));animation-timing-function:var(--fa-animation-timing,steps(8))}@media (prefers-reduced-motion:reduce){.fa-beat,.fa-beat-fade,.fa-bounce,.fa-fade,.fa-flip,.fa-pulse,.fa-shake,.fa-spin,.fa-spin-pulse{-webkit-animation-delay:-1ms;animation-delay:-1ms;-webkit-animation-duration:1ms;animation-duration:1ms;-webkit-animation-iteration-count:1;animation-iteration-count:1;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s}}@-webkit-keyframes fa-beat{0%,90%{-webkit-transform:scale(1);transform:scale(1)}45%{-webkit-transform:scale(var(--fa-beat-scale,1.25));transform:scale(var(--fa-beat-scale,1.25))}}@keyframes fa-beat{0%,90%{-webkit-transform:scale(1);transform:scale(1)}45%{-webkit-transform:scale(var(--fa-beat-scale,1.25));transform:scale(var(--fa-beat-scale,1.25))}}@-webkit-keyframes fa-bounce{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}10%{-webkit-transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0);transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0)}30%{-webkit-transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em));transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em))}50%{-webkit-transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0);transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0)}57%{-webkit-transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em));transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em))}64%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}to{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}}@keyframes fa-bounce{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}10%{-webkit-transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0);transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0)}30%{-webkit-transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em));transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em))}50%{-webkit-transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0);transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0)}57%{-webkit-transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em));transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em))}64%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}to{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}}@-webkit-keyframes fa-fade{50%{opacity:var(--fa-fade-opacity,.4)}}@keyframes fa-fade{50%{opacity:var(--fa-fade-opacity,.4)}}@-webkit-keyframes fa-beat-fade{0%,to{opacity:var(--fa-beat-fade-opacity,.4);-webkit-transform:scale(1);transform:scale(1)}50%{opacity:1;-webkit-transform:scale(var(--fa-beat-fade-scale,1.125));transform:scale(var(--fa-beat-fade-scale,1.125))}}@keyframes fa-beat-fade{0%,to{opacity:var(--fa-beat-fade-opacity,.4);-webkit-transform:scale(1);transform:scale(1)}50%{opacity:1;-webkit-transform:scale(var(--fa-beat-fade-scale,1.125));transform:scale(var(--fa-beat-fade-scale,1.125))}}@-webkit-keyframes fa-flip{50%{-webkit-transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg));transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg))}}@keyframes fa-flip{50%{-webkit-transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg));transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg))}}@-webkit-keyframes fa-shake{0%{-webkit-transform:rotate(-15deg);transform:rotate(-15deg)}4%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}8%,24%{-webkit-transform:rotate(-18deg);transform:rotate(-18deg)}12%,28%{-webkit-transform:rotate(18deg);transform:rotate(18deg)}16%{-webkit-transform:rotate(-22deg);transform:rotate(-22deg)}20%{-webkit-transform:rotate(22deg);transform:rotate(22deg)}32%{-webkit-transform:rotate(-12deg);transform:rotate(-12deg)}36%{-webkit-transform:rotate(12deg);transform:rotate(12deg)}40%,to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes fa-shake{0%{-webkit-transform:rotate(-15deg);transform:rotate(-15deg)}4%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}8%,24%{-webkit-transform:rotate(-18deg);transform:rotate(-18deg)}12%,28%{-webkit-transform:rotate(18deg);transform:rotate(18deg)}16%{-webkit-transform:rotate(-22deg);transform:rotate(-22deg)}20%{-webkit-transform:rotate(22deg);transform:rotate(22deg)}32%{-webkit-transform:rotate(-12deg);transform:rotate(-12deg)}36%{-webkit-transform:rotate(12deg);transform:rotate(12deg)}40%,to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.fa-rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-webkit-transform:scaleX(-1);transform:scaleX(-1)}.fa-flip-vertical{-webkit-transform:scaleY(-1);transform:scaleY(-1)}.fa-flip-both,.fa-flip-horizontal.fa-flip-vertical{-webkit-transform:scale(-1);transform:scale(-1)}.fa-rotate-by{-webkit-transform:rotate(var(--fa-rotate-angle,0));transform:rotate(var(--fa-rotate-angle,0))}.fa-stack{display:inline-block;height:2em;line-height:2em;position:relative;vertical-align:middle;width:2.5em}.fa-stack-1x,.fa-stack-2x{left:0;position:absolute;text-align:center;width:100%;z-index:var(--fa-stack-z-index,auto)}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:var(--fa-inverse,#fff)}

.fa-chevron-circle-right:before,.fa-trash-alt:before,.fa-user-times:before,.fa-comment-alt:before,.fa-compress-alt:before,.fa-file-alt:before,.fa-file-lines:before,.fa-calendar-alt:before,.fa-volleyball-ball:before,.fa-sort-desc:before,.fa-circle-minus:before,.fa-right-from-bracket:before,.fa-heart-music-camera-bolt:before,.fa-microphone-alt-slash:before,.fa-magnifying-glass-location:before,.fa-forward-step:before,.fa-face-smile-beam:before,.fa-football-ball:before,.fa-angle-double-down:before,.fa-beer-mug-empty:before,.fa-arrow-up-long:before,.fa-burn:before,.fa-male:before,.fa-face-grin-stars:before,.fa-pastafarianism:before,.fa-spoon:before,.fa-envelopes-bulk:before,.fa-circle-h:before,.fa-address-book:before,.fa-pencil-alt:before,.fa-pencil:before{content:"\f303"}.fa-file-clipboard:before,.fa-truck-loading:before,.fa-scroll-torah:before,.fa-broom-ball:before,.fa-quidditch-broom-ball:before,.fa-archive:before,.fa-arrow-down-9-1:before,.fa-sort-numeric-desc:before,.fa-face-grin-tongue-squint:before,.fa-earth-africa:before,.fa-tablet-alt:before,.fa-face-flushed:before,.fa-gavel:before,.fa-bell-concierge:before,.fa-pen-ruler:before,.fa-people-arrows-left-right:before,.fa-caret-square-right:before,.fa-cut:before,.fa-digital-tachograph:before,.fa-mail-reply:before,.fa-minus-square:before,.fa-compass:before{content:"\f14e"}.fa-caret-square-down:before,.fa-bars:before,.fa-hourglass-3:before,.fa-heart-broken:before,.fa-external-link-square-alt:before,.fa-face-kiss-beam:before,.fa-circle-exclamation:before,.fa-exclamation-circle:before{content:"\f06a"}.fa-arrow-right-from-bracket:before,.fa-chevron-circle-down:before,.fa-unlock-alt:before,.fa-headphones-alt:before,.fa-sitemap:before{content:"\f0e8"}.fa-circle-dollar-to-slot:before,.fa-flag:before{content:"\f024"}.fa-volume-down:before,.fa-wheat-alt:before,.fa-check-square:before,.fa-header:before,.fa-list-squares:before,.fa-list:before{content:"\f03a"}.fa-phone-square-alt:before,.fa-circle-dot:before,.fa-dizzy:before,.fa-futbol-ball:before,.fa-futbol:before,.fa-paint-brush:before,.fa-lock:before{content:"\f023"}.fa-hot-tub-person:before,.fa-map-location:before,.fa-edit:before,.fa-share-alt:before,.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\f252"}.fa-bag-shopping:before,.fa-shopping-bag:before{content:"\f290"}.fa-arrow-down-z-a:before,.fa-sort-alpha-desc:before,.fa-users:before{content:"\f0c0"}.fa-eye-slash:before{content:"\f070"}.fa-hand-paper:before,.fa-face-kiss:before,.fa-face-grin-tongue:before,.fa-face-grin-wink:before,.fa-deaf:before,.fa-deafness:before,.fa-ear-deaf:before,.fa-rss-square:before,.fa-hryvnia-sign:before,.fa-face-grin-wide:before,.fa-rod-asclepius:before,.fa-rod-snake:before,.fa-staff-aesculapius:before,.fa-ambulance:before,.fa-angle-right:before{content:"\f105"}.fa-temperature-2:before,.fa-temperature-half:before,.fa-thermometer-2:before,.fa-poo-bolt:before,.fa-face-frown-open:before,.fa-bookmark:before{content:"\f02e"}.fa-folder-blank:before,.fa-file-medical-alt:before,.fa-dashboard:before,.fa-gauge-med:before,.fa-gauge:before,.fa-magic-wand-sparkles:before,.fa-pen-alt:before,.fa-user:before{content:"\f007"}.fa-shuttle-van:before,.fa-caret-square-left:before,.fa-bullhorn:before{content:"\f0a1"}.fa-globe:before{content:"\f0ac"}.fa-area-chart:before,.fa-ban:before,.fa-air-freshener:before,.fa-star:before{content:"\f005"}.fa-box:before{content:"\f466"}.fa-arrow-pointer:before,.fa-expand-arrows-alt:before,.fa-shapes:before,.fa-random:before,.fa-person-running:before,.fa-computer-mouse:before,.fa-arrow-right-to-bracket:before,.fa-sign-in:before{content:"\f090"}.fa-shop-slash:before,.fa-hourglass-1:before,.fa-right-to-bracket:before,.fa-heart-pulse:before,.fa-people-carry-box:before,.fa-weight-scale:before,.fa-user-friends:before,.fa-arrow-up-a-z:before,.fa-face-laugh-squint:before,.fa-arrow-circle-up:before,.fa-person-walking:before,.fa-fire:before{content:"\f06d"}.fa-bed-pulse:before,.fa-shuttle-space:before,.fa-face-laugh:before,.fa-microphone-alt:before,.fa-mars-stroke-up:before,.fa-champagne-glasses:before,.fa-file-arrow-up:before,.fa-wifi-3:before,.fa-wifi-strong:before,.fa-bath:before,.fa-user-edit:before,.fa-border-style:before,.fa-map-location-dot:before,.fa-poll:before,.fa-battery-car:before,.fa-glasses:before{content:"\f530"}.fa-mars-stroke-h:before,.fa-hand-back-fist:before,.fa-caret-square-up:before,.fa-bar-chart:before,.fa-hands-bubbles:before,.fa-eye-low-vision:before,.fa-plus-square:before,.fa-microphone:before{content:"\f130"}.fa-glass-martini-alt:before,.fa-rotate-back:before,.fa-rotate-backward:before,.fa-rotate-left:before,.fa-columns:before,.fa-gem:before{content:"\f3a5"}.fa-dolly-box:before,.fa-compress-arrows-alt:before,.fa-angle-double-right:before,.fa-circle-play:before,.fa-play-circle:before{content:"\f144"}.fa-eur:before,.fa-euro-sign:before,.fa-check-circle:before,.fa-circle-stop:before,.fa-compass-drafting:before,.fa-face-laugh-beam:before,.fa-chevron-circle-up:before,.fa-gbp:before,.fa-pound-sign:before,.fa-arrow-down-long:before,.fa-mail-reply-all:before,.fa-person-skating:before,.fa-filter-circle-dollar:before,.fa-arrow-circle-down:before,.fa-arrow-right-to-file:before,.fa-external-link-square:before,.fa-temperature-0:before,.fa-temperature-empty:before,.fa-thermometer-0:before,.fa-address-card:before,.fa-contact-card:before,.fa-balance-scale-right:before,.fa-diamond-turn-right:before,.fa-house-laptop:before,.fa-face-tired:before,.fa-cloud-arrow-up:before,.fa-cloud-upload-alt:before,.fa-seedling:before,.fa-arrows-alt-h:before,.fa-arrow-circle-left:before,.fa-arrow-down-wide-short:before,.fa-sort-amount-asc:before,.fa-cloud-bolt:before,.fa-remove-format:before,.fa-face-smile-wink:before,.fa-file-word:before{content:"\f1c2"}.fa-arrows-h:before,.fa-cloud-arrow-down:before,.fa-cloud-download-alt:before,.fa-blackboard:before,.fa-user-alt-slash:before,.fa-handshake-alt-slash:before,.fa-arrows-rotate:before,.fa-refresh:before,.fa-shield-alt:before,.fa-atlas:before,.fa-house-chimney-crack:before,.fa-file-archive:before,.fa-glass-martini:before,.fa-person-skiing:before,.fa-temperature-arrow-down:before,.fa-feather-alt:before,.fa-ad:before,.fa-arrow-circle-right:before,.fa-sort:before,.fa-list-1-2:before,.fa-list-numeric:before,.fa-money-check-alt:before,.fa-language:before{content:"\f1ab"}.fa-face-kiss-wink-heart:before,.fa-filter:before{content:"\f0b0"}.fa-arrows-alt:before,.fa-star-half-alt:before,.fa-glass-whiskey:before,.fa-arrow-up-right-from-square:before,.fa-external-link:before{content:"\f08e"}.fa-krw:before,.fa-won-sign:before,.fa-cab:before,.fa-chart-pie:before,.fa-face-grin-beam:before,.fa-location-pin:before,.fa-map-marker:before{content:"\f041"}.fa-hard-hat:before,.fa-hat-hard:before,.fa-arrow-alt-circle-right:before,.fa-face-rolling-eyes:before,.fa-chart-line:before,.fa-line-chart:before{content:"\f201"}.fa-arrow-right:before{content:"\f061"}.fa-map-signs:before,.fa-screwdriver-wrench:before,.fa-heart:before{content:"\f004"}.fa-home-user:before,.fa-cocktail:before,.fa-face-surprise:before,.fa-circle-pause:before,.fa-apple-alt:before,.fa-temperature-1:before,.fa-temperature-quarter:before,.fa-thermometer-1:before,.fa-poll-h:before,.fa-circle:before{content:"\f111"}.fa-backward-fast:before,.fa-basketball-ball:before,.fa-arrow-alt-circle-up:before,.fa-mobile-alt:before,.fa-volume-high:before,.fa-burger:before,.fa-wrench:before{content:"\f0ad"}.fa-rupee-sign:before,.fa-circle-question:before,.fa-phone-alt:before,.fa-tags:before{content:"\f02c"}.fa-fast-forward:before,.fa-face-meh-blank:before,.fa-parking:before,.fa-bars-progress:before,.fa-cart-flatbed:before,.fa-ban-smoking:before,.fa-basket-shopping:before,.fa-bus-alt:before,.fa-eye:before{content:"\f06e"}.fa-face-sad-cry:before,.fa-signal-5:before,.fa-signal-perfect:before,.fa-home-lg:before,.fa-face-frown:before,.fa-shop:before,.fa-floppy-disk:before,.fa-save:before{content:"\f0c7"}.fa-balance-scale-left:before,.fa-sort-asc:before,.fa-comment-dots:before,.fa-face-grin-squint:before,.fa-hand-holding-dollar:before,.fa-hands-praying:before,.fa-arrow-right-rotate:before,.fa-arrow-rotate-forward:before,.fa-arrow-rotate-right:before,.fa-location-crosshairs:before,.fa-face-grin-tears:before,.fa-phone:before{content:"\f095"}.fa-calendar-times:before,.fa-user-cog:before,.fa-arrow-up-1-9:before,.fa-digging:before,.fa-trash:before{content:"\f1f8"}.fa-gauge-simple-med:before,.fa-gauge-simple:before,.fa-quote-right-alt:before,.fa-shirt:before,.fa-t-shirt:before,.fa-tenge-sign:before,.fa-arrow-left:before{content:"\f060"}.fa-external-link-alt:before,.fa-table-cells:before,.fa-th:before{content:"\f00a"}.fa-bible:before,.fa-medkit:before,.fa-female:before,.fa-briefcase-clock:before,.fa-table-cells-large:before,.fa-th-large:before{content:"\f009"}.fa-book-tanakh:before,.fa-phone-volume:before,.fa-tag:before{content:"\f02b"}.fa-comment:before{content:"\f075"}.fa-birthday-cake:before,.fa-cake-candles:before,.fa-envelope:before{content:"\f0e0"}.fa-angle-double-up:before,.fa-arrow-up-9-1:before,.fa-hourglass-empty:before,.fa-user-doctor:before,.fa-circle-info:before,.fa-info-circle:before{content:"\f05a"}.fa-camera-alt:before,.fa-arrow-down-1-9:before,.fa-sort-numeric-asc:before,.fa-hand-holding-droplet:before,.fa-prescription-bottle-alt:before,.fa-truck:before{content:"\f0d1"}.fa-arrow-down-a-z:before,.fa-sort-alpha-asc:before,.fa-arrow-left-rotate:before,.fa-arrow-rotate-back:before,.fa-arrow-rotate-backward:before,.fa-arrow-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-hard-drive:before,.fa-face-grin-squint-tears:before,.fa-list-alt:before,.fa-person-skiing-nordic:before,.fa-arrow-alt-circle-left:before,.fa-subway:before,.fa-indian-rupee-sign:before,.fa-indian-rupee:before,.fa-crop-alt:before,.fa-money-bill-1:before,.fa-left-long:before,.fa-minus:before,.fa-arrow-left-long:before,.fa-american-sign-language-interpreting:before,.fa-asl-interpreting:before,.fa-hands-american-sign-language-interpreting:before,.fa-cog:before,.fa-droplet-slash:before,.fa-cart-shopping:before,.fa-shopping-cart:before{content:"\f07a"}.fa-arrow-turn-up:before,.fa-square-root-alt:before,.fa-clock-four:before,.fa-backward-step:before,.fa-clinic-medical:before,.fa-temperature-3:before,.fa-temperature-three-quarters:before,.fa-thermometer-3:before,.fa-mobile-android-alt:before,.fa-battery-3:before,.fa-sliders-h:before,.fa-ellipsis-v:before,.fa-long-arrow-alt-right:before,.fa-teletype:before,.fa-hiking:before,.fa-calculator:before{content:"\f1ec"}.fa-cable-car:before,.fa-download:before{content:"\f019"}.fa-face-grin:before,.fa-backspace:before,.fa-eye-dropper-empty:before,.fa-eye-dropper:before,.fa-mobile-android:before,.fa-mobile-phone:before,.fa-face-meh:before,.fa-book-dead:before,.fa-drivers-license:before,.fa-dedent:before,.fa-home-alt:before,.fa-home-lg-alt:before,.fa-home:before,.fa-arrow-right-arrow-left:before,.fa-redo-alt:before,.fa-rotate-forward:before,.fa-cutlery:before,.fa-arrow-up-wide-short:before,.fa-broadcast-tower:before,.fa-long-arrow-alt-up:before,.fa-file-arrow-down:before,.fa-bolt:before,.fa-cny:before,.fa-jpy:before,.fa-rmb:before,.fa-yen-sign:before,.fa-rouble:before,.fa-rub:before,.fa-ruble-sign:before,.fa-face-laugh-wink:before,.fa-arrow-alt-circle-down:before,.fa-arrow-down-short-wide:before,.fa-sort-amount-desc:before,.fa-angle-down:before{content:"\f107"}.fa-arrow-right-long:before,.fa-long-arrow-right:before{content:"\f178"}.fa-ellipsis-h:before,.fa-first-aid:before,.fa-credit-card-alt:before,.fa-credit-card:before{content:"\f09d"}.fa-automobile:before,.fa-book-open-reader:before,.fa-temperature-arrow-up:before,.fa-h-square:before,.fa-temperature-4:before,.fa-temperature-full:before,.fa-thermometer-4:before,.fa-hands-helping:before,.fa-location-dot:before,.fa-person-swimming:before,.fa-droplet:before,.fa-earth-america:before,.fa-earth-americas:before,.fa-earth:before,.fa-battery-0:before,.fa-gauge-high:before,.fa-tachometer-alt-fast:before,.fa-hospital-alt:before,.fa-hospital-wide:before,.fa-bars-staggered:before,.fa-reorder:before,.fa-blind:before,.fa-check-to-slot:before,.fa-boxes-alt:before,.fa-boxes-stacked:before,.fa-boxes:before{content:"\f468"}.fa-chain:before,.fa-assistive-listening-systems:before,.fa-play:before{content:"\f04b"}.fa-magnifying-glass:before,.fa-search:before{content:"\f002"}.fa-ping-pong-paddle-ball:before,.fa-table-tennis-paddle-ball:before,.fa-diagnoses:before,.fa-trash-can-arrow-up:before,.fa-file-edit:before,.fa-pen-square:before,.fa-pencil-square:before,.fa-chevron-down:before{content:"\f078"}.fa-battery-5:before,.fa-battery-full:before,.fa-list-dots:before,.fa-down-long:before,.fa-landmark-alt:before,.fa-television:before,.fa-tv-alt:before,.fa-list-check:before,.fa-circle-user:before,.fa-user-circle:before{content:"\f2bd"}.fa-car-burst:before,.fa-person-snowboarding:before,.fa-shipping-fast:before,.fa-adjust:before,.fa-circle-radiation:before,.fa-baseball-ball:before,.fa-diagram-project:before,.fa-volume-mute:before,.fa-volume-times:before,.fa-grip-horizontal:before,.fa-share-from-square:before,.fa-child-combatant:before,.fa-phone-square:before,.fa-add:before,.fa-plus:before{content:"\2b"}.fa-close:before,.fa-multiply:before,.fa-remove:before,.fa-times:before,.fa-arrows-up-down-left-right:before,.fa-chalkboard-teacher:before,.fa-quote-left-alt:before,.fa-quote-left:before{content:"\f10d"}.fa-trash-arrow-up:before,.fa-ils:before,.fa-shekel-sign:before,.fa-shekel:before,.fa-sheqel-sign:before,.fa-rocket:before{content:"\f135"}.fa-photo-film:before,.fa-sign-hanging:before,.fa-tablet-android:before,.fa-angle-up:before{content:"\f106"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-car-alt:before,.fa-battery-2:before,.fa-baby-carriage:before,.fa-percent:before,.fa-face-smile:before,.fa-thumb-tack:before,.fa-trophy:before{content:"\f091"}.fa-person-praying:before,.fa-rotate:before,.fa-cogs:before,.fa-face-grin-hearts:before,.fa-transgender-alt:before,.fa-arrow-turn-down:before,.fa-ticket-alt:before,.fa-angle-double-left:before,.fa-clock-rotate-left:before,.fa-face-grin-beam-sweat:before,.fa-arrow-right-from-file:before,.fa-shield-blank:before,.fa-shield:before{content:"\f132"}.fa-arrow-up-short-wide:before,.fa-golf-ball-tee:before,.fa-chevron-circle-left:before,.fa-magic:before,.fa-wine-glass-alt:before,.fa-biking:before,.fa-earth-oceania:before,.fa-square-xmark:before,.fa-times-square:before,.fa-expand-alt:before,.fa-arrows-alt-v:before,.fa-calendar:before{content:"\f133"}.fa-bahai:before,.fa-circle-plus:before,.fa-face-grin-tongue-wink:before,.fa-chain-broken:before,.fa-chain-slash:before,.fa-link-slash:before,.fa-clone:before{content:"\f24d"}.fa-arrow-up-z-a:before,.fa-fire-alt:before,.fa-book-quran:before,.fa-angry:before,.fa-feed:before,.fa-balance-scale:before,.fa-gauge-simple-high:before,.fa-tachometer-fast:before,.fa-desktop-alt:before,.fa-desktop:before{content:"\f390"}.fa-table-list:before,.fa-comment-sms:before,.fa-book:before{content:"\f02d"}.fa-check:before{content:"\f00c"}.fa-battery-4:before,.fa-angle-left:before{content:"\f104"}.fa-fist-raised:before,.fa-image-portrait:before,.fa-earth-europe:before,.fa-cart-flatbed-suitcase:before,.fa-rectangle-times:before,.fa-rectangle-xmark:before,.fa-times-rectangle:before,.fa-book-open:before{content:"\f518"}.fa-book-journal-whills:before,.fa-exclamation-triangle:before,.fa-triangle-exclamation:before,.fa-mail-forward:before,.fa-exchange-alt:before,.fa-money-bill-1-wave:before,.fa-hands:before,.fa-sign-language:before,.fa-ladder-water:before,.fa-swimming-pool:before,.fa-arrows-up-down:before,.fa-face-grimace:before,.fa-wheelchair-alt:before,.fa-level-down-alt:before,.fa-envelope-square:before,.fa-band-aid:before,.fa-circle-xmark:before,.fa-times-circle:before,.fa-earth-asia:before,.fa-id-card-alt:before,.fa-magnifying-glass-plus:before,.fa-allergies:before,.fa-coffee:before,.fa-magnifying-glass-minus:before,.fa-user-alt:before,.fa-note-sticky:before,.fa-face-sad-tear:before,.fa-print:before{content:"\f02f"}.fa-try:before,.fa-turkish-lira-sign:before,.fa-dollar-sign:before,.fa-dollar:before,.fa-magnifying-glass-dollar:before,.fa-users-cog:before,.fa-bank:before,.fa-building-columns:before,.fa-institution:before,.fa-museum:before,.fa-university:before{content:"\f19c"}.fa-masks-theater:before,.fa-handshake-alt:before,.fa-fighter-jet:before,.fa-share-alt-square:before,.fa-video-camera:before,.fa-graduation-cap:before,.fa-level-up-alt:before,
.fa-sr-only,.fa-sr-only-focusable:not(:focus),.sr-only,.sr-only-focusable:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}:host,:root{--fa-style-family-brands:"Font Awesome 6 Brands";--fa-font-brands:normal 400 1em/1 "Font Awesome 6 Brands"}@font-face{font-family:"Font Awesome 6 Brands";font-style:normal;font-weight:400;font-display:block;src:url(../vendor/fontawesome/webfonts/fa-brands-400.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-brands-400.ttf) format("truetype")}.fa-brands,.fab{font-weight:400}.fa-js-square:before,.fa-reddit-square:before,.fa-instagram-square:before,.fa-hacker-news-square:before,.fa-snapchat-square:before,.fa-google-plus:before{content:"\f2b3"}.fa-google:before{content:"\f1a0"}.fa-font-awesome-alt:before,.fa-linkedin-in:before{content:"\f0e1"}.fa-square-viadeo:before,.fa-dribbble-square:before,.fa-square-twitter:before,.fa-kickstarter:before,.fa-square-youtube:before,.fa-rendact:before,.fa-square-steam:before,.fa-square-vimeo:before,.fa-font-awesome-flag:before,.fa-font-awesome-logo-full:before,.fa-github-square:before,.fa-gitlab-square:before,.fa-wordpress:before{content:"\f19a"}.fa-goodreads:before{content:"\f3a8"}.fa-odnoklassniki-square:before,.fa-pinterest-square:before,.fa-paypal:before{content:"\f1ed"}.fa-facebook-f:before{content:"\f39e"}.fa-google-plus-square:before,.fa-square-xing:before,.fa-42-group:before,.fa-pied-piper-square:before,.fa-facebook-square:before,.fa-linkedin:before{content:"\f08c"}.fa-lastfm-square:before,.fa-instagram:before{content:"\f16d"}.fa-facebook:before{content:"\f09a"}.fa-whatsapp:before{content:"\f232"}.fa-wirsindhandwerk:before,.fa-snapchat-ghost:before,.fa-behance-square:before,.fa-goodreads-g:before{content:"\f3a9"}.fa-git-square:before,.fa-square-tumblr:before,.fa-twitter:before{content:"\f099"}.fa-telegram-plane:before,.fa-square-whatsapp:before,.fa-slack-hash:before,.fa-medium-m:before,:host,:root{--fa-font-regular:normal 400 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:400;font-display:block;src:url(../vendor/fontawesome/webfonts/fa-regular-400.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-regular-400.ttf) format("truetype")}.fa-regular,.far{font-weight:400}:host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-solid:normal 900 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:900;font-display:block;src:url(../vendor/fontawesome/webfonts/fa-solid-900.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-solid-900.ttf) format("truetype")}.fa-solid,.fas{font-weight:900}@font-face{font-family:"Font Awesome 5 Brands";font-display:block;font-weight:400;src:url(../vendor/fontawesome/webfonts/fa-brands-400.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-brands-400.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:900;src:url(../vendor/fontawesome/webfonts/fa-solid-900.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-solid-900.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:400;src:url(../vendor/fontawesome/webfonts/fa-regular-400.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-regular-400.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(../vendor/fontawesome/webfonts/fa-solid-900.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-solid-900.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(../vendor/fontawesome/webfonts/fa-brands-400.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-brands-400.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(../vendor/fontawesome/webfonts/fa-regular-400.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-regular-400.ttf) format("truetype");unicode-range:u+f003,u+f006,u+f014,u+f016-f017,u+f01a-f01b,u+f01d,u+f022,u+f03e,u+f044,u+f046,u+f05c-f05d,u+f06e,u+f070,u+f087-f088,u+f08a,u+f094,u+f096-f097,u+f09d,u+f0a0,u+f0a2,u+f0a4-f0a7,u+f0c5,u+f0c7,u+f0e5-f0e6,u+f0eb,u+f0f6-f0f8,u+f10c,u+f114-f115,u+f118-f11a,u+f11c-f11d,u+f133,u+f147,u+f14e,u+f150-f152,u+f185-f186,u+f18e,u+f190-f192,u+f196,u+f1c1-f1c9,u+f1d9,u+f1db,u+f1e3,u+f1ea,u+f1f7,u+f1f9,u+f20a,u+f247-f248,u+f24a,u+f24d,u+f255-f25b,u+f25d,u+f271-f274,u+f278,u+f27b,u+f28c,u+f28e,u+f29c,u+f2b5,u+f2b7,u+f2ba,u+f2bc,u+f2be,u+f2c0-f2c1,u+f2c3,u+f2d0,u+f2d2,u+f2d4,u+f2dc}@font-face{font-family:"FontAwesome";font-display:block;src:url(../vendor/fontawesome/webfonts/fa-v4compatibility.woff2) format("woff2"),url(../vendor/fontawesome/webfonts/fa-v4compatibility.ttf) format("truetype");unicode-range:u+f041,u+f047,u+f065-f066,u+f07d-f07e,u+f080,u+f08b,u+f08e,u+f090,u+f09a,u+f0ac,u+f0ae,u+f0b2,u+f0d0,u+f0d6,u+f0e4,u+f0ec,u+f10a-f10b,u+f123,u+f13e,u+f148-f149,u+f14c,u+f156,u+f15e,u+f160-f161,u+f163,u+f175-f178,u+f195,u+f1f8,u+f219,u+f27a}

/* ---- assets/vendor/fontawesome/css/subset-shims.min.css ---- */
/*!
 * Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2024 Fonticons, Inc.
 */
.fa.fa-envelope-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-envelope-o:before{content:"\f0e0"}.fa.fa-star-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-star-o:before{content:"\f005"}.fa.fa-close:before,.fa.fa-trash-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-trash-o:before{content:"\f2ed"}.fa.fa-home:before{content:"\f015"}.fa.fa-clock-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-clock-o:before{content:"\f017"}.fa.fa-repeat:before,.fa.fa-refresh:before{content:"\f021"}.fa.fa-picture-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-picture-o:before{content:"\f03e"}.fa.fa-map-marker:before{content:"\f3c5"}.fa.fa-check-square-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-check-square-o:before{content:"\f14a"}.fa.fa-check-circle-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-check-circle-o:before{content:"\f058"}.fa.fa-eye,.fa.fa-eye-slash{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-calendar:before{content:"\f073"}.fa.fa-bar-chart-o:before,.fa.fa-bar-chart:before{content:"\e0e3"}.fa.fa-external-link:before{content:"\f35d"}.fa.fa-sign-in:before{content:"\f2f6"}.fa.fa-square-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-square-o:before{content:"\f0c8"}.fa.fa-facebook,.fa.fa-twitter{font-family:"Font Awesome 6 Brands";font-weight:400}.fa.fa-facebook:before{content:"\f39e"}.fa.fa-facebook-f{font-family:"Font Awesome 6 Brands";font-weight:400}.fa.fa-facebook-f:before{content:"\f39e"}.fa.fa-credit-card{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-globe:before{content:"\f57d"}.fa.fa-save{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-save:before{content:"\f0c7"}.fa.fa-navicon:before,.fa.fa-pinterest,.fa.fa-google-plus{font-family:"Font Awesome 6 Brands";font-weight:400}.fa.fa-google-plus:before{content:"\f0d5"}.fa.fa-money:before{content:"\f3d1"}.fa.fa-linkedin{font-family:"Font Awesome 6 Brands";font-weight:400}.fa.fa-linkedin:before{content:"\f0e1"}.fa.fa-dashboard:before,.fa.fa-comments-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-comments-o:before{content:"\f086"}.fa.fa-mobile-phone:before,.fa.fa-circle-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-circle-o:before{content:"\f111"}.fa.fa-chain-broken:before,.fa.fa-css3,.fa.fa-html5,.fa.fa-unlock-alt:before{content:"\f09c"}.fa.fa-compass{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-eur:before,.fa.fa-dollar:before,.fa.fa-inr:before,.fa.fa-cny:before,.fa.fa-jpy:before,.fa.fa-rmb:before,.fa.fa-rouble:before,.fa.fa-rub:before,.fa.fa-krw:before,.fa.fa-bitcoin,.fa.fa-xing,.fa.fa-xing-square,.fa.fa-adn,.fa.fa-bitbucket,.fa.fa-bitbucket-square,.fa.fa-dropbox,.fa.fa-flickr,.fa.fa-instagram,.fa.fa-tumblr,.fa.fa-long-arrow-right:before{content:"\f30b"}.fa.fa-android,.fa.fa-apple,.fa.fa-dribbble,.fa.fa-foursquare,.fa.fa-gittip,.fa.fa-gratipay,.fa.fa-linux,.fa.fa-skype,.fa.fa-trello,.fa.fa-pagelines,.fa.fa-renren,.fa.fa-stack-exchange,.fa.fa-vk,.fa.fa-try:before,.fa.fa-openid,.fa.fa-slack,.fa.fa-wordpress{font-family:"Font Awesome 6 Brands";font-weight:400}.fa.fa-bank:before,.fa.fa-google,.fa.fa-reddit,.fa.fa-reddit-square,.fa.fa-behance,.fa.fa-behance-square,.fa.fa-delicious,.fa.fa-digg,.fa.fa-drupal,.fa.fa-joomla,.fa.fa-pied-piper-alt,.fa.fa-pied-piper-pp,.fa.fa-stumbleupon,.fa.fa-steam,.fa.fa-deviantart,.fa.fa-soundcloud,.fa.fa-codepen,.fa.fa-jsfiddle,.fa.fa-life-bouy:before,.fa.fa-life-buoy:before,.fa.fa-life-saver:before,.fa.fa-ra,.fa.fa-empire,.fa.fa-git,.fa.fa-hacker-news,.fa.fa-qq,.fa.fa-tencent-weibo,.fa.fa-wechat,.fa.fa-slideshare,.fa.fa-twitch,.fa.fa-newspaper-o{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-newspaper-o:before{content:"\f1ea"}.fa.fa-cc-amex,.fa.fa-cc-discover,.fa.fa-cc-mastercard,.fa.fa-cc-paypal,.fa.fa-cc-stripe,.fa.fa-cc-visa,.fa.fa-google-wallet,.fa.fa-paypal{font-family:"Font Awesome 6 Brands";font-weight:400}.fa.fa-trash:before{content:"\f2ed"}.fa.fa-line-chart:before{content:"\f201"}.fa.fa-lastfm,.fa.fa-angellist,.fa.fa-ils:before,.fa.fa-shekel:before,.fa.fa-buysellads,.fa.fa-connectdevelop,.fa.fa-dashcube,.fa.fa-forumbee,.fa.fa-leanpub,.fa.fa-sellsy,.fa.fa-shirtsinbulk,.fa.fa-simplybuilt,.fa.fa-intersex:before,.fa.fa-pinterest-p,.fa.fa-whatsapp{font-family:"Font Awesome 6 Brands";font-weight:400}.fa.fa-medium,.fa.fa-viacoin,.fa.fa-y-combinator,.fa.fa-expeditedssl,.fa.fa-opencart,.fa.fa-battery-4:before,.fa.fa-object-group,.fa.fa-object-ungroup,.fa.fa-cc-diners-club,.fa.fa-clone{font-family:"Font Awesome 6 Free";font-weight:400}.fa.fa-creative-commons,.fa.fa-gg,.fa.fa-gg-circle,.fa.fa-odnoklassniki,.fa.fa-chrome,.fa.fa-firefox,.fa.fa-get-pocket,.fa.fa-internet-explorer,.fa.fa-opera,.fa.fa-safari,.fa.fa-500px,.fa.fa-amazon,.fa.fa-houzz,.fa.fa-black-tie,.fa.fa-edge,.fa.fa-fonticons,.fa.fa-codiepie,.fa.fa-fort-awesome,.fa.fa-mixcloud,.fa.fa-modx,.fa.fa-product-hunt,.fa.fa-scribd,.fa.fa-bluetooth,.fa.fa-bluetooth-b,.fa.fa-envira,.fa.fa-gitlab,.fa.fa-wheelchair-alt,.fa.fa-wpbeginner,.fa.fa-deafness:before,.fa.fa-glide,.fa.fa-viadeo,.fa.fa-snapchat,.fa.fa-first-order,.fa.fa-google-plus-official,.fa.fa-pied-piper,.fa.fa-themeisle,.fa.fa-fa,.fa.fa-free-code-camp,.fa.fa-quora,.fa.fa-thermometer-4:before,.fa.fa-bathtub:before,.fa.fa-window-maximize,.fa.fa-bandcamp,.fa.fa-eercast,.fa.fa-etsy,.fa.fa-grav,.fa.fa-imdb,.fa.fa-meetup,.fa.fa-superpowers,

/* ---- css/bootstrap.css ---- */
/*!
 * Bootstrap v3.3.2 (http://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}
body {
  margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden],
template {
  display: none;
}
a {
  background-color: transparent;
}
a:active,
a:hover {
  outline: 0;
}
abbr[title] {
  border-bottom: 1px dotted;
}
b,
strong {
  font-weight: bold;
}
dfn {
  font-style: italic;
}
h1 {
  margin: .67em 0;
  font-size: 2em;
}
mark {
  color: #000;
  background: #ff0;
}
small {
  font-size: 80%;
}
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
sup {
  top: -.5em;
}
sub {
  bottom: -.25em;
}
img {
  border: 0;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 1em 40px;
}
hr {
  height: 0;
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font: inherit;
  color: inherit;
}
button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}
input {
  line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
input[type="search"] {
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
  -webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  padding: .35em .625em .75em;
  margin: 0 2px;
  border: 1px solid #c0c0c0;
}
legend {
  padding: 0;
  border: 0;
}
textarea {
  overflow: auto;
}
optgroup {
  font-weight: bold;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
}
td,
th {
  padding: 0;
}
/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
@media print {
  *,
  *:before,
  *:after {
    color: #000 !important;
    text-shadow: none !important;
    background: transparent !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
  pre,
  blockquote {
    border: 1px solid #999;

    page-break-inside: avoid;
  }
  thead {
    display: table-header-group;
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  img {
    max-width: 100% !important;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
  select {
    background: #fff !important;
  }
  .navbar {
    display: none;
  }
  .btn > .caret,
  .dropup > .btn > .caret {
    border-top-color: #000 !important;
  }
  .label {
    border: 1px solid #000;
  }
  .table {
    border-collapse: collapse !important;
  }
  .table td,
  .table th {
    background-color: #fff !important;
  }
  .table-bordered th,
  .table-bordered td {
    border: 1px solid #ddd !important;
  }
}
@font-face {
  font-family: 'Glyphicons Halflings';

  src: url('../../fonts/glyphicons-halflings-regular.eot');
  src: url('../../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
.glyphicon {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.glyphicon-asterisk:before {
  content: "\2a";
}
.glyphicon-plus:before {
  content: "\2b";
}
.glyphicon-euro:before,
.glyphicon-eur:before {
  content: "\20ac";
}
.glyphicon-minus:before {
  content: "\2212";
}
.glyphicon-cloud:before {
  content: "\2601";
}
.glyphicon-envelope:before {
  content: "\2709";
}
.glyphicon-pencil:before {
  content: "\270f";
}
.glyphicon-glass:before {
  content: "\e001";
}
.glyphicon-music:before {
  content: "\e002";
}
.glyphicon-search:before {
  content: "\e003";
}
.glyphicon-heart:before {
  content: "\e005";
}
.glyphicon-star:before {
  content: "\e006";
}
.glyphicon-star-empty:before {
  content: "\e007";
}
.glyphicon-user:before {
  content: "\e008";
}
.glyphicon-film:before {
  content: "\e009";
}
.glyphicon-th-large:before {
  content: "\e010";
}
.glyphicon-th:before {
  content: "\e011";
}
.glyphicon-th-list:before {
  content: "\e012";
}
.glyphicon-ok:before {
  content: "\e013";
}
.glyphicon-remove:before {
  content: "\e014";
}
.glyphicon-zoom-in:before {
  content: "\e015";
}
.glyphicon-zoom-out:before {
  content: "\e016";
}
.glyphicon-off:before {
  content: "\e017";
}
.glyphicon-signal:before {
  content: "\e018";
}
.glyphicon-cog:before {
  content: "\e019";
}
.glyphicon-trash:before {
  content: "\e020";
}
.glyphicon-home:before {
  content: "\e021";
}
.glyphicon-file:before {
  content: "\e022";
}
.glyphicon-time:before {
  content: "\e023";
}
.glyphicon-road:before {
  content: "\e024";
}
.glyphicon-download-alt:before {
  content: "\e025";
}
.glyphicon-download:before {
  content: "\e026";
}
.glyphicon-upload:before {
  content: "\e027";
}
.glyphicon-inbox:before {
  content: "\e028";
}
.glyphicon-play-circle:before {
  content: "\e029";
}
.glyphicon-repeat:before {
  content: "\e030";
}
.glyphicon-refresh:before {
  content: "\e031";
}
.glyphicon-list-alt:before {
  content: "\e032";
}
.glyphicon-lock:before {
  content: "\e033";
}
.glyphicon-flag:before {
  content: "\e034";
}
.glyphicon-headphones:before {
  content: "\e035";
}
.glyphicon-volume-off:before {
  content: "\e036";
}
.glyphicon-volume-down:before {
  content: "\e037";
}
.glyphicon-volume-up:before {
  content: "\e038";
}
.glyphicon-qrcode:before {
  content: "\e039";
}
.glyphicon-barcode:before {
  content: "\e040";
}
.glyphicon-tag:before {
  content: "\e041";
}
.glyphicon-tags:before {
  content: "\e042";
}
.glyphicon-book:before {
  content: "\e043";
}
.glyphicon-bookmark:before {
  content: "\e044";
}
.glyphicon-print:before {
  content: "\e045";
}
.glyphicon-camera:before {
  content: "\e046";
}
.glyphicon-font:before {
  content: "\e047";
}
.glyphicon-bold:before {
  content: "\e048";
}
.glyphicon-italic:before {
  content: "\e049";
}
.glyphicon-text-height:before {
  content: "\e050";
}
.glyphicon-text-width:before {
  content: "\e051";
}
.glyphicon-align-left:before {
  content: "\e052";
}
.glyphicon-align-center:before {
  content: "\e053";
}
.glyphicon-align-right:before {
  content: "\e054";
}
.glyphicon-align-justify:before {
  content: "\e055";
}
.glyphicon-list:before {
  content: "\e056";
}
.glyphicon-indent-left:before {
  content: "\e057";
}
.glyphicon-indent-right:before {
  content: "\e058";
}
.glyphicon-facetime-video:before {
  content: "\e059";
}
.glyphicon-picture:before {
  content: "\e060";
}
.glyphicon-map-marker:before {
  content: "\e062";
}
.glyphicon-adjust:before {
  content: "\e063";
}
.glyphicon-tint:before {
  content: "\e064";
}
.glyphicon-edit:before {
  content: "\e065";
}
.glyphicon-share:before {
  content: "\e066";
}
.glyphicon-check:before {
  content: "\e067";
}
.glyphicon-move:before {
  content: "\e068";
}
.glyphicon-step-backward:before {
  content: "\e069";
}
.glyphicon-fast-backward:before {
  content: "\e070";
}
.glyphicon-backward:before {
  content: "\e071";
}
.glyphicon-play:before {
  content: "\e072";
}
.glyphicon-pause:before {
  content: "\e073";
}
.glyphicon-stop:before {
  content: "\e074";
}
.glyphicon-forward:before {
  content: "\e075";
}
.glyphicon-fast-forward:before {
  content: "\e076";
}
.glyphicon-step-forward:before {
  content: "\e077";
}
.glyphicon-eject:before {
  content: "\e078";
}
.glyphicon-chevron-left:before {
  content: "\e079";
}
.glyphicon-chevron-right:before {
  content: "\e080";
}
.glyphicon-plus-sign:before {
  content: "\e081";
}
.glyphicon-minus-sign:before {
  content: "\e082";
}
.glyphicon-remove-sign:before {
  content: "\e083";
}
.glyphicon-ok-sign:before {
  content: "\e084";
}
.glyphicon-question-sign:before {
  content: "\e085";
}
.glyphicon-info-sign:before {
  content: "\e086";
}
.glyphicon-screenshot:before {
  content: "\e087";
}
.glyphicon-remove-circle:before {
  content: "\e088";
}
.glyphicon-ok-circle:before {
  content: "\e089";
}
.glyphicon-ban-circle:before {
  content: "\e090";
}
.glyphicon-arrow-left:before {
  content: "\e091";
}
.glyphicon-arrow-right:before {
  content: "\e092";
}
.glyphicon-arrow-up:before {
  content: "\e093";
}
.glyphicon-arrow-down:before {
  content: "\e094";
}
.glyphicon-share-alt:before {
  content: "\e095";
}
.glyphicon-resize-full:before {
  content: "\e096";
}
.glyphicon-resize-small:before {
  content: "\e097";
}
.glyphicon-exclamation-sign:before {
  content: "\e101";
}
.glyphicon-gift:before {
  content: "\e102";
}
.glyphicon-leaf:before {
  content: "\e103";
}
.glyphicon-fire:before {
  content: "\e104";
}
.glyphicon-eye-open:before {
  content: "\e105";
}
.glyphicon-eye-close:before {
  content: "\e106";
}
.glyphicon-warning-sign:before {
  content: "\e107";
}
.glyphicon-plane:before {
  content: "\e108";
}
.glyphicon-calendar:before {
  content: "\e109";
}
.glyphicon-random:before {
  content: "\e110";
}
.glyphicon-comment:before {
  content: "\e111";
}
.glyphicon-magnet:before {
  content: "\e112";
}
.glyphicon-chevron-up:before {
  content: "\e113";
}
.glyphicon-chevron-down:before {
  content: "\e114";
}
.glyphicon-retweet:before {
  content: "\e115";
}
.glyphicon-shopping-cart:before {
  content: "\e116";
}
.glyphicon-folder-close:before {
  content: "\e117";
}
.glyphicon-folder-open:before {
  content: "\e118";
}
.glyphicon-resize-vertical:before {
  content: "\e119";
}
.glyphicon-resize-horizontal:before {
  content: "\e120";
}
.glyphicon-hdd:before {
  content: "\e121";
}
.glyphicon-bullhorn:before {
  content: "\e122";
}
.glyphicon-bell:before {
  content: "\e123";
}
.glyphicon-certificate:before {
  content: "\e124";
}
.glyphicon-thumbs-up:before {
  content: "\e125";
}
.glyphicon-thumbs-down:before {
  content: "\e126";
}
.glyphicon-hand-right:before {
  content: "\e127";
}
.glyphicon-hand-left:before {
  content: "\e128";
}
.glyphicon-hand-up:before {
  content: "\e129";
}
.glyphicon-hand-down:before {
  content: "\e130";
}
.glyphicon-circle-arrow-right:before {
  content: "\e131";
}
.glyphicon-circle-arrow-left:before {
  content: "\e132";
}
.glyphicon-circle-arrow-up:before {
  content: "\e133";
}
.glyphicon-circle-arrow-down:before {
  content: "\e134";
}
.glyphicon-globe:before {
  content: "\e135";
}
.glyphicon-wrench:before {
  content: "\e136";
}
.glyphicon-tasks:before {
  content: "\e137";
}
.glyphicon-filter:before {
  content: "\e138";
}
.glyphicon-briefcase:before {
  content: "\e139";
}
.glyphicon-fullscreen:before {
  content: "\e140";
}
.glyphicon-dashboard:before {
  content: "\e141";
}
.glyphicon-paperclip:before {
  content: "\e142";
}
.glyphicon-heart-empty:before {
  content: "\e143";
}
.glyphicon-link:before {
  content: "\e144";
}
.glyphicon-phone:before {
  content: "\e145";
}
.glyphicon-pushpin:before {
  content: "\e146";
}
.glyphicon-usd:before {
  content: "\e148";
}
.glyphicon-gbp:before {
  content: "\e149";
}
.glyphicon-sort:before {
  content: "\e150";
}
.glyphicon-sort-by-alphabet:before {
  content: "\e151";
}
.glyphicon-sort-by-alphabet-alt:before {
  content: "\e152";
}
.glyphicon-sort-by-order:before {
  content: "\e153";
}
.glyphicon-sort-by-order-alt:before {
  content: "\e154";
}
.glyphicon-sort-by-attributes:before {
  content: "\e155";
}
.glyphicon-sort-by-attributes-alt:before {
  content: "\e156";
}
.glyphicon-unchecked:before {
  content: "\e157";
}
.glyphicon-expand:before {
  content: "\e158";
}
.glyphicon-collapse-down:before {
  content: "\e159";
}
.glyphicon-collapse-up:before {
  content: "\e160";
}
.glyphicon-log-in:before {
  content: "\e161";
}
.glyphicon-flash:before {
  content: "\e162";
}
.glyphicon-log-out:before {
  content: "\e163";
}
.glyphicon-new-window:before {
  content: "\e164";
}
.glyphicon-record:before {
  content: "\e165";
}
.glyphicon-save:before {
  content: "\e166";
}
.glyphicon-open:before {
  content: "\e167";
}
.glyphicon-saved:before {
  content: "\e168";
}
.glyphicon-import:before {
  content: "\e169";
}
.glyphicon-export:before {
  content: "\e170";
}
.glyphicon-send:before {
  content: "\e171";
}
.glyphicon-floppy-disk:before {
  content: "\e172";
}
.glyphicon-floppy-saved:before {
  content: "\e173";
}
.glyphicon-floppy-remove:before {
  content: "\e174";
}
.glyphicon-floppy-save:before {
  content: "\e175";
}
.glyphicon-floppy-open:before {
  content: "\e176";
}
.glyphicon-credit-card:before {
  content: "\e177";
}
.glyphicon-transfer:before {
  content: "\e178";
}
.glyphicon-cutlery:before {
  content: "\e179";
}
.glyphicon-header:before {
  content: "\e180";
}
.glyphicon-compressed:before {
  content: "\e181";
}
.glyphicon-earphone:before {
  content: "\e182";
}
.glyphicon-phone-alt:before {
  content: "\e183";
}
.glyphicon-tower:before {
  content: "\e184";
}
.glyphicon-stats:before {
  content: "\e185";
}
.glyphicon-sd-video:before {
  content: "\e186";
}
.glyphicon-hd-video:before {
  content: "\e187";
}
.glyphicon-subtitles:before {
  content: "\e188";
}
.glyphicon-sound-stereo:before {
  content: "\e189";
}
.glyphicon-sound-dolby:before {
  content: "\e190";
}
.glyphicon-sound-5-1:before {
  content: "\e191";
}
.glyphicon-sound-6-1:before {
  content: "\e192";
}
.glyphicon-sound-7-1:before {
  content: "\e193";
}
.glyphicon-copyright-mark:before {
  content: "\e194";
}
.glyphicon-registration-mark:before {
  content: "\e195";
}
.glyphicon-cloud-download:before {
  content: "\e197";
}
.glyphicon-cloud-upload:before {
  content: "\e198";
}
.glyphicon-tree-conifer:before {
  content: "\e199";
}
.glyphicon-tree-deciduous:before {
  content: "\e200";
}
.glyphicon-cd:before {
  content: "\e201";
}
.glyphicon-save-file:before {
  content: "\e202";
}
.glyphicon-open-file:before {
  content: "\e203";
}
.glyphicon-level-up:before {
  content: "\e204";
}
.glyphicon-copy:before {
  content: "\e205";
}
.glyphicon-paste:before {
  content: "\e206";
}
.glyphicon-alert:before {
  content: "\e209";
}
.glyphicon-equalizer:before {
  content: "\e210";
}
.glyphicon-king:before {
  content: "\e211";
}
.glyphicon-queen:before {
  content: "\e212";
}
.glyphicon-pawn:before {
  content: "\e213";
}
.glyphicon-bishop:before {
  content: "\e214";
}
.glyphicon-knight:before {
  content: "\e215";
}
.glyphicon-baby-formula:before {
  content: "\e216";
}
.glyphicon-tent:before {
  content: "\26fa";
}
.glyphicon-blackboard:before {
  content: "\e218";
}
.glyphicon-bed:before {
  content: "\e219";
}
.glyphicon-apple:before {
  content: "\f8ff";
}
.glyphicon-erase:before {
  content: "\e221";
}
.glyphicon-hourglass:before {
  content: "\231b";
}
.glyphicon-lamp:before {
  content: "\e223";
}
.glyphicon-duplicate:before {
  content: "\e224";
}
.glyphicon-piggy-bank:before {
  content: "\e225";
}
.glyphicon-scissors:before {
  content: "\e226";
}
.glyphicon-bitcoin:before {
  content: "\e227";
}
.glyphicon-yen:before {
  content: "\00a5";
}
.glyphicon-ruble:before {
  content: "\20bd";
}
.glyphicon-scale:before {
  content: "\e230";
}
.glyphicon-ice-lolly:before {
  content: "\e231";
}
.glyphicon-ice-lolly-tasted:before {
  content: "\e232";
}
.glyphicon-education:before {
  content: "\e233";
}
.glyphicon-option-horizontal:before {
  content: "\e234";
}
.glyphicon-option-vertical:before {
  content: "\e235";
}
.glyphicon-menu-hamburger:before {
  content: "\e236";
}
.glyphicon-modal-window:before {
  content: "\e237";
}
.glyphicon-oil:before {
  content: "\e238";
}
.glyphicon-grain:before {
  content: "\e239";
}
.glyphicon-sunglasses:before {
  content: "\e240";
}
.glyphicon-text-size:before {
  content: "\e241";
}
.glyphicon-text-color:before {
  content: "\e242";
}
.glyphicon-text-background:before {
  content: "\e243";
}
.glyphicon-object-align-top:before {
  content: "\e244";
}
.glyphicon-object-align-bottom:before {
  content: "\e245";
}
.glyphicon-object-align-horizontal:before {
  content: "\e246";
}
.glyphicon-object-align-left:before {
  content: "\e247";
}
.glyphicon-object-align-vertical:before {
  content: "\e248";
}
.glyphicon-object-align-right:before {
  content: "\e249";
}
.glyphicon-triangle-right:before {
  content: "\e250";
}
.glyphicon-triangle-left:before {
  content: "\e251";
}
.glyphicon-triangle-bottom:before {
  content: "\e252";
}
.glyphicon-triangle-top:before {
  content: "\e253";
}
.glyphicon-console:before {
  content: "\e254";
}
.glyphicon-superscript:before {
  content: "\e255";
}
.glyphicon-subscript:before {
  content: "\e256";
}
.glyphicon-menu-left:before {
  content: "\e257";
}
.glyphicon-menu-right:before {
  content: "\e258";
}
.glyphicon-menu-down:before {
  content: "\e259";
}
.glyphicon-menu-up:before {
  content: "\e260";
}
* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
html {
  font-size: 10px;

  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #fff;
}
input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
a {
  color: #337ab7;
  text-decoration: none;
}
a:hover,
a:focus {
}
a:focus {
  outline: 0;
}
figure {
  margin: 0;
}
img {
  vertical-align: middle;
}
.img-responsive,
.thumbnail > img,
.thumbnail a > img,
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  display: block;
  max-width: 100%;
  height: auto;
}
.img-rounded {
  border-radius: 6px;
}
.img-thumbnail {
  display: inline-block;
  max-width: 100%;
  height: auto;
  padding: 4px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all .2s ease-in-out;
       -o-transition: all .2s ease-in-out;
          transition: all .2s ease-in-out;
}
.img-circle {
  border-radius: 50%;
}
hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eee;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit;
}
h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small,
.h1 small,
.h2 small,
.h3 small,
.h4 small,
.h5 small,
.h6 small,
h1 .small,
h2 .small,
h3 .small,
h4 .small,
h5 .small,
h6 .small,
.h1 .small,
.h2 .small,
.h3 .small,
.h4 .small,
.h5 .small,
.h6 .small {
  font-weight: normal;
  line-height: 1;
  color: #777;
}
h1,
.h1,
h2,
.h2,
h3,
.h3 {
  margin-top: 20px;
  margin-bottom: 10px;
}
h1 small,
.h1 small,
h2 small,
.h2 small,
h3 small,
.h3 small,
h1 .small,
.h1 .small,
h2 .small,
.h2 .small,
h3 .small,
.h3 .small {
  font-size: 65%;
}
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  margin-top: 10px;
  margin-bottom: 10px;
}
h4 small,
.h4 small,
h5 small,
.h5 small,
h6 small,
.h6 small,
h4 .small,
.h4 .small,
h5 .small,
.h5 .small,
h6 .small,
.h6 .small {
  font-size: 75%;
}
h1,
.h1 {
  font-size: 36px;
}
h2,
.h2 {
  font-size: 30px;
}
h3,
.h3 {
  font-size: 24px;
}
h4,
.h4 {
  font-size: 18px;
}
h5,
.h5 {
  font-size: 14px;
}
h6,
.h6 {
  font-size: 12px;
}
p {
  margin: 0 0 10px;
}
.lead {
  margin-bottom: 20px;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.4;
}
@media (min-width: 768px) {
  .lead {
    font-size: 21px;
  }
}
small,
.small {
  font-size: 85%;
}
mark,
.mark {
  padding: .2em;
  background-color: #fcf8e3;
}
.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
.text-justify {
  text-align: justify;
}
.text-nowrap {
  white-space: nowrap;
}
.text-lowercase {
  text-transform: lowercase;
}
.text-uppercase {
  text-transform: uppercase;
}
.text-capitalize {
  text-transform: capitalize;
}
.text-muted {
  color: #777;
}
.text-primary {
  color: #337ab7;
}
a.text-primary:hover {
  color: #286090;
}
.text-success {
  color: #3c763d;
}
a.text-success:hover {
  color: #2b542c;
}
.text-info {
  color: #31708f;
}
a.text-info:hover {
  color: #245269;
}
.text-warning {
  color: #8a6d3b;
}
a.text-warning:hover {
  color: #66512c;
}
.text-danger {
  color: #a94442;
}
a.text-danger:hover {
  color: #843534;
}
.bg-primary {
  color: #fff;
  background-color: #337ab7;
}
a.bg-primary:hover {
  background-color: #286090;
}
.bg-success {
  background-color: #dff0d8;
}
a.bg-success:hover {
  background-color: #c1e2b3;
}
.bg-info {
  background-color: #d9edf7;
}
a.bg-info:hover {
  background-color: #afd9ee;
}
.bg-warning {
  background-color: #fcf8e3;
}
a.bg-warning:hover {
  background-color: #f7ecb5;
}
.bg-danger {
  background-color: #f2dede;
}
a.bg-danger:hover {
  background-color: #e4b9b9;
}
.page-header {
  padding-bottom: 9px;
  margin: 40px 0 20px;
  border-bottom: 1px solid #eee;
}
ul,
ol {
  margin-top: 0;
  margin-bottom: 10px;
}
ul ul,
ol ul,
ul ol,
ol ol {
  margin-bottom: 0;
}
.list-unstyled {
  padding-left: 0;
  list-style: none;
}
.list-inline {
  padding-left: 0;
  margin-left: -5px;
  list-style: none;
}
.list-inline > li {
  display: inline-block;
  padding-right: 5px;
  padding-left: 5px;
}
dl {
  margin-top: 0;
  margin-bottom: 20px;
}
dt,
dd {
  line-height: 1.42857143;
}
dt {
  font-weight: bold;
}
dd {
  margin-left: 0;
}
@media (min-width: 768px) {
  .dl-horizontal dt {
    float: left;
    width: 160px;
    overflow: hidden;
    clear: left;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dl-horizontal dd {
    margin-left: 180px;
  }
}
abbr[title],
abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted #777;
}
.initialism {
  font-size: 90%;
  text-transform: uppercase;
}
blockquote {
  padding: 10px 20px;
  margin: 0 0 20px;
  font-size: 17.5px;
  border-left: 5px solid #eee;
}
blockquote p:last-child,
blockquote ul:last-child,
blockquote ol:last-child {
  margin-bottom: 0;
}
blockquote footer,
blockquote small,
blockquote .small {
  display: block;
  font-size: 80%;
  line-height: 1.42857143;
  color: #777;
}
blockquote footer:before,
blockquote small:before,
blockquote .small:before {
  content: '\2014 \00A0';
}
.blockquote-reverse,
blockquote.pull-right {
  padding-right: 15px;
  padding-left: 0;
  text-align: right;
  border-right: 5px solid #eee;
  border-left: 0;
}
.blockquote-reverse footer:before,
blockquote.pull-right footer:before,
.blockquote-reverse small:before,
blockquote.pull-right small:before,
.blockquote-reverse .small:before,
blockquote.pull-right .small:before {
  content: '';
}
.blockquote-reverse footer:after,
blockquote.pull-right footer:after,
.blockquote-reverse small:after,
blockquote.pull-right small:after,
.blockquote-reverse .small:after,
blockquote.pull-right .small:after {
  content: '\00A0 \2014';
}
address {
  margin-bottom: 20px;
  font-style: normal;
  line-height: 1.42857143;
}
code,
kbd,
pre,
samp {
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}
code {
  padding: 2px 4px;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 4px;
}
kbd {
  padding: 2px 4px;
  font-size: 90%;
  color: #fff;
  background-color: #333;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25);
          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25);
}
kbd kbd {
  padding: 0;
  font-size: 100%;
  font-weight: bold;
  -webkit-box-shadow: none;
          box-shadow: none;
}
pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #333;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px;
}
pre code {
  padding: 0;
  font-size: inherit;
  color: inherit;
  white-space: pre-wrap;
  background-color: transparent;
  border-radius: 0;
}
.pre-scrollable {
  max-height: 340px;
  overflow-y: scroll;
}
.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.row {
  margin-right: -15px;
  margin-left: -15px;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
  float: left;
}
.col-xs-12 {
  width: 100%;
}
.col-xs-11 {
  width: 91.66666667%;
}
.col-xs-10 {
  width: 83.33333333%;
}
.col-xs-9 {
  width: 75%;
}
.col-xs-8 {
  width: 66.66666667%;
}
.col-xs-7 {
  width: 58.33333333%;
}
.col-xs-6 {
  width: 50%;
}
.col-xs-5 {
  width: 41.66666667%;
}
.col-xs-4 {
  width: 33.33333333%;
}
.col-xs-3 {
  width: 25%;
}
.col-xs-2 {
  width: 16.66666667%;
}
.col-xs-1 {
  width: 8.33333333%;
}
.col-xs-pull-12 {
  right: 100%;
}
.col-xs-pull-11 {
  right: 91.66666667%;
}
.col-xs-pull-10 {
  right: 83.33333333%;
}
.col-xs-pull-9 {
  right: 75%;
}
.col-xs-pull-8 {
  right: 66.66666667%;
}
.col-xs-pull-7 {
  right: 58.33333333%;
}
.col-xs-pull-6 {
  right: 50%;
}
.col-xs-pull-5 {
  right: 41.66666667%;
}
.col-xs-pull-4 {
  right: 33.33333333%;
}
.col-xs-pull-3 {
  right: 25%;
}
.col-xs-pull-2 {
  right: 16.66666667%;
}
.col-xs-pull-1 {
  right: 8.33333333%;
}
.col-xs-pull-0 {
  right: auto;
}
.col-xs-push-12 {
  left: 100%;
}
.col-xs-push-11 {
  left: 91.66666667%;
}
.col-xs-push-10 {
  left: 83.33333333%;
}
.col-xs-push-9 {
  left: 75%;
}
.col-xs-push-8 {
  left: 66.66666667%;
}
.col-xs-push-7 {
  left: 58.33333333%;
}
.col-xs-push-6 {
  left: 50%;
}
.col-xs-push-5 {
  left: 41.66666667%;
}
.col-xs-push-4 {
  left: 33.33333333%;
}
.col-xs-push-3 {
  left: 25%;
}
.col-xs-push-2 {
  left: 16.66666667%;
}
.col-xs-push-1 {
  left: 8.33333333%;
}
.col-xs-push-0 {
  left: auto;
}
.col-xs-offset-12 {
  margin-left: 100%;
}
.col-xs-offset-11 {
  margin-left: 91.66666667%;
}
.col-xs-offset-10 {
  margin-left: 83.33333333%;
}
.col-xs-offset-9 {
  margin-left: 75%;
}
.col-xs-offset-8 {
  margin-left: 66.66666667%;
}
.col-xs-offset-7 {
  margin-left: 58.33333333%;
}
.col-xs-offset-6 {
  margin-left: 50%;
}
.col-xs-offset-5 {
  margin-left: 41.66666667%;
}
.col-xs-offset-4 {
  margin-left: 33.33333333%;
}
.col-xs-offset-3 {
  margin-left: 25%;
}
.col-xs-offset-2 {
  margin-left: 16.66666667%;
}
.col-xs-offset-1 {
  margin-left: 8.33333333%;
}
.col-xs-offset-0 {
  margin-left: 0;
}
@media (min-width: 768px) {
  .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left;
  }
  .col-sm-12 {
    width: 100%;
  }
  .col-sm-11 {
    width: 91.66666667%;
  }
  .col-sm-10 {
    width: 83.33333333%;
  }
  .col-sm-9 {
    width: 75%;
  }
  .col-sm-8 {
    width: 66.66666667%;
  }
  .col-sm-7 {
    width: 58.33333333%;
  }
  .col-sm-6 {
    width: 50%;
  }
  .col-sm-5 {
    width: 41.66666667%;
  }
  .col-sm-4 {
    width: 33.33333333%;
  }
  .col-sm-3 {
    width: 25%;
  }
  .col-sm-2 {
    width: 16.66666667%;
  }
  .col-sm-1 {
    width: 8.33333333%;
  }
  .col-sm-pull-12 {
    right: 100%;
  }
  .col-sm-pull-11 {
    right: 91.66666667%;
  }
  .col-sm-pull-10 {
    right: 83.33333333%;
  }
  .col-sm-pull-9 {
    right: 75%;
  }
  .col-sm-pull-8 {
    right: 66.66666667%;
  }
  .col-sm-pull-7 {
    right: 58.33333333%;
  }
  .col-sm-pull-6 {
    right: 50%;
  }
  .col-sm-pull-5 {
    right: 41.66666667%;
  }
  .col-sm-pull-4 {
    right: 33.33333333%;
  }
  .col-sm-pull-3 {
    right: 25%;
  }
  .col-sm-pull-2 {
    right: 16.66666667%;
  }
  .col-sm-pull-1 {
    right: 8.33333333%;
  }
  .col-sm-pull-0 {
    right: auto;
  }
  .col-sm-push-12 {
    left: 100%;
  }
  .col-sm-push-11 {
    left: 91.66666667%;
  }
  .col-sm-push-10 {
    left: 83.33333333%;
  }
  .col-sm-push-9 {
    left: 75%;
  }
  .col-sm-push-8 {
    left: 66.66666667%;
  }
  .col-sm-push-7 {
    left: 58.33333333%;
  }
  .col-sm-push-6 {
    left: 50%;
  }
  .col-sm-push-5 {
    left: 41.66666667%;
  }
  .col-sm-push-4 {
    left: 33.33333333%;
  }
  .col-sm-push-3 {
    left: 25%;
  }
  .col-sm-push-2 {
    left: 16.66666667%;
  }
  .col-sm-push-1 {
    left: 8.33333333%;
  }
  .col-sm-push-0 {
    left: auto;
  }
  .col-sm-offset-12 {
    margin-left: 100%;
  }
  .col-sm-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-sm-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-sm-offset-9 {
    margin-left: 75%;
  }
  .col-sm-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-sm-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-sm-offset-6 {
    margin-left: 50%;
  }
  .col-sm-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-sm-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-sm-offset-3 {
    margin-left: 25%;
  }
  .col-sm-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-sm-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-sm-offset-0 {
    margin-left: 0;
  }
}
@media (min-width: 768px) {
  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
    float: left;
  }
  .col-md-12 {
    width: 100%;
  }
  .col-md-11 {
    width: 91.66666667%;
  }
  .col-md-10 {
    width: 83.33333333%;
  }
  .col-md-9 {
    width: 75%;
  }
  .col-md-8 {
    width: 66.66666667%;
  }
  .col-md-7 {
    width: 58.33333333%;
  }
  .col-md-6 {
    width: 50%;
  }
  .col-md-5 {
    width: 41.66666667%;
  }
  .col-md-4 {
    width: 33.33333333%;
  }
  .col-md-3 {
    width: 25%;
  }
  .col-md-2 {
    width: 16.66666667%;
  }
  .col-md-1 {
    width: 8.33333333%;
  }
  .col-md-pull-12 {
    right: 100%;
  }
  .col-md-pull-11 {
    right: 91.66666667%;
  }
  .col-md-pull-10 {
    right: 83.33333333%;
  }
  .col-md-pull-9 {
    right: 75%;
  }
  .col-md-pull-8 {
    right: 66.66666667%;
  }
  .col-md-pull-7 {
    right: 58.33333333%;
  }
  .col-md-pull-6 {
    right: 50%;
  }
  .col-md-pull-5 {
    right: 41.66666667%;
  }
  .col-md-pull-4 {
    right: 33.33333333%;
  }
  .col-md-pull-3 {
    right: 25%;
  }
  .col-md-pull-2 {
    right: 16.66666667%;
  }
  .col-md-pull-1 {
    right: 8.33333333%;
  }
  .col-md-pull-0 {
    right: auto;
  }
  .col-md-push-12 {
    left: 100%;
  }
  .col-md-push-11 {
    left: 91.66666667%;
  }
  .col-md-push-10 {
    left: 83.33333333%;
  }
  .col-md-push-9 {
    left: 75%;
  }
  .col-md-push-8 {
    left: 66.66666667%;
  }
  .col-md-push-7 {
    left: 58.33333333%;
  }
  .col-md-push-6 {
    left: 50%;
  }
  .col-md-push-5 {
    left: 41.66666667%;
  }
  .col-md-push-4 {
    left: 33.33333333%;
  }
  .col-md-push-3 {
    left: 25%;
  }
  .col-md-push-2 {
    left: 16.66666667%;
  }
  .col-md-push-1 {
    left: 8.33333333%;
  }
  .col-md-push-0 {
    left: auto;
  }
  .col-md-offset-12 {
    margin-left: 100%;
  }
  .col-md-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-md-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-md-offset-9 {
    margin-left: 75%;
  }
  .col-md-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-md-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-md-offset-6 {
    margin-left: 50%;
  }
  .col-md-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-md-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-md-offset-3 {
    margin-left: 25%;
  }
  .col-md-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-md-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-md-offset-0 {
    margin-left: 0;
  }
}
@media (min-width: 1200px) {
  .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    float: left;
  }
  .col-lg-12 {
    width: 100%;
  }
  .col-lg-11 {
    width: 91.66666667%;
  }
  .col-lg-10 {
    width: 83.33333333%;
  }
  .col-lg-9 {
    width: 75%;
  }
  .col-lg-8 {
    width: 66.66666667%;
  }
  .col-lg-7 {
    width: 58.33333333%;
  }
  .col-lg-6 {
    width: 50%;
  }
  .col-lg-5 {
    width: 41.66666667%;
  }
  .col-lg-4 {
    width: 33.33333333%;
  }
  .col-lg-3 {
    width: 25%;
  }
  .col-lg-2 {
    width: 16.66666667%;
  }
  .col-lg-1 {
    width: 8.33333333%;
  }
  .col-lg-pull-12 {
    right: 100%;
  }
  .col-lg-pull-11 {
    right: 91.66666667%;
  }
  .col-lg-pull-10 {
    right: 83.33333333%;
  }
  .col-lg-pull-9 {
    right: 75%;
  }
  .col-lg-pull-8 {
    right: 66.66666667%;
  }
  .col-lg-pull-7 {
    right: 58.33333333%;
  }
  .col-lg-pull-6 {
    right: 50%;
  }
  .col-lg-pull-5 {
    right: 41.66666667%;
  }
  .col-lg-pull-4 {
    right: 33.33333333%;
  }
  .col-lg-pull-3 {
    right: 25%;
  }
  .col-lg-pull-2 {
    right: 16.66666667%;
  }
  .col-lg-pull-1 {
    right: 8.33333333%;
  }
  .col-lg-pull-0 {
    right: auto;
  }
  .col-lg-push-12 {
    left: 100%;
  }
  .col-lg-push-11 {
    left: 91.66666667%;
  }
  .col-lg-push-10 {
    left: 83.33333333%;
  }
  .col-lg-push-9 {
    left: 75%;
  }
  .col-lg-push-8 {
    left: 66.66666667%;
  }
  .col-lg-push-7 {
    left: 58.33333333%;
  }
  .col-lg-push-6 {
    left: 50%;
  }
  .col-lg-push-5 {
    left: 41.66666667%;
  }
  .col-lg-push-4 {
    left: 33.33333333%;
  }
  .col-lg-push-3 {
    left: 25%;
  }
  .col-lg-push-2 {
    left: 16.66666667%;
  }
  .col-lg-push-1 {
    left: 8.33333333%;
  }
  .col-lg-push-0 {
    left: auto;
  }
  .col-lg-offset-12 {
    margin-left: 100%;
  }
  .col-lg-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-lg-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-lg-offset-9 {
    margin-left: 75%;
  }
  .col-lg-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-lg-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-lg-offset-6 {
    margin-left: 50%;
  }
  .col-lg-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-lg-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-lg-offset-3 {
    margin-left: 25%;
  }
  .col-lg-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-lg-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-lg-offset-0 {
    margin-left: 0;
  }
}
table {
  background-color: transparent;
}
caption {
  padding-top: 8px;
  padding-bottom: 8px;
  color: #777;
  text-align: left;
}
th {
  text-align: left;
}
.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: top;
  border-top: 1px solid #ddd;
}
.table > thead > tr > th {
  vertical-align: bottom;
  border-bottom: 2px solid #ddd;
}
.table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > th,
.table > caption + thead > tr:first-child > td,
.table > colgroup + thead > tr:first-child > td,
.table > thead:first-child > tr:first-child > td {
  border-top: 0;
}
.table > tbody + tbody {
  border-top: 2px solid #ddd;
}
.table .table {
  background-color: #fff;
}
.table-condensed > thead > tr > th,
.table-condensed > tbody > tr > th,
.table-condensed > tfoot > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > td {
  padding: 5px;
}
.table-bordered {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
  border-bottom-width: 2px;
}
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #f9f9f9;
}
.table-hover > tbody > tr:hover {
  background-color: #f5f5f5;
}
table col[class*="col-"] {
  position: static;
  display: table-column;
  float: none;
}
table td[class*="col-"],
table th[class*="col-"] {
  position: static;
  display: table-cell;
  float: none;
}
.table > thead > tr > td.active,
.table > tbody > tr > td.active,
.table > tfoot > tr > td.active,
.table > thead > tr > th.active,
.table > tbody > tr > th.active,
.table > tfoot > tr > th.active,
.table > thead > tr.active > td,
.table > tbody > tr.active > td,
.table > tfoot > tr.active > td,
.table > thead > tr.active > th,
.table > tbody > tr.active > th,
.table > tfoot > tr.active > th {
  background-color: #f5f5f5;
}
.table-hover > tbody > tr > td.active:hover,
.table-hover > tbody > tr > th.active:hover,
.table-hover > tbody > tr.active:hover > td,
.table-hover > tbody > tr:hover > .active,
.table-hover > tbody > tr.active:hover > th {
  background-color: #e8e8e8;
}
.table > thead > tr > td.success,
.table > tbody > tr > td.success,
.table > tfoot > tr > td.success,
.table > thead > tr > th.success,
.table > tbody > tr > th.success,
.table > tfoot > tr > th.success,
.table > thead > tr.success > td,
.table > tbody > tr.success > td,
.table > tfoot > tr.success > td,
.table > thead > tr.success > th,
.table > tbody > tr.success > th,
.table > tfoot > tr.success > th {
  background-color: #dff0d8;
}
.table-hover > tbody > tr > td.success:hover,
.table-hover > tbody > tr > th.success:hover,
.table-hover > tbody > tr.success:hover > td,
.table-hover > tbody > tr:hover > .success,
.table-hover > tbody > tr.success:hover > th {
  background-color: #d0e9c6;
}
.table > thead > tr > td.info,
.table > tbody > tr > td.info,
.table > tfoot > tr > td.info,
.table > thead > tr > th.info,
.table > tbody > tr > th.info,
.table > tfoot > tr > th.info,
.table > thead > tr.info > td,
.table > tbody > tr.info > td,
.table > tfoot > tr.info > td,
.table > thead > tr.info > th,
.table > tbody > tr.info > th,
.table > tfoot > tr.info > th {
  background-color: #d9edf7;
}
.table-hover > tbody > tr > td.info:hover,
.table-hover > tbody > tr > th.info:hover,
.table-hover > tbody > tr.info:hover > td,
.table-hover > tbody > tr:hover > .info,
.table-hover > tbody > tr.info:hover > th {
  background-color: #c4e3f3;
}
.table > thead > tr > td.warning,
.table > tbody > tr > td.warning,
.table > tfoot > tr > td.warning,
.table > thead > tr > th.warning,
.table > tbody > tr > th.warning,
.table > tfoot > tr > th.warning,
.table > thead > tr.warning > td,
.table > tbody > tr.warning > td,
.table > tfoot > tr.warning > td,
.table > thead > tr.warning > th,
.table > tbody > tr.warning > th,
.table > tfoot > tr.warning > th {
  background-color: #fcf8e3;
}
.table-hover > tbody > tr > td.warning:hover,
.table-hover > tbody > tr > th.warning:hover,
.table-hover > tbody > tr.warning:hover > td,
.table-hover > tbody > tr:hover > .warning,
.table-hover > tbody > tr.warning:hover > th {
  background-color: #faf2cc;
}
.table > thead > tr > td.danger,
.table > tbody > tr > td.danger,
.table > tfoot > tr > td.danger,
.table > thead > tr > th.danger,
.table > tbody > tr > th.danger,
.table > tfoot > tr > th.danger,
.table > thead > tr.danger > td,
.table > tbody > tr.danger > td,
.table > tfoot > tr.danger > td,
.table > thead > tr.danger > th,
.table > tbody > tr.danger > th,
.table > tfoot > tr.danger > th {
  background-color: #f2dede;
}
.table-hover > tbody > tr > td.danger:hover,
.table-hover > tbody > tr > th.danger:hover,
.table-hover > tbody > tr.danger:hover > td,
.table-hover > tbody > tr:hover > .danger,
.table-hover > tbody > tr.danger:hover > th {
  background-color: #ebcccc;
}
.table-responsive {
  min-height: .01%;
  overflow-x: auto;
}
@media screen and (max-width: 767px) {
  .table-responsive {
    width: 100%;
    margin-bottom: 15px;
    overflow-y: hidden;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    border: 1px solid #ddd;
  }
  .table-responsive > .table {
    margin-bottom: 0;
  }
  .table-responsive > .table > thead > tr > th,
  .table-responsive > .table > tbody > tr > th,
  .table-responsive > .table > tfoot > tr > th,
  .table-responsive > .table > thead > tr > td,
  .table-responsive > .table > tbody > tr > td,
  .table-responsive > .table > tfoot > tr > td {
    white-space: nowrap;
  }
  .table-responsive > .table-bordered {
    border: 0;
  }
  .table-responsive > .table-bordered > thead > tr > th:first-child,
  .table-responsive > .table-bordered > tbody > tr > th:first-child,
  .table-responsive > .table-bordered > tfoot > tr > th:first-child,
  .table-responsive > .table-bordered > thead > tr > td:first-child,
  .table-responsive > .table-bordered > tbody > tr > td:first-child,
  .table-responsive > .table-bordered > tfoot > tr > td:first-child {
    border-left: 0;
  }
  .table-responsive > .table-bordered > thead > tr > th:last-child,
  .table-responsive > .table-bordered > tbody > tr > th:last-child,
  .table-responsive > .table-bordered > tfoot > tr > th:last-child,
  .table-responsive > .table-bordered > thead > tr > td:last-child,
  .table-responsive > .table-bordered > tbody > tr > td:last-child,
  .table-responsive > .table-bordered > tfoot > tr > td:last-child {
    border-right: 0;
  }
  .table-responsive > .table-bordered > tbody > tr:last-child > th,
  .table-responsive > .table-bordered > tfoot > tr:last-child > th,
  .table-responsive > .table-bordered > tbody > tr:last-child > td,
  .table-responsive > .table-bordered > tfoot > tr:last-child > td {
    border-bottom: 0;
  }
}
fieldset {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}
legend {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: 20px;
  font-size: 21px;
  line-height: inherit;
  color: #333;
  border: 0;
  border-bottom: 1px solid #e5e5e5;
}
label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: bold;
}
input[type="search"] {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
input[type="radio"],
input[type="checkbox"] {
  margin: 4px 0 0;
  margin-top: 1px \9;
  line-height: normal;
}
input[type="file"] {
  display: block;
}
input[type="range"] {
  display: block;
  width: 100%;
}
select[multiple],
select[size] {
  height: auto;
}
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
output {
  display: block;
  padding-top: 7px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
}
.form-control {
  display: block;
  width: 100%;
  height: 40px;
  padding: 10px 15px;
  font-size: 15px;
  line-height: 1.42857143;
  color: #000;
  background-color: #fff;
  background-image: none;
  transition: border 1s;
  border: 1px solid #ccc;
}
.form-control:focus {
  border: 1px solid #0000008c;

}
.form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.form-control:-ms-input-placeholder {
  color: #999;
}
.form-control::-webkit-input-placeholder {
  color: #999;
}
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  cursor: not-allowed;
  background-color: #eee;
  opacity: 1;
}
textarea.form-control {
  height: auto;
}
input[type="search"] {
  -webkit-appearance: none;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  input[type="date"],
  input[type="time"],
  input[type="datetime-local"],
  input[type="month"] {
    line-height: 34px;
  }
  input[type="date"].input-sm,
  input[type="time"].input-sm,
  input[type="datetime-local"].input-sm,
  input[type="month"].input-sm,
  .input-group-sm input[type="date"],
  .input-group-sm input[type="time"],
  .input-group-sm input[type="datetime-local"],
  .input-group-sm input[type="month"] {
    line-height: 30px;
  }
  input[type="date"].input-lg,
  input[type="time"].input-lg,
  input[type="datetime-local"].input-lg,
  input[type="month"].input-lg,
  .input-group-lg input[type="date"],
  .input-group-lg input[type="time"],
  .input-group-lg input[type="datetime-local"],
  .input-group-lg input[type="month"] {
    line-height: 46px;
  }
}
.form-group {
  margin-bottom: 15px;
}
.radio,
.checkbox {
  position: relative;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}
.radio label,
.checkbox label {
  min-height: 20px;
  padding-left: 20px;
  margin-bottom: 0;
  font-weight: normal;
  cursor: pointer;
}
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  position: absolute;
  margin-top: 4px \9;
  margin-left: -20px;
}
.radio + .radio,
.checkbox + .checkbox {
  margin-top: -5px;
}
.radio-inline,
.checkbox-inline {
  display: inline-block;
  padding-left: 20px;
  margin-bottom: 0;
  font-weight: normal;
  vertical-align: middle;
  cursor: pointer;
}
.radio-inline + .radio-inline,
.checkbox-inline + .checkbox-inline {
  margin-top: 0;
  margin-left: 10px;
}
input[type="radio"][disabled],
input[type="checkbox"][disabled],
input[type="radio"].disabled,
input[type="checkbox"].disabled,
fieldset[disabled] input[type="radio"],
fieldset[disabled] input[type="checkbox"] {
  cursor: not-allowed;
}
.radio-inline.disabled,
.checkbox-inline.disabled,
fieldset[disabled] .radio-inline,
fieldset[disabled] .checkbox-inline {
  cursor: not-allowed;
}
.radio.disabled label,
.checkbox.disabled label,
fieldset[disabled] .radio label,
fieldset[disabled] .checkbox label {
  cursor: not-allowed;
}
.form-control-static {
  padding-top: 7px;
  padding-bottom: 7px;
  margin-bottom: 0;
}
.form-control-static.input-lg,
.form-control-static.input-sm {
  padding-right: 0;
  padding-left: 0;
}
.input-sm {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
select.input-sm {
  height: 30px;
  line-height: 30px;
}
textarea.input-sm,
select[multiple].input-sm {
  height: auto;
}
.form-group-sm .form-control {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
select.form-group-sm .form-control {
  height: 30px;
  line-height: 30px;
}
textarea.form-group-sm .form-control,
select[multiple].form-group-sm .form-control {
  height: auto;
}
.form-group-sm .form-control-static {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
}
.input-lg {
  height: 46px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px;
}
select.input-lg {
  height: 46px;
  line-height: 46px;
}
textarea.input-lg,
select[multiple].input-lg {
  height: auto;
}
.form-group-lg .form-control {
  height: 46px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px;
}
select.form-group-lg .form-control {
  height: 46px;
  line-height: 46px;
}
textarea.form-group-lg .form-control,
select[multiple].form-group-lg .form-control {
  height: auto;
}
.form-group-lg .form-control-static {
  height: 46px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
}
.has-feedback {
  position: relative;
}
.has-feedback .form-control {
  padding-right: 42.5px;
}
.form-control-feedback {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: block;
  width: 34px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  pointer-events: none;
}
.input-lg + .form-control-feedback {
  width: 46px;
  height: 46px;
  line-height: 46px;
}
.input-sm + .form-control-feedback {
  width: 30px;
  height: 30px;
  line-height: 30px;
}
.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label {
  color: #3c763d;
}
.has-success .form-control {
  border-color: #3c763d;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
.has-success .form-control:focus {
  border-color: #2b542c;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #67b168;
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #67b168;
}
.has-success .input-group-addon {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #3c763d;
}
.has-success .form-control-feedback {
  color: #3c763d;
}
.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline,
.has-warning.radio label,
.has-warning.checkbox label,
.has-warning.radio-inline label,
.has-warning.checkbox-inline label {
  color: #8a6d3b;
}
.has-warning .form-control {
  border-color: #8a6d3b;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
.has-warning .form-control:focus {
  border-color: #66512c;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #c0a16b;
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #c0a16b;
}
.has-warning .input-group-addon {
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #8a6d3b;
}
.has-warning .form-control-feedback {
  color: #8a6d3b;
}
.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label {
  color: #a94442;
}
.has-error .form-control {
  border-color: #a94442;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
.has-error .form-control:focus {
  border-color: #843534;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #ce8483;
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #ce8483;
}
.has-error .input-group-addon {
  color: #a94442;
  background-color: #f2dede;
  border-color: #a94442;
}
.has-error .form-control-feedback {
  color: #a94442;
}
.has-feedback label ~ .form-control-feedback {
  top: 25px;
}
.has-feedback label.sr-only ~ .form-control-feedback {
  top: 0;
}
.help-block {
  display: block;
  margin-top: 5px;
  margin-bottom: 10px;
  color: #737373;
}
@media (min-width: 768px) {
  .form-inline .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .form-inline .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
  }
  .form-inline .form-control-static {
    display: inline-block;
  }
  .form-inline .input-group {
    display: inline-table;
    vertical-align: middle;
  }
  .form-inline .input-group .input-group-addon,
  .form-inline .input-group .input-group-btn,
  .form-inline .input-group .form-control {
    width: auto;
  }
  .form-inline .input-group > .form-control {
    width: 100%;
  }
  .form-inline .control-label {
    margin-bottom: 0;
    vertical-align: middle;
  }
  .form-inline .radio,
  .form-inline .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .form-inline .radio label,
  .form-inline .checkbox label {
    padding-left: 0;
  }
  .form-inline .radio input[type="radio"],
  .form-inline .checkbox input[type="checkbox"] {
    position: relative;
    margin-left: 0;
  }
  .form-inline .has-feedback .form-control-feedback {
    top: 0;
  }
}
.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
  padding-top: 7px;
  margin-top: 0;
  margin-bottom: 0;
}
.form-horizontal .radio,
.form-horizontal .checkbox {
  min-height: 27px;
}
.form-horizontal .form-group {
  margin-right: -15px;
  margin-left: -15px;
}
@media (min-width: 768px) {
  .form-horizontal .control-label {
    padding-top: 7px;
    margin-bottom: 0;
    text-align: right;
  }
}
.form-horizontal .has-feedback .form-control-feedback {
  right: 15px;
}
@media (min-width: 768px) {
  .form-horizontal .form-group-lg .control-label {
    padding-top: 14.333333px;
  }
}
@media (min-width: 768px) {
  .form-horizontal .form-group-sm .control-label {
    padding-top: 6px;
  }
}
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.btn:hover,
.btn:focus,
.btn.focus {
  color: #333;
  text-decoration: none;
}
.btn:active,
.btn.active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  pointer-events: none;
  cursor: not-allowed;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
          box-shadow: none;
  opacity: .65;
}
.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  background-image: none;
}
.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
  background-color: #fff;
  border-color: #ccc;
}
.btn-default .badge {
  color: #fff;
  background-color: #333;
}
.btn-primary {
  color: #fff;
  background-color: #000;
  border-color: #000;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #000;
  border-color: #000;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
  background-color: #000;
  border-color: #000;
}
.btn-primary .badge {
  color: #337ab7;
  background-color: #fff;
}
.btn-success {
  color: #fff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.btn-success:hover,
.btn-success:focus,
.btn-success.focus,
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  background-image: none;
}
.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled.focus,
.btn-success[disabled].focus,
fieldset[disabled] .btn-success.focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.btn-success .badge {
  color: #5cb85c;
  background-color: #fff;
}
.btn-info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
}
.btn-info:hover,
.btn-info:focus,
.btn-info.focus,
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  background-image: none;
}
.btn-info.disabled,
.btn-info[disabled],
fieldset[disabled] .btn-info,
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus,
.btn-info[disabled].focus,
fieldset[disabled] .btn-info.focus,
.btn-info.disabled:active,
.btn-info[disabled]:active,
fieldset[disabled] .btn-info:active,
.btn-info.disabled.active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active {
  background-color: #5bc0de;
  border-color: #46b8da;
}
.btn-info .badge {
  color: #5bc0de;
  background-color: #fff;
}
.btn-warning {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning.focus,
.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}
.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
  background-image: none;
}
.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled.focus,
.btn-warning[disabled].focus,
fieldset[disabled] .btn-warning.focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
  background-color: #f0ad4e;
  border-color: #eea236;
}
.btn-warning .badge {
  color: #f0ad4e;
  background-color: #fff;
}
.btn-danger {
  color: #fff;
  background-color: #d9534f;
  border-color: #d43f3a;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger.focus,
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  background-image: none;
}
.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
  background-color: #d9534f;
  border-color: #d43f3a;
}
.btn-danger .badge {
  color: #d9534f;
  background-color: #fff;
}
.btn-link {
  font-weight: normal;
  color: #337ab7;
  border-radius: 0;
}
.btn-link,
.btn-link:active,
.btn-link.active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
  background-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
  border-color: transparent;
}
.btn-link:hover,
.btn-link:focus {
  color: #23527c;
  text-decoration: underline;
  background-color: transparent;
}
.btn-link[disabled]:hover,
fieldset[disabled] .btn-link:hover,
.btn-link[disabled]:focus,
fieldset[disabled] .btn-link:focus {
  color: #777;
  text-decoration: none;
}
.btn-lg,
.btn-group-lg > .btn {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px;
}
.btn-sm,
.btn-group-sm > .btn {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
.btn-xs,
.btn-group-xs > .btn {
  padding: 1px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
.btn-block {
  display: block;
  width: 100%;
}
.btn-block + .btn-block {
  margin-top: 5px;
}
input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
  width: 100%;
}
.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
       -o-transition: opacity .15s linear;
          transition: opacity .15s linear;
}
.fade.in {
  opacity: 1;
}
.collapse {
  display: none;
  visibility: hidden;
}
.collapse.in {
  display: block;
  visibility: visible;
}
tr.collapse.in {
  display: table-row;
}
tbody.collapse.in {
  display: table-row-group;
}
.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition-timing-function: ease;
       -o-transition-timing-function: ease;
          transition-timing-function: ease;
  -webkit-transition-duration: .35s;
       -o-transition-duration: .35s;
          transition-duration: .35s;
  -webkit-transition-property: height, visibility;
       -o-transition-property: height, visibility;
          transition-property: height, visibility;
}
.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px solid;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.dropup,
.dropdown {
  position: relative;
}
.dropdown-toggle:focus {
  outline: 0;
}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 14px;
  text-align: left;
  list-style: none;
  background-color: #fff;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
          box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}
.dropdown-menu.pull-right {
  right: 0;
  left: auto;
}
.dropdown-menu .divider {
  height: 1px;
  margin: 9px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}
.dropdown-menu > li > a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color: #262626;
  text-decoration: none;
  background-color: #f5f5f5;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color: #fff;
  text-decoration: none;
  background-color: #337ab7;
  outline: 0;
}
.dropdown-menu > .disabled > a,
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  color: #777;
}
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  text-decoration: none;
  cursor: not-allowed;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.open > .dropdown-menu {
  display: block;
}
.open > a {
  outline: 0;
}
.dropdown-menu-right {
  right: 0;
  left: auto;
}
.dropdown-menu-left {
  right: auto;
  left: 0;
}
.dropdown-header {
  display: block;
  padding: 3px 20px;
  font-size: 12px;
  line-height: 1.42857143;
  color: #777;
  white-space: nowrap;
}
.dropdown-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 990;
}
.pull-right > .dropdown-menu {
  right: 0;
  left: auto;
}
.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
  content: "";
  border-top: 0;
  border-bottom: 4px solid;
}
.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-bottom: 2px;
}
@media (min-width: 768px) {
  .navbar-right .dropdown-menu {
    right: 0;
    left: auto;
  }
  .navbar-right .dropdown-menu-left {
    right: auto;
    left: 0;
  }
}
.btn-group,
.btn-group-vertical {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.btn-group > .btn,
.btn-group-vertical > .btn {
  position: relative;
  float: left;
}
.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover,
.btn-group > .btn:focus,
.btn-group-vertical > .btn:focus,
.btn-group > .btn:active,
.btn-group-vertical > .btn:active,
.btn-group > .btn.active,
.btn-group-vertical > .btn.active {
  z-index: 2;
}
.btn-group .btn + .btn,
.btn-group .btn + .btn-group,
.btn-group .btn-group + .btn,
.btn-group .btn-group + .btn-group {
  margin-left: -1px;
}
.btn-toolbar {
  margin-left: -5px;
}
.btn-toolbar .btn-group,
.btn-toolbar .input-group {
  float: left;
}
.btn-toolbar > .btn,
.btn-toolbar > .btn-group,
.btn-toolbar > .input-group {
  margin-left: 5px;
}
.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  border-radius: 0;
}
.btn-group > .btn:first-child {
  margin-left: 0;
}
.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group > .btn-group {
  float: left;
}
.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0;
}
.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
  outline: 0;
}
.btn-group > .btn + .dropdown-toggle {
  padding-right: 8px;
  padding-left: 8px;
}
.btn-group > .btn-lg + .dropdown-toggle {
  padding-right: 12px;
  padding-left: 12px;
}
.btn-group.open .dropdown-toggle {
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}
.btn-group.open .dropdown-toggle.btn-link {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.btn .caret {
  margin-left: 0;
}
.btn-lg .caret {
  border-width: 5px 5px 0;
  border-bottom-width: 0;
}
.dropup .btn-lg .caret {
  border-width: 0 5px 5px;
}
.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group,
.btn-group-vertical > .btn-group > .btn {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
}
.btn-group-vertical > .btn-group > .btn {
  float: none;
}
.btn-group-vertical > .btn + .btn,
.btn-group-vertical > .btn + .btn-group,
.btn-group-vertical > .btn-group + .btn,
.btn-group-vertical > .btn-group + .btn-group {
  margin-top: -1px;
  margin-left: 0;
}
.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
  border-radius: 0;
}
.btn-group-vertical > .btn:first-child:not(:last-child) {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group-vertical > .btn:last-child:not(:first-child) {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 4px;
}
.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0;
}
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.btn-group-justified {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
}
.btn-group-justified > .btn,
.btn-group-justified > .btn-group {
  display: table-cell;
  float: none;
  width: 1%;
}
.btn-group-justified > .btn-group .btn {
  width: 100%;
}
.btn-group-justified > .btn-group .dropdown-menu {
  left: auto;
}
[data-toggle="buttons"] > .btn input[type="radio"],
[data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
[data-toggle="buttons"] > .btn input[type="checkbox"],
[data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}
.input-group {
  position: relative;
  display: table;
  border-collapse: separate;
}
.input-group[class*="col-"] {
  float: none;
  padding-right: 0;
  padding-left: 0;
}
.input-group .form-control {
  position: relative;
  z-index: 2;
  float: left;
  width: 100%;
  margin-bottom: 0;
}
.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
  height: 46px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px;
}
select.input-group-lg > .form-control,
select.input-group-lg > .input-group-addon,
select.input-group-lg > .input-group-btn > .btn {
  height: 46px;
  line-height: 46px;
}
textarea.input-group-lg > .form-control,
textarea.input-group-lg > .input-group-addon,
textarea.input-group-lg > .input-group-btn > .btn,
select[multiple].input-group-lg > .form-control,
select[multiple].input-group-lg > .input-group-addon,
select[multiple].input-group-lg > .input-group-btn > .btn {
  height: auto;
}
.input-group-sm > .form-control,
.input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .btn {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
select.input-group-sm > .form-control,
select.input-group-sm > .input-group-addon,
select.input-group-sm > .input-group-btn > .btn {
  height: 30px;
  line-height: 30px;
}
textarea.input-group-sm > .form-control,
textarea.input-group-sm > .input-group-addon,
textarea.input-group-sm > .input-group-btn > .btn,
select[multiple].input-group-sm > .form-control,
select[multiple].input-group-sm > .input-group-addon,
select[multiple].input-group-sm > .input-group-btn > .btn {
  height: auto;
}
.input-group-addon,
.input-group-btn,
.input-group .form-control {
  display: table-cell;
}
.input-group-addon:not(:first-child):not(:last-child),
.input-group-btn:not(:first-child):not(:last-child),
.input-group .form-control:not(:first-child):not(:last-child) {
  border-radius: 0;
}
.input-group-addon,
.input-group-btn {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle;
}
.input-group-addon {
  padding: 6px 12px;
  font-size: 14px;
  font-weight: normal;
  line-height: 1;
  color: #555;
  text-align: center;
  background-color: #eee;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.input-group-addon.input-sm {
  padding: 5px 10px;
  font-size: 12px;
  border-radius: 3px;
}
.input-group-addon.input-lg {
  padding: 10px 16px;
  font-size: 18px;
  border-radius: 6px;
}
.input-group-addon input[type="radio"],
.input-group-addon input[type="checkbox"] {
  margin-top: 0;
}
.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group > .btn,
.input-group-btn:first-child > .dropdown-toggle,
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.input-group-addon:first-child {
  border-right: 0;
}
.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle,
.input-group-btn:first-child > .btn:not(:first-child),
.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.input-group-addon:last-child {
  border-left: 0;
}
.input-group-btn {
  position: relative;
  font-size: 0;
  white-space: nowrap;
}
.input-group-btn > .btn {
  position: relative;
}
.input-group-btn > .btn + .btn {
  margin-left: -1px;
}
.input-group-btn > .btn:hover,
.input-group-btn > .btn:focus,
.input-group-btn > .btn:active {
  z-index: 2;
}
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group {
  margin-right: -1px;
}
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group {
  margin-left: -1px;
}
.nav {
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}
.nav > li {
  position: relative;
  display: block;
}
.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 15px;
}
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background-color: #eee;
}
.nav > li.disabled > a {
  color: #777;
}
.nav > li.disabled > a:hover,
.nav > li.disabled > a:focus {
  color: #777;
  text-decoration: none;
  cursor: not-allowed;
  background-color: transparent;
}
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
  background-color: #eee;
  border-color: #337ab7;
}
.nav .nav-divider {
  height: 1px;
  margin: 9px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}
.nav > li > a > img {
  max-width: none;
}
.nav-tabs {
  border-bottom: 1px solid #ddd;
}
.nav-tabs > li {
  float: left;
  margin-bottom: -1px;
}
.nav-tabs > li > a {
  margin-right: 2px;
  line-height: 1.42857143;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
}
.nav-tabs > li > a:hover {
  border-color: #eee #eee #ddd;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  color: #555;
  cursor: default;
  background-color: #fff;
  border: 1px solid #ddd;
  border-bottom-color: transparent;
}
.nav-tabs.nav-justified {
  width: 100%;
  border-bottom: 0;
}
.nav-tabs.nav-justified > li {
  float: none;
}
.nav-tabs.nav-justified > li > a {
  margin-bottom: 5px;
  text-align: center;
}
.nav-tabs.nav-justified > .dropdown .dropdown-menu {
  top: auto;
  left: auto;
}
@media (min-width: 768px) {
  .nav-tabs.nav-justified > li {
    display: table-cell;
    width: 1%;
  }
  .nav-tabs.nav-justified > li > a {
    margin-bottom: 0;
  }
}
.nav-tabs.nav-justified > li > a {
  margin-right: 0;
  border-radius: 4px;
}
.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:focus {
  border: 1px solid #ddd;
}
@media (min-width: 768px) {
  .nav-tabs.nav-justified > li > a {
    border-bottom: 1px solid #ddd;
    border-radius: 4px 4px 0 0;
  }
  .nav-tabs.nav-justified > .active > a,
  .nav-tabs.nav-justified > .active > a:hover,
  .nav-tabs.nav-justified > .active > a:focus {
    border-bottom-color: #fff;
  }
}
.nav-pills > li {
  float: left;
}
.nav-pills > li > a {
  border-radius: 4px;
}
.nav-pills > li + li {
  margin-left: 2px;
}
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
  color: #fff;
  background-color: #337ab7;
}
.nav-stacked > li {
  float: none;
}
.nav-stacked > li + li {
  margin-top: 2px;
  margin-left: 0;
}
.nav-justified {
  width: 100%;
}
.nav-justified > li {
  float: none;
}
.nav-justified > li > a {
  margin-bottom: 5px;
  text-align: center;
}
.nav-justified > .dropdown .dropdown-menu {
  top: auto;
  left: auto;
}
@media (min-width: 768px) {
  .nav-justified > li {
    display: table-cell;
    width: 1%;
  }
  .nav-justified > li > a {
    margin-bottom: 0;
  }
}
.nav-tabs-justified {
  border-bottom: 0;
}
.nav-tabs-justified > li > a {
  margin-right: 0;
  border-radius: 4px;
}
.nav-tabs-justified > .active > a,
.nav-tabs-justified > .active > a:hover,
.nav-tabs-justified > .active > a:focus {
  border: 1px solid #ddd;
}
@media (min-width: 768px) {
  .nav-tabs-justified > li > a {
    border-bottom: 1px solid #ddd;
    border-radius: 4px 4px 0 0;
  }
  .nav-tabs-justified > .active > a,
  .nav-tabs-justified > .active > a:hover,
  .nav-tabs-justified > .active > a:focus {
    border-bottom-color: #fff;
  }
}
.tab-content > .tab-pane {
  display: none;
  visibility: hidden;
}
.tab-content > .active {
  display: block;
  visibility: visible;
}
.nav-tabs .dropdown-menu {
  margin-top: -1px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.navbar {
  position: relative;
  min-height: 50px;
  margin-bottom: 20px;
  border: 1px solid transparent;
}
@media (min-width: 768px) {
  .navbar {
    border-radius: 4px;
  }
}
@media (min-width: 768px) {
  .navbar-header {
    float: left;
  }
}
.navbar-collapse {
  padding-right: 15px;
  padding-left: 15px;
  overflow-x: visible;
  -webkit-overflow-scrolling: touch;
  border-top: 1px solid transparent;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
}
.navbar-collapse.in {
  overflow-y: auto;
}
@media (min-width: 768px) {
  .navbar-collapse {
    width: auto;
    border-top: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .navbar-collapse.collapse {
    display: block !important;
    height: auto !important;
    padding-bottom: 0;
    overflow: visible !important;
    visibility: visible !important;
  }
  .navbar-collapse.in {
    overflow-y: visible;
  }
  .navbar-fixed-top .navbar-collapse,
  .navbar-static-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    padding-right: 0;
    padding-left: 0;
  }
}
.navbar-fixed-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
  max-height: 340px;
}
@media (max-device-width: 480px) and (orientation: landscape) {
  .navbar-fixed-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    max-height: 200px;
  }
}
.container > .navbar-header,
.container-fluid > .navbar-header,
.container > .navbar-collapse,
.container-fluid > .navbar-collapse {
  margin-right: -15px;
  margin-left: -15px;
}
@media (min-width: 768px) {
  .container > .navbar-header,
  .container-fluid > .navbar-header,
  .container > .navbar-collapse,
  .container-fluid > .navbar-collapse {
    margin-right: 0;
    margin-left: 0;
  }
}
.navbar-static-top {
  z-index: 1000;
  border-width: 0 0 1px;
}
@media (min-width: 768px) {
  .navbar-static-top {
    border-radius: 0;
  }
}
.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1030;
}
@media (min-width: 768px) {
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    border-radius: 0;
  }
}
.navbar-fixed-top {
  top: 0;
  border-width: 0 0 1px;
}
.navbar-fixed-bottom {
  bottom: 0;
  margin-bottom: 0;
  border-width: 1px 0 0;
}
.navbar-brand {
  float: left;
  height: 50px;
  padding: 15px 15px;
  font-size: 18px;
  line-height: 20px;
}
.navbar-brand:hover,
.navbar-brand:focus {
  text-decoration: none;
}
.navbar-brand > img {
  display: block;
}
@media (min-width: 768px) {
  .navbar > .container .navbar-brand,
  .navbar > .container-fluid .navbar-brand {
    margin-left: -15px;
  }
}
.navbar-toggle {
  position: relative;
  float: right;
  padding: 9px 10px;
  margin-top: 8px;
  margin-right: 15px;
  margin-bottom: 8px;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
.navbar-toggle:focus {
  outline: 0;
}
.navbar-toggle .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}
.navbar-toggle .icon-bar + .icon-bar {
  margin-top: 4px;
}
@media (min-width: 768px) {
  .navbar-toggle {
    display: none;
  }
}
.navbar-nav {
  margin: 7.5px -15px;
}
.navbar-nav > li > a {
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 20px;
}
@media (max-width: 767px) {
  .navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .navbar-nav .open .dropdown-menu > li > a,
  .navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
  }
  .navbar-nav .open .dropdown-menu > li > a {
    line-height: 20px;
  }
  .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-nav .open .dropdown-menu > li > a:focus {
    background-image: none;
  }
}
@media (min-width: 768px) {
  .navbar-nav {
    float: left;
    margin: 0;
  }
  .navbar-nav > li {
    float: left;
  }
  .navbar-nav > li > a {
    padding-top: 15px;
    padding-bottom: 15px;
  }
}
.navbar-form {
  padding: 10px 15px;
  margin-top: 8px;
  margin-right: -15px;
  margin-bottom: 8px;
  margin-left: -15px;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1);
}
@media (min-width: 768px) {
  .navbar-form .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .navbar-form .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
  }
  .navbar-form .form-control-static {
    display: inline-block;
  }
  .navbar-form .input-group {
    display: inline-table;
    vertical-align: middle;
  }
  .navbar-form .input-group .input-group-addon,
  .navbar-form .input-group .input-group-btn,
  .navbar-form .input-group .form-control {
    width: auto;
  }
  .navbar-form .input-group > .form-control {
    width: 100%;
  }
  .navbar-form .control-label {
    margin-bottom: 0;
    vertical-align: middle;
  }
  .navbar-form .radio,
  .navbar-form .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle;
  }
  .navbar-form .radio label,
  .navbar-form .checkbox label {
    padding-left: 0;
  }
  .navbar-form .radio input[type="radio"],
  .navbar-form .checkbox input[type="checkbox"] {
    position: relative;
    margin-left: 0;
  }
  .navbar-form .has-feedback .form-control-feedback {
    top: 0;
  }
}
@media (max-width: 767px) {
  .navbar-form .form-group {
    margin-bottom: 5px;
  }
  .navbar-form .form-group:last-child {
    margin-bottom: 0;
  }
}
@media (min-width: 768px) {
  .navbar-form {
    width: auto;
    padding-top: 0;
    padding-bottom: 0;
    margin-right: 0;
    margin-left: 0;
    border: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
}
.navbar-nav > li > .dropdown-menu {
  margin-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
  margin-bottom: 0;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.navbar-btn {
  margin-top: 8px;
  margin-bottom: 8px;
}
.navbar-btn.btn-sm {
  margin-top: 10px;
  margin-bottom: 10px;
}
.navbar-btn.btn-xs {
  margin-top: 14px;
  margin-bottom: 14px;
}
.navbar-text {
  margin-top: 15px;
  margin-bottom: 15px;
}
@media (min-width: 768px) {
  .navbar-text {
    float: left;
    margin-right: 15px;
    margin-left: 15px;
  }
}
@media (min-width: 768px) {
  .navbar-left {
    float: left !important;
  }
  .navbar-right {
    float: right !important;
    margin-right: -15px;
  }
  .navbar-right ~ .navbar-right {
    margin-right: 0;
  }
}
.navbar-default {
  background-color: #f8f8f8;
  border-color: #e7e7e7;
}
.navbar-default .navbar-brand {
  color: #777;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  color: #5e5e5e;
  background-color: transparent;
}
.navbar-default .navbar-text {
  color: #777;
}
.navbar-default .navbar-nav > li > a {
  color: #777;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #333;
  background-color: transparent;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #555;
  background-color: #e7e7e7;
}
.navbar-default .navbar-nav > .disabled > a,
.navbar-default .navbar-nav > .disabled > a:hover,
.navbar-default .navbar-nav > .disabled > a:focus {
  color: #ccc;
  background-color: transparent;
}
.navbar-default .navbar-toggle {
  border-color: #ddd;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #ddd;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #888;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #e7e7e7;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #555;
  background-color: #e7e7e7;
}
@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #777;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #333;
    background-color: transparent;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #555;
    background-color: #e7e7e7;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #ccc;
    background-color: transparent;
  }
}
.navbar-default .navbar-link {
  color: #777;
}
.navbar-default .navbar-link:hover {
  color: #333;
}
.navbar-default .btn-link {
  color: #777;
}
.navbar-default .btn-link:hover,
.navbar-default .btn-link:focus {
  color: #333;
}
.navbar-default .btn-link[disabled]:hover,
fieldset[disabled] .navbar-default .btn-link:hover,
.navbar-default .btn-link[disabled]:focus,
fieldset[disabled] .navbar-default .btn-link:focus {
  color: #ccc;
}
.navbar-inverse {
  background-color: #222;
  border-color: #080808;
}
.navbar-inverse .navbar-brand {
  color: #9d9d9d;
}
.navbar-inverse .navbar-brand:hover,
.navbar-inverse .navbar-brand:focus {
  color: #fff;
  background-color: transparent;
}
.navbar-inverse .navbar-text {
  color: #9d9d9d;
}
.navbar-inverse .navbar-nav > li > a {
  color: #9d9d9d;
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
  color: #fff;
  background-color: transparent;
}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
  color: #fff;
  background-color: #080808;
}
.navbar-inverse .navbar-nav > .disabled > a,
.navbar-inverse .navbar-nav > .disabled > a:hover,
.navbar-inverse .navbar-nav > .disabled > a:focus {
  color: #444;
  background-color: transparent;
}
.navbar-inverse .navbar-toggle {
  border-color: #333;
}
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
  background-color: #333;
}
.navbar-inverse .navbar-toggle .icon-bar {
  background-color: #fff;
}
.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
  border-color: #101010;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
  color: #fff;
  background-color: #080808;
}
@media (max-width: 767px) {
  .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
    border-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
    background-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
    color: #9d9d9d;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #fff;
    background-color: transparent;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #fff;
    background-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #444;
    background-color: transparent;
  }
}
.navbar-inverse .navbar-link {
  color: #9d9d9d;
}
.navbar-inverse .navbar-link:hover {
  color: #fff;
}
.navbar-inverse .btn-link {
  color: #9d9d9d;
}
.navbar-inverse .btn-link:hover,
.navbar-inverse .btn-link:focus {
  color: #fff;
}
.navbar-inverse .btn-link[disabled]:hover,
fieldset[disabled] .navbar-inverse .btn-link:hover,
.navbar-inverse .btn-link[disabled]:focus,
fieldset[disabled] .navbar-inverse .btn-link:focus {
  color: #444;
}
.breadcrumb {
  padding: 8px 15px;
  margin-bottom: 20px;
  list-style: none;
  background-color: #f9f9f9;
  border-radius: 4px;
}
.breadcrumb > li {
  display: inline-block;
}
.breadcrumb > li + li:before {
  padding: 0 5px;
  color: #ccc;
  content: "/\00a0";
}
.breadcrumb > .active {
  color: #777;
}
.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 20px 0;
  border-radius: 4px;
}
.pagination > li {
  display: inline;
}
.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  color: #337ab7;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #ddd;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
  margin-left: 0;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
  color: #23527c;
  background-color: #eee;
  border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  z-index: 2;
  color: #fff;
  cursor: default;
  background-color: #337ab7;
  border-color: #337ab7;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
  color: #777;
  cursor: not-allowed;
  background-color: #fff;
  border-color: #ddd;
}
.pagination-lg > li > a,
.pagination-lg > li > span {
  padding: 10px 16px;
  font-size: 18px;
}
.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.pagination-sm > li > a,
.pagination-sm > li > span {
  padding: 5px 10px;
  font-size: 12px;
}
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.pager {
  padding-left: 0;
  margin: 20px 0;
  text-align: center;
  list-style: none;
}
.pager li {
  display: inline;
}
.pager li > a,
.pager li > span {
  display: inline-block;
  padding: 5px 14px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 15px;
}
.pager li > a:hover,
.pager li > a:focus {
  text-decoration: none;
  background-color: #eee;
}
.pager .next > a,
.pager .next > span {
  float: right;
}
.pager .previous > a,
.pager .previous > span {
  float: left;
}
.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
  color: #777;
  cursor: not-allowed;
  background-color: #fff;
}
.label {
  display: inline;
  padding: .2em .6em .3em;
  font-size: 75%;
  font-weight: bold;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: .25em;
}
a.label:hover,
a.label:focus {
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}
.label:empty {
  display: none;
}
.btn .label {
  position: relative;
  top: -1px;
}
.label-default {
  background-color: #777;
}
.label-default[href]:hover,
.label-default[href]:focus {
  background-color: #5e5e5e;
}
.label-primary {
  background-color: #337ab7;
}
.label-primary[href]:hover,
.label-primary[href]:focus {
  background-color: #286090;
}
.label-success {
  background-color: #5cb85c;
}
.label-success[href]:hover,
.label-success[href]:focus {
  background-color: #449d44;
}
.label-info {
  background-color: #5bc0de;
}
.label-info[href]:hover,
.label-info[href]:focus {
  background-color: #31b0d5;
}
.label-warning {
  background-color: #f0ad4e;
}
.label-warning[href]:hover,
.label-warning[href]:focus {
  background-color: #ec971f;
}
.label-danger {
  background-color: #d9534f;
}
.label-danger[href]:hover,
.label-danger[href]:focus {
  background-color: #c9302c;
}
.badge {
  display: inline-block;
  min-width: 10px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  background-color: #777;
  border-radius: 10px;
}
.badge:empty {
  display: none;
}
.btn .badge {
  position: relative;
  top: -1px;
}
.btn-xs .badge {
  top: 0;
  padding: 1px 5px;
}
a.badge:hover,
a.badge:focus {
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}
.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
  color: #337ab7;
  background-color: #fff;
}
.list-group-item > .badge {
  float: right;
}
.list-group-item > .badge + .badge {
  margin-right: 5px;
}
.nav-pills > li > a > .badge {
  margin-left: 3px;
}
.jumbotron {
  padding: 30px 15px;
  margin-bottom: 30px;
  color: inherit;
  background-color: #eee;
}
.jumbotron h1,
.jumbotron .h1 {
  color: inherit;
}
.jumbotron p {
  margin-bottom: 15px;
  font-size: 21px;
  font-weight: 200;
}
.jumbotron > hr {
  border-top-color: #d5d5d5;
}
.container .jumbotron,
.container-fluid .jumbotron {
  border-radius: 6px;
}
.jumbotron .container {
  max-width: 100%;
}
@media screen and (min-width: 768px) {
  .jumbotron {
    padding: 48px 0;
  }
  .container .jumbotron,
  .container-fluid .jumbotron {
    padding-right: 60px;
    padding-left: 60px;
  }
  .jumbotron h1,
  .jumbotron .h1 {
    font-size: 63px;
  }
}
.thumbnail {
  display: block;
  padding: 4px;
  margin-bottom: 20px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: border .2s ease-in-out;
       -o-transition: border .2s ease-in-out;
          transition: border .2s ease-in-out;
}
.thumbnail > img,
.thumbnail a > img {
  margin-right: auto;
  margin-left: auto;
}
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
  border-color: #337ab7;
}
.thumbnail .caption {
  padding: 9px;
  color: #333;
}
.alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
}
.alert h4 {
  margin-top: 0;
  color: inherit;
}
.alert .alert-link {
  font-weight: bold;
}
.alert > p,
.alert > ul {
  margin-bottom: 0;
}
.alert > p + p {
  margin-top: 5px;
}
.alert-dismissable,
.alert-dismissible {
  padding-right: 35px;
}
.alert-dismissable .close,
.alert-dismissible .close {
  position: relative;
  top: -2px;
  right: -21px;
  color: inherit;
}
.alert-success {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}
.alert-success hr {
  border-top-color: #c9e2b3;
}
.alert-success .alert-link {
  color: #2b542c;
}
.alert-info {
  color: #31708f;
  background-color: #d9edf7;
  border-color: #bce8f1;
}
.alert-info hr {
  border-top-color: #a6e1ec;
}
.alert-info .alert-link {
  color: #245269;
}
.alert-warning {
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
}
.alert-warning hr {
  border-top-color: #f7e1b5;
}
.alert-warning .alert-link {
  color: #66512c;
}
.alert-danger {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
}
.alert-danger hr {
  border-top-color: #e4b9c0;
}
.alert-danger .alert-link {
  color: #843534;
}
@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}
@-o-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}
@keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}
.progress {
  height: 20px;
  margin-bottom: 20px;
  overflow: hidden;
  background-color: #f5f5f5;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
          box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}
.progress-bar {
  float: left;
  width: 0;
  height: 100%;
  font-size: 12px;
  line-height: 20px;
  color: #fff;
  text-align: center;
  background-color: #337ab7;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
  -webkit-transition: width .6s ease;
       -o-transition: width .6s ease;
          transition: width .6s ease;
}
.progress-striped .progress-bar,
.progress-bar-striped {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:         linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  -webkit-background-size: 40px 40px;
          background-size: 40px 40px;
}
.progress.active .progress-bar,
.progress-bar.active {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
       -o-animation: progress-bar-stripes 2s linear infinite;
          animation: progress-bar-stripes 2s linear infinite;
}
.progress-bar-success {
  background-color: #5cb85c;
}
.progress-striped .progress-bar-success {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:         linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}
.progress-bar-info {
  background-color: #5bc0de;
}
.progress-striped .progress-bar-info {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:         linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}
.progress-bar-warning {
  background-color: #f0ad4e;
}
.progress-striped .progress-bar-warning {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:         linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}
.progress-bar-danger {
  background-color: #d9534f;
}
.progress-striped .progress-bar-danger {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image:         linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}
.media {
  margin-top: 15px;
}
.media:first-child {
  margin-top: 0;
}
.media,
.media-body {
  overflow: hidden;
  zoom: 1;
}
.media-body {
  width: 10000px;
}
.media-object {
  display: block;
}
.media-right,
.media > .pull-right {
  padding-left: 10px;
}
.media-left,
.media > .pull-left {
  padding-right: 10px;
}
.media-left,
.media-right,
.media-body {
  display: table-cell;
  vertical-align: top;
}
.media-middle {
  vertical-align: middle;
}
.media-bottom {
  vertical-align: bottom;
}
.media-heading {
  margin-top: 0;
  margin-bottom: 5px;
}
.media-list {
  padding-left: 0;
  list-style: none;
}
.list-group {
  padding-left: 0;
  margin-bottom: 20px;
}
.list-group-item {
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: #fff;
  border: 1px solid #ddd;
}
.list-group-item:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.list-group-item:last-child {
  margin-bottom: 0;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
a.list-group-item {
  color: #555;
}
a.list-group-item .list-group-item-heading {
  color: #333;
}
a.list-group-item:hover,
a.list-group-item:focus {
  color: #555;
  text-decoration: none;
  background-color: #f5f5f5;
}
.list-group-item.disabled,
.list-group-item.disabled:hover,
.list-group-item.disabled:focus {
  color: #777;
  cursor: not-allowed;
  background-color: #eee;
}
.list-group-item.disabled .list-group-item-heading,
.list-group-item.disabled:hover .list-group-item-heading,
.list-group-item.disabled:focus .list-group-item-heading {
  color: inherit;
}
.list-group-item.disabled .list-group-item-text,
.list-group-item.disabled:hover .list-group-item-text,
.list-group-item.disabled:focus .list-group-item-text {
  color: #777;
}
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  z-index: 2;
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7;
}
.list-group-item.active .list-group-item-heading,
.list-group-item.active:hover .list-group-item-heading,
.list-group-item.active:focus .list-group-item-heading,
.list-group-item.active .list-group-item-heading > small,
.list-group-item.active:hover .list-group-item-heading > small,
.list-group-item.active:focus .list-group-item-heading > small,
.list-group-item.active .list-group-item-heading > .small,
.list-group-item.active:hover .list-group-item-heading > .small,
.list-group-item.active:focus .list-group-item-heading > .small {
  color: inherit;
}
.list-group-item.active .list-group-item-text,
.list-group-item.active:hover .list-group-item-text,
.list-group-item.active:focus .list-group-item-text {
  color: #c7ddef;
}
.list-group-item-success {
  color: #3c763d;
  background-color: #dff0d8;
}
a.list-group-item-success {
  color: #3c763d;
}
a.list-group-item-success .list-group-item-heading {
  color: inherit;
}
a.list-group-item-success:hover,
a.list-group-item-success:focus {
  color: #3c763d;
  background-color: #d0e9c6;
}
a.list-group-item-success.active,
a.list-group-item-success.active:hover,
a.list-group-item-success.active:focus {
  color: #fff;
  background-color: #3c763d;
  border-color: #3c763d;
}
.list-group-item-info {
  color: #31708f;
  background-color: #d9edf7;
}
a.list-group-item-info {
  color: #31708f;
}
a.list-group-item-info .list-group-item-heading {
  color: inherit;
}
a.list-group-item-info:hover,
a.list-group-item-info:focus {
  color: #31708f;
  background-color: #c4e3f3;
}
a.list-group-item-info.active,
a.list-group-item-info.active:hover,
a.list-group-item-info.active:focus {
  color: #fff;
  background-color: #31708f;
  border-color: #31708f;
}
.list-group-item-warning {
  color: #8a6d3b;
  background-color: #fcf8e3;
}
a.list-group-item-warning {
  color: #8a6d3b;
}
a.list-group-item-warning .list-group-item-heading {
  color: inherit;
}
a.list-group-item-warning:hover,
a.list-group-item-warning:focus {
  color: #8a6d3b;
  background-color: #faf2cc;
}
a.list-group-item-warning.active,
a.list-group-item-warning.active:hover,
a.list-group-item-warning.active:focus {
  color: #fff;
  background-color: #8a6d3b;
  border-color: #8a6d3b;
}
.list-group-item-danger {
  color: #a94442;
  background-color: #f2dede;
}
a.list-group-item-danger {
  color: #a94442;
}
a.list-group-item-danger .list-group-item-heading {
  color: inherit;
}
a.list-group-item-danger:hover,
a.list-group-item-danger:focus {
  color: #a94442;
  background-color: #ebcccc;
}
a.list-group-item-danger.active,
a.list-group-item-danger.active:hover,
a.list-group-item-danger.active:focus {
  color: #fff;
  background-color: #a94442;
  border-color: #a94442;
}
.list-group-item-heading {
  margin-top: 0;
  margin-bottom: 5px;
}
.list-group-item-text {
  margin-bottom: 0;
  line-height: 1.3;
}
.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
          box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}
.panel-body {
  padding: 15px;
}
.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel-heading > .dropdown .dropdown-toggle {
  color: inherit;
}
.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  color: inherit;
}
.panel-title > a,
.panel-title > small,
.panel-title > .small,
.panel-title > small > a,
.panel-title > .small > a {
  color: inherit;
}
.panel-footer {
  padding: 10px 15px;
  background-color: #f5f5f5;
  border-top: 1px solid #ddd;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .list-group,
.panel > .panel-collapse > .list-group {
  margin-bottom: 0;
}
.panel > .list-group .list-group-item,
.panel > .panel-collapse > .list-group .list-group-item {
  border-width: 1px 0;
  border-radius: 0;
}
.panel > .list-group:first-child .list-group-item:first-child,
.panel > .panel-collapse > .list-group:first-child .list-group-item:first-child {
  border-top: 0;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel > .list-group:last-child .list-group-item:last-child,
.panel > .panel-collapse > .list-group:last-child .list-group-item:last-child {
  border-bottom: 0;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel-heading + .list-group .list-group-item:first-child {
  border-top-width: 0;
}
.list-group + .panel-footer {
  border-top-width: 0;
}
.panel > .table,
.panel > .table-responsive > .table,
.panel > .panel-collapse > .table {
  margin-bottom: 0;
}
.panel > .table caption,
.panel > .table-responsive > .table caption,
.panel > .panel-collapse > .table caption {
  padding-right: 15px;
  padding-left: 15px;
}
.panel > .table:first-child,
.panel > .table-responsive:first-child > .table:first-child {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
.panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
  border-top-left-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
.panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
.panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
.panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
  border-top-right-radius: 3px;
}
.panel > .table:last-child,
.panel > .table-responsive:last-child > .table:last-child {
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child {
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
.panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
  border-bottom-left-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
.panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
  border-bottom-right-radius: 3px;
}
.panel > .panel-body + .table,
.panel > .panel-body + .table-responsive,
.panel > .table + .panel-body,
.panel > .table-responsive + .panel-body {
  border-top: 1px solid #ddd;
}
.panel > .table > tbody:first-child > tr:first-child th,
.panel > .table > tbody:first-child > tr:first-child td {
  border-top: 0;
}
.panel > .table-bordered,
.panel > .table-responsive > .table-bordered {
  border: 0;
}
.panel > .table-bordered > thead > tr > th:first-child,
.panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
.panel > .table-bordered > tbody > tr > th:first-child,
.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
.panel > .table-bordered > tfoot > tr > th:first-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
.panel > .table-bordered > thead > tr > td:first-child,
.panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
.panel > .table-bordered > tbody > tr > td:first-child,
.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
.panel > .table-bordered > tfoot > tr > td:first-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
  border-left: 0;
}
.panel > .table-bordered > thead > tr > th:last-child,
.panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
.panel > .table-bordered > tbody > tr > th:last-child,
.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
.panel > .table-bordered > tfoot > tr > th:last-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
.panel > .table-bordered > thead > tr > td:last-child,
.panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
.panel > .table-bordered > tbody > tr > td:last-child,
.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
.panel > .table-bordered > tfoot > tr > td:last-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
  border-right: 0;
}
.panel > .table-bordered > thead > tr:first-child > td,
.panel > .table-responsive > .table-bordered > thead > tr:first-child > td,
.panel > .table-bordered > tbody > tr:first-child > td,
.panel > .table-responsive > .table-bordered > tbody > tr:first-child > td,
.panel > .table-bordered > thead > tr:first-child > th,
.panel > .table-responsive > .table-bordered > thead > tr:first-child > th,
.panel > .table-bordered > tbody > tr:first-child > th,
.panel > .table-responsive > .table-bordered > tbody > tr:first-child > th {
  border-bottom: 0;
}
.panel > .table-bordered > tbody > tr:last-child > td,
.panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
.panel > .table-bordered > tfoot > tr:last-child > td,
.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td,
.panel > .table-bordered > tbody > tr:last-child > th,
.panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
.panel > .table-bordered > tfoot > tr:last-child > th,
.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th {
  border-bottom: 0;
}
.panel > .table-responsive {
  margin-bottom: 0;
  border: 0;
}
.panel-group {
  margin-bottom: 20px;
}
.panel-group .panel {
  margin-bottom: 0;
  border-radius: 4px;
}
.panel-group .panel + .panel {
  margin-top: 5px;
}
.panel-group .panel-heading {
  border-bottom: 0;
}
.panel-group .panel-heading + .panel-collapse > .panel-body,
.panel-group .panel-heading + .panel-collapse > .list-group {
  border-top: 1px solid #ddd;
}
.panel-group .panel-footer {
  border-top: 0;
}
.panel-group .panel-footer + .panel-collapse .panel-body {
  border-bottom: 1px solid #ddd;
}
.panel-default {
  border-color: #ddd;
}
.panel-default > .panel-heading {
  color: #333;
  background-color: #f5f5f5;
  border-color: #ddd;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #ddd;
}
.panel-default > .panel-heading .badge {
  color: #f5f5f5;
  background-color: #333;
}
.panel-default > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #ddd;
}
.panel-primary {
  border-color: #337ab7;
}
.panel-primary > .panel-heading {
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7;
}
.panel-primary > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #337ab7;
}
.panel-primary > .panel-heading .badge {
  color: #337ab7;
  background-color: #fff;
}
.panel-primary > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #337ab7;
}
.panel-success {
  border-color: #d6e9c6;
}
.panel-success > .panel-heading {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}
.panel-success > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #d6e9c6;
}
.panel-success > .panel-heading .badge {
  color: #dff0d8;
  background-color: #3c763d;
}
.panel-success > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #d6e9c6;
}
.panel-info {
  border-color: #bce8f1;
}
.panel-info > .panel-heading {
  color: #31708f;
  background-color: #d9edf7;
  border-color: #bce8f1;
}
.panel-info > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #bce8f1;
}
.panel-info > .panel-heading .badge {
  color: #d9edf7;
  background-color: #31708f;
}
.panel-info > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #bce8f1;
}
.panel-warning {
  border-color: #faebcc;
}
.panel-warning > .panel-heading {
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
}
.panel-warning > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #faebcc;
}
.panel-warning > .panel-heading .badge {
  color: #fcf8e3;
  background-color: #8a6d3b;
}
.panel-warning > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #faebcc;
}
.panel-danger {
  border-color: #ebccd1;
}
.panel-danger > .panel-heading {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
}
.panel-danger > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #ebccd1;
}
.panel-danger > .panel-heading .badge {
  color: #f2dede;
  background-color: #a94442;
}
.panel-danger > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #ebccd1;
}
.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.embed-responsive.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive.embed-responsive-4by3 {
  padding-bottom: 75%;
}
.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
}
.well blockquote {
  border-color: #ddd;
  border-color: rgba(0, 0, 0, .15);
}
.well-lg {
  padding: 24px;
  border-radius: 6px;
}
.well-sm {
  padding: 9px;
  border-radius: 3px;
}
.close {
  float: right;
  font-size: 21px;
  font-weight: bold;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  filter: alpha(opacity=20);
  opacity: .2;
}
.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
  filter: alpha(opacity=50);
  opacity: .5;
}
button.close {
  -webkit-appearance: none;
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
}
.modal-open {
  overflow: hidden;
}
.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  display: none;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  outline: 0;
}
.modal.fade .modal-dialog {
  -webkit-transition: -webkit-transform .3s ease-out;
       -o-transition:      -o-transform .3s ease-out;
          transition:         transform .3s ease-out;
  -webkit-transform: translate(0, -25%);
      -ms-transform: translate(0, -25%);
       -o-transform: translate(0, -25%);
          transform: translate(0, -25%);
}
.modal.in .modal-dialog {
  -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
       -o-transform: translate(0, 0);
          transform: translate(0, 0);
}
.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}
.modal-dialog {
  position: relative;
  width: auto;
  margin: 10px;
}
.modal-content {
  position: relative;
  background-color: #fff;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  border: 1px solid #999;
  border: 1px solid rgba(0, 0, 0, .2);
  border-radius: 6px;
  outline: 0;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
          box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}
.modal-backdrop {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  background-color: #000;
}
.modal-backdrop.fade {
  filter: alpha(opacity=0);
  opacity: 0;
}
.modal-backdrop.in {
  filter: alpha(opacity=50);
  opacity: .5;
}
.modal-header {
  min-height: 16.42857143px;
  padding: 15px;
}
.modal-header .close {
  margin-top: -2px;
}
.modal-title {
  margin: 0;
  line-height: 1.42857143;
}
.modal-body {
  position: relative;
  padding: 15px;
}
.modal-footer {
  padding: 15px;
  text-align: right;
  border-top: 1px solid #e5e5e5;
}
.modal-footer .btn + .btn {
  margin-bottom: 0;
  margin-left: 5px;
}
.modal-footer .btn-group .btn + .btn {
  margin-left: -1px;
}
.modal-footer .btn-block + .btn-block {
  margin-left: 0;
}
.modal-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}
@media (min-width: 768px) {
  .modal-dialog {
    width: 600px;
    margin: 30px auto;
  }
  .modal-content {
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
            box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
  }
  .modal-sm {
    width: 300px;
  }
}
@media (min-width: 992px) {
  .modal-lg {
    width: 900px;
  }
}
.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.4;
  visibility: visible;
  filter: alpha(opacity=0);
  opacity: 0;
}
.tooltip.in {
  filter: alpha(opacity=90);
  opacity: .9;
}
.tooltip.top {
  padding: 5px 0;
  margin-top: -3px;
}
.tooltip.right {
  padding: 0 5px;
  margin-left: 3px;
}
.tooltip.bottom {
  padding: 5px 0;
  margin-top: 3px;
}
.tooltip.left {
  padding: 0 5px;
  margin-left: -3px;
}
.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  background-color: #000;
  border-radius: 4px;
}
.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.top-left .tooltip-arrow {
  right: 5px;
  bottom: 0;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  left: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000;
}
.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000;
}
.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}
.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  right: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}
.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  left: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}
.popover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1060;
  display: none;
  max-width: 276px;
  padding: 1px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: left;
  white-space: normal;
  background-color: #fff;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .2);
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
          box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
}
.popover.top {
  margin-top: -10px;
}
.popover.right {
  margin-left: 10px;
}
.popover.bottom {
  margin-top: 10px;
}
.popover.left {
  margin-left: -10px;
}
.popover-title {
  padding: 8px 14px;
  margin: 0;
  font-size: 14px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  border-radius: 5px 5px 0 0;
}
.popover-content {
  padding: 9px 14px;
}
.popover > .arrow,
.popover > .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.popover > .arrow {
  border-width: 11px;
}
.popover > .arrow:after {
  content: "";
  border-width: 10px;
}
.popover.top > .arrow {
  bottom: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-color: #999;
  border-top-color: rgba(0, 0, 0, .25);
  border-bottom-width: 0;
}
.popover.top > .arrow:after {
  bottom: 1px;
  margin-left: -10px;
  content: " ";
  border-top-color: #fff;
  border-bottom-width: 0;
}
.popover.right > .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-right-color: #999;
  border-right-color: rgba(0, 0, 0, .25);
  border-left-width: 0;
}
.popover.right > .arrow:after {
  bottom: -10px;
  left: 1px;
  content: " ";
  border-right-color: #fff;
  border-left-width: 0;
}
.popover.bottom > .arrow {
  top: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999;
  border-bottom-color: rgba(0, 0, 0, .25);
}
.popover.bottom > .arrow:after {
  top: 1px;
  margin-left: -10px;
  content: " ";
  border-top-width: 0;
  border-bottom-color: #fff;
}
.popover.left > .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999;
  border-left-color: rgba(0, 0, 0, .25);
}
.popover.left > .arrow:after {
  right: 1px;
  bottom: -10px;
  content: " ";
  border-right-width: 0;
  border-left-color: #fff;
}
.carousel {
  position: relative;
}
.carousel-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.carousel-inner > .item {
  position: relative;
  display: none;
  -webkit-transition: .6s ease-in-out left;
       -o-transition: .6s ease-in-out left;
          transition: .6s ease-in-out left;
}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  line-height: 1;
}
@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-inner > .item {
    -webkit-transition: -webkit-transform .6s ease-in-out;
         -o-transition:      -o-transform .6s ease-in-out;
            transition:         transform .6s ease-in-out;

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-perspective: 1000;
            perspective: 1000;
  }
  .carousel-inner > .item.next,
  .carousel-inner > .item.active.right {
    left: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }
  .carousel-inner > .item.prev,
  .carousel-inner > .item.active.left {
    left: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
  .carousel-inner > .item.next.left,
  .carousel-inner > .item.prev.right,
  .carousel-inner > .item.active {
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
.carousel-inner > .active,
.carousel-inner > .next,
.carousel-inner > .prev {
  display: block;
}
.carousel-inner > .active {
  left: 0;
}
.carousel-inner > .next,
.carousel-inner > .prev {
  position: absolute;
  top: 0;
  width: 100%;
}
.carousel-inner > .next {
  left: 100%;
}
.carousel-inner > .prev {
  left: -100%;
}
.carousel-inner > .next.left,
.carousel-inner > .prev.right {
  left: 0;
}
.carousel-inner > .active.left {
  left: -100%;
}
.carousel-inner > .active.right {
  left: 100%;
}
.carousel-control {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 15%;
  font-size: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
  filter: alpha(opacity=50);
  opacity: .5;
}
.carousel-control.left {
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 100%);
  background-image:      -o-linear-gradient(left, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 100%);
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, .0001)));
  background-image:         linear-gradient(to right, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
  background-repeat: repeat-x;
}
.carousel-control.right {
  right: 0;
  left: auto;
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .0001) 0%, rgba(0, 0, 0, .5) 100%);
  background-image:      -o-linear-gradient(left, rgba(0, 0, 0, .0001) 0%, rgba(0, 0, 0, .5) 100%);
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .0001)), to(rgba(0, 0, 0, .5)));
  background-image:         linear-gradient(to right, rgba(0, 0, 0, .0001) 0%, rgba(0, 0, 0, .5) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
  background-repeat: repeat-x;
}
.carousel-control:hover,
.carousel-control:focus {
  color: #fff;
  text-decoration: none;
  filter: alpha(opacity=90);
  outline: 0;
  opacity: .9;
}
.carousel-control .icon-prev,
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: inline-block;
}
.carousel-control .icon-prev,
.carousel-control .glyphicon-chevron-left {
  left: 50%;
  margin-left: -10px;
}
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-right {
  right: 50%;
  margin-right: -10px;
}
.carousel-control .icon-prev,
.carousel-control .icon-next {
  width: 20px;
  height: 20px;
  margin-top: -10px;
  font-family: serif;
  line-height: 1;
}
.carousel-control .icon-prev:before {
  content: '\2039';
}
.carousel-control .icon-next:before {
  content: '\203a';
}
.carousel-indicators {
  position: absolute;
  bottom: 10px;
  left: 50%;
  z-index: 15;
  width: 60%;
  padding-left: 0;
  margin-left: -30%;
  text-align: center;
  list-style: none;
}
.carousel-indicators li {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 1px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #000 \9;
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid #fff;
  border-radius: 10px;
}
.carousel-indicators .active {
  width: 12px;
  height: 12px;
  margin: 0;
  background-color: #fff;
}
.carousel-caption {
  position: absolute;
  right: 15%;
  bottom: 20px;
  left: 15%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}
.carousel-caption .btn {
  text-shadow: none;
}
@media screen and (min-width: 768px) {
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-prev,
  .carousel-control .icon-next {
    width: 30px;
    height: 30px;
    margin-top: -15px;
    font-size: 30px;
  }
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .icon-prev {
    margin-left: -15px;
  }
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-next {
    margin-right: -15px;
  }
  .carousel-caption {
    right: 20%;
    left: 20%;
    padding-bottom: 30px;
  }
  .carousel-indicators {
    bottom: 20px;
  }
}
.clearfix:before,
.clearfix:after,
.dl-horizontal dd:before,
.dl-horizontal dd:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after,
.form-horizontal .form-group:before,
.form-horizontal .form-group:after,
.btn-toolbar:before,
.btn-toolbar:after,
.btn-group-vertical > .btn-group:before,
.btn-group-vertical > .btn-group:after,
.nav:before,
.nav:after,
.navbar:before,
.navbar:after,
.navbar-header:before,
.navbar-header:after,
.navbar-collapse:before,
.navbar-collapse:after,
.pager:before,
.pager:after,
.panel-body:before,
.panel-body:after,
.modal-footer:before,
.modal-footer:after {
  display: table;
  content: " ";
}
.clearfix:after,
.dl-horizontal dd:after,
.container:after,
.container-fluid:after,
.row:after,
.form-horizontal .form-group:after,
.btn-toolbar:after,
.btn-group-vertical > .btn-group:after,
.nav:after,
.navbar:after,
.navbar-header:after,
.navbar-collapse:after,
.pager:after,
.panel-body:after,
.modal-footer:after {
  clear: both;
}
.center-block {
  display: block;
  margin-right: auto;
  margin-left: auto;
}
.pull-right {
  float: right !important;
}
.pull-left {
  float: left !important;
}
.hide {
  display: none !important;
}
.show {
  display: block !important;
}
.invisible {
  visibility: hidden;
}
.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.hidden {
  display: none !important;
  visibility: hidden !important;
}
.affix {
  position: fixed;
}
@-ms-viewport {
  width: device-width;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
  display: none !important;
}
@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-block {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
  table.visible-md {
    display: table;
  }
  tr.visible-md {
    display: table-row !important;
  }
  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
  table.visible-lg {
    display: table;
  }
  tr.visible-lg {
    display: table-row !important;
  }
  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}
.visible-print {
  display: none !important;
}
@media print {
  .visible-print {
    display: block !important;
  }
  table.visible-print {
    display: table;
  }
  tr.visible-print {
    display: table-row !important;
  }
  th.visible-print,
  td.visible-print {
    display: table-cell !important;
  }
}
.visible-print-block {
  display: none !important;
}
@media print {
  .visible-print-block {
    display: block !important;
  }
}
.visible-print-inline {
  display: none !important;
}
@media print {
  .visible-print-inline {
    display: inline !important;
  }
}
.visible-print-inline-block {
  display: none !important;
}
@media print {
  .visible-print-inline-block {
    display: inline-block !important;
  }
}
@media print {
  .hidden-print {
    display: none !important;
  }
}
/*# sourceMappingURL=bootstrap.css.map */


/* ---- js/owl-carousel/owl.carousel.css ---- */
/* 
 * 	Core Owl Carousel CSS File
 *	v1.3.3
 */

/* clearfix */
.owl-carousel .owl-wrapper:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

/* display none until init */
.owl-carousel {
    display: none;
    position: relative;
    width: 100%;
    -ms-touch-action: pan-y;
}

.owl-carousel .owl-wrapper {
    display: none;
    position: relative;
    -webkit-transform: translate3d(0px, 0px, 0px);
}

.owl-carousel .owl-wrapper-outer {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.owl-carousel .owl-wrapper-outer.autoHeight {
    -webkit-transition: height 500ms ease-in-out;
    -moz-transition: height 500ms ease-in-out;
    -ms-transition: height 500ms ease-in-out;
    -o-transition: height 500ms ease-in-out;
    transition: height 500ms ease-in-out;
}

.owl-carousel .owl-item {
    float: left;
}

.owl-controls .owl-page,
.owl-controls .owl-buttons div {
    cursor: pointer;
}

.owl-controls {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* mouse grab icon */
.grabbing {
    cursor: url(../../js/owl-carousel/grabbing.png) 8 8, move;
}

/* fix */
.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
}



/* ---- js/owl-carousel/owl.theme.css ---- */
/*
* 	Owl Carousel Owl Demo Theme 
*	v1.3.3
*/

.owl-theme .owl-controls {
    margin-top: 10px;
    text-align: center;
}

/* Styling Next and Prev buttons */

.owl-theme .owl-controls .owl-buttons div {
    color: #FFF;
    display: inline-block;
    zoom: 1;
    *display: inline; /*IE7 life-saver */
    margin: 5px;
    padding: 3px 10px;
    font-size: 12px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    background: #869791;
    filter: Alpha(Opacity=50); /*IE7 fix*/
    opacity: 0.5;
}

/* Clickable class fix problem with hover on touch devices */
/* Use it for non-touch hover action */
.owl-theme .owl-controls.clickable .owl-buttons div:hover {
    filter: Alpha(Opacity=100); /*IE7 fix*/
    opacity: 1;
    text-decoration: none;
}

/* Styling Pagination*/

.owl-theme .owl-controls .owl-page {
    display: inline-block;
    zoom: 1;
    *display: inline; /*IE7 life-saver */
}

.owl-theme .owl-controls .owl-page span {
    display: block;
    width: 10px;
    height: 10px;
    margin: 5px 5px;
    filter: Alpha(Opacity=30); /*IE7 fix*/
    opacity: 0.3;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 20px;
    background: #3498DB;
    transition: .4s;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
    filter: Alpha(Opacity=100); /*IE7 fix*/
    opacity: 1;
    transition: .4s;
}

/* If PaginationNumbers is true */

.owl-theme .owl-controls .owl-page span.owl-numbers {
    height: auto;
    width: auto;
    color: #FFF;
    padding: 2px 10px;
    font-size: 12px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
}

/* preloading images */
.owl-item.loading {
    min-height: 150px;
    background: url(../../js/owl-carousel/AjaxLoader.gif) no-repeat center center
}

/* ---- js/owl-carousel/owl.transitions.css ---- */
/* 
 *  Owl Carousel CSS3 Transitions 
 *  v1.3.2
 */

.owl-origin {
    -webkit-perspective: 1200px;
    -webkit-perspective-origin-x: 50%;
    -webkit-perspective-origin-y: 50%;
    -moz-perspective: 1200px;
    -moz-perspective-origin-x: 50%;
    -moz-perspective-origin-y: 50%;
    perspective: 1200px;
}

/* fade */
.owl-fade-out {
    z-index: 10;
    -webkit-animation: fadeOut .7s both ease;
    -moz-animation: fadeOut .7s both ease;
    animation: fadeOut .7s both ease;
}

.owl-fade-in {
    -webkit-animation: fadeIn .7s both ease;
    -moz-animation: fadeIn .7s both ease;
    animation: fadeIn .7s both ease;
}

/* backSlide */
.owl-backSlide-out {
    -webkit-animation: backSlideOut 1s both ease;
    -moz-animation: backSlideOut 1s both ease;
    animation: backSlideOut 1s both ease;
}

.owl-backSlide-in {
    -webkit-animation: backSlideIn 1s both ease;
    -moz-animation: backSlideIn 1s both ease;
    animation: backSlideIn 1s both ease;
}

/* goDown */
.owl-goDown-out {
    -webkit-animation: scaleToFade .7s ease both;
    -moz-animation: scaleToFade .7s ease both;
    animation: scaleToFade .7s ease both;
}

.owl-goDown-in {
    -webkit-animation: goDown .6s ease both;
    -moz-animation: goDown .6s ease both;
    animation: goDown .6s ease both;
}

/* scaleUp */
.owl-fadeUp-in {
    -webkit-animation: scaleUpFrom .5s ease both;
    -moz-animation: scaleUpFrom .5s ease both;
    animation: scaleUpFrom .5s ease both;
}

.owl-fadeUp-out {
    -webkit-animation: scaleUpTo .5s ease both;
    -moz-animation: scaleUpTo .5s ease both;
    animation: scaleUpTo .5s ease both;
}

/* Keyframes */
/*empty*/
@-webkit-keyframes empty {
    0% {
        opacity: 1
    }
}

@-moz-keyframes empty {
    0% {
        opacity: 1
    }
}

@keyframes empty {
    0% {
        opacity: 1
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-moz-keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes backSlideOut {
    25% {
        opacity: .5;
        -webkit-transform: translateZ(-500px);
    }
    75% {
        opacity: .5;
        -webkit-transform: translateZ(-500px) translateX(-200%);
    }
    100% {
        opacity: .5;
        -webkit-transform: translateZ(-500px) translateX(-200%);
    }
}

@-moz-keyframes backSlideOut {
    25% {
        opacity: .5;
        -moz-transform: translateZ(-500px);
    }
    75% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(-200%);
    }
    100% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(-200%);
    }
}

@keyframes backSlideOut {
    25% {
        opacity: .5;
        transform: translateZ(-500px);
    }
    75% {
        opacity: .5;
        transform: translateZ(-500px) translateX(-200%);
    }
    100% {
        opacity: .5;
        transform: translateZ(-500px) translateX(-200%);
    }
}

@-webkit-keyframes backSlideIn {
    0%, 25% {
        opacity: .5;
        -webkit-transform: translateZ(-500px) translateX(200%);
    }
    75% {
        opacity: .5;
        -webkit-transform: translateZ(-500px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateZ(0) translateX(0);
    }
}

@-moz-keyframes backSlideIn {
    0%, 25% {
        opacity: .5;
        -moz-transform: translateZ(-500px) translateX(200%);
    }
    75% {
        opacity: .5;
        -moz-transform: translateZ(-500px);
    }
    100% {
        opacity: 1;
        -moz-transform: translateZ(0) translateX(0);
    }
}

@keyframes backSlideIn {
    0%, 25% {
        opacity: .5;
        transform: translateZ(-500px) translateX(200%);
    }
    75% {
        opacity: .5;
        transform: translateZ(-500px);
    }
    100% {
        opacity: 1;
        transform: translateZ(0) translateX(0);
    }
}

@-webkit-keyframes scaleToFade {
    to {
        opacity: 0;
        -webkit-transform: scale(.8);
    }
}

@-moz-keyframes scaleToFade {
    to {
        opacity: 0;
        -moz-transform: scale(.8);
    }
}

@keyframes scaleToFade {
    to {
        opacity: 0;
        transform: scale(.8);
    }
}

@-webkit-keyframes goDown {
    from {
        -webkit-transform: translateY(-100%);
    }
}

@-moz-keyframes goDown {
    from {
        -moz-transform: translateY(-100%);
    }
}

@keyframes goDown {
    from {
        transform: translateY(-100%);
    }
}

@-webkit-keyframes scaleUpFrom {
    from {
        opacity: 0;
        -webkit-transform: scale(1.5);
    }
}

@-moz-keyframes scaleUpFrom {
    from {
        opacity: 0;
        -moz-transform: scale(1.5);
    }
}

@keyframes scaleUpFrom {
    from {
        opacity: 0;
        transform: scale(1.5);
    }
}

@-webkit-keyframes scaleUpTo {
    to {
        opacity: 0;
        -webkit-transform: scale(1.5);
    }
}

@-moz-keyframes scaleUpTo {
    to {
        opacity: 0;
        -moz-transform: scale(1.5);
    }
}

@keyframes scaleUpTo {
    to {
        opacity: 0;
        transform: scale(1.5);
    }
}

/* ---- css/style.css ---- */
@font-face {
	font-family: "Bebas-Neue";
	font-weight: 100;
	src: url("../../fonts/BebasNeue-Thin.ttf");
}
@font-face {
	font-family: "Bebas-Neue";
	font-weight: 200;
	src: url("../../fonts/BebasNeue-Light.ttf");
}
@font-face {
	font-family: "Bebas-Neue";
	font-weight: 300;
	src: url("../../fonts/BebasNeue-Book.ttf");
}
@font-face {
	font-family: "Bebas-Neue";
	font-weight: 400;
	src: url("../../fonts/BebasNeue-Regular.ttf");
}
@font-face {
	font-family: "Bebas-Neue";
	font-weight: 600;
	src: url("../../fonts/BebasNeue-Bold.ttf");
}

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap');

/*------------------------------------------------------------------
Theme Name: Sleek - Responsive Bootstrap Landing Page
Version:	1.1.1
Author: Dilipkumar
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[TABLE OF CONTENTS]

	1. GLOBAL STYLES
		1.1. Theme Extras 
	2. HEADER
	3. INTRO STYLES
		3.1. Intro / 1 
		3.2. Intro / 2 
		3.3. Intro / 3 
		3.4. Intro / 4 
		3.5. Intro / 5 
		3.6. Intro / 6 
		3.7. Intro / 7 
		3.8. Intro / Extras 
	4. TERMS / POPUP 
	5. SERVICES 
	6. FEATURES 
	7. INFO BOXES 
	8. INFO BOXES / DUAL 
	9. SCREENSHOTS  
	10. ABOUT / INFO CONTENT
	11. TESTIMONIALS
	12. PRICING TABLE
	13. SERVICES / 2
	14. FAQ SECTION 
	15. CLIENTS
	16. WRAP CONTENT
	17. GOOGLE MAP
	18. FOOTER
	19. FOOTER / COPYRIGHT
	20. MODAL / VIDEO
	21. RESPONSIVE STYLES
	
-------------------------------------------------------------------*/

/* 1. GLOBAL STYLES */

body {
	overflow-x: hidden;
	font-family: 'Roboto',sans-serif;
	color: #484848;
}

.body {
	position: relative;
	width: 100%;
	overflow: hidden;
}

p {
	font-size: 16px;
	color: #484848;
	font-weight: 400;
	font-family: "Roboto",sans-serif;
}

a,
a:hover {
	outline: 0;
	color: #3498DB;
	transition: 0.3s;
	-webkit-transition: 0.3s;
	text-decoration: none;
}

a
a:hover,
a:focus,
a:active,
a.active {
	outline: 0;
	text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Bebas-Neue', sans-serif;
	font-weight: 500 !important;
	color: #222222;
}

h1 {
	font-size: 60px;
}
h2 {
	font-size: 48px;
}
h3 {
	font-size: 38px;
}
h4 {
	font-size: 28px;
}
.img-centered {
	margin: 0 auto;
}

ul {
	padding: 0;
	margin: 0;
}

ul li {
	list-style: none;
	margin: 0;
}

button,
button:hover {
	transition: 0.3s;
	-webkit-transition: 0.3s;
}

.space10 {	margin-bottom: 10px;}
.space20 {	margin-bottom: 20px;}
.space30 {	margin-bottom: 30px;}
.space40 {	margin-bottom: 40px;}
.space50 {	margin-bottom: 50px;}
.space60 {	margin-bottom: 60px;}
.space70 {	margin-bottom: 70px;}
.space80 {	margin-bottom: 80px;}
.space90 {	margin-bottom: 90px;}

/* 1.1. Theme Extras */

.btn-main {
	background: #3498DB;
	color: #fff;
	border-radius: 5px;
	border: none;
	line-height: 45px;
	padding: 0 24px;
	text-transform: none;
	letter-spacing: 0.3px;
	font-size: 14px;
	font-weight: 600;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	margin: 0 auto;
	display: table;
}

.btn-main:hover {
	background: #111;
	color: #Fff;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.btn-white {
	background: #fff;
	color: #3498DB;
}

.btn-left {
	margin: 0;
}

input:focus, textarea:focus {
	outline:0;
}

input[type=checkbox] {
	display: none;
}

input[type=checkbox].css-checkbox {
	position: absolute;
	z-index: -1000;
	top: -1000px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	top: 2px;
}

input[type=checkbox].css-checkbox + label.css-label {
	padding-left: 30px;
	height: 22px;
	display: inline-block;
	line-height: 22px;
	background-repeat: no-repeat;
	background-position: 0 0;
	font-size: 13px;
	vertical-align: middle;
	cursor: pointer;
	font-weight: 400;
	color: #aaa;
	margin-top: 5px;
}

input[type=checkbox].css-checkbox:checked + label.css-label {
	background-position: 0 -22px;
}

label.css-label {
	background-image: url(../../images/cbox.png);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

input[type=checkbox].css-checkbox + label.css-label span {
	position: relative;
	top: -4px;
}

.dual-btns {
	background: rgba(0,0,0,0.1);
	padding: 6px 1px;
	border-radius: 5px;
	display: table;
}

.dual-btns a {
	float: left;
}

.flexslider .slides img {
	width: 100%;
	max-width: 100%;
	display: block;
}

.content-head {
	text-align: center;
	margin: 0 0 70px;
}

.content-head h3 {
	font-size: 40px;
	font-weight: 900;
}

.content-head p {
	font-size: 17px;
	font-weight: 400;
	padding: 0 25%;
}

.content-head-lite h3 {
	color: #fff;
	font-weight: 400;
}

/* 2. HEADER */

header {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 999;
	transition: 0.3s;
	-webkit-transition: 0.3s;
}

.navbar {
	background: #676767eb;
	text-transform: uppercase;
	margin: 0;
	border-radius: 0;
	border: none;
	padding: 5px 0;
	position: relative;
	top: 0;
	left: 0;
	right: 0;
}

.navbar a:focus ,
.navbar .navbar-nav li a:focus {
	outline: 0;
	color: #fff;
}

.navbar-default,
.navbar-inverse {
	border: 0;
}

.navbar-brand {
	color: #FFF !important;
	text-transform: none;
	margin: 0;
	font-size: 37px;
	padding: 20px 0 0;
	font-family: 'Vampiro One', sans-serif;
	font-weight: 400;
}

.nav > li {
	position: relative;
	display: block;
	font-weight: 400;
	font-size: 11px;
	letter-spacing: 1px;
	margin: 14px 5px 0;
}

.nav > li > a {
	font-family: 'Bebas-Neue', sans-serif;
	font-weight: 300 !important;
	position: relative;
	display: block;
	padding: 7px 15px;
	color: #FFF !important;
	font-size: 17px;
	border-radius: 5px;
	border: 1px solid transparent !important;
}

.nav > li > a:hover ,
.nav > li.active > a {
	color: #B70021 !important;
	border-color: #fff !important;
	background: #FFF !important;
}

.nav li:last-child a {
	border: 1px solid #fff !important;
}

.nav > li:last-child > a:hover {
	color: #fff !important;
	border-color: #B70021 !important;
	background: #B70021 !important;
}

.navbar-right {
    float: right !important;
    margin-right: -30px;
}

/* 3. INTRO STYLES */

/* 3.1. Intro / 1 */

#intro {
	padding: 227px 0 132px;
	position: relative;
	background: #000 url(../../images/bg/1.jpg) no-repeat top right fixed;
	background-size: 100% auto;
	overflow: hidden;
}

#intro h2 {
	color: #fff;
	font-size: 70px;
	font-weight: 400;
	margin: 25px 0 25px;
	line-height: 75px;
}

#intro p {
	color: #fff;
	font-size: 16px;
	font-weight: 300;
	margin: 0 0 40px;
	padding-right: 25%;
	line-height: 25px;
}

#sub-form {
	position: relative;
	overflow: hidden;
}

.sub-form h4 {
	color: #111;
	font-size: 25px;
	margin: 0 0 15px;
	font-weight: 300;
	position: relative;
	overflow: hidden;
	text-align: center;
}

.sub-form .row {
	margin: 0;
}

.sub-form .col-md-6 {
	padding: 0;
}

.sub-form h5 {
	display: table;
	color: rgb(121, 121, 121);
	letter-spacing: 0px;
	text-align: center;
	padding: 0px;
	width: 130%;
	text-transform: capitalize;
	font-weight: 300;
	font-size: 25px;
	margin: 8px 0px 24px;
	background: #3498db;
	color: #fff;
	padding: 15px 10px;
	margin-left: -15%;
}

.sub-form {
	padding-left: 60px;
	border-right: none;
}

.sub-form form {
	padding: 40px 30px 30px;
	background: #fff;
	border-radius: 5px;
	border-top: 5px solid #feb806;
	position: relative;
}

.sub-form form:before {
	content: "";
	height: 5px;
	width: 33%;
	background: #9ac430;
	position: absolute;
	top: -5px;
	left: 0;
	border-radius: 5px 0 0 0;
}

.sub-form form:after {
	content: "";
	height: 5px;
	width: 33%;
	background: #fe5d05;
	position: absolute;
	top: -5px;
	right: 0;
	border-radius: 0 5px 0 0;
}

.sub-form form input {
	border: 1px solid #e4e4e4;
	background: transparent;
	height: 50px;
	padding: 10px 15px;
	color: #000;
	width: 100%;
	font-size: 14px;
}

.fname {
	margin-bottom: 0;
	border-radius: 5px 0 0 0;
	border-right: none !important;
}

.lname {
	margin-bottom: 0;
	border-radius: 0 5px 0 0;
}

.e-mail {
	margin-bottom: 15px;
	border-radius: 0 0 5px 5px;
	border-top: none !important;
}

/* 3.2. Intro / 2 */

#intro.intro2 {
	padding: 280px 0 230px;
	position: relative;

	background-size: 100% auto;
	overflow: hidden;
}

#intro.intro2 h2,
#intro.intro2 p {
	text-align: center;
	padding: 0 10%;
}

#intro.intro2 .dual-btns {
	margin: 0 auto;
	display: table;
}

/* 3.3. Intro / 3 */

#intro.intro3 {
	padding: 170px 0 0px;
	position: relative;
	background: #000 url(../../images/bg/3.jpg) no-repeat top left;
	background-size: 125% auto;
	overflow: hidden;
}

#intro.intro3 #main-slider {
	float: right;
	margin-bottom: -100px;
}

#intro.intro3 .col-md-8 {
	width: 62%;
}

#intro.intro3 .col-md-4 {
	width: 38%;
}

#intro.intro3 h2 {
	margin: 140px 0px 25px;
	font-size: 65px;
	line-height: 70px;
	font-weight: 500;
}

#intro.intro3 h6 {
	color: #fff;
	font-family: Open Sans;
	font-size: 13px;
	margin: 20px 0 60px;
}

#intro.intro3 h6 a {
	color: #fff;
	border-bottom: 1px dotted #fff;
}

#intro.intro3 h6 a:hover {
	color:#3498DB;
}

/* 3.4. Intro / 4 */

#intro.intro4 {
	padding: 180px 0 0;
	position: relative;
	background: #000 url(../../images/bg/4.jpg) no-repeat top right fixed;
	background-size: 100% auto;
	overflow: hidden;
}

#intro.intro4 h2,
#intro.intro4 p {
	text-align: center;
	padding: 0 10%;
}

#intro.intro4 .dual-btns {
	margin: 0 auto;
	display: table;
}

/* 3.5. Intro / 5 */

#intro.intro5 {
	padding: 150px 0 0;
	position: relative;
	background: #000 url(../../images/bg/5.jpg) no-repeat top right fixed;
	background-size: 100% auto;
	overflow: hidden;
}

#intro.intro5 h2,
#intro.intro5 p {
	text-align: center;
	padding: 0 10%;
}

#intro.intro5 .dual-btns {
	margin: 0 auto 40px;
	display: table;
}

.play-btn {
	border: 10px solid #FFF;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	line-height: 98px;
	display: block;
	text-align: center;
	color: #FFF;
	font-size: 47px;
	position: absolute;
	left: 0px;
	right: 0px;
	margin: -60px auto 0px;
	top: 50%;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	box-shadow: 0px -2px 15px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px -2px 15px rgba(0,0,0,0.5);
	text-shadow: 0 2px 15px rgba(0,0,0,0.5);
}

.play-btn:hover {
	color:#fff;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	-webkit-transform: scale(1.15);
	-ms-transform: scale(1.15);
	transform: scale(1.15);
}

/* 3.6. Intro / 6 */

#intro.intro6 {
	padding: 240px 0 175px;
	background: #000 url(../../images/bg/6.jpg) no-repeat center center fixed;
}

#intro.intro6 h2 {
	margin: 13px 0px 25px;
}

/* 3.7. Intro / 7 */

#intro.intro7 {
	padding: 270px 0 240px;
	background: #000 url(../../images/bg/7.jpg) no-repeat center top fixed;
	position: relative;
	background-size: 100% auto;
	overflow: hidden;
}

#intro.intro7 h2,
#intro.intro7 p {
	text-align: center;
	padding: 0 10%;
}

.intro-newsletter {
    background: rgba(0, 0, 0, 0.48);
	padding: 8px;
	border-radius: 5px;
	width: 536px;
	margin: 0 auto;
	display: table;
	position:relative;
}

.intro-newsletter input {
	width: 400px;
	height: 50px;
	border: none;
	background: #fff;
	border-radius: 5px;
	padding: 5px 20px;
	font-size: 13px;
	float: left;
	margin:0;
}

.intro-newsletter button {
	background: #3498DB;
	line-height: 50px;
	color: #FFF;
	padding: 0px 30px;
	border-radius: 5px;
	border: none;
	font-size: 13px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	width: 110px;
	margin-left: 10px;
	float: left;
	font-size: 25px;
}

.intro-newsletter button:hover {
	background: #000;
	color: #FFF;
}

#result {
	text-align: center;
	position: absolute;
	top: 103%;
	left: 60px;
	right: 0px;
	display: block;
	margin: 0px auto;
	font-size: 11px;
	color: #fff !important;
	max-width: 100%;
	padding: 0px 12px;
}

#result a {
	color: #000 !important;
}

#result em {
	font-style:normal;
}

.intro-newsletter #result {
	left: 0px !important;
	top:106%;
}

/* 3.8. Intro / 8 */

#intro.intro8 {
	padding: 270px 0 240px;
	background: #000 url(../../images/bg/8.jpg) no-repeat center top fixed;
	position: relative;
	background-size: 100% auto;
	overflow: hidden;
}

#intro.intro8 h2,
#intro.intro8 p {
	text-align: center;
	padding: 0 10%;
}

.countdown.styled {
	width:100%;
	max-width:850px;
	margin:-25px auto 0;
	padding:0 15px;
}

.countdown.styled div {
	width:25%;
	float:left;
	color:#fff;
	font-size:100px;
	font-weight:800;
	text-align:center;
}

.countdown.styled div span {
	display:block;
	font-size:16px;
	letter-spacing:5px;
	text-transform:uppercase;
	font-weight:700;
	background:rgba(0,0,0,0.3);
	display:table;
	margin:0 auto;
	padding:5px 10px;
	border-radius:5px;
}

/* 3.9. Intro / Extras */

.dual-btns {
	position: relative;
}

.dual-btns a {
	background: #3498DB;
	line-height: 50px;
	color: #FFF;
	padding: 0px 30px;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0.3px;
	font-weight: 600;
	margin: 0 5px;
}

.dual-btns a:nth-child(2) {
	background:#2980b9;
	border-radius: 5px;
}

.dual-btns a:hover {
	background: #111 !important;
	color: #fff;
}

.app-btn {
	font-size: 15px;
	text-transform: none;
	font-weight: 400;
	line-height: 23px;
	padding: 10px 35px 17px;
	padding-left: 70px;
	position: relative;
	background: #3498db;
	color: #fff;
	display: table;
	border-radius: 5px;
	text-shadow: 0 3px 0 rgba(0,0,0,0.2);
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.app-btn i {
	position: absolute;
	top: 11px;
	left: 35px;
	font-size: 50px;
}

.app-btn span {
	font-size: 26px;
	display: block;
	font-weight: 700;
}

.app-btn:hover {
	background: #111;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	color: #fff;
}

.overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.2;
}

.overlay-white {
	background: #fff;
	height: 20px;
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

.btn-single a {
	border-radius: 5px;
	padding: 0px 35px;
}

.btn-single a i {
	margin-left: 7px;
	font-size: 16px;
}

/* 4. TERMS / POPUP */

.term-popup {
	cursor: pointer;
}

.terms {
	position: fixed;
	z-index: -15;
	visibility: hidden;
	opacity: 0;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	width: 90%;
	max-height: 90%;
	overflow: scroll;
	overflow-x: hidden;
	max-width: 1170px;
	height: auto;
	background: #FFF;
	top: 17%;
	left: 0;
	right: 0;
	margin: 0 auto;
	display: table-cell;
	vertical-align: middle;
	padding: 50px;
	box-shadow: 5px 5px 15px rgba(0,0,0,0.3);
	-webkit-box-shadow: 5px 5px 15px rgba(0,0,0,0.3);
}

.terms h3 {
	font-size: 30px;
	margin: 0 0 30px;
	border-bottom: 2px solid #e1e1e1;
	padding-bottom: 15px;
}

.terms ul li {
	list-style: decimal;
	margin-left: 15px;
	margin-bottom: 15px;
	font-size: 13px;
	line-height: 23px;
}

.t-close {
	position: absolute;
	right: 25px;
	top: 25px;
	font-size: 30px;
	opacity: 0.2;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	cursor: pointer;
}

.t-close:hover {
	opacity: 1;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.terms-active {
	position: fixed;
	z-index: 9999999;
	visibility: visible;
	opacity: 1;
	transition: 0.5s;
	-webkit-transition: 0.5s;
}

.overlay-dark {
	background: #000;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	z-index: -20;
	transition: 0.5s;
	-webkit-transition: 0.5s;
}

.overlay-dark.active {
	z-index: 99999;
	visibility: visible;
	opacity: 0.5;
	transition: 0.5s;
	-webkit-transition: 0.5s;
}

/* 5. SERVICES */

#services {
	padding: 40px 0;
}

.service-content {
	cursor: pointer;
}

.service-content span {
	display: table;
	margin: 0px auto 25px;
	color: #3498db;
	text-align: center;
	transition: 0.3s;
	-webkit-transition: 0.3s;
	position: relative;
	border: 2px solid #3498db;
	width: 100px;
	height: 100px;
	display: table;
	font-size: 35px;
	border-radius: 50%;
	padding-top: 22px;
}

.service-content:hover span {
	background: #3498db;
	color: #fff;
	transition: 0.3s;
	-webkit-transition: 0.3s;
}

.service-content:hover i {
	transition: 0s;
	-webkit-transition: 0s;
}

.service-content h4 {
	font-size: 24px;
	text-align: center;
	font-weight: 900;
	margin: 0 0 10px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

.service-content p {
	text-align: center;
	line-height: 22px;
	margin: 0 0 10px;
	color: #484848;
	font-weight: 400;
	padding: 0 20px;
}

.service-content a {
	color: #484848;
	text-align: center;
	display: table;
	margin: 0 auto;
}

.service-content a i {
	font-size: 14px;
	margin-left: 5px;
}

.service-content a:hover {
	color: #000;
}

/* 6. FEATURES */

#features {
	background: #3498DB;
	padding: 75px 0 0;
}

.feature-content {
	margin-bottom: 40px;
}

.feature-content i {
	color: #fff;
	font-size: 25px;
	margin: 0 0 20px;
	float: left;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: rgb(52, 152, 219);
	text-align: center;
	line-height: 50px;
}

.feature-content h4 {
	color: #222222;
	margin: 0 0 12px;
	margin-left: 65px;
	font-size: 17px;
	font-weight: 900;
}

.feature-content p {
	color: #222222;
	font-weight: 400;
	font-size: 13px;
	margin-left: 65px;
}

#features h3 {
	background: #3498DB;
	display: table;
	padding: 9px 15px;
	text-transform: uppercase;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
}

.app-info p {
	color: #333;
	margin: 0 0 30px;
}

.app-btns a {
	color: #fff;
	font-size: 40px;
	margin-right: 25px;
}

.app-btns a:hover {
	color: #fff;
	opacity: 0.5;
}

/* 7. INFO BOXES */

.info-content {
	padding: 100px 0;
}

.ic-inner img {
	border-radius: 5px;
}
.ic-inner .btn-primary {
	font-size: 12px;
	background: transparent;
	padding: 10px 25px;
	border-radius: 7px;
	color: #b70021;
	border: 1px solid #b70021;
}

.ic-inner .btn-primary:hover {
	font-size: 12px;
	background: #b70021;
	padding: 10px 25px;
	border-radius: 7px;
	color: #fff;
	border: 1px solid #b70021;
}

.ic-inner h4 {
	font-size: 23px;
	font-weight: 900;
	margin: 20px 0 15px;
}

.ic-inner p {
	font-size: 13px;
	line-height: 20px;
}

/* 8. INFO BOXES / DUAL */

.dual-info {
	background: #3498DB;
}

.dual-info .container {
	width: 100%;
	padding: 0;
}

.dual-info .col-md-6 {
	padding: 0;
}

.dual-info h4 {
	font-size: 70px;
	font-weight: 300;
	color: #fff;
	margin: 0 0 20px;
}

.dual-info p {
	font-size: 16px;
	font-weight: 300;
	color: #fff;
	margin: 0 0 30px;
	line-height: 25px;
}

.dual-info .col-md-9 {
	padding: 60px;
}

.dual-info ul li {
	color: #fff;
	padding-left: 40px;
	margin-bottom: 15px;
	font-weight: 300;
	position: relative;
}

.dual-info ul li i {
	font-size: 15px;
	position: absolute;
	top: 4px;
	left: 10px;
}

/* 9. SCREENSHOTS  */

.shots {
	padding: 100px 0;
}

.shots-slider {
	margin-top:-30px;
}

.slick-slide {
}

.shots-thumb {
	padding: 30px 0px 30px;
	margin: 0 15px;
}

.shots-slider .slick-slide img,
.shots-slider .slick-center img {
	border-radius: 3px;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.shots-slider a:hover img {
	transition: 0.4s;
	-webkit-transition: 0.4s;
	-webkit-transform: scale(1.05,1.05);
	-ms-transform: scale(1.05,1.05);
	transform: scale(1.05,1.05);
	cursor: url('../../images/plus.png'), url('../../images/plus.png'), move;  
}

.shots-thumb img {
	opacity: 1;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	cursor: pointer;
}

.shots-thumb img:hover {
	opacity: 0.6;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.shots .col-md-12 {
	max-width: 90%;
	margin: 0 auto;
	float: none;
}

/* 10. ABOUT / INFO CONTENT  */

.wrap-content {
	background: #3498DB;
	padding: 100px 0;
}

.wrap-content h2 {
	color: #fff;
	margin-bottom: 30px;
	font-size: 50px;
}

.wrap-content p {
	color: #fff;
	font-size: 14px;
	line-height: 22px;
}

.wrap-content1 {
	background: #fff !important;
	padding: 90px 0;
}

.wrap-content1 h2 {
	color: #000;
	margin-bottom: 30px;
	font-size: 50px;
}

.wrap-content1 p {
	color: #777;
	font-size: 14px;
	line-height: 22px;
}

/* 11. TESTIMONIALS */

.testimonials {
	background: #f1f1f1;
	padding: 75px 0 0;
}

.quote-info p {
	font-family: Josefin Sans;
	font-size: 60px;
	font-weight: 400;
	line-height: 59px;
	color: #555;
	padding: 0;
	padding-left: 65px;
	position: relative;
	margin-top: 120px;
}

.quote-info p:before {
	content: "\f10d";
	font-family: "FontAwesome";
	color: #3498DB;
	position: absolute;
	left: 0;
	top: -20px;
	font-size: 50px;
}

.quote-info cite {
	color: #000;
	font-size: 23px;
	font-style: normal;
	font-weight: 700;
	line-height: 30px;
	float: right;
	margin-top: 40px;
	text-transform: uppercase;
	padding-right: 60px;
}

.quote-info .cite-left {
	float: none;
	padding-left: 60px;
	padding-right: 0px;
	display: block;
}

.quote-info cite span {
	color: #3498DB;
	font-size: 16px;
	font-weight: 400;
	display: block;
	padding-left: 13px;
	text-transform: none;
}

#quote-slider .owl-controls {
	margin-top: 10px;
	text-align: center;
	position: absolute;
	bottom: 25px;
	display: block;
	margin: 0 auto;
	left: 0;
	right: 0;
}

/* 12. PRICING TABLE */

.pricing {
	padding: 80px 0 90px;
	background: #f8f8f8;
}

.price {
	font-size: 70px;
	color: #fff;
}

.price-cents {
	vertical-align: super;
	font-size: 50%;
}

.list-group-item {
	color: #757575;
	font-size: 14px;
	border: none;
	border-bottom: 1px solid #e5e5e5;
	margin: 0px;
}

.list-group-item:last-child {
	border-bottom: none;
	padding-top: 20px;
}

.list-group .btn {
	background: #1abc9c !important;
	border-color: #0fa285;
}

.list-group .btn:hover {
	background: #0fa285 !important;
}
/*
.panel-default {
	border: none;
	padding: 15px 0px;
}

.panel-body {
	font-family: Open sans;
	font-size: 13px;
	line-height: 23px;
	font-weight: 400;
	color: #fff;
	padding: 40px 0;
	background: #3498DB;
}

.panel-default > .panel-heading {
	text-transform: uppercase;
	padding: 6px 15px 18px;
}

.panel-default > .panel-heading span {
	top: -2px;
	position: relative;
}
*/
.pricing .btn-main {
	line-height: 38px;
	padding: 0px 20px;
}

/* 13. SERVICES / 2 */

#services2 {
	background: #f1f1f1;
	padding: 100px 0 50px;
}

.sc2-inner {
	margin-left: 110px;
}

.sc2-inner h4 {
	font-weight: 600;
	font-size: 21px;
	margin: 5px 0 10px;
}

.sc2-inner p {
	margin: 0;
}

#services2 i {
	background: #3498DB;
	width: 75px;
	height: 75px;
	line-height: 75px;
	text-align: center;
	color: #FFF;
	font-size: 25px;
	float: left;
	border-radius: 50%;
}

#services2 .col-md-4 {
	margin-bottom: 50px;
}

#services2 .sc2-inner p {
	margin: 0px;
	font-size: 13px;
}

/* 14. FAQ SECTION */

.faq-content {
	padding: 80px 0 80px;
}

.faq-content .panel-title a {
	font-size: 18px;
	font-weight: 700;
	text-transform: none;
	padding: 15px;
	margin: 0px;
	background: #fff;
	display: table;
	width: 100%;
}

.faq-content .panel-title:hover {
	color: #3498DB;
}

.faq-content .panel-default {
	border-color: #e1e1e1;
	padding: 9px 0px;
	background: #fff;
}

.faq-content .panel-heading {
	border: 1px solid #e1e1e1;
	padding: 0;
	border-radius: 0;
	background: #fff;
	color: #000;
}

.faq-content .panel-default > .panel-heading + .panel-collapse > .panel-body {
	border: 1px solid #e1e1e1;
	border-top: none;
}

.faq-content .panel-body {
	padding: 20px 25px;
	background: #fff;
	color: #000;
}

.faq-wrap h3 {
	font-weight: 700;
	text-transform: none;
	margin: 0 0 5px;
}

.faq-wrap p {
	font-size: 13px;
	line-height: 20px;
	margin-bottom: 30px;
}

.video {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.video iframe,
.video object,  
.video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border:none;
}

/* 15. CLIENTS */

#clients {
	padding: 40px 0;
	background: #f8f8f8;
}

#clients h3 {
	margin: 0px 0px 30px;
	font-size: 30px;
	font-weight: 900;
	text-transform: inherit;
	text-align: center;
}

#clients ul {
	padding: 0px 0px;
	margin: 0 -25px;
}

#clients ul li {
	float: left;
	margin: 0;
	list-style: none;
	width: 20%;
	position: relative;
	padding: 0 15px;
}

#clients ul li img {
	opacity: 0.2;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

#clients ul li:hover img {
	opacity: 1;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
}

/* 16. WRAP CONTENT */

.wrap {
	padding: 80px 0;
	background: #3498DB;
}

.wrap h3 {
	margin: 0px 0px 10px;
	text-align: center;
	font-weight: 900;
	font-size: 45px;
	text-transform: none;
	color: #fff;
}

.wrap p {
	font-size: 16px;
	line-height: 24px;
	margin: 0px 0px 40px;
	text-align: center;
	font-weight: 400;
	padding: 0 12%;
	color: #fff;
}

.wrap em {
	font-size: 12px;
	line-height: 24px;
	text-align: center;
	font-weight: 400;
	text-transform: uppercase;
	font-style: normal;
	margin: -10px auto 0;
	display: table;
	letter-spacing: 1px;
	color: #fff;
}

.wrap a {
	font-size: 17px;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: 2px;
	display: table;
	background: #000;
	line-height: 75px;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	perspective: 1000px;
	margin: 0 auto 15px;
	display: table;
	border-radius: 5px;
}

.wrap a span {
	position: relative;
	display: inline-block;
	padding: 0 110px;
	background: #fff;
	color: #3498DB;
	border: none;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	border-radius: 5px;
}

.csstransforms3d .wrap a span::before {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
	background: transparent;
	font-size: 15px;
	content: attr(data-hover);
	-webkit-transition: background 0.3s;
	-moz-transition: background 0.3s;
	transition: background 0.3s;
	-webkit-transform: rotateX(-90deg);
	-moz-transform: rotateX(-90deg);
	transform: rotateX(-90deg);
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	border-radius: 5px;
}

.wrap a:hover span,
.wrap a:focus span {
	-webkit-transform: rotateX(90deg) translateY(-22px);
	-moz-transform: rotateX(90deg) translateY(-22px);
	transform: rotateX(90deg) translateY(-22px);
}

.csstransforms3d .wrap a:hover span::before,
.csstransforms3d .wrap a:focus span::before {
	background: #000;
	color: #fff;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
.wrap a:hover span,
.wrap a:focus span {
	-webkit-transform: rotateX(0deg) translateY(-0px);
	-moz-transform: rotateX(0deg) translateY(-0px);
	transform: rotateX(0deg) translateY(-0px);
}

.wrap a:hover span {
	background: #000;
	color: #fff;
	transition:.4s;
}


}


/* 17. GOOGLE MAP */

.gmap {
	padding: 0px;
	height: 400;
}

.gmap div {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

#map {
	display: block;
	width: 100%;
	height: 400px;
	margin: 0 auto;
}

#map.large {
	height: 400px;
}

#map img {
	max-width: none !important;
	height: auto;
}

/* 18. FOOTER */

#footer {
	background: #fff;
	padding: 40px 0;
	padding-top: 80px;
	padding-bottom: 10px;
	display: table;
	width: 100%;
	margin-top: 40px;
}

#contact-info {
	margin-bottom: 0px;
}

#footer h5 {
	font-size: 25px;
	font-weight: 900;
	color: #000;
	margin: 0 0 50px;
}

#footer h5 span {
	font-weight: 600;
}

.contact-info {
	padding: 0;
	margin: 0;
}

.contact-info li {
	padding: 0px;
	list-style: none;
	color: #888;
	margin: 0 0 15px;
	display: table;
	width: 100%;
	line-height: 30px;
	font-size: 16px;
	font-weight: 300;

}

.contact-info li i {
	font-size: 16px;
	margin-right: 15px;
	color: #000;
	float: left;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	border-radius: 50%;
}

.contact-info p {
	font-size: 14px;
	font-weight: 300;
	color: #fff;
	margin: 0;
}

.statusMessage, .successmessage, .errormessage {
	display: none;
	margin: auto;
	width: 100%;
	height: auto;
	left: 0px;
	right: 0px;
	top: 0px;
	border: 1px solid #e1e1e1;
	margin: 0 auto 25px auto;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color: #000;
}

.statusMessage i {
	color:#3498DB;
	font-size:15px;
	margin-right:5px;
}

.statusMessage p {
	margin: 0;
	padding: 20px;
	color: #555;
	font-size: 14px;
}

.successmessage p {
	margin: 0;
	padding: 20px;
	color: #555;
	font-size: 14px;
}

.successmessage i {
	color:#1abc9c;
	font-size:15px;
	margin-right:5px;
}

.errormessage p {
	margin: 0;
	padding: 20px;
	color: #555;
	font-size: 14px;
}

.errormessage i {
	color:#ff0000;
	font-size:15px;
	margin-right:5px;
}

#incompleteMessage i {
	color: #f1c40f;
	font-size:15px;
	margin-right:5px;
}

#contactForm input {
	width: 100%;
	border: none;
	border: 1px solid #e1e1e1;
	height: 65px;
	margin-bottom: 15px;
	background: transparent;
	padding: 15px 15px;
	color: #000;
	font-size: 15px;
	border-radius: 3px;
}

#contactForm textarea {
	width: 100%;
	color: #000;
	border: none;
	border: 1px solid #e1e1e1;
	height: 145px;
	margin-bottom: 15px;
	background: transparent;
	padding: 10px 15px;
	font-size: 15px;
	border-radius: 3px;
}

#contactForm p {
	font-size: 13px;
}

/* 19. FOOTER / COPYRIGHT */

.f-social {
	padding: 10px;
}

.f-social a {
	float: left;
	color: #ccc;
	font-size: 17px;
	margin-right: 20px;
}

.f-social a:hover {
	color: #b70121;
}

.footer-copy {
    background: #fff;
}

.footer-copy p {
	padding: 10px 0;
	color: #000000;
	font-size: 13px;
	line-height: 2.2;
	font-weight: 100;
}

.footer-copy p a {
	color:#000;
}

.footer-copy p a:hover {
	color:#b70121;
}

.backtotop {
	text-align: right;
	font-size: 13px;
	text-transform: uppercase;
	display: table;
	float: right;
	margin-top: 0;
}

.backtotop:hover {
	color:#fff;
}

/* 20. MODAL / VIDEO */

.modal-content {
	position: relative;
	background-clip: padding-box;
	border: none;
	border-radius: 0px;
	outline: 0px none;
	box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.5);
	padding: 0;
	margin: 0 auto;
	height: 70%;
	margin-top: 5%;
	top: 0;
}

.modal-content .container {
	padding: 0;
}

.close-modal {
	background: #000;
	color: #FFF;
	position: absolute;
	top: -30px;
	right: 0px;
	z-index: 999;
	width: 115px;
	height: 30px;
	font-weight:700;
	opacity: 1 !important;
	text-align: center;
	line-height: 30px;
	text-transform: uppercase;
	font-size: 12px;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	cursor: pointer;
}

.close-modal:hover {
	background: #3498DB;
	color: #FFF;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.home-subscribe {
	background:#3498DB;
	padding:70px 0;
}

.home-subscribe h6 {
	font-size:25px;
	color:#ff7958;
	margin:0 0 25px;
	text-align:center;
	font-weight:900;
	text-transform: inherit;
}

/* 20. RESPONSIVE STYLES */

/* Ipad - Desktop (960 - 1150px) */
@media only screen and (min-width: 960px)  and (max-width: 1150px)  {

#intro ,
#intro.intro2 ,
#intro.intro3 ,
#intro.intro4 ,
#intro.intro5 ,
#intro.intro6 ,
#intro.intro7 {
	background-size: 130% auto;
}

}

/* Ipad (768 - 959px) */
@media only screen and (min-width: 768px)  and (max-width: 959px)  {

#intro {
	background-size: auto 100%;
	padding: 160px 0px 132px;
}

#intro.intro2 {
	background-size: 130% auto;
	padding: 160px 0px 132px;
}

#intro.intro4 {
	background-size: auto 100%;
	padding: 160px 0px 0px;
}

#intro.intro5 {
	background-size: auto 100%;
	padding: 160px 0px 0px;
}

#intro h2 {
	font-size: 48px;
	line-height: 56px;
}

.sub-form {
	padding-left: 0px;
}

#result {
	left: 0px;
}

.sub-form h5 {
	font-size: 19px;
}

#intro p {
	font-size: 14px;
	margin: 0px 0px 30px;
	padding-right: 15px;
	line-height: 25px;
}

.service-content p {
	font-size: 13px;
	line-height: 20px;
	padding: 0px 5px;
}

.service-content h4 {
	font-size: 15px;
}

#features .col-md-3 {
	width: 100%;
	float: none;
}

#features .col-md-4 {
	width: 45%;
}

.feature-content p {
	font-size: 12px;
	margin-left: 90px;
}

.feature-content h4 {
	margin: 0px 0px 12px 90px;
}

#features .col-md-5 {
	width: 55%;
}

#features h3 {
	display: table;
	margin: 0 auto 20px;
	;
}

.app-info p {
	text-align: center;
	padding: 0 15%;
}

.app-btns {
	margin: 0 auto 40px;
	display: table;
}

#features .space60 {
	margin-bottom: 20px;
}

.content-head h3 {
	font-size: 35px;
}

.content-head p {
	font-size: 15px;
	padding: 0px 10%;
}

.ic-inner p {
	font-size: 12px;
}

.dual-info h4 {
	font-size: 35px;
}

.dual-info .col-md-9 {
	padding: 30px;
	width: 100%;
}

.dual-info ul li {
	margin-bottom: 7px;
	font-size: 11px;
	font-weight: 400;
}

.dual-info p {
	font-size: 11px;
	margin: -5px 0px 17px;
	line-height: 20px;
	font-weight: 400;
}

.dual-info ul {
	margin-bottom: 20px;
}

.dual-info .col-md-6:nth-child(1) {
	width: 60%;
}

.dual-info .col-md-6:nth-child(2) {
	width: 40%;
}

.dual-info .btn-main {
	line-height: 30px;
	padding: 0 15px;
	font-size: 11px;
}

.wrap-content h2 {
	color: #FFF;
	font-size: 34px;
	margin-top: 0;
}

.wrap-content p {
	font-size: 11px;
	line-height: 21px;
	font-weight: 400;
	margin-top: -15px;
}

.wrap-content1 h2 {
	color: #000;
	margin-top: 0px;
	font-size: 33px;
}

.quote-info p {
	font-size: 35px;
	line-height: 42px;
	padding: 0px 0px 0px 45px;
	margin-top: 0px;
}

.quote-info p:before {
	top: 5px;
}

.pricing .col-md-3 {
	width: 50%;
}

.sc2-inner {
	margin-left: 91px;
}

#services2 i {
	width: 65px;
	height: 65px;
	line-height: 65px;
}

.sc2-inner {
	margin-left: 75px;
}

.sc2-inner h4 {
	font-size: 16px;
}

#services2 .sc2-inner p {
	font-size: 12px;
}

#contactForm p {
	font-size: 10px;
}

.contact-info li {
	font-size: 14px;
}

#intro.intro3 h2 {
	margin: 25px 0px 25px;
	font-size: 42px;
	line-height: 48px;
	font-weight: 500;
}

#intro.intro3 p {
	font-size: 12px;
	margin: 0px 0px 30px;
	padding-right: 15px;
	line-height: 19px;
	font-weight: 400;
}

#intro.intro4 p {
	text-align: center;
	padding: 0px;
}

#intro.intro6 h2 {
	margin: -29px 0px 25px;
	font-size: 39px;
	line-height: 45px;
}

#intro.intro6 {
	padding: 192px 0px 140px;
}

#intro.intro7 {
	background-size: auto 100%;
	padding: 200px 0 185px;
}

.modal-content {
	margin: 35% auto 0px;
	height: auto;
}

}

/* Mobile (Upto 767px) */
@media only screen and (max-width: 767px)  {

#result {
	left: 0px;
}

.modal-content {
	width:90%;
	margin: 50% auto 0px;
	height: auto;
}

.terms {
	width: 90%;
	max-height: 80%;
	top: 10%;
	padding: 40px;
}

.container {
	width: 100%;
	max-width: 400px;
}

.play-btn {
	-webkit-transform: scale(0.6);
	-ms-transform: scale(0.6);
	transform: scale(0.6);
}

.play-btn:hover {
	-webkit-transform: scale(0.8);
	-ms-transform: scale(0.8);
	transform: scale(0.8);
}

.dual-btns {
	display: table;
	margin-left: auto;
	margin-right: auto;
}

#intro.intro6 .dual-btns {
	display: table;
	margin: 0 auto 40px;
}

#intro {
	background-size: auto 100%;
	padding: 160px 0px 132px;
}

#intro.intro2 {
	background-size: auto 100%;
	padding: 160px 0px 132px;
}

#intro.intro3 {
	background-size: auto 100%;
	padding: 160px 0px 80px;
}

#intro.intro4 {
	background-size: auto 100%;
	padding: 120px 0px 100px;
}

#intro.intro7 {
	background-size: auto 100%;
	padding: 120px 0px 100px;
}

.intro-newsletter {
	width: 100%;
	max-width: 400px;
}

.intro-newsletter input {
	width: 71%;
}

.intro-newsletter button {
	width: 27%;
	margin-left: 2%;
}

#intro.intro7 p {
	text-align: center;
	padding: 0px 0;
	font-size: 13px;
}

#intro.intro6 {
	padding: 120px 0px 100px;
}

#intro.intro3 #main-slider {
	float: none;
	margin-bottom: 0px;
	margin-right: auto;
	margin-left: auto;
	max-width: 400px;
	width: 100%;
}

#intro.intro3 h6 {
	font-size: 12px;
	text-align: center;
}

#intro.intro5 {
	background-size: auto 100%;
	padding: 160px 0px 0px;
}

#intro.intro3 .col-md-8 ,
#intro.intro3 .col-md-4 {
	width: 100%;
}

#intro.intro3 h2 {
	margin: 0px 0px 25px;
	font-size: 36px;
	line-height: 46px;
	font-weight: 500;
}

#intro p {
	font-size: 13px;
	margin: 0px 0px 30px;
}

.app-btn {
	display: table;
	margin: 0 auto;
}

#intro.intro3 h6 {
	font-size: 12px;
}

#intro h2 {
	font-size: 45px;
	margin: 25px 0px 40px;
	line-height: 50px;
	text-align: center;
}

#intro {
	background-size: auto 100%;
}

header {
	height:70px;
}

.dual-btns a {
	line-height: 43px;
	padding: 0px 22px;
	font-size: 13px;
}

.dual-btns a {
	float: left;
}

#intro p {
	font-size: 14px;
	margin: 0px 0px 20px;
	line-height: 24px;
	padding: 0;
	text-align: center;
}

.sub-form {
	padding-left: 15px;
	padding-top: 60px;
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
}

#services {
	padding: 100px 0px 60px;
}

.service-content {
	cursor: pointer;
	margin-bottom: 40px;
}

#features h3 {
	margin: 0px 0px 20px;
}

.app-info {
	padding: 0 15px;
	padding-bottom: 59px;
}

.content-head h3 {
	font-size: 30px;
}

.content-head p {
	font-size: 14px;
	font-weight: 300;
	padding: 0px 0;
}

.ic-inner {
	margin-bottom: 30px;
}

.info-content {
	padding: 100px 0px 70px;
}

.dual-info .col-md-9 {
	padding: 40px;
}

.wrap-content h2 {
	font-size: 35px;
}

.wrap-content p {
	font-size: 13px;
	line-height: 22px;
}

.wrap-content img {
	margin-top: 70px;
}

.quote-info p {
	font-family: Josefin Sans;
	font-size: 31px;
	font-weight: 400;
	line-height: 41px;
}

#quote-slider .item img {
	display: none;
}

.testimonials {
	padding: 0px 0px 100px;
}

#quote-slider .owl-controls {
	bottom: -50px;
}

.faq-content .content-head {
	padding: 0 15px;
}

.wrap h3 {
	font-size: 33px;
}

.wrap p {
	font-size: 13px;
	line-height: 21px;
	padding: 0px;
}

.wrap a span {
	padding: 0px 25px;
}

.wrap a {
	font-size: 12px;
	text-align: center;
	letter-spacing: 1px;
	line-height: 55px;
}

.f-social {
	padding: 10px;
	margin-bottom: 60px;
}

.footer-copy p {
	font-size: 13px;
	text-align: center;
	margin: 0 0 30px;
}

.backtotop {
	color: #3498DB;
	text-align: center;
	display: table;
	margin: 0 auto;
	float: none;
}

.navbar-toggle {
	border: none !important;
	margin-top: 17px;
	margin-right: 0px;
}

.navbar-default .navbar-toggle .icon-bar {
	background-color: #000;
}

.navbar-toggle:hover {
	background: #fff !important;
}

.navbar-toggle:focus {
	background: transparent !important;
}

.navbar-right {
	float: none;
	background: #fff;
	margin: 15px 0px 0;
	width: 100%;
}

.navbar-collapse {
	padding-right: 0;
	padding-left: 0;
	overflow-x: visible;
	border-top: 0;
}

}


/* ---- css/noty.min.css ---- */
.noty_layout_mixin, #noty_layout__top, #noty_layout__topLeft, #noty_layout__topCenter, #noty_layout__topRight, #noty_layout__bottom, #noty_layout__bottomLeft, #noty_layout__bottomCenter, #noty_layout__bottomRight, #noty_layout__center, #noty_layout__centerLeft, #noty_layout__centerRight {
    position: fixed;
    margin: 0;
    padding: 0;
    z-index: 9999999;
    -webkit-transform: translateZ(0) scale(1, 1);
    transform: translateZ(0) scale(1, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
    filter: blur(0);
    -webkit-filter: blur(0);
    max-width: 90%; }

#noty_layout__top {
    top: 0;
    left: 5%;
    width: 90%; }

#noty_layout__topLeft {
    top: 20px;
    left: 20px;
    width: 325px; }

#noty_layout__topCenter {
    top: 5%;
    left: 50%;
    width: 325px;
    -webkit-transform: translate(-webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
    transform: translate(calc(-50% - .5px)) translateZ(0) scale(1, 1); }

#noty_layout__topRight {
    top: 20px;
    right: 20px;
    width: 325px; }

#noty_layout__bottom {
    bottom: 0;
    left: 5%;
    width: 90%; }

#noty_layout__bottomLeft {
    bottom: 20px;
    left: 20px;
    width: 325px; }

#noty_layout__bottomCenter {
    bottom: 5%;
    left: 50%;
    width: 325px;
    -webkit-transform: translate(-webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
    transform: translate(calc(-50% - .5px)) translateZ(0) scale(1, 1); }

#noty_layout__bottomRight {
    bottom: 20px;
    right: 20px;
    width: 325px; }

#noty_layout__center {
    top: 50%;
    left: 50%;
    width: 325px;
    -webkit-transform: translate(-webkit-calc(-50% - .5px), -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
    transform: translate(calc(-50% - .5px), calc(-50% - .5px)) translateZ(0) scale(1, 1); }

#noty_layout__centerLeft {
    top: 50%;
    left: 20px;
    width: 325px;
    -webkit-transform: translate(0, -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
    transform: translate(0, calc(-50% - .5px)) translateZ(0) scale(1, 1); }

#noty_layout__centerRight {
    top: 50%;
    right: 20px;
    width: 325px;
    -webkit-transform: translate(0, -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
    transform: translate(0, calc(-50% - .5px)) translateZ(0) scale(1, 1); }

.noty_progressbar {
    display: none; }

.noty_has_timeout.noty_has_progressbar .noty_progressbar {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    width: 100%;
    background-color: #ffffff;
    opacity: 0.7;
    filter: alpha(opacity=10); }

.noty_bar {
    -webkit-backface-visibility: hidden;
    -webkit-transform: translate(0, 0) translateZ(0) scale(1, 1);
    -ms-transform: translate(0, 0) scale(1, 1);
    transform: translate(0, 0) scale(1, 1);
    -webkit-font-smoothing: subpixel-antialiased;
    overflow: hidden; }

.noty_effects_open {
    opacity: 0;
    -webkit-transform: translate(50%);
    -ms-transform: translate(50%);
    transform: translate(50%);
    -webkit-animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards; }

.noty_effects_close {
    -webkit-animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards; }

.noty_fix_effects_height {
    -webkit-animation: noty_anim_height 75ms ease-out;
    animation: noty_anim_height 75ms ease-out; }

.noty_close_with_click {
    cursor: pointer; }

.noty_close_button {
    position: absolute;
    top: 2px;
    right: 2px;
    font-weight: bold;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: 2px;
    cursor: pointer;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out; }

.noty_close_button:hover {
    background-color: rgba(0, 0, 0, 0.1); }

.noty_modal {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 10000;
    opacity: .3;
    left: 0;
    top: 0; }

.noty_modal.noty_modal_open {
    opacity: 0;
    -webkit-animation: noty_modal_in .3s ease-out;
    animation: noty_modal_in .3s ease-out; }

.noty_modal.noty_modal_close {
    -webkit-animation: noty_modal_out .3s ease-out;
    animation: noty_modal_out .3s ease-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards; }

@-webkit-keyframes noty_modal_in {
    100% {
        opacity: .3; } }

@keyframes noty_modal_in {
    100% {
        opacity: .3; } }

@-webkit-keyframes noty_modal_out {
    100% {
        opacity: 0; } }

@keyframes noty_modal_out {
    100% {
        opacity: 0; } }

@keyframes noty_modal_out {
    100% {
        opacity: 0; } }

@-webkit-keyframes noty_anim_in {
    100% {
        -webkit-transform: translate(0);
        transform: translate(0);
        opacity: 1; } }

@keyframes noty_anim_in {
    100% {
        -webkit-transform: translate(0);
        transform: translate(0);
        opacity: 1; } }

@-webkit-keyframes noty_anim_out {
    100% {
        -webkit-transform: translate(50%);
        transform: translate(50%);
        opacity: 0; } }

@keyframes noty_anim_out {
    100% {
        -webkit-transform: translate(50%);
        transform: translate(50%);
        opacity: 0; } }

@-webkit-keyframes noty_anim_height {
    100% {
        height: 0; } }

@keyframes noty_anim_height {
    100% {
        height: 0; } }

/*# sourceMappingURL=noty.css.map*/

/* ---- css/custom.css ---- */
.contact-details {
    margin-top: 20px;
}


.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    border-bottom: 1px solid #f7f7f7 !important;
    border-top: none !important;
}

.social-icons a i {
    height: 35px;
    width: 35px;
    line-height: 35px;
    text-align: center;
    opacity: 0.9;
    border-radius: 15px;
    font-size: 20px;

}

.space200 {
    margin-top: 200px;
}

.social-icons a i:hover {
    opacity: 1;
}

.social-icons a i.fa-facebook {
    background: #5C72A4;
    color: #fff;
}

.social-icons a i.fa-twitter {
    background: #27AAE1;
    color: #fff;
}

.social-icons a i.fa-google-plus {
    background: #E64522;
    color: #fff;
}

.social-icons a i.fa-instagram {
    background: #E22E68;
    color: #fff;
}

.social-icons a i.fa-linkedin {
    background: #1C75BC;
    color: #fff;
}

.social-icons a i.fa-wordpress {
    background: #217399;
    color: #fff;
}

.img-responsive {
    max-width: 100%;
    width: 100%;
}

.social-icons {
    margin: 20px 0;
}

@media screen and (max-width: 768px) {
    .contact-details {
        text-align: center;
    }

    .space200 {
        margin-top: 20px;
        margin: 20px 0;
        margin-bottom: 40px;
    }

}

.widgetTitle {
    background: #f5f5f5;
    color: #777777 !important;
    padding: 10px 20px;
    border-radius: 3px;
    border: 1px solid #E6E6E6;
}

.pricing .panel-body {
    background: #3498DB !important;
}

.book-reading img {
    width: 45px;
    margin-right: 9px;
    background: #000000;
    padding: 8px;
}

.author_books img {
    height: 200px !important;
    width: auto !important;
}

.book-reading p {
    background: #000;
    color: #fff;
    border-radius: 5px;
    font-size: 19px;
    transition: background 1s;
}

.book-reading p:hover {
    background: #b70121;
}

.rating-input {
    font-size: 28px;
}

.book-description {
    text-align: justify;
    max-height: 10em;
}
.book-description2 * {
    color: #000 !important;
}
.urdut {
    font-size:20px !important;
}
.adspace_sidebar img {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
}

.report i {
    color: red;
}

.mt-10 {
    margin-top: 10px;
}

.book_title {
    margin-top: 0;
}

.author_profile img {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.no-margin {
    margin: 0;
}

.books .col-md-3 {
    text-align: center;
}

.books .col-md-3 h3 {
    margin-bottom: 30px;
}

.featured-books {
    background-color: #f8f8f8;
    padding-bottom: 20px;
}

.white {
    color: white;
}

#login .modal-content {
    margin-top: 15%;
}

#login .modal-body .row {
    margin: 20px 0;
}

#login .modal-body .row h4 {
    font-size: 22px;
    margin: 20px 0;
    margin-bottom: 30px;
}

.modal-title {
    font-size: 25px;
}

.modal-header .close {
    margin-top: 0;
    padding: 7px 11px;
}

.btn-primary-outline {
    background: transparent;
    border: 1px solid #000;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #000;
}

.btn-primary-outline:hover {
    background: #000;
    color: #fff;
    border-color: #000;
}

#forgotPassword .modal-content {
    margin-top: 35%;
}

#forgotPassword .modal-backdrop.in {
    opacity: 0.8;
}

.secondary {
    color: #b70121;
}

.secondary-bg {
    background: #b70121;
}

.secondary-btn {
    background: #b70121 !important;
    color: #fff;
}

.secondary-btn:hover {
    background: #b7150a !important;
    color: #fff;
}

a.bookinfo {
    outline: none;
}

a.bookinfo strong {
    line-height: 30px;
}

a.bookinfo:hover {
    text-decoration: none;
}

a.bookinfo span {
    z-index: 10;
    display: none;
    padding: 14px 20px;
    margin-top: -30px;
    margin-left: 28px;
    width: 300px;
    line-height: 16px;
}

a.bookinfo:hover span {
    display: inline;
    position: absolute;
    color: #111;
    border: 1px solid #DCA;
    background: #fffAF0;
    z-index: 9999999999;
}

.callout {
    z-index: 20;
    position: absolute;
    top: 30px;
    border: 0;
    left: -12px;
}

/*CSS3 extras*/
a.bookinfo span {
    border-radius: 4px;
    box-shadow: 5px 5px 8px #CCC;
}

#howitworks {
    background: #f8f8f8;
    padding: 70px 0;
}

#howitworks img {
    margin-bottom: 70px;
}

.promo-footer {
    margin: 70px 0;
}


.by-genre .col-md-3 {
    background: #3498db;
    height: 225px;
    box-shadow: 1px 1px 14px;
}

.by-genre .col-md-3 h3 {
    color: #fff;
    font-size: 32px;
    font-family: Vampiro One;
    font-weight: 400;
    line-height: 185px;
}

.breadcrumb {
    margin-top: 20px;
}

.book-rating {
    margin: 10px 0;
}

.book-rating i {
    font-size: 18px;
}

.book-details p:nth-child(1) {
    font-size: 18px;
}

.book-details {
    margin: 30px 0;
}

.report {
    margin: 20px 0;
}

.author-profile {
    text-align: left;
    margin: 20px 0;
    background: #f8f8f8;
    padding: 12px 8px;
}

.author-description {
    text-align: justify;
}

.author-stats p {
    text-align: center;
    text-transform: uppercase;
    font-size: 12px;
}

.author-stats h4 {
    text-align: center;
    font-size: 40px;
    color: #b70021;
    margin-top: 0px;
}

.author-stats {
    border-top: 1px solid #b70121;
    border-bottom: 2px solid #b70121;
    padding: 20px 0;
    margin: 20px 0;
}

.by-genre .row {
    margin-top: 30px;
    margin-bottom: 30px;
}

a,
a:hover {
    color: #3498DB;
}

.btn-main {
    background: #3498DB;
}

.home-subscribe {
    background: #ffefef;
}

.btn-white {
    background: #fff;
    color: #3498DB;
}



.nav > li:last-child > a:hover {
    color: #fff !important;
    border-color: #b7351b !important;
    background: #b7351b !important;
}

.sub-form h5 {
    background: #3498db;
}

#intro.intro3 h6 a:hover {
    color: #3498DB;
}

.intro-newsletter button {
    background: #b70021;
}

.dual-btns a {
    background: #b70021;
}

.dual-btns a:nth-child(2) {
    background: #b70021;
}

.app-btn {
    background: #b70021;
}

.service-content span {
    color: #000;
    border: 2px solid #000;
}

.service-content:hover span {
    background: #000;
}

.service-content a {
    color: #b70021;
}

#features {
    background: #f8f8f8;
}

#features h3 {
    color: #fff;
}

.dual-info {
    background: #b70021;
}

.wrap-content {
    background: #b70021;
}

.quote-info p:before {
    color: #b70021;
}

.quote-info cite span {
    color: #b70021;
}

#services2 i {
    background: #b70021;
}

.wrap {
    background: #b70021;
}

.wrap-blue{
    padding: 70px 0;

    background: #3498DB;
}



.wrap a span {
    color: #b70021;
}

.statusMessage i {
    color: #b70021;
}

.f-social a:hover {
    color: #b70021;
}
.footer-copy {
    padding-top: 40px;

}
.footer-copy p a {
    color: #000;
    line-height: 1.3;
}
.footer-copy p a:hover {
    color: #b70021;
}


.close-modal:hover {
    background: #b70021;
}

.slick-dots li button:hover:before, .slick-dots li button:focus:before {
    color: #b70021;
}

.slick-dots li.slick-active button:before {
    color: #3498DB;
}

.quote-slider .owl-controls .owl-page span {
    background: #3498DB;
}

.faq-content .panel-title a:hover {
    color: #3498DB;
}
.padding-100 {
    padding: 100px 0;
}
.padding-120 {
    padding: 120px 0;
}
.book_cover {
    width: 170px;
    height: 240px;
}

li.main{
    position:relative;
    width:175px;
    height:225px;
    overflow:hidden;
}
li.main:hover > .sub{
    bottom:0;
    transition: bottom 0.8s ease;
}
div.sub{
    position:absolute;
    bottom:-225px;
    width:175px;
    height:225px;
    background-color: rgba(0,0,0,0.7);
    border-right: 5px solid #3498db;
    transition: bottom 0.4s ease;
    color: #fff;
    padding: 5px;
    padding-left: 10px;
}

div.sub h4, div.sub h6{
    color: #fff;
}
div.sub p {
    font-size: 11px;
    color: #fff;
}
#login form {
    margin-top: -20px;
}
.carousel-inner img { width: 100%; }
#login_error p {
    color: #ff0000;
}
.sidebar {
    background: #f8f8f8;
    margin-top: 60px;
    padding: 20px;
    border-radius: 5px;
}
.sidebar-widget {
    margin: 20px 0;
}
.sidebar-widget h3 {
    margin-top: 0px;
    border-bottom: 1px solid #f1f1f1;
    padding-bottom:12px;
}



.morphsearch {
    width: 100px;
    right: 65px;
    top: 100px;
    min-height: 40px;
    background: #f8f8f8;
    z-index: 998;
    position: absolute;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transition-property: min-height, width, top, left;
    transition-property: min-height, width, top, left;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}

.morphsearch.open {
    width: 100%;
    min-height: 100%;
    top: 0px;
    right: 0px;
    z-index: 1000
}

.morphsearch-form {
    width: 100%;
    height: 40px;
    margin: 0 auto;
    position: relative;
    -webkit-transition-property: width, height, -webkit-transform;
    transition-property: width, height, transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}

.morphsearch.open .morphsearch-form {
    width: 80%;
    height: 160px;
    -webkit-transform: translate3d(0,3em,0);
    transform: translate3d(0,3em,0);
}

.morphsearch-input {
    width: 100%;
    height: 100%;
    padding: 0 10% 0 10px;
    font-weight: 700;
    border: none;
    background: transparent;
    font-size: 0.8em;
    color: #3498DB;
    -webkit-transition: font-size 0.5s cubic-bezier(0.7,0,0.3,1);
    transition: font-size 0.5s cubic-bezier(0.7,0,0.3,1);
}

.morphsearch-input::-ms-clear { /* remove cross in IE */
    display: none;
}

.morphsearch.hideInput .morphsearch-input {
    color: transparent;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.morphsearch.open .morphsearch-input {
    font-size: 7em;
}

/* placeholder */
.morphsearch-input::-webkit-input-placeholder {
    color: #c2c2c2;
}

.morphsearch-input:-moz-placeholder {
    color: #c2c2c2;
}

.morphsearch-input::-moz-placeholder {
    color: #c2c2c2;
}

.morphsearch-input:-ms-input-placeholder {
    color: #c2c2c2;
}

/* hide placeholder when active in Chrome */
.gn-search:focus::-webkit-input-placeholder {
    color: transparent;
}

input[type="search"] { /* reset normalize */
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.morphsearch-input:focus,
.morphsearch-submit:focus {
    outline: none;
}

.morphsearch-submit {
    position: absolute;
    width: 80px;
    height: 80px;
    text-indent: 100px;
    overflow: hidden;
    right: 0;
    top: 50%;
    background: transparent url(../../images/magnifier.svg) no-repeat center center;
    background-size: 100%;
    border: none;
    pointer-events: none;
    transform-origin: 50% 50%;
    opacity: 0;
    -webkit-transform: translate3d(-30px,-50%,0) scale3d(0,0,1);
    transform: translate3d(-30px,-50%,0) scale3d(0,0,1);
}

.morphsearch.open .morphsearch-submit {
    pointer-events: auto;
    opacity: 1;
    -webkit-transform: translate3d(-30px,-50%,0) scale3d(1,1,1);
    transform: translate3d(-30px,-50%,0) scale3d(1,1,1);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.morphsearch-close {
    width: 36px;
    height: 36px;
    position: absolute;
    right: 1em;
    top: 1em;
    overflow: hidden;
    text-indent: 100%;
    cursor: pointer;
    pointer-events: none;
    opacity: 0;
    -webkit-transform: scale3d(0,0,1);
    transform: scale3d(0,0,1);
}

.morphsearch.open .morphsearch-close {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.morphsearch-close::before,
.morphsearch-close::after {
    content: '';
    position: absolute;
    width: 2px;
    height: 100%;
    top: 0;
    left: 50%;
    border-radius: 3px;
    opacity: 0.2;
    background: #000;
}

.morphsearch-close:hover.morphsearch-close::before,
.morphsearch-close:hover.morphsearch-close::after {
    opacity: 1;
}

.morphsearch-close::before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.morphsearch-close::after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.morphsearch-content {
    color: #333;
    width: 100%;
    height: 0;
    overflow: hidden;
    padding: 0 10.5%;
    background: #f1f1f1;
    position: absolute;
    pointer-events: none;
    opacity: 0;
}

.morphsearch.open .morphsearch-content {
    opacity: 1;
    height: auto;
    overflow: visible; /* this breaks the transition of the children in FF: https://bugzilla.mozilla.org/show_bug.cgi?id=625289 */
    pointer-events: auto;
    -webkit-transition: opacity 0.3s 0.5s;
    transition: opacity 0.3s 0.5s;
}
#search {
    box-shadow: 1px 1px 20px rgba(169, 169, 169, 0.62);
}
.open #search {
    box-shadow: none;
}
.dummy-column {
    width: 45%;
    padding: 0 0 6em;
    float: left;
    opacity: 0;
    -webkit-transform: translate3d(0,100px,0);
    transform: translateY(100px);
    -webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
    transition: transform 0.5s, opacity 0.5s;
}

.morphsearch.open .dummy-column:first-child {
    -webkit-transition-delay: 0.4s;
    transition-delay: 0.4s;
}

.morphsearch.open .dummy-column:nth-child(2) {
    -webkit-transition-delay: 0.45s;
    transition-delay: 0.45s;
}

.morphsearch.open .dummy-column:nth-child(3) {
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.morphsearch.open .dummy-column {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

.dummy-column:nth-child(2) {
    margin: 0 5%;
}

.dummy-column h2 {
    font-size: 1em;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 800;
    color: #c2c2c2;
    padding: 0.5em 0;
}

.round {
    border-radius: 50%;
}

.dummy-media-object {
    padding: 0.75em;
    display: block;
    margin: 0.3em 0;
    cursor: pointer;
    border-radius: 5px;
    background: rgba(118,117,128,0.05);
}

.dummy-media-object:hover,
.dummy-media-object:focus {
    background: rgba(118,117,128,0.1);
}

.dummy-media-object img {
    display: inline-block;
    width: 50px;
    margin: 0 10px 0 0;
    vertical-align: middle;
}

.dummy-media-object h3 {
    vertical-align: middle;
    font-size: 1.1em;
    display: inline-block;
    font-weight: 700;
    margin: 0 0 0 0;
    width: calc(100% - 70px);
    color: #000;
}

.dummy-media-object:hover h3 {
    color: #3498DB;
}

/* Overlay */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
    -webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}

.morphsearch.open ~ .overlay {
    opacity: 1;
}

.store_featured_author {
    text-align: center !important;
    margin: 20px;
    padding: 10px 0;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
}
.store_featured_author h4{
    text-transform: capitalize;
}
.loader img {
    margin: 0 auto;
    display: block;
    width:50px;
}
.store_featured_author_img, .author_image_modal{
    height: 200px !important;
    width:  auto !important;
    margin: 0 auto;
    margin-bottom: 40px;
    border-radius: 5px;
    box-shadow: 0 15px 19px #b9b9b9;
}

.book_image_modal {
    margin-bottom: 40px;
}
.author-name {
    margin-top: 0;
    font-weight: bolder;
    font-size: 40px;
    color: #000;
    text-transform: capitalize;
}

.book-name {
    margin-top: 0px;
    font-weight: bolder;
    font-size: 20px;
    color: #000;
    text-transform: capitalize;
}



.author-description {
    margin-top: 20px;
    max-height: 6em;
}

@media screen and (max-width: 53.125em) {
    .morphsearch-input {
        padding: 0 25% 0 10px;
    }
    .morphsearch.open .morphsearch-input {
        font-size: 2em;
    }
    .dummy-column {
        float: none;
        width: auto;
        padding: 0 0 2em;
    }
    .dummy-column:nth-child(2) {
        margin: 0;
    }
    .morphsearch.open .morphsearch-submit {
        -webkit-transform: translate3d(0,-50%,0) scale3d(0.5,0.5,1);
        transform: translate3d(0,-50%,0) scale3d(0.5,0.5,1);
    }
}

@media screen and (max-width: 60.625em) {
    .morphsearch {
        width: 100px;
        top: 12%;
        right: 10%;
    }
    .genre-module section  h1, .genre-module  section  p {
        text-align: center;
        margin-left: 0px !important;
    }
}
.genre_books {
    padding: 20px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
}


.genre_books .row {
    margin: 40px 0 ;
}
.genre_books .genre_book img {
    height: 200px !important;
    width: auto !important;
    margin: 0 auto;
}

.genre_books .genre_book  {
    background: #f8f8f8;
    padding: 15px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
}
.login_cta {
    position: fixed;
    right: 0;
    bottom: 24%;
    background: #b70121;
    padding: 12px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    padding-right:40px;
}
.login_cta a {
    color: #fff;
}

.ad {
    margin: 20px 0;
}
.ad-rect {
    margin: 10px 0;
}
.goodreads_icon {
    background: #8a583b;
    color: #fff;
    height: 35px;
    font-size: 21px;
    width: 35px;
    -webkit-border-radius: 45%;
    -moz-border-radius: 45%;
    border-radius: 45%;
    display: inline-block;
    text-align: center;
}

.advert-bar {
    position: fixed;
    bottom:0;
    padding: 10px;
    background: rgba(0,0,0,0.7);
    width: 100%;
    color: #fff;
    text-align: center;
}
._4z_b {
    width: 345px !important;
}

#modal_book_content {
    padding: 15px;
    padding-top: 0;
}
#show_book .modal-header {
    padding: 5px !important;
}
.promos {
    max-width: 1140px;
    margin: 0 auto;
}
.promo {
    margin: 1em .5em 1.625em;
    padding: .25em 0 2em;
    background: #0F1012;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    line-height: 1.625;
    color: #f9f9f9;
    text-align: center;
}

.counter {
    text-align: center;

}

.counter h4 {
    font-size: 72px;
    line-height: 72px;
    color: #fff;
    font-weight: 500;
    margin: 20px 0;
}

.counter p {
    font-size: 22px;
    color: #fff;
    font-weight: 200;
}

.counter-holder {
    padding: 40px 0;
    display: flex;
    padding-bottom: 60px;
}

@media (min-width: 40em) {
    .promo {
        display: inline;
        float: left;
        width: 33.333%;
        margin: 1em 0 0;
    }

    .promo.first {
        border-right: none;
    }

    .promo.second {
        float: right;
        border-left: none;
    }
}

.promo h4 {
    margin: .25em 0 0;
    font-size: 2em;
    font-weight: bold;
    padding: 20px 0;
}

.promo .features {
    margin: 0;
    padding: 0;
    list-style-type: none;
    color: #999999;
}

.promo li {
    padding: .25em 0;
}

.promo .brief {
    color: #f9f9f9;
}

.promo .price {
    margin: .5em 0;
    padding: .25em 0;
    background: #292b2e;
    font-size: 250%;
    color: #f9f9f9;
}

.promo .buy {
    margin: 1em 0 0;
}

.promo button {
    padding: 1em 5.25em;
    border: none;
    background: #292b2e;
    color: #f9f9f9;
    cursor: pointer;
}

.promo button:hover {
    background: #27282b;
}

.scale button {
    background: #b70121;
}

.scale button:hover {
    background: #b71b06;
}

@media (min-width: 40em) {
    .scale {
        transform: scale(1.2);
        box-shadow: 0 0 4px 1px rgba(20, 20, 20, 0.8);
    }

    .scale .price {
        color: #b70121;
    }
}

#services {
    padding-bottom: 20px;
}

.transparent-header nav {
}

.white-header header nav {
    background: #fff;
}
.white-header header nav ul li a {
    color: #000 !important;
}
.white-header header nav ul li a:hover {
    color: #b7150a !important;
}

.talent-book-holder {
    height: 300px;
    overflow: auto;
}

.talent_books li {
    display: inline-block;
}
#clients img {
    max-width: 200px;
    max-height: 150px;
}

.footer-social a {
    color: #bfbfbf;
    font-size: 30px;
    margin-right: 40px;
}

.footer-social a:hover {
    color: #b70121;
}
.store_featured_author a {
    color: #b70121;
}

.store_featured_author a:hover {
    color: #000;
}

.ic-inner img {
    border-radius: 50%;
}



footer p {
    font-size: 15px;
    line-height: 1.6;
    font-weight: 100;
}

footer h4 {
    margin-bottom: 30px;
}
.pt-50 {
    padding-top: 50px;
}


.fa-beat {
    animation:fa-beat 5s ease infinite;
}
@keyframes fa-beat {
    0% {
        transform:scale(1);
    }
    5% {
        transform:scale(1.25);
    }
    20% {
        transform:scale(1);
    }
    30% {
        transform:scale(1);
    }
    35% {
        transform:scale(1.25);
    }
    50% {
        transform:scale(1);
    }
    55% {
        transform:scale(1.25);
    }
    70% {
        transform:scale(1);
    }
}


.heart {
    color:red;
}

footer .in-sub div {
    padding-bottom: 40px;
}

header {
    border-top: 2px solid #000;
}

.wa_order_btn p {
    background: #03D755;
    padding: 6px 15px;
}

.wa_order_btn i {
    font-size: 26px;
}
a.disabled p {
    background: #333;
    pointer-events: none;
}

a.disabled {
    cursor: not-allowed;
}

.cart-item p {
    color: #000;
}
.cart-item a i {
    background: #3498DB;
    color: #000;
    padding: 6px;
    border-radius: 4px;
    transition: background 0.5ms;
}
.cart-item a i:hover {
    background: #000;
    color: #fff;

}
.cart-p {
    color: #3498DB;
    font-weight: bold;
}

.caption {
    text-align: center;
}
.caption {
    background: #f5f5f5;
}
.cart-product-title {
    font-size: 17px;
}
.cart-product-title:hover {
    text-decoration: underline;
    color: #333;
}
.thumbnail {
    -webkit-box-shadow: 0 3px 2px rgba(0,0,0,0.15) , 0 0 1px rgba(0,0,0,0.15);
    box-shadow: 0 3px 2px rgba(0,0,0,0.15) , 0 0 1px rgba(0,0,0,0.15);
    -webkit-border-radius: 4px;
}
.cart-item {
    padding: 10px 0;
}
.sidebar.right {
    top: 0;
    right: 0;
    bottom: 0;
    width: 400px;
    background: #fff;
    z-index: 999999;
    border-left: 7px solid #0155b2;
}
.cart-item h5 {
    margin-top :0px;
}
.p-da {
    font-size: 14px !important;
    color: #0155b2;
}
.p-da s{
    font-size: 13px !important;
    color: gray;
}
.p-da small {
    font-size: 11px !important;
    color: black;
}
.quantitys {
    font-size: 17px !important;
}
.price {
    color: #0155b2;
    font-size: 115%;
    font-weight: bold;
}


/* ---- assets/css/qissa-ui.css ---- */
/* The legacy theme only loads Roboto 300/400, so every "bold" was synthetic.
   @import must precede all other rules in this sheet.
   Urdu: Roboto has no Arabic-script glyphs, so Urdu text used to fall back to a
   generic system face (the poor readability). Adding proper Urdu faces AFTER
   Roboto in the stack means Latin still renders in Roboto while Arabic-script
   characters automatically pick up the Urdu font — no markup changes needed.
     · Noto Naskh Arabic  → body/UI text (compact, very legible at small sizes)
     · Noto Nastaliq Urdu → titles/quotes (the calligraphic style Urdu readers
       expect; needs generous line-height or descenders clip) */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;800&family=Noto+Naskh+Arabic:wght@400;500;600;700&family=Noto+Nastaliq+Urdu:wght@400;500;600;700&display=swap');

/* ==========================================================================
   Qissa UI — shared design system (from the Daastan Figma).
   Scoped, opt-in classes (.qs-*) + CSS variables so pages adopt the new look
   incrementally without disturbing the legacy theme. Applied page by page.
   ========================================================================== */

:root {
    --qs-navy:        #0E3A53;   /* Dark Blue — primary: headings, price, buttons, ribbon */
    --qs-navy-700:    #0A2C40;   /* hover/darker */
    --qs-blue:        #2F6FA6;   /* Light Blue — links, "by author" */
    --qs-bg-blue:     #EAF1F6;   /* BG Blue — pill / tag backgrounds */
    --qs-pill-text:   #38617A;   /* text on bg-blue pills */
    --qs-ink:         #1A1A1A;   /* primary text */
    --qs-ink-2:       #3A3A3A;   /* body text */
    --qs-muted:       #8A8A8A;   /* labels / secondary */
    --qs-line:        #E6E6E6;   /* hairline borders */
    --qs-field-border:#D5DBE0;   /* inputs */
    --qs-star:        #F4B400;   /* rating gold */
    --qs-surface:     #FFFFFF;
    --qs-radius:      8px;        /* controls */
    --qs-radius-card: 14px;       /* cards */
    /* Roboto first (Latin), then Naskh — Arabic-script glyphs fall through to it. */
    /* The "Qs * Fallback" faces (qs-fonts.css) are LOCAL system fonts with
       their line metrics pinned to the webfont's own, so the text that paints
       before the webfont arrives already occupies the right-sized lines and
       the swap cannot shift the layout (CLS pass, 20 Aug 2026). They must sit
       immediately after the face they stand in for. */
    --qs-font: "Roboto", "Noto Naskh Arabic", "Qs Naskh Fallback", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    /* Calligraphic Nastaliq for book titles + quotes. */
    --qs-font-urdu: "Roboto", "Noto Nastaliq Urdu", "Qs Nastaliq Fallback", "Noto Naskh Arabic", Arial, sans-serif;
}

/* Base scope: apply .qs-scope to a wrapper to opt a region into the new type. */
.qs-scope { font-family: var(--qs-font); color: var(--qs-ink-2); }

/* ---- Typography ---- */
.qs-h1 { font-size: 34px; font-weight: 800; color: var(--qs-ink); line-height: 1.2; margin: 0; }
.qs-h2 { font-size: 22px; font-weight: 700; color: var(--qs-ink); margin: 0 0 14px; }
.qs-byline { font-size: 15px; color: var(--qs-muted); }
.qs-byline a, .qs-link { color: var(--qs-blue); text-decoration: underline; }
.qs-link:hover { color: var(--qs-navy); }

/* ---- Breadcrumb ---- */
.qs-breadcrumb { font-size: 14px; color: var(--qs-muted); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.qs-breadcrumb a { color: var(--qs-muted); text-decoration: none; }
.qs-breadcrumb a:hover { color: var(--qs-blue); }
.qs-breadcrumb .qs-sep { color: #c9c9c9; }
.qs-breadcrumb .qs-current { color: var(--qs-blue); }

/* ---- Pills / tags (Figma tokens: BG Blue bg, slate-blue text — NOT grey) ---- */
.qs-pill { display: inline-block; background: var(--qs-bg-blue); color: #38617A; font-family: var(--qs-font);
           font-size: 13px; padding: 6px 16px; border-radius: 20px; line-height: 1.4; }

/* ---- Ribbon (Best Seller etc.) — folded banner with a notched tail ---- */
.qs-ribbon { display: inline-block; background: var(--qs-navy); color: #fff; font-family: var(--qs-font);
             font-size: 14px; font-weight: 500; padding: 8px 32px 8px 16px; border-radius: 4px 0 0 4px;
             -webkit-clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 50%, 100% 100%, 0 100%);
             clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 50%, 100% 100%, 0 100%); }

/* ---- Stars ---- */
/* ==========================================================================
   Content column.

   Bootstrap's .container is 1170px from 1200px up — 91% of a 1280 viewport,
   against the 72% the Figma lays out (1040 of 1440). At 1170 a full-width
   paragraph runs to about 135 characters a line; comfortable reading is 45-75.

   So 1040 everywhere, with two exceptions: the store and the genre listings
   are grids of book covers, where the extra width is a feature rather than a
   readability cost. Those pages carry <body class="qs-wide">.

   The header and footer keep their own 1170 — they are chrome, and the store
   still needs the full width beneath them.
   ========================================================================== */
.container { max-width: 1040px; }
body.qs-wide .container { max-width: none; }

.qs-stars { color: var(--qs-star); font-size: 20px; letter-spacing: 2px; line-height: 1;
            display: inline-block; }
.qs-stars .qs-off { color: #DCDCDC; }
.qs-stars--sm { font-size: 15px; letter-spacing: 1px; }

/* Stars + score + source. Built by qs_rating_pill() in bin/stars.php so every
   place that shows an aggregate rating looks the same. */
.qs-rating-pill { display: inline-flex; align-items: center; gap: 11px; margin-top: 12px;
                  padding: 11px 22px; background: #fff; border-radius: 40px; }
.qs-rating-pill--tint { background: var(--qs-bg-blue); }
.qs-rating-pill strong { font-size: 19px; font-weight: 800; color: var(--qs-navy); }
.qs-rating-pill span:not(.qs-stars):not(.qs-off) { font-size: 14.5px; color: var(--qs-pill-text); }
.qs-rating-pill a { color: var(--qs-blue); font-weight: 600; text-decoration: none; }
.qs-rating-pill a:hover { text-decoration: underline; }
/* Figma: the review count beside the stars is navy and bold, not grey */
.qs-reviews { color: var(--qs-navy); font-size: 14px; font-weight: 700; }
.qs-pd-by { font-family: var(--qs-font); font-size: 18px; color: var(--qs-ink-2);
            font-weight: 400 !important; margin: 0 0 4px; text-transform: none; }
.qs-pd-by a { color: var(--qs-ink); text-decoration: underline; }

/* ---- Price ---- */
.qs-price { font-size: 36px; font-weight: 800; color: var(--qs-navy); line-height: 1; }
.qs-price small { font-size: 15px; font-weight: 500; color: var(--qs-muted); }

/* ---- Buttons ---- */
.qs-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px;
          background: var(--qs-navy); color: #fff; border: 1px solid var(--qs-navy);
          font-size: 16px; font-weight: 500; padding: 16px 20px; border-radius: var(--qs-radius);
          cursor: pointer; text-decoration: none; transition: background .15s ease; }
.qs-btn:hover { background: var(--qs-navy-700); color: #fff; }
.qs-btn--block { width: 100%; }
.qs-btn--outline { background: #fff; color: var(--qs-navy); border: 1px solid var(--qs-field-border); }
.qs-btn--outline:hover { background: var(--qs-bg-blue); color: var(--qs-navy); }
.qs-btn.disabled, .qs-btn[disabled] { opacity: .5; cursor: not-allowed; }

/* ---- Format tabs (segmented) ---- */
.qs-tabs { display: flex; gap: 10px; margin-bottom: 18px; }
.qs-tab { flex: 1; text-align: center; padding: 13px 10px; border: 1px solid var(--qs-field-border);
          border-radius: var(--qs-radius); background: #fff; color: var(--qs-muted);
          font-size: 14px; font-weight: 500; cursor: pointer; transition: all .12s ease; line-height: 1.3; }
.qs-tab:hover { border-color: var(--qs-navy); color: var(--qs-navy); }
.qs-tab.is-active { background: var(--qs-navy); color: #fff; border-color: var(--qs-navy); }

/* ---- Form controls ---- */
.qs-select, .qs-input { width: 100%; padding: 12px 14px; border: 1px solid var(--qs-field-border);
             border-radius: var(--qs-radius); font-size: 14px; color: var(--qs-ink);
             background: #fff; }
.qs-select { cursor: pointer; }
.qs-select:focus, .qs-input:focus { outline: none; border-color: var(--qs-navy); box-shadow: 0 0 0 3px rgba(14,58,83,.10); }

/* ---- Cards ---- */
.qs-card { background: var(--qs-surface); border: 1px solid var(--qs-line); border-radius: var(--qs-radius-card); padding: 20px; }

/* ---- Spec list (Product Details: bold dark label, regular value — per Figma) ---- */
.qs-specs { font-size: 14px; line-height: 2.6; color: var(--qs-ink-2); }
.qs-specs .qs-k { color: var(--qs-ink); font-weight: 700; }

/* ---- Section headings (About, Reviews, Product Details, related) ---- */
.qs-section-h { font-family: var(--qs-font); font-size: 26px; font-weight: 700; color: var(--qs-ink);
                line-height: 1.25; margin: 0 0 18px; }
.qs-center { text-align: center; }
.qs-body-text { font-size: 15px; line-height: 1.85; color: var(--qs-ink-2); }
.qs-sec-head { display: flex; align-items: center; justify-content: space-between; gap: 16px;
               flex-wrap: wrap; margin-bottom: 10px; }
.qs-sec-head .qs-section-h { margin: 0; }
.qs-btn--sm { padding: 10px 24px; font-size: 14px; }

/* ---- Video block (rounded, light frame like the Figma placeholder) ---- */
.qs-video { border-radius: 12px; overflow: hidden; background: var(--qs-bg-blue); margin: 6px 0 40px; }
.qs-videos-list { margin: 0 0 40px; }
/* Photos & Videos gallery — same section rhythm as its neighbours (40–46px). */
.qs-gallery-sec { margin: 6px 0 44px; }

.qs-about { margin: 0 0 44px; }

/* ---- Reviews (Figma rows: stars · By Name · date right; grey body) ---- */
.qs-reviews-sec { margin: 8px 0 46px; }
.qs-review { margin: 26px 0; }
.qs-review-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
/* Figma review row: 5-star span ~141 design px (measured off frame 919-64554). */
.qs-review-head .qs-stars { font-size: 29px; letter-spacing: 4px; line-height: 1; }
.qs-review-name { font-size: 16px; font-weight: 700; color: var(--qs-ink); }
.qs-review-name a { color: inherit; text-decoration: none; }
.qs-review-name a:hover { color: var(--qs-navy); }
.qs-review-date { margin-left: auto; font-size: 13px; color: var(--qs-ink-2); }
.qs-review-text { margin: 12px 0 0; font-size: 15px; line-height: 1.8; color: #6B7280; }

/* ---- Right rail: About the Author ---- */
.qs-rail { padding-top: 6px; }
.qs-author-card { margin-bottom: 44px; }
.qs-author-head { display: flex; align-items: center; gap: 14px; margin: 2px 0 16px; }
.qs-author-avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; display: block; }
.qs-author-name { display: block; font-size: 19px; font-weight: 700; color: var(--qs-ink); text-decoration: none; }
.qs-author-name:hover { color: var(--qs-navy); text-decoration: none; }
.qs-author-sub { font-size: 13px; color: var(--qs-muted); }
.qs-author-bio { font-size: 15px; line-height: 1.8; color: var(--qs-ink-2); margin-bottom: 14px;
                 display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden; }
.qs-author-social { margin-bottom: 16px; }
.qs-author-social a { color: var(--qs-blue); margin-right: 12px; font-size: 16px; }
.qs-author-social .goodreads_icon { font-weight: 700; font-family: Georgia, serif; }
.qs-rail-cta { text-align: center; }

/* ---- Right rail: Product Details + editors ---- */
.qs-product-details { margin-bottom: 40px; }
.qs-editors { margin-top: 10px; font-size: 14px; }
.qs-editors > .qs-k { display: block; margin-bottom: 6px; }
.qs-editor { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.qs-editor img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.qs-editor a { color: var(--qs-ink); text-decoration: underline; }
.qs-editor a:hover { color: var(--qs-navy); }

/* ---- Book card (listing / related sections) ---- */
.qs-book-card { font-family: var(--qs-font); }
/* On light backgrounds a wide halo bleeds into neighbouring cards — use a
   tight elevation shadow instead: slightly darker hairline outline + short
   drop, deepening a touch on hover. */
.qs-book-cover { position: relative; display: block; background: var(--qs-bg-blue);
                 border-radius: 10px; overflow: hidden;
                 box-shadow: 0 0 0 1px rgba(14,58,83,.14), 0 3px 8px rgba(14,58,83,.14),
                             0 8px 16px -8px rgba(14,58,83,.30);
                 transition: box-shadow .15s ease, transform .15s ease; }
.qs-book-cover:hover { transform: translateY(-2px);
                 box-shadow: 0 0 0 1px rgba(14,58,83,.18), 0 5px 12px rgba(14,58,83,.18),
                             0 14px 24px -8px rgba(14,58,83,.35); }
/* height:auto is load-bearing — the same trap already documented for
   .qs-svc-gal img further down this file, which was fixed there and never
   swept. qs_img_dims() puts width/height ATTRIBUTES on these covers to reserve
   the box and stop layout shift. The attribute height is a presentational hint,
   and a definite height makes the browser IGNORE aspect-ratio entirely: the
   author rule sets width:100% but nothing set height, so every cover on the
   store and the author pages rendered at its natural height — 1250px against a
   208px column. */
.qs-book-cover img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; display: block; }

/* ---- Owl rails BEFORE the JS arrives (CLS pass, owner 20 Aug 2026) --------
   Every qs-carousel <ul> rendered as a plain stacked list until owlCarousel()
   ran, then snapped into a row — the single biggest layout shift on book,
   store and CMS pages (field CLS 0.82). Pre-init, lay the list out the way
   owl will: one flexbox row, per-breakpoint item widths matching the init's
   items counts (5/4/3/2/1), overflow hidden. Owl v1 adds .owl-carousel to
   the element on init, so :not(.owl-carousel) IS "before the JS". The
   bottom margin stands in for the nav/dots bar owl appends (~56px); it
   stops applying at init when the real controls take the space. */
ul.qs-carousel:not(.owl-carousel) {
    display: flex; overflow: hidden; align-items: stretch;
    list-style: none; margin: 0 0 56px; padding: 0;
}
ul.qs-carousel:not(.owl-carousel) > li { flex: 0 0 20%; max-width: 20%; padding: 0 8px; }
@media (max-width: 1199px) { ul.qs-carousel:not(.owl-carousel) > li { flex-basis: 25%; max-width: 25%; } }
@media (max-width: 979px)  { ul.qs-carousel:not(.owl-carousel) > li { flex-basis: 33.333%; max-width: 33.333%; } }
@media (max-width: 767px)  { ul.qs-carousel:not(.owl-carousel) > li { flex-basis: 50%; max-width: 50%; } }
@media (max-width: 479px)  { ul.qs-carousel:not(.owl-carousel) > li { flex-basis: 100%; max-width: 100%; } }
/* The genre best-seller ribbon (Bookfolio phase 5) — top-LEFT, so it never
   collides with the format badge on the right. One book per genre wears it. */
.qs-book-rank { position: absolute; top: 10px; left: 10px; background: #0E3A53; color: #fff;
    font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px;
    letter-spacing: .02em; box-shadow: 0 2px 6px rgba(0,0,0,.25); }
/* Ranks 2..tier: quieter than the #1 ribbon, the same shape. Doubled class so
   source order can never flip it (the qsp-form-grid--dense lesson). */
.qs-book-rank.qs-book-rank--t { background: #DCEAF7; color: #0E3A53; box-shadow: none; }
.qs-book-badge { position: absolute; top: 10px; right: 10px; background: #DCEAF7; color: var(--qs-blue);
                 font-size: 12px; font-weight: 600; padding: 4px 12px; border-radius: 14px; }
/* Title clamps to exactly two lines (min-height reserves them) and the genre
   pill pins to the card bottom, so a row of cards stays aligned whether a
   title takes one line or three-would-be lines. */
.qs-book-card { display: flex; flex-direction: column; }
/* min-height reserves TWO title lines so the author line and genre pill sit at
   the same height on every card — in grids AND in carousels (where cards don't
   stretch to a shared height, so margin-top:auto alone can't align them).
   Must track line-height + the Nastaliq head-room padding: 2×1.7em + 0.3em. */
.qs-book-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
                overflow: hidden; min-height: 3.7em; margin: 12px 0 4px; font-size: 17px;
                font-weight: 700; color: var(--qs-ink); text-decoration: none; line-height: 1.7; }
.qs-book-name:hover { color: var(--qs-navy); text-decoration: none; }
.qs-book-author { display: block; font-size: 13.5px; color: var(--qs-muted); white-space: nowrap;
                  overflow: hidden; text-overflow: ellipsis; text-decoration: none; }
a.qs-book-author:hover { color: var(--qs-navy); text-decoration: underline; }
.qs-feat-author a { color: inherit; text-decoration: none; }
.qs-feat-author a:hover { color: #fff; text-decoration: underline; }
.qs-spot-author a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.45); }
.qs-spot-author a:hover { color: #fff; text-decoration: none; border-bottom-color: #fff; }
.qs-modal-author { font-size: 14px; color: #777; margin: -4px 0 8px; }
.qs-modal-author a { color: var(--qs-navy, #0E3A53); font-weight: 600; text-decoration: none; }
.qs-modal-author a:hover { text-decoration: underline; }
.qs-book-genre { text-align: center; margin-top: auto; padding-top: 12px; }

/* 3-up grid for "More books by {author}" */
.qs-book-grid { display: flex; flex-wrap: wrap; gap: 28px; }
.qs-book-grid .qs-book-card { width: calc(33.333% - 19px); min-width: 150px; }
/* Static 5-up store row (odd rows alternate with carousels, per the Figma) */
.qs-book-grid--row { gap: 24px; }
.qs-book-grid--row .qs-book-card { width: calc(20% - 20px); min-width: 140px; }
@media (max-width: 991px) { .qs-book-grid--row .qs-book-card { width: calc(33.333% - 16px); } }
@media (max-width: 560px) { .qs-book-grid--row .qs-book-card { width: calc(50% - 12px); } }
/* Phones: every book grid is two columns, and an odd total leaves no lone
   card hugging the left edge — the last one centres in its row instead. */
@media (max-width: 560px) {
  .qs-book-grid .qs-book-card { min-width: 0; }
  .qs-book-grid:not(.qs-book-grid--4):not(.qs-book-grid--row) .qs-book-card { width: calc(50% - 14px); }
  .qs-book-grid .qs-book-card:nth-child(odd):last-child { margin-left: auto; margin-right: auto; }
}
.qs-more-by { margin: 0 0 46px; }

/* ---- Related carousel ("Other books you might like") — Owl v1 controls ---- */
.qs-related { margin: 22px 0 36px; }
.qs-related .qs-section-h { margin-bottom: 30px; }
.qs-carousel { position: relative; padding-bottom: 64px; list-style: none; margin: 0; padding-left: 0; }
/* Vertical padding gives the cover glow room — owl's wrapper clips overflow */
.qs-carousel .owl-item { padding: 10px 12px 18px; }
.qs-carousel .owl-controls { position: absolute; bottom: 0; left: 0; right: 0; height: 40px; }
.qs-carousel .owl-pagination { position: absolute; left: 0; right: 0; bottom: 12px; text-align: center; }
.qs-carousel .owl-page { display: inline-block; margin: 0 3px; }
.qs-carousel .owl-page span { display: block; width: 8px; height: 8px; border-radius: 5px;
                              background: #C7D2DC; opacity: 1; transition: all .15s ease; }
.qs-carousel .owl-page.active span { width: 22px; background: var(--qs-navy); }
.qs-carousel .owl-buttons div.owl-prev,
.qs-carousel .owl-buttons div.owl-next { position: absolute; bottom: 0; width: 40px; height: 40px;
    border-radius: 50%; background: var(--qs-navy); color: #fff; font-size: 20px; line-height: 40px;
    text-align: center; opacity: 1; padding: 0; margin: 0; cursor: pointer; }
.qs-carousel .owl-buttons div.owl-prev { left: calc(50% - 175px); }
.qs-carousel .owl-buttons div.owl-next { right: calc(50% - 175px); }
.qs-carousel .owl-pagination { max-width: 240px; margin: 0 auto; line-height: 20px; }
.qs-carousel .owl-buttons div.owl-prev:hover,
.qs-carousel .owl-buttons div.owl-next:hover { background: var(--qs-navy-700); opacity: 1; }
.qs-carousel .owl-buttons div.disabled { opacity: .45; cursor: default; }
/* Phones show two cards per view (Figma Bookstore Mobile 928-55523), so the
   glow padding shrinks with the card — 12px a side would eat a sixth of it. */
@media (max-width: 560px) { .qs-carousel .owl-item { padding: 8px 7px 14px; } }

/* ==========================================================================
   Store / bookstore landing (Figma node 928-53751)
   ========================================================================== */

/* Hero banner: the two admin featured-book slides as a fixed-proportion navy
   gradient panel — white-matted cover left, clamped copy + white CTA right,
   overlay arrows. Admin bg/text colours are ignored (black-on-black legacy). */
.qs-store-hero { border-radius: var(--qs-radius-card); overflow: hidden; margin: 4px 0 10px; }
.qs-hero-slide { display: flex; align-items: center; gap: 48px; height: 400px;
                 padding: 40px 120px 40px 64px;
                 background: linear-gradient(115deg, #0A2C40 0%, var(--qs-navy) 45%, #1B5379 100%); }
.qs-hero-cover { flex-shrink: 0; display: block; border-radius: 8px; transform: rotate(-2deg);
                 box-shadow: 0 0 0 1px rgba(255,255,255,.25), 0 0 36px 6px rgba(255,255,255,.30),
                             0 18px 40px rgba(0,0,0,.45);
                 transition: transform .2s ease; }
.qs-hero-cover:hover { transform: rotate(0deg) scale(1.02); }
.qs-hero-cover img { display: block; width: 210px; height: 300px; object-fit: cover; border-radius: 8px; }
.qs-hero-body { min-width: 0; }
.qs-hero-kicker { color: rgba(255,255,255,.65); font-family: var(--qs-font); font-size: 13px;
                  font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 14px; }
.qs-hero-title { font-family: var(--qs-font); color: #fff; font-size: 36px; font-weight: 800 !important;
                 line-height: 1.2; margin: 0 0 14px; text-transform: none; letter-spacing: 0;
                 display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.qs-hero-desc { color: rgba(255,255,255,.85); font-family: var(--qs-font); font-size: 15px;
                line-height: 1.85; max-width: 640px; margin: 0 0 24px;
                display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 767px) {
    .qs-hero-slide { flex-direction: column; height: auto; padding: 30px; gap: 24px; }
    .qs-hero-title { font-size: 26px; }
}
/* Overlay arrows on the hero (owl v1: neutralise the theme's positioned controls).
   owl.js adds `.owl-theme` to the container at runtime, so owl.theme.css's
   `.owl-theme .owl-controls .owl-buttons div` (3 classes) out-specifies a bare
   `.qs-store-hero .owl-buttons div` (2) and its grey #869791 / opacity:.5 defaults
   win — the arrows rendered muddy grey and half-transparent. Every rule below is
   qualified through `.owl-theme .owl-controls` so it carries more weight than the
   theme it is replacing; .clickable on hover matches the class owl adds there. */
.qs-store-hero .owl-carousel3 { position: relative; }
.qs-store-hero .owl-theme .owl-controls { position: static !important; margin: 0; height: 0; }
.qs-store-hero .owl-theme .owl-controls .owl-buttons div {
    position: absolute; top: 50%; margin: -20px 0 0; padding: 0; width: 40px; height: 40px;
    border-radius: 50%; background: rgba(255,255,255,.92); color: var(--qs-navy);
    font-size: 17px; line-height: 40px; text-align: center; opacity: 1; }
.qs-store-hero .owl-theme .owl-controls .owl-buttons div.owl-prev { left: 20px; }
.qs-store-hero .owl-theme .owl-controls .owl-buttons div.owl-next { right: 20px; }
.qs-store-hero .owl-theme .owl-controls.clickable .owl-buttons div:hover { background: #fff; color: var(--qs-navy); opacity: 1; }
.qs-store-hero .owl-theme .owl-controls .owl-buttons div.disabled { opacity: 0; }

/* Section rhythm + centred heading with optional right-hand "See All".
   The h2 selectors are deliberately specific: the legacy theme styles bare
   h2/h3 (light weight, letter-spacing, transforms) and was winning. */
.qs-sec { margin: 56px 0; }
.qs-sec-head2 { position: relative; text-align: center; margin-bottom: 26px; }
/* "612 titles" under a paged catalogue heading. Only drawn when the list is
   paged -- on a three-book shelf the count is already in front of you, and a
   number that restates what is visible is noise. */
.qs-sec-count { display: block; margin-top: 4px; font-size: 14px; color: var(--qs-muted); }
.qs-scope .qs-section-h, .qs-scope h2.qs-section-h {
    display: block; font-family: var(--qs-font); font-size: 28px; font-weight: 700 !important;
    color: var(--qs-ink); line-height: 1.25; letter-spacing: -0.3px; text-transform: none;
    margin: 0 0 18px; }
/* Wrappers that own their own spacing keep the heading flush. */
.qs-scope .qs-sec-head .qs-section-h, .qs-scope .qs-sec-head2 .qs-section-h { margin: 0; }
.qs-sec-head2 .qs-section-h, .qs-sec-head2 h2.qs-section-h { display: inline-block; font-size: 30px; }
.qs-see-all { position: absolute; right: 0; top: 50%; transform: translateY(-50%);
              color: var(--qs-navy); font-weight: 600; text-decoration: none; font-size: 15px; }
.qs-see-all:hover { color: var(--qs-blue); text-decoration: none; }
@media (max-width: 640px) {
    .qs-sec-head2 .qs-section-h, .qs-sec-head2 h2.qs-section-h { display: block; font-size: 24px; margin-bottom: 8px; }
    .qs-see-all { position: static; transform: none; display: inline-block; }
}
.qs-sub { text-align: center; color: var(--qs-muted); font-size: 15px; margin: -16px 0 26px; }
/* Editorial paragraph under the sub-title, above the books. Real prose rather
   than a one-line strapline, so it gets a reading measure and body line-height
   instead of .qs-sub's tighter treatment; centred to sit under the heading, but
   the text itself stays left-aligned because centred prose is hard to read past
   a line or two. */
.qs-sec-desc { max-width: 760px; margin: -10px auto 30px; color: var(--qs-muted);
               font-family: var(--qs-font); font-size: 16px; line-height: 1.75; text-align: left; }
.qs-sub + .qs-sec-desc { margin-top: 0; }
/* Urdu and Arabic-script copy: Nastaliq ink runs to roughly twice its declared
   font size, so the 1.75 above overlaps. Same reason .qs-feat-title carries its
   own line-height. */
.qs-sec-desc[dir="rtl"], .qs-sec-desc:lang(ur) { line-height: 2.15; }
@media (max-width: 767px) { .qs-sec-desc { font-size: 15px; margin-bottom: 24px; } }

/* Perks strip: icon + navy title + grey sub, hairline separators */
.qs-perks { display: flex; justify-content: center; flex-wrap: wrap; margin: 46px 0; }
.qs-perk { display: flex; align-items: flex-start; gap: 14px; padding: 6px 44px; }
.qs-perk + .qs-perk { border-left: 1px solid var(--qs-line); }
.qs-perk i { color: var(--qs-navy); font-size: 26px; margin-top: 2px; }
.qs-perk-t { color: var(--qs-navy); font-weight: 700; font-size: 16px; }
.qs-perk-s { color: var(--qs-muted); font-size: 13px; margin-top: 2px; }

/* The legacy .books class paints a #f8f8f8 band with no top padding — the
   Figma has no band there, so reskinned sections drop it. */
.qs-sec.books { background: transparent !important; padding: 0 !important; }

/* Genre banners (talent-tile style from the Figma: photo strip, white fade,
   navy bold label on the left). First 9 show; the rest toggle open. */
.qs-genre-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
/* Genre band = Figma talent tile + our folded-ribbon count chip: a curated
   photo strip under a white wash (strong on the label side, lighter right),
   navy label left, navy notched count tab flush on the right edge. */
/* The genre tile moved to assets/css/qs-genre-tile.css -- the admin loads
   the same file to preview a tile, and one copy cannot drift from another. */
.qs-genre-hidden.qs-genre-show { display: flex; }
.qs-genre-toggle-wrap { text-align: center; margin-top: 22px; }
/* A <button>, not an anchor: with <base href> set, a bare href="#" resolves
   against the base URL and navigates to the site root. It still has to LOOK
   like the quiet text link the design calls for, so the button chrome is
   reset here -- otherwise the browser draws its default grey box. */
.qs-genre-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: 0;
    padding: 8px 4px;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    color: var(--qs-blue);
    cursor: pointer;
    text-decoration: none;
    transition: color .15s;
}
.qs-genre-toggle:hover, .qs-genre-toggle:focus { color: var(--qs-navy); }
.qs-genre-toggle:focus-visible { outline: 2px solid var(--qs-blue); outline-offset: 3px; border-radius: 4px; }
.qs-genre-toggle i { font-size: 13px; transition: transform .2s; }
.qs-genre-toggle[aria-expanded="true"] i { transform: translateY(1px); }
@media (max-width: 991px) { .qs-genre-grid { grid-template-columns: repeat(2, 1fr); } }
/* Figma Bookstore Mobile keeps genres a grid, not a stack — two banners a row.
   The matching label/count shrink lives in qs-genre-tile.css (loads after us). */
@media (max-width: 560px) { .qs-genre-grid { grid-template-columns: repeat(2, 1fr); } }

/* Featured Books navy cards (2-up) — fixed height so a pair always matches;
   title/description/author all clamp instead of stretching the card. */
.qs-feat-card { display: flex; gap: 22px; background: var(--qs-navy); border-radius: var(--qs-radius-card);
                padding: 24px; height: 296px; overflow: hidden; }
/* Soft white glow (no hard outline) so dark covers separate from the navy card */
.qs-feat-cover { width: 180px; height: 248px; flex-shrink: 0; object-fit: cover; border-radius: 8px; display: block;
                 flex-shrink: 0;
                 box-shadow: 0 0 0 1px rgba(255,255,255,.22), 0 0 28px 4px rgba(255,255,255,.28),
                             0 10px 24px rgba(0,0,0,.35); }
.qs-feat-body { color: #fff; display: flex; flex-direction: column; align-items: flex-start; flex: 1; min-width: 0; }
.qs-feat-title { font-size: 21px; font-weight: 700; color: #fff; margin: 2px 0 10px; line-height: 1.3;
                 display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.qs-feat-desc { color: rgba(255,255,255,.85); font-size: 14px; line-height: 1.7; margin: 0 0 8px;
                display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.qs-feat-author { color: rgba(255,255,255,.9); font-style: italic; font-size: 14px; margin: 0 0 12px;
                  max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qs-feat-body .qs-btn { margin-top: auto; }
@media (max-width: 640px) {
    .qs-feat-card { flex-direction: column; align-items: center; text-align: center; }
    .qs-feat-cover { margin: 0 auto; }
    .qs-feat-body { align-items: center; }
    .qs-feat-body .qs-btn { width: 100%; justify-content: center; margin-top: 16px; }
}
@media (max-width: 767px) {
    .qs-feat-card { height: auto; flex-direction: column; }
    .qs-feat-cover { width: 140px; height: 190px; }
}
.qs-btn--white { background: #fff; color: var(--qs-navy); border-color: #fff; }
.qs-btn--white:hover { background: var(--qs-bg-blue); color: var(--qs-navy); border-color: var(--qs-bg-blue); }
.qs-btn--outline-white { background: transparent; color: #fff; border-color: rgba(255,255,255,.7); }
.qs-btn--outline-white:hover { background: rgba(255,255,255,.14); color: #fff; border-color: #fff; }

/* Highlights ("Celebrating this Day"): Figma editorial cards — image,
   bold headline, grey blurb; 3-up, wrapping as more items are added. */
.qs-highlight-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.qs-highlight { display: block; text-decoration: none; }
.qs-highlight-img { display: block; width: 100%; aspect-ratio: 8 / 5; border-radius: 10px;
                    background-size: cover; background-position: center;
                    box-shadow: 0 0 0 1px rgba(14,58,83,.14), 0 3px 8px rgba(14,58,83,.14),
                                0 8px 16px -8px rgba(14,58,83,.30); }
.qs-highlight-img--ph { background: var(--qs-bg-blue); display: flex; align-items: center;
                        justify-content: center; color: var(--qs-blue); font-size: 40px; opacity: .8; }
.qs-highlight-title { display: block; margin: 18px 0 8px; font-family: var(--qs-font); font-size: 20px;
                      font-weight: 700; color: var(--qs-ink); line-height: 1.3; }
a.qs-highlight:hover .qs-highlight-title { color: var(--qs-blue); }
.qs-highlight-desc { display: block; font-family: var(--qs-font); font-size: 14px;
                     line-height: 1.75; color: var(--qs-muted); }
@media (max-width: 991px) { .qs-highlight-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .qs-highlight-grid { grid-template-columns: 1fr; } }

/* Featured author navy banner. The carousel arrows overlay the banner sides
   (white circles) and the dot row is disabled — with a dozen authors it
   wrapped into a mess. Covers on the right centre themselves vertically;
   with 1-2 books they render larger via --few. */
.qs-author-banner { display: flex; justify-content: space-between; align-items: stretch; gap: 40px;
                    background: var(--qs-navy); border-radius: var(--qs-radius-card);
                    padding: 30px 120px 30px 46px; height: 380px; overflow: hidden; }
.qs-ab-left { display: flex; flex-direction: column; justify-content: center; }
.qs-ab-label { color: rgba(255,255,255,.75); font-size: 14px; font-weight: 600; letter-spacing: .08em;
               text-transform: uppercase; margin-bottom: 22px; }
.qs-ab-main { display: flex; gap: 22px; align-items: flex-start; }
.qs-ab-avatar { width: 104px; height: 104px; border-radius: 50%; object-fit: cover; display: block;
                border: 3px solid rgba(255,255,255,.25); }
.qs-ab-name { display: inline-block; color: #fff; font-size: 30px; font-weight: 800; text-decoration: none;
              line-height: 1.2; margin-bottom: 10px; }
.qs-ab-name:hover { color: #fff; text-decoration: underline; }
.qs-ab-bio { color: rgba(255,255,255,.85); font-size: 15px; line-height: 1.75; max-width: 600px; margin: 0 0 18px;
             display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.qs-ab-actions { display: flex; align-items: center; gap: 18px; }
.qs-ab-quick { color: rgba(255,255,255,.85); text-decoration: underline; font-size: 14px; }
.qs-ab-quick:hover { color: #fff; }
.qs-ab-covers { display: grid; grid-template-columns: repeat(2, 108px); gap: 14px;
                align-content: center; align-self: center; flex-shrink: 0; }
.qs-ab-covers img { width: 108px; height: auto; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 8px; display: block;
                    box-shadow: 0 0 0 1px rgba(255,255,255,.22), 0 0 22px 3px rgba(255,255,255,.26),
                                0 6px 18px rgba(0,0,0,.35); }
.qs-ab-covers--few { grid-template-columns: 150px; }
.qs-ab-covers--few img { width: 150px; }
/* Mobile: the desktop banner is a two-up (person left, shelf right) and simply
   stacking it left three problems — a 70px right padding that only existed to
   clear the desktop arrows, a 104px avatar crowding a 30px name into a narrow
   column, and a fixed 2 x 108px cover grid sitting left-aligned with a gap of
   dead navy beside it. Each is addressed rather than inherited. */
@media (max-width: 900px) {
    .qs-author-banner { flex-direction: column; padding: 26px 22px 28px; height: auto; gap: 24px; }
    .qs-ab-label { margin-bottom: 16px; font-size: 12.5px; }
    .qs-ab-main { gap: 16px; }
    .qs-ab-avatar { width: 72px; height: 72px; border-width: 2px; }
    .qs-ab-name { font-size: 22px; margin-bottom: 8px; }
    .qs-ab-bio { font-size: 14.5px; line-height: 1.7; -webkit-line-clamp: 3; margin-bottom: 14px; }
    /* Covers stretch to the full width in one row, so the shelf reads as a
       shelf instead of a 2x2 block floating against the left edge. */
    .qs-ab-covers { grid-template-columns: repeat(4, 1fr); gap: 10px;
                    align-content: start; align-self: stretch; width: 100%; }
    .qs-ab-covers img { width: 100%; }
    .qs-ab-covers--few { grid-template-columns: repeat(2, 1fr); }
    .qs-ab-covers--few img { width: 100%; }
}
@media (max-width: 520px) {
    /* Below this the avatar and the name cannot share a line without the name
       breaking after one word, so the avatar goes above it. */
    .qs-ab-main { flex-direction: column; align-items: flex-start; gap: 12px; }
    .qs-ab-name { font-size: 20px; }
    .qs-ab-actions { flex-wrap: wrap; gap: 12px; }
    .qs-ab-covers { grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .qs-ab-covers--few { grid-template-columns: repeat(2, 1fr); }
}

/* Author carousel: overlay arrows on the banner, no reserved control strip.
   The theme positions .owl-controls itself, which would trap the absolute
   buttons — neutralise it so they anchor to the carousel (the banner). */
.qs-carousel-author { padding-bottom: 0; }
.qs-carousel-author .owl-controls { position: static !important; margin: 0; height: 0; }
.qs-carousel-author .owl-controls .owl-buttons div.owl-prev,
.qs-carousel-author .owl-controls .owl-buttons div.owl-next {
    position: absolute; bottom: auto; top: 50% !important; margin-top: -20px;
    background: rgba(255,255,255,.92); color: var(--qs-navy); }
.qs-carousel-author .owl-controls .owl-buttons div.owl-prev { left: 22px; }
.qs-carousel-author .owl-controls .owl-buttons div.owl-next { left: auto; right: 22px; }
.qs-carousel-author .owl-controls .owl-buttons div.owl-prev:hover,
.qs-carousel-author .owl-controls .owl-buttons div.owl-next:hover { background: #fff; }
.qs-carousel-author .owl-controls .owl-buttons div.disabled { opacity: 0; }

/* Ad spaces (were sidebar-width; keep them modest now that the store is full-width) */
#ad_space_1, #ad_space_2 { max-width: 360px; margin: 24px auto; text-align: center; }
#ad_space_1 img, #ad_space_2 img { max-width: 100%; height: auto; }

/* Promo banner */
.qs-promo { background: var(--qs-bg-blue); border-radius: var(--qs-radius-card); padding: 44px;
            margin: 52px 0; display: flex; }
.qs-promo-card { background: #fff; border-radius: 10px; padding: 30px 34px; }
.qs-promo-t { font-size: 22px; font-weight: 700; color: var(--qs-ink); margin-bottom: 18px; }

/* ==========================================================================
   Cart + checkout
   ========================================================================== */
.qs-cart-head { margin: 4px 0 22px; }
.qs-cart-count { color: var(--qs-muted); font-size: 15px; margin: 6px 0 0; }
.qs-cart-item { display: flex; align-items: center; gap: 18px; background: #fff;
                border: 1px solid var(--qs-line); border-radius: var(--qs-radius-card);
                padding: 16px 18px; margin-bottom: 14px; }
.qs-cart-cover { flex-shrink: 0; }
.qs-cart-cover img { width: 64px; height: 88px; object-fit: cover; border-radius: 6px; display: block;
                     box-shadow: 0 0 0 1px rgba(14,58,83,.12), 0 4px 10px rgba(14,58,83,.18); }
.qs-cart-info { flex: 1; min-width: 0; }
.qs-cart-title { display: block; font-family: var(--qs-font); font-size: 16.5px; font-weight: 700;
                 color: var(--qs-ink); text-decoration: none; margin-bottom: 6px;
                 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qs-cart-title:hover { color: var(--qs-navy); }
.qs-cart-meta { margin-bottom: 6px; }
.qs-cart-unit { color: var(--qs-muted); font-size: 13.5px; }
.qs-cart-qty { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.qs-qty-btn { width: 30px; height: 30px; border: 1px solid var(--qs-field-border); border-radius: 8px;
              display: flex; align-items: center; justify-content: center; color: var(--qs-navy);
              font-size: 11px; text-decoration: none; background: #fff; }
.qs-qty-btn:hover { border-color: var(--qs-navy); background: var(--qs-bg-blue); color: var(--qs-navy); }
.qs-qty-num { min-width: 34px; text-align: center; font-weight: 700; color: var(--qs-ink); font-size: 15px; }
.qs-cart-line { text-align: right; min-width: 96px; flex-shrink: 0; }
.qs-cart-line-total { font-weight: 800; color: var(--qs-navy); font-size: 16.5px; }
.qs-coupon-off { color: #1f7a4d; font-size: 13px; font-weight: 600; }
.qs-cart-remove { flex-shrink: 0; color: #C25B5B; font-size: 16px; padding: 8px; text-decoration: none; }
.qs-cart-remove:hover { color: #a33f3f; }
.qs-cart-empty { text-align: center; padding: 60px 20px; background: #fff;
                 border: 1px dashed var(--qs-field-border); border-radius: var(--qs-radius-card); }
.qs-cart-empty .fa-shopping-cart { font-size: 44px; color: var(--qs-bg-blue); -webkit-text-stroke: 1px var(--qs-blue); }
.qs-cart-empty h3 { font-family: var(--qs-font); font-weight: 700; color: var(--qs-ink); margin: 16px 0 8px; }
.qs-cart-empty p { color: var(--qs-muted); margin-bottom: 20px; }
.qs-cart-summary h3 { font-family: var(--qs-font); font-size: 19px; font-weight: 700;
                      color: var(--qs-ink); margin: 2px 0 16px; }
.qs-sum-row { display: flex; justify-content: space-between; font-family: var(--qs-font); font-size: 14.5px;
              color: var(--qs-ink-2); padding: 9px 0; border-bottom: 1px solid var(--qs-line); }
.qs-sum-coupon span:last-child { color: #1f7a4d; font-weight: 600; }
.qs-sum-total { border-bottom: 0; padding-top: 14px; font-size: 16px; font-weight: 700; color: var(--qs-ink); }
.qs-sum-total span:last-child { color: var(--qs-navy); font-size: 20px; font-weight: 800; }
.qs-cart-summary .qs-btn--block { margin-top: 14px; }
.qs-cart-continue { display: block; text-align: center; margin-top: 14px; color: var(--qs-blue);
                    font-size: 14px; text-decoration: none; }
.qs-cart-continue:hover { text-decoration: underline; }
@media (max-width: 640px) {
    .qs-cart-item { flex-wrap: wrap; }
    .qs-cart-info { flex-basis: calc(100% - 100px); }
}

/* Checkout: restyle the bootstrap form controls in place (ids/names carry
   the shipping-quote and validation JS — markup must not change shape). */
.qs-checkout-card { padding: 26px 28px; }
.qs-checkout label { font-family: var(--qs-font); font-size: 13.5px; font-weight: 600;
                     color: var(--qs-ink); }
.qs-checkout .form-control { height: auto; padding: 11px 14px; border: 1px solid var(--qs-field-border);
                             border-radius: 8px; box-shadow: none; font-family: var(--qs-font);
                             font-size: 14.5px; color: var(--qs-ink); }
.qs-checkout .form-control:focus { border-color: var(--qs-navy); box-shadow: 0 0 0 3px rgba(14,58,83,.10); }
.qs-checkout .form-group { margin-bottom: 18px; }
.qs-co-sechead { display: flex; align-items: baseline; justify-content: space-between;
                 flex-wrap: wrap; gap: 8px; border-bottom: 1px solid var(--qs-line);
                 padding-bottom: 12px; }
.qs-co-sechead h4 { font-family: var(--qs-font); font-size: 17px; font-weight: 700;
                    color: var(--qs-ink); margin: 0; }
.qs-co-loginhint { font-size: 13.5px; color: var(--qs-muted); }
.qs-co-loginhint a { color: var(--qs-blue); font-weight: 600; }
.qs-pay-options { display: flex; gap: 14px; margin-top: 10px; flex-wrap: wrap; }
.qs-pay-option { flex: 1; min-width: 200px; margin: 0; font-weight: 400; cursor: pointer; }
.qs-pay-option input { position: absolute; opacity: 0; }
.qs-pay-body { display: block; border: 1.5px solid var(--qs-field-border); border-radius: 10px;
               padding: 14px 16px 12px 42px; position: relative; transition: all .12s ease; }
.qs-pay-body i { position: absolute; left: 14px; top: 16px; color: var(--qs-muted); font-size: 16px; }
.qs-pay-t { display: block; font-weight: 700; color: var(--qs-ink); font-size: 14.5px; }
.qs-pay-s { display: block; color: var(--qs-muted); font-size: 12.5px; margin-top: 2px; }
.qs-pay-option input:checked + .qs-pay-body { border-color: var(--qs-navy);
               background: var(--qs-bg-blue); box-shadow: 0 0 0 1px var(--qs-navy) inset; }
.qs-pay-option input:checked + .qs-pay-body i,
.qs-pay-option input:checked + .qs-pay-body .qs-pay-t { color: var(--qs-navy); }
.qs-co-sumhead { display: flex; align-items: baseline; justify-content: space-between; }
.qs-co-edit { color: var(--qs-blue); font-size: 13.5px; text-decoration: none; }
.qs-co-edit:hover { text-decoration: underline; }
.qs-cart-item--sm { padding: 12px 0; border: 0; border-bottom: 1px solid var(--qs-line);
                    border-radius: 0; margin-bottom: 0; }
.qs-cart-item--sm .qs-cart-cover img { width: 46px; height: 64px; }
.qs-cart-item--sm .qs-cart-title { font-size: 14.5px; margin-bottom: 4px; }
.qs-cart-item--sm .qs-cart-line { min-width: 80px; }
.qs-cart-item--sm .qs-cart-line-total { font-size: 15px; }

/* ---- Genre listing page ---- */
.qs-genre-hero { display: flex; align-items: center; justify-content: space-between; gap: 26px;
                 flex-wrap: wrap; background: linear-gradient(115deg, #0A2C40 0%, var(--qs-navy) 45%, #1B5379 100%);
                 border-radius: var(--qs-radius-card); padding: 34px 40px; margin-bottom: 30px; }
.qs-genre-hero-title { font-family: var(--qs-font); color: #fff; font-size: 34px; font-weight: 800 !important;
                       margin: 0 0 8px; text-transform: capitalize; letter-spacing: -0.3px; }
.qs-genre-hero-desc { color: rgba(255,255,255,.82); font-family: var(--qs-font); font-size: 15px;
                      line-height: 1.75; max-width: 680px; margin: 0; }
.qs-genre-hero-count { flex-shrink: 0; background: #fff; color: var(--qs-navy); font-family: var(--qs-font);
                       font-size: 13px; font-weight: 700; line-height: 1; padding: 10px 18px 10px 22px;
                       -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 10px 50%);
                       clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 10px 50%); }
/* 4-up grid for the genre results */
.qs-book-grid--4 { gap: 26px; margin-bottom: 26px; }
.qs-book-grid--4 .qs-book-card { width: calc(25% - 20px); min-width: 150px; }
@media (max-width: 991px) { .qs-book-grid--4 .qs-book-card { width: calc(33.333% - 18px); } }
@media (max-width: 560px) { .qs-book-grid--4 .qs-book-card { width: calc(50% - 13px); } }
/* One-line-and-a-bit description under each card: information scent + real
   indexable text on the listing */
.qs-book-desc { font-size: 13px; color: var(--qs-muted); line-height: 1.6; margin-top: 6px;
                display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Spotlight: one random book from the genre, full-width navy feature */
.qs-spotlight { display: flex; align-items: center; gap: 34px; margin: 6px 0 32px;
                background: linear-gradient(115deg, #0A2C40 0%, var(--qs-navy) 50%, #1B5379 100%);
                border-radius: var(--qs-radius-card); padding: 30px 40px; }
.qs-spot-cover { flex-shrink: 0; display: block; border-radius: 8px;
                 box-shadow: 0 0 0 1px rgba(255,255,255,.25), 0 0 26px 4px rgba(255,255,255,.28),
                             0 12px 28px rgba(0,0,0,.4); }
.qs-spot-cover img { width: 128px; height: 182px; object-fit: cover; border-radius: 8px; display: block; }
.qs-spot-body { min-width: 0; }
.qs-spot-title { font-family: var(--qs-font); color: #fff; font-size: 25px; font-weight: 800 !important;
                 margin: 0 0 4px; line-height: 1.25; text-transform: none; letter-spacing: 0;
                 display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.qs-spot-author { color: rgba(255,255,255,.7); font-family: var(--qs-font); font-size: 14px; margin-bottom: 10px; }
.qs-spot-desc { color: rgba(255,255,255,.85); font-family: var(--qs-font); font-size: 14.5px;
                line-height: 1.75; max-width: 720px; margin: 0 0 16px;
                display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 640px) {
    .qs-spotlight { flex-direction: column; padding: 24px; text-align: center; }
    .qs-spotlight .qs-spot-cover img { margin: 0 auto; }
    .qs-spotlight .qs-btn { width: 100%; justify-content: center; }
}

/* Gold badge for the genre's top-rated books */
.qs-top-badge { position: absolute; top: 10px; left: 10px; background: var(--qs-star); color: #3A2E00;
                font-family: var(--qs-font); font-size: 11.5px; font-weight: 700; line-height: 1;
                padding: 5px 10px; border-radius: 12px; box-shadow: 0 2px 6px rgba(0,0,0,.25); }
.qs-top-badge .fa-star { font-size: 10px; }

/* Reader-review feature panel (alternates with the Spotlight every 8 cards):
   light card so the two panel types read differently at a glance. */
.qs-reviewblock { display: flex; align-items: center; gap: 26px; margin: 6px 0 32px;
                  background: var(--qs-bg-blue); border: 1px solid #D9E6F0;
                  border-radius: var(--qs-radius-card); padding: 28px 36px; }
.qs-rb-quote { flex-shrink: 0; width: 54px; height: 54px; border-radius: 50%; background: #fff;
               color: var(--qs-blue); font-size: 20px; display: flex; align-items: center;
               justify-content: center; box-shadow: 0 3px 10px rgba(14,58,83,.12); }
.qs-rb-body { flex: 1; min-width: 0; }
.qs-rb-stars { font-size: 17px; letter-spacing: 3px; margin-bottom: 8px; display: block; }
.qs-rb-text { font-family: var(--qs-font); font-size: 16px; line-height: 1.75; color: var(--qs-ink);
              font-style: italic; margin: 0 0 10px; max-width: 640px;
              display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.qs-rb-reviewer { font-family: var(--qs-font); font-size: 13.5px; color: var(--qs-muted); }
.qs-rb-book { flex-shrink: 0; display: flex; align-items: center; gap: 14px; text-decoration: none;
              background: #fff; border-radius: 10px; padding: 12px 18px 12px 12px;
              box-shadow: 0 3px 10px rgba(14,58,83,.10); max-width: 300px;
              transition: box-shadow .15s ease, transform .15s ease; }
.qs-rb-book:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(14,58,83,.18); text-decoration: none; }
.qs-rb-book img { width: 52px; height: 74px; object-fit: cover; border-radius: 5px; display: block; }
.qs-rb-bookmeta { min-width: 0; }
.qs-rb-booktitle { display: block; font-family: var(--qs-font); font-size: 14.5px; font-weight: 700;
                   color: var(--qs-ink); line-height: 1.3; margin-bottom: 3px;
                   display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.qs-rb-bookauthor { display: block; font-family: var(--qs-font); font-size: 12.5px; color: var(--qs-muted); margin-bottom: 5px; }
.qs-rb-cta { display: block; font-family: var(--qs-font); font-size: 13px; font-weight: 700; color: var(--qs-blue); }
@media (max-width: 767px) { .qs-reviewblock { flex-direction: column; align-items: flex-start; } }

/* Quote feature panel ("From the Pages") — third member of the every-8-cards
   rotation: navy Spotlight, blue reviewblock, and this white card, so the
   three read differently at a glance. */
.qs-qpanel { position: relative; background: #fff; border: 1px solid var(--qs-line);
             border-radius: var(--qs-radius-card); margin: 6px 0 32px; padding: 0 36px 26px;
             box-shadow: 0 0 0 1px rgba(14,58,83,.04), 0 4px 14px rgba(14,58,83,.08); }
.qs-qpanel-tab { display: inline-block; background: var(--qs-navy); color: #fff;
                 font-family: var(--qs-font); font-size: 11.5px; font-weight: 700;
                 letter-spacing: 2px; text-transform: uppercase; line-height: 1;
                 padding: 8px 22px 8px 16px; margin: 18px 0 0 -36px;
                 clip-path: polygon(0 0, 100% 0, calc(100% - 12px) 50%, 100% 100%, 0 100%); }
.qs-qpanel-body { display: flex; align-items: flex-start; gap: 26px; padding-top: 16px; }
.qs-qpanel-cover { flex-shrink: 0; display: block; }
.qs-qpanel-cover img { width: 84px; height: 120px; object-fit: cover; border-radius: 6px;
                       box-shadow: 0 0 0 1px rgba(14,58,83,.12), 0 4px 10px rgba(14,58,83,.18); }
/* flex: 1 so the column owns the row's remaining width. Without it the column
   shrink-wrapped to the quote's 760px cap and sat against the cover, so an
   RTL quote (dir=rtl on the column, set in quote_widgets.php) had no right
   edge to anchor to — the Urdu floated mid-panel with dead space to its
   right. LTR quotes are unaffected: the capped box anchors left either way. */
.qs-qpanel-main { min-width: 0; flex: 1; }
.qs-qpanel-quote { border: 0; margin: 0 0 10px; padding: 0; font-size: 19px; line-height: 1.7;
                   color: var(--qs-ink); font-family: Georgia, 'Times New Roman', serif;
                   max-width: 760px;
                   display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.qs-qpanel-meta { font-family: var(--qs-font); font-size: 14px; color: var(--qs-ink-2); margin-bottom: 14px; }
.qs-qpanel-meta a { color: var(--qs-navy); font-weight: 600; text-decoration: none; }
.qs-qpanel-meta a:hover { text-decoration: underline; }
.qs-qpanel-theme { display: inline-block; background: var(--qs-bg-blue); color: #38617A !important;
                   font-size: 12px; font-weight: 600; padding: 3px 12px; border-radius: 20px;
                   margin-left: 8px; }
.qs-qpanel-theme:hover { background: var(--qs-navy); color: #fff !important; text-decoration: none; }
@media (max-width: 640px) { .qs-qpanel { padding: 0 24px 22px; }
                            .qs-qpanel-tab { margin-left: -24px; }
                            .qs-qpanel-cover { display: none; } }

/* "Lines Worth Remembering" — bookmark-shaped random-quote cards (store) */
.qs-quotes-band .qs-bmk-row { display: flex; gap: 22px; align-items: stretch; }
.qs-bmk { flex: 1 1 0; min-width: 0; background: var(--qs-bg-blue); padding: 20px 22px 34px;
          clip-path: polygon(0 0, 100% 0, 100% 100%, 50% calc(100% - 18px), 0 100%);
          font-family: var(--qs-font); display: flex; flex-direction: column; }
.qs-bmk-mark { font-family: Georgia, 'Times New Roman', serif; font-size: 44px; line-height: .5;
               color: var(--qs-blue); display: block; margin-bottom: 8px; }
.qs-bmk-quote { border: 0; margin: 0 0 14px; padding: 0; font-size: 15.5px; line-height: 1.7;
                color: var(--qs-ink); font-family: Georgia, 'Times New Roman', serif;
                display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.qs-bmk-meta { margin-top: auto; font-size: 13px; color: #38617A; }
.qs-bmk-meta a { color: var(--qs-navy); font-weight: 600; text-decoration: none; }
.qs-bmk-meta a:hover { text-decoration: underline; }
@media (max-width: 767px) { .qs-quotes-band .qs-bmk-row { flex-direction: column; } }

/* ---- Quotes (public pages + book/author sections) ---- */
.qs-quote-card { position: relative; background: #fff; border: 1px solid var(--qs-line);
                 border-radius: var(--qs-radius-card); padding: 24px 130px 20px 28px;
                 margin-bottom: 18px; font-family: var(--qs-font); }
.qs-quote-text { border: 0; margin: 0 0 14px; padding: 0; font-size: 18px; line-height: 1.75;
                 color: var(--qs-ink); font-family: Georgia, 'Times New Roman', serif; }
.qs-quote-attrib { font-size: 14.5px; color: var(--qs-ink-2); margin-bottom: 10px; }
.qs-quote-attrib a { color: var(--qs-navy); font-weight: 600; text-decoration: none; }
.qs-quote-attrib a:hover { text-decoration: underline; }
.qs-quote-tags .qs-pill { font-size: 12px; padding: 4px 12px; text-decoration: none; margin-right: 4px; }
.qs-quote-tags .qs-pill:hover { background: var(--qs-navy); color: #fff; }
.qs-quote-cover { position: absolute; right: 24px; top: 24px; display: block; }
.qs-quote-cover img { width: 78px; height: 110px; object-fit: cover; border-radius: 6px;
                      box-shadow: 0 0 0 1px rgba(14,58,83,.12), 0 4px 10px rgba(14,58,83,.18); }
.qs-quote-side h3 { font-family: var(--qs-font); font-size: 17px; font-weight: 700;
                    color: var(--qs-ink); margin: 2px 0 14px; }
.qs-quote-theme { display: flex; justify-content: space-between; align-items: center;
                  padding: 8px 10px; border-radius: 8px; text-decoration: none;
                  color: var(--qs-navy); font-family: var(--qs-font); font-size: 14.5px; font-weight: 500; }
.qs-quote-theme:hover { background: var(--qs-bg-blue); text-decoration: none; color: var(--qs-navy); }
.qs-quote-theme.is-active { background: var(--qs-navy); color: #fff; }
.qs-qt-count { font-size: 12.5px; color: var(--qs-muted); }
.qs-quote-theme.is-active .qs-qt-count { color: rgba(255,255,255,.75); }
@media (max-width: 640px) { .qs-quote-card { padding-right: 28px; } .qs-quote-cover { display: none; } }

/* Quotes section on book / author pages */
.qs-bookquotes { margin: 0 0 44px; }
.qs-bq { border-left: 3px solid var(--qs-bg-blue); padding: 4px 0 4px 20px; margin: 18px 0; }
.qs-bq blockquote { border: 0; margin: 0 0 8px; padding: 0; font-size: 16.5px; line-height: 1.8;
                    color: var(--qs-ink); font-family: Georgia, 'Times New Roman', serif; }
.qs-bq-meta { font-family: var(--qs-font); font-size: 13.5px; color: var(--qs-muted); }
.qs-bq-meta a { color: var(--qs-navy); text-decoration: none; }
.qs-bq-meta a:hover { text-decoration: underline; }
.qs-bq-meta .qs-pill { font-size: 11.5px; padding: 3px 10px; margin-left: 6px; text-decoration: none; }
.qs-bq-all { font-family: var(--qs-font); font-size: 14px; font-weight: 600; color: var(--qs-blue);
             text-decoration: none; }
.qs-bq-all:hover { text-decoration: underline; }

/* ---- Author profile page (Figma "Author" frame 956-57748: white intro,
   large rounded photo left; name / @username / About the Author / bio /
   plain social icons right) ---- */
.qs-author-intro { display: flex; align-items: flex-start; gap: 56px; margin: 14px 0 36px; }
.qs-ai-photo { flex-shrink: 0; width: 330px; max-width: 38vw; }
.qs-ai-photo img { width: 100%; height: auto; aspect-ratio: 6 / 7; object-fit: cover; border-radius: 10px; display: block; }
.qs-ai-main { flex: 1; min-width: 0; }
.qs-ai-name { font-family: var(--qs-font); color: var(--qs-ink); font-size: 44px; font-weight: 800 !important;
              margin: 0 0 6px; line-height: 1.15; text-transform: none; letter-spacing: 0; }
.qs-ai-username { font-family: var(--qs-font); font-size: 17px; color: var(--qs-muted); margin-bottom: 12px; }
.qs-ai-meta { font-family: var(--qs-font); font-size: 13.5px; color: var(--qs-muted); margin-bottom: 10px; }
.qs-ai-meta i { margin-right: 5px; }
.qs-ai-meta span { margin-right: 16px; white-space: nowrap; }
.qs-ai-meta a { color: var(--qs-navy); font-weight: 600; text-decoration: none; }
.qs-ai-meta a:hover { text-decoration: underline; }
.qs-ai-rating { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.qs-ai-rating .qs-stars { font-size: 19px; letter-spacing: 3px; color: var(--qs-star); }
/* Publishers carry a verified mark instead of a star rating: a press is not
   scored out of five, and five empty stars read as a bad review of nothing.
   Awarded by us, so it says something a rating cannot. */
.qs-ai-verified { display: inline-flex; align-items: center; gap: 6px; font-family: var(--qs-font);
    font-size: 13.5px; font-weight: 600; color: var(--qs-navy); background: rgba(14,58,83,.07);
    border: 1px solid rgba(14,58,83,.16); border-radius: 999px; padding: 4px 12px; }
.qs-ai-verified i { color: var(--qs-navy); font-size: 14px; }
.qs-ai-followers { font-family: var(--qs-font); font-size: 13.5px; color: var(--qs-muted); }
.qs-ai-badges { display: flex; gap: 8px; margin-bottom: 6px; }
.qs-ai-badges img { width: 40px; height: 40px; }
.qs-ai-abouth { font-family: var(--qs-font); color: var(--qs-ink); font-size: 28px; font-weight: 700 !important;
                margin: 18px 0 12px; text-transform: none; letter-spacing: 0; }
.qs-ai-bio { font-family: var(--qs-font); font-size: 16px; line-height: 1.8; color: var(--qs-ink-2);
             max-width: 760px; margin: 0 0 20px; }
/* EQUAL BOXES, not equal gaps. Each link shrink-wrapped its glyph, and Font
   Awesome marks have very different advance widths -- the Goodreads "g" is
   narrow, facebook-f narrower still, the WordPress mark a wide filled circle.
   A fixed 18px between boxes of different widths is uneven to the eye however
   even it is in the CSS, which is what "not balanced" was. Centring each glyph
   in a square of its own makes the spacing optical rather than arithmetic, and
   gives every icon the same tap target. */
.qs-ai-social { display: flex; align-items: center; gap: 6px; margin-bottom: 20px; }
.qs-ai-social a { color: var(--qs-navy); font-size: 19px; text-decoration: none;
                  font-family: var(--qs-font); font-weight: 700; line-height: 1;
                  display: inline-flex; align-items: center; justify-content: center;
                  width: 36px; height: 36px; border-radius: 8px; }
/* The box is invisible until hover, which is where it earns its keep: a tint
   the size of the target tells you what you are about to click, which a bare
   colour change on a 19px glyph does not. */
.qs-ai-social a:hover { color: var(--qs-blue); background: var(--qs-bg-blue); }
.qs-ai-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.qs-ai-actions .qs-btn { padding: 12px 22px; font-size: 15px; }
@media (max-width: 767px) { .qs-author-intro { flex-direction: column; gap: 24px; }
                            .qs-ai-photo { width: 100%; max-width: 340px; }
                            .qs-ai-name { font-size: 32px; } }

/* Stat cards (as an Author / as an Editor) */
.qs-astat-k { font-family: var(--qs-font); font-size: 13px; font-weight: 700; letter-spacing: 1.5px;
              text-transform: uppercase; color: var(--qs-muted); margin: 0 0 10px; }
.qs-astat-row { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.qs-astat { flex: 1 1 130px; background: #fff; border: 1px solid var(--qs-line); border-radius: 12px;
            padding: 16px 20px; box-shadow: 0 0 0 1px rgba(14,58,83,.04), 0 4px 14px rgba(14,58,83,.08); }
.qs-astat b { display: block; font-family: var(--qs-font); font-size: 24px; font-weight: 800; color: var(--qs-navy); }
.qs-astat span { font-family: var(--qs-font); font-size: 13px; color: var(--qs-muted); }

/* Book sections: centred heading per the Figma ("Books by {name}") */
.qs-ah-sec { margin: 40px 0 10px; }
.qs-ah-sec .qs-sec-head2 { margin-bottom: 24px; }

/* ---- Thank-you / confirmation page ---- */
.qs-ty-icon { width: 74px; height: 74px; border-radius: 50%; background: #E7F4EE; color: #1f7a4d;
              font-size: 32px; line-height: 74px; text-align: center; margin: 10px auto 20px; }
.qs-ty-sub { font-family: var(--qs-font); font-size: 16px; color: var(--qs-ink-2); margin-top: 10px; }
.qs-ty-card { max-width: 620px; margin: 26px auto; text-align: left; padding: 26px 28px;
              font-family: var(--qs-font); font-size: 14.5px; color: var(--qs-ink-2); }
.qs-ty-ordernum { text-align: center; font-size: 20px; color: var(--qs-ink); margin-bottom: 18px; }
.qs-track { text-align: center; background: var(--qs-bg-blue); border: 1px solid #CFE0EC;
            border-radius: 10px; padding: 20px; margin-bottom: 20px; }
.qs-track-l { font-size: 14px; color: var(--qs-ink-2); line-height: 1.7; }
.qs-track-num { font-size: 26px; font-weight: 800; color: var(--qs-navy); letter-spacing: 1px; margin-top: 4px; }
.qs-ty-h { font-family: var(--qs-font); font-size: 15px; font-weight: 700; color: var(--qs-ink);
           margin: 20px 0 6px; }
.qs-ty-total { color: var(--qs-navy); font-weight: 800; }
.qs-ty-note { color: var(--qs-muted); font-size: 13.5px; margin-top: 16px; }
.qs-ty-help { color: var(--qs-ink-2); font-size: 14.5px; }
.qs-ty .detail_bank { margin: 10px 0 4px; line-height: 2; }

/* ---- Out-of-stock / notice ---- */
.qs-notice { border: 1px solid #E6D5B8; background: #FDF8EF; border-radius: var(--qs-radius);
             padding: 12px; text-align: center; color: #7A6A53; font-size: 13px; }

/* ---- Availability status ---- */
.qs-unavailable { color: #7A6A53; }

/* ==========================================================================
   Book / order page — restyle the existing (legacy) elements to the new
   system. This stylesheet currently loads only on book.php, so these are
   safely page-scoped. Markup reflow (buy box beside cover, gallery) comes next.
   ========================================================================== */
.breadcrumb { background: transparent; padding: 10px 0; margin-bottom: 14px; font-size: 14px; }
.breadcrumb > li + li:before { color: #c9c9c9; }
.breadcrumb a { color: var(--qs-muted); }
.breadcrumb .active { color: var(--qs-blue); }

/* !important on every heading weight: legacy style.css sets
   h1..h6 { font-weight:500 !important } and would otherwise win. */
@media (max-width: 560px) {
    /* Figma "Book View Mobile" sizes the title ~28px; 42px ran to three lines
       and dwarfed everything under it on a phone. */
    .book_title { font-size: 28px !important; }
}
.book_title { font-family: var(--qs-font); font-size: 42px; font-weight: 800 !important; color: var(--qs-ink);
              line-height: 1.12; letter-spacing: -0.5px; margin: 14px 0 10px; }
/* Author byline: "by Name" — dark "by", dark underlined name (not blue) */
.col-md-7 h4, h4.qs-pd-by { font-family: var(--qs-font); font-weight: 400; font-size: 18px;
               color: var(--qs-ink-2); text-transform: none; margin: 0 0 16px; }
.col-md-7 h4 a[href], h4.qs-pd-by a[href] { color: var(--qs-ink); text-decoration: underline; font-weight: 500; }
.col-md-7 .co_authors a { color: var(--qs-ink); }

/* Old avg-rating block + social share are replaced/omitted to match the Figma hero */
.col-md-7 .book-rating, .col-md-7 .sharing { display: none; }

/* Cover shown inside a light frame (matches the Figma gallery) — constrained so a
   tall portrait cover doesn't dominate the hero. */
.book-cover-frame { background: var(--qs-bg-blue); border-radius: 12px; padding: 16px;
                    max-width: 360px; margin: 0 auto; }
.book-cover-frame .fotorama__stage { border-radius: 8px; overflow: hidden; }
.fotorama__nav__frame .fotorama__thumb { background: var(--qs-bg-blue); border-radius: 6px; }

/* Section headings (About, Reviews, Videos accordions) */
.panel-title > a { color: var(--qs-ink); font-weight: 700; text-decoration: none; }
.panel-default > .panel-heading { background: transparent; border: 0; padding-left: 0; }
.panel-group .panel { border: 0; box-shadow: none; }

/* Reviews */
.reviews .media { border-top: 1px solid var(--qs-line); padding-top: 16px; }
.reviews .fa-star { color: var(--qs-star); }
.reviews .fa-star-o { color: #DCDCDC; }

/* ==========================================================================
   Global header (Figma): navy announcement bar, white main bar with logo +
   centre search + cart/account, centred nav row. Self-contained qs- classes
   so legacy .navbar styles never touch it.
   ========================================================================== */
.qs-announce { background: var(--qs-navy); color: #fff; font-family: var(--qs-font);
               font-size: 13.5px; text-align: center; padding: 9px 16px; display: block;
               text-decoration: none; }
.qs-announce:hover { color: #fff; text-decoration: underline; }
.qs-header { background: #fff; border-bottom: 1px solid var(--qs-line);
             font-family: var(--qs-font); position: relative; z-index: 999; }
.qs-header-main { max-width: 1170px; margin: 0 auto; padding: 16px 15px;
                  display: flex; align-items: center; gap: 26px; }
/* ---- Password reset (reset-password.php) — the Figma "Check your email"
   card: soft icon disc, big heading, segmented code cells, navy button. ---- */
.qs-reset-wrap { display: flex; justify-content: center; padding: 70px 16px 90px; background: #fff; }
.qs-reset-card { width: 100%; max-width: 460px; text-align: center; }
.qs-reset-ico--ok { background: #ECFDF3; color: #12B76A; }
.qs-reset-ico { width: 64px; height: 64px; margin: 0 auto 22px; border-radius: 50%;
                background: #EBEFFF; color: var(--qs-navy); font-size: 24px;
                display: flex; align-items: center; justify-content: center; }
.qs-reset-card h1 { font-size: 27px; font-weight: 800 !important; color: var(--qs-navy); margin: 0 0 10px; }
.qs-reset-sub { color: #5b6b78; font-size: 15px; line-height: 1.7; margin-bottom: 26px; }
.qs-reset-err { color: #B3122B; font-size: 14px; margin: -8px 0 18px; }
.qs-code-cells { display: flex; justify-content: center; gap: 8px; margin-bottom: 24px; }
.qs-code-cell { width: 44px; height: 54px; text-align: center; font-size: 22px; font-weight: 700;
                color: var(--qs-navy); border: 1.5px solid #cdd7de; border-radius: 10px; background: #fff; }
.qs-code-cell:focus { outline: none; border-color: var(--qs-navy); box-shadow: 0 0 0 3px rgba(14,58,83,.12); }
.qs-code-fallback, .qs-reset-pass { width: 100%; padding: 13px 16px; font-size: 16px; margin-bottom: 20px;
                border: 1.5px solid #cdd7de; border-radius: 10px; }
.qs-code-fallback:focus, .qs-reset-pass:focus { outline: none; border-color: var(--qs-navy);
                box-shadow: 0 0 0 3px rgba(14,58,83,.12); }
.qs-reset-btn { width: 100%; }
.qs-reset-resend { margin: 22px 0 0; font-size: 14px; color: #5b6b78; }
.qs-reset-resend a { color: var(--qs-navy); font-weight: 700; text-decoration: underline; }
.qs-reset-back { display: inline-block; margin-top: 26px; color: #5b6b78; font-size: 14px; font-weight: 600; text-decoration: none; }
.qs-reset-back:hover { color: var(--qs-navy); text-decoration: none; }
@media (max-width: 420px) {
    .qs-code-cells { gap: 5px; }
    .qs-code-cell { width: 38px; height: 48px; font-size: 19px; }
}

.qs-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; flex-shrink: 0; }
/* Figma lockup (owner, 15 Aug 2026): the BARE quill mark beside a large bold
   wordmark, mark slightly taller than the text. daastan-mark.png is the mark
   cropped free of its baked-in caption, so the name appears exactly once. */
.qs-brand img { height: 34px; width: auto; display: block; }
.qs-brand span { font-size: 27px; font-weight: 800; color: var(--qs-navy); letter-spacing: -0.3px; }
.qs-brand:hover { text-decoration: none; }
.qs-search { flex: 1; position: relative; }
.qs-search input { width: 100%; padding: 12px 18px 12px 44px; border: 1.5px solid var(--qs-navy);
                   border-radius: 10px; font-size: 14.5px; color: var(--qs-ink); background: #fff; }
.qs-search input:focus { outline: none; box-shadow: 0 0 0 3px rgba(14,58,83,.12); }
.qs-search .fa-search { position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
                        color: var(--qs-muted); font-size: 15px; pointer-events: none; }
.qs-header-icons { display: flex; align-items: center; gap: 18px; flex-shrink: 0; }
.qs-header-icons > a { color: var(--qs-navy); font-size: 21px; position: relative;
                       text-decoration: none; line-height: 1; }
.qs-header-icons > a:hover { color: var(--qs-blue); }
.qs-cart-badge { position: absolute; top: -8px; right: -10px; background: var(--qs-blue);
                 color: #fff; font-size: 10.5px; font-weight: 700; min-width: 17px; height: 17px;
                 line-height: 17px; text-align: center; border-radius: 9px; padding: 0 4px; }
.qs-header-auth { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.qs-header-auth .qs-login { color: var(--qs-navy); font-size: 14.5px; font-weight: 600;
                            text-decoration: none; }
.qs-header-auth .qs-login:hover { color: var(--qs-blue); }
.qs-header-nav { border-top: 1px solid var(--qs-line); }
.qs-header-nav ul { max-width: 1170px; margin: 0 auto; padding: 0 15px; list-style: none;
                    display: flex; justify-content: center; flex-wrap: wrap; gap: 4px; }
/* Matched to the Figma header component: Dark Blue #094977, 16px/24px, weight
   500. We had 15px/600 in pure black, which is why it read heavier, tighter and
   wrong.
   The colour needs this much selector because css/custom.css:1197 carries
   `.white-header header nav ul li a { color: #000 !important }` — higher
   specificity AND !important, so it beat every simpler rule here. That one line
   is why the header was black no matter what this file said. */
.qs-header-nav a { display: block; padding: 13px 20px; font-size: 16px;
                   font-weight: 500; line-height: 24px; text-decoration: none; }
.white-header header nav.qs-header-nav ul li a,
.qs-header-nav a { color: #094977 !important; }
.white-header header nav.qs-header-nav ul li a:hover,
.qs-header-nav a:hover { color: var(--qs-blue) !important; text-decoration: none; }
.white-header header nav.qs-header-nav ul li a.qs-nav-free,
.qs-header-nav a.qs-nav-free { color: #1f7a4d !important; }
/* ---- Nav dropdowns (Services / Resources, owner 19 Aug 2026) ----
   The menu card copies .qs-citydrop-menu — the design system's one dropdown —
   token for token: white card, #e2e8ee hairline, 10px radius, the navy
   0 8px 26px shadow, 6px inner padding, rounded hover rows. The trigger is a
   <button> dressed exactly as the nav <a>s (16px/24px, 500, #094977) so the
   row reads as one set of links. */
.qs-navdrop { position: relative; }
.qs-navdrop-btn {
    display: block; background: none; border: 0; cursor: pointer;
    padding: 13px 20px; font-family: var(--qs-font);
    font-size: 16px; font-weight: 500; line-height: 24px; color: #094977;
}
.qs-navdrop-btn:hover { color: var(--qs-blue); }
.qs-navdrop-chev { font-size: 11px; margin-left: 5px; transition: transform .15s; }
.qs-navdrop.is-open .qs-navdrop-chev { transform: rotate(180deg); }
/* SCOPED UNDER .qs-header-nav ON PURPOSE: `.qs-header-nav ul` (line ~1022)
   styles EVERY ul in the nav — display:flex, centre, 1170px, 0 15px padding —
   and at (0,1,1) it beat a bare `.qs-navdrop-menu` (0,1,0), which shipped both
   menus permanently open and flex-wrapped into columns (owner screenshot,
   20 Aug 2026). Two classes (0,2,0) win. Every property the parent rule sets
   is re-declared here so none of it leaks into the card. */
.qs-header-nav .qs-navdrop-menu {
    position: absolute; left: 0; top: 100%; z-index: 90;
    min-width: 210px; max-width: none; background: #fff; border: 1px solid #e2e8ee;
    border-radius: 10px; box-shadow: 0 8px 26px rgba(14,58,83,.13);
    padding: 6px; margin: 0; list-style: none;
    display: none; flex-wrap: nowrap; justify-content: flex-start; gap: 0;
}
.qs-header-nav .qs-navdrop.is-open .qs-navdrop-menu { display: block; }
.qs-header-nav .qs-navdrop-menu a {
    display: block; padding: 9px 12px; border-radius: 7px;
    font-size: 14.5px; line-height: 1.4;
}
.qs-header-nav .qs-navdrop-menu a:hover { background: #f4f8fb; color: var(--qs-blue) !important; }

/* ---- MOBILE HEADER + DRAWER (Figma "Header Nav Mobile" + "Mobile Nav") ----
   One row: mark | inline search | burger. Cart/account move into the drawer's
   icon row; the drawer adds a navy Categories accordion of real genres. The
   two .qs-mnav-* <li>s are desktop-hidden here, enabled inside the 991 block. */
.qs-mnav-cats, .qs-mnav-icons { display: none; }
@media (max-width: 991px) {
    /* height:auto beats a LEGACY rule -- style-era CSS pins `header` to 70px
       under 768px, which left the white band ending halfway down the search
       box (owner, 16 Aug 2026: "white bar is half on search bar"). */
    .qs-header { position: relative; height: auto; }
    .qs-header-main { flex-wrap: nowrap; gap: 12px; padding: 12px 15px; }
    .qs-brand span { display: none; }
    .qs-brand img { height: 30px; }
    .qs-header-icons, .qs-header-auth { display: none; }
    .qs-search input { padding: 10px 14px 10px 40px; font-size: 14px; }

    .qs-header-nav.is-open { position: absolute; left: 0; right: 0; top: 100%;
        background: #fff; box-shadow: 0 18px 34px rgba(10,44,64,.18); z-index: 80; }

    .qs-mnav-cats { display: block; }
    .qs-mnav-cats button { width: 100%; display: flex; align-items: center; gap: 10px;
        background: var(--qs-navy); color: #fff; border: 0; padding: 14px 22px;
        font-family: var(--qs-font); font-size: 15px; font-weight: 600; cursor: pointer; }
    .qs-mnav-chev { margin-left: auto; font-size: 12px; transition: transform .18s ease; }
    .qs-mnav-cats.is-open .qs-mnav-chev { transform: rotate(180deg); }
    /* (0,2,0) — a bare .qs-mnav-genres (0,1,0) loses its display:none to
       `.qs-header-nav ul` display:flex (0,1,1), so the genre list rendered
       PRE-EXPANDED in every open drawer since the drawer shipped; the column
       direction from `.qs-header-nav.is-open ul` made it look intended
       (owner screenshot, 20 Aug 2026 — same trap as the nav dropdowns). */
    .qs-header-nav .qs-mnav-genres { display: none; list-style: none; margin: 0; padding: 4px 0 8px;
        background: #F5F8FC; }
    .qs-mnav-cats.is-open .qs-mnav-genres { display: block; }
    .qs-header-nav.is-open ul .qs-mnav-genres li a { border-top: 0; padding: 10px 26px;
        color: var(--qs-blue); font-size: 14.5px; }
    .qs-header-nav.is-open ul .qs-mnav-genres li a.qs-mnav-all { color: var(--qs-navy); font-weight: 700; }

    /* In the drawer a floating card makes no sense: the open menu becomes an
       indented light-blue block, the same treatment as the Categories
       accordion's genre list ("Mobile Nav" -> "Expanded"). */
    .qs-navdrop-btn { width: 100%; text-align: left; display: flex; align-items: center; }
    .qs-navdrop-chev { margin-left: auto; }
    .qs-header-nav .qs-navdrop-menu { position: static; min-width: 0; border: 0; border-radius: 0;
        box-shadow: none; padding: 4px 0 8px; background: #F5F8FC; }
    /* (0,3,3) like the genres-list fix above — the drawer's generic
       `.qs-header-nav.is-open ul li a` (0,2,3) puts a border-top and 12/24
       padding on every drawer link, and a lighter selector loses to it. */
    .qs-header-nav.is-open ul .qs-navdrop-menu li a { border-top: 0; padding: 10px 26px;
        border-radius: 0; color: var(--qs-blue) !important; font-size: 14.5px; }

    .qs-mnav-icons { display: flex; align-items: center; gap: 28px;
        padding: 14px 24px 16px; border-top: 1px solid var(--qs-line); }
    .qs-header-nav.is-open ul li.qs-mnav-icons a { display: inline-flex; padding: 0;
        border-top: 0; color: var(--qs-navy); font-size: 21px; position: relative; }
    .qs-mnav-icons .qs-cart-badge { position: absolute; top: -7px; right: -11px; }
}
@media (max-width: 767px) {
    .qs-header-nav a, .qs-navdrop-btn { padding: 11px 12px; font-size: 14px; }
}

/* The legacy morphsearch overlay collapses to a small corner box — invisible
   until opened now that the header search proxy drives it. (focus() still
   works on an opacity-0 element, display:none would break it.) */
#morphsearch:not(.open) { opacity: 0; pointer-events: none; }
#morphsearch.open { opacity: 1; }

/* ==========================================================================
   Global footer (Figma): navy panel — brand + tagline left, link columns,
   hairline divider, copyright + socials bottom bar.
   ========================================================================== */
/* No top margin. The 70px here used to separate the footer from the white
   WhatsApp pre-footer band; with that band gone it is a strip of page
   background between the last section and the footer, which reads as a gap
   rather than as breathing room. The footer's own padding does the spacing. */
.qs-footer { background: var(--qs-navy); font-family: var(--qs-font); }
.qs-footer-in { max-width: 1170px; margin: 0 auto; padding: 54px 15px 0; }
.qs-footer-cols { display: flex; flex-wrap: wrap; gap: 40px; }
.qs-footer-brand { flex: 1.4; min-width: 220px; }
.qs-footer-brand .qs-fb-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
/* Figma footer lockup: the colored quill inside a WHITE circular badge on the
   navy, beside the white wordmark. Fixed square + object-fit keeps the badge a
   true circle now that the mark is portrait (104x133). */
.qs-footer-brand img { width: 52px; height: 52px; object-fit: contain; background: #fff; border-radius: 50%; padding: 9px; }
.qs-footer-brand .qs-fb-name { color: #fff; font-size: 19px; font-weight: 700; }
.qs-footer-brand p { color: rgba(255,255,255,.75); font-size: 14.5px; line-height: 1.8; max-width: 300px; }
.qs-footer-col { flex: 1; min-width: 150px; }
.qs-footer-col h5 { font-family: var(--qs-font); color: #9fb8ce; font-size: 14px; font-weight: 700 !important;
                    letter-spacing: .02em; text-transform: none; margin: 6px 0 18px; }
/* Second heading inside a column ("By City", "Services", "Legal"). Needs a gap
   above it that the first heading must not have, or the column starts with a
   dead band of space. */
.qs-footer-col .qs-footer-h5b { margin-top: 30px; }
.qs-footer-col a, .qs-footer-col span { display: block; color: rgba(255,255,255,.9); font-size: 14.5px;
                     padding: 6px 0; text-decoration: none; }
.qs-footer-col a:hover { color: #fff; text-decoration: underline; }
.qs-footer-col span { color: rgba(255,255,255,.7); }
.qs-footer-bottom { border-top: 1px solid rgba(255,255,255,.15); margin-top: 44px;
                    padding: 20px 0 24px; display: flex; align-items: center;
                    justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.qs-footer-bottom p { margin: 0; color: rgba(255,255,255,.65); font-size: 13.5px; }
.qs-footer-bottom p a { color: rgba(255,255,255,.85); text-decoration: none; }
.qs-footer-bottom p a:hover { text-decoration: underline; }
/* ---- MOBILE FOOTER (Figma "Footer Mobile"): brand block full-width, the link
   columns as a two-column grid, social + copyright stacked and centred. ---- */
@media (max-width: 767px) {
    .qs-footer-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 22px; }
    /* The desktop columns hold TWO link groups each; on the grid that left tall
       ragged cells. display:contents dissolves the columns so each .qs-fgroup
       (one heading + its links) becomes its own tidy cell, like the Figma. */
    .qs-footer-cols .qs-footer-col { display: contents; }
    .qs-fgroup { min-width: 0; }
    /* The contact block is its own cell here (beside Legal), so it drops the
       hairline separator it needs when stacked inside the desktop column. */
    .qs-footer-contact.qs-fgroup { border-top: 0; padding-top: 0; margin-top: 0; }
    /* h5b's 30px only exists to separate the SECOND group inside a desktop
       column. Here every group is its own cell, so Services/Legal sat 24px
       lower than Company/contact in the same row. 6px = the bare h5 margin. */
    .qs-footer-cols .qs-footer-col .qs-footer-h5b { margin-top: 6px; }
    .qs-footer-brand { grid-column: 1 / -1; min-width: 0; }
    .qs-footer-brand p { max-width: none; }
    .qs-footer-col { min-width: 0; }
    .qs-footer-bottom { flex-direction: column; gap: 14px; text-align: center; }
    .qs-footer-social { display: flex; justify-content: center; gap: 22px; }
    .qs-footer-social a { margin-left: 0; }
}

.qs-footer-social a { color: rgba(255,255,255,.8); font-size: 16px; margin-left: 16px;
                      text-decoration: none; }
.qs-footer-social a:hover { color: #fff; }

/* ---- Auth modals (login / forgot password) + generic modal chrome ---- */
.qs-modal .modal-content { border: 0; border-radius: 14px; font-family: var(--qs-font);
                           box-shadow: 0 18px 50px rgba(14,58,83,.28); }
.qs-modal .modal-header { border: 0; padding: 26px 30px 0; }
.qs-modal .modal-title { font-size: 21px; font-weight: 700 !important; color: var(--qs-ink);
                         text-align: center; text-transform: none; letter-spacing: 0; }
.qs-modal .close { font-size: 26px; opacity: .45; margin-top: -6px; }
.qs-modal .close:hover { opacity: .8; }
.qs-modal .modal-body { padding: 20px 30px 30px; }
.qs-modal .form-control { height: 46px; border-radius: 8px; border: 1px solid #d9dfe4;
                          box-shadow: none; font-size: 14.5px; padding: 0 16px; }
.qs-modal .form-control:focus { border-color: var(--qs-navy); box-shadow: 0 0 0 3px rgba(14,58,83,.12); }
.qs-modal .alert { border-radius: 8px; }
.qs-gbtn { display: flex; align-items: center; justify-content: center; gap: 10px;
           border: 1px solid #d9dfe4; border-radius: 8px; background: #fff; color: #444;
           font-weight: 600; padding: 11px; font-size: 14.5px; text-decoration: none; width: 100%; }
.qs-gbtn:hover { background: #f5f8fa; color: #222; text-decoration: none; }
.qs-gbtn img { height: 20px; width: 20px; }
.qs-or { display: flex; align-items: center; gap: 12px; color: #9aa7b0; font-size: 13px; margin: 18px 0; }
.qs-or:before, .qs-or:after { content: ""; flex: 1; border-top: 1px solid #e8edf1; }
.qs-auth-link { display: block; text-align: center; font-size: 14px; color: var(--qs-muted); margin-top: 14px; }
.qs-auth-link a { color: var(--qs-navy); font-weight: 700; text-decoration: none; }
.qs-auth-link a:hover { text-decoration: underline; }

/* Signup page card */
.qs-auth-card { max-width: 480px; margin: 36px auto 70px; background: #fff;
                border: 1px solid var(--qs-line); border-radius: 14px; padding: 34px 36px;
                font-family: var(--qs-font);
                box-shadow: 0 0 0 1px rgba(14,58,83,.04), 0 4px 14px rgba(14,58,83,.08); }
.qs-auth-card h1 { font-family: var(--qs-font); font-size: 26px; font-weight: 800 !important;
                   color: var(--qs-ink); margin: 0 0 4px; text-align: center;
                   text-transform: none; letter-spacing: 0; }
.qs-auth-sub { text-align: center; color: var(--qs-muted); font-size: 14.5px; margin-bottom: 20px; }
.qs-auth-card .form-control { height: 46px; border-radius: 8px; border: 1px solid #d9dfe4;
                              box-shadow: none; font-size: 14.5px; padding: 0 16px; }
.qs-auth-card .form-control:focus { border-color: var(--qs-navy); box-shadow: 0 0 0 3px rgba(14,58,83,.12); }
.qs-auth-fine { font-size: 12.5px; color: var(--qs-muted); line-height: 1.6; margin: 14px 0 16px; }
.qs-auth-fine a { color: var(--qs-navy); font-weight: 600; }

/* ---- Rate / review page ---- */
.qs-rate-wrap { max-width: 660px; margin: 26px auto 70px; font-family: var(--qs-font); }
.qs-rate-book { display: flex; gap: 18px; align-items: center; background: var(--qs-bg-blue);
                border-radius: 12px; padding: 16px 20px; margin-bottom: 26px; }
.qs-rate-book img { width: 58px; height: 82px; object-fit: cover; border-radius: 6px;
                    box-shadow: 0 0 0 1px rgba(14,58,83,.12), 0 4px 10px rgba(14,58,83,.18); }
.qs-rate-kicker { font-size: 12.5px; font-weight: 700; letter-spacing: 1.5px;
                  text-transform: uppercase; color: #38617A; margin-bottom: 3px; }
.qs-rate-title { font-size: 18px; font-weight: 700; color: var(--qs-ink); line-height: 1.3; }
.qs-rate-h { font-size: 24px; font-weight: 800 !important; color: var(--qs-ink);
             text-align: center; margin: 0 0 6px; text-transform: none; letter-spacing: 0; }
.qs-rate-sub { text-align: center; color: var(--qs-muted); font-size: 14.5px; margin-bottom: 12px; }
.qs-rate-stars { text-align: center; margin: 6px 0 4px; }
.qs-rate-stars .rating-input i, .qs-rate-stars .rating i { color: var(--qs-star); font-size: 34px; margin: 0 3px; }
.qs-survey { background: #fff; border: 1px solid var(--qs-line); border-radius: 12px;
             padding: 22px 26px; margin: 20px 0;
             box-shadow: 0 0 0 1px rgba(14,58,83,.04), 0 4px 14px rgba(14,58,83,.08); }
.qs-survey .form-group { margin-bottom: 20px; }
.qs-survey .form-group:last-child { margin-bottom: 0; }
.qs-survey label { font-weight: 700; color: var(--qs-ink); font-size: 15px; }
.qs-survey .radio { display: flex; align-items: center; gap: 8px; font-size: 14.5px;
                    color: var(--qs-ink-2); margin: 7px 0; }
.qs-survey .radio input { margin: 0 !important; position: static !important; }
.qs-rate-wrap textarea.form-control { border-radius: 10px; border: 1px solid #d9dfe4;
                                      box-shadow: none; font-size: 14.5px; padding: 14px 16px; }
.qs-rate-wrap textarea.form-control:focus { border-color: var(--qs-navy);
                                            box-shadow: 0 0 0 3px rgba(14,58,83,.12); }
.qs-rate-login { text-align: center; background: var(--qs-bg-blue); border: 1px solid #CFE0EC;
                 border-radius: 14px; padding: 40px 30px; }
.qs-rate-login h3 { font-family: var(--qs-font); font-size: 20px; font-weight: 700 !important;
                    color: var(--qs-ink); margin: 0 0 8px; text-transform: none; }
.qs-rate-login p { color: var(--qs-ink-2); font-size: 14.5px; margin-bottom: 18px; }

/* ---- Search overlay (morphsearch reskin; classes/JS untouched) ---- */
.morphsearch { background: var(--qs-bg-blue); border-radius: 10px; }
.morphsearch.open { background: #fff; border-radius: 0; }
.morphsearch-input { font-family: var(--qs-font); color: var(--qs-navy); font-weight: 700; }
.morphsearch.open .morphsearch-input { font-size: 4.5em; color: var(--qs-navy);
                                       border-bottom: 3px solid var(--qs-bg-blue); }
.morphsearch-input::-webkit-input-placeholder { color: #b9c9d4; }
.morphsearch-input::-moz-placeholder { color: #b9c9d4; }
.morphsearch.open .morphsearch-form { max-width: 900px; }
.morphsearch-close::before, .morphsearch-close::after { background: var(--qs-navy); }
.morphsearch-content { background: #fff; font-family: var(--qs-font); }
.morphsearch .dummy-column h2 { font-family: var(--qs-font); font-size: 13px; font-weight: 700 !important;
                                letter-spacing: 2px; text-transform: uppercase; color: var(--qs-muted); }
.morphsearch .dummy-media-object { border-radius: 10px; padding: 8px 10px; background: transparent;
                                   transition: background .15s ease; display: flex; align-items: center; gap: 12px; }
.morphsearch .dummy-media-object:hover { background: var(--qs-bg-blue); }
.morphsearch .dummy-media-object img { border-radius: 8px; object-fit: cover; margin: 0; }
.morphsearch .dummy-media-object img.round { border-radius: 50%; }
.morphsearch .dummy-media-object h3 { font-family: var(--qs-font); font-size: 15px; font-weight: 600;
                                      color: var(--qs-ink); margin: 0; }
@media (max-width: 767px) { .morphsearch.open .morphsearch-input { font-size: 2em; } }

/* ---- Pre-footer: newsletter card + press strip ---- */
.qs-prefooter { padding: 50px 20px 10px; }
.qs-newsletter { max-width: 560px; margin: 0 auto 46px; background: var(--qs-bg-blue);
                 border-radius: 16px; padding: 34px 38px; text-align: center;
                 font-family: var(--qs-font); }
.qs-newsletter h3 { font-family: var(--qs-font); font-size: 22px; font-weight: 800 !important;
                    color: var(--qs-navy); margin: 0 0 8px; text-transform: none; letter-spacing: 0; }
.qs-newsletter p { color: #38617A; font-size: 14.5px; line-height: 1.65; margin: 0 0 18px; }
.qs-newsletter form { display: flex; flex-direction: column; gap: 12px; }
.qs-newsletter input[type="email"] { height: 48px; border-radius: 10px; border: 1px solid #CFE0EC;
                                     background: #fff; padding: 0 18px; font-size: 14.5px;
                                     font-family: var(--qs-font); outline: none; width: 100%; }
.qs-newsletter input[type="email"]:focus { border-color: var(--qs-navy);
                                           box-shadow: 0 0 0 3px rgba(14,58,83,.12); }
.qs-newsletter .qs-btn { width: 100%; }
.qs-press { max-width: 1100px; margin: 0 auto; padding-bottom: 40px; text-align: center; }
.qs-press-label { font-family: var(--qs-font); font-size: 12.5px; font-weight: 700;
                  letter-spacing: 2.5px; text-transform: uppercase; color: var(--qs-muted);
                  margin-bottom: 22px; }
.qs-press-row { display: flex; align-items: center; justify-content: center;
                flex-wrap: wrap; gap: 44px; }
.qs-press-row img { height: 34px; width: auto; max-width: 130px; object-fit: contain;
                    filter: grayscale(1); opacity: .55; transition: all .2s ease; }
.qs-press-row img:hover { filter: none; opacity: 1; }
@media (max-width: 640px) { .qs-newsletter { padding: 26px 22px; }
                            .qs-press-row { gap: 26px; }
                            .qs-press-row img { height: 26px; } }

/* ---- Mobile hamburger nav ---- */
.qs-burger { display: none; background: none; border: 0; padding: 10px; cursor: pointer; }
.qs-burger span { display: block; width: 24px; height: 3px; background: var(--qs-navy);
                  border-radius: 2px; margin: 5px 0; transition: transform .2s ease, opacity .2s ease; }
.qs-burger.is-open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.qs-burger.is-open span:nth-child(2) { opacity: 0; }
.qs-burger.is-open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
@media (max-width: 991px) {
    .qs-burger { display: block; }
    .qs-header-nav { display: none; }
    .qs-header-nav.is-open { display: block; }
    .qs-header-nav.is-open ul { flex-direction: column; align-items: stretch; gap: 0;
                                padding: 6px 0 12px; }
    .qs-header-nav.is-open ul li a { display: block; padding: 12px 24px;
                                     border-top: 1px solid var(--qs-line); }
}

/* ---- WhatsApp band (pre-footer) ---- */
.qs-wa-band { max-width: 760px; margin: 0 auto 46px; background: linear-gradient(115deg, #0A2C40 0%, var(--qs-navy) 45%, #1B5379 100%);
              border-radius: 16px; padding: 30px 34px; text-align: center; font-family: var(--qs-font); }
.qs-wa-band h3 { font-family: var(--qs-font); color: #fff; font-size: 21px; font-weight: 800 !important;
                 margin: 0 0 6px; text-transform: none; letter-spacing: 0; }
.qs-wa-band > p { color: rgba(255,255,255,.75); font-size: 14px; margin: 0 0 20px; }
.qs-wa-cards { display: flex; gap: 16px; justify-content: center; }
.qs-wa-card { flex: 1 1 0; max-width: 300px; background: #fff; border-radius: 12px; padding: 18px 16px;
              text-decoration: none; display: block; transition: transform .15s ease, box-shadow .15s ease; }
.qs-wa-card:hover { transform: translateY(-3px); text-decoration: none;
                    box-shadow: 0 0 26px 4px rgba(255,255,255,.28); }
/* Crop the baked-in caption off the legacy QR images: show just the QR square
   (which sits at ~21% left / ~13% top / ~57.5% wide in the 1080px source). */
.qs-wa-qr { display: block; position: relative; width: 120px; height: 120px; margin: 0 auto 12px;
            overflow: hidden; border-radius: 8px; }
.qs-wa-qr img { position: absolute; width: 174%; left: -37%; top: -22.6%; }
.qs-wa-card b { display: block; color: var(--qs-navy); font-size: 15.5px; font-weight: 700; margin-bottom: 3px; }
.qs-wa-sub { display: block; color: var(--qs-muted); font-size: 12.5px; margin-bottom: 12px; }
.qs-wa-btn { display: inline-flex; align-items: center; gap: 8px; background: #25D366; color: #fff;
             font-size: 13.5px; font-weight: 600; padding: 9px 18px; border-radius: 8px; }
.qs-wa-btn .fa { font-size: 16px; }
.qs-wa-card:hover .qs-wa-btn { background: #1DB954; }
.qs-wa-hint { display: block; color: rgba(255,255,255,.6); font-size: 12px; margin-top: 14px; }
@media (max-width: 640px) { .qs-wa-cards { flex-direction: column; align-items: center; }
                            .qs-wa-card { width: 100%; max-width: 320px; }
                            .qs-wa-qr { display: none; }   /* can't scan your own phone */
                            .qs-wa-hint { display: none; } }

/* ---- Floating WhatsApp chip ---- */
.qs-wa-fab { position: fixed; right: 22px; bottom: 22px; z-index: 9990; font-family: var(--qs-font); }
.qs-wa-toggle { width: 56px; height: 56px; border-radius: 50%; border: 0; background: #25D366; color: #fff;
                font-size: 28px; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,.25);
                display: flex; align-items: center; justify-content: center; transition: transform .15s ease; }
.qs-wa-toggle:hover { transform: scale(1.07); }
.qs-wa-menu { display: none; position: absolute; right: 0; bottom: 68px; width: 230px; background: #fff;
              border: 1px solid var(--qs-line); border-radius: 12px; padding: 12px;
              box-shadow: 0 10px 30px rgba(14,58,83,.22); }
.qs-wa-menu.is-open { display: block; }
.qs-wa-menu b { display: block; color: var(--qs-navy); font-size: 13px; font-weight: 700; margin: 2px 4px 10px; }
.qs-wa-menu a { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 8px;
                color: var(--qs-navy); font-size: 13.5px; font-weight: 600; text-decoration: none; }
.qs-wa-menu a:hover { background: var(--qs-bg-blue); text-decoration: none; }
.qs-wa-menu a .fa { color: #25D366; font-size: 16px; width: 18px; text-align: center; }

/* ---- Thank-you page WhatsApp nudge ---- */
.qs-ty-wa { display: flex; gap: 16px; align-items: center; text-align: left; background: #E9F8EF;
            border: 1px solid #BFE8CD; border-radius: 12px; padding: 16px 18px; margin: 20px 0;
            font-family: var(--qs-font); }
.qs-ty-wa .qs-wa-qr { width: 72px; height: 72px; margin: 0; flex-shrink: 0; }
.qs-ty-wa b { display: block; color: #14532D; font-size: 14.5px; margin-bottom: 3px; }
.qs-ty-wa p { color: #3D6B4F; font-size: 13px; margin: 0 0 10px; line-height: 1.55; }
.qs-ty-wa .qs-wa-btn { padding: 7px 14px; font-size: 12.5px; }
@media (max-width: 480px) { .qs-ty-wa .qs-wa-qr { display: none; } }

/* Newsletter row inside the navy footer (between link columns and bottom bar) */
/* The newsletter now lives INSIDE the brand column, not in a full-width band
   below the links. It kept the old row layout when it moved and the heading
   and paragraph were squeezed into one-word-per-line slivers beside the
   form. Stacked block, full-width field, button beneath. */
.qs-footer-news { display: block; border-top: 1px solid rgba(255,255,255,.14);
                  margin-top: 30px; padding-top: 26px; font-family: var(--qs-font); max-width: 340px; }
.qs-footer-news h5 { font-family: var(--qs-font); color: #fff; font-size: 16px; font-weight: 700 !important;
                     margin: 0 0 5px; text-transform: none; letter-spacing: 0; }
.qs-footer-news p { color: rgba(255,255,255,.65); font-size: 13px; line-height: 1.6; margin: 0 0 14px; max-width: none; }
.qs-footer-news form { display: grid; gap: 10px; }
.qs-footer-news input[type="email"] { width: 100%; height: 44px; border-radius: 9px; border: 0;
                                      background: rgba(255,255,255,.12); color: #fff; padding: 0 16px;
                                      font-size: 14px; font-family: var(--qs-font); outline: none; }
.qs-footer-news input[type="email"]::placeholder { color: rgba(255,255,255,.5); }
.qs-footer-news input[type="email"]:focus { background: rgba(255,255,255,.18);
                                            box-shadow: 0 0 0 2px rgba(255,255,255,.35); }
/* Left-aligned to sit with the heading and the field above it — the button is
   full width, so centred label text drifted away from everything else in the
   column. Centred again on a phone, where the whole block is centred anyway. */
.qs-footer-news button { height: 44px; width: 100%; padding: 0 22px; text-align: left; border: 0; border-radius: 9px;
                         background: #fff; color: var(--qs-navy); font-family: var(--qs-font);
                         font-size: 14px; font-weight: 700; cursor: pointer; }
.qs-footer-news button:hover { background: var(--qs-bg-blue); }
@media (max-width: 767px) {
    /* It is already a stacked block at every width now, so the only thing left
       to do here is let it use the full column. The old rules centred the text
       and un-rowed a form that is no longer a row. */
    .qs-footer-news { max-width: none; }
    .qs-footer-news button { text-align: center; }
}

/* Footer contact icons (phone/email) */
.qs-footer-col a .fa { width: 16px; margin-right: 6px; text-align: center; color: rgba(255,255,255,.6); }

/* Contact line inside the footer newsletter row */
/* Hairline between the blocks inside a footer column — the same rule the brand
   column draws above its newsletter, so the two sides of the footer match.
   On the h5 the padding goes above the text; on the contact block it goes above
   the first row of links. */
.qs-footer-sep { border-top: 1px solid rgba(255,255,255,.14); padding-top: 22px; }
.qs-footer-col .qs-footer-h5b.qs-footer-sep { margin-top: 26px; }

/* The contact details stack rather than sitting in a row: they are the last
   block in the column now, and a phone number wrapping mid-number reads badly. */
.qs-footer-contact { display: flex; flex-direction: column; flex-wrap: wrap;
                     gap: 10px; margin-top: 26px; }
.qs-footer-contact a { color: rgba(255,255,255,.85); font-size: 13.5px; text-decoration: none;
                       white-space: nowrap; }
.qs-footer-contact a:hover { color: #fff; text-decoration: underline; }
.qs-footer-contact a .fa { color: rgba(255,255,255,.6); margin-right: 6px; }
@media (max-width: 767px) {
  .qs-footer-contact { justify-content: center; }
  /* The contact cell is ~161px in the 2-col footer grid; nowrap pushed the
     phone/email/address rows 20px past the viewport on every page. */
  .qs-footer-contact a,
  .qs-footer-contact span { white-space: normal; overflow-wrap: anywhere; font-size: 13px; }
}

/* ---- Rate this book (inline, open to guests) ---- */
.qs-ratebox { background: var(--qs-bg-blue); border: 1px solid #CFE0EC; border-radius: 12px;
              padding: 20px 24px; margin: 0 0 26px; font-family: var(--qs-font); }
.qs-ratebox-head b { display: block; font-size: 16px; font-weight: 700; color: var(--qs-ink); }
.qs-ratebox-head span { font-size: 13px; color: #38617A; }
.qs-starpick { display: flex; align-items: center; gap: 4px; margin: 12px 0 0; }
.qs-starpick-b { background: none; border: 0; padding: 0 2px; cursor: pointer; line-height: 1;
                 font-size: 34px; color: #C9D8E3; transition: color .12s ease, transform .12s ease; }
.qs-starpick-b:hover { transform: scale(1.12); }
.qs-starpick-b.is-on { color: var(--qs-star); }
.qs-starpick-label { margin-left: 12px; font-size: 14px; font-weight: 600; color: var(--qs-navy); }
.qs-ratebox-more { margin-top: 14px; }
.qs-ratebox-more textarea { width: 100%; border: 1px solid #CFE0EC; border-radius: 10px; background: #fff;
                            padding: 12px 14px; font-size: 14.5px; font-family: var(--qs-font);
                            line-height: 1.6; outline: none; resize: vertical; }
.qs-ratebox-more textarea:focus { border-color: var(--qs-navy); box-shadow: 0 0 0 3px rgba(14,58,83,.12); }
.qs-ratebox-note { font-size: 12.5px; color: #38617A; margin: 10px 0 12px; line-height: 1.55; }
.qs-review-done { background: #E9F8EF; border: 1px solid #BFE8CD; border-radius: 10px;
                  padding: 14px 18px; margin: 0 0 24px; font-family: var(--qs-font);
                  font-size: 14.5px; color: #14532D; }
.qs-review-done .fa { color: #1f7a4d; margin-right: 7px; }

/* ---- Book media gallery (3 layouts, one shared lightbox) ---- */
.qs-media { font-family: var(--qs-font); }
.qs-media button { background: none; border: 0; padding: 0; cursor: pointer; }
.qs-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.qs-media-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.qs-media-play .fa { width: 44px; height: 44px; border-radius: 50%; background: rgba(14,58,83,.86);
                     color: #fff; font-size: 16px; display: flex; align-items: center;
                     justify-content: center; padding-left: 3px; }
.qs-media-thumb .qs-media-play .fa, .qs-media-tile .qs-media-play .fa { width: 30px; height: 30px; font-size: 11px; }
.qs-media-meta { font-size: 12.5px; color: var(--qs-muted); margin-top: 10px; text-align: center; }
.qs-media-stage { position: relative; }
.qs-media-main { position: relative; display: block; width: 100%; border-radius: 12px; overflow: hidden;
                 background: var(--qs-bg-blue); aspect-ratio: 3 / 4; }
.qs-media-main img { object-fit: contain; }
.qs-media-count { position: absolute; top: 12px; right: 12px; background: rgba(14,58,83,.85); color: #fff;
                  font-size: 11.5px; padding: 4px 11px; border-radius: 20px; }

/* single / legacy cover */
.qs-media--single .qs-media-main { background: var(--qs-bg-blue); padding: 18px; }

/* rail */
.qs-media-row { display: flex; gap: 14px; align-items: stretch; }
.qs-media-rail { display: flex; flex-direction: column; gap: 9px; flex: none; }
.qs-media-thumbwrap { position: relative; display: block; }
.qs-media-thumb { position: relative; width: 58px; height: 76px; border-radius: 8px; overflow: hidden;
                  background: var(--qs-bg-blue); box-shadow: 0 0 0 1px rgba(14,58,83,.10);
                  transition: box-shadow .15s ease; }
.qs-media-thumb:hover, .qs-media-thumb.is-on { box-shadow: 0 0 0 2px var(--qs-navy); }
.qs-media-morecount { position: absolute; inset: 0; border-radius: 8px;
                      background: rgba(14,58,83,.72); color: #fff; font-size: 13px; font-weight: 700;
                      display: flex; align-items: center; justify-content: center; pointer-events: none; }
.qs-media-row .qs-media-stage { flex: 1; min-width: 0; display: flex; }
.qs-media-row .qs-media-main { aspect-ratio: auto; height: 100%; }

/* story deck */
.qs-media--story .qs-media-story { max-width: 340px; margin: 0 auto; }
.qs-media-bars { display: flex; gap: 4px; margin-bottom: 9px; }
.qs-media-bars span { flex: 1; height: 3px; border-radius: 2px; background: #CFE0EC; }
.qs-media-bars span.is-on { background: var(--qs-navy); }
.qs-media--story .qs-media-main { aspect-ratio: 4 / 5; border-radius: 16px; }
.qs-media-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 32px; height: 32px;
                border-radius: 50%; background: rgba(255,255,255,.92); color: var(--qs-navy);
                display: flex; align-items: center; justify-content: center; font-size: 17px;
                box-shadow: 0 2px 8px rgba(14,58,83,.2); }
.qs-media-prev { left: 8px; } .qs-media-next { right: 8px; }
.qs-media-cap { position: absolute; left: 12px; bottom: 12px; background: rgba(14,58,83,.85); color: #fff;
                font-size: 11.5px; padding: 4px 11px; border-radius: 20px; max-width: 78%;
                overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* mosaic */
.qs-media-mosaic { display: grid; grid-template-columns: 1.5fr 1fr 1fr; grid-auto-rows: 168px; gap: 10px; }
.qs-media-hero { grid-row: span 2; position: relative; border-radius: 12px; overflow: hidden;
                 background: var(--qs-bg-blue); height: 100%; }
.qs-media-hero img { object-fit: contain; }
.qs-media-cell { position: relative; display: block; }
.qs-media-tile { position: relative; display: block; width: 100%; height: 100%; min-height: 88px;
                 border-radius: 10px; overflow: hidden; background: var(--qs-bg-blue);
                 transition: transform .15s ease; }
.qs-media-tile:hover { transform: scale(1.02); }
.qs-media button.qs-media-all { position: absolute; inset: 0; border-radius: 10px; background: rgba(10,32,46,.78);
                color: #fff; font-family: var(--qs-font); display: flex; flex-direction: column;
                align-items: center; justify-content: center; gap: 6px; }
.qs-media button.qs-media-all .fa { font-size: 17px; opacity: .9; }
.qs-media button.qs-media-all b { font-size: 13px; font-weight: 700; }
.qs-media button.qs-media-all:hover { background: rgba(10,32,46,.88); }
@media (max-width: 640px) { .qs-media-mosaic { grid-template-columns: 1fr 1fr; }
                            .qs-media-hero { grid-column: span 2; grid-row: auto; } }

/* shared lightbox */
.qs-lb { position: fixed; inset: 0; z-index: 10000; background: rgba(8,22,32,.94);
         display: flex; align-items: center; justify-content: center; font-family: var(--qs-font); }
.qs-lb[hidden] { display: none; }
.qs-lb-stage { max-width: 88vw; max-height: 82vh; display: flex; align-items: center; justify-content: center; }
.qs-lb-stage img { max-width: 88vw; max-height: 82vh; object-fit: contain; border-radius: 6px; }
.qs-lb-stage iframe { width: min(88vw, 960px); aspect-ratio: 16 / 9; border: 0; border-radius: 8px; }
.qs-lb-x { position: absolute; top: 16px; right: 22px; background: none; border: 0; color: #fff;
           font-size: 34px; line-height: 1; cursor: pointer; opacity: .8; }
.qs-lb-x:hover { opacity: 1; }
.qs-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px;
             border-radius: 50%; border: 0; background: rgba(255,255,255,.14); color: #fff;
             font-size: 24px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.qs-lb-nav:hover { background: rgba(255,255,255,.26); }
.qs-lb-prev { left: 20px; } .qs-lb-next { right: 20px; }
.qs-lb-bar { position: absolute; left: 0; right: 0; bottom: 18px; display: flex; justify-content: center;
             gap: 14px; color: rgba(255,255,255,.8); font-size: 13px; }
@media (max-width: 640px) { .qs-lb-nav { width: 38px; height: 38px; font-size: 20px; }
                            .qs-lb-prev { left: 6px; } .qs-lb-next { right: 6px; } }

/* Videos row under the description (cards feed the shared lightbox) */
.qs-vidrow { display: flex; flex-wrap: wrap; gap: 16px; }
.qs-vidcard { width: 210px; text-align: left; font-family: var(--qs-font); }
.qs-vidcard-thumb { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9;
                    border-radius: 10px; overflow: hidden; background: var(--qs-bg-blue);
                    box-shadow: 0 0 0 1px rgba(14,58,83,.08); transition: transform .15s ease, box-shadow .15s ease; }
.qs-vidcard:hover .qs-vidcard-thumb { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(14,58,83,.18); }
.qs-vidcard-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qs-vidcard-t { display: block; margin-top: 8px; font-size: 13.5px; font-weight: 600; color: var(--qs-ink);
                line-height: 1.4; }
.qs-videos-list { margin: 0 0 40px; }
.qs-yourrating { font-family: var(--qs-font); font-size: 14px; color: var(--qs-muted); }
.qs-yourrating .qs-stars { font-size: 29px; letter-spacing: 4px; line-height: 1; color: var(--qs-star); margin-left: 4px; }

/* ---- Urdu typography ----------------------------------------------------
   Nastaliq is calligraphic and sits on a steep baseline, so anywhere it may
   appear needs extra line-height or the descenders clip. Latin text in these
   same elements is unaffected (Roboto still wins for Latin glyphs). */
.book_title { line-height: 1.5; }
.qs-quote-text, .qs-bmk-quote, .qs-qpanel-quote, .qs-bq blockquote { line-height: 2; }
/* Urdu book titles keep correct RTL character order but stay LEFT-aligned so
   they line up with the LTR buy box / breadcrumb / price beneath them. */
.book_title[dir], .book_title:lang(ur) { text-align: left; }
:lang(ur), [lang="ur"] { line-height: 1.9; }

/* ---- Urdu everywhere -----------------------------------------------------
   Two problems this solves:
   1) Legacy rules say `font-family: Roboto, sans-serif` — Roboto has no Arabic
      glyphs, so Urdu dropped to an ugly system fallback. This broad, LOW
      specificity rule appends real Urdu faces to the stack. Latin is unchanged
      (Roboto still wins for Latin), and legacy Latin styling is untouched
      because Roboto stays first.
   2) Literary text (titles, book names, quotes, headings) should be Nastaliq —
      the calligraphic style Urdu readers expect — so those put Nastaliq first.
      Nastaliq only ships single weights, so never let the browser fake-bold it. */
body, p, div, span, li, td, th, a, button, label, blockquote,
h1, h2, h3, h4, h5, h6, input, textarea, select {
    font-family: "Roboto", "Noto Naskh Arabic", "Qs Naskh Fallback", -apple-system, BlinkMacSystemFont,
                 "Segoe UI", Arial, sans-serif;
}
/* Literary surfaces → Nastaliq first (Latin still falls through to Roboto). */
.book_title, .book_title_roman, .qs-book-name, .qs-genre-hero-title, .qs-section-h,
.qs-quote-text, .qs-bmk-quote, .qs-qpanel-quote, .qs-bq blockquote, .qs-spot-title,
.qs-feat-title, .qs-rate-title, .qs-review-text, .qs-rb-text, .qs-current,
.qs-qp-quote h1,
.qs-ai-name, .qs-vidcard-t, .qs-highlight-title {
    /* Roboto FIRST: it has no Arabic glyphs, so Urdu falls through to Nastaliq
       while Latin stays Roboto (Nastaliq ships its own Latin, which would
       otherwise make English text look inconsistent).
       "Segoe UI"/"Urdu Typesetting" before Arial: if the webfont fails to load,
       Windows still has real Urdu shaping. Arial does not, and dropping
       straight to it is what made the quote page look worse than before the
       fonts were wired up at all. */
    font-family: "Roboto", "Noto Nastaliq Urdu", "Qs Nastaliq Fallback", "Noto Naskh Arabic",
                 "Urdu Typesetting", "Segoe UI", Arial, sans-serif;
}
/* Nastaliq has a steep baseline + tall descenders: give it room, and never
   synthesise bold (it smears the joins). */
.book_title { line-height: 1.55; }
.qs-section-h, .qs-genre-hero-title, .qs-spot-title { line-height: 1.5; }
/* .qs-feat-title needs MORE than the others, not the same.
 *
 * It was in the 1.5 group and is the largest text of the set at 21px, which is
 * the worst pairing for Nastaliq: the script's ink runs to roughly twice its
 * declared size, so at 31.5px of leading a mixed title like "Taleem Aman,
 * Ba-Tareeq Aman / تعلیم امن بطریق امن" painted its Urdu across the Latin line
 * above it.
 *
 * Browser geometry cannot see this -- getClientRects() reports the FONT box, so
 * the lines measured as non-overlapping while visibly colliding. 2.05 is the
 * value already tuned for Nastaliq on the quote cards; same script, same
 * problem, so the same number rather than a fresh guess. */
.qs-feat-title { line-height: 2.05; }
.qs-vidcard-t, .qs-highlight-title, .qs-ai-name { line-height: 1.7; }
.qs-quote-text, .qs-bmk-quote, .qs-qpanel-quote, .qs-bq blockquote,
.qs-review-text, .qs-rb-text { line-height: 2.05; }

/* Nastaliq's glyphs rise well above the Latin cap height, so any element with
   -webkit-line-clamp + overflow:hidden shaved the top off the first line
   (Urdu book titles on the store, Urdu quote cards). Padding sits INSIDE the
   clip box, so a little head room fixes it; em keeps it proportional. */
.qs-book-name, .qs-feat-title, .qs-spot-title, .qs-rb-booktitle, .qs-book-desc,
.qs-bmk-quote, .qs-qpanel-quote, .qs-quote-text, .qs-review-text, .qs-rb-text,
.qs-hero-title, .qs-author-name, .qs-ab-name, .qs-bq blockquote, .qs-vidcard-t,
.qs-qp-quote h1 {
    padding-top: 0.3em;
}

/* Compact tile row — used automatically when a book has only 1–2 gallery items,
   so a single thumbnail never balloons to half the page. */
.qs-media-tiles { display: flex; gap: 12px; flex-wrap: wrap; }
.qs-media-tilebig { position: relative; display: block; width: 232px; aspect-ratio: 4 / 3;
                    border-radius: 12px; overflow: hidden; background: var(--qs-bg-blue);
                    box-shadow: 0 0 0 1px rgba(14,58,83,.08); transition: transform .15s ease, box-shadow .15s ease; }
.qs-media-tilebig:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(14,58,83,.18); }
@media (max-width: 560px) { .qs-media-tilebig { width: 100%; } }

/* Hero star row on the book page, measured against the Figma book frame
   (919-64554): the 5-star row is ~148 design px wide. At 20px/2px it was only
   93px — visibly undersized, which is what the owner kept flagging. */
.qs-hero-stars { font-size: 31px; letter-spacing: 4px; line-height: 1; vertical-align: -3px; }
.qs-hero-stars + .qs-reviews { font-size: 15px; vertical-align: 5px; }

/* "Featured" flag on the book's headline video inside the media gallery. */
.qs-media-featured { position: absolute; top: 8px; left: 8px; background: var(--qs-navy);
                     color: #fff; font-family: var(--qs-font); font-size: 10.5px;
                     font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
                     padding: 3px 9px; border-radius: 20px; }

/* ==========================================================================
   Read-a-Sample  (sample.php + the button on book.php)
   ========================================================================== */

.qs-btn--lg { padding: 18px 34px; font-size: 18px; }

/* The button on the book page. Deliberately quieter than Add to Cart — it is
   the fallback for a reader who is not ready to buy, not a competing CTA. */
.qs-sample-btn { display: flex; align-items: center; justify-content: center; gap: 8px;
                 width: 100%; margin-top: 10px; padding: 13px 16px;
                 background: var(--qs-bg-blue); color: var(--qs-pill-text);
                 border: 1px solid transparent; border-radius: var(--qs-radius);
                 font-family: var(--qs-font); font-size: 14.5px; font-weight: 500;
                 text-align: center; text-decoration: none; transition: background .15s ease; }
.qs-sample-btn:hover, .qs-sample-btn:focus { background: #DCE8F1; color: var(--qs-navy);
                 text-decoration: none; }

/* ---- Sample page header ---- */
.qs-smp-head { display: flex; gap: 28px; align-items: flex-start; margin: 6px 0 26px; }
.qs-smp-cover { flex: 0 0 148px; display: block; border-radius: var(--qs-radius);
                overflow: hidden; box-shadow: 0 4px 18px rgba(14,58,83,.16); }
.qs-smp-cover img { width: 100%; height: auto; display: block; }
.qs-smp-meta { flex: 1 1 auto; min-width: 0; }
.qs-smp-tag { display: inline-flex; align-items: center; gap: 7px; background: var(--qs-bg-blue);
              color: var(--qs-pill-text); font-size: 12.5px; font-weight: 500;
              padding: 5px 13px; border-radius: 20px; }
.qs-smp-meta h1 { font-size: 30px; font-weight: 800 !important; color: var(--qs-ink);
                  line-height: 1.3; margin: 12px 0 4px; padding-top: .12em; }
.qs-smp-meta h1[dir="rtl"] { font-family: var(--qs-font-urdu); line-height: 1.7;
                             padding-top: .3em; }
.qs-smp-by { font-size: 15.5px; color: var(--qs-muted); margin: 0 0 12px; }
.qs-smp-by a { color: var(--qs-blue); text-decoration: none; }
.qs-smp-by a:hover { text-decoration: underline; }
.qs-smp-note { font-size: 14.5px; color: var(--qs-ink-2); line-height: 1.65; margin: 0 0 16px;
               max-width: 56ch; }
.qs-smp-cta { display: flex; gap: 10px; flex-wrap: wrap; }

/* ---- How far in the sample goes ---- */
.qs-smp-progress { height: 6px; background: var(--qs-bg-blue); border-radius: 20px;
                   overflow: hidden; }
.qs-smp-progress span { display: block; height: 100%; background: var(--qs-navy);
                        border-radius: 20px; }
.qs-smp-progress-lbl { font-size: 12.5px; color: var(--qs-muted); margin: 7px 0 22px; }

/* ---- The excerpt itself ---- */
.qs-smp-body { position: relative; max-width: 720px; margin: 0 auto;
               font-family: var(--qs-font); font-size: 17.5px; line-height: 1.85;
               color: var(--qs-ink-2); padding-bottom: 90px; }
.qs-smp-body.is-urdu { font-family: var(--qs-font-urdu); font-size: 19px; line-height: 2.4;
                       text-align: right; }
.qs-smp-body p { margin: 0 0 1.15em; }
.qs-smp-body img { max-width: 100%; height: auto; }
.qs-smp-body table { max-width: 100%; }
.qs-smp-body h1, .qs-smp-body h2, .qs-smp-body h3, .qs-smp-body h4 {
    color: var(--qs-ink); font-weight: 700 !important; line-height: 1.4; margin: 1.6em 0 .6em; }
/* The excerpt stops on a hard cut, so ease the last screen out rather than
   letting the text end abruptly against the paywall card. */
.qs-smp-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 170px;
               pointer-events: none;
               background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, #fff 88%); }

/* ---- Paywall card ---- */
.qs-smp-wall { max-width: 720px; margin: 0 auto 46px; padding: 34px 30px; text-align: center;
               background: var(--qs-bg-blue); border-radius: var(--qs-radius-card); }
.qs-smp-wall-icn { font-size: 30px; color: var(--qs-navy); }
.qs-smp-wall h2 { font-size: 24px; font-weight: 700 !important; color: var(--qs-ink);
                  margin: 12px 0 8px; }
.qs-smp-wall > p { font-size: 15px; color: var(--qs-ink-2); line-height: 1.7; margin: 0 auto 20px;
                   max-width: 46ch; }
/* display:table so the list shrink-wraps its content and still centres via auto
   margins — inline-block would let the buy button flow up alongside it. */
.qs-smp-perks { list-style: none; padding: 0; margin: 0 auto 24px; display: table;
                text-align: left; }
.qs-smp-perks li { font-size: 14.5px; color: var(--qs-pill-text); margin-bottom: 9px; }
.qs-smp-perks li i { color: var(--qs-navy); width: 20px; }
.qs-smp-wall-alt { margin: 16px 0 0; font-size: 14px; }
.qs-smp-wall-alt a { color: var(--qs-blue); text-decoration: underline; }

/* ---- Sticky buy bar ---- */
.qs-smp-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030;
              background: #fff; border-top: 1px solid var(--qs-line);
              box-shadow: 0 -3px 14px rgba(14,58,83,.09);
              padding: 10px 0; transform: translateY(110%); transition: transform .2s ease; }
.qs-smp-bar.is-on { transform: translateY(0); }
.qs-smp-bar .container { display: flex; align-items: center; gap: 16px;
                         justify-content: space-between; }
.qs-smp-bar-t { font-family: var(--qs-font); font-size: 15px; font-weight: 500;
                color: var(--qs-ink); overflow: hidden; text-overflow: ellipsis;
                white-space: nowrap; }

@media (max-width: 767px) {
    .qs-smp-head { flex-direction: column; gap: 18px; }
    .qs-smp-cover { flex: 0 0 auto; width: 128px; }
    .qs-smp-meta h1 { font-size: 24px; }
    .qs-smp-cta .qs-btn { flex: 1 1 100%; }
    .qs-smp-body { font-size: 16.5px; }
    .qs-smp-wall { padding: 26px 18px; }
    .qs-smp-bar-t { max-width: 46%; }
}

/* Bottom breathing room for pages whose last element would otherwise sit flush
   against the footer (the contact form did exactly that). */
.qs-page { padding-bottom: 56px; }

/* ==========================================================================
   Long-form prose — the policy pages.

   These were Word "Save as HTML" dumps: 640 inline font-size declarations
   across terms.php alone, in a mix of 11pt, 12pt and 7pt, which is why the
   page read as several documents stapled together. tools/clean_policy_html.php
   removed every one of them (verifying the text was unchanged first), so the
   type scale below is now the ONLY thing setting size on these pages.

   That is the point: one scale, three levels, no exceptions. Nothing here uses
   !important, because nothing is fighting anything any more.
   ========================================================================== */

/* Reading measure. The 1040 column alone still left these at ~129 characters a
   line; comfortable is 45-75. `ch` rather than px so it holds if type changes. */
.qs-prose { max-width: 68ch; margin-left: auto; margin-right: auto;
            font-size: 16.5px; line-height: 1.75; color: #333; }

/* In CSS, not inline on each page: tools/clean_policy_html.php strips style
   attributes out of the two Word-derived pages, so an inline value here would
   survive on three policy pages and vanish from the other two. */
.qs-prose .qs-breadcrumb { padding: 14px 0 0; }

.qs-prose h2 {
    font-size: 23px;
    font-weight: 700;
    color: #0E3A53;
    margin: 46px 0 14px;
    line-height: 1.3;
}
.qs-prose h2:first-of-type { margin-top: 26px; }

/* Sub-points within a section. Smaller than h2 and set apart by weight rather
   than by another size step, so the hierarchy stays legible at three levels. */
.qs-prose h3 {
    font-size: 17.5px;
    font-weight: 700;
    color: #1a1a1a;
    margin: 30px 0 8px;
    line-height: 1.4;
}

.qs-prose p { margin: 0 0 18px; }

/* The opening paragraph. One size up, in the body colour rather than navy, so
   it reads as a lead rather than as another heading. */
.qs-prose .qs-lede { font-size: 18.5px; line-height: 1.7; color: #4a5b68; margin-bottom: 30px; }

/* The sign-off at the foot of a policy page. Reads like the lede so the page
   opens and closes in the same voice, but it is a separate class because a page
   with two ledes has two openings. */
.qs-prose .qs-prose-close {
    font-size: 17.5px; line-height: 1.7; color: #4a5b68;
    margin-top: 38px; padding-top: 24px; border-top: 1px solid #e6e6e6;
}

.qs-prose ul, .qs-prose ol { margin: 0 0 20px; padding-left: 22px; }
.qs-prose li { margin-bottom: 9px; }
.qs-prose li:last-child { margin-bottom: 0; }
.qs-prose ul ul, .qs-prose ol ol { margin-top: 9px; margin-bottom: 0; }

/* Clause lists on the legal pages — "(i) ... (ii) ... (iii) ...".
   Word exported these as plain paragraphs; tools/policy_lists.php made them
   lists and left the markers in the text, because a clause cited elsewhere as
   "(vii)" has to still read "(vii)". So the bullet is off and the indent is a
   hanging one: the marker sits in the gutter and wrapped lines align under the
   first word rather than under the bracket. */
.qs-prose .qs-legal-list { list-style: none; padding-left: 0; margin: 0 0 22px; }
.qs-prose .qs-legal-list > li {
    padding-left: 2.6em;
    text-indent: -2.6em;
    margin-bottom: 11px;
}

/* A passage the reader must not skim past. Used for the "read these terms
   before using Daastan" opener — the navy rule does the work a bolded
   all-caps paragraph was doing badly. */
.qs-prose blockquote, .qs-prose .qs-callout {
    margin: 26px 0; padding: 16px 20px;
    background: #EAF1F6; border-left: 4px solid #0E3A53; border-radius: 0 8px 8px 0;
    color: #0E3A53; font-size: 16.5px; line-height: 1.7;
}
.qs-prose blockquote p:last-child, .qs-prose .qs-callout p:last-child { margin-bottom: 0; }
.qs-prose blockquote strong, .qs-prose .qs-callout strong { color: #0E3A53; }

/* Bold is for the phrase a skimmer should catch. Near-black rather than navy,
   which was the first attempt: terms.php has 155 bold runs — defined-term
   labels like "Intellectual Property Rights:" — and 155 navy phrases down a
   long page reads as noise competing with the headings. Counted before
   choosing; none of them is a bolded paragraph, so the weight alone is enough
   and the colour is left to carry the hierarchy. */
.qs-prose strong, .qs-prose b { font-weight: 700; color: #1a1a1a; }

.qs-prose a { color: #2F6FA6; text-decoration: underline; text-underline-offset: 2px; }
.qs-prose a:hover { color: #0E3A53; }

.qs-prose table { width: 100%; border-collapse: collapse; margin: 0 0 22px; font-size: 15.5px; }
.qs-prose th, .qs-prose td { border: 1px solid #e6e6e6; padding: 9px 12px; text-align: left; }
.qs-prose th { background: #EAF1F6; color: #0E3A53; font-weight: 700; }

.qs-prose hr { border: 0; border-top: 1px solid #e6e6e6; margin: 34px 0; }

.qs-prose .qs-legal-num { color: #2F6FA6; }

@media (max-width: 767px) {
    .qs-prose { font-size: 16px; }
    .qs-prose h2 { font-size: 20px; margin-top: 36px; }
    .qs-prose h3 { font-size: 16.5px; }
    .qs-prose .qs-lede { font-size: 17px; }
}

/* The bookstore's page title. The design has no headline band, so this is
   deliberately quiet -- it exists because the page had no <h1> at all and the
   first heading a crawler met was a featured book's name. */
.qs-store-h1 {
    font-size: 26px;
    font-weight: 700;
    color: #0E3A53;
    margin: 0 0 18px;
    line-height: 1.2;
}
@media (max-width: 767px) { .qs-store-h1 { font-size: 21px; } }

/* The store <h1> and the city-shelf dropdown share a row. The h1 keeps its own
   bottom margin, so the row zeroes it and carries the spacing itself -- two
   margins here left the button floating below the baseline. */
.qs-store-h1row { display: flex; align-items: center; justify-content: space-between;
                  flex-wrap: wrap; gap: 12px; margin: 0 0 18px; }
.qs-store-h1row .qs-store-h1 { margin: 0; }

.qs-citydrop { position: relative; }
.qs-citydrop-btn {
    background: #fff; border: 1px solid #d7dee5; color: #0E3A53;
    font-family: var(--qs-font); font-size: 14px; font-weight: 600;
    padding: 9px 16px; border-radius: 999px; cursor: pointer;
    display: inline-flex; align-items: center; gap: 8px; line-height: 1;
    transition: border-color .15s, background .15s;
}
.qs-citydrop-btn:hover { border-color: #2F6FA6; background: #f4f8fb; }
.qs-citydrop-btn .fa { transition: transform .15s; }
.qs-citydrop-btn[aria-expanded="true"] { border-color: #2F6FA6; background: #f4f8fb; }
.qs-citydrop-btn[aria-expanded="true"] .fa { transform: rotate(180deg); }

.qs-citydrop-menu {
    position: absolute; right: 0; top: calc(100% + 8px); z-index: 40;
    min-width: 230px; background: #fff; border: 1px solid #e2e8ee;
    border-radius: 10px; box-shadow: 0 8px 26px rgba(14,58,83,.13);
    padding: 6px; display: none;
}
.qs-citydrop-menu.is-open { display: block; }
.qs-citydrop-menu a {
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    padding: 9px 12px; border-radius: 7px; color: #0E3A53;
    font-size: 14.5px; text-decoration: none;
}
.qs-citydrop-menu a:hover { background: #f4f8fb; color: #2F6FA6; text-decoration: none; }
.qs-citydrop-menu a em { font-style: normal; color: #8a97a3; font-size: 12.5px; }

@media (max-width: 767px) {
    .qs-store-h1row { align-items: flex-start; }
    /* Right-anchored on desktop where the button sits at the right edge; on a
       narrow screen the button wraps to the left, so the menu follows it. */
    .qs-citydrop-menu { right: auto; left: 0; }
}

/* The legal pages' own <h1>. The global h1 rule is sized for hero banners and
   rendered "Terms of Use" at ~64px above 15px body copy. */
.qs-prose h1 { font-size: 34px; line-height: 1.15; margin: 0 0 18px; color: #0E3A53; }
@media (max-width: 767px) { .qs-prose h1 { font-size: 26px; } }

/* Word wrote text-align:justify inline on every paragraph, which at a 68ch
   measure with no hyphenation opens rivers of white space down the column. The
   inline styles are gone now (tools/clean_policy_html.php), so this no longer
   needs !important -- it is simply the setting. */
.qs-prose p, .qs-prose li, .qs-prose div { text-align: left; }

/* Sidebar heading on the quotes page. It was an <h3> sitting directly under the
   <h1>, i.e. a skipped level; it is an <h2> now and this keeps it looking the
   same size as before rather than inheriting the larger h2 scale. */
.qs-side-h { font-size: 17px; font-weight: 700; color: #0E3A53; margin: 0 0 12px; }

/* ==========================================================================
   Genre pagination — the crawlable list of every book in a genre.

   Pagination on the genre listing. It replaced a per-visit shuffle capped at
   16 behind a JavaScript "Load More", which left 321 of 669 published books
   with no link pointing at them.
   ========================================================================== */

/* Pager */
.qs-arch-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 34px 0 10px;
}
.qs-arch-num {
    display: inline-block;
    min-width: 36px;
    padding: 7px 10px;
    text-align: center;
    border: 1px solid #d7e0e7;
    border-radius: 6px;
    color: #2F6FA6;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    background: #fff;
}
.qs-arch-num:hover, .qs-arch-num:focus { background: #EAF1F6; color: #0E3A53; text-decoration: none; }
.qs-arch-num.is-current {
    background: #0E3A53;
    border-color: #0E3A53;
    color: #fff;
    cursor: default;
}
.qs-arch-gap { padding: 0 2px; color: #9bacb8; }
.qs-arch-pager .qs-btn { margin: 0 4px; }


/* "You are here" in the Explore-other-genres grid. The current genre is sorted
   last and marked rather than hidden: dropping it would make the grid reflow
   between pages, and the count is still worth showing. */
.qs-genre-banner.is-current { outline: 2px solid #2F6FA6; outline-offset: -2px; opacity: .75; }
.qs-genre-banner.is-current .qs-genre-label { color: #2F6FA6; }

/* ==========================================================================
   "You already started this order" prompt.

   Shown on the book page and in the cart when the buyer has an unpaid order
   for the same book. Amber rather than red: it is not an error, it is a
   shortcut that saves them paying twice.
   ========================================================================== */
.qs-resume-note {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #FDF1E3;
    border: 1px solid #F0D9BC;
    border-radius: 10px;
    padding: 14px 16px;
    margin: 0 0 18px;
}
.qs-resume-ico { font-size: 20px; color: #B4690E; flex: none; }
.qs-resume-body { flex: 1; min-width: 0; }
.qs-resume-body strong { display: block; color: #8A5109; font-size: 14.5px; margin-bottom: 2px; }
.qs-resume-body span { display: block; color: #8A5109; font-size: 13px; opacity: .9; line-height: 1.45; }
.qs-resume-note .qs-btn { flex: none; }
@media (max-width: 600px) {
    .qs-resume-note { flex-wrap: wrap; }
    .qs-resume-note .qs-btn { width: 100%; justify-content: center; }
}

/* --- rate.php: what the stars mean ---------------------------------------- */
/* Stars alone never say which end of the scale is good — a reader can just as
   easily read five as "took the most effort". The chosen rating is spelled out
   in words. All five lines are in the HTML so the meaning is available without
   JavaScript; the script hides all but the selected one. */
.qs-rate-word {
    margin: 6px 0 18px;
    font-size: 14px;
    color: var(--qs-ink-2, #5A7385);
    text-align: center;
    min-height: 21px;
}
.qs-rate-word span { display: block; }
.qs-rate-word.is-set span { font-weight: 600; color: var(--qs-navy, #0E3A53); }

/* --- rate-from-the-hero --------------------------------------------------- */
/* "No ratings yet" was dead text sitting exactly where a rating control
   belongs. Five grey stars that colour under the pointer say the same thing and
   invite the click — the control is the message. The label is not decoration:
   an empty star row on its own reads as a SCORE of zero rather than an
   invitation, which is the opposite of what it is for. */
.qs-hero-rate { display: inline-flex; align-items: center; gap: 10px; }
.qs-hero-rate-stars { display: inline-flex; }
.qs-hero-rate-s {
    font-size: 26px; line-height: 1; text-decoration: none;
    color: #D6DEE4; padding: 0 1px;
    transition: color .1s, transform .1s;
}
.qs-hero-rate-s:hover, .qs-hero-rate-s:focus-visible { transform: scale(1.12); }
/* Hovering a star fills it AND everything before it — a 4-star hover has to
   look like four stars, not one. Done with a sibling selector rather than
   script so it works before any JS runs. */
.qs-hero-rate-stars:hover .qs-hero-rate-s { color: var(--qs-star, #E8A33D); }
.qs-hero-rate-s:hover ~ .qs-hero-rate-s { color: #D6DEE4; }
.qs-hero-rate-label { font-size: 14px; color: var(--qs-muted, #6B7C88); }
.qs-hero-rate-stars:hover + .qs-hero-rate-label { color: var(--qs-navy, #0E3A53); }

/* "Add yours" beside an existing average. */
.qs-rate-inline {
    margin-left: 10px; font-size: 13.5px; font-weight: 600;
    color: var(--qs-blue, #2F6FA6); text-decoration: none;
}
.qs-rate-inline:hover { text-decoration: underline; }

/* Replaces the price on a format the reader already owns. */
.qs-owned {
    display: inline-block; font-size: 20px; font-weight: 700;
    color: #1F8A54;
}

/* ─────────────────────────────────────────────────────────────────────────
   Service pages (/service/book-publishing, -printing, -marketing)

   Magazine layout, not a sidebar. The first version put a navy CTA rail beside
   navy headings — so the button was navy-on-navy and invisible — and left a
   column of dead space beneath it once the copy ran past the rail. The CTA is
   a full-width band now and every white-on-navy control uses .qs-btn--white.
   ───────────────────────────────────────────────────────────────────────── */
/* Full-bleed, like the home page hero — no radius, no side margin, and the
   text held to the container measure by an inner .container rather than by
   padding on the panel itself. */
.qs-svc-hero { background: #0E3A53; background-size: cover;
               background-position: center; padding: 76px 0 96px; margin: 0 0 46px; }
.qs-svc-hero-in { max-width: 620px; }
.qs-svc-eyebrow { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .12em;
                  text-transform: uppercase; color: #9fc6e3; margin-bottom: 14px; }
.qs-svc-hero h1 { font-size: 40px; font-weight: 800; color: #fff; line-height: 1.15; margin: 0 0 16px; }
.qs-svc-hero p  { font-size: 17px; line-height: 1.75; color: rgba(255,255,255,.86); margin: 0 0 26px; }

.qs-svc-block { margin-bottom: 52px; }
.qs-svc-h2 { font-size: 26px; font-weight: 800; color: #0E3A53; margin: 0 0 22px; line-height: 1.25; }

/* Two columns: seven short lines read as a scannable block rather than a long
   ladder down the left edge. */
.qs-svc-list { list-style: none; margin: 0; padding: 0;
               display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px 36px; }
.qs-svc-list li { display: flex; gap: 12px; align-items: flex-start;
                  font-size: 15.5px; line-height: 1.6; color: #40515e; }
.qs-svc-list .fa { color: #1D9E75; font-size: 13px; margin-top: 5px; flex: 0 0 auto; }

.qs-svc-shots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 52px; }
.qs-svc-shots figure { margin: 0; }
.qs-svc-shots img { width: 100%; height: 210px; object-fit: cover; border-radius: 12px; display: block; }
.qs-svc-shots figcaption { font-size: 13.5px; color: #7a8996; margin-top: 9px; line-height: 1.5; }

/* Three across: the process reads as a path rather than a queue. */
.qs-svc-steps { list-style: none; margin: 0; padding: 0;
                display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px 30px; }
.qs-svc-steps li { position: relative; }
.qs-svc-stepn { display: flex; align-items: center; justify-content: center;
                width: 34px; height: 34px; border-radius: 50%; background: #0E3A53; color: #fff;
                font-weight: 800; font-size: 14px; margin-bottom: 12px; }
.qs-svc-steps h3 { font-size: 16.5px; font-weight: 700; color: #0E3A53; margin: 0 0 6px; }
.qs-svc-steps p  { font-size: 14.5px; line-height: 1.7; color: #5a6b78; margin: 0; }

.qs-svc-why { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.qs-svc-wcard { background: #F5F8FA; border-radius: 12px; padding: 24px; }
.qs-svc-wcard h3 { font-size: 17px; font-weight: 700; color: #0E3A53; margin: 0 0 9px; }
.qs-svc-wcard p  { font-size: 14.5px; line-height: 1.7; color: #5a6b78; margin: 0; }

.qs-svc-cta { background: #0E3A53; border-radius: 16px; padding: 38px 44px; margin-bottom: 52px;
              display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 40px; align-items: center; }
.qs-svc-cta h2 { font-size: 26px; font-weight: 800; color: #fff; margin: 0 0 10px; line-height: 1.25; }
.qs-svc-cta p  { font-size: 15.5px; line-height: 1.7; color: rgba(255,255,255,.82); margin: 0; }
.qs-svc-cta-side .qs-btn { width: 100%; text-align: center; }
.qs-svc-contact { margin-top: 20px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.16);
                  display: grid; gap: 9px; }
.qs-svc-contact a, .qs-svc-contact span { color: rgba(255,255,255,.85); font-size: 13.5px;
                  text-decoration: none; display: flex; gap: 9px; align-items: center; }
.qs-svc-contact a:hover { color: #fff; text-decoration: underline; }
.qs-svc-contact .fa { width: 15px; text-align: center; opacity: .7; }

.qs-svc-faq details { border-bottom: 1px solid #e6ebef; }
.qs-svc-faq summary { cursor: pointer; padding: 16px 34px 16px 0; font-size: 16px; font-weight: 600;
                      color: #0E3A53; list-style: none; position: relative; }
.qs-svc-faq summary::-webkit-details-marker { display: none; }
.qs-svc-faq summary::after { content: "\f107"; font-family: FontAwesome; position: absolute;
                             right: 6px; top: 16px; color: #93a3b0; transition: transform .15s; }
.qs-svc-faq details[open] summary::after { transform: rotate(180deg); }
.qs-svc-faq p { font-size: 15px; line-height: 1.75; color: #5a6b78; margin: 0 0 18px; padding-right: 34px; }

.qs-svc-also { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.qs-svc-acard { position: relative; display: block; overflow: hidden; border-radius: 12px;
                padding: 26px; text-decoration: none; background: #0E3A53; min-height: 172px; }
.qs-svc-abg { position: absolute; inset: 0; background-size: cover; background-position: center;
              opacity: .3; transition: opacity .2s, transform .3s; }
.qs-svc-acard > div { position: relative; }
.qs-svc-acard:hover { text-decoration: none; }
.qs-svc-acard:hover .qs-svc-abg { opacity: .42; transform: scale(1.04); }
.qs-svc-acard h3 { font-size: 18px; font-weight: 700; color: #fff; margin: 0 0 8px; }
.qs-svc-acard p  { font-size: 14.5px; line-height: 1.65; color: rgba(255,255,255,.82); margin: 0 0 12px; }
.qs-svc-acard span { font-size: 14px; font-weight: 700; color: #9fc6e3; }

@media (max-width: 900px) {
  .qs-svc-hero { padding: 44px 0 60px; }
  .qs-svc-hero h1 { font-size: 28px; }
  .qs-svc-list, .qs-svc-shots, .qs-svc-steps, .qs-svc-why, .qs-svc-also { grid-template-columns: 1fr; }
  .qs-svc-cta { grid-template-columns: 1fr; padding: 30px 24px; gap: 24px; }
  .qs-svc-shots img { height: 190px; }
}

/* Folder-driven service gallery (marketing posters, author photographs).
   Square-ish tiles so portrait phone shots and square posters sit together
   without one format dictating the row height. */
.qs-svc-note { font-size: 15.5px; line-height: 1.7; color: #5a6b78; margin: -8px 0 22px; max-width: 720px; }
.qs-svc-gal { display: grid; gap: 16px; }
.qs-svc-gal figure { margin: 0; border-radius: 12px; overflow: hidden; background: #EDF1F4; }
/* height:auto is load-bearing. The width/height ATTRIBUTES were added to stop
   layout shift, but a bare height attribute acts as a presentational hint —
   so the tiles rendered 750px and 1000px tall instead of following their
   aspect-ratio. The attributes still give the browser the ratio it needs to
   reserve the box; this stops them dictating the final size. */
.qs-svc-gal img { width: 100%; height: auto; object-fit: cover; display: block;
                  transition: transform .3s; }
.qs-svc-gal figure:hover img { transform: scale(1.04); }
@media (max-width: 520px) { .qs-svc-gal { grid-template-columns: repeat(2, 1fr); gap: 10px; } }
/* Tile shape is per gallery, because the collections are different shapes and
   a single ratio crops one of them badly. Launch photographs are landscape
   group shots and a 4:5 tile beheads them; the campaign posters are 4:5
   portrait and a 3:2 tile cut the titles off their own artwork. */
.qs-svc-gal--wide { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.qs-svc-gal--wide img { aspect-ratio: 3 / 2; }
.qs-svc-gal--tall { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.qs-svc-gal--tall img { aspect-ratio: 4 / 5; }

/* Proof numbers under the service hero — the blue band from the home page.
   Same fill, same 48px figure over a 12px uppercase label, same hairline
   separators. It overlaps the hero by 40px rather than the home page's 79px
   because the service hero is a shorter panel and a deeper bite would eat
   the call-to-action button. */
/* -86px, not -40px: the hero already carries a 46px bottom margin, so a -40px
   pull only closed the gap and left the band sitting 6px BELOW the panel
   instead of biting into it. 46 + 40 = the 40px overlap that was intended. */
.qs-svc-statswrap { position: relative; z-index: 5; margin: -86px 0 46px; padding: 0 15px; }
.qs-svc-stats {
    /* max-width is what makes this read as a card floating ON the hero rather
       than a strip welded to the bottom of it. Without it the band matched the
       hero edge for edge and the two merged into one shape — which is exactly
       how the first attempt looked wrong next to the home page. 944px is the
       home band's width, so the two are the same object on both pages. */
    max-width: 944px; margin: 0 auto;
    background: #2B62B3; border-radius: 8px; padding: 24px 32px;
    display: flex; align-items: center; justify-content: center; gap: 40px;
    box-shadow: 0 8px 26px rgba(11,45,84,.22);
}
.qs-svc-stats-c { flex: 0 0 auto; min-width: 160px; text-align: center; }
.qs-svc-stats-c strong { display: block; white-space: nowrap; font-size: 48px; line-height: 60px;
                         font-weight: 700; letter-spacing: -.02em; color: #fff; }
.qs-svc-stats-c span   { display: block; margin-top: 26px; font-size: 12px; line-height: 1;
                         font-weight: 400; letter-spacing: .04em; text-transform: uppercase; color: #FEFEFE; }
.qs-svc-stats-sep { flex: 0 0 auto; width: 0; height: 68px; border-left: .5px solid #FEFEFE; }

@media (max-width: 991px) {
    .qs-svc-stats { gap: 24px; padding: 22px 20px; }
    .qs-svc-stats-c { flex: 0 0 130px; min-width: 0; }
    .qs-svc-stats-c strong { font-size: 38px; line-height: 46px; }
    .qs-svc-stats-c span { margin-top: 16px; }
}
@media (max-width: 767px) {
    /* Too tight to overlap on a phone, same as the home page band. */
    .qs-svc-statswrap { margin-top: 18px; }
    .qs-svc-stats { flex-wrap: wrap; gap: 22px 0; padding: 22px 12px; }
    /* flex-basis 44%, not 50%. At 375px the content box is 321px and 50% rounds
       up to 161px a cell — two of those are 322px, one pixel over, so all four
       wrapped to a row each. A basis under half with grow lets exactly two sit
       per row and share the remainder evenly. */
    .qs-svc-stats-c { flex: 1 1 44%; max-width: 50%; }
    .qs-svc-stats-c strong { font-size: 30px; line-height: 38px; }
    .qs-svc-stats-c span { margin-top: 8px; font-size: 11px; }
    .qs-svc-stats-sep { display: none; }
}

/* The problem section. Narrower measure and a rule down the left so it reads as
   a held breath before the pitch rather than more of the same. */
.qs-svc-problem { max-width: 760px; border-left: 3px solid #E3B23C; padding-left: 26px; }
.qs-svc-problem p { font-size: 16.5px; line-height: 1.8; color: #40515e; margin: 0 0 16px; }
.qs-svc-problem p:last-child { margin-bottom: 0; }

/* The offer stack: heading per line plus what it means. Two columns, because a
   seven-item ladder down the left edge reads as a list nobody finishes. */
.qs-svc-stack { list-style: none; margin: 0; padding: 0;
                display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 22px 36px; }
.qs-svc-stack li { display: flex; gap: 13px; align-items: flex-start; }
.qs-svc-stack .fa { color: #1D9E75; font-size: 13px; margin-top: 6px; flex: 0 0 auto; }
.qs-svc-stack b { display: block; font-size: 16px; font-weight: 700; color: #0E3A53;
                  line-height: 1.4; margin-bottom: 4px; }
.qs-svc-stack span { display: block; font-size: 14.5px; line-height: 1.7; color: #5a6b78; }

.qs-svc-why--guarantee .qs-svc-wcard { background: #eef8f3; }
.qs-svc-why--guarantee .fa { color: #1D9E75; font-size: 20px; margin-bottom: 10px; display: block; }

@media (max-width: 900px) {
  /* The two .qs-svc-stats rules that lived here were left behind when the
     stats became the blue home-page band: they still set a grid template on
     what is now a flex row, and a 12px column gap that pushed two 50% cells
     over the width so all four stacked one per row. They also targeted <b>,
     which the markup no longer uses. Removed rather than corrected — the
     band carries its own responsive rules further up. */
  .qs-svc-stack { grid-template-columns: 1fr; gap: 18px; }
  .qs-svc-problem { padding-left: 18px; }
  .qs-svc-problem p { font-size: 15.5px; }
}

/* An explicit `cols` on a gallery is a desktop instruction only — below this
   width three portrait tiles would be three slivers, so the responsive rules
   take back over. */
@media (max-width: 700px) {
  .qs-svc-gal[style] { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}

/* Why-card icons. Same weight and rhythm as the guarantee cards above them, so
   the two rows read as one family rather than two different components — the
   only difference is colour, which carries the meaning: green for a promise
   we are making, navy for a statement of fact. */
.qs-svc-wcard > .fa { display: block; font-size: 22px; color: #2F6FA6; margin-bottom: 12px; line-height: 1; }
.qs-svc-why--guarantee .qs-svc-wcard > .fa { color: #1D9E75; font-size: 20px; margin-bottom: 10px; }

/* ============================================================================
   OUR STORY  (/our-story)
   A trust page, so the visual job is different from a sales page: nothing here
   should look designed enough to feel staged. Left-rail timeline rather than
   the usual alternating-sides treatment — with ~28 entries, alternating forces
   the eye across the page 28 times and halves the width available to each card.
   ========================================================================== */

.qs-story-hero { background: #0E3A53; padding: 78px 0 100px; margin: 0 0 46px; color: #fff;
                 background-image: linear-gradient(135deg, rgba(14,58,83,.97), rgba(14,58,83,.82)),
                                   url('../../images/launches/03-author-reading-to-a-full-room.jpg');
                 background-size: cover; background-position: center 32%; }
.qs-story-hero-in { max-width: 760px; }
.qs-story-eyebrow { display: inline-block; font-size: 12px; letter-spacing: .16em;
                    text-transform: uppercase; font-weight: 700; color: #9EC7E8;
                    border: 1px solid rgba(158,199,232,.4); border-radius: 40px;
                    padding: 6px 16px; margin-bottom: 20px; }
.qs-story-hero-in h1 { font-size: 44px; line-height: 1.16; font-weight: 800; color: #fff; margin: 0 0 20px; }
.qs-story-hero-in p { font-size: 18px; line-height: 1.66; color: rgba(255,255,255,.9); margin: 0 0 28px; max-width: 640px; }
.qs-story-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; }

.qs-story-intro { max-width: 780px; margin: 8px 0 54px; }
.qs-story-intro p { font-size: 17px; line-height: 1.75; color: #40515C; margin: 0 0 16px; }

/* --- the rail ------------------------------------------------------------ */
/* Capped and left-aligned, not centred: it has to share a left edge with the
   h2 above it. Without the cap the cards run the full 1074px of the container,
   which is around 150 characters a line — roughly twice a readable measure, on
   the one page where we are asking a sceptic to actually read.
   740px is worked backwards from the text, not picked to look right: minus the
   66px rail and 48px of card padding it leaves a ~626px paragraph, which at
   16px is about 80 characters. */
.qs-tl { position: relative; padding: 8px 0 10px 0; margin: 0 0 60px; max-width: 740px; }
/* The spine. Drawn on the list, not on each item, so it stays unbroken across
   the year markers instead of restarting under every one. */
.qs-tl::before { content: ''; position: absolute; left: 21px; top: 6px; bottom: 6px;
                 width: 2px; background: linear-gradient(180deg, #DCE7F0 0%, #DCE7F0 96%, transparent 100%); }

.qs-tl-year { position: relative; padding: 30px 0 14px 66px; }
.qs-tl-year:first-child { padding-top: 4px; }
.qs-tl-yearlabel { display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: .12em;
                   text-transform: uppercase; color: #0E3A53; background: #EAF1F7;
                   border-radius: 30px; padding: 7px 18px; }

.qs-tl-item { position: relative; padding: 0 0 26px 66px; }
.qs-tl-node { position: absolute; left: 0; top: 2px; width: 44px; height: 44px; border-radius: 50%;
              background: #fff; border: 2px solid #DCE7F0; display: flex; align-items: center;
              justify-content: center; color: #2F6FA6; font-size: 17px; z-index: 2; }
/* Entries flagged 'key' in bin/timeline.php — the handful a sceptical reader
   should not be able to scroll past. Filled node, tinted card, nothing louder. */
.qs-tl-item--key .qs-tl-node { background: #2F6FA6; border-color: #2F6FA6; color: #fff; }
.qs-tl-item--key .qs-tl-card { border-color: #C6DCEE; background: #F7FBFE; }

.qs-tl-card { border: 1px solid #E4EBF1; border-radius: 10px; background: #fff; padding: 20px 24px 18px; }
.qs-tl-date { display: block; font-size: 12px; font-weight: 700; letter-spacing: .08em;
              text-transform: uppercase; color: #7C8B96; margin-bottom: 6px; }
.qs-tl-card h3 { font-size: 20px; font-weight: 800; color: #0E3A53; margin: 0 0 10px; line-height: 1.3; }
.qs-tl-card > p { font-size: 16px; line-height: 1.72; color: #40515C; margin: 0; }
.qs-tl-card em { font-style: italic; }

.qs-tl-figs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.qs-tl-fig { font-size: 13px; font-weight: 700; color: #0E3A53; background: #EAF1F7;
             border-radius: 6px; padding: 6px 12px; }

/* Live counters inside the closing entry. Same idea as the band at the top of
   the page, but inline and quieter — it is evidence here, not a headline. */
.qs-tl-live { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.qs-tl-live > div { flex: 1 1 120px; background: #0E3A53; border-radius: 8px; padding: 14px 16px; }
.qs-tl-live strong { display: block; font-size: 30px; line-height: 1.1; font-weight: 800; color: #fff; }
.qs-tl-live span { display: block; margin-top: 4px; font-size: 12px; line-height: 1.35;
                   text-transform: uppercase; letter-spacing: .05em; color: rgba(255,255,255,.8); }

.qs-tl-fig-img { margin: 18px 0 0; }
/* height:auto is load-bearing. The width/height attributes on the <img> are
   there to reserve space and stop layout shift, but without this the bare
   height attribute acts as a presentational hint and renders the photo at its
   full intrinsic pixel height. */
.qs-tl-fig-img img { width: 100%; height: auto; display: block; border-radius: 8px;
                     aspect-ratio: 3 / 2; object-fit: cover; }
.qs-tl-fig-img figcaption { font-size: 13px; line-height: 1.55; color: #7C8B96; margin-top: 8px; }
/* Book covers: portrait artwork we produced ourselves, so it gets shown whole.
   aspect-ratio has to be cleared explicitly — the rule above sets 3/2, and a
   cover forced into that loses the title off the top. */
.qs-tl-fig-img--cover { display: flex; gap: 16px; align-items: flex-start; }
.qs-tl-fig-img--cover img { aspect-ratio: auto; object-fit: contain; width: auto; max-width: 150px;
                            border: 1px solid #E4EBF1; box-shadow: 0 3px 12px rgba(11,45,84,.12); }
.qs-tl-fig-img--cover figcaption { margin-top: 0; align-self: center; }
@media (max-width: 767px) {
    .qs-tl-fig-img--cover { display: block; }
    .qs-tl-fig-img--cover img { max-width: 120px; }
    .qs-tl-fig-img--cover figcaption { margin-top: 10px; }
}

.qs-tl-src { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px;
             padding-top: 14px; border-top: 1px solid #EEF3F7; }
.qs-tl-src > span { font-size: 11px; font-weight: 700; letter-spacing: .1em;
                    text-transform: uppercase; color: #9AA8B2; }
.qs-tl-src a { font-size: 13px; color: #2F6FA6; text-decoration: none;
               border-bottom: 1px solid rgba(47,111,166,.35); }
.qs-tl-src a:hover { color: #0E3A53; border-bottom-color: #0E3A53; }

/* --- press --------------------------------------------------------------- */
.qs-story-press { margin: 0 0 56px; }
.qs-story-presslist { display: flex; flex-wrap: wrap; gap: 10px; }
.qs-story-presslist a { font-size: 15px; font-weight: 600; color: #0E3A53; background: #fff;
                        border: 1px solid #E4EBF1; border-radius: 8px; padding: 12px 20px;
                        text-decoration: none; }
.qs-story-presslist a:hover { border-color: #2F6FA6; color: #2F6FA6; }
.qs-story-pressnote { font-size: 14px; color: #7C8B96; margin: 14px 0 0; max-width: 640px; }

/* --- close --------------------------------------------------------------- */
.qs-story-cta { background: #0E3A53; border-radius: 12px; padding: 46px 44px; margin: 0 0 56px; }
.qs-story-cta h2 { font-size: 28px; font-weight: 800; color: #fff; margin: 0 0 14px; line-height: 1.25; }
.qs-story-cta p { font-size: 17px; line-height: 1.7; color: rgba(255,255,255,.86); margin: 0 0 26px; max-width: 660px; }
.qs-story-cta-btns { display: flex; flex-wrap: wrap; gap: 12px; }

@media (max-width: 767px) {
    .qs-story-hero { padding: 54px 0 92px; }
    .qs-story-hero-in h1 { font-size: 30px; }
    .qs-story-hero-in p { font-size: 16px; }
    .qs-story-hero-cta .qs-btn, .qs-story-cta-btns .qs-btn { width: 100%; }
    /* Tighten the rail so the cards keep a usable measure on a phone. */
    .qs-tl::before { left: 15px; }
    .qs-tl-year { padding-left: 48px; }
    .qs-tl-item { padding-left: 48px; }
    .qs-tl-node { width: 32px; height: 32px; font-size: 13px; }
    .qs-tl-card { padding: 16px 16px 14px; }
    .qs-tl-card h3 { font-size: 18px; }
    .qs-tl-live > div { flex: 1 1 100%; }
    .qs-story-cta { padding: 32px 22px; }
    .qs-story-cta h2 { font-size: 23px; }
}

/* ==========================================================================
   Service reviews — authors on what it was like to publish with us.
   One card, used by the home page, both calculators and the service pages;
   the data is one table (service_review) behind bin/service_reviews.php.
   ========================================================================== */
.qs-srev { margin: 46px 0 10px; }
.qs-srev-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.qs-srev-card {
    background: #fff; border: 1px solid #e6e6e6; border-radius: 14px;
    padding: 22px 22px 18px; margin: 0;
    display: flex; flex-direction: column;
}
.qs-srev-stars { color: #F4B400; font-size: 13px; letter-spacing: 1px; margin-bottom: 10px; }
.qs-srev-card blockquote {
    margin: 0 0 18px; padding: 0; border: 0;
    font-size: 15.5px; line-height: 1.7; color: #333;
    /* Long Google reviews would otherwise make one card three times the height
       of its neighbours; the link out carries anyone who wants the rest. */
    display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical;
    overflow: hidden;
}
.qs-srev-card figcaption { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.qs-srev-card figcaption img,
.qs-srev-initial {
    width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: 0 0 44px;
}
.qs-srev-initial {
    background: #EAF1F6; color: #0E3A53; font-weight: 700; font-size: 18px;
    display: flex; align-items: center; justify-content: center;
}
.qs-srev-who { display: flex; flex-direction: column; line-height: 1.35; min-width: 0; }
.qs-srev-who strong { color: #0E3A53; font-size: 15px; }
.qs-srev-who em, .qs-srev-who a { font-style: normal; font-size: 13px; color: #7b8794; }
.qs-srev-who a { text-decoration: none; }
.qs-srev-who a:hover { color: #2F6FA6; text-decoration: underline; }
.qs-srev-src {
    margin-top: 14px; padding-top: 12px; border-top: 1px solid #f0f0f0;
    font-size: 12.5px; color: #2F6FA6; text-decoration: none;
    display: flex; justify-content: space-between; gap: 10px;
}
.qs-srev-src:hover { text-decoration: underline; }
.qs-srev-src span { color: #9aa7b2; }

@media (max-width: 991px) { .qs-srev-row { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .qs-srev-row { grid-template-columns: 1fr; } }

/* ==========================================================================
   Quote permalink — /quote/{id}/{slug}
   The quote is the h1 because it is what somebody searched for; everything
   below it exists to stop the page being thin and to sell the book.
   ========================================================================== */
.qs-qp { max-width: 780px; }
/* The quote is the whole reason the page exists, so it gets a panel of its own
   rather than sitting as loose text above a book card. Tinted, not white, so it
   separates from the cards below it and the page has one clear focal point. */
.qs-qp-quote {
    border: 0; margin: 22px 0 30px; padding: 34px 38px 28px;
    background: linear-gradient(180deg, #F4F9FC 0%, #FFFFFF 100%);
    border: 1px solid #E1EAF1; border-radius: 18px;
}
.qs-qp-quote h1 {
    font-size: 31px; line-height: 1.6; font-weight: 400 !important; color: #0E3A53;
    margin: 0 0 18px; position: relative; padding-left: 30px;
}
.qs-qp-quote h1::before {
    content: '\201C'; position: absolute; left: -6px; top: 4px;
    font-size: 68px; line-height: 1; color: #C3D8E6;
}
.qs-qp-quote cite { font-style: normal; font-size: 15.5px; color: #4a5b68; padding-left: 30px; display: block; }
.qs-qp-quote cite a { color: #2F6FA6; text-decoration: none; }
.qs-qp-quote cite a:hover { text-decoration: underline; }
.qs-qp-share { display: flex; gap: 10px; flex-wrap: wrap; margin: 18px 0 0 30px; }
.qs-qp-btn {
    display: inline-flex; align-items: center; gap: 7px;
    border: 1px solid #d7dee5; background: #fff; color: #0E3A53;
    border-radius: 999px; padding: 7px 15px; font-size: 13.5px; font-weight: 500;
    cursor: pointer; text-decoration: none; font-family: inherit;
}
.qs-qp-btn:hover { border-color: #2F6FA6; background: #f4f8fb; color: #0E3A53; text-decoration: none; }
.qs-qp-btn--wa:hover { border-color: #25D366; color: #128C7E; }

/* The book is the commercial point of the page, so it reads as a product card
   with a lifted cover rather than a bordered box. */
.qs-qp-book { display: flex; gap: 24px; padding: 24px; border: 1px solid #E4EBF0;
              border-radius: 14px; background: #fff; margin-bottom: 30px;
              box-shadow: 0 2px 10px rgba(14,58,83,.05); }
.qs-qp-cover { flex: 0 0 120px; }
.qs-qp-cover img { width: 120px; height: auto; border-radius: 8px;
                   box-shadow: 0 6px 20px rgba(14,58,83,.20); transition: transform .18s ease; }
.qs-qp-cover:hover img { transform: translateY(-3px) scale(1.02); }
.qs-qp-bookmeta h2 { font-size: 20px; margin: 0 0 4px; color: #0E3A53; }
.qs-qp-bookmeta h2 a { color: inherit; text-decoration: none; }
.qs-qp-by { margin: 0 0 4px; font-size: 14.5px; color: #4a5b68; }
.qs-qp-spec { font-size: 13px; color: #8a97a3; margin: 0 0 14px; }
.qs-qp-buy { display: flex; gap: 10px; flex-wrap: wrap; }

.qs-qp-themes { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 30px; }
.qs-qp-themes span { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: #8a97a3; }
.qs-qp-themes a { background: #EAF1F6; color: #38617A; border-radius: 999px;
                  padding: 5px 14px; font-size: 13.5px; text-decoration: none; }
.qs-qp-themes a:hover { background: #d8e6f0; color: #0E3A53; text-decoration: none; }

/* ---- Urdu -----------------------------------------------------------------
   Direction lives on the TEXT, never on <html>: dir="rtl" on the document
   reversed the footer, the header and every English string on the page.

   NO BLANKET LINE-HEIGHT. This was `[lang="ur"], [dir="rtl"] { line-height:
   2.15 }`, which is right for a paragraph of Nastaliq and wrong for everything
   else that happens to be marked Urdu. It hit the language pills, the theme
   column headers and the chips — small two-line controls where extra leading
   is not leading, it is misalignment, and it put "English" 10px above اردو
   beside it in an equal-height box. Three separate visual bugs, one rule.

   Urdu prose already gets 1.9 from the :lang(ur) rule further up this file,
   and the surfaces that genuinely need more than that ask for it by name
   below. A control should never pick up prose leading just for being Urdu. */
.qs-qp-quote.is-rtl h1 { padding-left: 0; padding-right: 30px; line-height: 1.95; }
.qs-qp-quote.is-rtl h1::before { left: auto; right: -4px; content: '\201D'; }
.qs-qp-quote.is-rtl cite,
.qs-qp-quote.is-rtl .qs-qp-share { padding-left: 0; padding-right: 30px; margin-left: 0; }

@media (max-width: 640px) {
    .qs-qp-quote h1 { font-size: 23px; }
    .qs-qp-book { flex-direction: column; }
    .qs-qp-grid { grid-template-columns: 1fr; }
    .qs-qp-author { flex-direction: column; }
}

/* ---- Quote hub sidebar: language pills + per-theme dual counts -------------
   Each count is its own link (EN column, Urdu column), so one row offers the
   theme in either language and a click is never ambiguous. A count below the
   50-quote hub minimum renders as .is-thin — visible, greyed, not a link — so
   the reader watches the corpus grow without being sent to a thin page and we
   never hide a whole row to enforce the rule. */
.qs-qlang-switch { display: flex; gap: 8px; margin-bottom: 14px; }
.qs-qlang { flex: 1; text-align: center; padding: 9px 6px; border-radius: 8px;
            border: 1px solid var(--qs-line, #dfe6ec); color: var(--qs-navy, #0E3A53);
            font-weight: 600; font-size: 14px; text-decoration: none; }
.qs-qlang span { display: block; font-weight: 400; font-size: 12px; opacity: .65; }
.qs-qlang:hover { background: var(--qs-bg-blue, #eef4f8); text-decoration: none;
                  color: var(--qs-navy, #0E3A53); }
.qs-qlang.is-active { background: var(--qs-navy, #0E3A53); color: #fff; border-color: var(--qs-navy, #0E3A53); }
.qs-qlang.is-active span { opacity: .8; }

.qs-qt-head { display: grid; grid-template-columns: 1fr 46px 46px; gap: 4px;
              padding: 0 10px 6px; font-size: 11px; letter-spacing: .06em;
              text-transform: uppercase; opacity: .55; }
.qs-qt-head span:not(:first-child) { text-align: center; }
.qs-qt-row { display: grid; grid-template-columns: 1fr 46px 46px; gap: 4px;
             align-items: center; padding: 7px 10px; border-radius: 8px; }
.qs-qt-row:hover { background: var(--qs-bg-blue, #eef4f8); }
.qs-qt-row.is-active { background: var(--qs-bg-blue, #eef4f8); font-weight: 600; }
.qs-qt-label { font-size: 14px; color: var(--qs-navy, #0E3A53); }
.qs-qt-n { display: block; text-align: center; font-size: 13px; padding: 3px 0;
           border-radius: 6px; color: var(--qs-navy, #0E3A53); text-decoration: none; }
a.qs-qt-n:hover { background: var(--qs-navy, #0E3A53); color: #fff; text-decoration: none; }
.qs-qt-n.is-here { background: var(--qs-navy, #0E3A53); color: #fff; }
/* Not yet a page: shown so the number is visible, unlinked so it is not a door. */
.qs-qt-n.is-thin { opacity: .38; cursor: default; }

/* The hub listing links each quote to its own permalink. */
.qs-quote-text a { color: inherit; text-decoration: none; }
.qs-quote-text a:hover { color: var(--qs-navy, #0E3A53); text-decoration: underline; }

/* The author block ends on a button, so it needs breathing room above it. */
.qs-qp-author .qs-btn { margin-top: 10px; }



/* ---- Urdu sizing ----------------------------------------------------------
   Nastaliq sits on a steep diagonal baseline and its descenders run far below
   it, so the leading that suits Latin makes lines collide. It also renders
   optically smaller than Latin at the same px, hence the size bump. Applied by
   :lang so English on the same page is untouched. */
.qs-qp-quote h1:lang(ur) { font-size: 30px; line-height: 2.35; padding-top: .35em; }
.qs-genre-hero-title:lang(ur) { line-height: 1.9; padding-top: .3em; }
@media (max-width: 640px) { .qs-qp-quote h1:lang(ur) { font-size: 23px; line-height: 2.2; } }

/* ---- Browse by theme (chips, grouped by language) -------------------------
   Foot of every quote page and the hub sidebar, from one component. On the leaf
   pages this is the link network that feeds the hubs.
   Chips rather than a two-column table: with a balanced corpus every table row
   read "50  50", which looked like a spreadsheet and labelled neither number
   near itself. Saying the language once, as a group heading, lets each chip be
   one unambiguous door — and lets the Urdu group carry Urdu labels. */
.qs-qtb { display: block; border: 1px solid #E4EBF0; border-radius: 14px;
          padding: 22px 24px; background: #fff; margin-bottom: 42px; }
.qs-qtb-h { font-size: 13px; letter-spacing: .09em; text-transform: uppercase;
            color: #92A4B2; margin: 0 0 18px; font-weight: 600; }
.qs-qtb-group + .qs-qtb-group { margin-top: 18px; padding-top: 18px; border-top: 1px solid #EFF4F7; }
.qs-qtb-lang { display: block; font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase;
               color: #B3C0CB; margin-bottom: 10px; font-weight: 600; }
.qs-qtb-group.is-ur .qs-qtb-lang { letter-spacing: normal; font-size: 14px; }
.qs-qtb-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.qs-qtb-chip {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--qs-bg-blue); color: var(--qs-pill-text);
    border: 1px solid transparent; border-radius: 999px;
    padding: 7px 8px 7px 15px; font-size: 14px; line-height: 1.2; text-decoration: none;
    transition: background .14s ease, color .14s ease, transform .14s ease;
}
.qs-qtb-chip b {
    font-weight: 600; font-size: 11.5px; background: rgba(255,255,255,.78);
    color: #56728A; border-radius: 999px; padding: 3px 8px; min-width: 26px; text-align: center;
}
.qs-qtb-chip:hover { background: var(--qs-navy); color: #fff; text-decoration: none; transform: translateY(-1px); }
.qs-qtb-chip:hover b { background: rgba(255,255,255,.18); color: #fff; }
.qs-qtb-chip.is-here { background: var(--qs-navy); color: #fff; }
.qs-qtb-chip.is-here b { background: rgba(255,255,255,.18); color: #fff; }
/* The Urdu group reads right-to-left, so it starts at the right edge and its
   rows fill leftwards — the same way the Urdu quotes above it do. `direction`
   rather than justify-content: it also puts the word before its count in
   reading order and wraps the rows from the correct side, which flex alignment
   alone would not. The section heading stays LTR; only the Urdu group turns. */
.qs-qtb-group.is-ur { direction: rtl; }
.qs-qtb-chip[dir="rtl"] { padding: 7px 15px 7px 8px; }
.qs-qtb--side .qs-qtb-chips { gap: 6px; }
.qs-qp-quote { margin-bottom: 48px; }
.qs-qp-book  { margin-bottom: 80px; }
.qs-qp-themes { margin-bottom: 80px; }
.qs-qp-quote { padding: 32px; background: linear-gradient(180deg, #F4F9FC 0%, #FEFEFE 100%); }
.qs-qp-book, .qs-qtb { padding: 16px; background: #FEFEFE; }
.qs-qp-grid  { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; align-items: stretch; }
.qs-qp-book  { gap: 24px; }

/* Section title w SeeAll Btn — the system has this as one component: a centred
   heading with See All on the right of the same line. Mine was small caps with
   a fading rule, and the See All was a separate link bolted underneath, which
   is why the headings read as decoration instead of structure. */
.qs-sect-head { position: relative; display: flex; align-items: baseline;
                justify-content: center; margin-bottom: 24px; }
.qs-sect-head h2 { font-size: 24px; font-weight: 600; color: var(--qs-ink);
                   margin: 0; text-align: center; line-height: 1.4; }
.qs-sect-all { position: absolute; right: 0; bottom: 2px; white-space: nowrap;
               font-size: 14px; font-weight: 500; color: var(--qs-blue); text-decoration: none; }
.qs-sect-all:hover { color: var(--qs-navy); text-decoration: none; }
.qs-sect-all i { margin-left: 6px; font-size: 12px; }
@media (max-width: 640px) {
    .qs-sect-head { flex-direction: column; align-items: flex-start; gap: 6px; }
    .qs-sect-head h2 { text-align: left; font-size: 20px; }
    .qs-sect-all { position: static; }
}
@media (max-width: 640px) {
}

/* Badge at the system's 28px. */
.qs-qtb-chip { min-height: 28px; }

/* ---- Tag Btn ---------------------------------------------------------------
   The system's tag is an outline navy pill by default and a filled navy pill
   when active. Mine were a pale blue fill with muted text, which reads as
   decoration rather than a control. */
.qs-qtb-chip { background: transparent; color: var(--qs-navy);
               border: 1px solid rgba(14,58,83,.28); }
.qs-qtb-chip b { background: rgba(14,58,83,.07); color: var(--qs-navy); opacity: .75; }
.qs-qtb-chip:hover { background: var(--qs-navy); color: #fff; border-color: var(--qs-navy); }
.qs-qtb-chip.is-here { background: var(--qs-navy); color: #fff; border-color: var(--qs-navy); }
.qs-qtb-chip:hover b, .qs-qtb-chip.is-here b { background: rgba(255,255,255,.18); color: #fff; opacity: 1; }

/* ---- Hero on Featured Books Card -------------------------------------------
   Dark panel, cover on the left, the quote as the body, attribution italic,
   white CTA. The pale panel I had gave the page no anchor and left the cover
   out of the one block a reader actually looks at. */
.qs-qp-quote { background: var(--qs-navy); border: 0; color: #fff; padding: 32px 36px; }
.qs-qp-quote h1 { color: #fff; padding-left: 0; margin-bottom: 14px; }
.qs-qp-quote h1::before { display: none; }
.qs-qp-hero-body { min-width: 0; flex: 1; }
.qs-qp-quote cite { padding-left: 0; color: rgba(255,255,255,.72); font-style: italic; }
.qs-qp-quote cite a { color: #fff; text-decoration: none; }
.qs-qp-quote cite a:hover { text-decoration: underline; }
.qs-qp-share { margin: 18px 0 0; }
.qs-qp-btn { background: #fff; border-color: #fff; color: var(--qs-navy); font-weight: 500; }
.qs-qp-btn:hover { background: #EAF1F6; border-color: #EAF1F6; color: var(--qs-navy); }
.qs-qp-btn--wa:hover { background: #25D366; border-color: #25D366; color: #fff; }
@media (max-width: 640px) {
}
/* The two-column grid lives here now; its original declaration was inside the
   block the Testimonial Card treatment replaced, and restating only the gap
   left the cards stacked full-width. */
.qs-qp-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
@media (max-width: 640px) { .qs-qp-grid { grid-template-columns: 1fr; } }

/* The See All link sits in its own lane instead of overlapping the title.
   Absolutely positioning it over a CENTRED heading works only while the
   heading is short; "More from Roshni K Deep - Tragic Stories Book in Urdu"
   ran straight underneath it with no gap at all. Reserving the lane on both
   sides keeps the title optically centred and makes a long one wrap rather
   than collide. */
.qs-sect-head h2 { padding: 0 104px; }
@media (max-width: 640px) { .qs-sect-head h2 { padding: 0; } }

/* The quote page reuses the store's bookmark card (.qs-bmk) rather than a card
   of its own — it was already built, already styled, and already in the
   Nastaliq and line-height lists, which the three bespoke versions I wrote
   were not. Only the grid differs: the store lays them in a flex row of three,
   these sit two-up. */
.qs-bmk-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; align-items: stretch; }
.qs-bmk-grid .qs-bmk { flex: none; }
.qs-bmk-quote a { color: inherit; text-decoration: none; }
.qs-bmk-quote a:hover { text-decoration: underline; }
@media (max-width: 640px) { .qs-bmk-grid { grid-template-columns: 1fr; } }

/* One column, the same as the hub listings. Two-up made the identical card
   read as a different component depending on which page you were on, and a
   quote — especially a long Urdu one — needs the full measure to breathe. */
.qs-quote-grid { display: block; }

/* A card whose book is the one the page is already about carries no cover and
   no attribution, so it does not need the 130px right gutter the cover sits in.
   Without this the quote wrapped early against empty space. */
.qs-quote-card--bare { padding-right: 28px; }

/* ---- The book strip --------------------------------------------------------
   With the cover gone from the hero, the navy panel and this one stacked as two
   full-width slabs — one dark, one light — and the page read as two blocks
   rather than a quote with a way to buy the book under it.
   So this stops being a second content panel and becomes an action strip: the
   cover smaller, the meta on one line each, and the buttons pulled up beside
   them instead of below. Same information, roughly half the height. */
.qs-qp-book { display: flex; gap: 20px; align-items: center; padding: 16px 20px;
              border: 1px solid #E4ECEC; border-radius: 8px; background: #FEFEFE;
              box-shadow: none; }
.qs-qp-cover { flex: 0 0 78px; }
.qs-qp-cover img { width: 78px; height: auto; aspect-ratio: 3 / 4; object-fit: cover;
                   border-radius: 4px; box-shadow: 0 3px 10px rgba(14,58,83,.18); }
.qs-qp-bookmeta { flex: 1 1 auto; min-width: 0; }
.qs-qp-bookmeta h2 { font-size: 17px; margin: 0 0 3px; line-height: 1.35; }
.qs-qp-by   { margin: 0; font-size: 13.5px; }
.qs-qp-spec { margin: 0; font-size: 12.5px; }
/* The buttons sit on the end of the strip on a wide screen and wrap under it on
   a narrow one, which is what keeps the height down without hiding anything. */
.qs-qp-buy { flex: 0 0 auto; gap: 8px; }
.qs-qp-buy .qs-btn { padding: 9px 16px; font-size: 13.5px; }
@media (max-width: 700px) {
    .qs-qp-book { flex-wrap: wrap; }
    .qs-qp-bookmeta { flex: 1 1 100%; }
    .qs-qp-buy { flex: 1 1 100%; }
}

/* ---- Themes row on Tag Btn -------------------------------------------------
   The last element on the page still wearing its own clothes. The system's tag
   is an outline navy pill; these were a pale fill with muted text, which read
   as a caption rather than the link out to the theme hub that they are — and
   with the theme cards now at the foot of the page, this row is the only early
   exit to it. */
.qs-qp-themes { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.qs-qp-themes span { font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase;
                     color: #92A4B2; font-weight: 600; }
.qs-qp-themes a { display: inline-flex; align-items: center; min-height: 28px;
                  background: transparent; color: var(--qs-navy);
                  border: 1px solid rgba(14,58,83,.28); border-radius: 999px;
                  padding: 4px 15px; font-size: 14px; text-decoration: none;
                  transition: background .14s ease, color .14s ease, border-color .14s ease; }
.qs-qp-themes a:hover { background: var(--qs-navy); border-color: var(--qs-navy);
                        color: #fff; text-decoration: none; }
/* Buttons at the end of the strip; they drop to their own full-width row only
   when the strip is too narrow to hold them beside the title. */
.qs-qp-buy { flex: 0 0 auto; display: flex; gap: 8px; flex-wrap: wrap; margin-left: auto; }
@media (max-width: 700px) { .qs-qp-buy { margin-left: 0; } }

/* The Featured Author banner on a quote page. Same component as the store —
   only the fixed 380px height goes, because there it sits in a carousel where
   every slide must match, and here it is a single block that should close up
   around whatever bio it has. */
.qs-author-banner--compact { height: auto; padding: 32px 46px; }
@media (max-width: 767px) { .qs-author-banner--compact { padding: 26px 22px 28px; } }
/* Section rhythm — 80px, per the design system's spacing documentation. This
   was one rule listing .qs-qp-more, .qs-qtb and .qs-fa together, and removing
   the retired .qs-fa component took the whole selector with it. Restated
   without it. */
.qs-qp-more, .qs-qtb, .qs-author-banner--compact { margin-bottom: 80px; }

/* Language pills: same box, same baselines, whichever script is inside.
   The Urdu pill carries lang="ur", which picks up the 2.15 line-height meant
   for running Nastaliq prose — 30.1px against the English pill's 20px, and a
   number sitting 10px lower. In a two-line control that is not leading, it is
   misalignment: "English" floated at the top of its pill while اردو sat
   centred. Fixed leading on both, and the content centred in the box, so the
   script inside can no longer move it. */
.qs-qlang { display: flex; flex-direction: column; justify-content: center;
            line-height: 1.45; padding: 10px 8px; }
.qs-qlang span { line-height: 1.45; margin-top: 2px; }

/* Controls state their own leading so no Urdu prose rule can reach them. The
   column headers on the theme browser, the chips, and the pills are all
   two-line-or-less UI where the script inside must not change the box. */
.qs-qt-head span, .qs-qtb-lang, .qs-qtb-chip, .qs-qt-n, .qs-qtb-n,
.qs-pill, .qs-qp-themes a { line-height: 1.45; }

/* The review card is the home page's .qs-rev, now used on the service pages and
   the calculators too. The home page lays them in a horizontal rail; everywhere
   else they sit three across in a plain band, so the row needs its own layout
   while the card itself stays identical. */
.qs-srev-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: stretch; }
.qs-srev-row .qs-rev { margin: 0; width: auto; min-width: 0; flex: none; }
@media (max-width: 900px) { .qs-srev-row { grid-template-columns: 1fr; } }

/* The cross-language link under a theme hub's hero.
   First version was grey 14.5px small print and invisible on the page — which
   is a poor way to treat the one thing on this site Goodreads has no answer to.
   It is a destination now: a bordered chip that reads as somewhere to go. */
.qs-quote-xlang { margin: -8px 0 26px; font-size: 15px; }
.qs-quote-xlang a {
    display: inline-flex; align-items: center; gap: 10px;
    border: 1px solid rgba(14,58,83,.22); border-radius: 999px;
    padding: 9px 18px; color: var(--qs-navy); font-weight: 500; text-decoration: none;
    transition: background .14s ease, color .14s ease, border-color .14s ease;
}
.qs-quote-xlang a:hover { background: var(--qs-navy); border-color: var(--qs-navy);
                          color: #fff; text-decoration: none; }
.qs-quote-xlang b { font-weight: 600; }
.qs-quote-xlang .qs-xlang-n { font-size: 12.5px; opacity: .7; }

/* ---- Featured --------------------------------------------------------------
   Three per theme per language, chosen on a schedule and rotated weekly. They
   already sort to the top of the hub; without a mark the reader reads them as
   the first three of a list rather than a selection, so they get a small ribbon
   and a warm card — the same warmth the admin list uses for a featured row.
   Deliberately quiet: three in twenty reads as a recommendation; louder and
   twenty would read as an advert. */
.qs-quote-card--pick { background: #FFFCF5; border-color: #F0E2C4; }
.qs-quote-pick {
    position: absolute; bottom: 0; right: 28px;
    background: #B8862B; color: #fff;
    font-size: 10.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
    padding: 5px 12px 6px; border-radius: 5px 5px 0 0; line-height: 1;
}
/* Bottom right in both languages, and the word stays "Featured" in both — an
   Urdu reader of this site reads English, and one word in two scripts meant the
   ribbon changed width and weight between the two columns of the same grid.
   Latin text in an RTL card, so it is pinned rather than flowed: `right` is the
   right edge either way, where `inset-inline-end` would follow the script and
   put it on the left of the Urdu hub. */
.qs-quote-pick:lang(ur) { direction: ltr; }
/* It sits in the gutter the cover reserves (the card pads 130px on that side,
   so the tags never reach it) and below where the cover ends. A short quote
   would otherwise let the two meet, which is what the floor is for; a bare card
   has no cover and needs no floor. */
.qs-quote-card--pick { min-height: 168px; }
.qs-quote-card--bare.qs-quote-card--pick { min-height: 0; }
@media (max-width: 640px) {
    .qs-quote-pick { right: 16px; }
    .qs-quote-card--pick { min-height: 0; }   /* cover is hidden here */
}

/* ---- Genre facets, FAQ, recent and the thin-shelf fallback -----------------
   Four blocks added to the genre page. They share the card language already on
   the site rather than introducing a new one -- same radius, same line colour,
   same navy. Nothing here is a new component; it is the existing vocabulary
   applied to four more places. */

/* Facet strip. Language tabs are real links to real pages; "free to read" is a
   filter and is styled quieter so it does not read as a sibling shelf. */
.qs-gfacets { display: flex; flex-wrap: wrap; gap: 8px; margin: -6px 0 26px; }
.qs-gfacet {
    display: inline-flex; align-items: baseline; gap: 7px;
    padding: 8px 16px; border-radius: 999px;
    border: 1px solid var(--qs-line); background: #fff;
    color: var(--qs-navy, #0E3A53);
    font-size: 14.5px; font-weight: 600; text-decoration: none;
    transition: background .15s, border-color .15s;
}
.qs-gfacet span { font-size: 12.5px; font-weight: 500; color: var(--qs-muted); }
.qs-gfacet:hover { background: var(--qs-bg-blue); text-decoration: none; color: var(--qs-navy, #0E3A53); }
.qs-gfacet.is-on { background: var(--qs-navy, #0E3A53); border-color: var(--qs-navy, #0E3A53); color: #fff; }
.qs-gfacet.is-on span { color: rgba(255,255,255,.72); }
.qs-gfacet--soft { border-style: dashed; color: var(--qs-ink-2, #5A7385); }

/* FAQ. <details> rather than a JS accordion: it works before any script runs,
   it is keyboard-accessible for free, and the answer text is in the DOM for
   crawlers whether or not it is open. */
.qs-gfaq { margin: 46px 0 0; }
.qs-gfaq h2 { font-size: 24px; font-weight: 700; color: var(--qs-navy, #0E3A53); margin: 0 0 18px; }
.qs-gfaq-list { border: 1px solid var(--qs-line); border-radius: var(--qs-radius-card, 12px); background: #fff; }
.qs-gfaq-item { border-bottom: 1px solid var(--qs-line); }
.qs-gfaq-item:last-child { border-bottom: 0; }
.qs-gfaq-item > summary {
    cursor: pointer; list-style: none;
    padding: 16px 46px 16px 20px; position: relative;
    font-size: 16px; font-weight: 600; color: var(--qs-ink, #17313F);
}
.qs-gfaq-item > summary::-webkit-details-marker { display: none; }
.qs-gfaq-item > summary::after {
    content: '+'; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);
    font-size: 20px; font-weight: 400; color: var(--qs-muted); line-height: 1;
}
.qs-gfaq-item[open] > summary::after { content: '\2013'; }
.qs-gfaq-item > summary:hover { color: var(--qs-navy, #0E3A53); }
.qs-gfaq-item > div {
    padding: 0 20px 18px; font-size: 15px; line-height: 1.75; color: var(--qs-ink-2, #5A7385);
}
.qs-gfaq-item a { color: var(--qs-navy, #0E3A53); font-weight: 600; }

/* Recently added. Uses the site's own book card in the five-up row author.php
   already uses (.qs-book-grid--row) rather than a bespoke list -- the first
   version was a bare row of links styled like nothing else on the site.
   Only the date is new, and it is the one thing the grid above does not say. */
.qs-grecent { margin: 46px 0 0; }
.qs-grecent-when { display: block; margin-top: 6px; font-size: 12.5px; color: var(--qs-muted);
                   font-family: var(--qs-font); }
/* The description is what makes a card tall. In a freshness strip the covers
   and the dates are the content, so it comes off here and nowhere else. */
.qs-grecent .qs-book-desc { display: none; }
/* .qs-book-name reserves two title lines (min-height: 3.7em) so the author
   sits at the same height across a row. In the main grid the description
   under it hides that reserve; here, with the description gone and most
   titles one line, it left a 34px hole between the title and the author on
   every card.
   The reserve is dropped and the alignment done properly instead: the row is
   a flex container, so cards already stretch to equal height, and pushing the
   author to the bottom lines the author and date up whatever the titles do. */
.qs-grecent .qs-book-name   { min-height: 0; margin-bottom: 8px; }
.qs-grecent .qs-book-author { margin-top: auto; }
.qs-grecent-when            { margin-top: 2px; }

/* Thin shelf. Only renders below the indexing floor, so it is never on a page
   that is doing fine -- it exists so seven books is a signpost, not a dead end. */
.qs-gthin { margin: 40px 0 0; padding: 22px 24px; background: var(--qs-bg-blue, #EAF1F6);
            border-radius: var(--qs-radius-card, 12px); }
.qs-gthin h2 { font-size: 19px; font-weight: 700; color: var(--qs-navy, #0E3A53); margin: 0 0 8px; }
.qs-gthin p { margin: 0 0 14px; color: var(--qs-ink-2, #5A7385); font-size: 15px; }
.qs-gthin-links { display: flex; flex-wrap: wrap; gap: 8px; }
.qs-gthin-links a {
    display: inline-flex; align-items: baseline; gap: 6px;
    padding: 8px 15px; border-radius: 999px; background: #fff;
    color: var(--qs-navy, #0E3A53); font-size: 14px; font-weight: 600; text-decoration: none;
}
.qs-gthin-links a span { font-size: 12px; font-weight: 500; color: var(--qs-muted); }
.qs-gthin-links a:hover { background: var(--qs-navy, #0E3A53); color: #fff; text-decoration: none; }
.qs-gthin-links a:hover span { color: rgba(255,255,255,.7); }

@media (max-width: 640px) {
    .qs-gfacets { gap: 6px; }
    .qs-gfacet { padding: 7px 13px; font-size: 13.5px; }
    .qs-gfaq h2 { font-size: 21px; }
}

/* --- A book that is not on sale ------------------------------------------
   Replaces the whole buy box (format tabs, price, Add to Cart, sample) on a
   deactivated book. The PAGE stays -- description, author, reviews -- because
   404ing a URL that is already indexed and linked throws away everything it
   earned, and if the book is put back it would start from nothing. So the
   address keeps its value and simply stops selling. */
.qs-offsale {
    padding: 18px 20px;
    background: var(--qs-bg-blue, #EEF4F8);
    border: 1px solid rgba(14,58,83,.12);
    border-radius: 12px;
}
.qs-offsale-head {
    margin: 0 0 6px; font-family: var(--qs-font);
    font-size: 17px; font-weight: 700; color: var(--qs-navy, #0E3A53);
}
.qs-offsale-body {
    margin: 0; font-family: var(--qs-font);
    font-size: 14px; line-height: 1.6; color: #38617A;
}
.qs-offsale-body a { color: var(--qs-navy, #0E3A53); text-decoration: underline; }

/* ============================================================================
   SCARCITY TAG — "how many are left", beside the order button
   ----------------------------------------------------------------------------
   Shown only when a print edition has 10 or fewer copies. Two jobs: tell the
   reader the truth, and let them see it without reading. The dot meter does the
   second job -- ten slots, one lit per copy -- so the shape of the tag carries
   the number before the words do.

   Built from the existing tokens. The two amber values are the only new colour
   in the file: --qs-star (#F4B400) is the palette's warm accent but it is a
   rating gold on white and fails contrast as text, so these are the same hue
   taken darker for text and lighter for the fill.
   ============================================================================ */
:root {
    --qs-scarce:      #8A5A00;   /* text on the low tag  — warm, from --qs-star's hue */
    --qs-scarce-bg:   #FFF6E0;   /* fill for the low tag */
    --qs-scarce-line: #F0DCA8;   /* hairline for the low tag */
    --qs-urgent:      #9A3110;   /* text when 3 or fewer remain */
    --qs-urgent-bg:   #FFEDE6;
    --qs-urgent-line: #F5C9B6;
}

.qs-stock-tag {
    display: inline-flex; align-items: center; gap: 10px;
    margin: 0 0 12px; padding: 7px 14px 7px 12px;
    font-family: var(--qs-font); font-size: 13px; font-weight: 500; line-height: 1.3;
    color: var(--qs-scarce);
    background: var(--qs-scarce-bg);
    border: 1px solid var(--qs-scarce-line);
    border-radius: 20px;              /* matches .qs-pill */
}
.qs-stock-tag--urgent {
    color: var(--qs-urgent);
    background: var(--qs-urgent-bg);
    border-color: var(--qs-urgent-line);
}

/* Ten slots, one lit per copy left. Reads as a fuel gauge, not a decoration. */
.qs-stock-meter { display: inline-flex; gap: 3px; flex: 0 0 auto; }
.qs-stock-meter i {
    display: block; width: 4px; height: 12px; border-radius: 2px;
    background: currentColor; opacity: .18;
}
.qs-stock-meter i.is-on { opacity: 1; }

/* The last lit slot breathes, but only when it is genuinely the last copy.
   Animating every low-stock tag would make the page restless for no reason. */
.qs-stock-tag--last .qs-stock-meter i.is-on { animation: qs-stock-breathe 2.4s ease-in-out infinite; }
@keyframes qs-stock-breathe { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) {
    .qs-stock-tag--last .qs-stock-meter i.is-on { animation: none; }
}

.qs-stock-tag__text { white-space: nowrap; }
.qs-stock-tag__text b { font-weight: 700; }

@media (max-width: 480px) {
    .qs-stock-tag { width: 100%; justify-content: center; }
}

/* --- the same scarcity fact, on the format tab -----------------------------
   Sits on its own line under the format name: the tabs are flex:1 and share the
   row, so putting "2 left" inline pushed "Paperback" off-centre and made the two
   tabs different widths. A second line keeps the tab grid even. */
.qs-tab-stock {
    display: block; margin-top: 3px;
    font-size: 11px; font-weight: 600; line-height: 1.2;
    color: var(--qs-scarce);
}
.qs-tab-stock--urgent { color: var(--qs-urgent); }

/* The active tab is navy, where both amber and red fail contrast. Same warning
   role, repainted for a dark ground rather than dropped -- the count matters
   most on the format the reader has actually selected. */
.qs-tab.is-active .qs-tab-stock          { color: #FFD9A8; }
.qs-tab.is-active .qs-tab-stock--urgent  { color: #FFC2A8; }

/* --- Where else you can buy it ----------------------------------------------
   Two surfaces for one fact. The NOTE sits under the format switcher, where the
   buying decision is actually made; the BAND sits above the reviews with logos
   and contact details, where there is room to make the case. The note links to
   the band, so the compact version never has to carry contact details it has no
   room for. */

/* The note. A link styled as a tinted strip, not a button: it must not compete
   with Add to Cart directly above it. */
.qs-stockists-note {
    display: flex; align-items: center; gap: 8px;
    margin-top: 12px; padding: 9px 12px;
    border: 1px solid var(--qs-line); border-radius: var(--qs-radius);
    background: var(--qs-bg-blue);
    font-family: var(--qs-font); font-size: 13.5px; color: var(--qs-pill-text);
    text-decoration: none; line-height: 1.4;
}
.qs-stockists-note:hover { border-color: var(--qs-navy); text-decoration: none; color: var(--qs-navy); }
.qs-stockists-note b { color: var(--qs-navy); font-weight: 600; }
.qs-stockists-note .fa { color: var(--qs-navy); }
.qs-stockists-note__go { margin-left: auto; font-weight: 600; white-space: nowrap; font-size: 13px; }

/* The band. */
.qs-stockband { margin: 40px 0; }
.qs-stockband__lede {
    font-size: 15px; color: var(--qs-muted); margin: -4px 0 18px; line-height: 1.55;
}
/* auto-FILL, not auto-fit. With one bookshop, auto-fit collapses the empty
   tracks and stretches the single card the full width of the column, which
   reads as an empty box with a logo in the corner. auto-fill keeps the track
   and the card stays card-sized whether there is one shop or three. */
.qs-stockband__grid {
    display: grid; gap: 14px;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.qs-stockcard {
    display: flex; gap: 14px; align-items: stretch;
    padding: 16px; border: 1px solid var(--qs-line);
    border-radius: 12px; background: #fff;
}
.qs-stockcard:hover { border-color: var(--qs-field-border); }

/* Fixed square so shops with wildly different logo proportions still line up
   down the row. contain, never cover: a cropped logo is a damaged trademark. */
.qs-stockcard__mark {
    flex: 0 0 56px; width: 56px; height: 56px; align-self: flex-start;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--qs-line); border-radius: 10px;
    background: #fff; overflow: hidden;
}
.qs-stockcard__mark img { max-width: 100%; max-height: 100%; object-fit: contain; }
/* No logo yet: the initial, so the card keeps its shape rather than collapsing
   into a different layout for half the shops. */
.qs-stockcard__initial {
    font-family: var(--qs-font); font-size: 22px; font-weight: 600;
    color: var(--qs-navy); background: var(--qs-bg-blue);
    width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
}
/* Column, so the button row can be pushed to the floor of the card with
   margin-top:auto below. Without it the actions sit directly under however much
   text each shop happens to have, and three cards in a row show three different
   button heights. */
.qs-stockcard__body { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; }
.qs-stockcard__name {
    font-family: var(--qs-font); font-size: 15.5px; font-weight: 600;
    color: var(--qs-ink); line-height: 1.3;
}
.qs-stockcard__where { font-size: 13px; color: var(--qs-muted); margin-top: 3px; line-height: 1.45; }
.qs-stockcard__blurb {
    font-size: 13px; color: var(--qs-pill-text); margin-top: 6px;
    line-height: 1.5; font-style: italic;
}
.qs-stockcard__act { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 12px; }
.qs-stockcard__act a {
    font-size: 13px; font-weight: 600; color: var(--qs-navy);
    text-decoration: none; padding: 6px 11px; border-radius: 6px;
    background: #fff; border: 1px solid var(--qs-field-border);
}
.qs-stockcard__act a:hover { border-color: var(--qs-navy); text-decoration: none; }
/* WhatsApp keeps its own colour: it is the one people recognise without reading. */
.qs-stockcard__wa { color: #128C7E !important; border-color: #B7E1D8 !important; }
.qs-stockcard__wa:hover { border-color: #128C7E !important; }

.qs-stockband__foot {
    margin: 14px 0 0; font-size: 13px; color: var(--qs-muted); line-height: 1.5;
}
.qs-stockband__foot .fa { color: #2E7D5B; margin-right: 5px; }

@media (max-width: 480px) {
    .qs-stockband__grid { grid-template-columns: 1fr; }
    .qs-stockcard__act a { flex: 1 1 auto; text-align: center; }
    .qs-stockists-note { flex-wrap: wrap; }
    .qs-stockists-note__go { margin-left: 0; }
}

/* "Also available at …" — shown under the buy button when we have stock and a
   bookshop is holding copies too. Deliberately quiet: one line, no panel, no
   buttons. Given the same weight as the stock-out block it would read as an
   alternative to buying here, which is the opposite of the intent. */
.qs-stockists-also {
    margin-top: 10px; font-family: var(--qs-font);
    font-size: 13px; line-height: 1.5; color: var(--qs-muted);
}
.qs-stockists-also a {
    color: var(--qs-blue); font-weight: 500; text-decoration: none;
    border-bottom: 1px solid rgba(47,111,166,.35);
}
.qs-stockists-also a:hover { color: var(--qs-navy); border-bottom-color: var(--qs-navy); }

/* --- Bookshop directory and shop pages --------------------------------------
   /distributors and /distributors/<slug>. Deliberately reuses the shape of the
   stockist cards on a book page: a reader who clicks "Also available at" should
   land somewhere that looks like where they came from. */
.qs-shops-intro { margin: 8px 0 22px; }
.qs-shops-lede { font-size: 15.5px; color: var(--qs-muted); line-height: 1.6; margin: 8px 0 0; max-width: 70ch; }
.qs-shops-empty { padding: 40px 0; text-align: center; color: var(--qs-muted); }
.qs-shops-foot { margin: 32px 0 40px; font-size: 14px; color: var(--qs-muted); }

.qs-shopgrid {
    display: grid; gap: 16px;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    margin-bottom: 8px;
}
.qs-shopcard {
    display: flex; gap: 14px; align-items: stretch;
    padding: 18px; border: 1px solid var(--qs-line); border-radius: 12px;
    background: #fff; text-decoration: none; color: inherit;
}
.qs-shopcard:hover { border-color: var(--qs-navy); text-decoration: none; }
.qs-shopcard__mark, .qs-shophead__mark {
    flex: 0 0 64px; width: 64px; height: 64px; align-self: flex-start;
    display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--qs-line); border-radius: 10px; background: #fff; overflow: hidden;
}
/* contain, never cover: a cropped logo is a damaged trademark. */
.qs-shopcard__mark img, .qs-shophead__mark img { max-width: 100%; max-height: 100%; object-fit: contain; }
.qs-shopcard__initial, .qs-shophead__initial {
    width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
    font-family: var(--qs-font); font-size: 26px; font-weight: 600;
    color: var(--qs-navy); background: var(--qs-bg-blue);
}
.qs-shopcard__body { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; }
.qs-shopcard__name { font-family: var(--qs-font); font-size: 16px; font-weight: 600; color: var(--qs-ink); line-height: 1.3; }
.qs-shopcard__where { font-size: 13px; color: var(--qs-muted); margin-top: 3px; line-height: 1.45; }
.qs-shopcard__blurb { font-size: 13px; color: var(--qs-pill-text); margin-top: 7px; line-height: 1.5; font-style: italic; }
.qs-shopcard__count { font-size: 12.5px; color: var(--qs-navy); font-weight: 600; margin-top: auto; padding-top: 10px; }

/* One shop. */
.qs-shophead { display: flex; gap: 20px; align-items: flex-start; margin: 8px 0 34px; }
.qs-shophead__mark { flex: 0 0 92px; width: 92px; height: 92px; border-radius: 12px; }
.qs-shophead__body { min-width: 0; }
.qs-shophead__blurb { font-size: 16px; color: var(--qs-pill-text); font-style: italic; margin: 8px 0 0; line-height: 1.55; max-width: 60ch; }
.qs-shophead__where { font-size: 14.5px; color: var(--qs-muted); margin: 10px 0 0; }
.qs-shophead__where .fa { color: var(--qs-navy); margin-right: 5px; }
.qs-shophead__act { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.qs-shop-wa { background: #128C7E !important; border-color: #128C7E !important; }

.qs-shopbooks { margin-bottom: 36px; }
.qs-shopbooks__grid {
    display: grid; gap: 20px 16px; margin-top: 18px;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}
.qs-shopbook { display: block; text-decoration: none; color: inherit; }
.qs-shopbook:hover { text-decoration: none; }
.qs-shopbook__cover {
    display: block; width: 100%; aspect-ratio: 2 / 3; object-fit: cover;
    border-radius: 8px; border: 1px solid var(--qs-line); background: var(--qs-bg-blue);
}
.qs-shopbook__title { display: block; margin-top: 9px; font-size: 14px; font-weight: 600; color: var(--qs-ink); line-height: 1.35; }
.qs-shopbook__author { display: block; margin-top: 2px; font-size: 12.5px; color: var(--qs-muted); }

@media (max-width: 560px) {
    .qs-shopgrid { grid-template-columns: 1fr; }
    .qs-shophead { flex-direction: column; gap: 14px; }
    .qs-shophead__act .qs-btn { flex: 1 1 auto; text-align: center; }
}

/* ===========================================================================
   COLLABORATION INVITATION  (accept-invite.php)
   The one page a person lands on from an invitation e-mail. It is read once,
   by somebody who may never have seen Daastan before, while being asked to
   agree to a share of somebody's earnings — so it is narrow, quiet, and the
   terms are the largest thing on it.
   =========================================================================== */
.qs-invite { max-width: 640px; padding-top: 32px; padding-bottom: 56px; }
.qs-invite h1 { font-size: 26px; margin: 0 0 18px; }
.qs-invite-lead { font-size: 18px; line-height: 1.55; margin-bottom: 18px; }

/* The terms get a card of their own. This is the part being agreed to, and on
   a page of prose an unboxed paragraph is something people skim past. */
.qs-invite-terms {
    background: #F4F9FC; border: 1px solid #DCE7EE; border-radius: 12px;
    padding: 18px 20px; margin: 22px 0;
}
.qs-invite-terms p { margin: 0 0 10px; font-size: 16px; }
.qs-invite-terms p:last-child { margin-bottom: 0; }

.qs-invite-act { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 24px 0 12px; }
.qs-invite-fine { font-size: 14px; color: #5A7385; margin: 0; }

/* Not an error the reader caused — the hold lapsed while they were deciding.
   Amber rather than red: nobody did anything wrong. */
.qs-invite-err {
    background: #FFF8E6; border: 1px solid #F2D999; color: #6B5312;
    padding: 12px 16px; border-radius: 10px; margin: 20px 0 12px; font-size: 15px;
}

/* --- publisher profile ------------------------------------------------------
   The evidence strip, the people, their authors, and submissions. Built from
   the tokens already here -- navy, bg-blue, line, muted -- because a publisher
   page that looked like a different site would undo the point of it being the
   place people come to check. */

/* THE EVIDENCE. Counted facts, so they are given the weight of facts: big
   numerals, quiet labels, and a rule under them rather than a card each. Cards
   would make five figures read as five separate claims. */
/* THREE NAVY BOXES, not three numbers on white. The counts are the page's
   evidence and they were the quietest thing on it -- a rule above them and grey
   labels under, indistinguishable from a caption. In the brand navy they read
   as a claim being made.
   The rule above them goes: the boxes are their own edge now, and a hairline
   over a row of solid cards is a second border for the same job. */
.qs-pev { padding-top: 8px; }
.qs-pev-grid {
    display: grid; gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    margin-bottom: 20px;
}
.qs-pev-i {
    background: var(--qs-navy); border-radius: var(--qs-radius-card);
    padding: 30px 28px; text-align: center;
}
.qs-pev-i b {
    display: block; font-size: 42px; font-weight: 800; color: #fff; line-height: 1.05;
    /* Numerals on one rhythm, so 612 and 2016 do not sit on different widths. */
    font-variant-numeric: tabular-nums;
}
.qs-pev-i span {
    display: block; margin-top: 6px; font-size: 14px; color: rgba(255,255,255,.72);
}

/* THE HERO'S TWO SENTENCES. Wider measure than the bio because it sits beside
   the logo rather than under a heading, and short enough that it never needs
   one. */
.qs-ai-lede {
    font-family: var(--qs-font); font-size: 17px; line-height: 1.65;
    color: var(--qs-ink-2); max-width: 620px; margin: 2px 0 16px;
}
/* The verification, as two chips. This replaced three stacked lines and about
   forty words; the long form is each chip's title attribute. */
.qs-ai-trust { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.qs-trust {
    display: inline-flex; align-items: center; gap: 6px;
    font-family: var(--qs-font); font-size: 13.5px; font-weight: 600;
    color: var(--qs-pill-text); background: var(--qs-bg-blue);
    padding: 6px 12px; border-radius: 999px;
    cursor: default;   /* it carries a tooltip, not a link */
}
.qs-trust--ver i { color: #1E874B; }
/* Monospace on the prefix because it is a number to be copied and compared,
   not read. */
.qs-trust code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 13px; font-weight: 700; background: none; padding: 0;
    color: var(--qs-navy);
}

/* THE PEOPLE. A photo and a name, side by side -- the most human block on the
   page, so it is not a grid of avatars. */

/* THEIR AUTHORS. Small, many, and scannable -- this is a list somebody reads
   looking for a name they know. */
/* EVERY CARD THE SAME HEIGHT, whatever the name does.
   "Muhammad Jahangeer Badar" wrapped to two lines and pushed its "5 titles" a
   line below its neighbours, so the first row had two baselines and read as
   broken while the rows below it looked fine. The name reserves two lines
   whether it needs them or not and clamps at two rather than growing to three,
   so a long name is shortened and never ragged. Same class as the spacing
   complaints in CLAUDE.md: not a missing margin -- a box that changes size. */
/* TWO ROWS DRIFTING PAST EACH OTHER, not a wall. Twenty-four cards in a grid
   took four rows and still showed 5% of the house; the same twenty-four in
   opposite directions read as a pool you are seeing part of, which is the true
   statement. Penguin Random House does not use a photo grid for the reason we
   cannot either: photograph coverage is uneven, and a layout built on faces is
   only as good as its worst quarter -- so these are pills, where the face is a
   detail and the name carries the card. */
/* THE WHOLE BLOCK ON THE TINT, heading included. The pills are white, so on
   white they were outlines floating on nothing; on BG Blue they read as cards.
   No horizontal padding -- the rows are meant to run out of the card on both
   sides, and the mask below is what makes them do it. */
/* FULL BLEED, and it has to break OUT of .container to do it -- the band is
   emitted inside a 1040px centred box. Negative side margins of exactly the
   gap on each side widen it to the viewport.

   100vw counts the scrollbar and .container is centred in the space WITHOUT
   one, so the right edge overshoots by about half a scrollbar -- enough to give
   the whole page a horizontal scrollbar on Windows, where the bar is always
   visible. #body clips that off. `clip` rather than `hidden`: hidden would make
   #body a scroll container and break position:sticky anywhere below it, which
   is a large blast radius for a decorative band. Nothing in any stylesheet
   touches #body, so this rule owns it outright.

   Doubled with .qs-ah-sec deliberately -- both are one class, so which margin
   wins would otherwise be decided by source order, the trap that collapsed
   every dense form grid below 768px. */
#body { overflow-x: clip; }
.qs-ah-sec.qs-pamq-band {
    background: var(--qs-bg-blue);
    /* No radius: a band that reaches both edges has no corners to round. */
    border-radius: 0;
    padding: 44px 0;
    margin: 48px calc(50% - 50vw) 10px;
}
/* The rows run edge to edge; the words must not. */
.qs-pamq-band .qs-sec-head2 { padding: 0 24px; }
.qs-pamq { position: relative; }
.qs-pamq-row {
    overflow: hidden;
    /* Both edges, because content enters and leaves on both. A mask rather than
       gradient overlays because this section is on white here and on a tinted
       panel elsewhere, and a mask does not need to know which. */
    -webkit-mask-image: linear-gradient(to right, transparent, #000 72px,
                                        #000 calc(100% - 72px), transparent);
            mask-image: linear-gradient(to right, transparent, #000 72px,
                                        #000 calc(100% - 72px), transparent);
}
.qs-pamq-row + .qs-pamq-row { margin-top: 12px; }
.qs-pamq-track {
    display: flex; width: max-content;
    animation: qs-pamq-run 64s linear infinite;
    will-change: transform;
}
/* Every other row runs the same keyframes backwards. Direction comes from the
   markup because it is a fact about the row and greppable there; the durations
   are positional and stay here -- three primes apart, so the rows never fall
   into step and freeze into looking like one moving block. */
.qs-pamq-row--rev .qs-pamq-track { animation-direction: reverse; }
.qs-pamq-row:nth-child(2) .qs-pamq-track { animation-duration: 79s; }
.qs-pamq-row:nth-child(3) .qs-pamq-track { animation-duration: 71s; }
@keyframes qs-pamq-run {
    from { transform: translateX(0); }
    /* Exactly one set. The pills carry their own trailing margin instead of the
       track carrying a gap -- with a gap the track is 2 sets PLUS one gap, and
       -50% lands half a gap short, which shows up as a stutter once a minute. */
    to   { transform: translateX(-50%); }
}
.qs-pamq-set { display: flex; }
/* TOO FEW TO LOOP -- three of the six houses with books have a single author.
   Held still, centred, duplicate dropped. Centred with an auto margin rather
   than justify-content because auto margins collapse to zero once the content
   overflows, so a house near the threshold can still scroll to the far end
   instead of having it clipped off unreachably to the left. */
.qs-pamq--still .qs-pamq-track { animation: none; width: auto; }
.qs-pamq--still .qs-pamq-set { margin: 0 auto; }
.qs-pamq--still .qs-pamq-set--dup { display: none; }
.qs-pamq--still .qs-pamq-row { overflow-x: auto; overscroll-behavior-x: contain; }
/* The trailing margin exists to make the seam exact; with nothing to seam it is
   just the row sitting six pixels left of centre. */
.qs-pamq--still .qs-pamq-pill:last-child { margin-right: 0; }
/* Stop when the reader reaches for one. A moving link is a link you cannot
   click, and hover is the moment they are trying to. focus-within does the same
   for the keyboard, where the row would otherwise carry the focused pill away. */
@media (hover: hover) and (pointer: fine) {
    .qs-pamq:hover .qs-pamq-track { animation-play-state: paused; }
}
.qs-pamq:focus-within .qs-pamq-track { animation-play-state: paused; }

.qs-pamq-pill {
    display: flex; align-items: center; gap: 11px;
    margin-right: 12px; padding: 7px 20px 7px 7px;
    border: 1px solid var(--qs-line); border-radius: 999px;
    background: var(--qs-surface); text-decoration: none;
    /* No fixed width: "Muhammad Jahangeer Badar" and "AFSHAN HUMA" get the room
       each needs, which is also what stops the two rows looking gridded. */
    white-space: nowrap;
}
.qs-pamq-av {
    flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%;
    object-fit: cover; display: block;
    /* A ring, so a white or transparent logo does not float loose -- several of
       these "photos" are wordmarks on no background. */
    border: 1px solid var(--qs-line); background: var(--qs-surface);
}
.qs-pamq-txt strong {
    display: block; font-size: 14px; font-weight: 700; color: var(--qs-navy);
    line-height: 1.25;
}
.qs-pamq-txt span { display: block; font-size: 12px; color: var(--qs-muted); margin-top: 1px; }
/* 136 of 478 authors have no usable photograph. The same tinted circle the
   review cards already use for the Google feed -- centred by line-height,
   matching .qs-rev-face, so no flex rule can be silently overridden the way it
   was there. */
.qs-pauthor-i {
    background: var(--qs-bg-blue); color: var(--qs-blue); border-color: transparent;
    font-size: 15px; font-weight: 700; line-height: 42px; text-align: center;
    letter-spacing: .5px;
}


/* THE CONTAINER FRAMES THE CARD, the card does not frame itself. `.qs-review`
   is a list item on a book page and a tile here; the only rules that differ are
   these, so the markup can stay one component instead of two.
   `.qs-preview*` was that second component and is gone. */
/* The book this review was of -- the publisher page used to show it; the
   card still offers it and the book page still does not need it. */
.qs-review-on { margin: 10px 0 0; font-size: 13px; color: var(--qs-muted); }
.qs-review-on a { color: var(--qs-blue); text-decoration: none; }
.qs-review-on a:hover { text-decoration: underline; }

/* SUBMISSIONS. The status is the headline because it is the one thing a writer
   is looking for; a closed house still gets the section, since "no" answers the
   question and saves them a letter. */
/* SUBMISSIONS AND CONTACT, one light box. It was the navy CTA band for a while
   -- reused from the home page, which is why it looked like the home page and
   not like this one: on an otherwise white page it read as a different site
   rather than as this page's most important block. Back to the module that was
   here before, with the contact links inside it, which is the half of the merge
   worth keeping.

   The open tint is the site's BG Blue rather than the pale mint it used to be:
   there was no other green on the page, so the box was the only thing wearing
   it. Closed stays neutral -- a house that is not reading manuscripts should
   not be shouting the fact in colour. */
.qs-psub { border: 1px solid var(--qs-line); border-radius: var(--qs-radius-card); padding: 26px 24px; }
.qs-psub--open   { border-color: #CFE0EC; background: var(--qs-bg-blue); }
.qs-psub--closed { background: #FAFAFA; }
.qs-psub-status { font-size: 18px; margin: 0 0 14px; color: var(--qs-navy); }
.qs-psub-facts { display: grid; grid-template-columns: max-content 1fr; gap: 8px 18px; margin: 0 0 16px; }
.qs-psub-facts dt { font-size: 13px; color: var(--qs-muted); text-transform: uppercase;
                    letter-spacing: .04em; align-self: baseline; }
.qs-psub-facts dd { margin: 0; font-size: 15px; color: var(--qs-ink); }
.qs-psub-guide-h { font-size: 15px; font-weight: 700; color: var(--qs-navy); margin: 20px 0 8px; }
.qs-psub-note { font-size: 15px; line-height: 1.7; color: var(--qs-ink-2, #4a4a4a); margin: 0; }
.qs-psub-note p { margin: 0 0 8px; }
.qs-psub-note p:last-child { margin-bottom: 0; }
/* The contact row sits under the submission facts, in the same box -- separated
   by a rule rather than by a second heading, because that separation is the
   only thing the old two-section version was really doing. */
/* STACKED, IN THE RIGHT-HAND COLUMN. Three buttons in a row under the facts
   read as a footer; in their own column they read as the next step. Full width
   so the three line up, and the WhatsApp one is the theme blue rather than
   brand green -- there was one green control on the page and it pulled the eye
   past everything the block was actually saying. */
.qs-pcontact { display: grid; gap: 10px; align-content: start; }
.qs-pcontact .qs-btn { width: 100%; text-align: center; }
.qs-psub .qs-sec-head2 { text-align: left; }
/* WhatsApp in its own colour: it is the number people in Pakistan actually
   answer, and it should not look like one option among three. */

/* The extra facet row (Newest / Top selling) sits under the shared strip. */
.qs-gfacets--more { margin-top: 8px; }

/* --- publisher page: conversion + motion ------------------------------------
   The two things this page is for, and the motion that supports them. Every
   duration below is chosen by how OFTEN the thing is seen, not by taste:
   a section entrance is met once a visit and can afford delight; a filter tab
   is met tens of times and must not animate at all. */

:root {
    /* The built-in CSS easings are too weak to read as intentional. */
    --qs-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
}

/* The fold's two actions. A reader buys, a writer submits -- both were
   thousands of pixels down past a mission statement. */
.qs-ai-cta { display: flex; gap: 12px; flex-wrap: wrap; margin: 4px 0 18px; }

/* The publisher's own words, now in the merged About section rather than folded
   into the intro. Same measure as .qs-ai-bio so a house and an author read at
   the same line length. */
/* LEFT, LIKE THE BOOK PAGE'S "About the Author" CARD -- heading and prose on
   the same left edge, which is what a reader is used to from every book on the
   site. It was centred-heading-over-left-text for a while and the two had
   centres 140px apart, so the block looked like it had slipped; centring the
   measure fixed the alignment and left it reading as a pull quote instead of a
   bio. Left fixes both.
   620px, not 760: at 16px that is about 77 characters a line against 95, and
   continuous prose is comfortable between 45 and 75. */
.qs-pabout-sec .qs-sec-head2 { text-align: left; }
.qs-pabout {
    font-family: var(--qs-font); font-size: 16px; line-height: 1.8;
    color: var(--qs-ink-2); max-width: 620px; margin: 0;
}
/* Bios arrive with their own markup, so the type has to reach inside it. */
.qs-pabout p { margin: 0 0 12px; font-size: inherit; line-height: inherit; color: inherit; }
.qs-pabout p:last-child { margin-bottom: 0; }

/* The rating spread. Bars, because the shape is the point. */

/* PRESS FEEDBACK. Nothing on this page felt heard. 160ms is the band where a
   press reads as instant without being invisible. */
.qs-btn { transition: transform 160ms var(--qs-ease-out), background 160ms ease, color 160ms ease; }
.qs-btn:active { transform: scale(0.97); }

/* HOVER IS A MOUSE IDEA. On a touch screen a tap fires hover and it sticks
   until something else is tapped, so every lift below is gated. */
@media (hover: hover) and (pointer: fine) {
    /* No lift on a pill: the row is inside a mask, so a translate on hover is
       clipped at the edges rather than raised. The track stopping IS the
       feedback -- the colour just confirms which one stopped under the cursor. */
    .qs-pamq-pill { transition: border-color 160ms var(--qs-ease-out); }
    .qs-pamq-pill:hover { border-color: var(--qs-blue); }
    .qs-pamq-pill:hover .qs-pamq-txt strong { color: var(--qs-blue); }
}

/* SECTION ENTRANCE. Seen once a visit, so it can afford to be noticed. Staggered
   50ms apart -- long enough to read as a cascade, short enough that the last
   section is not still arriving when the reader gets there. Never from scale(0):
   nothing in the world appears out of nothing. */
@media (prefers-reduced-motion: no-preference) {
    .qs-pev, .qs-pabout-sec, .qs-pamq, .qs-bookquotes .qs-quote-grid, .qs-spotrail, .qs-psub {
        animation: qs-rise 320ms var(--qs-ease-out) both;
    }
    .qs-pabout-sec { animation-delay: 50ms; }
    .qs-pamq { animation-delay: 100ms; }
    .qs-bookquotes .qs-quote-grid { animation-delay: 150ms; }
    .qs-spotrail { animation-delay: 200ms; }
}
@keyframes qs-rise {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Reduced motion means fewer and gentler, not none: opacity aids comprehension,
   movement is what causes sickness. */
@media (prefers-reduced-motion: reduce) {
    .qs-pev, .qs-pabout-sec, .qs-pamq, .qs-bookquotes .qs-quote-grid, .qs-spotrail, .qs-psub {
        animation: none;
    }
    /* A marquee is motion with no other purpose, so under this setting it stops
       being one -- the same state as a house too small to loop, which is why
       these five declarations are the same five as .qs-pamq--still above.
       They had already drifted: width, the centring margin and the pill's
       trailing margin were in one copy and not the other, so a reader with
       reduced motion got the row shoved left with a stray twelve pixels on the
       end. CSS cannot apply a class from inside a media query, so the copy
       stays.
       ponytail: two copies of one state, fold them into a shared selector list
       if a third "not running" case ever appears */
    .qs-pamq-track { animation: none; width: auto; }
    .qs-pamq-set { margin: 0 auto; }
    .qs-pamq-set--dup { display: none; }
    .qs-pamq-row { overflow-x: auto; overscroll-behavior-x: contain; }
    .qs-pamq-pill:last-child { margin-right: 0; }
    .qs-btn:active { transform: none; }
}