@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
7. Page Section
8. Buttons
9. Popular
10. Footer
	10.1 Newsletter
	10.2 Footer Content
	10.3 Footer Copyright

@import url('https://fonts.googleapis.com/css?family=El+Messiri:700&subset=arabic');
******************************/

/***********
1. Fonts
***********/
@import url('https://fonts.googleapis.com/css?family=El+Messiri|Tajawal&subset=arabic');

/*********************************
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: 'El Messiri', sans-serif;
	font-size: 14px;
	font-weight: 400;
	background: #FFFFFF;
	color: #a5a5a5;
}
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: 'Tajawal', sans-serif;
	font-size: 14px;
	line-height: 2.29;
	font-weight: 400;
	color: #a5a5a5;
	-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 #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;
}
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: #FF6347;
}
p a:hover
{
	color: #FFFFFF;
	background: #ffa07f;
}
p a:hover::after
{
	opacity: 0.2;
}
::selection
{
	background: #FFD266;
	color: #C88E00;
}
p::selection
{
	background: #FFD266;
	color: #C88E00;
}
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: 'El Messiri', 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: #db5246;
}
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: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 1318px;
	height: 104px;
	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;
}
.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;
}

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

.logo_container
{
	display: inline-block;
	padding-left: 76px;
}
.logo span
{
	font-family: 'El Messiri', 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-right: auto;
	padding-left: 43px;
	white-space:nowrap;
}
.main_nav
{
	margin-top: 7px;
}
.main_nav_item
{
	display: inline-block;
	margin-left: 15px;
}
.main_nav_item:last-child
{
	margin-left: 0px;
}
.main_nav_item a
{
	font-family: 'El Messiri', sans-serif;
	font-size: 15px;
	text-transform: uppercase;
	font-weight: 700;
	color: #003;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.main_nav_item a:hover
{
	color: #4F7FA5;
}




.main_nav_list li ul { display: none; padding-top:38px; text-align:right;}

.main_nav_list ul li a {
  display: block;
  padding: 0.5em;
  text-decoration: none;
  white-space: nowrap;
  color: #2c3e50;
}

.main_nav_list ul li a:hover { background: #003; }
.main_nav_list li:hover > ul {
  display: block;
  position: absolute;
  background: #fff;
}

.main_nav_list li:hover li { float: none; }

.nav_item:hover a { background: #4F7FA5; }

.nav_item:hover li a:hover { background: #4F7FA5; }

.main_nav_list li ul li { border-top: 0; }
.main_nav_list ul ul ul {
  right: 100%;
  top: 0;
}
.main_nav_list ul:before,
.main_nav_list ul:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.main_nav_list ul:after { clear: both; }



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

.header_side
{
	
	height: 100%;
	background: #003;
	padding:20px;
}
.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;
}


.spec
{
	width: 60px;
	height: 100%;
	background: #fff;
	font-size:16px;
	padding:15px;
}
.spec table tr td{
	padding:2px;
}
.spec table tr td img
{
	width: 25px;
	height: 25px;
}
.spec span
{
	display: block;
	position: relative;
	font-size: 8px;
	font-weight: 100;
	color: #000;
	padding-left: 2px;
}


/*********************************
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;
	cursor: pointer;background-image:url('../images/grid.svg');
	background-repeat: no-repeat;
	background-position: center;
}
.hamburger_container i
{
	font-size: 24px;
	padding: 10px;
	color: #3a3a3a;
}
.hamburger_container:hover i
{
	color: #4F7FA5;
}

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

.menu_container
{
	position: fixed;
	top: 0;
	right: -50vw;
	width: 50vw;
	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;
	text-align:right;
}
.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: 'El Messiri', sans-serif;
	font-size: 30px;
	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: #4F7FA5;
}
/*kareem*/
.sub_menu_item
{
	margin-bottom: 9px;
	margin-right:25px;
}
.sub_menu_item a
{
	font-family: 'El Messiri', sans-serif;
	font-size: 22px;
	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;
}
.sub_menu_item a:hover
{
	color: #4F7FA5;
}
/*kareem*/
.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: #4F7FA5;
}


/*********************************
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: #4F7FA5;
}
.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: 447px;
}
.home_background_container
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.home_background
{
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.home_content
{
	position: absolute;
	left: 50%;
	bottom: 159px;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	padding-top: 24px;
	padding-bottom: 18px;
	padding-left: 39px;
	padding-right: 42px;
}
.home_content h1
{
	font-size: 72px;
	font-weight: 400;
	color: #FFFFFF;
	line-height: 0.5;
}

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



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

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

}
.section_title h1
{
	display: block;
	color: #4F7FA5;
	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: #4F7FA5;
}

/*********************************
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;
}
.course_box
{
	margin-bottom: 108px;
}
.course_box:nth-last-child(-n+3)
{
	margin-bottom: 0px;
}
.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: 25px;
}
.card-title a
{
	font-size: 18px;
	font-weight: 500;
	color: #003;
	line-height: 1.2;
}
.card-title a:hover
{
	color: #4F7FA5;
}
.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: #4F7FA5;
	margin-left: auto;
}
.course_price span
{
	color: #FFFFFF;
	font-size: 18px;
	font-weight: 500;
	margin-top: 7px;
}

/*********************************
10. Footer
*********************************/

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

/*********************************
10.1 Newsletter
*********************************/

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

/*********************************
10.2 Footer Content
*********************************/

.footer_content 
{
	padding-top: 80px;
	padding-bottom: 83px;
	border-bottom: solid 2px #4F7FA5;
}
.footer_content .logo_container
{
	padding-right: 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;
	text-align:right;
}
.footer_column_content
{
	margin-top: 32px;
	text-align:right;
}
.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: #4F7FA5;
}
.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%;
}

/*********************************
10.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: #4F7FA5;
}
.footer_social .menu_social_item:last-child
{
	margin-right: 0px;
}


/****************************************
kareem about us
*****************************************/
.containerr {
    position:relative;
    width:100%;
    height:100%;
    margin:80px 14% 0;
}
.containerr .box {
    position:relative;
    width:calc(300px - 60px);
    height:calc(300px - 30px);
    background:#4F7FA5;
    float:left;
    margin:15px;
    box-sizing:border-box;
    overflow:hidden;
    box-shadow:0 5px 10px rgba(0,0,0,.8);
	margin-bottom:80px;
}
.containerr .box:before {
    content:'';
    position:absolute;
    top:10px;
    left:10px;
    right:10px;
    bottom:10px;
    border-top:1px solid #fff;
    border-bottom:1px solid #fff;
    box-sizing:border-box;
    transition:0.5s;
    transform: scaleX(0);
    opacity:0;
}
.containerr .box:hover:before {
    transform:scaleX(1);
    opacity:1;
}
.containerr .box:after {
    content:'';
    position:absolute;
    top:10px;
    left:10px;
    right:10px;
    bottom:10px;
    border-left:1px solid #fff;
    border-right:1px solid #fff;
    box-sizing:border-box;
    transition:0.5s;
    transform: scaleY(0);
    opacity:0;
}
.containerr .box:hover:after {
    transform:scaleY(1);
    opacity:1;
}
.containerr .box .imgBox {
    position:relative;
}
.containerr .box .imgBox img {
    width:100%;
    transition:0.5s;
}
.containerr .box:hover .imgBox img {
    opacity:.2;
    transform:scale(1.2);
}
.containerr .box .imgBox H1 {
	text-align:center;
	padding-top:50%;
    width:100%;
    transition:0.5s;
	color:#fff;
}
.containerr .box:hover .imgBox h1 {
    opacity:.2;
    transform:scale(1.2);
}

.containerr .box .content {
    position:absolute;
    width:90%;
    top:50%;
    transform:translateY(-50%);
    z-index:2;
    padding:20px;
    box-sizing:border-box;
    text-align:center;
}
.containerr .box .content h2 {
    margin: 0 0 10px;
    padding:0;
    color:#fff;
    transition:0.5s;
    transform:translateY(-50px);
    opacity:0;
    visibility:hidden;
}
.containerr .box .content p,.containerr .box .content ul {
    margin:0;
    padding:0;
    color:#fff;
	line-height: 1.8;
    transform:translateY(50px);
    opacity:0;
    visibility:hidden;
}
.containerr .box:hover .content h2,.containerr .box:hover .content ul,
.containerr .box:hover .content P {
    opacity:1;
    visibility:visible;
    transform:translateY(0px);
}




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

.register
{
	width: 100%;
}
.register_section
{
	width: 100%;
	background: #4F7FA5;
	padding-top: 50px;
	padding-bottom: 50px;
}
.register_content
{
	width: 1000px;
}
.register_title
{
	color: #FFFFFF;
	margin-bottom: 16px;
	line-height: 1.63;
	text-align:left;
}
.kareemul {
    list-style-type: disc !important;
    padding-left:1em !important;
    margin-left:1em;
	text-align:left;
}
.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;
	text-align:left;
}
.register_button
{
	background: #4F7FA5;
	margin-top: 65px;
}
.register_button a
{
	color: #FFFFFF;
}

/*********************************
9. Contact
*********************************/

.contact
{
	padding-top: 106px;
	padding-bottom: 117px;
}
.contact_title
{
	font-size: 36px;
	font-weight: 500;
	color: #4F7FA5;
}
.contact_form_container
{
	margin-top: 70px;
}
.input_field
{
	width: 100%;
	background: #f8f4f4;
	border: solid 2px transparent;
	margin-bottom: 24px;
	height: 42px;
	padding-left: 33px;
}
.input_field:focus
{
	outline: none !important;
	border-color: #4F7FA5;
}
.text_field
{
	width: 100%;
	height: 189px;
	background: #f8f4f4;
	border: solid 2px transparent;
	padding-left: 33px;
	margin-bottom: 24px;
}
.text_field:focus
{
	outline: none !important;
	border-color: #4F7FA5;
}
.contact_send_btn
{
	width: 100%;
	height: 48px;
	background: #4F7FA5;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	color: #FFFFFF;
	cursor: pointer;
	border: none;
}
.contact_send_btn:focus
{
	outline: solid 1px #4F7FA5;
	border: green !important;
}
/*********************************
10. About
*********************************/

.about_title
{
	font-size: 36px;
	font-weight: 500;
	color: #4F7FA5;
}
.about_text
{
	margin-top: 20px;
	color: #4F7FA5;
}
.contact_info
{
	margin-top: 64px;
	padding-left: 26px;
}
.contact_info_item
{
	font-size: 14px;
	font-weight: 400;
	color: #4F7FA5;
	margin-bottom: 22px;
}
.contact_info_item:last-child
{
	margin-bottom: 0px;
}
.contact_info_icon
{
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	margin-right: 10px;
}
.contact_info_icon img
{
	width: 100%;
}

/*********************************
11. Google Map
*********************************/

#google_map
{
	width: 100%;
	height: 532px;
	margin-top: 27px;
}
.map_container
{
	width: 100%;
	height: 100%;
	overflow: hidden;
}
#map
{
	width: 100%;
	height: calc(100% + 30px);
}

/*********************************
8.3 Accordions
*********************************/

.elements_accordions
{
	
}
.accordion_container
{
	margin-bottom: 15px;
}
.accordion
{
	height: 30px;
	width: 100%;
	background: #f8f4f4;
	padding-left: 30px;
	cursor: pointer;
	-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
{
	background: #4F7FA5;
	color: #FFFFFF;
}
.accordion:active
{
	background: #4F7FA5 !important;
	color: #FFFFFF;
}
.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: 0;
	left: 0;
	width: 31px;
	height: 100%;
	content: '+';
	background: #4F7FA5;
	font-size: 14px;
	color: #FFFFFF;
	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;
}
.accordion.active::after
{
	content: '-';
}
.accordion:hover
{
	background: #e4e4e4;
}
.accordion_panel
{
	padding-left: 30px;
	padding-right: 30px;
	max-height: 0;
	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 p
{
	padding-top: 15px;
}




/* new search */
.bs-example{
	font-family: sans-serif;
	position: relative;
	margin: 50px;
}
.typeahead, .tt-query, .tt-hint {
	border: 2px solid #CCCCCC;
	border-radius: 8px;
	font-size: 24px;
	height: 40px;
	line-height: 30px;
	outline: medium none;
	padding: 8px 12px;
	width: 600px;
	text-align:right;
}
.typeahead {
	background-color: #FFFFFF;
	border: 3px solid #0097CF;
}
.typeahead:focus {
	border: 3px solid #0097CF;
}
.tt-query {
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
}
.tt-hint {
	color: #999999;
}
.tt-dropdown-menu {
	background-color: #FFFFFF;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 8px;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	margin: 0;
	padding: 0;
	width: 600px;
}
.tt-suggestion {
	font-size: 8px;
	line-height: 8px;
	padding: 0px 20px;
	text-align:right;
}
.tt-suggestion.tt-is-under-cursor {
	background-color: #4F7FA5;
	color: #FFFFFF;
}
.tt-suggestion p {
	margin: 0;
}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  left: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #4F7FA5;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#myBtn:hover {
  background-color: #003;
}