@charset "utf-8";
/* CSS Document */

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

COLOR PALETTE




[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
	3.1 Logo
	3.2 Main Nav
	3.3 Header Side
	3.4 Hamburger
4. Menu
	4.1 Menu Social
	4.2 Menu copyright
5. Home
	5.1 Hero Slider
	5.2 Hero Slider Navigation
6. Hero Boxes
7. Page Section
8. Buttons
9. Popular
10. Register
11. Search
	11.1 Search Form
12. Services
13. Testimonials
14. Events
15. Footer
	15.1 Newsletter
	15.2 Footer Content
	15.3 Footer Copyright


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

/***********
1. Fonts
***********/

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800|Roboto:400,500,700');

/*********************************
2. Body and some general stuff
*********************************/

*
{
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
body
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	font-weight: 400;
	background: #FFFFFF;
	color: #3a3a3a;
}
div
{
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
ul
{
	list-style: none;
	margin-bottom: 0px;
}
p
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	line-height: 2.29;
	font-weight: 400;
	color: #3a3a3a;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a
{
	display: inline;
	position: relative;
	color: inherit;
	border-bottom: solid 1px #449396;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
a, a:hover, a:visited, a:active, a:link
{
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a:active
{
	position: relative;
	color: #3D8487;
}
p a:hover
{
	color: #FFFFFF;
	background: #449396;
}
p a:hover::after
{
	opacity: 0.2;
}
::selection
{
	background: #D8EEED;
	color: #293340;
}
p::selection
{
	background: #D8EEED;
	color: #293340;
}
h1{font-size: 36px;}
h2{font-size: 22px;}
h3{font-size: 18px;}
h4{font-size: 14px;}
h5{font-size: 11px;}
h1, h2, h3, h4, h5, h6
{
	font-family: 'Roboto', sans-serif;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
h1::selection, 
h2::selection, 
h3::selection, 
h4::selection, 
h5::selection, 
h6::selection
{
	
}
::-webkit-input-placeholder
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}
:-moz-placeholder /* older Firefox*/
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}
::-moz-placeholder /* Firefox 19+ */ 
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
} 
:-ms-input-placeholder
{ 
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}
::input-placeholder
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}
.form-control
{
	color: #2B323C;
}
section
{
	display: block;
	position: relative;
	box-sizing: border-box;
}
.clear
{
	clear: both;
}
.clearfix::before, .clearfix::after
{
	content: "";
	display: table;
}
.clearfix::after
{
	clear: both;
}
.clearfix
{
	zoom: 1;
}
.float_left
{
	float: left;
}
.float_right
{
	float: right;
}
.trans_200
{
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.trans_300
{
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.trans_400
{
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}
.trans_500
{
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.fill_height
{
	height: 100%;
}
.super_container
{
	width: 100%;
	overflow: hidden;
}
.prlx_parent
{
	overflow: hidden;
}
.prlx
{
	height: 130% !important;
}
.nopadding
{
	padding: 0px !important;
}

/*********************************
3. Header
*********************************/

.header
{
	position: fixed;
	/* top: 45px; */
	left: 0;
	width: 100%;
	height: 60px;
	background: #FFFFFF;
	z-index: 10;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
	box-shadow: 0px 3px 3px #449396;
}
.header.scrolled
{	
	/* top: 15px; */
}
.header.scrolled .header_content::before
{
	/* box-shadow: 0px 20px 49px rgba(0,0,0,0.17); */
}
.header_content
{
	width: calc(100% - 279px);
	height: 100%;
}
.header_content::before
{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: '';
	/* box-shadow: 0px 20px 49px rgba(0,0,0,0.67); */
	z-index: -1;
}
.header .navbar .container-fluid
{
	padding-left: 1rem;
	padding-right: 1rem;
	max-width: 100%;
	width: 100%;
}


/*********************************
3.1 Logo
*********************************/

.logo_container
{
	display: inline-block;
	padding-left: 30px;
}
.logo span
{
	font-family: 'Open Sans', sans-serif;
	font-size: 30px;
	font-weight: 900;
	color: #3a3a3a;
	vertical-align: middle;
	/* text-transform: uppercase; */
	margin-left: 3px;
}

/*********************************
3.2 Main Nav
*********************************/

.main_nav_container
{
	display: inline-block;
	margin-left: auto;
	padding-right: 93px;
}
.main_nav
{
	/* margin-top: 7px; */
}
.main_nav_item
{
	display: inline-block;
	margin-right: 20px;
	padding: 19px 5px 19px 5px;
}
.main_nav_item:last-child
{
	margin-right: 0px;
}
.main_nav_item a
{
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 700;
	color: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
	padding-top: 5px;
    padding-bottom: 5px;
}
.main_nav_item a:hover
{
	color: #449396 !important;
}

/* Ensure all nav items have consistent styling */
.header .navbar .nav-item {
	display: inline-block;
	margin-right: 4px;
	vertical-align: middle;
}

.header .navbar .nav-item:last-child {
	margin-right: 0px;
}

.header .navbar .nav-item .nav-link {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 700;
	color: #3a3a3a;
	transition: all 200ms ease;
	padding: 19px 5px;
}

.header .navbar .nav-item .nav-link:hover {
	color: #449396 !important;
}

/*********************************
3.3 Header Side
*********************************/

.header_side
{
	width: 279px;
	height: 100%;
	background: #449396;
}
.header_side img
{
	width: 29px;
	height: 29px;
}
.header_side span
{
	display: block;
	position: relative;
	font-size: 18px;
	font-weight: 500;
	color: #FFFFFF;
	padding-left: 12px;
}

/*********************************
3.4 Hamburger
*********************************/

.hamburger_container
{
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 20px;
	display: none;
	cursor: pointer;
}
.hamburger_container i
{
	font-size: 24px;
	padding: 10px;
	color: #3a3a3a;
}
.hamburger_container:hover i
{
	color: #449396;
}

/*********************************
4. Menu
*********************************/

.menu_container
{
	position: fixed;
	top: 0;
	right: -50vw;
	width: 100vw;
	height: 100vh;
	background: #FFFFFF;
	z-index: 12;
	-webkit-transition: all 0.6s ease;
	-moz-transition: all 0.6s ease;
	-ms-transition: all 0.6s ease;
	-o-transition: all 0.6s ease;
	transition: all 0.6s ease;
	visibility: hidden;
	opacity: 0;
}
.menu_container.active
{
	visibility: visible;
	opacity: 1;
	right: 0;
}
.menu
{
	position: absolute;
	top:150px;
	left: 0;
	padding-left: 15%;
}
.menu_list
{
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 1000ms 600ms ease;
	opacity: 0;
}
.menu_container.active .menu_list
{
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}
.menu_item
{
	margin-bottom: 9px;
}
.menu_item a
{
	font-family: 'Open Sans', sans-serif;
	font-size: 36px;
	font-weight: 700;
	color: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.menu_item a:hover
{
	color: #449396;
}
.menu_close_container
{
	position: absolute;
	top: 86px;
	right: 79px;
	width: 21px;
	height: 21px;
	cursor: pointer;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}
.menu_close
{
	top: 9px;
	width: 21px;
	height: 3px;
	background: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.menu_close::after
{
	display: block;
	position: absolute;
	top: -9px;
	left: 9px;
	content: '';
	width: 3px;
	height: 21px;
	background: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.menu_close_container:hover .menu_close,
.menu_close_container:hover .menu_close::after
{
	background: #449396;
}

/*********************************
4.1 Menu Social
*********************************/

.menu_social_container
{
	margin-top: 100px;
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 1000ms 1000ms ease;
	-moz-transition: all 1000ms 1000ms ease;
	-ms-transition: all 1000ms 1000ms ease;
	-o-transition: all 1000ms 1000ms ease;
	transition: all 1000ms 1000ms ease;
	opacity: 0;
	padding-left: 4px;
}
.menu_social_item
{
	display: inline-block;
	margin-right: 30px;
}
.menu_social_item a i
{
	color: #3a3a3a;
}
.menu_social_item a i:hover
{
	color: #449396;
}
.menu_container.active .menu_social_container
{
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

/*********************************
4.2 Menu copyright
*********************************/

.menu_copyright
{
	margin-top: 60px;
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 1000ms 1200ms ease;
	-moz-transition: all 1000ms 1200ms ease;
	-ms-transition: all 1000ms 1200ms ease;
	-o-transition: all 1000ms 1200ms ease;
	transition: all 1000ms 1200ms ease;
	opacity: 0;
	padding-left: 3px;
}
.menu_container.active .menu_copyright
{
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

/*********************************
5. Home
*********************************/

.home
{
	width: 100%;
	height: 110vh;
}

/*********************************
5.1 Hero Slider
*********************************/

.hero_slider_container
{
	width: 100%;
	height: 100%;
}
.hero_slide
{
	width: 100%;
	height: 100%;
}
.hero_slide_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.hero_slide_container
{
	width: 100%;
	height: 100vh;
}
.hero_slide_content
{
	max-width: 80%;
	-webkit-transform: translateY(30px);
	-moz-transform: translateY(30px);
	-ms-transform: translateY(30px);
	-o-transform: translateY(30px);
	transform: translateY(30px);
}
.hero_slide_content h1
{
	font-size: 72px;
	font-weight: 400;
	color: #FFFFFF;
}
.hero_slide_content h1 span
{
	background: #449396;
	padding-left: 13px;
	padding-right: 13px;
	margin-left: -12px;
	margin-right: -12px;
}
.animated
{
	-webkit-animation-duration : 1s !important;
	animation-duration : 1s !important;
	-webkit-animation-delay : 500ms;
	animation-delay : 500ms;
}
.animate-out
{
	-webkit-animation-delay : 0ms;
	animation-delay : 0ms;
}

/*********************************
5.2 Hero Slider Navigation
*********************************/

.hero_slider_nav
{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(calc(-50% + 30px));
	width: 58px;
	height: 58px;
	background: #FFFFFF;
	z-index: 9;
	cursor: pointer;
}
.hero_slider_nav:hover
{
	background: #449396;
}
.hero_slider_nav:hover span
{
	color: #FFFFFF;
}
.hero_slider_nav span
{
	display: block;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 700;
	color: #121212;
	line-height: 1;
}
.hero_slider_left
{
	left: 4.32%;
}
.hero_slider_right
{
	right: 4.32%;
}

/*********************************
6. Hero Boxes
*********************************/

.hero_boxes
{
	width: 100%;
	height: 0px;
	z-index: 9;
	padding-top: 0px;
}
.hero_boxes_inner
{
	position: absolute;
	top: 120px;
	left: 0;
	width: 100%;
}
.hero_box
{
	width: 100%;
	height: 161px;
	background: #1a1a1a;
	padding-left: 50px;
	cursor: pointer;
}
.hero_box:hover
{
	background: #449396;
}
.hero_box img
{
	width: 62px;
	height: auto;
	margin-top: -6px;
}
.svg path
{
	fill: #449396;
}
.hero_box svg
{
	width: 62px;
	height: auto;
}
.hero_box:hover svg path
{
	fill: #FFFFFF;
}
.hero_box_content
{
	padding-left: 13px;
	padding-top: 11px;
	margin-top: -6px;
}
.hero_box_title
{
	font-size: 24px;
	font-weight: 500;
	color: #FFFFFF;
	margin-bottom: 7px;
}
.hero_box_link
{
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
	color: #FFFFFF;
	padding-left: 3px;
}
.hero_box_link:hover
{
	color: #1a1a1a;
}

/*********************************
7. Page Section
*********************************/

.page_section
{
	padding-top: 70px;
	/* padding-bottom: 117px; */
}
.section_title
{

}
.section_title h1
{
	display: block;
	color: #1a1a1a;
	font-weight: 500;
	padding-top: 24px;
}
.section_title h1::before
{
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 55px;
	height: 4px;
	content: '';
	background: #449396;
}

/*********************************
8. Buttons
*********************************/

.button
{
	cursor: pointer;
}
.button:hover
{
	box-shadow: 0px 10px 20px rgba(0,0,0,0.2);
}
.button a
{
	font-size: 14px;
	line-height: 48px;
	font-weight: 700;
	text-transform: uppercase;
}
.button_1
{
	width: 202px;
	height: 48px;
}

/*********************************
9. Popular
*********************************/

.popular
{

}
.course_boxes
{
	margin-top: 68px;
}
.card
{
	display: block;
	background: #f8f9fb;
	border: none;
}
.card-img-top
{
	border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
.card-body
{
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 15px;
	padding-right: 15px;
}
.card-title
{
	margin-top: 55px;
}
.card-title a
{
	font-size: 22px;
	font-weight: 500;
	color: #1a1a1a;
	line-height: 1.2;
}
.card-title a:hover
{
	color: #a5a5a5;
}
.card-text
{
	font-size: 14px;
	font-weight: 500;
	color: #a5a5a5;
	margin-top: -12px;
}
.price_box
{
	width: 100%;
	height: 67px;
	background: #eaebec;
	margin-top: 41px;
	padding-left: 35px;
}
.course_author_image
{
	width: 46px;
	height: 46px;
	border-radius: 50%;
	overflow: hidden;
}
.course_author_name
{
	font-size: 14px;
	font-weight: 500;
	color: #1a1a1a;
	padding-left: 20px;
	margin-top: 7px;
}
.course_author_name span
{
	color: #a5a5a5;
}
.course_price
{
	width: 67px;
	height: 67px;
	background: #449396;
	margin-left: auto;
}
.course_price span
{
	color: #FFFFFF;
	font-size: 18px;
	font-weight: 500;
	margin-top: 7px;
}

/*********************************
10. Register
*********************************/

.register
{
	width: 100%;
}
.register_section
{
	width: 100%;
	background: #449396;
	padding-top: 156px;
	padding-bottom: 161px;
}
.register_content
{
	width: 522px;
}
.register_title
{
	color: #FFFFFF;
	margin-bottom: 16px;
	line-height: 1.63;
}
.register_title:last-child
{
	margin-bottom: 0px;
}
.register_title	span
{
	color: #1a1a1a;
}
.register_text
{
	color: #FFFFFF;
	font-weight: 500;
	margin-top: 32px;
	padding-left: 25px;
	padding-right: 25px;
	margin-bottom: 0px;
}
.register_button
{
	background: #1a1a1a;
	margin-top: 65px;
}
.register_button a
{
	color: #FFFFFF;
}

/*********************************
11. Search
*********************************/

.search_section
{
	width: 100%;
	height: 100%;
	background: #ececec;
}
.search_content
{
	width: 522px;
}
.search_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	opacity: 0.23;
}
.search_title
{
	color: #1a1a1a;
}

/*********************************
11.1 Search Form
*********************************/

.search_form
{
	margin-top: 57px;
}
.input_field
{
	width: 100%;
	height: 42px;
	background: #FFFFFF;
	box-sizing: border-box;
	border: solid 2px #FFFFFF;
	padding-left: 25px;
	margin-bottom: 24px;
}
input:last-of-type
{
	margin-bottom: 0px;
}
.input_field:focus
{
	outline: none !important;
	border: solid 2px #449396;
}
.search_submit_button
{
	width: 100%;
	height: 48px;
	background: #449396;
	color: #FFFFFF;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 700;
	margin-top: 28px;
	border: none;
	cursor: pointer;
}
.search_submit_button:hover
{
	box-shadow: 0px 10px 20px rgba(0,0,0,0.2);
}
.search_submit_button:focus
{
	outline: solid 2px #FFFFFF;
}

/*********************************
12. Services
*********************************/

.services
{
	padding-bottom: 76px;
}
.services_row
{
	margin-top: 65px;
}
.service_item
{
	margin-bottom: 41px;
}
.service_item h3
{
	font-family: 'Roboto', sans-serif;
	font-size: 22px;
	font-weight: 500;
	color: #1a1a1a;
	margin-bottom: 13px;
}
.service_item p
{
	font-size: 14px;
	font-weight: 500;
	color: #a5a5a5;
	max-width: 100%;
	margin-bottom: 0px;
}
.icon_container
{
	height: 41px;
	width: auto;
	margin-bottom: 30px;
}
.icon_container img
{
	height: 100%;
}

/*********************************
13. Testimonials
*********************************/

.testimonials
{
	width: 100%;
	background: #1a1a1a;
}
.testimonials_background_container
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.testimonials_background
{
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	opacity: 0.27;
}
.testimonials .section_title h1
{
	color: #FFFFFF;
}
.testimonials_slider_container
{
	padding-left: 30px;
	padding-right: 30px;
	margin-top: 56px;
}
.testimonials_item
{
	width: 100%;
	padding-bottom: 75px;
}
.quote
{
	font-size: 36px;
	color: #449396;
}
.testimonials_text
{
	color: #FFFFFF;
	margin-bottom: 0px;
}
.testimonial_user
{
	margin-top: 43px;
}
.testimonial_image
{
	width: 98px;
	height: 98px;
	border-radius: 50%;
	overflow: hidden;
}
.testimonial_image img
{
	width: 100%;
	height: auto;
}
.testimonial_name
{
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	color: #3D8487;
	margin-top: 21px;
}
.testimonial_title
{
	font-size: 14px;
	font-weight: 500;
	color: #FFFFFF;
	margin-top: 6px;
}
.testimonials_slider .owl-dots
{
	display: -webkit-box !important;
	display: -moz-box !important;
	display: -ms-flexbox !important;
	display: -webkit-flex !important;
	display: flex !important;
	flex-direction: row !important;
	justify-content: center;
	align-items: center;
}
.testimonials_slider .owl-dot span
{
	width: 8px !important;
	height: 8px !important;
	border: solid 2px #FFFFFF;
	background: transparent !important;
}
.testimonials_slider .owl-dot.active span
{
	width: 16px !important;
	height: 16px !important;
	border: none;
	background: #449396 !important;
}

/*********************************
14. Events
*********************************/

.event_items
{
	margin-top: 68px;
}
.event_item
{
	margin-bottom: 56px;
}
.event_item:last-child
{
	margin-bottom: 0px;
}
.event_date
{
	width: 131px;
	height: 131px;
	border: solid 2px #449396;
	margin-bottom: 18px;
}
.event_day
{
	font-size: 48px;
	font-weight: 700;
	color: #449396;
	margin-bottom: 1px;
	line-height: 1;
}
.event_month
{
	font-size: 16px;
	font-weight: 700;
	color: #449396;
}
.event_name a
{
	font-size: 22px;
	font-weight: 500;
	color: #1a1a1a;
}
.event_name a:hover
{
	color: #449396;
}
.event_location
{
	font-size: 14px;
	font-weight: 500;
	color: #1a1a1a;
	margin-top: 2px;
}
.event_content p
{
	font-weight: 500;
	color: #a5a5a5;
	margin-top: 21px;
	margin-bottom: 13px;
}
.event_image
{

}
.event_image img
{
	width: 100%;
}

/*********************************
15. Footer
*********************************/

.footer
{
	width: 100%;
	/* padding-top: 86px; */
	background: #1a1a1a;
}
.footer .section_title h1
{
	color: #FFFFFF;
}

/*********************************
15.1 Newsletter
*********************************/

.newsletter
{
	padding-bottom: 85px;
	border-bottom: solid 2px #4d4e4e;
}
.newsletter_form_container
{
	width: 60%;
	margin-top: 48px;
}
.newsletter_email
{
	width: calc(100% - 164px);
	height: 42px;
	border: none;
	padding-left: 27px;
	font-weight: 500;
	color: #1a1a1a;
}
.newsletter_email:focus
{
	outline: solid 2px #449396;
}
.newsletter_submit_btn
{
	width: 164px;
	height: 42px;
	border: none;
	background: #449396;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}
.newsletter_submit_btn:focus
{
	border: solid 2px #FFFFFF;
}

/*********************************
15.2 Footer Content
*********************************/

.footer_content 
{
	padding-top: 80px;
	padding-bottom: 83px;
	border-bottom: solid 2px #4d4e4e;
}
.footer_content .logo_container
{
	padding-left: 0px;
}
.footer_content .logo span
{
	color: #FFFFFF;
}
.footer_about_text
{
	margin-top: 24px;
	margin-bottom: 0px;
	padding-right: 20px;
}
.footer_column_title
{
	font-size: 18px;
	font-weight: 500;
	color: #FFFFFF;
	padding-top: 15px;
}
.footer_column_content
{
	margin-top: 32px;
}
.footer_list_item
{
	margin-bottom: 11px;
}
.footer_list_item a
{
	font-size: 14px;
	color: #a5a5a5;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.footer_list_item a:hover
{
	color: #449396;
}
.footer_contact_item
{
	font-size: 14px;
	font-weight: 400;
	color: #a5a5a5;
	margin-bottom: 22px;
}
.footer_contact_item:last-child
{
	margin-bottom: 0px;
}
.footer_contact_icon
{
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	margin-right: 10px;
}
.footer_contact_icon img
{
	width: 100%;
}

/*********************************
15.3 Footer Copyright
*********************************/

.footer_bar
{
	padding-top: 19px;
	padding-bottom: 19px;
}
.footer_social .menu_social_item a i
{
	color: #FFFFFF;
}
.footer_social .menu_social_item a i:hover
{
	color: #449396;
}
.footer_social .menu_social_item:last-child
{
	margin-right: 0px;
}
.button
{
	display: inline-block;
	width: 188px;
	height: 53px;
	vertical-align: middle;
	margin-right: 9px;
	margin-bottom: 15px;
}
.button:hover
{
	box-shadow: 0px 10px 20px rgba(0,0,0,0.2);
}
.button a
{
	line-height: 53px;
	display: block;
	font-size: 16px;
	font-weight: 700;
}
.button_color_1
{
	background: #449396;
}
.button_color_1 a
{
	color: #FFFFFF;
}
.button_color_2
{
	background: #1a1a1a;
}
.button_color_2 a
{
	color: #FFFFFF;
}
.button_line_1
{
	background: transparent;
	border: solid 2px #449396;
}
.button_line_1 a
{
	color: #449396;
}
.button_line_2
{
	background: transparent;
	border: solid 2px #1a1a1a;
}
.button_line_2 a
{
	color: #1a1a1a;
}

.lessons-list{
	background-color: #449396;
    font-size: 1.8em;
    color: white;
}
.lessons{
    font-size: 1.8em;
    color: #3a3a3a;
	border-bottom:1px solid;
}

.lesson-list a {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    /* text-transform: uppercase; */
    font-weight: 700;
    color: #3a3a3a;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.lesson-list a:hover {
    color: #449396;
}

/* Lesson Grid Styles */
.lesson-grid-section {
    margin-top: 20px;
    margin-bottom: 20px;
}

.lesson-grid-title {
    font-size: 28px;
    font-weight: 700;
    color: #1a1a1a;
    background: #449396;
    padding: 15px;
    color: white;
   
}

.lesson-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 30px;
}

.lesson-grid-item {
    border: 2px solid #3a3a3a;
    transition: all 300ms ease;
}

.lesson-grid-item a {
    display: flex;
    align-items: center;
    padding: 20px;
    text-decoration: none;
    color: #3a3a3a;
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    font-weight: 600;
}

.lesson-grid-item .lesson-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: #449396;
    color: white;
    font-weight: 700;
    font-size: 18px;
    border-radius: 50%;
    margin-right: 15px;
    flex-shrink: 0;
}

.lesson-grid-item .lesson-title {
    flex: 1;
}

.lesson-grid-item:hover {
    border-color: #449396;
    box-shadow: 0px 5px 15px rgba(68, 147, 150, 0.3);
    transform: translateY(-3px);
}

.lesson-grid-item:hover a {
    color: #449396;
}

.lesson-grid-item:hover .lesson-number {
    background: #3a3a3a;
}

/* Responsive Grid */
@media (max-width: 991px) {
    .lesson-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
}

@media (max-width: 576px) {
    .lesson-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .lesson-grid-item a {
        padding: 15px;
        font-size: 16px;
    }
    
    .lesson-grid-item .lesson-number {
        width: 35px;
        height: 35px;
        font-size: 16px;
        margin-right: 12px;
    }
}
/* Show dropdown on hover */
/*
.main_nav_item.dropdown:hover .dropdown-menu {
    display: block;
}
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: unset !important;
    margin: 0rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: .25rem;
}

.menu_container .dropdown-menu {
	display: none;
	padding-left: 15px;
	background-color: #f9f9f9;
	margin-top: 10px;
}

.menu_container .dropdown-menu.show {
	display: block;
}

.menu_container .dropdown-menu .dropdown-item a {
	color: #000;
	text-decoration: none;
	display: block;
	padding: 10px 0;
}

*/

/* Full-width dropdown menu - Fixed positioning from viewport edge */
.header .navbar .dropdown-menu {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    border-radius: 0 0 12px 12px;
    border-left: none;
    border-right: none;
    padding: 0 2rem 1rem !important;
    top: 64px !important; /* Height of navbar */
    background: #ffffff !important;
    border-top: 3px solid #449396;
	border-bottom: 3px solid #449396;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.08);
}

/* Ensure parent allows fixed positioning */
.header .navbar .nav-item.dropdown {
    position: static !important;
}

/* Remove row margins inside dropdown */
.header .navbar .dropdown-menu .row {
    margin-left: 0;
    margin-right: 0;
}

/* Remove column padding for edge-to-edge layout */
.header .navbar .dropdown-menu .row > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
}

/* Dropdown item styling */
.header .navbar .dropdown-menu .dropdown-item {
    padding: 8px 15px;
    white-space: normal;
    font-size: 14px;
    color: #3a3a3a;
    transition: all 200ms ease;
    background: transparent;
}

.header .navbar .dropdown-menu .dropdown-item:hover {
    background-color: #f5f5f5;
    color: #449396;
    padding-left: 20px;
}

/* Mobile responsiveness for dropdown */
@media (max-width: 991px) {
    /* Fix hamburger button clickability */
    .header .navbar-toggler {
        position: relative;
        z-index: 1050;
        padding: 0.5rem 0.75rem;
        border: 1px solid rgba(0,0,0,.1);
        background-color: #fff;
    }
    
    /* Ensure navbar collapse works properly - FULL WIDTH */
    .header .navbar-collapse {
        position: relative;
        z-index: 1040;
        background: #ffffff;
        max-height: 80vh;
        overflow-y: auto;
        box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.1);
        padding: 15px 0;
        margin-left: -15px;
        margin-right: -15px;
    }
    
    /* Add padding to nav items */
    .header .navbar-collapse .navbar-nav {
        padding: 0 20px;
    }
    
    /* Main nav items padding */
    .header .navbar-collapse .nav-item {
        padding: 8px 0;
    }
    
    .header .navbar .dropdown-menu {
        position: relative !important;
        width: 100% !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        border-top: none;
        box-shadow: none;
        border-bottom: 1px solid #e0e0e0;
        margin: 0;
    }
    
    .header .navbar .dropdown-menu .dropdown-item {
        padding: 12px 20px;
        border-bottom: 1px solid #f0f0f0;
    }
    
    .header .navbar .dropdown-menu .dropdown-item:last-child {
        border-bottom: none;
    }
}


.done {
    color: black;
    background-color: white;
}
.todo {
    color: #FFFFFF;
    background-color: #449396;
    font-weight: normal;
}
.future {
    color: #000000;
    background-color: #D8EEED;
    font-weight: normal;
}
span#pattern span{
	font-size: 2em;
}
@font-face {
	font-family: krutidev;
	src: url("/fonts/Kruti-Dev-010.eot")
   }
   @font-face
   {
   font-family: krutidev;
   src: url('/fonts/Kruti-Dev-010.ttf ');
   }

   #drop-area {
	border: 2px dashed #449396;
	border-radius: 10px;
	padding: 40px;
	text-align: center;
	background: #f8f9fa;
	cursor: pointer;
	transition: background-color 0.3s ease;
  }
  #drop-area.dragover {
	background-color: #D8EEED;
	border-color: #449396;
  }
  #preview {
	max-width: 100%;
	margin-top: 20px;
  }
  #output {
	white-space: pre-wrap;
  }
  .text-black{
	color: #3a3a3a;
  }

  /* Speech-to-Text Page Styles */
  .speech-container {
	max-width: 900px;
	margin: 40px auto;
	padding: 30px;
	background-color: #f8f4f4;
	border: 1px solid #bee5eb;
	border-radius: 8px;
  }

  .speech-container h2 {
	background: #449396;
	padding: 15px;
	color: white;
	border-radius: 5px;
	margin-bottom: 20px;
  }

  /* Results Container - Google Style */
  .results-container {
	position: relative;
	min-height: 200px;
	background: white;
	border: 2px solid #d0d0d0;
	border-radius: 8px;
	padding: 20px;
	margin-bottom: 20px;
	font-size: 16px;
	line-height: 1.6;
  }

  #results {
	min-height: 160px;
	word-wrap: break-word;
  }

  .final {
	color: #000;
	font-weight: normal;
  }

  .interim {
	color: #999;
	font-style: italic;
  }

  /* Microphone Button - Corner Position */
  .mic-btn-corner {
	position: absolute;
	top: 15px;
	right: 15px;
	background-color: #dc3545;
	border: none;
	color: white;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	font-size: 24px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	z-index: 10;
  }

  .mic-btn-corner:hover {
	background-color: #c82333;
	transform: scale(1.1);
  }

  .mic-btn-corner.recording {
	background-color: #449396;
	animation: pulse 1.5s infinite;
  }

  @keyframes pulse {
	0%, 100% {
	  box-shadow: 0 0 0 0 rgba(24, 169, 167, 0.7);
	}
	50% {
	  box-shadow: 0 0 0 10px rgba(24, 169, 167, 0);
	}
  }

  /* Language Selectors - Dual Dropdown */
  .language-selectors {
	display: flex;
	gap: 15px;
	justify-content: center;
	margin-bottom: 20px;
  }

  .language-selectors .form-select {
	max-width: 250px;
	padding: 10px;
	border: 1px solid #d0d0d0;
	border-radius: 5px;
	font-size: 14px;
  }

  .language-selectors .form-select:focus {
	border-color: #449396;
	outline: none;
	box-shadow: 0 0 0 0.2rem rgba(24, 169, 167, 0.25);
  }

  /* Transliteration Option */
  .transliteration-option {
	text-align: center;
	margin-bottom: 15px;
  }

  .transliteration-option input[type="checkbox"] {
	margin-right: 8px;
  }

  .transliteration-option label {
	font-size: 14px;
	font-weight: 500;
  }

  /* Action Buttons */
  .action-buttons {
	display: flex;
	gap: 10px;
	justify-content: center;
	flex-wrap: wrap;
  }

  .action-buttons .btn {
	padding: 10px 20px;
	font-size: 14px;
	font-weight: 600;
	border-radius: 5px;
	border: none;
	cursor: pointer;
	transition: all 0.3s ease;
  }

  .action-buttons .contact_send_btn {
	background: #449396;
	color: white;
	width: auto;
  }

  .action-buttons .contact_send_btn:hover {
	background: #e6a305;
	box-shadow: 0px 5px 15px rgba(68, 147, 150, 0.3);
  }

  .action-buttons .btn-secondary {
	background: #6c757d;
	color: white;
  }

  .action-buttons .btn-secondary:hover {
	background: #5a6268;
  }

  /* Responsive Design */
  @media (max-width: 768px) {
	.speech-container {
	  padding: 20px;
	  margin: 20px auto;
	}

	.language-selectors {
	  flex-direction: column;
	  align-items: center;
	}

	.language-selectors .form-select {
	  max-width: 100%;
	  width: 100%;
	}

	.mic-btn-corner {
	  width: 45px;
	  height: 45px;
	  font-size: 20px;
	}

	.action-buttons {
	  flex-direction: column;
	}

	.action-buttons .btn {
	  width: 100%;
	}
  }

  /* Legacy speech-box styles (kept for compatibility) */
  .speech-box {
	background-color: #f8f4f4;
	border: 1px solid #bee5eb;
	padding: 20px;
	border-radius: 8px;
  }
  @font-face {
	font-family: punjabi;
	src: url("/fonts/ASEES.eot")
   }
   @font-face
   {
   font-family: punjabi;
   src: url('/fonts/ASEES.TTF');
   }

   .table-bordered {
    border: 1px solid #3a3a3a;
}
.contact_send_btn {
    width: 100%;
    height: 48px;
    background: #449396;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: #FFFFFF;
    cursor: pointer;
    border: none;
	border-radius: 10px;
}
.custom-box {
	flex: 0 0 25%; /* 4 per row = 100% / 4 = 25% */
	max-width: 25%;
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
  }
.detail{
	background: #449396;
}
.detail li{
	background: #449396;
}
.detail li a{
	color: white;
    font-weight: bold;
    font-size: 1.2rem;
}
li.main_nav_item.dropdown:hover {
    background: #f8f9fa;
}
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #f8f9fa;
}
/* Hide everything by default during print */
@media print {
	.super_container {
	  display: none;
	}
	#printArea {
	  display: block !important;
	  position: absolute;
	  top: 0;
	  left: 0;
	}
  }
.errors{
	color:red;
}
.speech-box select{
	top:20%;
	/*position: absolute;*/
}
.contact_send_btn{
	width: 20%;
}

h2{
	/* background: #449396; */
  /* padding: 5px; */
  color: white;
}
#langSelect{
	height: unset;
}
.page-hero-title {
	background: #449396;
	padding: 10px 28px;
	text-align: left;
	margin-bottom: 24px;
	color:white;
}