/* = Globals */
/* == POS colors */
.pos.v {
 color:green;
}
.pos.n {
  color: #ca1010;
}
.pos.adj {
  color: blue;
}
.pos.adv {
  color: #e4980b;
}
.pos.interj {
  color: #b5b52c;
}
.pos.conj {
  color: brown;
}
.pos.prep {
  color: purple;
}
.pos.pron {
  color: #ff0099;
}
.pos.part {
	color: black;
}
/* == Latin/Eng. trans. example words */
.ex.lat {
	font-weight:600;
}
.ex.en {
	font-style:italic;
}

/* Cards */

.card {
	display:block;
	width:100%;
	margin-top:35px;
	margin-bottom:35px;
	padding:15px;
	border-radius:5px;
	border: 1px solid #dadce0;
}
.card.noborder {
	border:0;
}
.card.nomargin {
	margin:0;
}
.mt-0 {
	margin-top:0;
}
.mb-0 {
	margin-bottom:0;
}
.card.mt-15,
.mt-15 {
	margin-top:15px;
}
.card.mb-15,
.mb-15 {
	margin-bottom:15px;
}
.card.mb-50,
.mb-50 {
	margin-bottom:50px;
}
.card.mt-50,
.mt-50 {
	margin-top:50px;
}
.card.nopad {
	padding:0;
}
.card.neg-margin {
	margin-left:-15px;
	margin-right:-15px;
	width: auto;
}
.card.white {
	background-color:white;
}
.card.gray {
	background-color:#f1f1f1;
}
.card.shadow {
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

/* == Cards > Titles */

.card-title {
font-size: 1.25rem;
    margin: 0 0 15px 0;
    font-weight: 400;
    line-height: 1.5rem;
}
.card.nopad .card-title {
	padding:10px 15px 0 15px;
}

/* == Cards > Sentences/examples/translations */

.card.examples {
	padding:0;
}
.card.examples .sentence {
	display:block;
	width: 100%;
	padding: 0 0 0 45px;
    margin: 0 0 15px 0;
    position: relative;
}
.card.examples .sentence::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 600;
    font-style: normal;
    content: "\f10e";
    position: absolute;
    top: 15px;
    left: 15px;
    font-size: 0.9rem;
    width: 22px;
    text-align: center;
    color: #1f1f1f;
}
.card.examples .sentence .latin {
	display:block;
	width:100%;
	padding: 15px 15px 10px 8px;
}
.card.examples .sentence .english {
	display:block;
	width:100%;
}
.card.examples .sentence .english .text {
	color: #545454;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    background-color: #f1f1f1;
    padding: 6px 10px;
    font-size: .9rem;
    line-height: 1.3rem;
	display:block;
	width:100%;
}
/* == Cards > Expand Slider */
.card .card-more {
	display:block;
}
.card .card-more .expand-more-toggle {
	display:block;
	position:relative;
	margin-top: 30px;
	padding:0 15px 0 55px;
	height:40px;
	border-top: 1px solid #dadce0;
	line-height:40px;
	white-space:nowrap;
}

.card-more .expand-more-toggle i {
	position:absolute;
	top:0;
	left:15px;
	line-height:40px;
}
.card-more .expand-more-toggle.active i {
	transform: rotate(180deg);
}
.card-more .expand-more-toggle .label {
	display:block;
	line-height:40px;
	white-space:nowrap;
}
.card .card-more .expand-more-content {
	display:none;
	padding: 0;
}
.card .card-more .expand-more-toggle:hover {
	cursor:pointer;
}
.card .card-more .expand-more-toggle:hover > .label {
	text-decoration:underline;
}

/* == Cards > Gen Slider */

/* = Tables */
.table-wrap {
	    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.card.nopad .table {
	border-top-left-radius:0;
	border-top-right-radius: 0;
}
.table {
	width:100%;
	border-collapse: collapse;
	border-spacing:2px;
	background-color:white;
	overflow: hidden;
    border-radius: 5px;
}
.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #dadce0;
}
.table th, .table td {
    vertical-align: middle;
    box-sizing: border-box;
	text-align:left;
}
.table th, .table td {
    padding: 10px 15px;
    border-top: 1px solid #dadce0;
}

.table tr.notes td {
	font-size: 0.7rem;
    color: gray;
    line-height: 0.9rem;
}
.table tr .border-r {
	border-right:1px solid #dadce0;
}
.table tr td.va-top {
	vertical-align:top;
}
.table tr td.va-bott {
	vertical-align:bottom;
}
/* == Bordered */
.table.bordered {
	border: 1px solid #dadce0;
}
.table.bordered th, .table.bordered td {
  border: 1px solid #dadce0;
}
.table.bordered thead th, .table.bordered thead td {
    border-bottom-width: 2px;
}
/* == Borderless */
.table.borderless th, .table.borderless td, .table.borderless thead th, .table.borderless tbody+tbody {
	border:0;
}
/* == Others */
.table.striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0,0,0,0.03);
}
.table tr.light-bg td {
    background-color: rgba(0,0,0,0.03);
}

/* == Custom tables */

.table.wrd-pos {
	min-width:600px;
}
.table.abc tr td {
	font-weight:500;
	padding: 7px 4px;
	text-align:center;
}
.table.abc tr td:nth-of-type(even) {
	background-color: #efefef;
}
.table.n-cases tr th:first-of-type {
	vertical-align:top;
}
.table.n-cases tr th:first-of-type em {
	font-weight:400;
}

/* = Audio */
.pron-wrap {
						display:inline-block;
					}
.pron-wrap .play {
    padding: 0;
    border-radius: 50%;
    display: inline-block;
    color: gray;
    border: 1px solid #f1f1f1;
    font-size: 1.0rem;
    line-height: 30px;
    width: 30px;
    height: 30px;
    margin-right: 5px;
    background-color: white;
    vertical-align: bottom;
    text-align: center;
	-webkit-transition: all .2s ease;
    transition: all .2s ease;
}
.pron-wrap .play::before {
		font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    font-style: normal;
    content: "\f6a8";
    display: block;
    width: 100%;
    text-align: center;
    line-height: 30px;
    color: gray;
	font-size:0.8rem;
}
.pron-wrap .play:hover {
    cursor: pointer;
    background-color: #f1f1f1;
}
.pron-wrap .play svg.eq-active {
	display:none;
		margin-top: 5px;
	margin-left: 6px;
}
					.pron-wrap .play:hover::before {
						color:black;
					}
					.pron-wrap .play.active, .pron-wrap .play.paused {
						color:#07a564;
						background-color: rgba(16, 171, 49, 0.13);
					}
					.pron-wrap .play.active::before {
						color:#07a564;

					}
					.pron-wrap .play.paused::before {
						color:#07a564;
						content: "\f04b";
					}

.pron-wrap.size-40 .play {
    padding: 0;
    font-size: 1.3rem;
    line-height: 40px;
    width: 40px;
    height: 40px;
    vertical-align: bottom;
}
.pron-wrap.size-40 .play::before {
line-height: 38px;
    width: 38px;
    height: 38px;
	font-size:1.3rem;
}
.pron-wrap.size-40 .play.paused::before {
	font-size: 1.1rem;
}
@keyframes eq-uppydowny {
  0% {
    //height: 20px;
    transform: scaleY(1);
  }
  50% {
    //height: 3px;
    transform: scaleY(.5);
  }
  100% {
    //height: 20px;
    transform: scaleY(1);
  }
}
.pron-wrap.size-40 .play.active {
	 padding: 0;
}
.pron-wrap .play.active::before {
	display:none;
}
.pron-wrap.size-40 .play svg.eq-active {
	 margin: 10px 0 0 8px;
}
.pron-wrap .play.active svg.eq-active {
	display:block;
}

svg.eq-active .eq__bar {
  position: absolute;
  bottom: 0px;
  fill: #07a564;
  animation-name: eq-uppydowny;
  animation-fill: forwards;
  animation-iteration-count: infinite;
  transform-origin: 8px 16px;
  -webkit-transform-origin: 8px 16px;
  rx:2;
  ry:2;
}

svg.eq-active #eq1 {
  animation-duration: 0.6s;
}

svg.eq-active #eq2 {
 
  animation-duration: 1.3s;
}

svg.eq-active #eq3 {
  animation-duration: 0.7s;
}
svg.eq-active #eq4 {
  animation-duration: 0.9s;
}

/* = Scrolling (bars) */

.scroll-fmt {
	-webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.nowrap {
	white-space:nowrap;
}
.scroll-fmt.hor {
  overflow-x: scroll;
  overflow-y: hidden;
}

.scroll-fmt.ver {
  overflow-y: scroll;
  overflow-x: hidden;
}

.scroll-fmt::-webkit-scrollbar-thumb,
.scroll-fmt.hover-to-view:hover::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: #d0d0d0;
    transition: all 320ms;
}
.scroll-fmt::-webkit-scrollbar {
    background-color: transparent;
}
.scroll-fmt.hor::-webkit-scrollbar {
	height:5px;
}
.scroll-fmt::-webkit-scrollbar-thumb:hover {
    background-color: #a2a2a2;
}
.scroll-fmt.hover-to-view::-webkit-scrollbar-thumb {
	background-color:transparent;
}