/* from Cloud Manager unplugged.css */

/************************************************
efs added here 2015-05-21
**************************************************/
/* Theme changes to bootstrap/cards: */
body {
/*  background: #393f49;
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed; */
}

input[type="radio"] {
	margin-top: -3px;
    margin-right: 3px;	
}


.navbar-inverse {
  background-color: #003965!important;
  border-color: #1d2449!important;
}

.navbar-inverse .navbar-inner {
    background-color: #333366;
    background-image: -moz-linear-gradient(top,#333366,#003A6B);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#333366),to(#003A6B));
    background-image: -webkit-linear-gradient(top,#333366,#003A6B);
    background-image: -o-linear-gradient(top,#333366,#003A6B);
    background-image: linear-gradient(to bottom,#333366,#003A6B);
    background-repeat: repeat-x;
    border-color: #252525;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff003965',endColorstr='#ff003A6B',GradientType=0);
}

.navbar-inverse .navbar-nav>li>a {
  color: #77C7CA!important;
}
  
.navbar-inverse .navbar-brand {
  /*color: #77C7CA!important; efs*/
  color: #01A5E4!important;
}

@media (min-width: 768px) {
	.navbar-right {
	    float:right!important;
	    padding-right: 140px;
	}
	
	.navbar-nav.navbar-right:last-child {
	    margin-right: -15px;
	}
}

body {
	/* background-color:#002A4A!important; */
}

.panel-default .panel-heading, .panel-default>.panel-heading {
  background-color: rgb(9, 80, 133)!important;
}
.navbar-fixed-top div.container {
  /* background: url('/cheimobile.nsf/HASZ-Logo_485x175.png') no-repeat;
  background-size: 111px 40px; */
  background-position: center right;
  height:43px;
}
@media (min-width:768px) {
	.navbar-fixed-top div.container {
		background-position: center right;
	}	
}
.navbar-default {
  border-bottom: 1px solid #171D3F!important;
  -webkit-box-shadow: inset 0 -2px 0 #171D3F,0 3px 3px rgba(0,0,0,.07)!important;
  box-shadow: inset 0 -2px 0 #171D3F,0 3px 3px rgba(0,0,0,.07)!important;
}
.panel-footer {
	background-color:rgb(57, 128, 181)!important;
}

.icon-bar {
	padding: .3em; 
	margin: 0 auto;
	background-color:#09224C!important;"
}

.icon-bar a:focus, 
.icon-bar a:hover, 
.icon-bar a:active, 
.icon-bar a.active {
	color: #49AAFD;
	opacity: 1;
}

.item-pct {
	width: 3em;
    font-size: 1.1em;
    color: blue;
    margin-top: .15em;
    text-align: right;
    margin-right: -.5em;
}

/*smartphones*/
@media only screen and (max-device-width : 600px) {
	.navbar-fixed-top div.container {
	  background: url('/cheimobile.nsf/HASZ-icon.png') no-repeat;
	  background-size: 49px 40px;
	  background-position: top right; 
	}
	.navbar-fixed-top>.container .navbar-brand {
		float:left!important;
		text-align:left!important;
	}
}


/* bootstrap viewPanel css */
.xspTextViewColumn {
    font-weight: normal;
}
.xspText, .xspTextComputedField, .xspTextLabel, .xspTextViewTitle, .xspTextViewColumn, .xspTextViewColumnComputed, .xspTextViewColumnHeader {
    font-family: Arial, Verdana, Helvetica, sans-serif;
}

.xspColumnViewMiddle {
    padding-left: 2px;
    padding-right: 20px;
}

.xspColumnViewEnd {
    padding-left: 2px;
    padding-right: 20px;
}
.xspColumnViewEnd {
    padding-top: 4px;
    padding-bottom: 4px;
}


a {
	color:#43c0ff;	
}

.viewStyleClass, .viewStyleClass > tbody:first-child > tr:last-child td > table,
.xspDataTableViewPanelHeader, .xspDataTableViewPanelFooter, .xspDataTableViewPanelBody {
    border: 0px;
    vertical-align: baseline;
    font-size: 1.2em;
}

.viewStyleClass > tbody:first-child > tr:first-child td, 
.viewStyleClass > tbody:first-child > tr:last-child td > table > tbody:first-child > tr:first-child td
  {
	max-height: 20px;
    width: 0px;
    background-color: #fafafa;
    border-top: 1px solid #e8e8e9;
    border-bottom: 1px solid #e8e8e9;
    font-size: 1.2em;
}

.xspDataTableViewPanelHeaderStart {
    border-left: 1px solid #e8e8e9;
}
.xspDataTableViewPanelHeaderStart {
    max-height: 20px;
    width: 0px;
    background-color: #fafafa;
    border-top: 1px solid #e8e8e9;
    border-bottom: 1px solid #e8e8e9;
    font-size: 1.2em;
}

.xspDataTableViewPanelHeaderMiddle {
    background-color: #fafafa;
    border-top: 1px solid #e8e8e9;
    border-bottom: 1px solid #e8e8e9;
    font-size: 1.2em;
}

.xspDataTableViewPanelHeaderMiddle table {
    vertical-align: bottom !important;
}

.outerStyleClass {
    border-collapse: collapse;
    width: 100%;
    position: relative;
}

.styleClass, .viewStyleClass > tbody:first-child > tr:last-child td > table div {
    float: left;
    padding: 4px 0px 0px 0px;
    text-align: center;
    color: #848484;
}

.xspPagerNav {
    text-align: left;
    float: left;
    padding-left: 5px;
}
.xspPagerNav {
    color: #848484;
}




.xspGroup span {
    list-style-type: disc;
    margin: 0px;
    padding: 0px;
}
.xspGroup span span {
    color: #848484;
    display: inline;
    margin: 0px;
    padding: 0px 7px;
    border-color: #cccccc;
}
.xspGroup span span {
    border-left-width: 1px;
    border-left-style: solid;
}
.xspGroup span span.xspCurrentItem {
    color: #848484;
}
.xspGroup span span.xspFirstItem {
    padding-left: 7px;
    border-left-width: 0px;
}

.styleClass span,  .viewStyleClass > tbody:first-child > tr:last-child td > table div span {
    text-align: left;
    float: left;
    padding-left: 5px;
    color: #848484;
}

.styleClass span span, .viewStyleClass > tbody:first-child > tr:last-child td > table div span span {
	list-style-type: disc;
    margin: 0px;
    padding: 0px;
}

.styleClass span span span, .viewStyleClass > tbody:first-child > tr:last-child td > table div span span span {	
	padding-right:7px;
	padding-left:7px;
    border-left-width:0px;
}

.xspDataTableViewPanelHeaderEnd {
    border-right: 1px solid #e8e8e9;
}
.xspDataTableViewPanelHeaderEnd {
    width: 0px;
    background-color: #fafafa;
    border-top: 1px solid #e8e8e9;
    border-bottom: 1px solid #e8e8e9;
    font-size: .9em;
}

.dataTableStyleClass {
    border: 0px;
    padding: 0px;
    /* margin: 0px 4px 0px 4px!important; */
    width: 100%;
    border-collapse: collapse;
}
.dataTableStyleClass tbody tr td {
    border-top: 1px solid #6d68b9;;
    font-weight: normal;
    vertical-align: baseline;
    padding: 0px 4px 0px 4px!important;
}

.rolesTableStyleClass {
    border: 0px;
    padding: 0px;
    margin: 0px 4px 0px 0px!important;
    width: 100%;
    border-collapse: collapse;
}
.rolesTableStyleClass tbody tr td {
    border-top: 1px solid #e8e8e9;
    font-weight: normal;
    vertical-align: baseline;
}


.xspColumnViewStart {
    padding-top: 4px;
    padding-bottom: 4px;
}
.xspColumnViewStart {
    padding-left: 2px;
    padding-right: 20px;
}


.xspDataTableViewPanelFooterStart {
    border-left: 1px solid #e8e8e9;
}
.xspDataTableViewPanelFooterStart {
    background-color: #fafafa;
    border-bottom: 1px solid #e8e8e9;
    border-top: 1px solid #e8e8e9;
    font-size: .9em;
}

.xcolumnClasses {
	background-color:white;
}


.row-label {
    display: block;
}

.form-table label, .form-table .row-label {
	margin-bottom:0;
	font-size:.8em;
	font-weight:bold;
	color:#5dcbff;
	margin-right:1em;
}
.download-table {
	margin-top: 1.1em;
}
.download-table .columnClasses, .download-table .headerClass {
	padding-right:1em!important;
}



.download-table thead {
	font-size:.8em;
	color:gray;
}

.download-table .rowClasses {
	font-size:.8em;
}


/*  */

/*****************************  efs  ********************/

/*Default Bootstrap Paging Style*/
.bootstrapPager {
  display: inline-block;
  padding-left: 0;
  border-radius: 4px;
  margin-left: 10px;
  margin-bottom: 10px;
  margin-top: 10px;
  line-height: 1.42857;
}
  
.bootstrapPagerPrevious{  
/*  background-color: #fff;  */
  border: 1px solid #ddd; 
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
  display:inline;
  margin-left: 0;
  position: relative;
  float: left;
  padding: 6px 12px;
  color: #ddd;
  line-height: 1.42857143;
  text-decoration: none; 
}
 
.bootstrapPagerPrevious > a, .bootstrapPagerNext > a, .bootstrapPagerMiddle > span > span > a{ 
  color: #337ab7;
  text-decoration: none; 
}
  
.bootstrapPagerPrevious:focus, .bootstrapPagerPrevious:hover, .bootstrapPagerNext:focus, .bootstrapPagerNext:hover {
  background-color:#eee;
  border-color: #ddd; 
  color: #23527c;
}  
  
.bootstrapPagerMiddle {
  display:inline;
}
  
.bootstrapPagerMiddle > span {
  float: left;
}
  
.bootstrapPagerMiddle > span > span {
  margin-left:5px;
  float: left;
  color: #105CB6;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  border: 1px solid #ddd; 
/*  background-color: #fff;  */
  text-decoration: none;
}
 
.xspCurrentItem{
  background-color:#337ab7 !important;
  border-color:#337ab7 !important;
  color:#fff !important;
}
 
.bootstrapPagerMiddle > span > span:focus, .bootstrapPagerMiddle > span > span:hover {
  background-color:#eee;
  border-color: #ddd; 
  color: #23527c;
} 
  
.bootstrapPagerNext {
  display:inline;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  text-decoration: none;
/*  background-color: #fff;  */
  border: 1px solid #ddd;
  color: #ddd;
}

/*END -- Default Bootstrap Paging Style*/

/* HFC Online floating table formatting */
.form-table td {
	padding:1px .4em 0px .4em;
}
.form-table-hdr {
	background-color:#2f5496; 
    	color:white;
    	font-size: .8em;
   	font-weight: bold;
   	padding-left: .5em;
}

.form-table {
	border: solid 1px #2f5496;
    margin-bottom: 1em;
    -webkit-box-shadow: 1px 2px 1px 0px rgba(107, 107, 107,0.5);
    -moz-box-shadow: 1px 2px 1px 0px rgba(107, 107, 107,0.5);
    box-shadow: 1px 2px 1px 0px rgba(107, 107, 107, 0.5);
    min-width: 325px;    
    background-color: #FFF;
}


.insidebar label, .insidebar .row-label {
	margin-right:0!important; 
}

.insidebar {
	min-width:220px!important;
	font-size:.9em!important;
}

@media (min-width: 1200px) {
.insidebar {
	min-width:270px!important;
	font-size:.9em!important;
}
}

@media (max-width: 979px) and (min-width: 768px) {
.insidebar {
	min-width: 166px;
	font-size:.8em!important;
}
}

	



/* Notes/discussion log */
.discussion-timeline {
    position: relative;
    float: left;
    width: 760px;
}
.discussion-timeline::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 79px;
    z-index: -1;
    display: block;
    width: 2px;
    content: "";
    background-color: #f3f3f3;
}

.timeline-comment-wrapper {
    position: relative;
    padding-left: 64px;
    margin-top: 15px;
    margin-bottom: 15px;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
}
.timeline-comment-wrapper>.timeline-comment::after, .timeline-comment-wrapper>.timeline-comment::before, .timeline-new-comment .timeline-comment::after, .timeline-new-comment .timeline-comment::before {
    position: absolute;
    top: 11px;
    right: 100%;
    left: -16px;
    display: block;
    width: 0;
    height: 0;
    pointer-events: none;
    content: " ";
    border-color: transparent;
    border-style: solid solid outset;
}
.timeline-comment-wrapper>.timeline-comment::before, .timeline-new-comment .timeline-comment::before {
    border-width: 8px;
    border-right-color: #ddd;
}

.timeline-comment-wrapper:first-child {
    margin-top: 0;
}
.timeline-comment-avatar {
    float: left;
    margin-left: -64px;
    border-radius: 3px;
}
.timeline-comment {
    position: relative;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 3px;
}

.timeline-comment-header {
    padding-right: 15px;
    padding-left: 15px;
    color: #767676;
    background-color: #f7f7f7;
    border-bottom: 1px solid #eee;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
.timeline-comment-actions {
    float: right;
    margin-right: -5px;
    margin-left: 10px;
}
.timeline-comment-header-text {
    max-width: 78%;
    padding-top: 10px;
    padding-bottom: 10px;
}
strong {font-weight: 600;}
.timeline-comment-header .author {
    color: #555;
}
.timeline-comment-header .timestamp {
    color: inherit;
    white-space: nowrap;
}

.comment-body {
    width: 100%;
    padding: 15px;
    overflow: visible;
    font-size: 14px;
}


.markdown-body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 1.1em;
    line-height: 1.4em;
    word-wrap: break-word;
}
.markdown-body::before {
    display: table;
    content: "";
}
.markdown-body p, .markdown-body blockquote, .markdown-body ul, .markdown-body ol, .markdown-body dl, .markdown-body table, .markdown-body pre {
    margin-top: 0;
    margin-bottom: 16px;
}
.markdown-body>*:first-child {
    margin-top: 0 !important;
}
.markdown-body>*:last-child {
    margin-bottom: 0 !important;
}

.markdown-body::after {
    display: table;
    clear: both;
    content: "";
}
.comment-reactions::before {
    display: table;
    content: "";
}
.comment-reactions::after {
    display: table;
    clear: both;
    content: "";
}
.discussion-item {
    position: relative;
    padding-left: 25px;
    margin: 15px 0 15px 79px;
}
.discussion-item+.discussion-item {
    padding-top: 15px;
    border-top: 1px solid #f5f5f5;
}
.discussion-item-header {
    min-height: 30px;
    padding-top: 5px;
    padding-bottom: 5px;
    line-height: 20px;
    color: #767676;
    word-wrap: break-word;
}
.discussion-item-header:last-child {
    padding-bottom: 0;
}
.discussion-item-icon {
    float: left;
    width: 32px;
    height: 32px;
    margin-top: -7px;
    margin-left: -40px;
    line-height: 28px;
    color: #767676;
    text-align: center;
    background-color: #f3f3f3;
    border: 2px solid #fff;
    border-radius: 50%;
    padding-top: 2px;
}

.octicon {
    display: inline-block;
    vertical-align: text-top;
    fill: currentColor;
}
.octicon {
    vertical-align: text-bottom;
}
.discussion-item-icon .octicon {
    vertical-align: text-bottom;
}
svg:not(:root) {
    overflow: hidden;
}

.avatar {
    display: inline-block;
    overflow: hidden;
    line-height: 1;
    vertical-align: middle;
    border-radius: 3px;
}
.discussion-item .author {
    font-weight: 600;
    color: #555;
}
.discussion-item .label-color {
    padding: 2px 4px;
    font-size: 12px;
    font-weight: bold;
    border-radius: 2px;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.12);
}
.discussion-item .timestamp {
    color: inherit;
    white-space: nowrap;
}

.discussion-item-header .avatar {
    float: left;
    margin-top: 2px;
    margin-right: 5px;
}
.red {color:red;}
.green {color:rgb(0,128,0);}

.discussion-timeline-actions {
    background-color: #fff;
    border-top: 2px solid #f3f3f3;
}


/****************************/

.nav-pills>li>a {
    color: #fff;
    background-color: #006598;
}
.nav-pills>li>a:hover, .nav-pills>li>a:focus {
    text-decoration: none;
    color: #0078b5;
}
.nav-pills>.active>a,.nav-pills>.active>a:hover,.nav-pills>.active>a:focus {
    color: #fff;
    background-color: #08c;
}

.nav-pills>li>a {
    -webkit-border-radius: 0px; */
    -moz-border-radius: 0px;
    border-radius: 0px; */
}

.nav>li>a:hover,.nav>li>a:focus,.nav>li>a:active, .nav>li.active>a {
    text-decoration: none;
    color: #efca15;
    background-color:initial;
}

/*********************  fancy checkboxes -- https://codepen.io/bbodine1/pen/novBm  ************

/* .roundedOne */
.roundedOne {
  width: 28px;
  height: 28px;
  position: relative;
  margin: 20px auto;
  background: #fcfff4;
  background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.roundedOne label {
  width: 20px;
  height: 20px;
  cursor: pointer;
  position: absolute;
  left: 4px;
  top: 4px;
  background: -webkit-linear-gradient(top, #222222 0%, #45484d 100%);
  background: linear-gradient(to bottom, #222222 0%, #45484d 100%);
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px white;
}
.roundedOne label:after {
  content: '';
  width: 16px;
  height: 16px;
  position: absolute;
  top: 2px;
  left: 2px;
  background: #27ae60;
  background: -webkit-linear-gradient(top, #27ae60 0%, #145b32 100%);
  background: linear-gradient(to bottom, #27ae60 0%, #145b32 100%);
  opacity: 0;
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.roundedOne label:hover::after {
  opacity: 0.3;
}
.roundedOne input[type=checkbox] {
  visibility: hidden;
}
.roundedOne input[type=checkbox]:checked + label:after {
  opacity: 1;
}

/* end .roundedOne */
/* .roundedTwo */
.roundedTwo {
  width: 28px;
  height: 28px;
  position: relative;
  margin: 20px auto;
  background: #fcfff4;
  background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.roundedTwo label {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 4px;
  left: 4px;
  cursor: pointer;
  background: -webkit-linear-gradient(top, #222222 0%, #45484d 100%);
  background: linear-gradient(to bottom, #222222 0%, #45484d 100%);
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px white;
}
.roundedTwo label:after {
  content: '';
  width: 9px;
  height: 5px;
  position: absolute;
  top: 5px;
  left: 4px;
  border: 3px solid #fcfff4;
  border-top: none;
  border-right: none;
  background: transparent;
  opacity: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.roundedTwo label:hover::after {
  opacity: 0.3;
}
.roundedTwo input[type=checkbox] {
  visibility: hidden;
}
.roundedTwo input[type=checkbox]:checked + label:after {
  opacity: 1;
}

/* end .roundedTwo */
/* .squaredOne */
.squaredOne {
  width: 28px;
  height: 28px;
  position: relative;
  margin: 20px auto;
  background: #fcfff4;
  background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.squaredOne label {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 4px;
  left: 4px;
  cursor: pointer;
  background: -webkit-linear-gradient(top, #222222 0%, #45484d 100%);
  background: linear-gradient(to bottom, #222222 0%, #45484d 100%);
  box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px white;
}
.squaredOne label:after {
  content: '';
  width: 16px;
  height: 16px;
  position: absolute;
  top: 2px;
  left: 2px;
  background: #27ae60;
  background: -webkit-linear-gradient(top, #27ae60 0%, #145b32 100%);
  background: linear-gradient(to bottom, #27ae60 0%, #145b32 100%);
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
  opacity: 0;
}
.squaredOne label:hover::after {
  opacity: 0.3;
}
.squaredOne input[type=checkbox] {
  visibility: hidden;
}
.squaredOne input[type=checkbox]:checked + label:after {
  opacity: 1;
}

/* end .squaredOne */
/* .squaredTwo */
.squaredTwo {
  width: 28px;
  height: 28px;
  position: relative;
  margin: 20px auto;
  background: #fcfff4;
  background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.squaredTwo label {
  width: 20px;
  height: 20px;
  cursor: pointer;
  position: absolute;
  left: 4px;
  top: 4px;
  background: -webkit-linear-gradient(top, #222222 0%, #45484d 100%);
  background: linear-gradient(to bottom, #222222 0%, #45484d 100%);
  box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px white;
}
.squaredTwo label:after {
  content: '';
  width: 9px;
  height: 5px;
  position: absolute;
  top: 4px;
  left: 4px;
  border: 3px solid #fcfff4;
  border-top: none;
  border-right: none;
  background: transparent;
  opacity: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.squaredTwo label:hover::after {
  opacity: 0.3;
}
.squaredTwo input[type=checkbox] {
  visibility: hidden;
}
.squaredTwo input[type=checkbox]:checked + label:after {
  opacity: 1;
}

/* end .squaredTwo */
/* .squaredThree */
.squaredThree {
  width: 20px;
  position: relative;
  margin: 20px auto;
}
.squaredThree label {
  width: 20px;
  height: 20px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  background: -webkit-linear-gradient(top, #222222 0%, #45484d 100%);
  background: linear-gradient(to bottom, #222222 0%, #45484d 100%);
  border-radius: 4px;
  box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.4);
}
.squaredThree label:after {
  content: '';
  width: 9px;
  height: 5px;
  position: absolute;
  top: 4px;
  left: 4px;
  border: 3px solid #fcfff4;
  border-top: none;
  border-right: none;
  background: transparent;
  opacity: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.squaredThree label:hover::after {
  opacity: 0.3;
}
.squaredThree input[type=checkbox] {
  visibility: hidden;
}
.squaredThree input[type=checkbox]:checked + label:after {
  opacity: 1;
}

/* end .squaredThree */
/* .squaredFour */
.squaredFour {
  width: 20px;
  position: relative;
  margin: 20px auto;
}
.squaredFour label {
  width: 20px;
  height: 20px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  background: #fcfff4;
  background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  border-radius: 4px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.squaredFour label:after {
  content: '';
  width: 9px;
  height: 5px;
  position: absolute;
  top: 4px;
  left: 4px;
  border: 3px solid #333;
  border-top: none;
  border-right: none;
  background: transparent;
  opacity: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.squaredFour label:hover::after {
  opacity: 0.5;
}
.squaredFour input[type=checkbox] {
  visibility: hidden;
}
.squaredFour input[type=checkbox]:checked + label:after {
  opacity: 1;
}

/* end .squaredFour */

/******************************************/

.modal-body {
    position: relative;
    max-height: 370px;
}

.subnav {
	font-size:.9em;
}

.green-color {color:green}
.red-color   {color:red}

.hilite		 {background-color: #fffaba; }

/*******        Horos customisation               *******/

@font-face {
    font-family: 'HamburgSymbols';
    src: url('/fonts/HamburgSymbols.eot');
    src: url('/fonts/HamburgSymbols.eot?#iefix') format('embedded-opentype'),
         url('/fonts/HamburgSymbols.woff2') format('woff2'),
         url('/fonts/HamburgSymbols.woff') format('woff'),
         url('/fonts/HamburgSymbols.ttf') format('truetype'),
         url('/fonts/HamburgSymbols.svg#HamburgSymbols') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Planets';
    src: url('/fonts/planets.eot');
    src: url('/fonts/planets.eot?#iefix') format('embedded-opentype'),
         url('/fonts/planets.woff') format('woff'),
         url('/fonts/planets.ttf') format('truetype'),
         url('/fonts/planets.svg#Planets') format('svg');
    font-weight: normal;
    font-style: normal;
}

.planetSymbol {
	color:rgb(203, 57, 179);
	/* font-family:Planets; */	
	font-family:HamburgSymbols;	
	width: 1.1em;
}

input[type="checkbox"] {width: 19px; height: 16px;}
		
		
.symb {
	font-family:Symbol;
	font-weight:bold;
}
.symbL {
	font-family:serif;
	font-weight:bold;
}
.mjax {
	font-family: MathJax_Main;
}
.Open-Sans-normal-800 {
font-family: 'Open Sans' !important;
font-style: normal;
font-weight: 800;
}
.Khula-normal-800 {
font-family: 'Khula' !important;
font-style: normal;
font-weight: 800;
}

/* Dark Theme */
input, select, button, textarea {
	-webkit-border-radius: 0px!important;
    -moz-border-radius: 0px!important;
    border-radius: 0px!important;
}
    
.form-table{
	background-color:#222633;
}
body {
	background-color:#1e1e1e;
	color:#9CDCFE;
	padding-top: 5px;
}
legend {
	color:#d6a956;
	width:250px;
	border-bottom: 1px solid #99d6bf;
}
.subject {
	color:#66c85c;
}
h2 {
	font-size:20px;
	line-height:18px;
}
h1 {
	font-size:24px;
	color:#a270d0;
}
.row {
	margin-left:0px;
}
.insidebar {
    min-width:0px!important;
}
.form-actions {
	background-color: #40404a;
    border-top: 0px;
}


html {
  --scrollbarBG: #373838;
     --thumbBG: #3d677b;
}
body::-webkit-scrollbar, .thinscroll::-webkit-scrollbar {
  width: 14px;
}
body, .thinscroll {
  scrollbar-width: thin;
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
body::-webkit-scrollbar-track, .thinscroll::-webkit-scrollbar-track {
  background: var(--scrollbarBG);
}
body::-webkit-scrollbar-corner, .thinscroll::-webkit-scrollbar-corner {
  background: var(--scrollbarBG);
}
body::-webkit-scrollbar-thumb, .thinscroll::-webkit-scrollbar-thumb {
  background-color: var(--thumbBG) ;
  border-radius: 6px;
  border: 3px solid var(--scrollbarBG);
}

th {
	text-align: left;
	vertical-align: top;
}
.house {
	color:rgb(169, 143, 38);
	/*font-weight:bold;*/
	letter-spacing:-3px;
	font-size:inherit;
	width:1em;
	display:inline-block;
	text-align:center;
}

.symbol {
	color:#73aad4;
	font-family:Wingdings;	
	width: 1.1em;	
    text-align: center;
    font-size: .9em;
    margin-top:-4px;;
}
.sign {
	color:rgb(77,160,69);
	color:rgb(102, 200, 92);
	
	/*font-weight:bold;*/
	letter-spacing:-2px;
}
.degrees {
	color:rgb(169, 143, 38);
	/*font-weight:bold;*/
	letter-spacing:-3px;
	font-size:inherit;
}
.secs {
	color:rgb(93,48,146);
	/*font-weight:bold;*/
	letter-spacing:-3px;
	font-size: .5em;
	vertical-align: top;
	line-height: 1.8em;
	margin-left:.1em;
}
h1, h2 {
	margin:0;
	color: rgb(169, 143, 38);
}
h2 {
	font-size:20px;
	line-height:18px;
}
h1 {
	font-size:24px;
	color:#a270d0;
}
h2>span.planetSymbol {
	color:rgb(203, 57, 179);
	font-family:Planets;	
}

h2>span.symbol {
	color:rgb(57,140,203);
	font-family:Wingdings;	
	
}
h2>span.sign {
	color:rgb(77,160,69);
	/*font-family:"Segoe WP";*/
	/*font-weight:bold;*/
	letter-spacing:-2px;
}
h2>span.degrees, h2>div.degrees {
	color:rgb(219, 200, 101);
	/*font-weight:bold;*/
	letter-spacing:-2px;
	font-size:inherit;
	width: 1.35em;
    text-align: center;
}
h2>span.secs, h2>div.secs {
	color:rgb(182, 173, 74);
	/*font-weight:bold;*/
	letter-spacing:-2px;
	font-size: .5em;
	vertical-align: top;
	line-height: 1.8em;
	margin-left:.1em;
	width: 1.2em;
}
h2>div { float:left }

h2>span.mins, h2>div.mins {
	width: 1.1em;
}

.load-button:hover {
	cursor: pointer;
}
		
.current {		
	background-color: #6d005d;
    color: #ffec04;
}

.thumbnail {
	max-width: 132px;
}
.yoga-table { 
	font-size:.7em
}

.yoga-table  td {
	padding:0;
}

.lite {
	color:#eae05f;
}

h3.attrs {
	max-width: 800px;
   	overflow-wrap: break-word;
}
	
	
	



.dasha-table .row-dasha {
    display: none;
}

.dasha-table {
	width: 100%;
    height: 100%;
}

.select-sook .row-dasha {
    display: table-row;
}

.select-maha .row-dasha.maha {
    display: table-row;
}
.select-antar .row-dasha.antar {
    display: table-row;
}
.select-prat .row-dasha.prat {
    display: table-row;
}

table.select-prat td.sookshma-lord, 

table.select-antar td.sookshma-lord, 
table.select-antar td.pratyantar-lord, 

table.select-maha td.sookshma-lord, 
table.select-maha td.pratyantar-lord,
table.select-maha td.antar-lord  {
    display: none;
}

.reading {
    width: 380px;
    border: rgb(94, 114, 130) 1px solid;
    margin-bottom: 10px;
    background-color: #1f274a;
}
.readingImg {
  margin: 10px; 
  height:48px;
  float: left;
}
.readingImg img {
  width:48px;
}
.readingHdr {
  height: 48px;
}
.readingHdrTitle {
  float: left;
  width: calc(100% - 75px);
}
.readingSubject {
  margin: 10px; 
  font-weight: bold;
  color: #fff;
  font-size: 14px;
  overflow: visible;
  text-overflow: initial;
}
.readingSubTitle {
  margin: 10px;
  color:#cfdfff;
  font-size: 12px;
}
.readingTitle {
  color: #759aef;
  font-size: 12px;
  margin: 10px;
}
.readingBody {
  margin: 10px;
  font-size: 14px;
  color: #fff;
  line-height: 1.25rem;
}
.readingBodyInfo {
  font-size: 12px;
  margin-left: 10px;
  font-style: italic;
  color: #9a9abd;
}
.readingFooter {
  margin: 10px;
  margin-top: 0;
  padding-top: 5px;
  color: grey;
  font-size: 12px;
  border-top: rgb(94, 114, 130) 1px solid;  
}


/** responsive formatting  **/

/* ccLayoutChart */

.dropbtn {
    background-color:#003965;
    color: #77C7CA;
    padding: 12px;
    font-size: 14px;
    border: none;
    cursor: pointer;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 8px 14px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
   /* margin-top: 2px; */
}

.dropdown:hover .dropbtn {
    background-color: #135588;
}




.container {
	width:100%!important;
	padding-left:5px;
}

	
[class*="span"] {
	margin-left:5px;
}

@media (min-width: 1200px) {		
	.span1 {
	    margin-left:-11px;
	}
	.span11 {
	    width: 1163px;
	}
}

.nav-mini-side-bar {
	float: left;
    position: fixed;
    width: 50px;
    height: 100vh;
    font-size: 24px;
    text-align: center;
    background-color: #1c0048;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
    margin-bottom: 0;
}

.float-left {
	float:left;
}

.navbar-inverse .navbar-inner {
	height: 50px;
    background-color: #1c0048;
    background-image: -moz-linear-gradient(top,#1c0048,#1c0048);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#1c0048),to(#1c0048));
    background-image: -webkit-linear-gradient(top,#1c0048,#1c0048);
    background-image: -o-linear-gradient(top,#1c0048,#1c0048);
    background-image: linear-gradient(to bottom,#1c0048,#1c0048);
   }
   
   
/* page layouts */

body {
    padding-top: 0px;
    padding-bottom: 0px;
} 

form {
    margin: 0 0 0;
}



.show-top-nav .wrapper {
	margin-top:45px; 
}

@media (max-width: 979px) {
	.navbar-fixed-top, .navbar-fixed-bottom {
	    position: fixed;
	}
}

.nav-side-bar {
	margin-left: 55px;
	width:350px;
	float: left;
    min-height: 1px;
}

.info-box-col {
	float: left;
	width: 100%;
    height: calc(100vh);
    overflow-y: scroll;	
}

.dasha-menu, .dasha-frame-menu {
	width: 220px;
    margin: 0 auto;
    font-size: .9em;	
}

.dasha-panel, .dasha-frame-panel {
	overflow-y: scroll;
    height: 19em;
    border: solid 1px #2f5496;
    margin-bottom: 1em;
    font-size: .8em!important;
    width: 98%;	
}

.dasha-iframe {
	height: 19em;
}

.main-container {
	width: 1585px;
    margin-left: 5px;
    float: left;
    min-height: 1px;	
}

.main-panel {
	
}

.readings-container {
	margin-top:7px;
	width:420px;
	float:left;	
}


.reading {
   	width: 99%;
}

.readings-menu {
	width:390px; padding-left:10px; padding-right:10px;
}

.menu-btn {
	display:inline-block;
	padding:1px;
	cursor:pointer;
	margin:1px;
	font-size:1.6em;
}

.pl-icon {
	font-size:1.7em;
}

.chartCol {
  width:600px;
  height: calc(100vh);
  overflow-y: scroll;
  float: left;
}

.show-top-nav .chartCol {
  width:555px;
  height: calc(100vh - 52px);
  overflow-y: scroll;
  float: left;
}

.readingsCol {
  margin: 10px;
  margin-bottom: 0px;
  width: 100%;
  height: calc(100vh - 118px);
  overflow-y: scroll;
  /* float: left; */
}

.show-top-nav .readingsCol {
  margin: 10px;
  width: 400px;
  height: calc(100vh - 170px);
  overflow-y: scroll;
  /* float: left; */
}

/* ChartBasics */

.form-table label, .form-table .row-label {
    white-space: nowrap;
}

.form-control {
    font-size: 1em;
    background-color: #2f5496;
    padding: 0px;
    border: 0px solid #ddd;
}

select {
    background-color: #2f5496;
    border: 0px solid #ddd;
    margin: 0px;
    color:beige;
}

.panchanga span {
	font-size:.9em;
	white-space: nowrap;
	color:#c4c700;
}


/* charts display */

.chart-container {
	position: relative;
   	width: 98%;
   	padding-top: 98%;
}

.chart0  {
	/* position:relative; */
	/* width:540px; */
	/* height:540px; */
	float:left;
	position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.chart0 canvas, .chart1 canvas, .chart2 canvas, .chart3 canvas  {
	width:100%;
	height:100%;
}

.chart1, .chart2, .chart3  {
	/* position:relative;
	width:270px;
	height:300px; */
	position: absolute;
	float:left; 
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 50%;
    height: calc(50% + 30px);
    
}

.disp2 .chart-container {
	padding-top: calc(50% + 30px);
}

.disp4 .chart-container {
   	padding-top: calc(98% + 60px);
}

/* .disp1 .chart0 {
	width:540px;
	height:540px;
} */

.disp2 .chart0, .disp4 .chart0 {
	/* width:270px;
	height:270px; */
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 50%;
}

.disp2 .chart0, .disp4 .chart0 {
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: 50%;
}

.disp2 .chart1, .disp4 .chart1 {
    top: 0;
    left: 50%;
    bottom: 0;
    right: 0;
    height: 50%;
}

.disp4 .chart2 {
    top: 50%;
    left: 0;
    bottom: 0;
    right: 0;
    height: 50%;
}

.disp4 .chart3 {
    top: 50%;
    left: 50%;
    bottom: 0;
    right: 0;
    height: 50%;
}

.disp1 .chart1, .disp1 .chart2, .disp1 .chart3, .disp1 .chart0 .form-table-hdr {
	display:none;
}

.disp2 .chart2, .disp2 .chart3 {
	display:none;
}

.disp1 .chart1 .form-table-hdr, 
.disp1 .chart2 .form-table-hdr, 
.disp1 .chart3 .form-table-hdr, 
.disp1 .chart0 .form-table-hdr {
    width: 260px;
    margin-left: 2px;
}

.calc-table, .panchanga {
	float:left;
	min-width:280px;
}

.calc-table td {
	white-space: nowrap;
}

/** Transit player controls **/

.transit-player-controls {
	/* height:35px; */
	text-align:center;
	float:left;
	min-width:280px;	
}

.transit-player-controls button {
	background-color: #2d3854; 
	color:#ffd49a;	
}



input.tdate {
	width: 130px;
    background-color: #2d3854;
    color: #ffd49a;
    margin-bottom:0px;
    margin-left:8px;
}
[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0.6;
  filter: invert(0.8);
}

input[type="date"]::-webkit-calendar-picker-indicator:hover {
  opacity: 1
}


.transit-info-box {
	border: solid 1px #2f5496;
    margin-bottom: 1em;
    font-size: .9em;
    width: 100%;	
}

.transit-direction {
	width:67px;background-color: #2d3854; color:#ffd49a;
}

.transit-increment {
	width:77px;
	background-color: #2d3854; 
	color:#ffd49a; 
	padding: 2px;
	margin: 0px; 
	margin-right: 6px;
	border-color: rgb(118 118 118 / 1);
}

.btn-step, .btn-play, .btn-stop {background-color: #2d3854; color:#ffd49a;}

.load-button {
	background-color: #2d3854;
    color: #ffd49a;
    border: solid aliceblue 1px;
    padding: 4px;
    width: 204px;
}




/** 1600 - 1920 **/
@media (min-width: 1600px) and (max-width: 1920px) {
	.main-container {
   		/* width: 1175px; */
   		width: calc(100% - 415px);
	}
	
	.dasha-table {
		font-size:1.1em;
	}
	
	.chart-container_orig {
		margin: 0 auto;
    	width: 540px;
	}
	/* .chart-container {
		position: relative;
    	width: 98%;
    	padding-top: 98%;
	} */
	
	.chartCol {
    	width: 640px;
	}
	
	.readings-container {
		width: 535px;
   		width: calc(100% - 650px);
	}
	.readings-menu {
	    width: 500px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1.6em;
	}
	.pl-icon {
		font-size:2em;
	}
	.readingsCol {
	    width: 520px;
	    width:100%;	
	}
	.readingHdrTitle {
	    width: calc(100% - 75px);
	}
	.readingTitle {
		font-size: 1.2em;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1.3em;
	    line-height: 1.4em;
	}
	.readingBody {
	    margin: 20px;
	}
	
}


/** 1440 - 1599 **/
@media (min-width: 1440px) and (max-width: 1599px) {
	.main-container {
   		width: calc(100% - 420px);
	}
	.chart-container_orig {
		margin: 0 auto;
    	width: 540px;
	}
	/* .chart-container {
		position: relative;
    	width: 98%;
    	padding-top: 98%;
	} */
	
	.nav-side-bar {
    	width: 350px;
	}
	
	.chartCol {
    	width: 600px;
	}
	
	.readings-container {
		width: calc(100% - 600px);
	}
	.readings-menu {
	    width: 500px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1.2em;
	}
	.pl-icon {
		font-size:1.7em;
	}
	.readingsCol {
	    width: 520px;
	    width:97%;	
	}
	.readingHdrTitle {
	    width: width: calc(100% - 75px);
	}
	.readingTitle {
		font-size: 1.2em;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1.3em;
	    line-height: 1.4em;
	}
	.readingBody {
	    margin: 20px;
	}
	
}

@media (min-width: 250px) and (max-width: 349px) {
	.dasha-frame-menu {
		width: 220px;
	    font-size: .9em;	
	}
	
	.dasha-frame-panel {
	    height: 19em;
	    margin-bottom: 1em;
	    font-size: .8em!important;
	    width: 98%;	
	}
}




/** 1366 - 1439 **/
@media (min-width: 1366px) and (max-width: 1439px) {
	
	.nav-side-bar {
		width:270px;
	}
	
	.info-box-col {
		height: calc(100vh);
	    overflow-y: scroll;	
	}
	
	.dasha-menu {
		width: 205px;
	    font-size: .9em;	
	}
	
	.dasha-panel {
	    height: 19em;
	    margin-bottom: 1em;
	    font-size: .8em!important;
	    width: 98%;	
	}
	
	.main-container {
		width: calc(100% - 335px);
	}
	
	.main-panel {
		
	}
	
	.readings-container {
		width: calc(100% - 605px);
	}
	
	.readings-menu {
		width:390px; 
		padding-left:10px; 
		padding-right:10px;
	}
	.readingsCol {
	    width:99%;	
	}
	
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1.2em;
	    line-height: 1.35em;
	}
	
	.reading {
    	width: 98%;
	}
	.menu-btn {
		font-size:1.2em;
	}
	.pl-icon {
		font-size:1.7em;
	}
	
	.chartCol {
	  width:600px;
	}
	
	/* ChartBasics */
	
	.form-control {
	    font-size: 1em;
	    padding: 0px;
	    border: 0px solid #ddd;
	}
	
	.panchanga span {
		font-size:.9em;
		white-space: nowrap;
		color:#c4c700;
	}
	
	
	/* charts display */
	
	/* .chart0  {
		position:relative;
		width:540px;
		height:540px;
		float:left;
	} */
	
	.chart0 canvas {
		width:100%;
		height:100%;
	}
	
	/* .chart1, .chart2, .chart3  {
		position:relative;
		width:270px;
		height:300px;
		float:left;
	} */
	
	/* .disp1 .chart0 {
		width:540px;
		height:540px;
	} */
	
	/* .disp2 .chart0, .disp4 .chart0 {
		width:270px;
		height:270px;
	} */
	
		
	
}

/** 1280 - 1365 **/
@media (min-width: 1280px) and (max-width: 1365px) {
	
	.nav-side-bar {
		width:270px;
	}
	
	.main-container {
		width: calc(100% - 335px);
	}
	
	.chartCol {
    	width: 580px;
	}
	
	.readings-container {
		width: calc(100% - 585px);
	}
	.readings-menu {
	    width: 338px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1em;
	}
	.pl-icon {
		font-size:1.4em;
	}
	.readingsCol {
	    width: 520px;	
  		width: 99%;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
}



/** 1024 - 1279 **/
@media (min-width: 1024px) and (max-width: 1099px) {
	
	.nav-side-bar {
		width:250px;
	}
	
	.main-container {
		width: calc(100% - 315px);
	}
	
	.chartCol {
    	width: 400px;
	}
	
	.readings-container {
		width: calc(100% - 400px);
	}
	.readings-menu {
	    width: 285px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:.8em;
	}
	.pl-icon {
		font-size:1.1em;
	}
	.readingsCol {
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
	/* .chart0  {
		position:relative;
		width:400px;
		height:400px;
		float:left;
	}
	
	.chart1, .chart2, .chart3  {
		position:relative;
		width: 192px;
    	height: 225px;
		float:left;
	}
	
	/* .disp1 .chart0 {
		width:400px;
		height:400px;
	} */
	
	/* .disp2 .chart0, .disp4 .chart0 {
		width: 192px;
    	height: 225px;
	} */

	.disp1 .chart1 .form-table-hdr, 
	.disp1 .chart2 .form-table-hdr, 
	.disp1 .chart3 .form-table-hdr, 
	.disp1 .chart0 .form-table-hdr {
	    width: 200px;
	    margin-left: 2px;
	}
	
	.calc-table span {
		font-size: .8em;
	}
	
	.panchanga label, .panchanga span {
		font-size: .75em;
	}
	
}


/** 1100px - 1199px **/
@media (min-width: 1100px) and (max-width: 1199px) {
	
	.nav-side-bar {
		width:250px;
	}
	
	.main-container {
		width: calc(100% - 315px);
	}
	
	.chartCol {
    	width: 450px;
	}
	
	.readings-container {
		width: calc(100% - 450px);
	}
	.readings-menu {
	    width: 285px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:.8em;
	}
	.pl-icon {
		font-size:1.1em;
	}
	.readingsCol {
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
	/* .chart0  {
		position:relative;
		width:450px;
		height:450px;
		float:left;
	}
	
	.chart1, .chart2, .chart3  {
		position:relative;
		width: 216px;
    	height: 248px;
		float:left;
	}
	
	/* .disp1 .chart0 {
		width:450px;
		height:450px;
	} */
	
	/* .disp2 .chart0, .disp4 .chart0 {
		width: 216px;
    	height: 248px;
	} */

	.disp1 .chart1 .form-table-hdr, 
	.disp1 .chart2 .form-table-hdr, 
	.disp1 .chart3 .form-table-hdr, 
	.disp1 .chart0 .form-table-hdr {
	    width: 200px;
	    margin-left: 2px;
	}
	
	.calc-table span {
		font-size: .8em;
	}
	
	.panchanga label, .panchanga span {
		font-size: .75em;
	}
	
}




/** 1200px - 1279px **/
@media (min-width: 1200px) and (max-width: 1279px) {
	
	.nav-side-bar {
		width:250px;
	}
	
	.main-container {
		width: calc(100% - 315px);
	}
	
	.chartCol {
    	width: 500px;
	}
	
	.readings-container {
		width: calc(100% - 500px);
	}
	.readings-menu {
	    width: 345px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1em;
	}
	.pl-icon {
		font-size:1.4em;
	}
	.readingsCol {
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
	/* .chart0  {
		position:relative;
		width:500px;
		height:500px;
		float:left;
	}
	
	.chart1, .chart2, .chart3  {
		position:relative;
		width: 240px;
    	height: 275px;
		float:left;
	}
	
	/* .disp1 .chart0 {
		width:500px;
		height:500px;
	} */
	
	/* .disp2 .chart0, .disp4 .chart0 {
		width: 240px;
    	height: 275px;
	} */

	.disp1 .chart1 .form-table-hdr, 
	.disp1 .chart2 .form-table-hdr, 
	.disp1 .chart3 .form-table-hdr, 
	.disp1 .chart0 .form-table-hdr {
	    width: 200px;
	    margin-left: 2px;
	}
	
	.calc-table span {
		font-size: .8em;
	}
	
	.panchanga label, .panchanga span {
		font-size: .75em;
	}
	
}



/** 850 - 1023 **/
@media (min-width: 850px) and (max-width: 1023px) {
	
	.nav-side-bar {
		width:250px;
	}
	
	.main-container {
		width: calc(100% - 315px);
	    height: calc(100vh);
	    overflow-y: scroll;
	}
	
	.chartCol {
    	width: 540px;
    	height: auto;
    	overflow-y: auto;
	}
	
	.readings-container {
		width: 100%;
	}
	.readings-menu {
	    width: 338px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1em;
	}
	.pl-icon {
		font-size:1.4em;
	}
	.readingsCol {
	    width: 520px;	
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1.2em;
	    line-height: 1.35em;
	}
	.readingBody {
	    margin: 20px;
	}
	
}


@media (min-width: 220px) and (max-width: 249px) {
		
}


/** 800 - 849 **/
@media (min-width: 800px) and (max-width: 849px) {
	
	.nav-side-bar {
		width:220px;
	}
	

	.transit-info-box {
	    font-size: 0.8em;
	    width: 203px;
	}
	
	.transit-increment {width:55px;font-size:1em;}
	.transit-direction {width:55px;font-size:1em;}
	.btn-play, .btn-stop, .btn-play {font-size:1em}
	
	.main-container {
		width: calc(100% - 285px);
	    height: calc(100vh);
	    overflow-y: scroll;
	}
	
	.ccDashaMenu, .ccChartMenu, .ccTransitMenu, .ccPersonMenu, .forecast-box, .ccLocalMenu {
		font-size: .9em;
	}
	
	.transit-info-box {
	    font-size: .8em;
	}
	
	.transit-info-box input {
	    font-size: 1.1em;
	    width: 122px;
	}
	
	.load-button {
	    width: 194px;
	}
	
	.chartCol {
    	width: 450px;
    	height: auto;
    	overflow-y: auto;
	}
	
	.readings-container {
		width: 100%;
	}
	.readings-menu {
	    width: 338px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1em;
	}
	.pl-icon {
		font-size:1.4em;
	}
	.readingsCol {
	    width: 520px;	
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
	/* .chart0  {
		position:relative;
		width:450px;
		height:450px;
		float:left;
	}
	
	.chart1, .chart2, .chart3  {
		position:relative;
		width: 216px;
    	height: 248px;
		float:left;
	}
	
	/* .disp1 .chart0 {
		width:450px;
		height:450px;
	} */
	
	/* .disp2 .chart0, .disp4 .chart0 {
		width: 216px;
    	height: 248px;
	} */

	.disp1 .chart1 .form-table-hdr, 
	.disp1 .chart2 .form-table-hdr, 
	.disp1 .chart3 .form-table-hdr, 
	.disp1 .chart0 .form-table-hdr {
	    width: 200px;
	    margin-left: 2px;
	}
	
	.calc-table span {
		font-size: .8em;
	}
	
	.panchanga label, .panchanga span {
		font-size: .75em;
	}
	
}



/** 800 - 849 **/
@media (min-width: 768px) and (max-width: 799px) {
	
	.nav-side-bar {
		width:220px;
	}
	
	.main-container {
		width: calc(100% - 285px);
	    height: calc(100vh);
	    overflow-y: scroll;
	}
	
	.chartCol {
    	width: 450px;
    	height: auto;
    	overflow-y: auto;
	}
	
	.readings-container {
		width: 100%;
	}
	.readings-menu {
	    width: 338px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1em;
	}
	.pl-icon {
		font-size:1.4em;
	}
	.readingsCol {
	    width: 520px;	
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
	/* .chart0  {
		position:relative;
		width:450px;
		height:450px;
		float:left;
	}
	
	.chart1, .chart2, .chart3  {
		position:relative;
		width: 216px;
    	height: 248px;
		float:left;
	}
	
	/* .disp1 .chart0 {
		width:450px;
		height:450px;
	} 
	
	.disp2 .chart0, .disp4 .chart0 {
		width: 216px;
    	height: 248px;
	} */

	.disp1 .chart1 .form-table-hdr, 
	.disp1 .chart2 .form-table-hdr, 
	.disp1 .chart3 .form-table-hdr, 
	.disp1 .chart0 .form-table-hdr {
	    width: 200px;
	    margin-left: 2px;
	}
	
	.calc-table span {
		font-size: .8em;
	}
	
	.panchanga label, .panchanga span {
		font-size: .75em;
	}
	
}




@media (min-width: 570px) and (max-width: 717px) {
	.dasha-frame-panel {
    	height: 13em;
	}	

	.dasha-iframe {
		height: 13em;
	}
	
}


/** up to 767 **/
@media (min-width: 620px) and (max-width: 767px) {
	
	body {
	    padding-right: 0px;
	    padding-left: 0px;
	}
	
	.nav-side-bar {
		width: calc(100% - 50px);
	}
	
	.info-box-col {
		height:auto;
		overflow-y: auto;
	}
	
	.ccChartMenu, .ccPersonMenu {
		width: 48%;
		margin-right:2%;
    	float: left;
		line-height: 1.2em;
		font-size: .8em!important;
	}
	
	.ccDashaMenu {
		width: 48%;
		margin-right:2%;
    	float: left;
	}
	.dasha-panel {
    	height: 13em;
	}
	.main-container {
		width: calc(100% - 55px);
		margin-left: 55px;
	    height:auto;
		overflow-y: auto;
	}
	
	.chartCol {
    	width: 100%;
    	height: auto;
    	overflow-y: auto;
	}
	
	.readings-container {
		width: 100%;
	}
	.readings-menu {
	    width: 338px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1em;
	}
	.pl-icon {
		font-size:1.4em;
	}
	.readingsCol {
	    width: 520px;	
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
	
	/* .chart0  {
		position:relative;
		width:540px;
		height:540px;
		float:left;
	}
	
	.chart0 canvas {
		width:100%;
		height:100%;
	}
	
	.chart1, .chart2, .chart3  {
		position:relative;
		width:270px;
		height:300px;
		float:left;
	}
	
	/* .disp1 .chart0 {
		width:540px;
		height:540px;
	} 
	
	.disp2 .chart0, .disp4 .chart0 {
		width:270px;
		height:270px;
	} */
	.calc-table span {
		font-size: .8em;
	}
	
	.panchanga label, .panchanga span {
		font-size: .75em;
	}
	
}




@media (min-width: 450px) and (max-width: 569px) {
	.dasha-frame-panel {
    	height: 13em;
	}

	.dasha-iframe {
		height: 13em;
	}
	
}


/** up to 619 **/
@media (min-width: 500px) and (max-width: 619px) {
	
	body {
	    padding-right: 0px;
	    padding-left: 0px;
	}
	
	.nav-side-bar {
		width: calc(100% - 50px);
	}
	
	.info-box-col {
		height:auto;
		overflow-y: auto;
	}
	
	.ccChartMenu, .ccPersonMenu {
		width: 48%;
		margin-right:2%;
    	float: left;
		line-height: 1.2em;
		font-size: .8em!important;
	}
	
	.ccDashaMenu {
		width: 48%;
		margin-right:2%;
    	float: left;
	}
	.dasha-panel {
    	height: 13em;
	}
	.main-container {
		width: calc(100% - 55px);
		margin-left: 55px;
	    height:auto;
		overflow-y: auto;
	}
	
	.chartCol {
    	width: 100%;
    	height: auto;
    	overflow-y: auto;
	}
	
	.readings-container {
		width: 100%;
	}
	.readings-menu {
	    width: 338px;
	    margin: 0 auto;
	}
	.menu-btn {
		font-size:1em;
	}
	.pl-icon {
		font-size:1.4em;
	}
	.readingsCol {
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
	.form-table td {
	    padding: 0px .2em 0px .2em;
	}
	

	
	/* .chart0  {
		position:relative;
		width:420px;
		height:420px;
		float:left;
	}
	
	.chart0 canvas {
		width:100%;
		height:100%;
	}
	
	.chart1, .chart2, .chart3  {
		position:relative;
		width:210px;
		height:240px;
		float:left;
	}
	
	/* .disp1 .chart0 {
		width:450px;
		height:450px;
	} 
	
	.disp2 .chart0, .disp4 .chart0 {
		width:210px;
		height:210px;
	} */
	
	.calc-table span {
		font-size: .8em;
	}
	
	.panchanga label, .panchanga span {
		font-size: .75em;
	}
	
}



@media (min-width: 351px) and (max-width: 449px) {
	
	.dasha-frame-panel {
    	height: 13em;
	}

	.dasha-iframe {
		height: 13em;
	}
	
}


/** up to 619 **/
@media (min-width: 0px) and (max-width: 499px) {
	
	body {
	    padding-right: 0px;
	    padding-left: 0px;
	}
	
	.nav-side-bar {
		width: calc(100% - 50px);
	}
	
	.info-box-col {
		height:auto;
		overflow-y: auto;
	}
	
	.ccChartMenu, .ccPersonMenu {
		width: 98%;
		margin-right:2%;
    	float: left;
    	font-size: 1.5em;
    	line-height: 1.6em;
	}
	
	.ccChartMenu span, .ccPersonMenu span {
		line-height: 1.2em;
		font-size: .8em!important;
	}
	
	.ccDashaMenu {
		width: 98%;
		margin-right:2%;
    	float: left;
    	font-size: 1.5em;
	}
	.dasha-panel {
    	height: 13em;
	}
	.main-container {
		width: calc(100% - 55px);
		margin-left: 55px;
	    height:auto;
		overflow-y: auto;
	}
	
	.chartCol {
    	width: 100%;
    	height: auto;
    	overflow-y: auto;
	}
	
	.readings-container {
		width: 100%;
	}
	.readings-menu {
	    width: 338px;
	    margin: 0 auto;  
	}
	
	.readings-menu.stickytop {
	    position:fixed;
	    top:0
	}
	.menu-btn {
		font-size:1em;
	}
	.pl-icon {
		font-size:1.4em;
	}
	.readingsCol {
  		width: 97%;
    	height: auto;
    	overflow-y: auto;
	}
	.readingImg  {
	    height: 32px;
	}
	.readingImg img {
	    width: 32px;
	}
	.readingHdrTitle {
	    width: calc(100% - 70px);
	}
	.readingTitle {
		font-size: 1em;
	}
	.reading {
    	width: 98%;
	}
	.readingSubTitle, .readingSubject, .readingBody {
	    font-size: 1em;
	}
	.readingBody {
	    margin: 20px;
	}
	
	.form-table td {
	    padding: 0px .2em 0px .2em;
	}
	

	
	/* .chart0  {
		position:relative;
		width:260px;
		height:260px;
		float:left;
	} */
	
	.chart0 canvas {
		width:100%;
		height:100%;
	}
	
	/* .chart1, .chart2, .chart3  {
		position:relative;
		width:130px;
		height:160px;
		float:left;
	}
	
	/* .disp1 .chart0 {
		width:260px;
		height:260px;
	} 
	
	.disp2 .chart0, .disp4 .chart0 {
		width:130px;
		height:130px;
	} */
	.calc-table span {
		font-size: .8em;
	}
	
	.panchanga label, .panchanga span {
		font-size: .75em;
	}
	
}