.hindi {font-family: 'Noto Serif Devanagari', serif;}
h2 {border-bottom:1px solid #CCC; padding: 0.5rem 0rem 0.1rem 0rem}
h1, h2, h3, h1 a, h2 a, h3 a {font-family: 'Roboto Condensed', sans-serif; color: #686868; font-weight:900; font-stretch:condensed;}
h4, h5, h4 a, h5 a {font-family: 'Roboto Condensed', sans-serif; color: #686868; font-weight:700; font-stretch:condensed;}

body {word-wrap: break-word; -webkit-font-smoothing: antialiased; font-smooth: 2em; text-rendering: optimizeLegibility;}
.star-section-divider {text-align: center;}
.card-columns, .columns {columns:350px}
.box {padding: 10px;border: 1px solid lightgray; border-radius: 5px; font-family: sans-serif; font-size:12pt}
.endquote {
    margin: auto;
    width: 45%;
    border-top: 1px solid gray;
    border-bottom: 1px solid gray;
    text-align: center;
    color:gray; 
    font-style:italic; 
    font-size: 120%; 
    padding-top: 10px;
    padding-bottom: 10px;  
}
.CR {font-family: 'Roboto Condensed', sans-serif; color: #686868; font-weight:900; font-stretch:condensed; font-size:50pt; text-align: center}
.SL3D {color:cornsilk; font-size:40pt; line-height: 1; text-align: center; font-family: 'Noto Serif Devanagari', serif; font-weight: 900; font-stretch:condensed;
  text-shadow: 0 1px 0 #ccc,
               0 2px 0 #c9c9c9,
               0 3px 0 #bbb,
               0 4px 0 #b9b9b9,
               0 5px 0 #aaa,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2)
               ;
  margin-bottom: 1.5rem;
}
li {
    margin-bottom: 0.5em;
   }   
.navbar-nav li {
     margin-bottom: inherit;
   }
.breadcrumb li{
    margin-bottom: 0px;
  }
sub {font-style:normal;}
sub:before {content: "\2014  "}
.quote, blockquote {font-style:italic; border: none;
    margin: 0.25em 0;
    padding: 0.35em 40px;
    line-height: 1.45;
    position: relative;
}
.quote:before, blockquote:before {
    display: block;
    padding-left: 10px;
    content: "\201C";
    font-size: 80px;
    position: absolute;
    left: -20px;
    top: -20px;
    color: #ccc;
} 

.no-italics{
   font-weight: bold;
}

img {margin-bottom:5pt;
    pointer-events: none;
} /*stops image download*/
.clickable {pointer-events: auto;}
    body {
    	font-family: "Georgia","Times New Roman",Times,serif;
    	font-size: 14pt;
    	line-height: 140%;
    	background-color: #F5F5F5;
    }
    .table-header-dark, .card-header, .list-group-item, .navbar-nav>li>.dropdown-menu {
    	background-color: cornsilk
    }
    .table-header-light{
       background-color:floralwhite;
        color: black;  
    }
   .box, .table-bordered{
        background-color: white;
    }
 
    .sans a, .sans p, .list-group-item a {
    	font-family: sans-serif;
    	font-size: 13pt;
    	color: black
    }
    .sans a:hover {
    	color: blue
    }
    .img-thumbnail { text-align: center; font-style: italic; font-size: 0.9em; margin-top: 0.5em;}
    	/*font-size: 12pt;
    	line-height: 120%;*/

.btn {font-family: sans-serif; }
    .table-bordered, .card, .list-group-item, audio, video, img, .alert, .modal, button, .btn, textarea, input, .shadow, .box, .tooltip-inner {
    	-webkit-box-shadow: 0 10px 6px -6px #777;
    	-moz-box-shadow: 0 10px 6px -6px #777;
    	box-shadow: 0 10px 6px -6px #777;
    }
    .noshadow, input, .close {box-shadow: none}

    .container {
    	background-color: floralwhite;
    	max-width: 770px;
    	/*old=728*/
    	padding: 10;
        box-shadow: 0 0 20px #484545;
    }
    .navbar, .breadcrumb {
    	font-family: sans-serif;
    	font-size: 11pt;
    }
  
.navbar {white-space: nowrap;}
    .navbar-table {
    	display: block;
    }
    .dropdown-menu>a:hover, .dropdown-menu>li>a:focus {
    	background-color: white;
    }

    /*.navbar-toggler {outline: none !important;}*/

    .navbar-dark .navbar-nav .nav-link {
    	color: rgba(255, 255, 255, 1);
    }
    .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover .navbar-toggler {
    	color: rgba(255, 255, 255, .75);
    }
    .cols {
    	columns: 250px 3;
    	-webkit-columns: 250px 3;
    	-moz-columns: 250px 3;
    	-webkit-column-rule: 1px solid darkred;
    	-moz-column-rule: 1px solid darkred;
    	column-rule: 1px solid darkred;
    }
    .cols2 {
    	columns: 350px 2;
    	-webkit-columns: 350px 2;
    	-moz-columns: 350px 2;
    }
    .p50 {
    	width:420px; max-width: 50%;
    }
    .p40 {
    	max-width: 40%;
    }
    .p33 {
    	max-width: 33%;
    }
    .p25 {
    	max-width: 25%;
    }
    .p20 {
    	max-width: 20%;
    }

@media print
{
body * { visibility: hidden; }
article * { visibility: visible; }
article  { position: absolute; top: 40px; left: 30px; }
}
    /*@media screen and (max-width: 430px) {h2 {font-size: 18pt;}}
    @media screen and (max-width: 430px) {.SL3D {font-size: 30pt;}}*/
    @media screen and (max-width: 430px) {
    	.p50, .p40, .p33, .p25, .p20, .pullquote, .endquote {
    		width: 520px; max-width: 100%; float:none;
    		margin-bottom:10px;
        }
    }
    .float-left {
    	margin-right: 10px
    }
    .float-right {
    	margin-left: 10px
    }
.cover {float:left; width:33%;}
@media screen and (max-width: 430px) {.cover {width: 520px; max-width: 50%; margin-bottom:10px;}}
    .navbar-toggler {
    	align-self: flex-end;
    }
	.splink-container p > a {
		color: black;
	}
	.spl-vol-issue {
		margin-top: 1.5rem;
    }
    /* Toolltip styles */
	.tooltip-inner {
		color: #161616;
		text-align: left; max-width: 320px;
		background-color: #ffffaf !important;
	}
  .tooltip { z-index: 100 !important; }
	.tooltip.show { opacity: 1}
	.bs-tooltip-auto[x-placement^="top"] .arrow::before, .bs-tooltip-top .arrow::before {
		border-top-color: #ffffaf !important;
	}
	.bs-tooltip-auto[x-placement^="bottom"] .arrow::before, .bs-tooltip-bottom .arrow::before {
		border-bottom-color: #ffffaf !important;
	}
	.bs-tooltip-auto[x-placement^="left"] .arrow::before, .bs-tooltip-left .arrow::before {
		border-left-color: #ffffaf !important;
	}
	.bs-tooltip-auto[x-placement^="right"] .arrow::before, .bs-tooltip-right .arrow::before {
		border-right-color: #ffffaf !important;
	}
	.Subhead-i{
		font-style:italic;
		font-weight: bold;
    }
    .center-text{
        text-align: center;
    }
    .sub-no-dash > sub:before{
        content: none;
    }

    /* Wraps the chapter topics, in the TOC, with an indent on the mobile*/
    .chapter-topics > span{
        margin-left: -0.5em;
      }    
      /* Used in book Caring for your health - to show content as column cards*/
      .card-1 {
        box-shadow: none;
       -webkit-box-shadow:0;
       -moz-box-shadow: 0 ;
       border: transparent;
       background-color: transparent;
      }
      .card-body-1{
        padding: 0;
      }
      @media only screen and (min-device-width : 320px) and (max-device-width : 768px) {
        .card-columns {
            display: flex;
            columns: auto;
            width: 100%;
           flex-direction: column;
          }
  
          .card-columns #tblother {
            order: 4;
          }
      }
      .image-left{
        float: left;
        margin-right: 20px;
        margin-top: 20px;
      }
      .image-right{
        float: right;
        margin-left: 20px;
        margin-top: 20px;
      }

       /* Smartphones (portrait and landscape) for floating images with lists*/
       @media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
        .bd-content div.image-left {
          float:none;
          margin-left: 0px;
          margin-top: 20px;
          margin-right: 0px;
        }
  
        .bd-content div.image-right {
          float: none;
          margin-right: 0px;
          margin-top: 20px;
          margin-left: 0px;
        }

        summary{
          outline: none;
        }
    }