
body {
    background-color: var(--body-background);
    font-family: Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}
.colorPrimary { color: var(--pri-color); }

/* .btn { background-color: var(--hl-color); } */
/* .btn:hover { background-color: var(--hl-lite); } */


.iconBig { width: fit-content; margin: 1em auto; }
.resTextBig { font-size: 22px; text-align: center; }
.successIcon { width: 100px; height: 100px;  }

.row { margin-bottom: 0.5em; }

#ic_memProfile {
    margin-bottom: 2em;
}
#ic_memProfile .name {
    font-size: 1.75em; margin: 1em;
}

#ic_memProfile .image {
    border-radius: 50%;
    width: fit-content; height: fit-content;
    margin: 1em auto; background:#ccc;
}

#_MYACCOUNT_PAGE_TAG { margin:1em 0; }

#ic_memProfile .image .img {
    width: 100px; height: 100px; background-size: cover; background-position: center;
    border-radius: 50%;
    margin: 5px;
}

.pageTitle  {
    font-size: 1.75em;
}

section {
    overflow: hidden;
    margin: 1em 0; padding: 0;
    border-radius: 1em; border: 1px solid var(--gray-liter);
}

section div { text-align: left; }

section .sectionTitle {
    font-size: 1.5em; margin: 0; font-weight: bold;
}
section .sectionTag { margin-top: 0.75em; }

section .collection {
    border: none; margin:0; padding: 0;
}

.collection-header .wrap {
    padding: 1em;
}

a.collection-item { cursor: pointer; }

.collection-item .wrap {
    padding: 0.5em;
}

.collection-item .key {
    font-size: 0.8em; width: 100px; display: inline-block; text-transform: uppercase;
}

.collection-item .value {
    font-weight: bold;
}

#editModal { text-align: left; }
#editModal .title { font-size: 1.5em; font-weight: bold; }

#passwordForm ul { text-align: left; padding-left: 1.5em; font-size: 1em; }
#passwordForm ul li { text-align: left; list-style: square; }

#PasswordStrengthDisp { color: var(--dark-text); border-radius: 0.5em; width: fit-content; margin-bottom: 0.5em; padding: 0; text-align: center; }
#PasswordStrengthDisp.strong { color: #009501; }
#PasswordStrengthDisp.medium { color: #f90 }
#PasswordStrengthDisp.weak { color: #a00 }

.strong { color: #009501; }
.medium { color: #f90 }
.weak { color: #a00 }

main {
    min-height:400px; max-width:600px; margin:2em auto; text-align:center;    
    /* padding-top: 80px; */
}

footer {
    padding:1em 0.5em; width: 100%;
    max-width:600px; margin:1em auto;
    font-size:0.85em;
}

footer a { padding:0 0.5em; }
/* nav #ic_logo picture { height:24px; margin:0em 1em 0em 2em } */
nav #ic_logo picture img { height:24px; margin: auto 1em auto 2em }

nav #ic_logo span { color:var(--gray-dark); font-size: 20px; transform: translateY(3.5px); }

/* nav .logo { height: 40px; margin-right: 0.5em; margin:0.75em; } */


@media screen and (max-width: 620px) {
    main { width: auto; margin: 1em;}
    .container { width:100%; padding: 0; }
    .container ul { margin: 1%; padding: 0; }
    .vdoPlayer { position:fixed; width:100%; left:0; }
}
    
@media screen and (max-width: 768px) {
}
    
@media screen and (max-width: 415px) {
}

@media screen and (max-width: 320px) {
}

