#topNav {
    transition: all 0.5s;
}
#topNav.navHide {
    transform: translateY(-54px);
}

#webnav_register {
    opacity:0.8;
    border: 1px solid #ccc;
    /* color:white; */
    margin-left:12px;
}
#webnav_register:hover {
    opacity: 1;
}

#webnav_login {
    opacity:0.8;
    border: 1px solid #ccc;
}
#webnav_login:hover {
    opacity:1;
}

.web_view_slider_viewport{
    width:100%;
    overflow-x: scroll;
    position: relative;
    display: flex;
    flex-flow: nowrap;
    justify-content:flex-start;
    align-items: flex-start;
    /* border: 1px solid yellow; */
    scroll-behavior: smooth;
}
.web_quote {
    min-width: 300px;
    width: 50%;
    min-height: 300px;
    /* box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); */
    /* border: 1px solid blue; */
    padding:12px 36px;
    margin: auto;
}
.web_quote div {
    height: 50px;
    width: 50px;
    margin: auto;
    /* background-color: antiquewhite; */
}
.web_quote p {
    text-align: center;
}
.web_quote img {
    width: 100%;
    border-radius: 50%;
    object-fit: cover;
}
.web_quote_wide {
    /* min-width: 100px; */
    width:50%;
    padding:4px 12px;
}

.web_flex_a {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    align-content: space-around;
}

.web_flex_b {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    align-content: space-around;
}

.web_flex_c {
    /* aligned top */
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: space-around;
}

.web_flex_a_i {
    min-width:300px;
    width:50%;
    height:100%;
    /* min-height:480px; */
    
}


.web_flex_i {
    min-width:300px;
    width:50%;
    height:100%;
    /* min-height:480px; */
    
}

.web_flex_ii {
    aspect-ratio: 1.618 / 1;
    /* min-width:500px; */
    width:50%;
    max-width:50%;
    /* height:100%; */
    min-width:300px;
    /* min-height:480px; */
    /* border: 1px solid yellow; */
    overflow:hidden;
    
    
}

.web_flex_iii {
    /* min-width:500px; */
    width:50%;
    max-width:50%;
    height:100%;
    min-width:300px;
    /* min-height:480px; */
    /* border: 1px solid yellow; */
    padding:24px;
    
}

.web_flex_middle {
    display: flex;
    /* flex-direction: row;
    flex-wrap: wrap; */
    justify-content: center;
    align-items: center;
    align-content: center;
    /* border: 1px solid yellow; */
    flex: 1 1 auto;
    padding: 24px;
    min-width:400px;
    max-width: 50%;
}

.web_flex_v {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    align-content: stretch;
    height:100%;
    /* border: 2px solid white; */
    min-height: 300px;
    margin:5%;
    padding: 12px;
}
.web_tranparent_bg{
    background: rgba(255, 255, 255, 0.2);
    border-radius: 24px;
    padding:12px;
}

.web_flex_v_i {
    height:100%;
    /* border: 1px solid grey; */
    /* background: rgba(255, 255, 255, 0.2); */
}

.web_full_img {
    width:100%;
}

.ani_scene{
    margin: 12px;
    max-height:200px;
    /* background-color: red; */
}
.ani_frame {
    width: 50%;
    min-width:200px;
    /* max-height:60px; */
}
.ani_btn {
    width: 11%;
    min-width:10px;
}

.ani_hide {
    transform: scale(0);
    height:0px;
    margin:0px;
}
/* img.ani_hide {
    transition: all 0.3s ease-out;
    transform: scale(0.5);
} */
.ani_grow {
	animation-duration: 300ms;
	animation-name: grow;
	animation-timing-function: ease-in;
}
@keyframes grow {
	/* 0%   { transform: scale(0); }
	100% { transform: scale(1); } */
    0%   { max-height: 0px; margin: 0px;}
	100% { max-height: 200px; margin: 12px;}
}
.ani_exit {
	animation-duration: 1000ms;
	animation-name: shrink_out;
	animation-timing-function: ease-in;
}
@keyframes shrink_out {
    0%   { opacity:1; max-height: 200px; }
	100% { opacity:0; max-height: 0;}
}
@keyframes slideout {
	0%   { transform: translateY(0)    ; opacity:1   ; }
	100% { transform: translateY(-100%); opacity:0   ; }
}
.ani_enter {
	animation-duration: 500ms;
	animation-name: slidein;
	animation-timing-function: ease-in-out;
}
@keyframes slidein {
	0%   { transform: translateY(100%)  ; opacity:0   ; }
	100% { transform: translateY(0)     ; opacity:1   ; }
}

.ani_press {
	animation-duration: 300ms;
	animation-name: press;
	animation-timing-function: ease-in-out;
}
@keyframes press {
	0%   { transform: scale(1.0); opacity:1.0; }
	50% { transform: scale(0.7); opacity:0.8; }
    0%   { transform: scale(1.0); opacity:1.0; }
}





/* HOME 2 APR 2024 */
.dan_hero {
    /* min-height:50vh;
    max-height:90vh; */
    overflow: hidden;

}
.dan_hero_container {
    min-height:80vh;
    /* max-height:90vh; */
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    
    /* border: 1px solid yellow; */
    /* padding: 12px; */

}
.dan_hero_content_img_left {
    min-width:50%;
    min-height: 50vh;
    /* overflow:hidden; */
}
.dan_hero_content_img_left>img {
    min-width:130%;
    max-height: 100vh;
    min-height: 30vh;
    position: relative;
    /* transform: scale(2); */
    transform: translate(-30%, -7%);
    opacity: 50%;
    
}
.dan_hero_content_text_container{
    min-height: 50vh;
    display: flex;
    align-items: center;
}
.dan_hero_content_text {
    color:#fff;
    padding:24px;
    flex:  1 1 auto;
    /* width:50%; */

}

.dan_hero_header{
    font-size: 3rem;
    margin: 12px;
    margin-left:0;
}
.dan_hero_subheader{
    font-size: 2rem;
    /* font-weight: bold; */
    font: 100;
    margin: 12px;
    margin-left:0;
}
.dan_hero_text{
    font-size: 1.5rem;
    margin: 12px;
    margin-left:0;
}
.dan_hero_onboarding{
    max-width:100%;
    text-align: center;
    padding-top: 12px;
}

@media screen and (max-width: 1370px){
    .dan_hero_content_img_left {
        min-width:30%;
        min-height: 30vh;
    }
}

@media screen and (max-width: 800px){
    .dan_hero_content_img_left {
        min-width:20%;
        min-height: 20vh;
    }
}


.dan_hero_content_img {
    max-width:50%;
    /* min-height: 50vh; */
    /* overflow:hidden; */
}
.dan_hero_content_img>img {
    /* min-width:130%; */
    max-width: 50%;
    /* min-height: 30vh; */
    position: relative;
    /* transform: scale(2); */
    /* transform: translate(-30%, -7%);
    opacity: 50%; */
    
}
.web_tilted_img_container_right {
    margin: 18px;
    padding:6px;
    border: 1px solid #ccc;
    border-radius: 12px;
    transition: 0.6s ease all;
    transform:
        perspective(800px)
        rotateY(-15deg)
        rotateX(3deg)
        scale(0.9);
}
.web_tilted_img_container_right:hover {
    margin: 18px;
    padding:6px;
    border: 1px solid #ccc;
    border-radius: 12px;
    transform:
        perspective(800px)
        rotateY(0deg)
        rotateX(0deg)
        scale(1);
}
.web_tilted_img_container_left {
    margin: 18px;
    padding:6px;
    border: 1px solid #ccc;
    border-radius: 12px;
    transition: 0.6s ease all;
    transform:
        perspective(800px)
        rotateY(15deg)
        rotateX(3deg)
        scale(0.9);
}
.web_tilted_img_container_left:hover {
    margin: 18px;
    padding:6px;
    border: 1px solid #ccc;
    border-radius: 12px;
    transform:
        perspective(800px)
        rotateY(0deg)
        rotateX(0deg)
        scale(1);
}
.web_tilted_img_container_left>img,
.web_tilted_img_container_right>img {
    width:100%;
}
.web_padded_img{
    width:100%;
    max-height:80%;
    padding:12px;
}

.web_flex_logos {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    align-content: space-around;
    /* border: 1px solid yellow; */
    padding: 12px;
}
.web_flex_logos > img,
.web_flex_logos > a > img {
    height: 90px;
    max-height:15vw;
    max-width:100%;
    margin: 24px;
    object-fit: cover;
}

@media screen and (max-width: 800px){
    .web_flex_ii,
    .web_flex_iii {
        max-width: 90%;
        width: 90%;
    }
}


/* 2502 */
.opaque_ffbg {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 24px;
    padding:24px;
    text-align: center;
}
.opaque_ffbg2 {
    background: rgba(255, 255, 255, 0.8);
    border-radius: 24px;
    padding:24px;
    text-align: center;
}
.opaque_00bg {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 24px;
    padding:24px;
    text-align: center;
}

.dan_flex_2h,
.dan_flex_3h,
.dan_flex_4h {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: flex-start;
    align-content: space-around;
    padding: 24px;
}
.dan_flex_2h > div {
    width: 48%;
    min-width: 400px;
}
.dan_flex_3h > div {
    width: 30%;
    min-width: 400px;
}
.dan_flex_4h > div {
    width: 23%;
    min-width: 400px;
}
.dan_flex_4v {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    align-content: space-around;
    padding: 24px;
    max-height:1000px;
    overflow-y: scroll;
}
.dan_flex_4v > div {
    width: 23%;
}

.dan_web_tile_light {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 24px;
    padding:24px;
    text-align: left;
    /* border: 1px solid #999; */
    box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    min-width: 256px;
    margin:12px;
    text-decoration: none;
}
.dan_web_tile_light > img,
.dan_web_tile_light > video {
    width: 100%;
    border-radius: 12px;
    object-fit: cover;
    max-height: 140px;
    border: 1px solid #ccc;
}
.dan_web_tile_light > h3,
.dan_web_tile_light > h5 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dan_quote_2 {
    padding: 24px;
    border: 1px solid #ccc;
    border-radius: 12px;
    min-width: 350px;
    margin:12px;
}

.dan_quote_2_top {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: left;
    align-content: space-around;
    
}

.dan_quote_2_img {
    /* width: 168px; */
}
.dan_quote_2_img img:nth-of-type(1) {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    object-fit: cover;
}

.dan_quote_2_img img:nth-of-type(2) {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    position: relative;
    top: 24px;
    left: -32px;
}

.dan_quote_2_text {
    margin-left:12px;
}
.dan_quote_2_text > h5 {
    color:#999;
}