html {
    background: white;
}

* {
    font-family: "Manrope", Karla !important;
    --accent: #0860F2;
    --hover: #D5D5D5;
}

#home-container {
    margin-left: auto;
    margin-right: auto;
    min-width: 640px;
    width: 75%;
    max-width: 800px;
}

#flex {
    margin-top: 32px;
    display: flex;
}

#featured-app-middle {
    width: calc(50% - 16px);
    border-radius: 24px;
    box-shadow: 0px 4px 12px 0px rgba(53,53,53,1);
    background-position: left;
background-size: cover;
}
#featured-app {
    width: calc(50% - 16px);
    border-radius: 24px;
    margin-left: 32px;
    display: block;
}
#featured-app-middle > #container{
    border-radius: 24px;
    position: relative;
    z-index: 1;
    backdrop-filter: blur(4px);
}

#featured-app-big {
    width: 100%;
    display: block;
    position: relative;
    border-radius: 24px;
    margin-top: 48px;
    padding: 0% !important;
    text-decoration: none;
    background-position: left;
    background-size: cover;
}

#featured-app-big-icon {
    position: absolute;
    width: 32px;
    height: 32px;
right: 32px;
bottom: 32px;
filter: drop-shadow(0px 4px 10px #353535);
z-index: 2;
}

#featured-app-middle-icon {
    position: relative;
    width: 32px;
    height: 32px;
    margin-top: calc(85% - 4px);
margin-bottom: calc(15% - 32px);
left: 85%;
filter: drop-shadow(0px 4px 10px #353535);

}

#featured-app-big-bg {
    position: relative;
    border-radius: 24px;
    width: 100%;
    height: 50%;
    box-shadow: 0px 4px 12px 0px rgba(53,53,53,1);
}
#featured-app-big > zero-md {
    height: 100%;
    width: 100%;
    border-radius: 24px;
    position: absolute;
    box-shadow: 0px 4px 30px 0px rgba(53,53,53,1);
    backdrop-filter: blur(4px);
}
#featured-app-middle-content {
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 2;
}
#featured-app-middle-content > zero-md {
    height: 100%;
    width: calc(100% - 64px - 32px);
    padding: 32px;
}

#somethingBetterThanThis {
    background: #f5f5f5;
    border-radius: 12px;
    padding: 8px;
    padding-top: 1px;
    display: none;
    padding-left: 24px;
    margin-bottom: 16px;
    width: 100%;
}

#spywareAppWarning {
    border: 3px solid #ff5f5f;
    border-radius: 12px;
    padding: 8px;
    padding-top: 1px;
    display: none;
    color: #ff5f5f;
    padding-left: 24px;
    margin-bottom: 16px;
    width: calc(100% - 6px);
}

.featured-appname {
    color: #353535;
    font-weight: bold;
    text-decoration: none;
}

#featured-app-small {
    width: 100%;
    color: #353535;
    text-decoration: none;
    text-overflow: "...";
    overflow: hidden;
    display: inline-block;
    border-bottom: 1px solid #c5c5c5;
    padding: 8px;
}

#featured-app-small-icon {
    height: 30px;
    vertical-align: middle;
    margin-right: 4px;
}

.featured-appname:hover {
    text-decoration: underline;
}

.app-grid {
    display: flex;
}

.featured-app-icon {
    object-fit: contain !important;
    width: 100%;
    max-height: 128px;
}

#searcherBegin, #updaterBegin {
    font-weight: 700;
    display: none;
}

#searcher, #updater {
    width: 100% !important;
}

tr {
    background: #f5f5f5;
    border-radius: 12px;
    padding: 24px;
    display: block;
    margin-bottom: 8px;
    width: calc(100% - 48px);
    display: table;
}

#searcherKeywords {
    display: none;
}

#searcherAppName, #updaterAppName {
    margin: 0;
    padding: 0;
    margin: auto;
    margin-left: 0;
    margin-right: 0;
    font-weight: 700;
    text-decoration: none;
    color: #353535;
}

#searcherAppName:hover {
    text-decoration: underline;
}

#searcherCategory {
    text-align: right;
    color: #535353;
}

#searcherIcon {

  object-fit: contain;
  max-height: 32px;
  max-width: 32px;
    margin-right: 16px;
}

#updaterIcon {

  object-fit: contain;
  max-height: 53px;
  max-width: 53px;
    margin-right: 16px;
}

#appName {
    font-weight: 900;
    margin: 0;
}

#appIcon {

  object-fit: contain;
    width: 144px;
    height: 144px;
    margin-right: 16px;
}

.button {
    text-decoration: none;
    font-weight: 700;
    color: var(--accent);
    padding: 16px;
    border-radius: 12px;
}

.button:hover {
    color: #0044b1;
}

.button-accent {
    text-decoration: none;
    font-weight: 700;
    color: white;
    background: var(--accent);
    padding: 16px;
    border-radius: 12px;
}

.button-accent:hover {
    background-color: #0044b1;
    color: white;
}

#appScreenshot {
    width: 100%;
    border-radius: 12px;
}