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

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

[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
	3.1 Top Bar
	3.2 Header Content
	3.3 Logo
	3.4 Main Nav
	3.5 Hamburger
4. Menu
5. Home
6. Featured Course
7. Courses
8. Milestones
9. Why Choose Us - Accordions
10. Events
11. News
12. Video
13. Join
14. Footer


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



/*********************************
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;
}


body
{
    font-family: "open_sansregular", Arial, "微軟正黑體", "Microsoft JhengHei", sans-serif;
	font-size: 14px;
	font-weight: normal;
	background: #FFFFFF;
	color: #6c6a74;
}
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: "open_sansregular", Arial, "微軟正黑體", "Microsoft JhengHei", sans-serif;
	font-size: 14px;
	line-height: 1.2;
	font-weight: 500;
	color: #6c6a74;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a
{
	display: inline;
	position: relative;
	color: inherit;
	border-bottom: solid 1px #ffa07f;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
p:last-of-type
{
	margin-bottom: 0;
}
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;
}
p a:active
{
	position: relative;
	color: #FF6347;
}
p a:hover
{
	color: #FFFFFF;
	background: #ffa07f;
}
p a:hover::after
{
	opacity: 0.2;
}


h1{font-size: 48px;}
h2{font-size: 36px;}
h3{font-size: 15px;}
h4{font-size: 15px;}
h5{font-size: 14px;}
h1, h2, h3, h4, h5, h6
{
    font-family: "open_sansregular", Arial, "微軟正黑體", "Microsoft JhengHei", sans-serif;
	color: #012061;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
}

.form-control
{
	color: #db5246;
}

   /* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 150px; /* Location of the box */
  left: 0;
  top: 0;
 /* width: 70%; 
  height: 70%;   */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal2 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 150px; /* Location of the box */
  left: 0;
  top: 0;
 /* width: 70%; 
  height: 70%;   */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 10px;
  border: 1px solid #888;
  width: 50%;
}
/* Modal Content */
.modal-content2 {
  background-color: #fefefe;
  margin: auto;
  padding: 10px;
  border: 1px solid #888;
  width: 50%;
}
/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}


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;
}
.newbtn{
	color: white;
    background-color: #007bff;
    padding: 5px;
    font-size: 20px;
    cursor: pointer;
	  border: none;
  padding: 0;
}
.fill_height
{
	height: 100%;
}
.super_container
{
	width: 100%;
	overflow: hidden;
}
.prlx_parent
{
	overflow: hidden;
}
.prlx
{
	height: 130% !important;
}
.parallax-window
{
    min-height: 400px;
    background: transparent;
}
.parallax_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.nopadding
{
	padding: 0px !important;
}
.button
{
	display: inline-block;
	width: auto;
	height: 47px;
	background: #ff8a00;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.button a
{
	display: block;
	position: relative;
	padding-left: 33px;
	padding-right: 77px;
	line-height: 47px;
	font-size: 12px;
	font-weight: 600;
	color: #FFFFFF;
	text-transform: uppercase;
	white-space: nowrap;
}
.button_arrow
{
	position: absolute;
	top: 0;
	right: 0;
	width: 44px;
	height: 100%;
	background: #ff6600;
	text-align: center;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.button_arrow i
{
	font-size: 20px;
	line-height: 47px;
	color: #ffae00;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.button:hover
{
	background: #ffae00;
}
.button:hover .button_arrow
{
	background: #ff8a00;
}
.button:hover .button_arrow i
{
	color: #ffae00;
}
.section_title h2
{
	font-weight: 600;
}
.section_subtitle
{
	font-size: 14px;
	color: #6c6a74;
	text-align: center;
	margin-top: 66px;
	line-height: 2.14;
}
.py-md-5{
	padding:3%;
	
}
/*********************************
3. Header
*********************************/

.header
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	box-shadow: 0px 5px 20px rgba(0,0,0,0.05);
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.header.scrolled
{
	top: -61px;
}

h2.txtbg{
	    background-image: linear-gradient(to right, rgb(255, 255, 255) 0%, rgb(255, 152, 0) 100%);
		font-size:25px;
}
.con{
  text-align: center;
  position: absolute;
  top: 59%;
  left: 100%;
  transform: translate(-50%,-50%);
  width: 100%;
}


.con span{
  text-transform: uppercase;
  display: block;
}



.container span{
/*   text-transform: uppercase; */
  display: block;
}
.textorg{
  color: #012061;
  font-size: 60px;
  font-weight: 700;
  margin-top: 20px;
  position: relative;
  animation: text 3s 1;
}

.text12{
  color: #ff9800;
  font-size: 60px;
  font-weight: 700;
  margin-top: 35px;
  position: relative;
  animation: text 3s 1;
}

.text1{
  color: #012061;
  font-size: 60px;
  font-weight: 700;
  margin-top: 35px;
  position: relative;
  animation: text 3s 1;
}
.text2{
  color: #012061;
  font-size: 38px;
  animation: text 3s 1;
  padding-top:5px;
}


#navimg{
 background-image:url(../images/bluelogo01.png);
  background-repeat:no-repeat; 
  min-height:100px;
      background-size: 53%;
}
@keyframes textblue {
  0%{
    color: #ff9800;
    margin-bottom: -40px;
  }
  30%{
    letter-spacing: 25px;
    margin-bottom: -40px;
  }
  85%{
    letter-spacing: 8px;
    margin-bottom: -40px;
  }
  
    
}
@keyframes text {
  0%{
    color: #012061;
    margin-bottom: -40px;
  }
  30%{
    letter-spacing: 25px;
    margin-bottom: -40px;
  }
  85%{
    letter-spacing: 8px;
    margin-bottom: -40px;
  }
  
    
}

@keyframes text22 {
  0%{
    color: black;
    margin-bottom: -20px;
  }
  30%{
    letter-spacing: 25px;
    margin-bottom: -20px;
  }
  85%{
    letter-spacing: 8px;
    margin-bottom: -20px;
  }
  
    
}
.txtbarbga{
	background-image:url(../images/a.png); background-size:contain;
}
.txtbarbgb{
	background-image:url(../images/b.png); background-size:contain;
}

.txtbar{

    box-shadow: 8px 8px #11236a;
    padding-left: 5px;	
}
/*********************************
3.1 Top Bar
*********************************/

.top_bar
{
	width: 100%;
	background: #2c2b31;
}
.header.scrolled .top_bar
{

}
.top_bar_container
{
	width: 100%;
	height: 100%;
}
.top_bar_content
{
	width: 100%;
	height: 61px;
}
.top_bar_contact_list li
{
	display: inline-block;
}
.question
{
    font-family: 微軟正黑體, "Microsoft JhengHei", sans-serif ;
	font-size: 12px;
	font-weight: 600 !important;
	color: #918ea0;
	margin-left: 0px;
	text-transform: uppercase;
}
.top_bar_contact_list li > div
{
	display: inline-block;
	font-size: 12px;
	font-weight: 500;
	color: #918ea0;
}
.top_bar_contact_list li > div
{
	margin-left: 1px;
}
.top_bar_contact_list li:first-child
{
	margin-right: 42px !important;
}
.top_bar_contact_list li:not(:last-child)
{
	margin-right: 33px;
}
.top_bar_login
{
	
}
.top_bar_login ul li
{
	display: inline-block;
	position: relative;
}
.top_bar_login ul li a
{
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 600;
	color: #FFFFFF;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.top_bar_login ul li a:hover
{
	color: #ff8a00;
}
.top_bar_login ul li:not(:last-child)::after
{
	display: inline-block;
	margin-left: 5px;
	margin-right: 1px;
	content: '/';
	font-size: 12px;
	color: #FFFFFF;
	font-weight: 600;
}

/*********************************
3.2 Header Content
*********************************/

.header_container
{
	width: 100%;
	background: #FFFFFF;
	border-bottom: 1px solid #ff9800; 
	padding-bottom: 5px;
	box-shadow: 0 3px 3px -3px #DAF2FF;


}
.header_content
{
	height: 60px;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.header.scrolled .header_content
{
	height: 70px;
}

/*********************************
3.3 Logo
*********************************/

.logo,
.logo_text
{
	display: inline-block;
}
.logo
{
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.logo_text
{
    font-family: 微軟正黑體, "Microsoft JhengHei", sans-serif ;
	font-size: 18px;
	font-weight: 700;
	line-height: 0.75;
	margin-left: 1px;
	color: #464646;
	text-transform: uppercase;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

/*********************************
3.4 Main Nav
*********************************/

.main_nav_contaner
{

}
.main_nav,
.search_button
{
	display: inline-block;
}
.main_nav li
{
	display: inline-block;
	position: relative;
	height: 31px;
}
.main_nav li:not(:last-child)
{
	margin-right: 13px;
}
.main_nav li a
{
	display: block;
	font-size: 16px;
	font-weight: bold;
	line-height: 31px;
	background: #FFFFFF;
	color: rgb(1,32,97);
	padding-left: 2px;
	padding-right: 2px;
	text-transform: uppercase;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 450ms ease;
	 /* border-radius:10px; */	
}
.main_nav li a:hover,
.main_nav li.active a
{
	color: #FFFFFF;
	background: #791225;
}
.main_nav li a:hover
{
	background: rgb(3, 169, 244);
}
.search_button
{
	margin-left: 88px;
	cursor: pointer;
}
.search_button i
{
	font-size: 15px;
	color: #181818;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.search_button:hover i
{
	color: #ff8a00;
}
.header_search_form
{
	display: block;
	position: relative;
	width: 40%;
}
.header_search_container
{
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	background: #2c2b31;
	z-index: -1;
	opacity: 0;
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}
.header_search_container.active
{
	bottom: -73px;
	opacity: 1;
}
.header_search_content
{
	width: 100%;
	height: 73px;
}
.search_input
{
	width: 100%;
	height: 40px;
	border: none;
	outline: none;
	padding-left: 20px;
	background: transparent;
	border-bottom: solid 2px #ff8a00;
	color: #FFFFFF;
}
.header_search_button
{
	position: absolute;
	top: 0;
	right: 0;
	width: 40px;
	height: 100%;
	border: none;
	outline: none;
	cursor: pointer;
}

/*********************************
3.5 Hamburger
*********************************/

.hamburger_container
{

}
.hamburger
{
	display: none;
	cursor: pointer;
}
.hamburger i
{
	font-size: 25px;
	color: #791225;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
	
}
.hamburger:hover i
{
	color: #ff8a00;
}

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

.menu
{
	position: fixed;
	top: 0;
	right: -400px;
	width: 400px;
	height: 70vh;
	background: #e9ecef;
	z-index: 101;
	padding-right: 60px;
	padding-top: 87px;
	padding-left: 50px;
	box-shadow: 0px 5px 20px rgba(0,0,0,0.1);
}
.menu .logo a
{
	color: #000000;
}
.menu.active
{
	right: 0;
}
.menu_close_container
{
	position: absolute;
	top: 30px;
	right: 60px;
	width: 18px;
	height: 18px;
	transform-origin: center center;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
	cursor: pointer;
}
.menu_close
{
	width: 100%;
	height: 100%;
	transform-style: preserve-3D;
}
.menu_close div
{
	width: 100%;
	height: 2px;
	background: #232323;
	top: 8px;
	-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 div:last-of-type
{
	-webkit-transform: rotate(90deg) translateX(-2px);
	-moz-transform: rotate(90deg) translateX(-2px);
	-ms-transform: rotate(90deg) translateX(-2px);
	-o-transform: rotate(90deg) translateX(-2px);
	transform: rotate(90deg) translateX(-2px);
	transform-origin: center;
}
.menu_close:hover div
{
	background: #937c6f;
}
.menu .logo
{
	margin-bottom: 60px;
}
.menu_nav ul li
{
	margin-bottom: 9px;
}
.menu_nav ul li a
{
	font-size: 16px;
	color: rgb(1,32,97);
	font-weight: 700;
	letter-spacing: 0.05em;
	-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_nav ul li a:hover
{
	color: #ff6600;
}
.menu .search
{
	width: 100%;
	margin-bottom: 67px;
}
.search
{
	display: inline-block;
	width: 400px;
	-webkit-transform: translateY(2px);
	-moz-transform: translateY(2px);
	-ms-transform: translateY(2px);
	-o-transform: translateY(2px);
	transform: translateY(2px);
}
.menu .header_search_form
{
	width: 100%;
}
.search form
{
	position: relative;
}
.menu .search_input
{
	width: 100%;
	background: transparent;
	height: 42px;
	border: none;
	outline: none;
	padding-left: 20px;
	border-bottom: solid 2px #d9d9d9;
	-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 .search_input::-webkit-input-placeholder
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: rgba(0,0,0,0.15) !important;
}
.menu .search_input:-moz-placeholder
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: rgba(0,0,0,0.15) !important;
}
.menu .search_input::-moz-placeholder
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: rgba(0,0,0,0.15) !important;
} 
.menu .search_input:-ms-input-placeholder
{ 
	font-size: 14px !important;
	font-weight: 500 !important;
	color: rgba(0,0,0,0.15) !important;
}
.menu .search_input::input-placeholder
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: rgba(0,0,0,0.15) !important;
}
.menu .search_input:focus
{
	border-bottom: solid 2px #ff6600;
}
.header_search_button
{
	position: absolute;
	top: 0;
	right: 0;
	width: 40px;
	height: 100%;
	border: none;
	outline: none;
	cursor: pointer;
	background: transparent;
}
.header_search_button:focus
{
	outline: none;
}
.header_search_button i
{
	font-size: 16px;
	color: #d9d9d9;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.header_search_button:hover i
{
	color: #ff8a00;
}
.menu_extra
{
	position: absolute;
	right: 60px;
	bottom: 30px;
}
.menu_phone,
.menu_social
{
	font-size: 12px;
}
.menu_social
{
	margin-right: -6px;
	margin-top: 5px;
}
.menu_title
{
	text-transform: uppercase;
	margin-right: 10px;
}
.menu_social ul
{
	display: inline-block;
}
.menu_social ul li
{
	display: inline-block;
}
.menu_social ul li a i
{
	font-size: 12px;
	color: rgba(0,0,0,0.4);
	padding: 6px;
	-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_social ul li a i:hover
{
	color: #ff6600;
}

/*********************************
5. Home
*********************************/
.imgleft{
	float: left;
	width: 50%;
	margin-right: 5px;
}
h3.dataleft{
	float: left;

}
.team{
	float: left;
	margin-right:10px;

}
div.top1 span{
	/*font-size: 20px; */
	color: #ffffff;
/*	font-weight: bold; */


}
.onetop{
padding-top:60px;
}
.onehome{
	
	margin-top:150px;
	/* background-color:#795548;  */

/*	background-color:#ebf1f5; */
/*	background-size: cover;

	background-repeat: no-repeat;
    background-position: bottom; */
}
.onehome img{
	margin-top:10px;
	background-repeat: no-repeat;
    padding-bottom:0px;
    width:100%;
    /* border-radius:15px; */
}
.fourbox
{
	width: 100%;
	height: 100%;
	background-color:#ebf1f5;
}

div.boxtxt1 .cardimg{
	float:left;
	
	padding-top:5%;
	padding-left:1px;
	padding-bottom:5%;
}
div.boxtxt1 .cardbody{
	display:block;
	vertical-align:middle;
	padding-top:10%;
	padding-right:10%;
	font-size:10px;
}

div.boxtxt1211 img{
padding-right:15px;
padding-top:15px;
float:left;
}
div.boxtxt5 {
	background-color: red;



}
div.boxtxt5:hover {
	background-color: red;



}
div.boxtxt1 {
   align-items:center;
    height: 220px;
	border:10px #ebf1f5 solid;
	padding-top:30px;
	background-image: url(../images/hongkong.jpg);
	background-repeat: no-repeat;
	background-size: cover;

	
}
div.boxtxt1 p{
	position: relative;
	width: 100%;
	background-color: rgba(89, 76, 60, 0.33);
	top: 40%;
	border-bottom: 4px solid #ffffff;
	border-top: 4px solid #ffffff;


    color: #ffffff;
	font-size:22px;
	
}
div.boxtxt1 span{
  position: absolute;
	width: 65%;
	background-color: #1b1e21;
	top: 65%;
	border-top: 4px solid #594c3c;
	left: 0px;


    color: #ffffff;
	font-size:22px;
}
div.boxtxt2  img{
float:right;

}
div.boxtxt3 {
  align-items:center;
    height: 220px;
	border:10px #610d1d solid;
	padding-top:30px;
	background-image: url(../images/china.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position:right;

}
div.boxtxt3 span{
    position: absolute;
	width: 65%;
	background-color: #1b1e21;
	
	border-top: 4px solid #e8661a;
	left: 0px;

    color: #ffffff;
	font-size:22px;
}

div.boxtxt2 {
  align-items:center;
    height: 220px;
	border:10px #0d0c0a solid;
	padding-top:30px;
	background-image: url(../images/earth.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position:center;
}
div.boxtxt2 span{

      position: absolute;
	width: 65%;
	background-color: #1b1e21;
	top: 65%;
	border-top: 4px solid #151513;
	left: 0px;


    color: #ffffff;
	font-size:22px;
}
div#bc {
    background: #0c5460;
    /* opacity: 0.5; */
    transition: 0.5s;
    height: 200px;
}
div.boxtxt4 {
  align-items:center;
    height: 220px;
	border:10px #ebf1f5 solid;
	padding-top:30px;
	background-image: url(../images/find.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position:center;
	cursor:pointer;

}
div.boxtxt4 span{
      position: absolute;
	width: 65%;
	background-color: #1b1e21;
	top: 65%;
	border-top: 4px solid #155724;
	left: 0px;


    color: #ffffff;
	font-size:22px;
}

#fourli li {
    float: left;
    padding: 1px 5px 1px 1px;
        color: #525252;
    font-size: 13px;
    font-weight: bold;
    list-style-position: inside;
  /*  list-style-image: url(../images/ticks.png); */
}

.hovereffect {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
  background: #791225;
}
.hovereffect1 {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
  background:#03a9f4;
/*    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
   border-bottom: 1px solid #ff9800;  9/11/2023 */
}
.hovereffect1 .overlay1 {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
/*   padding: 20px 20px; */
  cursor:pointer;
}

.hovereffect0407 {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
  background:#03a9f4;
/*    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
   border-bottom: 1px solid #ff9800;  9/11/2023 */
}

.hovereffect0407 .overlay0407 {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
/*   padding: 20px 20px; */
  cursor:pointer;
}


.hovereffect .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  padding: 120px 20px;
  cursor:pointer;
}


.hovereffect img {
  display: block;
  position: relative;
  width: 100%;
  height: 220px;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.hovereffect0407 img {
  display: block;
  position: relative;
  width: 50%;
  height: 100%;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  padding-top:30px;
}
.hovereffect0407:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}


.hovereffect1 img {
  display: block;
  position: relative;
  width: 50%;
  height: 100%;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.hovereffect1:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.hovereffect:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.hovereffect h2 {
  text-transform: uppercase;
  color: #fff;
  text-align: center;
  position: relative;
  font-size: 17px;
  overflow: hidden;
  padding: 0.5em 0;
  background-color: #1b1e21;
}
.hovereffect1 h2 {
  text-align: right;
  position: relative;
  font-size: 25px;
  overflow: hidden;
  padding: 5px 10px;
/*  background-color:rgba(53, 156, 220, 0.2); */
  border-right:15px solid #FF9800; 
 
   
}

.hovereffect0407 h2 {
  text-align: right;
  position: relative;
  font-size: 18px;
  overflow: hidden;
  padding: 5px 0px;
  background-color:#FF9800;
/*  border-right:5px solid #FF9800;  */
 
   
}


.overlay1 h2 {
 	   text-decoration: blue; 
}

.hovereffect h2:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #fff;
  content: '';
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
  -webkit-transform: translate3d(-100%,0,0);
  transform: translate3d(-100%,0,0);
}

.hovereffect:hover h2:after {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.hovereffect a, .hovereffect p {
  color: #FFF;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(100%,0,0);
  transform: translate3d(100%,0,0);
}

.hovereffect:hover a, .hovereffect:hover p {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}





#bannerhome{
	background-image:url(../images/hands-001.jpg);
	background-repeat:no-repeat;
	background-size:cover; 
	min-height:300px;
	
	
	}
	.text-block {
  position: absolute;
  bottom: 20px;
  right: 20px;
  background-color: #c5dfe9;
  color: white;
  padding-left: 20px;
  padding-right: 20px;
}


	
	
 .headtitle1 {
width: 94%;
    margin: auto;
    text-align: center;
    position: relative;
    top: 15%;
    color: #ffffff;
    border: 5px solid #ebf1f5;
    background-color: #ffffff36;
    min-height: 200px;
}





/*********************************
 mainjoin
*********************************/

.mainjoin
{
	width: 100%;
	padding-top: 5px;
	padding-bottom: 1px;
	text-align:  left;
}
.mainjoin img#sp{
	padding: 5px 0px 5px 20px;	

}
.join_button
{
	position: absolute;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
}


.mainjoin ul{
	/* padding:0 0 0px 15px;*/
}
.mainjoin ul li{
	
	/* text-align: left;
 	color:rgb(1,32,97);
    font-size: 14.4px;  */
	background-color:#d2eaf1;
	padding-left:15px;


}

.mainjoin span{
	font-size: 14px;
	padding-left:5px;

}
.mainjoin #title1, p{
	font-size:18px;
	padding: 3px 0px 3px 5px;
	
	text-align:left;

}
.mainjoin #titlename, p{
	font-size:18px;
	color:#111;
	padding:5px 20px;

}
.mainjoin #title2, p{
	font-size:13px;
	line-height:120%;
	text-align: justify;
	
	color:#525252;
	padding:0px 1px;

}

.mainjoin p{
	font-size:14.4px;
	color:#000;

}
.mainjoin .text1{
	font-size: 15px;
	text-align: left;

}


.mainjoin h1.gh1{
	background:#d2eaf1;
	padding-left: 20px;
    border-bottom: 2px solid #ff9800;
	font-size: 32px;
}

.mainjoin h1.gh0407{
	background:#d2eaf1;
	padding-left: 20px;
    border-bottom: 2px solid #ff9800;
	font-size: 28px;
}

.mainjoin p.gh0407{
    color: #791225;
    line-height: 120%;
    letter-spacing:10px;
    border-bottom: 1px solid #791225;
    font-size: 20px;



}



.mainjoin h3.gh3{
    color: #44425a;
    line-height: 120%;
    padding-bottom: 18px;
    letter-spacing:1px;
    font-weight:bold;


}

.mainjoin h4.gh4{
    color: rgb(1,32,97);
    line-height: 150%;
    text-align:justify;
	font-size:16px;
	padding: 0px 25px;


}
.mainjoin strong.title {
	text-align: left;
    font-size: 16px;
    color: #44425a;
    display: block;
    padding-bottom: 10px;
    letter-spacing:2px;
}
.mainjoin p.text1 {
	line-height:140%;
	    letter-spacing:2px;

}

/*********************************
7. Courses
*********************************/

.courses
{
	width: 100%;
	background: #FFFFFF;
	padding-top: 88px;
	padding-bottom: 99px;
}
.course_search
{
	padding-left: 68px;
	padding-right: 68px;
	margin-top: 72px;
}
.course_search_form
{
	width: 100%;
}
.course_button
{
	position: relative;
	width: 224px;
	height: 50px;
	border: none;
	outline: none;
	cursor: pointer;
	background: #ff8a00;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.course_button .button_arrow
{
	width: 47px;
	background: #ff6600;
}
.course_button span:first-child
{
	width: 100%;
	height: 100%;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: 600;
	padding-right: 44px;
	line-height: 50px;
	text-transform: uppercase;
}
.course_button:hover
{
	background: #ffae00;
}
.course_button:hover .button_arrow
{
	background: #ff8a00;
}
.course_search_form > div
{
	width: calc((100% - 284px) / 2);
}
.course_input
{
	position: relative;
	width: 100%;
	height: 50px;
	border: none;
	outline: none;
	background: #f2f1f8;
	padding-left: 22px;
}
.course_search_form > div::after
{
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 3px;
	background: #ff6600;
	content: '';
	visibility: hidden;
	opacity: 0;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.course_search_form > div:hover::after
{
	visibility: visible;
	opacity: 1;
}
.course_input::-webkit-input-placeholder
{
	font-size: 12px !important;
	font-weight: 400 !important;
	font-style: italic;
	color: #6c6a74 !important;
}
.course_input:-moz-placeholder
{
	font-size: 12px !important;
	font-weight: 400 !important;
	font-style: italic;
	color: #6c6a74 !important;
}
.course_input::-moz-placeholder
{
	font-size: 12px !important;
	font-weight: 400 !important;
	font-style: italic;
	color: #6c6a74 !important;
} 
.course_input:-ms-input-placeholder
{ 
	font-size: 12px !important;
	font-weight: 400 !important;
	font-style: italic;
	color: #6c6a74 !important;
}
.course_input::input-placeholder
{
	font-size: 12px !important;
	font-weight: 400 !important;
	font-style: italic;
	color: #6c6a74 !important;
}
.courses_slider_container
{
	width: 100%;
	margin-top: 83px;
}
.course_body
{
	width: 100%;
	padding-left: 34px;
	padding-right: 32px;
	padding-top: 56px;
	padding-bottom: 51px;
	background: #f2f1f8;
}
.course_tag
{
	height: 31px;
	background: #ff6600;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
	margin-left: 2px;
}
.course_tag:hover
{
	background: #2c2b31;
}
.course_tag a
{
	display: block;
	padding-left: 19px;
	padding-right: 19px;
	line-height: 31px;
	font-size: 14px;
	color: #FFFFFF;
	font-weight: 400;
}
.course_price span
{
	display: inline-block;
	position: relative;
	font-size: 18px;
	color: #ff6600;
	-webkit-transform: translateY(2px);
	-moz-transform: translateY(2px);
	-ms-transform: translateY(2px);
	-o-transform: translateY(2px);
	transform: translateY(2px);
}
.course_title
{
	margin-top: 29px;
}
.course_title h3 a
{
	font-size: 22px;
	color: #2c2b31;
	font-weight: 600;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.course_title h3 a:hover
{
	color: #ff6600;
}
.course_text
{
	margin-top: 18px;
	line-height: 1.928;
}
.course_footer
{
	margin-top: 33px;
}
.course_author_image
{
	width: 37px;
	height: 37px;
	overflow: hidden;
	border-radius: 50%;
}
.course_author_image img
{
	max-width: 100%;
}
.course_author_name
{
	margin-left: 16px;
}
.course_author_name,
.course_author_name a
{
	font-size: 14px;
	color: #2c2b31;
	font-weight: 500;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.course_author_name a:hover
{
	color: #ff6600;
}
.courses_slider_nav
{
	position: absolute;
	top: 50%;
	width: 51px;
	height: 51px;
	background: #ff8a00;
	text-align: center;
	cursor: pointer;
}
.courses_slider_nav:hover
{
	background: #ff6600;
}
.courses_slider_nav i
{
	font-size: 18px;
	line-height: 51px;
	color: #FFFFFF;
}
.courses_slider_prev
{
	left: -161px;
}
.courses_slider_next
{
	right: -161px;
}

/*********************************
8. Milestones
*********************************/

.milestones
{
	width: 100%;
	padding-top: 156px;
	padding-bottom: 161px;
}
.milestones_container
{
	margin-top: 0px;
}
.milestone
{
	width: 100%;
}
.milestone_icon
{
	display: inline-block;
	height: 81px;
	width: 81px;
}
.milestone_icon img
{
	max-width: 100%;
}
.milestone_counter
{
	font-size: 48px;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 0.75;
	margin-top: 37px;
}
.milestone_text
{
	font-size: 18px;
	font-weight: 500;
	color: #FFFFFF;
	margin-top: 21px;
	line-height: 0.75;
}

/*********************************
9. Why Choose Us - Accordions
*********************************/

.grouped_sections
{
	width: 100%;
	background: #FFFFFF;
	padding-top: 89px;
	padding-bottom: 100px;
}
.grouped_title
{
	font-size: 30px;
	font-weight: 600;
	color: #44425a;
}
.accordions
{
	margin-top: 58px;
}
.accordion_container:not(:last-child)
{
	margin-bottom: 14px;
}
.accordion
{
	height: 50px;
	width: 100%;
	background: #f2f1f8;
	padding-left: 24px;
	cursor: pointer;
	color: #44425a;
	font-size: 16px;
	font-weight: 600;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.accordion div
{
	max-width: 90%;
	overflow: hidden;
	white-space: nowrap;
}
.accordion:active
{
	background: #fffbfa !important;
}
.accordion::after
{
	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(-50%);
	right: 12px;
	width: 23px;
	height: 23px;
	background: #ff6600;
	content: '+';
	font-size: 16px;
	color: #FFFFFF;
	font-weight: 600;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.accordion.active::after
{
	content: '-';
}
.accordion:hover::after
{
	color: #FFFFFF;
}
.accordion:hover
{
	background: #e9e8ef;
}
.accordion_panel
{
	padding-right: 8px;
	max-height: 0px;
	overflow: hidden;
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.accordion_panel > div
{
	padding-bottom: 11px;
}
.accordion_panel p
{
	padding-top: 33px;
	color: #6c6a74;
	line-height: 2.2;
}

/*********************************
10. Events
*********************************/

.events
{
	width: 100%;
	margin-top: 58px;
}
.event
{
	width: 100%;
}
.event:not(:last-child)
{
	margin-bottom: 20px;
}
.event_date
{
	width: 63px;
	height: 63px;
	background: #ff6600;
}
.event_day
{
	font-size: 26px;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 0.75;
}
.event_month
{
	font-size: 10px;
	font-weight: 400;
	color: #FFFFFF;
	line-height: 0.75;
	margin-top: 10px;
}
.event_title a
{
	font-size: 16px;
	font-weight: 600;
	color: #44425a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.event_body
{
	padding-left: 34px;
	-webkit-transform: translateY(-5px);
	-moz-transform: translateY(-5px);
	-ms-transform: translateY(-5px);
	-o-transform: translateY(-5px);
	transform: translateY(-5px);
}
.event_title a:hover
{
	color: #ff6600;
}
.event_subtitle
{
	font-size: 14px;
	font-weight: 500;
	color: #6c6a74;
	margin-top: 5px;
}

/*********************************
11. News
*********************************/

.news
{
	width: 100%;
	margin-top: 58px;
}
.news_post
{
	width: 100%;
}
.news_post:not(:last-child)
{
	margin-bottom: 39px;
}
.news_post_image
{
	width: 72px;
	height: 72px;
}
.news_post_image img
{
	max-width: 100%;
}
.news_post_body
{
	padding-left: 25px;
}
.news_post_date
{
	font-size: 12px;
	font-weight: 600;
	color: #ff5c00;
	line-height: 0.75;
}
.news_post_title
{
	margin-top: 10px;
}
.news_post_title a
{
	font-size: 16px;
	font-weight: 600;
	color: #44425a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.news_post_title a:hover
{
	color: #ff6600;
}
.news_post_author
{
	margin-top: 5px;
}
.news_post_author,
.news_post_author a
{
	font-size: 14px;
	font-weight: 500;
	color: #6c6a74;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.news_post_author a:hover
{
	color: #ff6600;
}

/*********************************
12. Video
*********************************/

.video
{
	width: 100%;
	background: #FFFFFF;
}
.video_container_outer
{
	width: 100%;
	height: 507px;
}
.video_content
{
	margin-top: calc(-1 * (750px / 1.875) / 2);
}
.video_container
{
	width: 100%;
	height: 100%;
	background: red;
	box-shadow: 0px 5px 15px rgba(0,0,0,0.05);
}
.video-js
{
	width: 100% !important;
	height: 100% !important;
	overflow: hidden;
}
.video-js > div
{
	width: 100%;
	height: 100%;
}
.video-js .vjs-tech
{
	height: 100% !important;
}
.vjs-big-play-button
{
	z-index: 9;
	outline: none;
}
.vjs-big-play-button:focus
{
	outline: none;
}
.vjs-big-play-button:hover
{
	-webkit-transform: translate(-50%, -50%) scale(1.05);
	-moz-transform: translate(-50%, -50%) scale(1.05);
	-ms-transform: translate(-50%, -50%) scale(1.05);
	-o-transform: translate(-50%, -50%) scale(1.05);
	transform: translate(-50%, -50%) scale(1.05);
}
.vjs-loading-spinner
{
	display: none !important;
}
.video-js .vjs-control-bar
{
	opacity: 0 !important;
}
.vjs-has-started:hover .vjs-control-bar
{
	opacity: 1 !important;
}


/*********************************
14. Footer
*********************************/

.footer
{
	width: 100%;
/*	background: #eaf0f4; */
	padding-top: 1px;
	padding-bottom: 1px;
}
.footer .logo_container
{
	position: absolute;
	top: -10px;
	left: 0;
}
.footer_about_text
{
	padding-top: 49px;
}
.footer_social
{
	margin-top: 22px;
}
.footer_social ul li
{
	display: inline-block;
}
.footer_social ul li:not(:last-child)
{
	margin-right: 24px;
}
.footer_social ul li a i
{
	font-size: 16px;
	color: #ff6600;
	-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_social ul li a i:hover
{
	color: #ffae00;
}
.copyright
{
	font-size: 12px;
	font-weight: 500;
	color: #b3b3b3;
	margin-top: 70px;
}


.ft1{
    font-weight: bold;
    background: rgba(0, 129, 169, 0.16);
    clear: both;
    padding: 2px 35px 2px 10px;
    color: #111;
   	font-size: 20px;
	letter-spacing: 5px;
	border-bottom:2px solid #ff9800;
	text-align:left;
}

.footer_title
{
	font-size: 22px;
	font-weight: bold;
	color: #f2f1f8;
	 
    padding: 0px 10px;
    /* background-color: #00adb5; */
    background: #87e0fd;
    background: -moz-linear-gradient(-45deg, #87e0fd 0%, #00adb5 31%, #00adb5 31%, #002050 100%);
    background: -webkit-linear-gradient(-45deg, #87e0fd 0%,#00adb5 31%,#00adb5 31%,#002050 100%);
    background: linear-gradient(135deg, #87e0fd 0%,#00adb5 31%,#00adb5 31%,#002050 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#87e0fd', endColorstr='#222831',GradientType=1 );
    letter-spacing: 5px;
}
.footer_list
{
	margin-top: 15px;
}
.footer_list li:not(:last-child)
{
	margin-bottom: 5px;
}
.footer_list li a
{
	font-size: 14px;
	font-weight: 500;
	color: #212529;
	-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 li a:hover
{
	color: #791225;
}
.footer_contact_info
{
	padding-right: 70px;
	margin-top: 26px;
}
.footer_contact_item:not(:last-child)
{
	margin-bottom: 23px;
}
.footer_contact_title
{
	font-size: 14px;
	font-weight: 500;
	color: #d53359;
}
.footer_contact_line
{
	font-size: 14px;
	font-weight: 500;
	color: #6c6a74;
	margin-top: 3px;
}