html {
    font-size: 20px; /* Set a base font size for the root element */
}
/* CSS COMMENTS need to be enclosed like this example */
/* font-faces that are not used can be deleted */
@font-face { /* this is the current main font */
    font-family: 'Fondamento'; 
    src: url('fonts/Fondamento-Italic.eot?#iefix') format('embedded-opentype'),
        url('fonts/Fondamento-Italic.woff2') format('woff2'),
        url('fonts/Fondamento-Italic.woff') format('woff'),
        url('fonts/Fondamento-Italic.ttf') format('truetype'),
        url('fonts/Fondamento-Italic.svg#Fondamento-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Fondamento';
    src: url('fonts/Fondamento-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/Fondamento-Regular.woff2') format('woff2'),
        url('fonts/Fondamento-Regular.woff') format('woff'),
        url('fonts/Fondamento-Regular.ttf') format('truetype'),
        url('fonts/Fondamento-Regular.svg#Fondamento-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face { /* this is the Welcome img font */
    font-family: 'Gradientico';
    src: url('Gradientico-Regular.eot?#iefix') format('embedded-opentype'),
        url('Gradientico-Regular.woff2') format('woff2'),
        url('Gradientico-Regular.woff') format('woff'),
        url('Gradientico-Regular.ttf') format('truetype'),
        url('Gradientico-Regular.svg#Gradientico-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gradientico';
    src: url('Gradientico-Italic.eot?#iefix') format('embedded-opentype'),
        url('Gradientico-Italic.woff2') format('woff2'),
        url('Gradientico-Italic.woff') format('woff'),
        url('Gradientico-Italic.ttf') format('truetype'),
        url('Gradientico-Italic.svg#Gradientico-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'CentSchbook BT';
    src: url('CenturySchoolbookBT-Bold.eot?#iefix') format('embedded-opentype'),
        url('CenturySchoolbookBT-Bold.woff2') format('woff2'),
        url('CenturySchoolbookBT-Bold.woff') format('woff'),
        url('CenturySchoolbookBT-Bold.ttf') format('truetype'),
        url('CenturySchoolbookBT-Bold.svg#CenturySchoolbookBT-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face { /* this is the font for headers h1,h2,h3,h4 */
    font-family: 'Devinne Swash';
    src: url('DevinneSwash.eot?#iefix') format('embedded-opentype'),
        url('DevinneSwash.woff2') format('woff2'),
        url('DevinneSwash.woff') format('woff'),
        url('DevinneSwash.ttf') format('truetype'),
        url('DevinneSwash.svg#DevinneSwash') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Dirty Bunny';
    src: url('DirtyBunny.eot?#iefix') format('embedded-opentype'),
        url('DirtyBunny.woff2') format('woff2'),
        url('DirtyBunny.woff') format('woff'),
        url('DirtyBunny.ttf') format('truetype'),
        url('DirtyBunny.svg#DirtyBunny') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face { /* this is the Fire Serpent font */
    font-family: 'Magik';
    src: url('Magik.eot?#iefix') format('embedded-opentype'),
        url('Magik.woff2') format('woff2'),
        url('Magik.woff') format('woff'),
        url('Magik.ttf') format('truetype'),
        url('Magik.svg#Magik') format('svg');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face { /* this is the navribbon font */
    font-family: 'OptimusPrinceps';
    src: url('https://fire-serpentyoga.com/fonts/OptimusPrinceps.eot?#iefix') format('embedded-opentype'),
        url('https://fire-serpentyoga.com/fonts/OptimusPrinceps.woff2') format('woff2'),
        url('https://fire-serpentyoga.com/fonts/OptimusPrinceps.woff') format('woff'),
        url('https://fire-serpentyoga.com/fonts/OptimusPrinceps.ttf') format('truetype'),
        url('https://fire-serpentyoga.com/fonts/OptimusPrinceps.svg#OptimusPrinceps') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
body{
	top: 0;  
	margin: 0;
	padding: 0;
	max-width: 1200px;
	min-width: 500px;
	/* Gopi this line below, changes the default page font */
    font-family:'Fondamento', Georgia,serif;
    font-size:1.1em; /* 22px; */
	font-style:normal;
    font-weight:normal;
    line-height:normal;
	color:#000000;
    text-align:left;
    background-color:#9cbfa3;/* if you change this change the html too */
	background-image: url('https://fire-serpentyoga.com/img/aarhus_2019-1400.png');
    background-repeat: no-repeat; /* Prevent tiling */
	background-attachment: fixed; /* does not scroll  */
    background-size: cover; /* Scale the image to cover the entire viewport */
    background-position: top left;
}

ul{
    list-style:inside;
}
li{ /* puts a gem image for lists */
	list-style: url("https://fire-serpentyoga.com/img/gem1.png") disc;
}

a:link,a:visited{
    color: #0001b2;
    text-decoration:none;
}
a:hover{
    color:#e8f8f2;
    text-decoration:underline;
}
a:active{
    color:#66cccc;
    text-decoration:underline;
}

h1,h2,h3,h4,a.h1,a.h2,a.h3,a.h4:link,a.h1,a.h2,a.h3,a.h4:visited {
	font-style: normal;
	color:#1f2441;
	/* change the headers font below */
	font-family:'Devinne Swash',"Times New Roman",Times,serif;
	text-align:center;
	text-transform:capitalize;
}

a.h1,a.h2,a.h3,a.h4:hover{
    color:#6e739d;
    text-decoration:underline;
}
a.h1,a.h2,a.h3,a.h4:active{
    color: #00CED1; /* 7f8eab*/
    text-decoration:none;
}
h1 {
    font-size: 1.5em;
    font-weight: bold;
    line-height: normal;
}
h2 {
    font-size: 1.3em;
    font-weight: bold;
    line-height: normal;
}
h3 {
    font-size: 1.2em;
    line-height: normal;
    margin: 0.4em 0.5em;
    padding-left: 0.4em;
    padding-right: 0.5em;
    text-align: center;
    text-indent: 0.8em;
    word-spacing: 0.15em;
}
h4 {
    font-size: 1em;
    font-style: normal;
    font-weight: normal;
    line-height: normal;
    margin: 0.4em 0.3em;
    padding-left: 0.4em;
    padding-right: 0.3em;
    text-align: center;
    word-spacing: 0.25em;
}
h5 {
    font-size: 2.3em;
    font-style: normal;
    font-weight: normal;
    line-height: normal;
    margin: 0.4em 0.3em;
    padding-left: 0.4em;
    padding-right: 0.3em;
    text-align: center;
    word-spacing: 0.25em;
}
blockquote { /* blockquote tag */
    color: #1d3a4c;
    font-family: tt, Courier, monospace;
    background-color: #8a7764;
    font-size: 0.9em;
    font-weight: bold;
    margin-left: 0.9em;
    margin-right: 0.6em;
    margin-top: 0.5em;
    max-width: 75%;
    text-indent: 0.8em;
}
#main{ /* main table id*/
    width:100%;    
    max-width:1400px;
    min-width:320px;/* Minimum width for narrowest smartphones */
    margin:auto;
    text-align:center;
    table-layout: fixed; /* Ensures column widths are respected */
}

.column{ /* side columns */
     width: 10%;
} 


/* accessability hidden screenreader  */
.scr, #title1 { /* div page url invisible for copyright  */
 	display:none; 
/*	visibility: hidden;*/
}

/* header main content td */
#header{ /* Fire Serpent Yoga title div */
   width:80%;  
    text-align: center; /* Center images within the container */
}
/* header images responsive */
#fs {
    width: 72.5%; /* 464px of 640px */
    height: auto; /* Maintain aspect ratio */
}
#yoga {
    width: 27.5%; /* 176px of 640px */
    height: auto; /* Maintain aspect ratio */
}
#by {
    width: 7%; /* 464px of 640px */
    height: auto; /* Maintain aspect ratio */
}
#drgopi {
    width: 92.25%; /* 464px of 640px */
    height: auto; /* Maintain aspect ratio */
}
#welcome{ /* only on main index page, title */
     width: 50%; /* 464px of 640px */
    height: auto; /* Maintain aspect ratio */
}


.title, a.title:link { /* title for other pages fcffc1 */
    color: #fcffc1;
    font-family: 'Gradientico', "Times New Roman", Times, serif;
    font-size: 3em;
    text-align: center;
    text-transform: capitalize;
    text-shadow: 0.05em 0.05em 0.1em #fcffc1;
    vertical-align: 0.5em;
}
a.title:hover{
    color:#ffffff;
    text-decoration:underline;
}
a.title:active{
    color: #d9e1a6;
    text-decoration: underline;
}

#toptitl { /* not used */
	font-family: 'Gradientico', Georgia, serif;
	/* margin-top: 0.67em;	
	margin-bottom: 0.67em;*/
	font-size: 2em;
	color: #0a3d05; 
	margin-left: 0;
	margin-right: 0;
	font-weight: bold;	
}
.tamil{ /* shrink it */
    font-size: 0.7em;
    text-align: left;
}
.tamilsmall { /* shrink it more */
  font-size: 0.5em;  
  font-weight: bold;
}

#taglin{ /* not used  */
	font-family: 'Palatino Linotype', Palatino, Georgia, serif;
	color: #73aaf00; /*#7618ff;*/	
	text-align: center;
/*	margin: 8px 2px 8px 2px;*/
}

#box{ /* div not used */
    width: 60%;
    height: auto;
    margin: 0 auto;
    padding: 3px 7px; 
    border-radius: 15px;
    text-align: center;
    background-color: #324063; /* Fallback solid color */
    background-color: rgba(50, 64, 99, 0.5); /* 50% transparency */
    box-shadow: 0px 0px 20px rgba(50, 64, 99, 10); /* Soft blurred edges */
}

#magi {
    font-family: 'Magik', Georgia, serif;
    color: #c1d5ff; 
	font-size: 3em;
	margin-left: 0;
	margin-right: 0;
    font-weight: normal;
    font-style: normal;
    /*  text-shadow: 0.05em 0.05em 0.1em #0e3cc6; */
    text-shadow: 0.05em 0.05em 0.1em #1f2441;
}

/* header images */
#mynam{
	font-family: 'Magik', Palatino, Georgia, serif;	
	color: #fff; 
	font-size: 2.75em;
    text-align: center;
    text-transform: capitalize;
    /* text-shadow: 0.1em 0.1em 0.15em #6b8fa5; */
    text-shadow: 0.05em 0.05em 0.1em #1f2441;
}

/*#can{
	font-family: 'Gradientico', Georgia, serif;
	color: #fff; 
	font-size: 2em;
	margin-left: 0;
	margin-right: 0;
	padding: 10px;
	font-weight: normal;
	text-transform: capitalize;
	text-shadow: 0.05em 0.05em 0.1em #0e3cc6;
text-shadow: 0.05em 0.05em 0.1em #1f2441;
} */

#PagTitle{ /* name of current page not used m-s.c */
	font-family: 'Devinne Swash', "Times New Roman", Times, serif;
	line-height: 1.6;
	text-align: center;
	 color: #0a3d05;
    font-size: 2em;
    text-transform: capitalize;
    text-shadow: 0.05em 0.05em 0.1em #030b03;
/*		background-color: #00008B;
margin: 8px 2px 8px 2px;*/
}

/* section headings */
.subtitle {
    color: #050608;
    font-family: 'Devinne Swash', "Times New Roman", Times, serif;
    font-size: 2em;
    text-align: center;
    text-transform: capitalize;
    text-shadow: 0.05em 0.05em 0.1em #809b7c;
    /* vertical-align: +10px;
        margin-top: -0.5em;
    margin-bottom: 7.5em; poe */
    vertical-align: top;
    text-decoration: none;
    margin: auto;
    font-weight: bold; /* or other styles */
}

#content-main {    /* td main content window  */
	vertical-align: top;
	width: 100%;
	min-width: 320px;
	text-align: left;
	border: 0;
	border-spacing: 0;
	background-image: url('https://fire-serpentyoga.com/img/dkgrn-65.png');
    background-repeat: repeat; 
    padding: 15px;
}


.content-txt { /* div main content */
	font-family: 'Fondamento', Georgia, Helvetica, serif;
	color: #030b03;
	font-size:1.0em;
	vertical-align: top;
	text-align:left;
	min-width: 320px;
	margin:auto;
	padding-top:5px;
	padding-right: 25px;
	padding-bottom: 30px;
	padding-left:30px;
	background-image: url('https://fire-serpentyoga.com/img/d9e1ab-75.png');
    background-repeat: repeat; 
}
.content-txt p {    /* paragraph settings */
	text-indent: 14px;
	margin-bottom:14px;
	margin-top: 16px;
}
 /* nav ribbon between sections  */
.navbar { /* div */
   text-align: center; 
}

.nav, .nav a {
    font-family: 'OptimusPrinceps', "Times New Roman", Times, serif;
    font-size: 1em; 
    font-weight: normal;
    color: #2d7853;
    text-align: center;
    text-transform: capitalize;
    text-decoration: none;
    vertical-align: 0.35em; /* line up with gem.png */
    margin: 3px;
    padding: 3px 7px; /* Add padding for larger clickable areas */
    width: auto;
    text-shadow: 1px 1px 2px #809b7c;
    background: #9cbfa3; /* Fallback solid color */
    background: -webkit-gradient(linear, left top, left bottom, from(#d5e5ff), to(#a0b9df)); /* Webkit gradient */
    background: -moz-linear-gradient(top, #e7ecfb, #a0b9df); /* Mozilla gradient */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d5e5ff', endColorstr='#a0b9df'); /* IE fallback */
    border: 1px solid rgba(193, 213, 255, 0.7); /* Semi-transparent border */
    display: inline-block; /* Makes links behave like buttons */
    white-space: nowrap; /* Prevent text wrapping */
    border-radius: 10px; /* Slightly rounded corners for modern browsers */
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */

}

.nav a:hover, .nav a:active {
    color: #73af00; /* Change text color on hover/click */
    text-decoration: underline; /* Underline on hover/click */
    background-color: #e7ecfb; 
    background: #a0b9df; /* Fallback solid color for hover */
    background: -webkit-gradient(linear, left top, left bottom, from(#a0b9df), to(#a0b9df)); /* Hover gradient */
    background: -moz-linear-gradient(top, #e7ecfb, #a0b9df); /* Hover gradient */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a0b9df', endColorstr='#a0b9df'); /* IE fallback */
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3); /* Slightly deeper shadow on hover */
}

.gem {
    width: 20px; /* Image width */
    height: 33px; /* Image height */
    border: 0; /* Remove border around images */
   /* margin: 0 5px;  Add horizontal spacing around gems */
   /* vertical-align: middle;  Align gems with text */
}
#line5{
    text-align: center;
    margin:15px;
    vertical-align: middle; 
}

#s-media{    /* social media icons */
  	width:100%;
  	vertical-align: bottom; 
}
#footer {    /* td  */
	width: 100%;
	text-align: left;
	border: 0;
	border-spacing: 0;
	padding: 15px;
	min-width: 320px;
	background-image: url('https://fire-serpentyoga.com/img/8a877c-75.png');
    background-repeat: repeat; 

}
#footer-txt{    /* div footer text container */
	font-family: 'Merriweather', Georgia, Helvetica, serif;
	color: #0a3d05;
	font-size: 0.8em;
	font-weight: bold;
	text-align: left;
	margin-bottom: 10px;
	padding: 20px;
	background-image: url('https://fire-serpentyoga.com/img/a7aaba-75.png');
    background-repeat: repeat; 
}
.footurl{
   font-family: 'Papyrus',"ZapfChancery-MediumItalic", Georgia, serif;
	font-size: 16px;
	font-weight : bold; 
	letter-spacing : 1px;
	text-align: left;
	vertical-align: top;
	text-transform: lowercase;
	line-height: 18px;
	height: 25px;
	width: 100%;
	padding-left: 126px;
    margin-bottom: 20px;
}

/* Shop:  Basic Styles for Single-Column Layout poe*/
#store-container {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    font-family: Arial, sans-serif;
}

#nav-bar {
    padding: 10px;
    text-align: center;
}

#nav-bar a {
    text-decoration: none;
    margin: 0 10px;
    color: #fff;
}

#page-content {
    margin: 20px 0;
}

#pagination {
    text-align: center;
    margin: 20px 0;
}
        
/* commercecgi */
form {margin-bottom: 0px;}
checkbox{}
textarea{}

.centered
{
   text-align:       center;
}

.benchmark
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        10;
   text-align:       center;
}

.error_header
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        16;
   font-weight:      bold;
   color:            #FF0000
}

.error_description
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
}

.random_product_text
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        10;
   text-align:       center

}

/* used to highlight comment in the manager */
.red_comment
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   font-weight:      bold;
   color:            #FF0000
}

/* used to highlight comment in the manager */
.center_error
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   font-weight:      bold;
   color:            #FF0000
   text-align:       center
}

/* used in hack attempt error code */
.large_center_header
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        16;
   font-weight:      bold;
   text-align:       center
}

/* used in manager members hack */
.large_left_header
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        16;
   font-weight:      bold;

}

/* used to add left and right margin */
.margins_left_right
{
    margin-left:     20px;
    margin-right:    20px;
    margin-top:      10px;
}

/* used in manager below the header to describe what this feature is */
.text_description
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
}

/* Small text that shows up below the gateway check out buttons. */
.gateway_description
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        10;
   text-align:       center;
}

/* user on forms and cart display */
.colored_cell_header
{
   color:            #000000;
   font-family:      Verdana, Arial, sans-serif;
   font-size:        14;
   font-weight:      bold;
   background-color: #BAC1C7;
   BORDER-BOTTOM:    #000000 1px solid;
   BORDER-TOP:       #000000 1px solid;
}

.item_added_message
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   text-align:       center;
   font-weight:      bold;
}

.d_category{HEIGHT: 22px; WIDTH: 210px;}

next_link
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        10;
   font-weight:      bold;
}

back_link
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        10;
   font-weight:      bold;
}

.cart_edit_quantity{}

.cart_totals_labels
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   font-weight:      bold;
   text-align:       right;
}

.cart_totals
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   text-align:       right;
}

.cart_error{}

.no_items_found
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   font-weight:      bold;
   text-align:       center;
}

.cartcontents
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
}

.default_small
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        10;
}

.default_text
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
}

.default_right
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   text-align:       right;
}

.default_right_bold
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   text-align:       right;
}

.default_bold
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   font-weight:      bold;
}

.small_bold
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        10;
   font-weight:      bold;
}

.row_title
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   font-weight:      bold;
}

/* used in the download hack from the members area to sell product downloads */
.download_link
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
}

.customer_login_headers
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        14;
   font-weight:      bold;
   text-align:       center;
   height:           35;
   vertical-align:   center;
}

.template_cell_headers
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        12;
   font-weight:      bold;
}

.sitename
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        24;
   font-weight:      bold;
   color:            #FFFFFF;
   padding-left:     20px;
   text-align:       left;
   line-height:      3;
}

.center_header
{
   font-family:      Verdana, Arial, sans-serif;
   font-size:        14;
   font-weight:      bold;
   text-align:       center;
}

.borderbottom
{
   BORDER-BOTTOM:    #C2C2C2 1px solid;
}
