@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,100,300,500,700,900);
	
	html {
		text-rendering: optimizeLegibility !important;
		-webkit-font-smoothing: antialiased !important;
		-moz-osx-font-smoothing: grayscale !important;	
	}
	
	body {
		font-family: 'Open Sans', sans-serif;
		font-weight: normal;
		background: #1c262f;
		padding: 0;
		margin: 0;
	}
	
	h1, h2, h3, h4, h5, h6 {
		font-family: 'Montserrat', sans-serif;
	}
	
	.bg-none {
		background-color: none !important;
	}

	.page-content {
		background: #fff;
	}
	
	.section-white {
		background: #fff;
		color: #000;
	}
	
	.section-gray {
		background: #1c262f;
		color: #fff;
	}

	.section-blue {
		background: #607d8b;
		color: #fff;
	}

	.section-dark {
		background: #1c262f;
		color: #e2e4e7;
	}
	
	
	.nav-section {
		background: #9C27B0;
		background-image: -moz-linear-gradient( 135deg, rgba(233, 30, 99) 0%, #9C27B0 100%);
		background-image: -webkit-linear-gradient( 135deg, rgba(233, 30, 99, 1) 0%, #9C27B0 100%);
		background-image: -ms-linear-gradient( 135deg, rgb(233, 30, 99) 0%, #9C27B0 100%);
		color: #fff;
	}
	
	.navbar {
		padding: .5rem 0;
	}

	.navbar-brand {
		font-size: 30px;
	}
	
	.navbar-dark .navbar-nav .nav-link {
		color: rgba(255, 255, 255, 0.75);
		font-weight: bold;
		padding: 10px;
		background: rgba(255, 255, 255, 0.25);
		border-radius: 3px;
		margin-top: 5px;
		margin-bottom: 5px;
	}

	.navbar-dark .navbar-nav .nav-link:hover {
		color: rgba(255, 255, 255, 1);
	}

	.trans-content {
		font-size: 16px; 
		line-height: 30px;
	}
	
	.youtube-marker {
		display: inline;
	}

	.youtube-marker:hover {
		cursor: pointer;
		text-decoration: underline;
	}

	.content-transcription {
		font-family: 'Baloo Tamma Regular', cursive;
	}

	.content-transliteration {
		font-style: italic;
	}
	
	.content-transcription.hide, .content-translation, .content-transliteration {
		display: none !important;
	}

	.content-transcription, .content-translation.show, .content-transliteration.show {
		display: block !important;
	}
	
	.youtube-marker-current {
		background: #d2d2d2;
	}

	.content-transliteration .youtube-marker-current{
		background: #d3ffdc !important;
	}

	.content-translation .youtube-marker-current{
		background: #ffd0e0 !important;
	}
	
	
	/* The switch - the box around the slider */
	.switch-container {
		margin-top: 10px;
		height: 28px;
		font-size: 16px;
		line-height: 28px;
	}
	
	.switch {
	  position: relative;
	  display: inline-block;
	  float: right;
	  width: 48px;
	  height: 28px;
	}

	/* Hide default HTML checkbox */
	.switch input {display:none;}

	/* The slider */
	.slider {
	  position: absolute;
	  cursor: pointer;
	  top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  background-color: #ccc;
	  -webkit-transition: .4s;
	  transition: .4s;
	}

	.slider:before {
	  position: absolute;
	  content: "";
	  height: 20px;
	  width: 20px;
	  left: 4px;
	  bottom: 4px;
	  background-color: white;
	  -webkit-transition: .4s;
	  transition: .4s;
	}

	input:checked + .slider {
	  background-color: #4caf50;
	}

	input:focus + .slider {
	  box-shadow: 0 0 1px #4caf50;
	}

	.switch-transcription .switch-label {
		background-color: #d2d2d2;
	}

	.switch-transliteration .switch-label {
		background-color: #d3ffdc;
	}
	
	.switch-transliteration input:checked + .slider {
		background-color: #4caf50;
	}

	.switch-transliteration input:focus + .slider {
	  box-shadow: 0 0 1px #4caf50;
	}

	.switch-translation .switch-label {
		background-color: #ffd0e0;
	}

	.switch-translation input:checked + .slider {
	  background-color: #4caf50;
	}

	.switch-translation input:focus + .slider {
	  box-shadow: 0 0 1px #4caf50;
	}
	
	
	input:checked + .slider:before {
	  -webkit-transform: translateX(20px);
	  -ms-transform: translateX(20px);
	  transform: translateX(20px);
	}

	/* Rounded sliders */
	.slider.round {
	  border-radius: 28px;
	}

	.slider.round:before {
	  border-radius: 50%;
	}
	
	
	
	
	
	
.embed-responsive {
   background-color: #33485a;
}

.featured-video {
  transition: width .2s ease-in-out, height .2s ease-in-out, transform .38s ease-in-out;
}
/** Use .sticky */


.featured-video.is-sticky {
	position: fixed;
	top: 0;
	right: auto;
	left: 0;
	z-index: 999;
	max-width: 360px;
	max-height: 203px;
	width: 360px;
	height: 203px;

  /* max-width: 280px;
  max-height: 158px;
  width: 280px;
  height: 158px; */
}



.circle {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	font-size: 20px;
	border: 3px solid #fff;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	line-height: 45px;
	text-align: center;
	background: #9C27B0;
    background-image: -moz-linear-gradient( 135deg, rgba(233, 30, 99) 0%, #9C27B0 100%);
    background-image: -webkit-linear-gradient( 135deg, rgba(233, 30, 99, 1) 0%, #9C27B0 100%);
    background-image: -ms-linear-gradient( 135deg, rgb(233, 30, 99) 0%, #9C27B0 100%);
	color: #fff;
	font-weight: 700;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.module-list {
	border: 1px solid #eee;
	background: #fff;
	list-style: none;
	margin: 0;
	padding: 0;
}

.module-list-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.module-list-item>* {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 1em 1em 0;
}

.module-list-item>* {
	padding: 20px;
}

.module-list-item:nth-child(2n) {
	background: #f7f7f7;
}

.module-list-index {
	padding-right: 0;
}

.module-list-index {
	color: #fff;
	font-weight: 700;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.module-list-details {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.module-list-meta {
	text-transform: uppercase;
	margin-bottom: .7em;
	color: #cacaca;
	font-weight: 700;
}

.module-list-title {
	font-size: 24px;
	line-height: 36px;
	margin-bottom: 0;
}

.module-list-title a {
	color: #e21f6a;
	text-decoration: none;
	font-size: 1.1rem;
    line-height: 1.75rem;
	font-weight: 600;
	display: block;
}

.module-list-title a.active {
	color: #9f27ad;
}

.module-list-title a:hover {
	color: #9f27ad;
	text-decoration: none;
}


.section-promo h1{
	font-size: 2rem;
}

.section-title h1{
	font-size: 1.5rem;
}

.footer-section.top {
	background: #e2e4e7;
	color: #333;
	font-size: 16px;
}

.footer-section.bottom a,
.footer-section.bottom a:hover {
	color: #e2e4e7;
	text-decoration: underline;
}


.footer-section.top .nav .nav-item {
	border-bottom: 1px solid #666;
}

.footer-section.top .nav .nav-link {
	color: #666;
	font-weight: bold;
}

.footer-section.top .nav .nav-link:hover {
	color: #333;
}


@media (min-width: 576px) {

	.navbar-brand {
		font-size: 36px;
	}

	.navbar-dark .navbar-nav .nav-link {
		margin-left: 10px;
	}
	
	.section-promo h1{
		font-size: 2rem;
	}
	
}

@media (min-width: 768px) {

}

@media (min-width: 992px) {
	.featured-video.is-sticky {
		max-width: 400px;
		max-height: 226px;
		width: 400px;
		height: 226px;
		transform: translateX(10px) translateY(10px);
	}
}

@media (min-width: 1200px) {
	.featured-video.is-sticky {
		max-width: 400px;
		max-height: 226px;
		width: 400px;
		height: 226px;
		transform: translateX(10px) translateY(10px);
	}
}