* {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0
}
html,
body {
    width: 100%;
    float: left;
    position: relative;
    font-family:'Open Sans', arial, sans-serif;
    color: #333;
    font-size: 16px;
    background: #fff;
}

img{
	max-width: 100%;
	width: auto;
	height: auto;
}

a{
	text-decoration: none;
	color: #2196f3;
}

.mt20{
	margin-top: 20px;
}
.mt40{
	margin-top: 40px;
}
.mt50{
	margin-top: 50px;
}

.full-width, .half-width{
	width: 100%;
	float: left;
}
	.half-width .half{
		float: left;
		width: 50%;
		box-sizing: border-box;
	}
	.half-width .half:first-child{
		padding-right: 10px;
	}
	.half-width .half:last-child{
		padding-left: 10px;
	}

.center-text{
	text-align: center;
}

.chart-wheel{
	text-align: center;
	font-size: 20px;
}
	.chart-wheel p{
		margin-top: 14px;
	}
	.chart-wheel ul{
		list-style: none;
		margin-top: 14px;
	}
		.chart-wheel ul li{
			display: inline-block;
			margin: 10px 17px;
		}

.a-page.chart-wheel{
	border-bottom: 0;
}
.cover{
	background: center center no-repeat;
    background-size: cover;
    min-height: 100vh;
}
.cover-1{
	font-size: 80px;
    color: #ddedf4;
    margin-top: 40px;
    text-shadow: 1px 1px black;
}
.cover-2{
	font-size: 70px;
    color: gold;
    display: block;
}
.cover-name{
	margin-top:5px;
}
.cover > figure{
	padding: 20px;
	border: 1px #3486b8 solid;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.88);
   	width: 78%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.table-cols{
	
}
	.table-cols h2{
		font-size: 22px;
		font-weight: normal;
		text-align: center;
		width: 100%;
		float: left;
	}
	.table-cols h2.small{
		font-size: 20px;
	}
	.table-cols .cols{
		width: 100%;
		float: left;
	}
		.table-cols .cols .col{
			float: left;
			padding-right: 10px;
			box-sizing: border-box;
		}
		.table-cols.table-6cols .cols .col{
			width: 16.66%;
			min-width: 99px;
		}
		.table-cols.table-4cols .cols .col{
			width: 25%;
		}
		.table-cols.table-3cols .cols .col{
			width: 33.33%;
		}
		.table-cols.table-211cols .cols .col{
			width: 50px;
		}
		.table-cols.table-211cols .cols .col:first-child{
			width: calc(100% - 100px);
		}
			.table-cols .cols .col > h3{
				color: #3554a8;
				font-weight: normal;
				width: 100%;
				float: left;
				font-size: 17px;
			}
			.table-cols .cols .col > div{
				width: 100%;
				float: left;
				line-height: 20px;
				box-sizing: border-box;
				position: relative;
			}
			.table-cols .cols .col > h3:not(:first-child), .table-cols .cols .col > div:not(:first-child){
				margin-top: 10px;
			}
			.table-cols .cols .col > div.w-icon{
				padding-left: 32px;
				background: 0 0 no-repeat;
				background-size: auto 100%;
			}
			.table-cols .cols .col > div.w-icon.single{
				min-height: 20px;
				padding-left: 38px;
				background-position: 5px -2px;
			}
			.table-cols .cols .col > div.fire{
				color: #ff0000;
			}
			.table-cols .cols .col > div.air{
				color: #00e3ff;
			}
			.table-cols .cols .col > div.earth{
				color: #007d51;
			}
			.table-cols .cols .col > div.water{
				color: #005ae1;
			}
			.table-cols .cols .col > div .group-icons{
				position: absolute;
				top: 50%;
				left: 0;
				-webkit-transform: translateY(-50%);
				-moz-transform: translateY(-50%);
				-ms-transform: translateY(-50%);
				-o-transform: translateY(-50%);
				transform: translateY(-50%);
			}
				.table-cols .cols .col > div .group-icons > figure{
					width: 20px;
					height: 20px;
					background: 0 no-repeat;
					background-size: auto 100%;
					display: inline-block;
					vertical-align: top;
				}
			.table-cols .cols .col > div .group-text{
				display: inline-block;
				vertical-align: top;
				padding-left: 70px;
			}


.orbs-grid{
	position: relative;
}
	.orbs-grid h2{
		font-size: 22px;
		font-weight: normal;
		text-align: center;
		width: 100%;
		float: left;
	}
	.orbs-grid .grid{
		position: absolute;
		top: 50px;
		right: 10px;
		width: 240px;
	}
	.orbs-grid .table{
		width: 850px;
		max-width: 100%;
		float: left;
	}
		.orbs-grid .table .row{
			width: 100%;
			float: left;
		}
			.orbs-grid .table .row .cell{
				width: 7.142857142857143%;
				box-sizing: border-box;
				padding-bottom: 7%;
				float: left;
				background: center center no-repeat;
				background-size: 70% auto;
				border-top: 1px solid #333;
				border-right: 1px solid #333;
				position: relative;
				border-width: thin;
			}
			.orbs-grid .table .row .cell:last-child{
				border: none;
			}
			.orbs-grid .table .row:first-child .cell{
				border: none;
			}
			.orbs-grid .table .row:nth-child(2) .cell:first-child{
				border-top: none;
			}
			.orbs-grid .table .row:last-child .cell:not(:first-child):not(:last-child){
				border-bottom: 1px solid #333;
			}
			.orbs-grid .table .row .cell.blue{
				background-color: #00b4f1;
			}
			.orbs-grid .table .row .cell.red{
				background-color: #ff0000;
			}
			.orbs-grid .table .row .cell.dark-green{
				background-color: #299730;
			}
			.orbs-grid .table .row .cell.green{
				background-color: #42dc06;
			}
			.orbs-grid .table .row .cell.pink{
				background-color: #ff97c9;
			}
			.orbs-grid .table .row .cell.purple{
				background-color: #a6589c;
			}
			.orbs-grid .table .row .cell.dark-purple{
				background-color: #821d81;
			}
			.orbs-grid .table .row .cell.text{
				background-position: center 2px;
			}
				.orbs-grid .table .row .cell.text span{
					position: absolute;
					bottom: 2px;
					width: 100%;
					left: 0;
					text-align: center;
					font-size: 14px;
					color: #fff;
				}

	.regular-text .heading{
		margin-top: 30px;
		color: #126394;
		width: 100%;
		float: left;
		font-size: 26px;
	}
	.regular-text .heading.smaller{
		font-size: 22px;
	}
	.regular-text .heading.light{
		color: #00aeef;
	}
	

	
	.regular-text .heading-group{
		width: 100%;
		float: left;
		margin-top: 30px;
		position: relative;
		padding-right: 80px;
		box-sizing: border-box;
	}
		.regular-text .heading-group.speak-allowed{
			padding-right: 130px;
		}
		.regular-text .heading-group .heading{
			width: auto;
			float: none;
			display: inline-block;
			vertical-align: top;
			margin-top: 0;
		}
		.regular-text .heading-group .stars{
			width: 110px;
			height: 18px;
			background: left top no-repeat;
			background-size: 100% auto;
			display: inline-block;
			margin-left: 10px;
			margin-top: 2px;
			vertical-align: top;
		}
		.regular-text .heading-group .symbols-group{
			position: absolute;
			top: 50%;
			right: 10px;
			-webkit-transform: translateY(-50%);
			-moz-transform: translateY(-50%);
			-ms-transform: translateY(-50%);
			-o-transform: translateY(-50%);
			transform: translateY(-50%);
		}
		.regular-text .heading-group.speak-allowed .symbols-group{
			right: 60px;
		}
		.regular-text .heading-group .symbols-group .symbol{
				width: 25px;
				height: 25px;
				display: inline-block;
				margin-right: 1px;
				background: center center no-repeat;
				background-size: 100%;					 
		}
		.regular-text .heading-group .symbols-group .aspect {
			width: 18px;
			height: 18px;
    			margin: 0 3px;
		}	
	.regular-text .heading-astrology{
		width: 100%;
		float: left;
		color: #152476;
		font-size: 14px;
	}
	.regular-text .small-p{
		width: 100%;
		float: left;
		margin-top: 8px;
		line-height: 20px;
		font-size: 15px;
	}
	.regular-text .regular-p{
		line-height: 22px;
		width: 100%;
		float: left;
		margin-top: 20px;
	}

	.regular-text .heading-extra{
		color: green;
		font-weight: bold;
	}
	.regular-text .heading-astrology + .heading-extra{
		margin-top: 0;
	}


	.regular-text .transit_dateheading {
		font-weight: bold;
	}

.rep-main{
	width: 100%;
	float: left;
}

.sub-chapter{
	width: 100%;
	float: left;
}

.speak-chapter,
.rep-sidebar,
.chapter-navigation,
.buttons-bar{
	display: none;
}


.show-print {
	display:none;
	
}

@media screen{
	.rep-main{
	    height: 100vh;
	    overflow: hidden;
	    position: relative;
	}
	.slides-holder{
		width: 100%;
		float: left;
		position: absolute;
	}
	.a-page{
		height: 100vh;
    	overflow: auto;
    	box-sizing: border-box;
    	border-bottom: 8px solid transparent;
	}
	.a-page-inner{
		width: 900px;
		float: right;
		padding-bottom: 200px;
		margin-right: calc((100vw - 1240px) / 2);
	}

	.speakable-heading.has-speaker{
		position: relative;
		padding-right: 130px;
		box-sizing: border-box;
	}
	.heading-group .speakable-heading.has-speaker{
		position: static;
		padding-right: 0;
	}
	.speak-chapter{
		width: 34px;
		height: 34px;
		background: url(speaker.svg) center center no-repeat;
		background-size: 23px auto;
		position: absolute;
		top: 50%;
		right: 0;
		cursor: pointer;
		display: none;
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	.speak-chapter.active{
		background-color: #dedede;
	}
	.speakable-heading.has-speaker .speak-chapter{
		display: block;
	}

	.rep-sidebar{
		width: 290px;
		position: fixed;
		top: 20px;
		bottom: 105px;
		left: calc((100vw - 1200px) / 2);
		box-sizing: border-box;
		background: #ffffff;
		z-index: 30;
		display: block;
	}
		.rep-sidebar .rep-sidebar-inner{
			list-style: none;
			width: calc(100% - 10px);
			height: calc(100% - 20px);
			position: absolute;
			top: 10px;
			left: 0px;
			overflow: auto;
			padding-right: 20px;
			box-sizing: border-box;
		}
			.rep-sidebar .rep-sidebar-inner li{
				width: 100%;
				float: left;
				font-size: 0.9rem;
			}
			.rep-sidebar .rep-sidebar-inner li > a > span.dd{
				position: absolute;
				width: 22px;
				height: 22px;
				top: 50%;
				right: 3px;
				margin-top: -12px;
				border: 1px solid transparent;
				-webkit-pointer-events: none;
				pointer-events: none;
			}
				.rep-sidebar .rep-sidebar-inner li > a > span.dd:before{
					content: '';
					width: 0;
					height: 0;
					border: 6px solid transparent;
					border-top: 6px solid #333;
					position: absolute;
					top: 8px;
					left: 5px;
				}
				
				.rep-sidebar .rep-sidebar-inner li > a.active > span.dd:before{
					border-top: 6px solid #fff;
				}
				.rep-sidebar .rep-sidebar-inner li ul{
					padding-left: 10px;
					list-style: none;
					width: calc(100% - 10px);
					float: left;
					box-sizing: border-box;
					border-left: 1px solid #dfdfdf;
					margin: 10px 0 15px 10px;
					display: none;
				}
					.rep-sidebar .rep-sidebar-inner li ul li{
						border-bottom: 0;
					}
				.rep-sidebar .rep-sidebar-inner li a{
					text-decoration: none;
					color: #666;
					padding: 7px;
					display: block;
					text-overflow: ellipsis;
					white-space: nowrap;
					overflow: hidden;
				}
				.rep-sidebar .rep-sidebar-inner li > a{
					position: relative;
				}
				.rep-sidebar .rep-sidebar-inner li.with-dd > a{
					padding-right: 28px;
				}
				.rep-sidebar .rep-sidebar-inner li > a.bookmarked:before{
					content: '';
					width: 12px;
					height: 20px;
					background: url(bookmark-gr.svg) center center no-repeat;
					background-size: 100% auto;
					display: inline-block;
					vertical-align: middle;
					margin-right: 6px;
					position: relative;
					top: -1px;
				}
				.rep-sidebar .rep-sidebar-inner li:last-child{
					border-bottom: 0;
				}
				.rep-sidebar .rep-sidebar-inner li a.active,
				.rep-sidebar .rep-sidebar-inner li a:hover{
					background: #dfdfdf;
					font-weight: bold;
					white-space: unset;
					overflow: visible;
					background: #fff;
					border: 1px solid;
					color: white;
					border-radius: 5px;
				}
				
				.rep-sidebar .rep-sidebar-inner .breaker{
					padding-top: 20px;
					padding-bottom: 10px;
					color: #1e7d5f;
				}
		.rep-sidebar .button,
		/*#toolbar-button{
			display: none;
		}*/

	.buttons-bar{
		position: fixed;
		bottom: 40px;
		left: calc((100vw - 1200px) / 2);
		width: 290px;
		height: 86px;
		padding: 0 10px;
		box-sizing: border-box;
		font-size: 14px;
		z-index: 30;
		background: #fff;
		display: block;
	}

		.toolbar-wrapp{
			background: #f1f1f1;
		}
		.func-butts{
			margin-top: 10px;
		}
			.func-butts > button{
				width: calc(33.33% - 14px);
				line-height: 28px;
				background: #546E7A;
				color: #fff;
				text-align: center;
				float: left;
				cursor: pointer;
				margin-right: 6px;
				font-size: inherit;
				position: relative;
			}
			.func-butts > button[disabled]{
				opacity: 0.6;
				-webkit-pointer-events: none;
				pointer-events: none;
			}
			.func-butts > button.bookmark{
				width: 106px;
				padding-left: 18px;
			}
			.func-butts > button.read{
				padding-left: 21px;
			}
			.func-butts > button.help{
				padding-left: 18px;
			}
			.func-butts > button:before{
				content: '';
				height: 100%;
				position: absolute;
				top: 0;
				left: 5px;
				background: center center no-repeat;
				background-size: 100% auto;
			}
				.func-butts > button.bookmark:before{
					width: 12px;
					left: 9px;
					background-image: url(bookmark.svg);
				}
				.func-butts > button.read:before{
					width: 17px;
					left: 8px;
					background-image: url(speaker-white.svg);
				}
				.func-butts > button.help:before{
					width: 13px;
					left: 10px;
					background-image: url(help.svg);
				}
			.func-butts > button.active{
				background-color: #009688;
			}
			.func-butts > .help{
				margin-right: 0;
			}

		.view-butts{
			margin-top: 10px;
		}
			.view-butts .font-opt{
				width: calc(50% - 3px);
				float: left;
				position: relative;
				margin-right: 6px;
			}
				.view-butts .font-opt .tit{
					width: 50px;
				    padding: 0 4px;
				    float: left;
				    color: #444;
				    height: 28px;
				    border: 1px solid #455A64;
				    box-sizing: border-box;
				    font-size: inherit;
				    background: url(font.svg) center center no-repeat;
				    background-size: auto 13px;
				}
				.view-butts .font-opt .sel{
					width: calc(100% - 50px);
				    float: left;
				    display: block;
				}
					.view-butts .font-opt .sel select{
						display: block;
						line-height: 28px;
						width: 100%;
						appearance: none;
						-webkit-appearance: none;
						box-sizing: border-box;
						padding: 0 11px;
						color: #fff;
						background: #455A64;
						font-size: inherit;
						border-radius: 0;
					}
			.view-butts .contrast, .view-butts .save{
				width: calc(50% - 3px);
				float: left;
				line-height: 28px;
				background: #fff;
				cursor: pointer;
				font-size: inherit;
				text-align: left;
				box-sizing: border-box;
				padding-left: 38px;
				position: relative;
			}

			body:not(.dark-ctst) .view-butts .save{
				background-color: #555;
				color: #fff;
			}

			body:not(.dark-ctst) .view-butts .contrast{
				background-color: #555;
				color: #fff;
			}
			body:not(.dark-ctst) .view-butts .contrast .light{
				display: none;
			}
				.view-butts .contrast:before{
					content: '';
					width: 20px;
					height: 20px;
					background: url(contrast.svg) center center no-repeat;
					background-size: auto 18px;
					position: absolute;
					left: 10px;
					top: 4px;
				}
				.view-butts .save:before{
					content: '';
					width: 20px;
					height: 20px;
					background: url(pdf-white.svg) center center no-repeat;
					background-size: auto 18px;
					position: absolute;
					left: 10px;
					top: 4px;
				}


	.bm-message{
		width: 560px;
		max-width: calc(100% - 24px);
	    position: fixed;
	    top: 50%;
	    left: 50%;
	    background: #66BB6A;
	    color: #fff;
	    text-align: center;
	    -webkit-transform: translate(-50%, -50%);
	    -moz-transform: translate(-50%, -50%);
	    -ms-transform: translate(-50%, -50%);
	    -o-transform: translate(-50%, -50%);
	    transform: translate(-50%, -50%);
	    padding: 10px 30px;
	    line-height: 24px;
	    box-shadow: 0 0 15px 3px #4CAF50;
	    border-radius: 5px;
	    box-sizing: border-box;
	    display: none;
	    z-index: 32;
	}

	body.medium-fs .regular-text .heading-astrology{
		font-size: 15px;
	}
	body.medium-fs .regular-text .small-p{
		font-size: 18px;
	}
	body.medium-fs{
		font-size: 19px;
	}
	body.medium-fs .table-cols .cols .col > h3{
		font-size: 21px;
	}
	body.medium-fs .chart-wheel,
	body.medium-fs .table-cols h2.small{
		font-size: 23px;
	}
	body.medium-fs .table-cols h2,
	body.medium-fs .orbs-grid h2,
	body.medium-fs .regular-text .heading.smaller{
		font-size: 25px;
	}
	body.medium-fs .regular-text .heading{
		font-size: 29px;
	}
	body.medium-fs .table-cols .cols .col > div,
	body.medium-fs .regular-text .small-p{
		line-height: 23px;
	}
	body.medium-fs .table-cols .cols .col > div.w-icon.single{
		height: 23px;
	}
	body.medium-fs .regular-text .regular-p{
		line-height: 25px;
	}
	body.medium-fs .regular-text .heading-group .stars{
		margin-top: 6px;
	}
	body.medium-fs .table-cols .cols .col > div .group-icons{
		margin-top: 3px;
	}


	body.large-fs .regular-text .heading-astrology{
		font-size: 18px;
	}
	body.large-fs .regular-text .small-p{
		font-size: 21px;
	}
	body.large-fs{
		font-size: 22px;
	}
	body.large-fs .table-cols .cols .col > h3{
		font-size: 24px;
	}
	body.large-fs .chart-wheel,
	body.large-fs .table-cols h2.small{
		font-size: 26px;
	}
	body.large-fs .table-cols h2,
	body.large-fs .orbs-grid h2,
	body.large-fs .regular-text .heading.smaller{
		font-size: 28px;
	}
	body.large-fs .regular-text .heading{
		font-size: 32px;
	}
	body.large-fs .table-cols .cols .col > div,
	body.large-fs .regular-text .small-p{
		line-height: 26px;
	}
	body.large-fs .table-cols .cols .col > div.w-icon.single{
		height: 26px;
	}
	body.large-fs .regular-text .regular-p{
		line-height: 28px;
	}
	body.large-fs .regular-text .heading-group .stars{
		margin-top: 7px;
	}
	body.large-fs .table-cols .cols .col > div .group-icons{
		margin-top: 4px;
	}


	body.dark-ctst{
		background: #333;
		color: #f1f1f1;
	}
	body.dark-ctst .table-cols .cols .col > h3{
		color: #03a9f4;
	}
	body.dark-ctst .table-cols .cols .col > div.water{
		color: #2196F3;
	}
	body.dark-ctst .table-cols .cols .col > div.earth{
		color: #43A047;
	}
	body.dark-ctst .orbs-grid .table .row .cell,
	body.dark-ctst .orbs-grid .table .row:last-child .cell:not(:first-child):not(:last-child){
		border-color: #BDBDBD;
	}
	body.dark-ctst .regular-text .heading.light{
		color: #3bc9ff;
	}

	body.dark-ctst .regular-text .heading{
		color: #009fff;
	}
	body.dark-ctst .regular-text .heading-astrology{
		color: #c0c0c0;
	}

	body.dark-ctst .toolbar-wrapp,
	body.dark-ctst .rep-sidebar,
	body.dark-ctst .buttons-bar{
		background: #111;
	}
	body.dark-ctst .rep-sidebar .rep-sidebar-inner li{
		border-color: #393939;
	}
	body.dark-ctst .rep-sidebar .rep-sidebar-inner li a{
		color: #e2e2e2;
	}
	body.dark-ctst .speak-chapter{
		background-image: url(speaker-dark.svg);
	}
	body.dark-ctst .speak-chapter.active{
		background-color: #222;
	}
	body.dark-ctst .rep-sidebar .rep-sidebar-inner li a.active,
	body.dark-ctst .rep-sidebar .rep-sidebar-inner li a:hover{
		background: #393939;
	}
	body.dark-ctst .rep-sidebar .rep-sidebar-inner li > a > span.dd:before{
		border-top-color: #878787;
	}
	body.dark-ctst .view-butts .font-opt .tit{
		color: #eaeaea;
	}
	body.dark-ctst .bm-message{
		background: #569a59;
		box-shadow: 0 0 15px 3px #223e23;
	}
	body.dark-ctst .rep-sidebar .button{
		background-image: url(menu-dark.svg);
	}
	body.dark-ctst .rep-sidebar.opened .button{
		background-image: url(close-dark.svg);
	}
	body.dark-ctst .view-butts .font-opt .tit{
		background-image: url(font-dark.svg);
	}
	body.dark-ctst .view-butts .contrast .dark{
		display: none;
	}
	body.dark-ctst .view-butts .contrast:before{
		background-image: url(contrast-dark.svg);
	}

	.chapter-navigation{
		width: 100%;
		float: left;
		margin-top: 50px;
		display: block;
	}
	
	
	
		.chapter-navigation button{
			display: block;
			float: left;
			line-height: 34px;
			padding: 0 30px;
			color: #fff;
			background: #1976D2;
			-webkit-appearance: none;
			appearance: none;
			font-size: 15px;
			position: relative;
			cursor: pointer;
			border-radius: 5px;
		}
		.chapter-navigation button.prev{
			padding-left: 50px;
		}
		.chapter-navigation button.next{
			padding-right: 50px;
			float: right;
			background: #19d275;
		}
		
		.chapter-navigation button.start{
			padding-right: 50px;
			float: right;
			background: #19d275;
			margin-right: 15px;
		}
		
			.chapter-navigation button:before{
				content: '';
				width: 16px;
				height: 100%;
				position: absolute;
				top: 0;
				background: center center no-repeat transparent;
				background-size: 100% auto;
				-webkit-transition: left 0.2s, right 0.2s;
				-moz-transition: left 0.2s, right 0.2s;
				-ms-transition: left 0.2s, right 0.2s;
				-o-transition: left 0.2s, right 0.2s;
				transition: left 0.2s, right 0.2s;
			}
			.chapter-navigation button.prev:before{
				left: 20px;
				background-image: url(prev.svg);
			}
			.chapter-navigation button.next:before{
				right: 20px;
				background-image: url(next.svg);
			}
			.chapter-navigation button.start:before{
				right: 20px;
				background-image: url(next.svg);
			}
			.chapter-navigation button.prev:hover:before{
				left: 16px;
			}
			.chapter-navigation button.next:hover:before{
				right: 16px;
			}
}

@media screen and (max-width: 1240px){
	.rep-sidebar{
		width: 290px;
	    left: 20px;
	}
	.buttons-bar{
	    width: 290px;
		left: 10px;
	}
		.a-page-inner{
			margin-right: 0;
		    width: calc(100% - 324px);
		    padding-right: 20px;
		    box-sizing: border-box;
		}
}

@media screen and (max-width: 1022px){
	.a-page-inner{
		width: 100%;
	    margin: 0;
	    padding-left: 15px;
	    padding-right: 15px;
	    box-sizing: border-box;
	    padding-top: 35px;
	}
	.sub-chapter{
		padding-top: 10px;
	}
	.speakable-heading.has-speaker{
		padding-right: 40px !important;
	}
	.rep-sidebar{
		width: 50px;
		height: 50px;
		top: 10px;
		left: auto;
		right: 10px;
		overflow: hidden;
		-webkit-transition: width 0.1s ease, height 0.1s ease;
		-moz-transition: width 0.1s ease, height 0.1s ease;
		-ms-transition: width 0.1s ease, height 0.1s ease;
		-o-transition: width 0.1s ease, height 0.1s ease;
		transition: width 0.1s ease, height 0.1s ease;
	}
		.rep-sidebar .rep-sidebar-inner{
			top: 92px;
			height: calc(100% - 70px);
			left: 20px;
		}
		.rep-sidebar .button{
			display: block;
			width: 50px;
			height: 50px;
			position: absolute;
			top: 0;
			left: 0;
			background: url(menu.svg) center center no-repeat;
			background-size: 30px 28px;
		}
	.rep-sidebar.opened{
		width: 100%;
		height: 100%;
		top: 0;
		right: 0;
		z-index: 31;
	}
		.rep-sidebar.opened .button{
			left: auto;
		    right: 10px;
		    top: 10px;
			background-image: url(close.svg);
			background-size: 28px 28px;
		}

	.buttons-bar{
		width: calc(100% - 80px);
	    height: auto;
	    bottom: auto;
	    padding: 0 0 0 25px;
	    top: -100px;
	    left: 0;
	    z-index: 31;
	    -webkit-transition: top 0.2s ease;
		-moz-transition: top 0.2s ease;
		-ms-transition: top 0.2s ease;
		-o-transition: top 0.2s ease;
		transition: top 0.2s ease;
	}
	.buttons-bar.opened{
		top: 20px;
	}
	.toolbar-wrapp{
		width: 100%;
    	float: left;
    	padding: 0;
    	background: transparent;
	}
		.func-butts,
		.view-butts{
			width: 270px;
			margin: 0;
		}
		.func-butts{
			margin-right: 50px;
		}

	.regular-text .heading-group{
		padding-right: 0 !important;
	}
	.regular-text .heading-group .heading{
		display: block;
		width: 100%;
		float: left;
	}
	.heading-group .speakable-heading.has-speaker{
		position: relative;
	}
	.regular-text .heading-group .symbols-group{
		position: relative;
		width: 100%;
		float: left;
		top: auto;
		right: auto !important;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
		margin-top: 0 !important;
	}
	.regular-text .heading-group .stars{
		display: block;
		float: left;
		clear: left;
		margin: 0 0 8px 0 !important;
	}
	body.medium-fs .regular-text .heading-group .stars,
	body.large-fs .regular-text .heading-group .stars{
		margin-top: 5px;
	}
}

@media screen and (max-width: 920px){
	.table-cols.table-6cols .cols{
		overflow: auto;
		white-space: nowrap;
		padding-bottom: 20px;
	}
	.table-cols.table-6cols .cols .col{
		display: inline-block;
		float: none;
	}
	.table-cols.table-6cols .cols .col:last-child{
		padding-right: none;
		text-align: center;
	}
}

@media screen and (max-width: 900px){
	.orbs-grid .table .row .cell.text span{
		bottom: 0;
		font-size: 1.5vw;
	}
	body.medium-fs .table-cols.table-6cols:not(.house-cusp) .cols .col{
		width: 130px;
	}
	body.large-fs .table-cols.table-6cols:not(.house-cusp) .cols .col{
		width: 140px;
	}
}

@media screen and (max-width: 820px){
	.table-cols.table-3cols.break-tablet .cols .col{
		width: 50%;
	}

	body.large-fs .table-cols .cols .col > div .group-icons,
	body.large-fs .table-cols .cols .col > div .group-icons{
		margin-top: 0;
	}
}

@media screen and (max-width: 720px){
	.func-butts{
		margin-right: 6px;
	}

	body{
		font-size: 15px;
	}
	.chart-wheel{
		font-size: 17px;
	}
	.cover-1 {
		font-size: 45px;
	}
	.cover > figure{
		padding: 10px;
	}

	.table-cols h2, .orbs-grid h2{
		font-size: 20px;
	}
	.table-cols .cols .col > h3{
		font-size: 15px;
	}
	.regular-text .heading{
		font-size: 24px;
	}
	.regular-text .heading.smaller{
		font-size: 21px;
	}


	body.medium-fs .regular-text .heading-astrology{
		font-size: 14px;
	}
	body.medium-fs .regular-text .small-p{
		font-size: 17px;
	}
	body.medium-fs,
	body.medium-fs .table-cols .cols .col > h3{
		font-size: 18px;
	}
	body.medium-fs .chart-wheel
	body.medium-fs .table-cols h2.small{
		font-size: 20px;
	}
	body.medium-fs .table-cols h2,
	body.medium-fs .orbs-grid h2,
	body.medium-fs .regular-text .heading.smaller{
		font-size: 22px;
	}
	body.medium-fs .regular-text .heading{
		font-size: 26px;
	}
	body.medium-fs .table-cols .cols .col > div,
	body.medium-fs .regular-text .small-p{
		line-height: 22px;
	}
	body.medium-fs .table-cols .cols .col > div.w-icon.single{
		height: 22px;
	}
	body.medium-fs .regular-text .regular-p{
		line-height: 24px;
	}
	body.medium-fs .table-cols .cols .col > div .group-icons{
		margin-top: 1px;
	}

	body.large-fs .regular-text .heading-astrology{
		font-size: 16px;
	}
	body.large-fs .regular-text .small-p{
		font-size: 19px;
	}
	body.large-fs,
	body.large-fs .table-cols .cols .col > h3{
		font-size: 20px;
	}
	body.large-fs .chart-wheel
	body.large-fs .table-cols h2.small{
		font-size: 22px;
	}
	body.large-fs .table-cols h2,
	body.large-fs .orbs-grid h2,
	body.large-fs .regular-text .heading.smaller{
		font-size: 24px;
	}
	body.large-fs .regular-text .heading{
		font-size: 28px;
	}
	body.large-fs .table-cols .cols .col > div,
	body.large-fs .regular-text .small-p{
		line-height: 24px;
	}
	body.large-fs .table-cols .cols .col > div.w-icon.single{
		height: 24px;
	}
	body.large-fs .regular-text .regular-p{
		line-height: 26px;
	}
	body.large-fs .table-cols .cols .col > div .group-icons{
		margin-top: 2px;
	}
	

}

@media screen and (max-width: 740px){
	.half-width .half{
		width: 100%;
		padding: 0 !important;
	}
	.table-cols.table-4cols.break-tablet .cols .col{
		width: 50%;
	}
	.table-cols.table-4cols.break-tablet .cols .col:nth-child(3){
		clear: left;
	}
	.table-cols.table-4cols.break-tablet .cols .col:nth-child(2), .table-cols.table-4cols.break-tablet .cols .col:nth-child(4){
		text-align: right;
	}

	.orbs-grid .grid{
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
		float: left;
		margin-top: 50px;
	}
}

@media screen and (max-width: 670px){
	.rep-sidebar .rep-sidebar-inner{
		top: 126px;
	}

	.func-butts,
	.view-butts{
		clear: left;
	}
	.func-butts{
		margin: 0 0 6px 0;
	}
}

@media screen and (max-width: 560px){
	.table-cols.table-3cols.break-tablet .cols .col{
		width: 100%;
	}
}

@media screen and (max-width: 500px){
	.rep-sidebar .button{
		width: 40px;
	}
	.rep-sidebar.opened .button{
		top: 2px;
		right: 5px;
	}
	.rep-sidebar .rep-sidebar-inner{
		top: 126px;
	}
	.buttons-bar.opened{
		top: 12px;
	}
	.toolbar-wrapp{
		right: -45px;
	}
	.table-cols h2, .orbs-grid h2{
		text-align: left;
	}
}

@media screen and (max-width: 440px){
	.chapter-navigation button{
		padding: 0 13px;
	}
	.chapter-navigation button.prev{
		padding-left: 36px;
	}
	.chapter-navigation button.next{
		padding-right: 36px;
	}
		.chapter-navigation button.prev:before{
			left: 12px;
		}
		.chapter-navigation button.next:before{
			right: 12px;
		}
		.chapter-navigation button.prev:hover:before{
			left: 8px;
		}
		.chapter-navigation button.next:hover:before{
			right: 8px;
		}
}

@supports not (-webkit-touch-callout: none) {
	.func-butts > button:not(.active):not([disabled]):hover{
		background-color: #455A64;
	}
}

.retro {display:inline;}
.retro img{
    width: 15px;
    padding-left: 5px;
    vertical-align: middle;
}

.orbs-grid .table .row .cell.CON{background-color:#00AEEF;}

.orbs-grid .table .row .cell.OPP{background-color:#A3529B;}

.orbs-grid .table .row .cell.QUI{background-color:#800080;}

.orbs-grid .table .row .cell.SEM{background-color:#F593C9;}

.orbs-grid .table .row .cell.SES{background-color:#FFCC00;}

.orbs-grid .table .row .cell.SEX{background-color:#4AE10D;}

.orbs-grid .table .row .cell.SMX{background-color:#4DF55D;}

.orbs-grid .table .row .cell.SQU{background-color:#FF0000;}

.orbs-grid .table .row .cell.TRI{background-color:#339933;}

.copyright{
    float: left;
    margin-top: 50px;
    color: dimgrey;
    font-size: 12px;
}

.hoz-list li{
	display: inline-block;
    margin: 10px 17px;
}

.hoz-list ul{
    list-style: none;
    margin-top: 14px;
	font-size: 16px;
	text-align: center;
}

.astro-close {
	font-weight: bold;
	margin-left:15px;
}

.twopeople{
	height: 35vh;
}

.birthdata-group a:hover{
	text-decoration: underline !important;
}

a h2:hover{
	text-decoration: underline !important;
}


.rep-sidebar .rep-sidebar-inner li a.active, .rep-sidebar .rep-sidebar-inner li a:hover {
	border-color: #1a6195;
	color: #1a6195;
}

.produced-group{
	padding-top: 20px;
}

.table-cols.table-6cols .cols .col.wide {
	width: 18.66%;
}

.table-cols.table-6cols .cols .col.thin {
	width: 14.66%;
}

.myreports {
	display: inline-block;
	padding-top: 15px;
	padding-right: 10px;
}

.myreports a{
	font-weight:bold;
}

	.myreports a:hover{
text-decoration:underline;

	}


.tingle-modal * {
	box-sizing: border-box
}

.tingle-modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1000;
	display: flex;
	visibility: hidden;
	flex-direction: column;
	align-items: center;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
	background: rgba(0,0,0,.9);
	opacity: 0;
	cursor: url("data:image/svg+xml,%3Csvg width='19' height='19' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.514.535l-6.42 6.42L2.677.536a1.517 1.517 0 00-2.14 0 1.517 1.517 0 000 2.14l6.42 6.419-6.42 6.419a1.517 1.517 0 000 2.14 1.517 1.517 0 002.14 0l6.419-6.42 6.419 6.42a1.517 1.517 0 002.14 0 1.517 1.517 0 000-2.14l-6.42-6.42 6.42-6.418a1.517 1.517 0 000-2.14 1.516 1.516 0 00-2.14 0z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"),auto
}

@supports ((-webkit-backdrop-filter:blur(12px)) or (backdrop-filter:blur(12px))) {
	.tingle-modal {
		-webkit-backdrop-filter: blur(12px);
		backdrop-filter: blur(12px)
	}
}

.tingle-modal--confirm .tingle-modal-box {
	text-align: center
}

.tingle-modal--noOverlayClose {
	cursor: default
}

.tingle-modal--noClose .tingle-modal__close {
	display: none
}

.tingle-modal__close {
	position: fixed;
	top: 2.5rem;
	right: 2.5rem;
	z-index: 1000;
	padding: 0;
	width: 2rem;
	height: 2rem;
	border: none;
	background-color: transparent;
	color: #fff;
	cursor: pointer
}

	.tingle-modal__close svg * {
		fill: currentColor
	}

.tingle-modal__closeLabel {
	display: none
}

.tingle-modal__close:hover {
	color: #fff
}

.tingle-modal-box {
	position: relative;
	flex-shrink: 0;
	margin-top: auto;
	margin-bottom: auto;
	width: 60%;
	border-radius: 4px;
	background: #fff;
	opacity: 1;
	cursor: auto;
	will-change: transform,opacity
}

.tingle-modal-box__content {
	padding: 3rem 3rem
}

.tingle-modal-box__footer {
	padding: 1.5rem 2rem;
	width: auto;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	background-color: #f5f5f5;
	cursor: auto
}

	.tingle-modal-box__footer::after {
		display: table;
		clear: both;
		content: ""
	}

.tingle-modal-box__footer--sticky {
	position: fixed;
	bottom: -200px;
	z-index: 10001;
	opacity: 1;
	transition: bottom .3s ease-in-out .3s
}

.tingle-enabled {
	position: fixed;
	right: 0;
	left: 0;
	overflow: hidden
}

.tingle-modal--visible .tingle-modal-box__footer {
	bottom: 0
}

.tingle-modal--visible {
	visibility: visible;
	opacity: 1
}

	.tingle-modal--visible .tingle-modal-box {
		animation: scale .2s cubic-bezier(.68,-.55,.265,1.55) forwards
	}

.tingle-modal--overflow {
	overflow-y: scroll;
	padding-top: 8vh
}

.tingle-btn {
	display: inline-block;
	margin: 0 .5rem;
	padding: 1rem 2rem;
	border: none;
	background-color: grey;
	box-shadow: none;
	color: #fff;
	vertical-align: middle;
	text-decoration: none;
	font-size: inherit;
	font-family: inherit;
	line-height: normal;
	cursor: pointer;
	transition: background-color .4s ease
}

.tingle-btn--primary {
	background-color: #3498db
}

.tingle-btn--danger {
	background-color: #e74c3c
}

.tingle-btn--default {
	background-color: #34495e
}

.tingle-btn--pull-left {
	float: left
}

.tingle-btn--pull-right {
	float: right
}

@media (max-width :540px) {
	.tingle-modal {
		top: 0;
		display: block;
		padding-top: 60px;
		width: 100%
	}

	.tingle-modal-box {
		width: auto;
		border-radius: 0
	}

	.tingle-modal-box__content {
		overflow-y: scroll
	}

	.tingle-modal--noClose {
		top: 0
	}

	.tingle-modal--noOverlayClose {
		padding-top: 0
	}

	.tingle-modal-box__footer .tingle-btn {
		display: block;
		float: none;
		margin-bottom: 1rem;
		width: 100%
	}

	.tingle-modal__close {
		top: 0;
		right: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 60px;
		border: none;
		background-color: #2c3e50;
		box-shadow: none;
		color: #fff
	}

	.tingle-modal__closeLabel {
		display: inline-block;
		vertical-align: middle;
		font-size: 1.6rem;
		font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif
	}

	.tingle-modal__closeIcon {
		display: inline-block;
		margin-right: .8rem;
		width: 1.6rem;
		vertical-align: middle;
		font-size: 0
	}
}

@keyframes scale {
	0% {
		opacity: 0;
		transform: scale(.9)
	}

	100% {
		opacity: 1;
		transform: scale(1)
	}
}

.flower-spinner, .flower-spinner * {
	box-sizing: border-box;
}

.flower-spinner {
	height: 70px;
	width: 70px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	margin: auto;
}

	.flower-spinner .dots-container {
		height: calc(70px / 7);
		width: calc(70px / 7);
	}

	.flower-spinner .smaller-dot {
		background: #ff1d5e;
		height: 100%;
		width: 100%;
		border-radius: 50%;
		animation: flower-spinner-smaller-dot-animation 2.5s 0s infinite both;
	}

	.flower-spinner .bigger-dot {
		background: #ff1d5e;
		height: 100%;
		width: 100%;
		padding: 10%;
		border-radius: 50%;
		animation: flower-spinner-bigger-dot-animation 2.5s 0s infinite both;
	}

@keyframes flower-spinner-bigger-dot-animation {
	0%, 100% {
		box-shadow: rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px;
	}

	50% {
		transform: rotate(180deg);
	}

	25%, 75% {
		box-shadow: rgb(255, 29, 94) 26px 0px 0px, rgb(255, 29, 94) -26px 0px 0px, rgb(255, 29, 94) 0px 26px 0px, rgb(255, 29, 94) 0px -26px 0px, rgb(255, 29, 94) 19px -19px 0px, rgb(255, 29, 94) 19px 19px 0px, rgb(255, 29, 94) -19px -19px 0px, rgb(255, 29, 94) -19px 19px 0px;
	}

	100% {
		transform: rotate(360deg);
		box-shadow: rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px;
	}
}

@keyframes flower-spinner-smaller-dot-animation {
	0%, 100% {
		box-shadow: rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px;
	}

	25%, 75% {
		box-shadow: rgb(255, 29, 94) 14px 0px 0px, rgb(255, 29, 94) -14px 0px 0px, rgb(255, 29, 94) 0px 14px 0px, rgb(255, 29, 94) 0px -14px 0px, rgb(255, 29, 94) 10px -10px 0px, rgb(255, 29, 94) 10px 10px 0px, rgb(255, 29, 94) -10px -10px 0px, rgb(255, 29, 94) -10px 10px 0px;
	}

	100% {
		box-shadow: rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px, rgb(255, 29, 94) 0px 0px 0px;
	}
}


*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

#calendar {
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	height: auto;
	overflow: hidden;
	color: rgba(0, 0, 0, 1);
	border: 1px inset #7851792e;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	font-weight: 100;
	overflow: hidden;
}

.header {
	height: 50px;
	width: 100%;
	;
	background: #785179;
	text-align: center;
	position: relative;
	z-index: 100;
}

	.header h1 {
		margin: 0;
		padding: 0;
		font-size: 20px;
		line-height: 50px;
		font-weight: 100;
		letter-spacing: 1px;
		color: #FFF;
	}

.left, .right {
	position: absolute;
	width: 0px;
	height: 0px;
	border-style: solid;
	top: 50%;
	margin-top: -11px;
	cursor: pointer;
}

.left {
	border-width: 11px 15px 11px 0;
	border-color: transparent rgba(255, 255, 255, 1) transparent transparent;
	left: 20px;
}

.right {
	border-width: 11px 0 11px 15px;
	border-color: transparent transparent transparent rgba(255, 255, 255, 1);
	right: 20px;
}

.month {
	/*overflow: hidden;*/
	opacity: 0;
}

	.month.new {
		-webkit-animation: fadeIn 1s ease-out;
		opacity: 1;
	}

	.month.in.next {
		-webkit-animation: moveFromTopFadeMonth .4s ease-out;
		-moz-animation: moveFromTopFadeMonth .4s ease-out;
		animation: moveFromTopFadeMonth .4s ease-out;
		opacity: 1;
	}

	.month.out.next {
		-webkit-animation: moveToTopFadeMonth .4s ease-in;
		-moz-animation: moveToTopFadeMonth .4s ease-in;
		animation: moveToTopFadeMonth .4s ease-in;
		opacity: 1;
	}

	.month.in.prev {
		-webkit-animation: moveFromBottomFadeMonth .4s ease-out;
		-moz-animation: moveFromBottomFadeMonth .4s ease-out;
		animation: moveFromBottomFadeMonth .4s ease-out;
		opacity: 1;
	}

	.month.out.prev {
		-webkit-animation: moveToBottomFadeMonth .4s ease-in;
		-moz-animation: moveToBottomFadeMonth .4s ease-in;
		animation: moveToBottomFadeMonth .4s ease-in;
		opacity: 1;
	}

.week {
	background: #f7f7f7;
}

.day {
	display: inline-block;
	width: 14.28%;
	padding: 10px;
	text-align: center;
	vertical-align: top;
	cursor: pointer;
	background: #f7f7f7;
	position: relative;
	z-index: 100;
}

	.day.other {
		color: rgba(0, 0, 0, .3);
	}

	.day.today {
		color: rgba(156, 202, 235, 1);
		border: 1px solid;		
	}

.day-name {
	font-size: 9px;
	text-transform: uppercase;
	margin-bottom: 5px;
	color: rgba(0, 0, 0, .5);
	letter-spacing: .7px;
}

.day-number {
	font-size: 24px;
	letter-spacing: 1.5px;
}


.day .day-events {
	list-style: none;
	margin-top: 3px;
	text-align: center;
	height: 20px;
	line-height: 6px;
	overflow: hidden;
}

	.day .day-events span {
		vertical-align: top;
		display: inline-block;
		padding: 0;
		margin: 0;
		width: 18px;
		height: 18px;
		line-height: 10px;
		margin: 0 1px;
		background-repeat: no-repeat;
		background-size: cover;
	}

.transitHouse, .entry.transitHouse:after {
	background-image: url(/files/v1/HOUSE.svg);
	height: 20px !important;
	width: 20px !important;
	/*background: rgba(255, 235, 59, 1);*/
}

.transitCON, .entry.transitCON:after {
	background-image: url(/files/v1/ASPECT-CON.svg);
	/* background: rgba(0, 174, 239, 1); */
}

.transitSEX, .entry.transitSEX:after {
	background-image: url(/files/v1/ASPECT-SEX.svg);
	/*background: rgba(74, 225, 13, 1);*/
}
.transitSQU, .entry.transitSQU:after {
	/*background: rgba(255, 0, 0, 1);*/
	background-image: url(/files/v1/ASPECT-SQU.svg);
}
.transitTRI, .entry.transitTRI:after {
	/*background: rgba(51, 153, 51, 1);*/
	background-image: url(/files/v1/ASPECT-TRI.svg);
}
.transitOPP, .entry.transitOPP:after {
	/*background: rgba(163, 82, 155, 1);*/
	background-image: url(/files/v1/ASPECT-OPP.svg);
}
.transitQUI, .entry.transitQUI:after {
	/*background: rgba(128, 0, 128, 1);*/
	background-image: url(/files/v1/ASPECT-QUI.svg);
}
.transitSEM, .entry.transitSEM:after {
	/*background: rgba(255, 147, 20, 1);*/
	background-image: url(/files/v1/ASPECT-SEM.svg);
}
.transitSES, .entry.transitSES:after {
	/*background: rgba(255, 204, 0, 1);*/
	background-image: url(/files/v1/ASPECT-SES.svg);
}
.transitSMX, .entry.transitSMX:after {
	/*background: rgba(77, 245, 9, 1);*/
	background-image: url(/files/v1/ASPECT-SMX.svg);
}




.details {
	position: relative;
	width: 100%;
	height: 85px;
	background: rgba(164, 164, 164, 1);
	margin-top: 5px;
	border-radius: 4px;
}

	.details.in {
		-webkit-animation: moveFromTopFade .5s ease both;
		-moz-animation: moveFromTopFade .5s ease both;
		animation: moveFromTopFade .5s ease both;
	}

	.details.out {
		-webkit-animation: moveToTopFade .5s ease both;
		-moz-animation: moveToTopFade .5s ease both;
		animation: moveToTopFade .5s ease both;
	}

.arrow {
	position: absolute;
	top: -5px;
	left: 50%;
	margin-left: -2px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 5px 5px 5px;
	border-color: transparent transparent rgba(164, 164, 164, 1) transparent;
	transition: all 0.7s ease;
}

.events {
	height: 85px;
	padding: 7px 0;
	overflow-y: auto;
	overflow-x: hidden;
}

	.events.in {
		-webkit-animation: fadeIn .3s ease both;
		-moz-animation: fadeIn .3s ease both;
		animation: fadeIn .3s ease both;
	}

	.events.in {
		-webkit-animation-delay: .3s;
		-moz-animation-delay: .3s;
		animation-delay: .3s;
	}

.details.out .events {
	-webkit-animation: fadeOutShrink .4s ease both;
	-moz-animation: fadeOutShink .4s ease both;
	animation: fadeOutShink .4s ease both;
}

.events.out {
	-webkit-animation: fadeOut .3s ease both;
	-moz-animation: fadeOut .3s ease both;
	animation: fadeOut .3s ease both;
}

.event {
	font-size: 16px;
	line-height: 22px;
	letter-spacing: .5px;
	padding: 2px 16px;
	vertical-align: top;
}

	.event.empty {
		color: #eee;
	}

.event-category {
	height: 20px;
	width: 20px;
	display: inline-block;
	margin: 0;
	vertical-align: top;
	background-repeat: no-repeat;
	background-size: cover;
}

.event a {
	display: inline-block;
	padding: 0 0 0 7px;
	color: #FFF;
}

.legend {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 30px;
	background: rgba(60, 60, 60, 1);
	line-height: 30px;
}


.buttons {
	position: absolute;
	bottom: 30px;
	width: 100%;
	height: 30px;
	background: rgba(60, 60, 60, 1);
	line-height: 30px;
}

.entry {
	position: relative;
	padding: 0 0 0 25px;
	font-size: 13px;
	display: inline-block;
	line-height: 30px;
	background: transparent;
}

	.entry:after {
		position: absolute;
		content: '';
		height: 5px;
		width: 5px;
		top: 12px;
		left: 14px;
	}



	.entry.green:after {
		background: rgba(153, 198, 109, 1);
	}

	.entry.yellow:after {
		background: rgba(249, 233, 0, 1);
	}

/* Animations are cool!  */
	@-webkit-keyframes moveFromTopFade {
		from {
			opacity: .3;
			height: 0px;
			margin-top: 0px;
			-webkit-transform: translateY(-100%);
		}
	}

	@-moz-keyframes moveFromTopFade {
		from {
			height: 0px;
			margin-top: 0px;
			-moz-transform: translateY(-100%);
		}
	}

	@keyframes moveFromTopFade {
		from {
			height: 0px;
			margin-top: 0px;
			transform: translateY(-100%);
		}
	}

	@-webkit-keyframes moveToTopFade {
		to {
			opacity: .3;
			height: 0px;
			margin-top: 0px;
			opacity: 0.3;
			-webkit-transform: translateY(-100%);
		}
	}

	@-moz-keyframes moveToTopFade {
		to {
			height: 0px;
			-moz-transform: translateY(-100%);
		}
	}

	@keyframes moveToTopFade {
		to {
			height: 0px;
			transform: translateY(-100%);
		}
	}

	@-webkit-keyframes moveToTopFadeMonth {
		to {
			opacity: 0;
			-webkit-transform: translateY(-30%) scale(.95);
		}
	}

	@-moz-keyframes moveToTopFadeMonth {
		to {
			opacity: 0;
			-moz-transform: translateY(-30%);
		}
	}

	@keyframes moveToTopFadeMonth {
		to {
			opacity: 0;
			-moz-transform: translateY(-30%);
		}
	}

	@-webkit-keyframes moveFromTopFadeMonth {
		from {
			opacity: 0;
			-webkit-transform: translateY(30%) scale(.95);
		}
	}

	@-moz-keyframes moveFromTopFadeMonth {
		from {
			opacity: 0;
			-moz-transform: translateY(30%);
		}
	}

	@keyframes moveFromTopFadeMonth {
		from {
			opacity: 0;
			-moz-transform: translateY(30%);
		}
	}

	@-webkit-keyframes moveToBottomFadeMonth {
		to {
			opacity: 0;
			-webkit-transform: translateY(30%) scale(.95);
		}
	}

	@-moz-keyframes moveToBottomFadeMonth {
		to {
			opacity: 0;
			-webkit-transform: translateY(30%);
		}
	}

	@keyframes moveToBottomFadeMonth {
		to {
			opacity: 0;
			-webkit-transform: translateY(30%);
		}
	}

	@-webkit-keyframes moveFromBottomFadeMonth {
		from {
			opacity: 0;
			-webkit-transform: translateY(-30%) scale(.95);
		}
	}

	@-moz-keyframes moveFromBottomFadeMonth {
		from {
			opacity: 0;
			-webkit-transform: translateY(-30%);
		}
	}

	@keyframes moveFromBottomFadeMonth {
		from {
			opacity: 0;
			-webkit-transform: translateY(-30%);
		}
	}

	@-webkit-keyframes fadeIn {
		from {
			opacity: 0;
		}
	}

	@-moz-keyframes fadeIn {
		from {
			opacity: 0;
		}
	}

	@keyframes fadeIn {
		from {
			opacity: 0;
		}
	}

	@-webkit-keyframes fadeOut {
		to {
			opacity: 0;
		}
	}

	@-moz-keyframes fadeOut {
		to {
			opacity: 0;
		}
	}

	@keyframes fadeOut {
		to {
			opacity: 0;
		}
	}

	@-webkit-keyframes fadeOutShink {
		to {
			opacity: 0;
			padding: 0px;
			height: 0px;
		}
	}

	@-moz-keyframes fadeOutShink {
		to {
			opacity: 0;
			padding: 0px;
			height: 0px;
		}
	}

	@keyframes fadeOutShink {
		to {
			opacity: 0;
			padding: 0px;
			height: 0px;
		}
	}


.cover-name {
	position: absolute;
	top: 30%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: max(20px, 1.4vw);
	color: white;
}

.cover-produced {
	position: absolute;
	top: 91.5%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: white;
}

	.cover-produced .produced {
		font-size: max(16px, 1vw);
	}

	.cover-produced .companyname {
		font-size: max(18px, 1.5vw);
	}



.cover-container {
	margin-top: 25px;
	position: relative;
	text-align: center;
	color: white;
}


	.cover-container img {
		width: 100%;
		max-height: calc(100vh - 100px);
		object-fit: scale-down;
	}

	.cover-container .chapter-navigation {
		margin-top: 5px;
	}