div#ldnWait{}
div#ldnWait.mail{display: flex; justify-content: flex-end; width: 100%; align-items: center; padding: 21px 3%;}
div#ldnWait.donate{display: flex; justify-content: center; flex-direction: column; width: 100%; align-items: center; padding: 21px 3%;}
div#ldnWait>div{position: relative; width: 70px; height: 70px;}
div#ldnWait.mail>div{width: 49px; height: 49px; margin-left: 14px;}
div#ldnWait>div>p{position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; border: 7px solid rgba(0,0,0,0); border-color: #a10739 rgba(0,0,0,0) rgba(0,0,0,0) #1ca0a4; animation: anmc 1s linear infinite; border-radius: 50%; margin: 0px; padding: 0px;}
div#ldnWait.donate>div>p{border-width: 10px;}
div#ldnWait>div>p:last-of-type{border-color: #fec949 rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0); animation-duration: 2s;}

body> header{background: #1e2144; color: #ffffff; /*padding: 5px;*/ overflow: auto;}
body>header> nav{background: #fec848; display: flex; justify-content: space-around; overflow: auto; flex-wrap: wrap; height: 57px; align-items: flex-start; position: fixed; top: 0; left: 0; right: 0; width: 100%; padding: 1px; z-index: 11; font-size: 14px;}
body.reports>header> nav{position: static;}
body>header>nav#bars{line-height: 0;}
body>header> nav#shopNav{top: 57px; height: initial; max-height: 10vh; background: #fec949; display: block;}
body>header>nav> button#shopMenuTgl{align-self: stretch; border: 2px solid #fec949; margin: 5px; font-size: 2.2em; width: 49px; background: rgba(0,0,0,0); color: #ffffff; border-radius: 7px; cursor: pointer; display: none;}
body>header>nav> button#shopMenuTgl:hover{background: #000000;}
body>header>nav#shopNav> div#shopMenu{display: flex; justify-content: space-around; flex-wrap: nowrap; margin: 0px; padding: 1px;}
body>header>nav#shopNav>div#shopMenu> form{margin: 0px 7px; padding: 0px;}
body>header>nav#shopNav>div#shopMenu> form>input, body>header>nav#shopNav>div#shopMenu> form>select, body>header>nav#shopNav>div#shopMenu> form>button{height: 28px; font: 500 1.1em sans-serif;}
body>header>nav#shopNav>div#shopMenu> form>select{margin: 0px 3px; padding: 1px 2px; max-width: 14vw;}
body>header>nav#shopNav>div#shopMenu> form.srch{}
body>header>nav#shopNav>div#shopMenu> form.srch>input, body>header>nav#shopNav>div#shopMenu> form.srch>button{float: left; margin: 0px; padding: 1px 3px; border: 1px solid #fec949; background: #1ca0a4; color: #ffffff;}
body>header>nav#shopNav>div#shopMenu> form.srch>input::placeholder{color: #ffffff;}
body>header>nav#shopNav>div#shopMenu> form.srch>input:focus{padding-left: 7px; background: #0f5557;}
body>header>nav#shopNav>div#shopMenu> form.srch>button:hover{background: #0f5557; color: #ffffff;}
body>header>nav#shopNav>div#shopMenu> form.srch>input{min-width: 35vw; font-size: 1.2em;}
body>header>nav#shopNav>div#shopMenu> form.srch>button{min-width: 48px; font-size: 1.4em;}
body>header>nav> a{display: flex; align-items: center; justify-content: center; font-weight: 500; margin: 0px; padding: 2px 7px; color: #fec949; text-decoration: none; height: 100%;}
body>header>nav> a>img{min-width: 42px; min-height: 35px;max-width: 180px; max-height: 49px; padding: 3px; object-fit: contain;}
body>header>nav> div{padding: 5px;}
body>header>nav>div> img{width: 48px; max-height: 45px; display: none; cursor: pointer; margin: 8px auto; object-fit: contain;}
body>header>nav>div> ul{display: inline-block;list-style-type: none; padding: 0px; margin: 3px;}
body>header>nav>div>ul> li{display: inline-flex; font-family: "Quicksand", sans-serif;} 
body>header>nav>div>ul>li> a:link, body>header>nav>div>ul>li> a:visited{font-weight: 500; margin: 0px; padding: 2px 7px; color: #fec949; text-decoration: none;}
body>header>nav>div>ul>li>div.nav-lnks, body>header>nav>div>ul>li>a.nav-lnks{font-weight: 500; margin: 0px; padding: 2px 2px; color: #212153; text-decoration: none; position: relative; cursor: pointer; font-family: "Quicksand", sans-serif;}
body>header>nav>div>ul>li>div.nav-lnks:hover{color: #c8510e; text-decoration: none;}
body>header>nav>div>ul>li>div.nav-lnks>div.nav-links-hover{display: flex; flex-direction: column; position: absolute; background: #fec949; top: 35px; left: 0px; width: 240px; max-width: 91vw; border-radius: 0px 0px 5px 5px; z-index: 1;}
body>header>nav>div>ul>li>.nav-lnks>span{margin: auto; display: block; padding: 7px; font-size: 14px; font-family: 'Quicksand', sans-serif; letter-spacing:1.5px; font-weight: 800; }
/* body>header>nav>div>ul>li>div.nav-lnks>div.nav-links-hover>a{ border-bottom: 1px solid #1ca0a4; text-align: left;} */
/* body>header>nav>div>ul>li>div.nav-lnks>div.nav-links-hover>a:hover{text-decoration: underline;} */
/* body>header>nav>div>ul>li> a:hover, body>header>nav>div>ul>li> a:active{text-decoration: underline;} */
body>header>nav>div>ul> li:last-of-type{background: #c8510e; background: #fff; border: 1px solid #1e2144; color: #000000; padding: 7px; border-radius: 4px; font-weight: 500;}
body>header>nav>div>ul> li:last-of-type>a{color: #000000;}
body>header>nav> aside{padding: 3px;}
body>header>nav>aside> a{border: 1px solid #fec949; border-radius: 5px; padding: 2px; margin: 0px; position: relative; overflow: hidden; cursor: pointer; display: block;}
body>header>nav>aside> a:hover{background: #000000; box-shadow: 2px 2px 3px #ffffff;}
body>header>nav>aside>a> img{width: 42px; height: 35px;}
body>header>nav>aside>a> img+span{font-size: 1.3em; color: #fec949; position: absolute; left: 3px; top: 0px; right: 0px; text-align: center; width: 100%; overflow: hidden; text-overflow: ellipsis;}
body>header>nav>aside>a> img+span>sup{padding: 0px; margin: 0px; position: absolute; top: -7px; right: 4px; font-weight: 700;}



body> main{}
body>main> *{ overflow: auto;}
body>main>article> aside{ background-image: url("/images/2023/somo_website_homepage_yellow_pattern\ background_1.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;}
body>main>article>aside> div{padding: 42px 1%; display: flex;}
body>main>article>aside> div:first-of-type{ flex-direction: column; justify-content: center; text-align: center;}
body>main>article>aside>div:first-of-type> h2{font-size: 3em; color:#c8510e; margin: 20px 1%;}
body>main>article>aside>div:first-of-type> iframe{width: 620px; max-width: 100%; height: 348px; max-height: calc(100vw / 16*9); align-self: center; border: 1px solid #1e2144; margin: 35px 2px;}
body>main>article>aside>div:first-of-type> a:link, body>main>article>aside>div:first-of-type> a:visited{background: #c8510e; color: #ffffff; align-self: center; padding: 9px 14px; text-transform: uppercase; text-decoration: none; border-radius: 7px;}
body>main>article>aside>div:first-of-type> a:hover, body>main>article>aside>div:first-of-type> a:active{text-decoration: underline;}
/* div.be-friends:last-of-type{ background-image:url(images/2023/somo_website_homepage_yellow_pattern_background_1.png) space-around; flex-wrap: wrap; min-height: 300px; align-items: center; padding: 42px 1%; width: 100%;} */
div.be-friends:last-of-type> h2{font-size: 3em; color: #c8510e; margin: 1px auto; max-width: 200px; font-family: "Quicksand", sans-serif;}
div.be-friends:last-of-type> form{color: #ffffff; max-width: 480px; margin: 14px auto;}
div.be-friends:last-of-type>form> p{padding: 1px; margin: 9px 0px; font-size: 1.2em; color: #ffffff; text-align: center;}
div.be-friends:last-of-type>form>div.mails{display: flex; max-width: 98vw; justify-content: center;}
div.be-friends:last-of-type>form>div.mails>input{height: 42px; margin: 3px 0px; padding: 9px; font-size: 1em; border: none; white-space: nowrap; color: #000000;}
div.be-friends:last-of-type>form>div.mails>input:first-of-type{width: 360px; max-width: 70%; background: #ffffff; border-radius: 4px 0 0 4px; flex-grow: 1; border:2px solid #1e2144;}
div.be-friends:last-of-type>form>div.mails>input:first-of-type:focus{outline: none;}
div.be-friends:last-of-type>form>div.mails>input:last-of-type{background:#1e2144; cursor: pointer; border-radius: 0 4px 4px 0; color:#ffc83b; font-family: 'Quicksand', sans-serif}
div.be-friends:last-of-type>form> div#mailResp{padding: 7px; font-size: 1.4em; color: #000000;}


body>main>article>div.partners{
 background: #fec848;
 color: #000000;
 padding: 21px 1%;
}
body>main>article>div.partners h2{
 color: #C4233C;
 text-align: center;
 margin: 14px auto;
 font-size: 2.8em;
}
body>main>article>div.partners div{
 max-width: 840px;
 margin: 7px auto;
 display: flex;
 justify-content: space-around;
 flex-wrap: wrap;
 align-items: center;
}
body>main>article>div.partners div a{
 color: #000000;
 text-decoration: none;
}
body>main>article>div.partners div a img{
 max-width: 150px;
 max-height: 105px;
 object-fit: contain;
 border-radius: 3px;
 margin: 7px;
 width: 105px;
 height: 105px;
}


/*body>footer{background: #1e2144; padding: 1% 1% 10vh; display: flex; justify-content: space-around; flex-wrap: wrap; overflow: auto;}
body>footer> div{color: #ffffff;}
body>footer> div.adm{width: 100%; text-align: center;}
body>footer> div:last-of-type{position: relative;}
body>footer>div> p{margin: 1px; padding: 1px;}
body>footer>div> p>span{display: block; margin: 21px 1px;}
body>footer>div> p>span>a:link, body>footer>div> p>span>a:visited{color: #ffffff; text-decoration: none;}
body>footer>div> p>span>a:hover, body>footer>div> p>span>a:active{text-decoration: underline;}
body>footer>div> a:link, body>footer>div> a:visited{background: #1e2144; color: #ffffff; margin: 2px; padding: 14px; border-radius: 50%; height: 50px; width: 50px; display: inline-block; text-align: center; font-size: 1em; text-decoration: none;}
body>footer>div> a:hover, body>footer>div> a:active{text-decoration: underline;}
body>footer>div> a:hover:after{content: attr(title); position: absolute; display: block; background: #1e2144; color: #ffffff; margin-top: 14px; left: 2px; padding: 4px; border-radius: 3px;}*/

@keyframes msgTimeout{
 0%{width: 0%;}
 100%{width: 100%;}
}
@keyframes msgTimeoutB{
 0%{width: 0%;}
 100%{width: 100%;}
}


@media screen and (max-width: 920px){
  body>header>nav> button#shopMenuTgl{display: block; overflow: hidden;}
  body>header>nav> button#shopMenuTgl>i.fa-close{color: #a10739; background: #fec949; outline: 9px solid #fec949;}
  body>header> nav#shopNav{height: 91vh; max-height: 100vh; width: 0%; padding: 0px;}
  body>header>nav#shopNav> div#shopMenu{flex-direction: column;}
  body>header>nav#shopNav>div#shopMenu> form{margin: 14px 7px; padding: 0px; order: 1}
  body>header>nav#shopNav>div#shopMenu> form>input, body>header>nav#shopNav>div#shopMenu> form>select, body>header>nav#shopNav>div#shopMenu> form>button{height: 35px; margin: 7px 3px;}
  body>header>nav#shopNav>div#shopMenu> form>select{max-width: 98vw;}
  body>header>nav#shopNav>div#shopMenu> form.srch>input{width: 70%; font-size: 1.2em;}
  body>header>nav#shopNav>div#shopMenu> form.srch>button{width: 21%; font-size: 1.4em;}

  body>header>nav>div> img,body>header>nav>div>ul> li, body>header>nav>div>ul>li> a{display: block;} 
  body>header>nav> a{order: 2; border: 1px solid rgba(0,0,0,0); border-radius: 7px;} 
  body>header> nav{}
  body>header>nav> div{order: 1; position: relative;} 
  /*body>header>nav> a>img{ align-self: flex-end;}*/
  body>header>nav> a:hover{border: 1px solid #1ca0a4;}
  body>header>nav> aside{order: 3;} 
  body>header>nav>div> ul{display: none; position: absolute; padding: 0px 1% 42px; min-width: 200px; background: #1e2144;}
  body>header>nav>div>ul> li .nav-lnks>span{min-height: 42px; text-align: left; color:#fff;}
  body>header>nav>div>ul> li .nav-lnks>span:hover{color:#c8510e; text-decoration: none;;}
  body>header>nav>div>ul> li:last-of-type{margin-top: 14px;}
  body>header>nav>div>ul> li:last-of-type >a:link, body>header>nav>div>:last-of-type >a:visited{padding-top: 2px;}
  body>header>nav>div>ul>li> a:link, body>header>nav>div>ul>li> a:visited{padding-top: 14px; /*border-bottom: 2px solid #fec949;*/}
  body>header>nav>div>ul>li>div.nav-lnks>div.nav-links-hover{left: 50px; width: 240px;}
  body>main>article> div, body>main>section> div{flex-direction: column; padding: 5%;}
  body>main>article>div> img, body>main>section>div> img{width: 100%; max-height: 500px; order: 1; object-fit: cover; object-position: 0px 0px; border-radius: 7px;}
  body>main>article>div> p, body>main>section>div> p{width: 100%; order: 2;}
  body>header> section.adm{flex-wrap: wrap; padding: 7px; justify-content: center;}
  body>header>section.adm> div{min-width: 280px; max-width: 99%;}
  body>header>section.adm>div:last-of-type>form> label, body>header>section.adm>div:last-of-type>form> div>label, body>header>section.adm>div:last-of-type>form> div{width: initial;}
  body>main> article#showItem{top: 57px;}
  body>main>article#showCart>div#itmLst> p{flex-wrap: wrap;}
}
@media screen and (max-width: 800px){ body>header>aside> h1{font-size: 5em;}}
@media screen and (max-width: 480px){ body>header>aside>div> h2{font-size: 3em;}
body>header>aside> div:last-of-type{/*flex*/}
body>main>article#cartPayment>div> form{min-width: initial;}
body>main>article#trackOrder>div#ordLst> div, body>main>article#showCart>div#itmLst> p{flex-direction: column; text-align: left; align-items: flex-start;}
body>main>article#trackOrder>div#ordLst> div>b, body>main>article#trackOrder>div#ordLst> div>i, body>main>article#showCart>div#itmLst> p>b, body>main>article#showCart>div#itmLst> p>i{border-bottom: 1px solid #ffffff; display: block;}
body>main>article#showItem> div{width: 100%;}
body>main>article#showItem>div#img> i#viewImgs{display: none;}}
@media screen and (max-width: 400px){ body>main>article>div> p>strong, body>main>section>div> p>strong{font-size: 2em;} 
div.be-friends:last-of-type>form>div.mails>input:first-of-type{width: 200px;}}
@media screen and (min-width: 360px){wbr{display: none;}}
@media screen and (max-width: 360px){ body>header>aside>div> h2{font-size: 2em;}
body>header>aside>div:last-of-type> div{width: 98%;}
body>header>aside>div> p{font-size: 1em; letter-spacing: 0em;}
body>main>article>section>div> div{max-width: 100%;}
body>header>aside> h1{font-size: 3em;}
body>main>div> h2{font-size: 2em;}
body>header>section> h1{font-size: 3em;}
body>header>aside> h2{font-size: 3em;}
body>main>section#shopItems> a:link, body>main>section#shopItems> a:visited{width: 98%;}}
@media screen and (max-width: 320px){ body>main>aside> h2{font-size: 2em;}}

@keyframes anm{0%{height: 18vh;} 100%{height: 100vh;}}
@keyframes anmb{0%{height: 100vh;} 100%{height: 56px;}}
@keyframes anmc{100%{transform: rotate(360deg);}}
@keyframes anmd{100%{top:0px; padding: 0px; height: 0px;}}
@keyframes anme{35%{transform: scale(2.8);} 100%{transform: scale(0);}}
@keyframes anme2{50%{height: 49px; opacity: 0.5;} 100%{height: 0px; opacity: 0;}}
