/* --------------------   edited mar 2026   -------------------- */
/* -------------------------------------------------------------
 * style-theme-org.css (Feb 2024)
 * Custom style for swarnolata.com/goldentwine/
 * Author:  Subrato Paul at Swarnolata Digital
 * Website: https://swarnolata.com/goldentwine/
 * CSS used here will be applied after style-theme.css
 * Basic layout: Header, Content, Footer
 * Description: One-column 992px responsive layout with fixed top nav bar, sticky footer, no sidebar.
 * Theme Color Scheme: #ffbf00
 * ---------------------------------------------------------- */
/* -------------------------------------------------------------
   Table of Content
   | import
   | root
   | nav bar
   
   | color theme
 * ---------------------------------------------------------- */
 /* style-theme-org.css */
 /* --------------------       | import       -------------------- */
    @import url('https://swarnolata.com/style/style-theme.css');
/* --------------------       import |       -------------------- */
/* -------------------- -------------------- -------------------- -------------------- -------------------- -------------------- */
/* Missing copy from dig */

/* -------------------- -------------------- -------------------- */
/* | cover background */ /* 3 components - size (theme), gradient, image */
/* | cover gradient */
/* 
https://dev.to/gmeben/animating-gradients-with-pure-css-3bi8
option 1
#135aa4, #157bc6, #178cda, #189fee, #18adfe, #2fbaff, #52c7ff, #83d7ff, #b5e7ff, #e2f6ff, #b5e7ff, #83d7ff, #52c7ff, #2fbaff, #18adfe, #189fee, #178cda, #157bc6, #135aa4
option 2
#e2f6ff, #b5e7ff, #83d7ff, #52c7ff, #2fbaff, #18adfe, #189fee, #178cda, #157bc6, #135aa4, #157bc6, #178cda, #189fee, #18adfe, #2fbaff, #52c7ff, #83d7ff, #b5e7ff, #e2f6ff
*/
/* -------------------- */

/* -------------------- */
.cover-gradient {
/* 
option 1  background: linear-gradient(-45deg, #178cda, #135aa4, #18adfe, #83d7ff);
option 2  background: linear-gradient(-45deg, #ffbb97, #fe6918, #178cda, #18adfe);
option 3  background: linear-gradient(-45deg, #ffd700, #fe6918, #178cda, #18adfe);
*/
  background: linear-gradient(-45deg, #ff9e00, #ff6d00, #ffbf00, #ffdf81);
  background-size: 400% 400%;
  -webkit-animation: animate-gradient 15s ease infinite;
     -moz-animation: animate-gradient 15s ease infinite;
       -o-animation: animate-gradient 15s ease infinite;
          animation: animate-gradient 15s ease infinite;
}
@-webkit-keyframes animate-gradient {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
@-moz-keyframes animate-gradient {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
@-o-keyframes animate-gradient {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
@keyframes animate-gradient {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
/* cover gradient | */
/* | cover plain */
.cover-plain {
  color: #fff8e1;
  background-color: #ffbf00;
}
/* cover plain | */
/* | cover image */
.cover-image-ma { 
  /* image used */ 
  background-image: url('https://swarnolata.com/asset/image/mother/cover-full-ma-winter.png');
  /* center and scale image nicely */
  background-position: center 0.1px; /* center, right */
  background-repeat: no-repeat;
  background-attachment: fixed; /* scroll, fixed, local */
  -webkit-background-size: cover;
          background-size: cover;
}
/* x cover-full-ma.png -aquatic -autumn -pastel -spring | ok -winter -summer -dapple -contrast -glow */
.cover-image-founder { 
  /* image used */ 
  background-image: url('https://swarnolata.com/asset/image/founder/cover-full-me-spring.png');
  /* center and scale image nicely */
  background-position: center 0.1px; /* center, right */
  background-repeat: no-repeat;
  background-attachment: fixed; /* scroll, fixed, local */
  -webkit-background-size: cover;
          background-size: cover;
}
/* x cover-full-me.png -glow | ok -spring -summer -dream */
/* cover image | */
/* cover background | */
/* -------------------- -------------------- -------------------- */





/* -------------------- -------------------- -------------------- -------------------- -------------------- -------------------- */
/* | root */
:root {
  --s-base-50: #fff8e1;
  --s-base-100: #ffebb2;
  --s-base-200: #ffdf81;
  --s-base-300: #ffd44d;
  --s-base-400: #ffc825;
  --s-base: #ffbf00;
  --s-base-rgb: rgb(255, 191, 0);
  --s-base-600: #ffb100;
  --s-base-700: #ff9e00;
  --s-base-800: #ff8d00;
  --s-base-900: #ff6d00;
 
  --s-alt-50: #e2f6ff;
  --s-alt-100: #b5e7ff;
  --s-alt-200: #83d7ff;
  --s-alt-300: #52c7ff;
  --s-alt-400: #2fbaff;
  --s-alt: #18adfe;
  --s-alt-rgb: rgb(24, 173, 254);
  --s-alt-600: #189fee;
  --s-alt-700: #178cda;
  --s-alt-800: #157bc6;
  --s-alt-900: #135aa4;

  --s-comp: #18c0fe;
  --s-comp-rgb: rgb(24,192,254);
}
/* root | */
/* -------------------- -------------------- -------------------- */
/* | main root | */ 

  /* -- delete dn later -- */
  :root {
  --s-base: #ff8000; /* 50% */
  --s-base-light: #ffbf80; /* 75% */
  --s-base-light-1: #ffcc99; /* 80% */
  --s-base-light-2: #ffd9b3; /* 85% */
  --s-base-light-3: #ffe6cc; /* 90% */
  --s-base-light-4: #fff2e6; /* 95% */
  --s-base-dark: #804000; /* 25% */
  --s-base-dark-1: #663300; /* 20% */
  --s-base-dark-2: #4d2600; /* 15% */
  --s-base-dark-3: #331a00; /* 10% */
  --s-base-dark-4: #1a0d00; /* 05% */
  
  /*--s-comp: #007fff; /* 50% */
  --s-comp-light: #80bfff; /* 75% */
  --s-comp-light-1: #99ccff; /* 80% */
  --s-comp-light-2: #b3d9ff; /* 85% */
  --s-comp-light-3: #cce6ff; /* 90% */
  --s-comp-light-4: #e6f2ff; /* 95% */
  --s-comp-dark: #004080; /* 25% */
  --s-comp-dark-1: #003366; /* 20% */
  --s-comp-dark-2: #00264d; /* 15% */
  --s-comp-dark-3: #001a33; /* 10% */
  --s-comp-dark-4: #000d1a; /* 05% */
}
/* ---------------------------- delete up ------------------------ */

/* | sectioning root */
body {
  color: var(--s-base-900); /* #ff6d00; 900 */
  background-color: var(--s-base-50); /* #fff8e1; 50 */
}
/* sectioning root | */
/* | content sectioning | */
/* | text content */
.blockquote-footer {
  color: #a6a6a6; /* gray ? */
}
.blockquote-footer::before {
  content: '\2014\00a0'; /* ? */
}
.figure-caption {
  color: #a6a6a6; /* gray ? */
}
hr {
  color: inherit;
  background-color: currentColor;
}
/* text content | */
/* | inline text semantic */
/* unvisited link */
a {
  color: var(--s-base-700); /* #ff9e00; 700 */
}
/* visited link */
a:visited {
  color: var(--s-base-700); /* #ff9e00; 700 */
}
/* mouse over link */
a:hover {
  color: rgba(255, 191, 0, 0.5); /* ? verify opacity 50% */
}
/* selected link */
a:active {
  color: var(--s-base-700); /* #ff9e00; 700 */
} 
/* | ? */  
.inverse-link {
  color: #b3e6fe; /* ? */
}
.inverse-link:hover {
  color: #cdeffe; /* ? */
}
code {
  color: #ff3399; /* ? vivid pink */
}
kbd {
  color: #ccffff; /* ? very pale cyan */
  background-color: #212529; /* ? */
}
pre {
  color: #212529; /* ? */  
}
.mark {
  background-color: #fcf8e3; /* ? */
}
/* ? | */
/* inline text semantic | */
.s-img-thumbnail {
  background-color: var(--s-base-900); /* #ff6d00 900 */
  border: 1px solid var(--s-base-500); /* #ffbf00; 500 */
}
/* -------------------- -------------------- -------------------- */
/* edit ??? */
#section-quote-gita .img-thumbnail {
  max-width: 600px;
  margin: 0 auto;
}
.img-thumbnail {
  background-color: #ffe6cc; /* 90% */
  border: 1px solid #ff8000; /* 50% */
}
/* -------------------- -------------------- -------------------- */
/* | Navbar */
/* #nav-org .s-nav-bar .s-nav-bar-expand-lg .s-fixed-top .nav-bar-gradient .nav-scroll .nav-bar-transparent */
/* -------------------- */
.s-nav-bar-text,
.s-nav-bar-text a {
  color: var(--s-base-50); /* #fff8e1; 50 */
}
.s-nav-bar-text a:hover,
.s-nav-bar-text a:focus {
  color: rgba(255, 248, 225, 0.75); /* 50 */
}
/* -------------------- -------------------- */
/* | nav-bar-gradient */
.nav-bar-gradient {
  background: var(--s-base-700); /* #ff9e00; 700 */
  background: linear-gradient(-45deg, #ffdf81, #ff9e00);
  background-size: 200% 200%;
  -webkit-animation: animate-nav-bar-gradient 15s ease infinite;
     -moz-animation: animate-nav-bar-gradient 15s ease infinite;
       -o-animation: animate-nav-bar-gradient 15s ease infinite;
          animation: animate-nav-bar-gradient 15s ease infinite;
}
@-webkit-keyframes animate-nav-bar-gradient {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
@keyframes animate-nav-bar-gradient {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
/* nav-bar-gradient | */
/* -------------------- */
/* | nav-bar-dark */
.nav-bar-dark {
  background: var(--s-base-700); /* #ff9e00; 700 */
}
/* nav-bar-dark | */
/* -------------------- */
/* | nav-bar-light */
.nav-bar-light {
  background: var(--s-base-200); /* #ffdf81; 200 */
}
/* nav-bar-light | */
/* -------------------- */
/* | nav-bar-transparent */
/* Refer - script/script.php */
.nav-bar-transparent {
  background: transparent;
  border-bottom: none;
}
/* nav-bar-transparent | */
/* -------------------- -------------------- */
.s-nav-bar-nav .nav-link {
  color: var(--s-base-50); /* #fff8e1; 50 */
}
.s-nav-bar-nav .nav-item.active .nav-link {
  background-color: rgba(255, 255, 255, 0.1);
}
.s-nav-bar-nav .nav-item.active .nav-link:hover,
.s-nav-bar-nav .nav-item.active .nav-link:focus {
  background-color: rgba(255, 255, 255, 0.2);
}
.s-nav-bar-nav .nav-link:hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.s-nav-bar-nav .nav-link:focus {
  background: rgba(255, 255, 255, 0.3);
  /*background: -webkit-gradient(linear, left top, left bottom, from(rgba(19, 90, 164, 0.2)), to(rgba(19, 90, 164, 0.1)));
  background: linear-gradient(to bottom, rgba(19, 90, 164, 0.2), rgba(19, 90, 164, 0.1));*/
}
.s-nav-bar-nav .show > .nav-link,
.s-nav-bar-nav .nav-link.active,
.s-nav-bar-nav .nav-link:active {
  background-color: rgba(255, 255, 255, 0.3);
}
.s-nav-bar-nav .nav-link.disabled {
  color: rgba(230, 242, 255, 0.5); /* ? */
}
/* -------------------- -------------------- -------------------- */
/* | s-nav-bar-light */
.s-nav-bar-light .s-nav-bar-brand {
  color: rgba(255, 109, 0, 0.9);
}
.s-nav-bar-light .s-nav-bar-brand:hover,
.s-nav-bar-light .s-nav-bar-brand:focus {
  color: rgba(255, 109, 0, 0.9);
}
.s-nav-bar-light .s-nav-bar-nav .nav-link {
  color: rgba(255, 109, 0, 0.55);
}
.s-nav-bar-light .s-nav-bar-nav .nav-link:hover,
.s-nav-bar-light .s-nav-bar-nav .nav-link:focus {
  color: rgba(255, 109, 0, 0.7);
}
.s-nav-bar-light .s-nav-bar-nav .nav-link.disabled {
  color: rgba(255, 109, 0, 0.3);
}
.s-nav-bar-light .s-nav-bar-nav .show > .nav-link,
.s-nav-bar-light .s-nav-bar-nav .nav-link.active {
  color: rgba(255, 109, 0, 0.9);
}
.s-nav-bar-light .s-nav-bar-toggler {
  color: rgba(255, 109, 0, 0.55);
  border-color: rgba(255, 109, 0, 0.1);
}
.s-nav-bar-light .s-nav-bar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.s-nav-bar-light .s-nav-bar-text {
  color: rgba(255, 109, 0, 0.55);
}
.s-nav-bar-light .s-nav-bar-text a,
.s-nav-bar-light .s-nav-bar-text a:hover,
.s-nav-bar-light .s-nav-bar-text a:focus {
  color: rgba(255, 109, 0, 0.9);
}
/* s-nav-bar-light | */
/* -------------------- -------------------- -------------------- */
/* | s-nav-bar-dark */
.s-nav-bar-dark .s-nav-bar-brand {
  color: var(--s-base-50); /* #fff8e1; 50 */
}
.s-nav-bar-dark .s-nav-bar-brand:hover, 
.s-nav-bar-dark .s-nav-bar-brand:focus {
  color: var(--s-base-50); /* #fff8e1; 50 */
}
.s-nav-bar-dark .s-nav-bar-nav .nav-link {
  color: rgba(255, 248, 225, 0.5);  /* 50 */
}
.s-nav-bar-dark .s-nav-bar-nav .nav-link:hover, 
.s-nav-bar-dark .s-nav-bar-nav .nav-link:focus {
  color: rgba(255, 248, 225, 0.75);
}
.s-nav-bar-dark .s-nav-bar-nav .nav-link.disabled {
  color: rgba(255, 248, 225, 0.25);
}
.s-nav-bar-dark .s-nav-bar-nav .show > .nav-link,
.s-nav-bar-dark .s-nav-bar-nav .nav-link.active {
  color: var(--s-base-50); /* #fff8e1; 50 */
}
.s-nav-bar-dark .s-nav-bar-toggler {
  color: rgba(255, 248, 225, 0.5);
  border-color: rgba(255, 248, 225, 0.1);
}
.s-nav-bar-dark .s-nav-bar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.s-nav-bar-dark .s-nav-bar-text {
  color: rgba(255, 248, 225, 0.5);
}
.s-nav-bar-dark .s-nav-bar-text a,
.s-nav-bar-dark .s-nav-bar-text a:hover,
.s-nav-bar-dark .s-nav-bar-text a:focus {
  color: var(--s-base-50); /* #fff8e1; 50 */
}
/* s-nav-bar-dark | */
/* Navbar | */
/* -------------------- -------------------- -------------------- */
/* | shadow s-nav-bar */
.s-nav-bar-shadow {
  -webkit-box-shadow: 0 2px 5px 0 rgba(255, 109, 0, 0.16), 0 2px 10px 0 rgba(255, 109, 0, 0.12); /* 900 */
          box-shadow: 0 2px 5px 0 rgba(255, 109, 0, 0.16), 0 2px 10px 0 rgba(255, 109, 0, 0.12);
  -webkit-transition: box-shadow 200ms ease-in;
     -moz-transition: box-shadow 200ms ease-in;
       -o-transition: box-shadow 200ms ease-in;
          transition: box-shadow 200ms ease-in;
}
/* shadow s-nav-bar | */
/* -------------------- -------------------- -------------------- */
#nav-org .card-dropdown {
  text-align: inherit;
  font-weight:400;
  font-size: 0.875rem;
  padding: 0;
  border-radius: 0 0 0.5rem 0.5rem;
  margin: 0;
  z-index: 99; /* ? */
}
#nav-org .card-dropdown {
  color: var(--s-base-50); /* #fff8e1; 50 */
  background-color: rgba(255, 223, 129, 0.85); /* 200 */
  background-clip: padding-box; /* ? */
  border: 1px solid rgba(255, 109, 0, 0.15); /* 900 */
  -webkit-box-shadow: 4px 0 4px -4px #fff8e1, 0 4px 4px -4px #fff8e1, -4px 0 4px -4px #fff8e1;
  box-shadow: 4px 0 4px -4px #fff8e1, 0 4px 4px -4px #fff8e1, -4px 0 4px -4px #fff8e1; /* right bottom left */
}
#nav-org .card-dropdown {
  width: 100%;
}
@media (min-width: 992px) {
  #nav-org .card-dropdown {
    width: 15rem;
  }
}
/* -------------------- */
.dropdown-item {
  color: var(--s-base-900); /* #ff6d00; 900 */
  background-color: transparent;
}
.dropdown-item:hover, .dropdown-item:focus {
  color: var(--s-base-900); /* #ff6d00; 900 */
  background-color: rgba(255, 223, 129, 0.75); /* 200 */
}
.dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: var(--s-base-900); /* #ff6d00; 900 */
}
.s-header,
.s-footer {
  color: var(--s-base-900); /* #ff6d00; 900 */
  background-color: rgba(255, 223, 129, 1); /* 200 */
}
.s-divider {
  border-top: 1px solid rgba(255, 248, 225, 0.25); /* 50 */
}
/* verify s-link ? */
.s-link {
  color: #ff8000; /*50*/
}
.s-link:hover,
.s-link:focus {
  color: #0073e6; /*45*/
  background-color: #ffd9b3; /*85*/
}
.s-link.active,
.s-link:active {
  color: #0073e6; /*45*/
  background-color: #ffcc99; /*80*/
}
.s-link.disabled,
.s-link:disabled {
  color: rgba(255, 128, 0, 0.5);
}
/* -------------------- -------------------- -------------------- */
.dropdown-menu.show[aria-labelledby=dropdown-vedanta] {
  display: flex;
  flex-wrap: wrap;
}
.dropdown-menu.show[aria-labelledby=dropdown-vedanta] .s-link {
  width: 100%;
}
.dropdown-menu.show[aria-labelledby=dropdown-vedanta] .s-link:first-child {
  width: 100%;
}
.dropdown-menu.show[aria-labelledby=dropdown-vedanta] .s-link:nth-child(2) {
  width: 100%;
}
.dropdown-menu.show[aria-labelledby=dropdown-vedanta] .s-link:nth-child(3) {
  width: 100%;
}
.dropdown-menu.show[aria-labelledby=dropdown-vedanta] .s-link:nth-child(4) {
  width: 100%;
}

/* dropdown-gita ? */
/* -------------------- -------------------- -------------------- */

/* -------------------- -------------------- -------------------- */
.svg-brand {
  font-size: 1.5rem;
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem;
  font-weight: 700;
  text-align: right;
  vertical-align:middle;
/*
  color: #e2f6ff !important;
  transition: color 2s ease;
*/
}
.svg-brand:hover, 
.svg-brand:focus {
  color: rgba(255, 109, 0, 0.75) !important;
}
.s-nav-bar-collapse {
  background-color: rgba(255, 109, 0, 0.85); /* 900 */
}
@media (min-width: 992px) {
  .s-nav-bar-expand-lg .s-nav-bar-collapse {
    background-color: inherit;
  }
}
/* -------------------- -------------------- -------------------- */
.button {
	display: inline-block;
	height: 2rem;
	line-height: 2rem;
	text-align: center;
	font-size: 16px;
	color: #e2f6ff;
	background-color: #18adfe;
	padding-left: 12px;
	padding-right: 32px;
  border-radius: 50%;
	margin: 0;/*4px 2px;*/
	text-decoration: none;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.button:hover,
.button:focus {
	color: #e2f6ff;
	background-color: #178cda;
	transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
}
.search-container {
	position: relative;
	display: inline-block;
	width: 2rem;
	height: 2rem;
	vertical-align: bottom;
	margin: 0;/*4px 2px;*/
}
.mglass {
	display: inline-block;
	pointer-events: none;
}
.searchbutton {
	position: absolute;
	font-size: 24px;
	width: 100%;
	padding: 0;
	margin: 0;
}
.search-focus:focus + .searchbutton {
	color: #e2f6ff;
	background-color: #178cda;
  border-radius: 0.25rem 0 0 0.25rem;
	transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
}
.search-focus {
	position: absolute;
	left: 100%; /* Button width-1px (Not 40px/100% because that will sometimes show a 1px line between the search box and button) */
	width: 0;
	height: 100%;
	color: #135aa4;
	background-color: #e2f6ff;
	padding: 0;
	outline: none;

	border: 1px solid #178cda;
border: none;
border-right: none;
	z-index: 10;
	transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
}
.search-focus:focus {
	width: 100%; /* 257px Bar width+1px */
	padding: 0 16px 0 0;
border-radius: 0.25rem;
}
.expandright {
	right: auto;
	left: 100%; /* 49px Button width-1px */
}
.expandright:focus {
	padding: 0 16px 0 0;
}
@media (min-width: 992px) {
.search-focus:focus {
	width: 257px;
}
.search-focus {
  left: 39px;
}
.expandright {
	left: auto;
	right: 39px; /* Button width-1px */
}
.expandright:focus {
	padding: 0 16px 0 0;
}
}
/* -------------------- -------------------- -------------------- */

.search-box {
  width: fit-content;
  height: fit-content;
  position: relative;
}
.input-search {
  height: 50px;
  width: 50px;
  border-style: none;
  padding: 10px;
  font-size: 18px;
  letter-spacing: 2px;
  outline: none;
  border-radius: 25px;
  transition: all .5s ease-in-out;
  background-color:transparent;
  background-color: #ffdf81; /*X#22a6b3; 200*/
  padding-right: 40px;
  color:#ffffff;
}
.input-search {
    background: none;
    border: 4px solid #135aa4; /* 900 */
    border-radius: 50px;
    box-sizing: border-box;
}
.input-search::placeholder{
  color:rgba(255,255,255, 1);
  font-size: 18px;
  letter-spacing: 2px;
  font-weight: 100;
}
.btn-search {
  width: 50px;
  height: 50px;
  border-style: none;
  font-size: 20px;
  font-weight: bold;
  outline: none;
  cursor: pointer;
  border-radius: 50%;
position: absolute;
  right: 0px;
  color:#ffffff ;
  background-color:transparent;
  pointer-events: painted;  
}
.btn-search:focus ~ .input-search {
  width: 300px;
  border-radius: 0px;
  background-color: transparent;
    background: #272133;
    border-radius: 10px;
  border-bottom:1px solid rgba(255,255,255,.5);
  transition: all 500ms cubic-bezier(0, 0.110, 0.35, 2);
}
.input-search:focus {
  width: 300px;
  border-radius: 0px;
  background-color: transparent;
  border-bottom:1px solid rgba(255,255,255,.5);
  transition: all 500ms cubic-bezier(0, 0.110, 0.35, 2);
}
.wraps {
  padding: 0px;
  margin-bottom: 16px;
  display: flex;
  justify-content: center;
  background-color: #178cda; /* 700 */
}
@media (min-width: 992px) {
.wraps {
  background-color: transparent;
  margin-bottom: 0;
}
}

.search-form {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  background: transparent;
  padding: 0;
  margin: 0 1rem 1rem;
}
.search-form form {
  width: 100%;
  margin: 0;
}
@media (min-width: 992px) {
  .search-form {
    margin: 0 0 0 1rem;
  }
  .search-form form {
    max-width: 570px;
  }
}
.search-form form .inner-form .input-field {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}
.search-form form .inner-form .input-field input {
  width: 2.5rem;
  height: 2.5rem;
  display: block;
  font-size: 0.875rem;
  color: #e2f6ff;
  border: 0;
  cursor: pointer;
}
.search-form form .inner-form .input-field input.placeholder {
  color: #e2f6ff;
  font-size: 0.875rem;
  font-weight: 400;
  opacity: 1;
}
.search-form form .inner-form .input-field input:-moz-placeholder {
  color: #e2f6ff;
  font-size: 0.875rem;
  font-weight: 400;
  opacity: 1;
}
.search-form form .inner-form .input-field input::-webkit-input-placeholder {
  color: #e2f6ff;
  font-size: 0.875rem;
  font-weight: 400;
  opacity: 1;
}
.search-form form .inner-form .input-field input:hover, 
.search-form form .inner-form .input-field input:focus {
  box-shadow: none;
  outline: 0;
}
.search-form form .inner-form .input-field.first .clear {
  width: 2.5rem;
  height: 2.5rem;
  position: absolute;
  top: 0;
  right: 0;
  background: transparent;
  border: 0;
  cursor: pointer;
  opacity: 0;
  z-index: 2;
  transition: opacity .2s ease-out;
}
.search-form form .inner-form .input-field.first .clear svg {
  fill: #e2f6ff;
  width: 24px;
  height: 24px;
}
.search-form form .inner-form .input-field.first .clear:hover,
.search-form form .inner-form .row .input-field.first .clear:focus {
  box-shadow: none;
  outline: 0;
}
.search-form form .inner-form .input-field.first .clear:hover svg, 
.search-form form .inner-form .input-field.first .clear:focus svg {
  fill: #e2f6ff;
}
.search-form form .inner-form .input-field.first input {
  padding: 0.375rem 0 0.375rem 2.5rem;
  width: 2.5rem;
  color: #e2f6ff;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg fill='%23fff8e1' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3e%3cpath d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3e%3c/svg%3e");
  background-position: 0.5rem 0.5rem;
  background-repeat: no-repeat;
  background-color: #135aa4;
  background-size: 24px 24px;
  border-radius: 1.25rem;
  transition: width .2s ease-in;
}
.search-form form .inner-form .input-field.first input:focus {
  width: 100%;
  padding-right: 32px;
}
.search-form form .inner-form .input-field.first input.isFocus {
  width: 100%;
}
.search-form form .inner-form .input-field.first input.isFocus ~ .clear {
  opacity: 1;
}


/* -------------------- -------------------- -------------------- */


/* Navbar | */
/* -------------------- -------------------- -------------------- */
/* | Collapse */

/* Collapse | */
/* -------------------- -------------------- -------------------- */
/* | Dropdown */

/* Dropdown | */
/* -------------------- -------------------- -------------------- */

/* -------------------- -------------------- -------------------- */
.cover-org { 
  background-image: url('https://swarnolata.com/goldentwine/image/banner/banner-org-1a.png');
  animation: cover-org-anim 15s ease infinite;
}
/* | cover org animation */
@keyframes cover-org-anim {
  0%   {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(255, 0, 0, 0.25)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
  25%  {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(128, 0, 255, 0.35)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
  50%  {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(0, 127, 255, 0.45)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
  75%  {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(0, 255, 128, 0.55)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
  100% {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(255, 1, 0, 0.65)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
}
@keyframes cover-org-anim {
  0%   {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(255, 0, 0, 0.25)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
  25%  {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(128, 0, 255, 0.35)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
  50%  {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(0, 127, 255, 0.45)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
  75%  {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(0, 255, 128, 0.55)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
  100% {background-image: linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.95), rgba(255, 1, 0, 0.65)),
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png');}
}
.cover-org-anim {
  background-image: 
  url('https://swarnolata.com/goldentwine/asset/image/banner/banner-org-1a.png'),
  linear-gradient(45deg, rgba(255, 255, 0, 0.98), rgba(255, 128, 0, 0.98), rgba(255, 0, 0, 0.98));
}
/* cover org animation | */
/* -------------------- */
.cover-gr-org {
  background: linear-gradient(270deg, rgba(255, 255, 0, 0.125), rgba(255, 128, 0, 0.125), rgba(255, 255, 0, 0.125));
  /*
  background-size: cover;
  background-size: 600% 600%;
  */
  background-size: 600% 600%;
  -webkit-animation: cover-anim-1 15s ease infinite;
  -moz-animation: cover-anim-1 15s ease infinite;
  -o-animation: cover-anim-1 15s ease infinite;
  animation: cover-anim-1 15s ease infinite;
}
@-webkit-keyframes cover-anim-1 {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
@-moz-keyframes cover-anim-1 {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
@-o-keyframes cover-anim-1 {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
@keyframes cover-anim-1 {
  0% {background-position: 0% 50%}
  50% {background-position: 100% 50%}
  100% {background-position: 0% 50%}
}
/* -------------------- */
.cover-intro {
  border: 1px solid rgba(255, 255, 0, 0.125);
}
.cover-intro h2,
.cover-intro p {
  color: #fff2e6;
}
/* -------------------- -------------------- -------------------- */
/* header | */
/* -------------------- -------------------- -------------------- */
/* 
CSS Gradient Animator 
https://www.gradient-animator.com/  
Gradient Angle, Scroll Angle
https://www.ianforrest.com/
*/
/* | section - cover half */
.s-heading-hero { 
  color: inherit; /*#ff6d00; 900 *#ff8000; ?*/
  background-color: inherit;
  /* background-color: currentColor; */
}
/* section - cover half | */
/* -------------------- -------------------- -------------------- */
/* | section - swarnolata group */
#section-group .s-heading-hero  {
  color: #333300; /* 10% */
  background-color: inherit;
}
.s-card {
  background-color: #fff2e6;
  border : 1px solid #ffe6cc;
}
/*
#card-dig.s-card {
  color: #80bfff;
  border: 1px solid #004080;
}*/
#card-org.s-card {
  color: #ffbf80;
  border: 1px solid #804000;
}
/* section - swarnolata group | */
/* -------------------- -------------------- -------------------- */





/* | Offcanvas */
/* Offcanvas | */
/* | Pagination */
/* Pagination | */
/* | Placeholder */
/* Placeholder | */
/* | Popover */
/* Popover | */
/* | Progress */
/* Progress | */
/* | Scrollspy */
/* Scrollspy | */
/* | Spinner */
/* Spinner | */
/* | Toast */
/* Toast | */
/* | Tooltip */
/* Tooltip | */
/* Component | */
/* -------------------- -------------------- -------------------- */
/* | Helper */

/* Helper | */
/* -------------------- -------------------- -------------------- */
/* | Utility */

/* Utility | */
/* -------------------- -------------------- -------------------- */
/* | Extend */
/* | Icon */

/* Icon | */
/* Extend | */

/* -------------------- -------------------- -------------------- ok*/
/* | main */
/* | main content */
.main-content {
 background-color: rgba(255, 248, 225, 0.75); /* 50 */
 box-shadow: 4px 0 4px -2px rgba(255, 223, 129, 0.5), -4px 0 4px -2px rgba(255, 223, 129, 0.5); /* 200 */
}
/* main content | */
/* | main gradient */
  .gradient-main,
  .gradient-tint,
.main-gradient {
 background-color: rgba(255, 248, 225, 0.25); /* 50 */
}
/* main gradient | */
/* main | */
/* -------------------- -------------------- -------------------- */

/* -------------------- -------------------- -------------------- ok*/
/* | component - breadcrumb */
.breadcrumb-item + .breadcrumb-item::before {
  color: var(--s-base-700); /* #ff9e00; 700 */
}
.breadcrumb-item.active {
  color: var(--s-base-900); /* #ff6d00; 900 */
}

.breadcrumb-item svg {
  fill: #01577e;
  opacity: 1;
  transition: fill 0.4s ease;  
}
.breadcrumb-item svg:hover {
  fill: #fc5203;
}
/* component - breadcrumb | */
/* -------------------- -------------------- -------------------- */

/* -------------------- -------------------- -------------------- */
/* | component - pagination */
/* | pagination */
.page-link {
  color: var(--s-alt); /* #18adfe; 500 */
  background-color: var(--s-alt-50); /* #e2f6ff; 50 */
  border-color: var(--s-alt-100); /* #b5e7ff; 100 */
}
.page-link:hover {
  z-index: 2;
  color: var(--s-base-50); /* #fff8e1; 50 */
  background-color: var(--s-base); /* #ffbf00; 500 */
  border-color: var(--s-base-700); /* #ff9e00; 700 */
}
.page-link:focus {
  z-index: 3;
  color: var(--s-alt); /* #18adfe; 500 */
  background-color: var(--s-alt-50); /* #e2f6ff; 50 */
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.page-item.active .page-link {
  z-index: 3;
  color: var(--s-alt-50); /* #e2f6ff; 50 */
  background-color: var(--s-alt); /* #18adfe; 500 */
  border: 1px solid #178cda; /* #178cda; 700 */  
}
.page-item.disabled .page-link {
  color: #6c757d;
  pointer-events: none;
  background-color: #fff;
  border-color: #dee2e6;
}
/* pagination | */
/* component - pagination | */
/* -------------------- ---------------- -------------------- */





/* | content sectioning */
/* | nav nav-tabs nav-link */
.nav-tabs {
  border-bottom: 1px solid transparent;
}
.nav-tabs .nav-link {
  background-color: var(--s-base-100); /* #ffebb2; 100 */
  border: 1px solid var(--s-base-500); /* #ffbf00; 500 */
}
.nav-tabs .nav-link:last-child {
  border-right: 1px solid var(--s-base-500); /* #ffbf00; 500 */
}
.nav-tabs .nav-link:hover, 
.nav-tabs .nav-link:focus {
  color: var(--s-base-900); /* #ff6d00; 900 */
  background-color: var(--s-base-200); /* #ffdf81; 200 */
  border-color: #ffbf00 #ffbf00 #ffbf00; /* 500 */
}
.nav-tabs .nav-link.active, 
.nav-tabs .nav-item.show .nav-link {
  color: #fe007e; /* s-rose-c bg-rose */
  background-color: inherit; /* bs-#fff */
  border-color: #ffbf00 #ffbf00 transparent /* 500 */;
}
.tab-content {
  background-color: #ffdf81; /* 200 */
  border: 1px solid var(--s-base-500); /* #ffbf00; 500 */
  border-top-color: transparent;
}
/* nav nav-tabs nav-link | */
/* -------------------- -------------------- -------------------- ok*/
/* | section */
.section-page-quote,
.section-page-last, 
.section-page {
  background-color: rgba(255, 248, 225, 1); /* 50 */
  border: 1px solid rgba(255, 223, 129, 0.5); /* 200 */
}
.theme-advertise {
  background-color: rgba(255, 235, 178, 1); /* 100 */
  border: 1px solid rgba(255, 223, 129, 0.5); /* 200 */
}
.section-page-quote {
  background-color: inherit;
  border: 1px solid transparent;
  padding: 1rem 0 0;
  margin-bottom: 0;  
}
/* section | */

/* -------------------- -------------------- -------------------- */
/* | component - scroll back to top */
#topButton {
  color: #ebf5ff;
  background-color: #007fff;
}
#topButton:hover {
  color: #008945;
  background-color: #00ff80;
} 
/* -------------------- ---------------- -------------------- */
/* | component - advertise */
.icon-times,
.icon-info,
.icon-link {
  color: #ff003f;
  background: #fff0f0;
}
.icon-info {
  border-right: 1px solid #ffbdbd;
}
.icon-times:hover,
.icon-info:hover,
.icon-link:hover {
  color: #0066ff;
}
span.tag {
  color: #0066ff;
  background: #fff0f0;
}
/* component - advertise | */
/* -------------------- ---------------- -------------------- */




/* -------------------- -------------------- -------------------- */
/* | content page */
#content-table ul {
  padding-left: 0;
  list-style-type: none;
}
#content-table ul ul {
  padding-left: 1rem;
}
#content-table a {
  text-decoration: none;
}
#content-table a:hover {
  text-decoration: underline;
}
/*
#form-contact-thank .back-home a,
#form-newsletter-thank .back-home a,
.container-min .back-form a {
  width: 150px;
  font-size: 1rem;
  color: #ffdb4d; 
  border-radius: 0.5rem;
}
*/
/* 
#main-content h1, #main-content h2, #main-content h3 {
  color: #000a27; shade-2 
}
#main-content .section-header,
#main-content .section-footer {
  background-color: inherit;
}
#main-content .section-header {
  border-bottom: none;
  padding: 1rem 0 0;
}
#main-content .section-footer {
  border-top: none;
  padding: 1rem 0;
}
*/
/* content page | */
/* -------------------- -------------------- -------------------- */
/* article */
/* -------------------- -------------------- -------------------- */
/* aside */
/* -------------------- -------------------- -------------------- */
/* h1 - h6 */
/* h1, h2, h3 {
  color: #001427; shade-2 
}*/
/* -------------------- -------------------- -------------------- */
/* header */
/* -------------------- -------------------- -------------------- */
/* hgroup */
/* -------------------- -------------------- -------------------- */
/* footer */
/* -------------------- -------------------- -------------------- */
/* address */
/* -------------------- -------------------- -------------------- */
/* content sectioning | */

/* -------------------- -------------------- -------------------- -------------------- -------------------- -------------------- */

/* ====================  | Page Content  ==================== */

.s-page-content {
  max-width: 1180px;
  background: #efffff /* s-cl-t13-bg */; 
     -moz-box-shadow: 0 0 16px #007a7a; 
  -webkit-box-shadow: 0 0 16px #007a7a; 
          box-shadow: 0 0 16px #007a7a /* s-cl-s7 */;
}


/* ====================  Page Content |  ==================== */

/* ====================     | Footer     ==================== */

.footer-content {
  color: #9dffff; /* s-c-t8-c */
  background-color: #002727; /* s-c-s2-bg */
  overflow: hidden;
}
.footer-content a {
  color: rgba(255, 255, 255, 0.5);
}
.footer-content a:hover {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
}

.footer-content .form-control {
  display: block;
  display: inline-block;
  width: 80%;
}

.footer-copyright {
  color: #c4ffff; /* s-c-t10-c */
  background-color: #001414; /* s-c-s1-bg */
  overflow: hidden;
}
.footer-copyright a {
  color: rgba(255, 255, 255, 0.5);
}
.footer-copyright a:hover {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
}
/* | social icons */
.footer-social .fab {
  width: 24px; /*28px;*/
  text-align: center;
  font-size: 12px; /*16px;*/
  color: #c4ffff; /* s-c-t10-c */
  background: #c4ffff;
  padding: 4px; /*6px;*/
  border-radius: 50%;
  text-decoration: none;
  -webkit-transition: ease all 0.5s;
     -moz-transition: ease all 0.5s;
       -o-transition: ease all 0.5s;
          transition: ease all 0.5s;
}
.footer-social .fa-twitter {color: #1da1f2}
.footer-social .fa-facebook-f {color: #3b5998}
.footer-social .fa-instagram {color: #e4405f}
.footer-social .fa-linkedin-in {color: #0077b5}
.footer-social .fa-pinterest-p {color: #bd081c}

.footer-social .fa-dribbble {color: #ea4c89}
.footer-social .fa-github-alt {color: #4078c0}

.footer-social .fa-twitter:hover {color: #c4ffff; background: #1da1f2}
.footer-social .fa-facebook-f:hover {color: #c4ffff; background: #3b5998}
.footer-social .fa-instagram:hover {color: #c4ffff; background: #e4405f}
.footer-social .fa-linkedin-in:hover {color: #c4ffff; background: #0077b5}
.footer-social .fa-pinterest-p:hover {color: #c4ffff; background: #bd081c}
.footer-social .fa-github-alt:hover {color: #c4ffff; background: #4078c0}
 
.footer-social .fa-dribbble:hover {color: #c4ffff; background: #ea4c89}

@media only screen and (max-width: 768px) {
.footer-social .fab {width:24px; font-size:12px; padding:6px;   margin-left:2px}
}
@media (min-width:601px) and (max-width: 1270px){
}
/* social icons | */
/* --------------------     footer |     -------------------- */

/* --------------------      | form      -------------------- */
/* 
   https://www.w3.org/TR/html4/interact/forms.html
   https://www.w3.org/TR/html52/sec-forms.html
   form search
   https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/search
*/
#form-nav .form-control {
  display: block;
  width: 100%;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #ff6d00;
  background-color: #fff8e1;
  background-clip: padding-box;
  padding: 0.375rem 0.75rem;
  border: 1px solid #fff8e1;
  border-right: none;
  border-radius: 0.25rem 0 0 0.25rem;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
#form-nav .search-icon {
  border: none;
  border-radius: 0 0.25rem 0.25rem 0;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
#form-nav .form-control:focus {
  color: #ff6d00;
  background-color: #fff8e1;
  border-color: #ffbf00;
  outline: 0;
  box-shadow: none;
  /*box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);*/
}
#form-nav .form-control::placeholder {
  color: #ff6d00;
  opacity: 1;
}
/* edit ? */
#form-nav .input-group-text {
  color: #7a0000;
  background-color: #a4ffff;
}
#form-nav .input-group-text:hover {
  background-color: #ffa4a4;
  /*border: 1px solid #ffa4a4;*/
}
/*
#form-nav .form-control,
#form-nav .input-group-text {
  border: 1px solid #ffa4a4;
}
#form-nav .form-control {
  color: #7a0000;
  background-color: #fff0f0;
}
#form-nav .form-control:hover,
#form-nav .form-control:focus {
  background-color: #f0ffff;
  *border: 1px solid #a4ffff;*
}
#form-nav .input-icon {
  color: #7a0000;
}
#form-nav .form-control::placeholder {
  color: #7a0000;
}
*/

/* ---------------------------------------------------------- */
.form-contact,
.form-newsletter {
  background-color: #bceafe; /* tint-10-bg */
  padding: 1rem;
  border: 1px solid #35bffd; /* bb-b */
  border-radius: 0.25rem;
}
/* ---------------------------------------------------------- */
/* form contact - thank */

.container-min {
  width: 100%; 
  max-width: 960px;
  padding: 0; 
  margin: 0 auto;
}
#form-contact-thank,
#form-newsletter-thank {
  border: 0.5rem solid #e6b800;
  border-radius: 1rem;
} 
#form-contact-thank h1,
#form-contact-thank h2,
#form-contact-thank h3,
#form-newsletter-thank h1,
#form-newsletter-thank h2,
#form-newsletter-thank h3 {
  letter-spacing: 0.025cm; 
  padding: 0 0 0.5rem;
}
#form-contact-thank h3.corporate,
#form-newsletter-thank h3.corporate {
  /* font-weight: bold; */
  color: #ffcc00;
  padding: 0 0 1rem;
}
#form-contact-thank p,
#form-newsletter-thank p {
  color: #e3f6ff; /* tint-12 */
}
#form-contact-thank p:last-child,
#form-newsletter-thank p:last-child {
  margin-bottom: 0 !important;
}
#form-contact-thank p.copyright,
#form-newsletter-thank p.copyright {
  text-align: center;
  font-size: 0.75rem;
}
#form-contact-thank .back-home,
#form-newsletter-thank .back-home {
/* .container-min .back-form { */
  text-align: left;
}
#form-contact-thank .back-form,
#form-newsletter-thank .back-form {
  text-align: right;
}
#form-contact-thank .back-home a,
#form-newsletter-thank .back-home a,
.container-min .back-form a {
  width: 150px;
  font-size: 1rem;
  color: #ffdb4d; /* mono-7 */
  border-radius: 0.5rem;
}
#form-contact-thank .box,
#form-newsletter-thank .box,
#form-contact-thank .image-404,
#form-newsletter-thank .image-404,
#form-contact-thank .boxErr,
#form-newsletter-thank .boxErr,

#form-contact-thank .container-message,
#form-newsletter-thank .container-message {
  font-size: 1rem;
  color: #e3f6ff; /* tint-12 */
  padding: 1rem 0;
  margin-bottom: 1rem;
}
#form-contact-thank .image-404,
#form-newsletter-thank .image-404 {
  min-height: 200px;
  background: transparent url(https://swarnolata.com/image/icon-404.png) center center no-repeat;
}
.border-black-65,
.b-b-rgba {
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
     -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
          box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25)
}

/* --------------------      form |      -------------------- */




/* -------------------- -------------------- -------------------- -------------------- -------------------- -------------------- */
/* | edit jun 21 | mar 26 */

/* -------------------- -------------------- -------------------- */
/* | section - hero canvas (cover) */
/*https://www.quackit.com/css/color/values/css_currentcolor_keyword.cfm*/
#section-hero {
  min-height: 384px;
  padding-top: 5rem;
  padding-bottom: 1rem;
}
.s-heading-hero { 
  font-weight: 600;
  font-size: 4rem;
  text-shadow: 0 0 4px rgba(255, 255, 255, 1);
  padding: 2rem 1rem 1rem;
}
@media (max-width: 767.8px) {
  .s-heading-hero  {
    font-size: 3rem;
  }
}
@media (max-width: 575.8px) {
  .s-heading-hero  {
    font-size: 2.5rem;
  }
}
/* section - hero canvas | */
/* -------------------- -------------------- -------------------- */

/* -------------------- -------------------- -------------------- */
/* | gita hero ? *
.gita-shloka-hero {
  color: #ff6d00;
  background: #fff8e1  url('https://swarnolata.com/goldentwine/quote-art/shloka/shloka-image/shloka-1a.png') repeat-x repeat-y;
  text-align: center;
  padding: 0;
  border: 0;
  margin-top: 16px;
  margin-bottom: 16px;
}
* gita hero | */
/* -------------------- -------------------- -------------------- */




/* delete later dn */      
.gita-shloka-up, 
.gita-shloka-mid, 
.gita-shloka-dn {
  background: transparent url('https://swarnolata.com/goldentwine/gita/gita-scroll/gita-scroll-1-sunrise.png') no-repeat;
  /* gita-scroll-1-org | gita-scroll-1-glow-sun | gita-scroll-1-sunrise */
  padding: 8px 60px;
} 
.gita-shloka-up {
  background-position: center top;
  padding-top: 70px;
}
.gita-shloka-mid {
  background-position: center center;
}
.gita-shloka-dn {
  background-position: center bottom;
  padding-bottom: 70px;
}
/* | gita verse */
.gita-shloka {
  color: var(--s-base-900); /* #ff6d00; 900 */
  background-color: var(--s-base-100); /* #ffebb2; 100 */
  border: 2px solid #ffdf81; /* 200 */
  border-radius: 0.25rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
}
       .gita-shloka img {width: 100%; max-width: 600px;} /* ? */

/* not working for gita-shloka-mid p */
.gita-shloka-up h4,
.gita-shloka-up p,
.gita-shloka-mid h4,
.gita-shloka-mid p,
.gita-shloka-dn h4 {
 display: flex !important;
 justify-content: center !important;
}

.gita-shloka-audio {
  min-height: 288px;
  background: transparent url('https://swarnolata.com/goldentwine/gita/gita-scroll/gita-scroll-4-sunrise.png') no-repeat;
  padding: 50px 40px;
} 

/* delete later up */

/* -------------------- -------------------- -------------------- */ /* -------------------- -------------------- -------------------- */

/* | header */
#gita-shloka h2,
#gita-shloka h3,
#gita-shloka h4 {
  display: flex !important;
  justify-content: center !important;
}
#gita-shloka .heading-shloka  {
  font-weight: 500;
  font-size: 3rem;
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
  color: inherit; /*#ff6d00; 900 */
  background-color: inherit;
  padding: 1rem;
}
@media (max-width: 767.8px) {
  #gita-shloka .heading-shloka  {
    font-size: 2.5rem;
  }
}
@media (max-width: 575.8px) {
  #gita-shloka .heading-shloka  {
    font-size: 2rem;
  }
}
/* header | */

/* -------------------- -------------------- -------------------- */

/* edit apr 26 dn */
/* --------------------        | Gita        -------------------- */

/* -------------------- -------------------- -------------------- */
.gita-shloka-audio {
  min-height: 288px;
  background: transparent url('https://swarnolata.com/goldentwine/gita/gita-scroll/gita-scroll-4-sunrise.png') no-repeat;
  padding: 50px 40px; /*24px 48px*/
}

/*
#chapter-verse .row-shloka {
  align-items: flex-start !important; 
  justify-content: center !important;
}
  */
.gita-shloka-sanskrit {
   background: transparent url('https://swarnolata.com/goldentwine/gita/gita-scroll/gita-scroll.png') no-repeat center center;
   background-size: cover; /* This makes the background image responsive */
  /* height: 100vh; Set a height (e.g., 60% of the viewport height) */
  /*width: 100%;
   img src='' alt='' class='responsive'
  */
  /* s-img-fluid */
   max-width: 100%;
   height:auto;
  /*min-height: 430px;*/
  padding-bottom: 72px;
}
.gita-shloka-commentary {
  padding-bottom: 1rem;
}
.gita-shloka-sanskrit h3,
.gita-shloka-english h3, 
.gita-shloka-commentary h3 {
 margin-top: 3rem !important;
 margin-bottom: 1rem !important;
}
.gita-shloka-commentary h3 {
 margin-top: 1rem !important;
}
.gita-shloka-sanskrit p {
 font-weight: bolder;
 text-align: center;
}
.gita-shloka-english p,
.gita-shloka-commentary p {
 text-align: justify !important;
}
.gita-shloka-sanskrit img {
  display: flex !important;
  justify-content: center !important;
}
/*
    max-width: 100%;
  height: auto; * preserves image aspect ratio *
}
*/



/*
.w3-content600 | s-container-600
.w3-display-container | s-container-display
*/
.s-container-600 {
  max-width: 600px; 
  margin:auto;
}
.s-container-display {
  position: relative;
}
.s-container-display:hover .s-display-hover {display: block;}
.s-container-display:hover span.s-display-hover {display: inline-block;}
.s-display-hover{display:none}
.w3-display-topmiddle,
.s-display-topmiddle {
  position: absolute; 
  left: 50%; 
  top: 0; 
  transform: translate(-50%,0%); 
  -ms-transform: translate(-50%,0%);
}

.gita-1 {
  width: 100%;
  max-width: 400px;
  background: url('https://swarnolata.com/goldentwine/gita/gita-scroll/divider-gold-1.png') center center no-repeat;
  border: 0;
  margin: 0 auto;
}
.gita-2 {
  /*width:100%;max-width:400px;*/
  background: transparent url('https://swarnolata.com/goldentwine/gita/gita-scroll/divider-gold-2.png') center center no-repeat;
  border: 0;
}

/* ??? edit ??? */
  .shloka {color:#764700;/*#895200;*/
    background:#ffd89d url('https://swarnolata.com/goldentwine/quote-art/shloka/shloka-image/shloka-1a.png') repeat-y;
    text-align:center;padding:0;border:4px solid #ff9900;border-radius:8px;margin-top:16px;margin-bottom:16px}
    .shloka-quote-up,.shloka-quote-mid,.shloka-quote-dn,.shloka-audio{
    background-color:transparent;
    background-image:url('https://swarnolata.com/goldentwine/quote-art/shloka/shloka-image/shloka-1c.png'); /*shloka-1b.png*/
    background-repeat:no-repeat;
    padding:8px;border:1px solid #ffd089;box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 8px 0 rgba(0,0,0,0.12)} /* .w3-card-2 */
    .shloka-quote-up{background-position:center top;padding-top:50px;border-bottom:0;border-radius:8px 8px 0 0;margin-top:16px}
    .shloka-quote-mid{background-position:center center;border-top:0;border-bottom:0}
    .shloka-quote-dn{background-position:center bottom;padding-bottom:50px;border-top:0;border-radius:0 0 8px 8px;margin-bottom:16px}
    .shloka-audio{background-position:center center}

    
    .w3-padding-16 { /* py-1 */
  padding-top: 16px!important; padding-bottom: 16px!important;
}
.w3-title{font-size:20px;font-weight:500;color:inherit;margin-top:0!important;margin-bottom:0!important}
.w3-title a{color:#ebf3ff!important/*tint-12*/}
.w3-title a:hover{color:#c4dcff!important/*tint-10*/}

/* -------------------- -------------------- -------------------- */

/* | carousel-quote */
/* mdb */
#section-quote-gita .carousel-wrapper {
  margin: 1rem auto 0 !important;     
}
/*#section-quote-gita .carousel-inner {
  box-shadow: 0 5px 11px 0 rgba(0,12,12,.28),0 4px 15px 0 rgba(0,12,12,.25)
}*/
#section-quote-gita .carousel-item {
  height: auto;
}
.carousel-wrapper .carousel-fade .active.carousel-item
.carousel-wrapper .carousel-fade .carousel-item {
  transition: transform .75s ease;
  transition-property: opacity
} /* ? */

.carousel-quote .carousel-indicators {
  top: 0 !important;
}
.carousel-quote .carousel-indicators li {
  background-color: #007fff;
  opacity: 1;
  transition: background-color 0.6s ease;
}
.carousel-quote .carousel-indicators .active {
  background-color: #ff0000;
}

.carousel-quote .carousel-control-prev,
.carousel-quote .carousel-control-next {
  /*bottom: 75%;
  top: 5rem;
  */
  -ms-flex-align: flex-start;
  align-items: flex-start;
  width: 5%;
  font-size: 2rem;
  color: #3399ff;
  opacity: 1;
}
@media (max-width: 576px) {
  .carousel-quote .carousel-control-prev,
  .carousel-quote .carousel-control-next {
    top: 20px;
    font-size: 1.5rem;
  }
}
.carousel-quote .carousel-control-prev:hover, .carousel-quote .carousel-control-prev:focus,
.carousel-quote .carousel-control-next:hover, .carousel-quote .carousel-control-next:focus {
  color: #ff3333;
  opacity: 1;
  transition: 0.4s;
}
/* Replace fff in fill='%23fff' parts with hex code of desired color */
.carousel-quote .carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%233399ff' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3e%3c/svg%3e");
}
.carousel-quote .carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%233399ff' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e");
}

.carousel-quote .carousel-fade .carousel-item {
  -webkit-transition-duration: 0.5s;
       -o-transition-duration: 0.5s;
          transition-duration: 0.5s;
  -webkit-transition-property: opacity;
       -o-transition-property: opacity;
          transition-property: opacity; 
}
.carousel-quote .carousel-fade .carousel-item-next,
.carousel-quote .carousel-fade .carousel-item-prev,
.carousel-quote .carousel-fade .carousel-item.active,
.carousel-quote .carousel-fade .carousel-item-left.active,
.carousel-quote .carousel-fade .carousel-item-prev.active {
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0); }
  @supports ((-webkit-transform-style: preserve-3d) or (transform-style: preserve-3d)) {
    .carousel-fade .carousel-item-next,
    .carousel-fade .carousel-item-prev,
    .carousel-fade .carousel-item.active,
    .carousel-fade .carousel-item-left.active,
    .carousel-fade .carousel-item-prev.active {
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0); } }
/* mdb */

/* carousel-quote | */

/* --------------------        gita |        -------------------- */

/* --------------------         | w3         -------------------- */
/*
goldentwine\css\sl-custom.css
goldentwine\css\w3-custom.css
C:\Users\Subrato Paul\Documents\My Websites\swarnolata\ref-css\framework
w3-css-4-07.css
*/
.w3-content800{max-width:800px;margin:auto} /* It's not needed? for Forms and Splash */
.w3-content728{max-width:728px;margin:auto} /* for Text Ad (Leaderboard) */
.w3-content600 {
  max-width: 600px; margin:auto;
} /* for 600x450 slide */
.w3-display-container {position: relative;}
.w3-display-container:hover .w3-display-hover {display: block;}
.w3-display-container:hover span.w3-display-hover {display: inline-block;}
.w3-display-hover{display:none}

.w3-display-topmiddle {position: absolute; left: 50%; top: 0; transform: translate(-50%,0%); -ms-transform: translate(-50%,0%);}
.w3-padding-16 {
  padding-top: 16px!important; padding-bottom: 16px!important;
}



.w3-border-brown {border: 1px solid #795548!important}
.w3-heading .w3-title/*, .w3-title a*/{color:#ebf3ff!important/*tint-12*/}

.w3-title{font-size:20px;font-weight:500;color:inherit;margin-top:0!important;margin-bottom:0!important}
.w3-title a{color:#ebf3ff!important/*tint-12*/}
.w3-title a:hover{color:#c4dcff!important/*tint-10*/}

.nova-square{font-family:'Nova Square',cursive}
.hover-no:hover{cursor:none!important}
.w3-title-medium{font-size:18px;font-weight:400;color:inherit;margin-top:0;margin-bottom:0!important}
.w3-title-small{font-size:16px;font-weight:300;color:inherit;margin-top:0;margin-bottom:0!important}
.w3-sub-title{font-size:18px;font-weight:400;color:inherit;margin-top:0;margin-bottom:8px}
.w3-xsub-title{font-size:16px;font-weight:200;color:inherit;margin-top:0;margin-bottom:8px}
.w3-xsmall{font-size:11px!important}

/* --------------------         w3 |         -------------------- */
/* -------------------- -------------------- -------------------- */

/* | main */
/* | content */
/* -------------------- -------------------- -------------------- */
/* | content page */


/* -------------------- -------------------- -------------------- -------------------- -------------------- -------------------- */
/* --------------------    | color theme     -------------------- */
/* -------------------- -------------------- -------------------- *
   Color Theme:

-- compare with dig --

   legend: 
   s - swarnolata | 
   dig - digital | org - foundation | gti - goldentwine | 
   ws - websafe  | c - color | bg - background | b - border | gr - gradient | btn - button  | btn-o - button outline 
   comp - complementary | scomp - split complementary | ana - analogous | tria - triadic | tetra - tetradic | mono - monochromatic | s - shade | t - tint
 * -------------------- -------------------- -------------------- */
/* | color palette foundation */
/* base and alt colors on the RGB (HSV) color wheel */
/* -------------------- ---------------- -------------------- */
/* edit - feb 9, 2024 
var(--s-base-500); * #ffbf00 500 *
*/
/* | color base */
.s-base-50-c {
  color: var(--s-base-50); /* #fff8e1; 50 */
}
.s-base-50-bg {
  background-color: var(--s-base-50); /* #fff8e1; 50 */
}
.s-base-100-bg {
  background-color: var(--s-base-50); /* #fff8e1; 50 */
}

.s-base-200-c {
  color: #ffdf81;
}
.s-base-200-bg {
  background-color: #ffdf81;
}


.s-base-c {
  color: #ffbf00;
}
a.s-base-c {
  color: #ffbf00 !important;
}
a.s-base-c:hover, 
a.s-base-c:focus {
  color: rgba(255, 191, 0, 0.75);
}
.s-base-bg {
  background-color: #ffbf00; /* 500 */
}
.s-base-bg-rgba {
  background-color: rgb(255, 191, 0, 1);
}
a.s-base-bg:hover, 
a.s-base-bg:focus {
  background-color: rgb(255, 191, 0, 0.75);
}
.s-base-b {
  border: 1px solid #ffbf00;
}

.s-base-700-c {
  color: #ff9e00;
}
.s-base-700-bg {
  background-color: #ff9e00;
}

.s-base-900-c {
  color: var(--s-base-900); /*  #ff6d00; 900 */
}
.s-base-900-bg {
  background-color: var(--s-base-900); /*  #ff6d00; 900 */
}
/* -------------------- -------------------- -------------------- */

/* edit */

.s-base-light,
.s-base-note {
  color: #135aa4; /* 900 */
  background-color: #e2f6ff; /* 50 */
  padding: 1rem;
  border: 1px solid #18adfe; /* 500 */
  border-radius: 0.25rem;
  margin-bottom: 1rem;
}
.s-base-note {
  border-left: 8px solid #18adfe;
}
.s-base-link {
  color: var(--s-base-700); /* #178cda; 700 */
  text-decoration: underline;
}
.s-base-link:hover {
  color: var(--s-base-700); /* #178cda; 700 */
  text-decoration: none;
}
.alert-base hr {
  border-top-color: #9fcdff; /* ? */
}


/*  edit  ? from old delete later */
/* lighter */
.s-base-95-bg {
  background-color: #fff2e6;
}
.s-base-90-bg {
  background-color: #ffe6cc;
}
.s-base-85-bg {
  background-color: #ffd9b3;
}
.s-base-80-bg {
  background-color: #ffcc99;
}
.s-base-light-c {
  color: #ffbf80;
}
.s-base-light-bg {
  background-color: #ffbf80;
}
.s-base-light-b {
  border: 1px solid #ffbf80;
}
.s-base-light-bg-gr {
  color: #fff2e6;
  background: linear-gradient(270deg, #ffbf80, #ff8000, #804000);
  background-size: 600% 600%;
  -webkit-animation: s-base-light-bg-anim 15s ease infinite;
  animation: s-base-light-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-base-light-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-base-light-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
.s-base-70-bg {
  background-color: #ffb366;
}
.s-base-65-bg {
  background-color: #ffa64d;
}
.s-base-60-bg {
  background-color: #ff9933;
}
.s-base-55-bg {
  background-color: #ff8c1a;
}
/* -------------------- */
/* delete old
/* -------------------- */
/* darker */
.s-base-45-bg {
  background-color: #e67300;
}
.s-base-40-bg {
  background-color: #cc6600;
}
.s-base-35-bg {
  background-color: #b35900;
}
.s-base-30-bg {
  background-color: #994d00;
}
.s-base-dark-c {
  color: #804000;
}
.s-base-dark-bg {
  background-color: #804000;
}
.s-base-dark-b {
  border: 1px solid #804000;
}
.s-base-20-bg {
  background-color: #663300;
}
.s-base-15-bg {
  background-color: #4d2600;
}
.s-base-10-bg {
  background-color: #331a00;
}
.s-base-5-c {
  color: #1a0d00;
}
.s-base-5-bg {
  background-color: #1a0d00;
}
/* -------------------- from old */









/* color base | */
/* -------------------- */


/* -------------------- -------------------- -------------------- */
/* | color base gradient */
/*
.bg-gradient {
  background-image: var(--bs-gradient) !important;
}
*/
.s-base-200-bg-gr {
  color: #ff6d00; /* 900 */
  background: linear-gradient(270deg, #fff8e1, #ffdf81, #ffbf00); /* 50, 200, 500 */
  background-size: 600% 600%;
  -webkit-animation: s-base-200-bg-anim 15s ease infinite;
          animation: s-base-200-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-base-200-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-base-200-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
.s-base-bg-gr {
  background: linear-gradient(270deg, #ff9e00, #ffbf00, #ff9e00); /* 700, 500, 700 > 200 */
  background-size: 600% 600%;
  -webkit-animation: s-base-bg-anim 15s ease infinite;
          animation: s-base-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-base-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-base-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}

.s-base-700-bg-gr {
  color: #fff8e1; /* 50 */
  background: linear-gradient(270deg, #ff6d00, #ff9e00, #ffbf00); /* 900, 700, 500 */
  background-size: 600% 600%;
  -webkit-animation: s-base-700-bg-anim 15s ease infinite;
          animation: s-base-700-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-base-700-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-base-700-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
/* color base gradient | */
/* -------------------- ---------------- -------------------- */

/* -------------------- -------------------- -------------------- */
/* | color comp gradient */
/*
.bg-gradient {
  background-image: var(--bs-gradient) !important;
}
*/
.s-comp-200-bg-gr {
  color: #135aa4; /* 900 */
  background: linear-gradient(270deg, #e2f6ff, #83d7ff, #18adfe); /* 50, 200, 500 */
  background-size: 600% 600%;
  -webkit-animation: s-comp-200-bg-anim 15s ease infinite;
          animation: s-comp-200-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-comp-200-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-comp-200-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
.s-comp-bg-gr {
  background: linear-gradient(270deg, #178cda, #18adfe, #83d7ff); /* 700, 500, 200 */
  background-size: 600% 600%;
  -webkit-animation: s-comp-bg-anim 15s ease infinite;
          animation: s-comp-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-comp-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-comp-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
.s-comp-700-bg-gr {
  color: #e2f6ff; /* 50 */
  background: linear-gradient(270deg, #135aa4, #178cda, #18adfe); /* 900, 700, 500 */
  background-size: 600% 600%;
  -webkit-animation: s-comp-700-bg-anim 15s ease infinite;
          animation: s-comp-700-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-comp-700-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-comp-700-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
/* color comp gradient | */
/* -------------------- ---------------- -------------------- */


/* edit - feb 6, 2024 */
/* | color alt (Amber, Fluorescent Orange) */
.s-alt-50-c {
  color: #fff8e1;
}
.s-alt-50-bg {
  background-color: #fff8e1;
}
.s-alt-200-c {
  color: #ffdf81;
}
.s-alt-200-bg {
  background-color: #ffdf81;
}
.s-alt-c {
  color: #ffbf00;
}
a.s-alt-c {
  color: #ffbf00 !important;
}
a.s-alt-c:hover, 
a.s-alt-c:focus {
  color: rgba(255, 191, 0, 0.75);
}
.s-alt-bg {
  background-color: #ffbf00;
}
.s-alt-bg-rgba {
  background-color: rgb(255, 191, 0, 1);
}
a.s-alt-bg:hover, 
a.s-alt-bg:focus {
  background-color: rgb(255, 191, 0, 0.75);
}
.s-alt-b {
  border: 1px solid #ffbf00;
}
.s-alt-700-c {
  color: #ff9e00;
}
.s-alt-700-bg {
  background-color: #ff9e00;
}
.s-alt-900-c {
  color: #ff6d00;
}
.s-alt-900-bg {
  background-color: #ff6d00;
}
/* -------------------- */
.s-alt-light,
.s-alt-note {
  color: #ff6d00; /* 900 */
  background-color: #fff8e1;
  padding: 1rem;
  border: 1px solid #ffbf00;
  border-radius: 0.25rem;
  margin-bottom: 1rem;
}
.s-alt-note {
  border-left: 8px solid #ffbf00;
}
.s-alt-link {
  color: #ff9e00; /* 700 */
  text-decoration: underline;
}
.s-alt-link:hover {
  color: #ff9e00; /* 700 */
  text-decoration: none;
}
/* color alt | */
/* -------------------- */
/* | color alt gradient */
.s-alt-200-bg-gr {
  color: #ff6d00; /* 900 */
  background: linear-gradient(270deg, #fff8e1, #ffdf81, #ffbf00); /* 50, 200, 500 */
  background-size: 600% 600%;
  -webkit-animation: s-alt-200-bg-anim 15s ease infinite;
          animation: s-alt-200-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-alt-200-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-alt-200-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
.s-alt-bg-gr {
  background: linear-gradient(270deg, #ff9e00, #ffbf00, #ffdf81); /* 700, 500, 200 */
  background-size: 600% 600%;
  -webkit-animation: s-alt-bg-anim 15s ease infinite;
          animation: s-alt-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-alt-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-alt-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
.s-alt-700-bg-gr {
  color: #fff8e1; /* 50 */
  background: linear-gradient(270deg, #ff6d00, #ff9e00, #ffbf00); /* 900, 700, 500 */
  background-size: 600% 600%;
  -webkit-animation: s-alt-700-bg-anim 15s ease infinite;
          animation: s-alt-700-bg-anim 15s ease infinite;
}
@-webkit-keyframes s-alt-700-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
@keyframes s-alt-700-bg-anim {
  0% {
  background-position: 0% 50%;
  }
  50% {
  background-position: 100% 50%;
  }
  100% {
  background-position: 0% 50%;
  }
}
/* color alt gradient | */
/* -------------------- ---------------- -------------------- */

/* ====================     | Button     ==================== */
#image-full-me .s-button, #swarnolata-group .s-button {
  white-space: normal !important;
  word-wrap: normal;
  width: 140px;
}
#swarnolata-group .s-button {
  min-height: 60px;
}
#image-full-me .s-button, #swarnolata-group .s-button {
font-size: 1.25rem;
line-height: 1.2rem;
}
#swarnolata-group .s-button span {
font-size: 1rem;
line-height: 0.85rem;
text-align: right;
}

@media (max-width:767px) {
  #image-full-me .s-button {
    max-width: 100% !important;
    text-align: center;
    margin-bottom: 0.25rem;
  }
}

.section2 .s-button {margin-top:auto;}

#image-full-me .s-button + .s-button,
#image-full-me .s-button + .s-button + .s-button,
#swarnolata-group .s-button + .s-button,
#swarnolata-group .s-button + .s-button + .s-button,
#about .s-button + .s-button {margin-left: 1rem;}

	.m-btn-theme{color:#fff;}
	.m-btn-theme:hover{
	color:#fff;
	background:#151515;
	}
	.more-btn{
	color:#151515;
	font-weight:600;
	position:relative;
	padding:3px;
	display:inline-block;
	line-height:18px;
	font-size:13px;
	text-transform:uppercase;
	text-decoration:none!important;
	-webkit-transition:ease all 0.4s;
	 -moz-transition:ease all 0.4s;
	   -o-transition:ease all 0.4s;
	      transition:ease all 0.4s;
	}
	.more-btn i{
	position:absolute;
	right:0;
	top:5px;
	opacity:0;
	-webkit-transition:ease all 0.4s;
	 -moz-transition:ease all 0.4s;
	   -o-transition:ease all 0.4s;
	      transition:ease all 0.4s;
	}
	.more-btn:hover{color:#000;}
	.more-btn:hover i{
	right:-20px;
	opacity:1;
	}
	.m-btn-link{
	color:#444!important;
	/*text-transform:uppercase;*/
	letter-spacing:2px;
	font-size:18px;
	font-weight:200;
	position:relative;
	display:inline-block;
	text-decoration:none!important;
	-webkit-transition:ease all 0.3s;
	 -moz-transition:ease all 0.3s;
	   -o-transition:ease all 0.3s;
	      transition:ease all 0.3s;
	}
	.m-btn-link:after{
	content:'';
	width:100%;
	height:40%;
	position:absolute;
	left:0;
	bottom:0;
	opacity:0.5;
	-webkit-transition:ease all 0.3s;
	 -moz-transition:ease all 0.3s;
	   -o-transition:ease all 0.3s;
	      transition:ease all 0.3s;
	}
	.m-btn-link:before{
	content:'';
	width:0;
	height:1px;
	position:absolute;
	right:0;
	bottom:0;
	opacity:0.5;
	background:#444;
	-webkit-transition:ease all 0.3s;
	 -moz-transition:ease all 0.3s;
	   -o-transition:ease all 0.3s;
	      transition:ease all 0.3s; 
	}
  /*
	.m-btn-link:hover{
	  letter-spacing:3px;
	}*/
	.m-btn-link:hover:after{
	width:10px;
	left:-15px;
	}
	.m-btn-link:hover:before{
	width:100%;
	transition-delay:0.4s
	}
	.m-btn-link-white{
	color:#fff!important;
	}
	.m-btn-link-white:before{
	background:#fff;
	}
/* --------------------     Button |     -------------------- */

/* -------------------- ---------------- -------------------- */
/* | animation */
/* | animation navbar */
@-webkit-keyframes navbar-animation {
  0%   {border-bottom-color: rgba(255, 187, 118, 0.75);}
  25%  {border-bottom-color: rgba(255, 187, 118, 0.50);}
  50%  {border-bottom-color: rgba(255, 187, 118, 0.75);}
  75%  {border-bottom-color: rgba(255, 187, 118, 0.50);}
  100% {border-bottom-color: rgba(255, 187, 118, 0.75);}
}
@keyframes navbar-animation {
  0%   {border-bottom-color: rgba(255, 187, 118, 0.75);}
  25%  {border-bottom-color: rgba(255, 187, 118, 0.50);}
  50%  {border-bottom-color: rgba(255, 187, 118, 0.75);}
  75%  {border-bottom-color: rgba(255, 187, 118, 0.50);}
  100% {border-bottom-color: rgba(255, 187, 118, 0.75);}
}
.navbar-animation {
  border-bottom: 0.25rem solid #ffc489; /* tint 7 */
}
/* animation navbar | */
/* animation | */
/* -------------------- ---------------- -------------------- */





/* -------------------- */
/* | button scroll edit */
#button-scroll {
  position: fixed;
  right: 1rem;
  bottom: 4rem;
  display: none;
  z-index: 99;
}
#button-scroll .arrow-upward-base {
  fill: #e2f6ff;
}
#button-scroll .arrow-upward-base:hover {
  fill: #135aa4;
}
#button-scroll .arrow-upward-alt {
  fill: #fff8e1;
}
#button-scroll .arrow-upward-alt:hover {
  fill: #ff6d00;
}
/* button scroll | */


/* -------------------- */
/* | button base */
.s-button-base {
  color: #fff8e1 !important; /* 50 */
  background-color: #ffbf00; /* 500 */
  border-color: #ffbf00;
}
.s-button-base:hover {
  color: #fff8e1;
  background-color: rgba(255, 191, 0, 0.75); /* 500 */
  border-color: rgba(255, 191, 0, 0.75);
}
.s-button-base:disabled, .s-button-base.disabled {
  color: #fff8e1;
  background-color: rgba(255, 191, 0, 0.5); /* 500 */
  border-color: rgba(255, 191, 0, 0.5);
}
.s-button-base-outline {
  color: #ffbf00;
  background-color: transparent;
  border-color: #ffbf00;
}
.s-button-base-outline:hover {
  color: #fff8e1;
  background-color: rgba(255, 191, 0, 0.75);
  border-color: rgba(255, 191, 0, 0.75);
}
.s-button-base-outline:disabled, 
.s-button-base-outline.disabled {
  color: #ffbf00;
  background-color: transparent;
  border-color: rgba(255, 191, 0, 0.5);
}
.s-button-base-light {
  color: #ff6d00;
  background-color: #fff8e1;
  border-color: #fff8e1;
}
.s-button-base-light:hover {
  color: rgba(255, 248, 225, 0.75);
}
.s-button-base-dark {
  color: #fff8e1;
  background-color: #ff6d00;
  border-color: #ff6d00;
}
.s-button-base-dark:hover {
  color: rgba(255, 109, 0, 0.75);
}
/* button base | */
/* -------------------- */
/*
a.s-button-base {
  color: #ffebd8;
}
a.s-button-base:hover {
	text-decoration: none;
}
*/
/* -------------------- */
/* | button comp */
.s-button-comp {
  color: #e2f6ff !important; /* 50 */
  background-color: #18adfe; /* 500 */
  border-color: #18adfe;
}
.s-button-comp:hover {
  color: #e2f6ff;
  background-color: rgba(24, 173, 254, 0.75); /* 500 */
  border-color: rgba(24, 173, 254, 0.75);
}
.s-button-comp:disabled, .s-button-comp.disabled {
  color: #e2f6ff;
  background-color: rgba(24, 173, 254, 0.5); /* 500 */
  border-color: rgba(24, 173, 254, 0.5);
}
.s-button-comp-outline {
  color: #18adfe;
  background-color: transparent;
  border-color: #18adfe;
}
.s-button-comp-outline:hover {
  color: #e2f6ff;
  background-color: rgba(24, 173, 254, 0.75);
  border-color: rgba(24, 173, 254, 0.75);
}
.s-button-comp-outline:disabled, 
.s-button-comp-outline.disabled {
  color: #18adfe;
  background-color: transparent;
  border-color: rgba(24, 173, 254, 0.5);
}
.s-button-comp-light {
  color: #135aa4;
  background-color: #e2f6ff;
  border-color: #e2f6ff;
}
.s-button-comp-light:hover {
  color: rgba(226, 246, 255, 0.75);
}
.s-button-comp-dark {
  color: #e2f6ff;
  background-color: #135aa4;
  border-color: #135aa4;
}
.s-button-comp-dark:hover {
  color: rgba(19, 90, 164, 0.75);
}
/* button comp | */
/* -------------------- */
/*
a.s-button-comp {
  color: #ffebd8;
}
a.s-button-comp:hover {
	text-decoration: none;
}
*/
/* -------------------- */
/* | button alt */
.s-button-alt {
  color: #fff8e1 !important; /* 50 */
  background-color: #ffbf00; /* 500 */
  border-color: #ffbf00;
}
.s-button-alt:hover {
  color: #fff8e1;
  background-color: rgba(255, 191, 0, 0.75); /* 500 */
  border-color: rgba(255, 191, 0, 0.75);
}
.s-button-alt:disabled, .s-button-alt.disabled {
  color: #fff8e1;
  background-color: rgba(255, 191, 0, 0.5); /* 500 */
  border-color: rgba(255, 191, 0, 0.5);
}
.s-button-alt-outline {
  color: #ffbf00;
  background-color: transparent;
  border-color: #ffbf00;
}
.s-button-alt-outline:hover {
  color: #fff8e1;
  background-color: rgba(255, 191, 0, 0.75);
  border-color: rgba(255, 191, 0, 0.75);
}
.s-button-alt-outline:disabled, 
.s-button-alt-outline.disabled {
  color: #ffbf00;
  background-color: transparent;
  border-color: rgba(255, 191, 0, 0.5);
}
.s-button-alt-light {
  color: #ff6d00;
  background-color: #fff8e1;
  border-color: #fff8e1;
}
.s-button-alt-light:hover {
  color: rgba(255, 248, 225, 0.75);
}
.s-button-alt-dark {
  color: #fff8e1;
  background-color: #ff6d00;
  border-color: #ff6d00;
}
.s-button-alt-dark:hover {
  color: rgba(254, 105, 24, 0.75);
}
/* button alt | */




/* -------------------- -------------------- -------------------- */
/* style-theme-org | */