@font-face {
    font-family: openSans;
    src: url(../fonts/OpenSans-Light.ttf);
}

@font-face {
    font-family: openSansIe;
    src: url(../fonts/OpenSans-Light.eot);
}

body{
	font-family: openSans, openSansIe !important;
	overflow-x: hidden;
}

h2{
	font-size: 26px !important;
	font-weight: 900 !important;
}

/*p{line-height: 1.3}*/

a:hover{
	text-decoration: none !important;
}

.container-fluid{
	padding: 0 !important;
}

.navbar-toggle .icon-bar{
	background-color: #191d3d;
}
/**************************/
/*** MAIN NAV ***/
/*************************/
#top-nav{
	background: #191d3d;
	padding: 5px 0;
}

#main-logo {
	height: 50px;
	width: 100px;
	margin-left: 20%;
	margin-top: 10px;
	display: inline-block;
}

#top-right-nav{
	margin-top: -15px;
	margin-right: 22%;
    display: inline-block;
    float: right;
}
#top-right-nav ul li{text-align: center;}
#top-right-nav a,
#top-right-nav span{text-transform: uppercase;}
.language img{
	display: block;
	margin:0 auto;
	margin-bottom: 3px;
}


#top-right-nav a:focus{text-decoration: none;}

#top-nav ul{
	list-style: none;
	display: inline-block;
	padding: 0;
	margin-top: 30px;
}

#top-nav ul li{
	display: inline-block;
	position: relative;
	border-left: 1px solid rgba(255, 255, 255, 0.5);
}

#top-nav ul li:first-child{border-left: none;}

#top-nav ul li:nth-child(2){
	border-left: none;
	border-right: none;
}

#top-nav ul li i{
	display: block;
	text-align: center;
	opacity: 0.5;
	font-size: 14px;
}

/*.logged-icon{left: px !important;}*/

#top-nav ul li img{
	/*position: absolute;*/
    bottom: 25px;
    left: 25px;
    height: 14px;
    width: 21px;
}

.language-dropdown img{
	position: absolute;
    bottom: 25px;
    left: 25px;
    height: 14px;
    width: 21px;
}

#top-nav ul li a{
	color: white;
	margin: 5px 10px;
	font-size: 11px;
	display: block;
}
#top-nav ul li a:hover{
	cursor: pointer;
}

.language-dropdown{
	display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 9999;
    text-align: center;
}

.language-dropdown p {
	position: relative;
    color: black !important;
    padding: 10px;
    text-decoration: none;
    display: block;
    margin-bottom: 0;
}

.language-dropdown p img{
	display: block;
	margin-bottom: -11px;
	margin-left: -10px
}

.language-dropdown p:hover {background-color: #f1f1f1; cursor: pointer;}

#search{background-color: #fff;}
.search-dropdown{
	left: -145px;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 200px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 9999;
    display: none;
}

.search-dropdown input{
	border: none;
	padding-left: 10px;
	display: inline-block;
	height: 45px;
	width: 80%;
}

@-moz-document url-prefix() { 
  .search-dropdown input{
		width: 80%;
	}
}

.search-dropdown input:focus{
	outline: none;
}

.search-dropdown button{
	border: none;
	background-color: transparent;
	display: inline-block;
}

.search-dropdown button:focus{
	outline: none;
}

.search-dropdown button i{
	top: 14px;
	color: #191d3d;
	position: absolute;
	right: 10px;
	font-size: 16px;
}

.navbar{
	background-color: white;
	margin-bottom: 0 !important;
	bottom: -5px;
	width: 100%;
}

#nav-search-form{
	display: none;
	width: 82%;
	padding-top: 14px;
	text-align: right;
}


#nav-search-form input{
	border: none;
	text-align: right;
}

#nav-search-form input:focus{
	outline: none;
}

#nav-search-form button{
	border: none;
	background-color: white;
	float: right;
}

#nav-search-form button:focus{
	outline: none;
}

#nav-search-form button i{
	font-size: 16px;	
}

#navbar ul{
	margin-left: 19.5%;
}

#navbar ul li{
	margin-right: 70px;
}

#navbar ul li:last-child{
	margin-right: 0;
}

#navbar ul li a{
	color: #191d3d;
	font-size: 18px;
	transition: 0.2;
	font-weight: 800;
	border-bottom: 4px solid transparent;
	padding-left: 0;
	padding-right: 0;
}

#navbar ul li a:hover{
	text-decoration: none;
    background-color: transparent !important;
	border-bottom: 4px solid #7588af;
	z-index: 1;
}

#navbar .nav img,
#navbar .nav .fa{
	margin-right: 2px;
}

@media screen and (max-width: 480px) {
	#navbar .nav img{
		display: block;
		margin:0 auto;
		width: 30px;
		height: 20px;
	}
}

.top-nav .dropdown-menu{
	padding-top: 5px !important;
}

.top-nav{
	display: none !important;
}

.navbar hr{
	position: relative;
	top:-5px;
	margin: 0;
	height: 5px;
	background-color: #d7d7d7;
}


@media screen and (max-width: 1200px) {
	   #navbar ul li{margin-right: 35px;}
}
@media screen and (max-width: 940px) {#navbar ul li{margin-right: 30px;}}
@media screen and (max-width: 900px) {#navbar ul li{margin-right: 20px;}}
@media screen and (max-width: 825px) and (min-width: 769px) {#navbar .nav{margin-left: 12.5%;}}
@media screen and (max-width: 767px) {
    #top-right-nav{
		margin-right: 10%;
	}

	#navbar ul li a:hover{
		border-color: #fff;
	}

	 #navbar ul{
	 	margin:0;
	 	padding-bottom: 20px;
	 	text-align:center;
	 }

	 .top-nav .dropdown-menu{
		padding-bottom:0 !important;
	}

	 #navbar ul li{
	 	margin: 0;
	 }
}

@media screen and (max-width: 480px) {
	#main-logo{
		margin:0 auto;
		margin-bottom: 15px;
		margin-top: 10px;
		display: block;
	}
    #top-right-nav{display: none;}
	#nav-search-form{display: inline-block;}
	#nav-search-form input{width: 89%;}
	.top-nav{display: block !important;}
}



/***************************************/
/*************   SLIDER   *************/
/***************************************/
.bxslider-wrap { visibility: hidden; }

.bx-wrapper{
	width: 100% !important;
	margin-bottom: 0 !important;
	margin-left: 5px !important;
}

.bx-wrapper .bx-pager{
	display: none;
}

.bx-wrapper .bx-viewport{
	border:none !important;
}

/***************************************/
/********** LAST NEWS *************/
/***************************************/
#last-news{
	background-color: #191d3d;
	color: white;
	padding-top: 40px;
	padding-bottom: 50px;
}

#last-news h3{
	margin-left: 14%;
}

#last-news-heading{
	position: relative;
}

.more-news-btn{
	color: #878897;
	text-decoration: underline;
	position: absolute;
	right: 5%;
	top: 40%;
}

.news{
	padding: 40px;
}

.news-date{
	vertical-align: top;
	text-align: center;
	border: 2px solid white;
	padding-bottom: 10px;
	margin-right: 3%;
	display: inline-block;
	width: 17%
}

.news-info{
	display: inline-block;
	width: 78%;
}

.news-day{
	font-size: 24px;
	margin-top: 10px;
	margin-bottom: 0;
}

.news-month{
	font-size: 12px;
	opacity: 0.5;
}

.posted-at{
	color: #b11652;
}

.posted-at span{
	color: #777887;
	opacity: 0.5;
}

.news-body{
	line-height: 25px;
}

.read-more {
	color: #777887;
	opacity: 0.5;
}

.read-more:hover{color: #ed145b;}

.read-more i{
	color: white;
	margin-left: 10px;
	border: 1px solid white;
	border-radius: 50%;
	-webkit-border-radius: 50%;
    -moz-border-radius: 50%;
	padding: 0 4px;
}

@media screen and (max-width: 1200px) {
	 .news-date{
		width: 20%
	}

	.news-info{
		width: 75%;
	}
}

@media screen and (max-width: 768px) {
	 .news-date{
		width: 15%
	}

	.news-info{
		width: 80%;
	}
}

/***************************************/
/********** ABOUT *************/
/***************************************/
#about{
	padding: 60px 0;
}

#about h2{
	text-align: center;
	font-weight: 600;
	margin-bottom: 80px;
}

.about-col-left,
.about-col-right{
	font-weight: normal;
}

#about p{
	color: #6d6a6a;
	font-size: 16px;
	line-height: 1.3;
}

#about hr{
	height: 2px;
	background-color: #f2f4f5;
}


/***************************************/
/********** VIDEO COURSES *************/
/***************************************/
#video-courses{
	padding-bottom: 100px;
	padding-top: 40px;
	text-align: center;
}

#video-courses h2{
	font-weight: 600;
	margin-bottom: 50px;
	text-align: left;
	margin-left: 5%;
}

.video-course{
	display: inline-block;
	width: 22%;
	position: relative;
	vertical-align: top;
}
.video-course img{
	width: 102.5%;
	height: 210px;
	margin-bottom: -1px;
}
.layer{
	position: absolute;
   top: 0;
   left: 0;
   width: 103%;
   height: 100%;
   background-color: black;
   opacity: 0.4;
}
.video-course p{
	width: 60%;
	color: white;
	position: absolute;
	bottom: 2%;
	left: 2%;
	font-weight: bold;
	text-align: left;
}

.video-course span{
	padding: 12px 8px;
    background-color: #ed145b;
    position: absolute;
    right: -4px;
    bottom: 0px;
    display: none;
}

.video-course i{
    color: white;
    border: 2px solid #fff;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    padding: 6px;
    font-size: 10px;
}

@media screen and (max-width: 768px) {
	.video-course{width: 40%;}
	#video-courses h2{margin-left: 10%}
	.video-course p{bottom: 7%;}
}
@media screen and (max-width: 480px) {
	#video-courses h2{margin-left: 0%; text-align: center;}
	.video-course{width: 80%;}
	.video-course p{width: 100%; bottom: 35%; text-align: center;}
}

/***************************************/
/* VIRTUAL GAME PAGE */
/***************************************/
#virtual-games{
	min-height: 700px;
	padding: 0 4%;
	margin-top: 50px; 
	text-align: center;
}

.game{
	text-align: center;
	display: inline-block;
	padding: 0 2%;
}

.game img{
	width: 100%;
	height: 180px;
	margin-bottom: 20px;
}

.game p{
	padding-bottom: 20px;
}

.game a{
	padding: 15px 20px;
	background-color: #ed145b;
	border-radius: 4%;
	-webkit-border-radius: 4%;
    -moz-border-radius: 4%;
	color: white;
	font-weight: 600;
}


.game a:hover,
.quiz-btn:hover{
	color: white;
	background-color: #191d3d;
}

#quiz-section{
	padding-top: 40px;
	min-height: 800px;
}

#quiz-section a{
	color: #ed145b;
}

#quiz-section a:hover{
	color: #191d3d;
}

#quiz{
	padding: 0 6%;
}

#quiz-options{
	margin-top: 30px;
}

.quiz-btn{
	background-color: #ed145b;
	color: white;
	padding: 10px 30px;
	border: none;
	border-radius: 4%;
	-webkit-border-radius: 4%;
    -moz-border-radius: 4%;
	margin-top: 20px;
	margin-bottom: 40px;
	font-weight: 600;
}
/*pagination*/
.page_navigation{margin-bottom: 10px;}
#quiz-section .page_navigation a{
	border:1px solid #D7D7D7;
	padding:4px;
	display: inline-block;
	width: 40px;
	text-align: center;
}
#quiz-section .page_navigation a:hover{
	color: #fff;
	background-color: #191D3D;
	transition: 0.2s;
}
#quiz-section .page_navigation a:focus{text-decoration: none;}

/* comments */
#comment_container{padding-left: 0;}
#comment_container img{
	border-radius: 50%;
	margin-right: 5px;
	vertical-align: top;
	height: 50px;
}
#comments{ padding-left: 0; }
#comments li{list-style: none; margin-bottom: 20px;}
#comments span{
	margin: 3px;
	font-weight: bold;
	display: inline-block;
	vertical-align: top;
}
#comments li span:last-child{
	font-weight: normal;
	width: 430px;
}
#comments li span:nth-child(3){margin: 3px 0;}
@media screen and (max-width: 768px) {
	#comment_container img{
		display: block;
		margin: 0 auto;
	}
	#comments span{text-align: center; display: block;}
	#comments li span:nth-child(3){display: none;}
	#comments li span:last-child{width: 100%;}
}



#summery-section{
	padding-top: 40px;
	padding-bottom: 70px;
}

#summery{
	padding: 0 6%;
}

#summery-section h2{
	text-align: center;
	margin-bottom: 30px;
}

#summery #share{
	margin: 15px 0;
}

#summery .jssocials-shares{
	font-size: 10px;
}
#summery .btn-lg{
	height: 20px;
    font-size: 12px;
    padding: 0 4px!important;
    border-radius: 3px;
    font-weight: bold;
    margin-bottom: 1px;
}
#summery .modal-content{
	border-radius: 2px !important;
}
#summery .modal-content textarea{
	height: 150px;
	border-radius: 2px;
}
#summery .modal-content textarea:focus{
  border:2px solid #17376e;
  box-shadow: none;
}
#summery .modal-content .modal-footer button{
	background-color: #CCCCCC !important;
	border-color:#CCCCCC;
	color: #191d3d;
	font-weight: bold;
}

#summery .modal-content .modal-footer button:hover{
	background-color: #17376E !important;
	color: #fff;
	transition: 0.2;
}

#summery-section .alert{
	text-align: center;
}

#summery-section .table{
	margin-top: 40px;
}

#game-form .form-control{
	margin-bottom: 20px;
}

#game-form .form-control:focus{
	border: 2px solid #191d3d;
}

#game-form label{
	display: block;
	font-weight: normal;
}

#game-form textarea{
	width: 540px;
	height: 150px;
}

#game-form button{
	margin-top: 25px;
	margin-bottom: 25px;
	color: #191d3d;
	font-weight: 600;
	width: 540px;
}

#game-form button:hover{
	background-color: #17376e;
	color: white;
}

@media screen and (max-width: 1200px) {
	 .game{padding: 0;}
}

@media screen and (max-width: 991px) {
	#virtual-games{height: 100%;}
	.game{margin-bottom: 60px;}
	.game img{height: 250px;}
}

@media screen and (max-width: 768px) {
	.game{
	 	margin-bottom: 80px;
	 }
	 .game img{
	 	max-width: 450px;
	 }
	 #game-form textarea,
	 #game-form button{
		width: 100%;
	}
}


/***************************************/
/* LIBRARY PAGE */
/***************************************/
#library{
	margin-top: 60px;	
}

.media{
	margin-bottom: 50px;
	padding: 0 7%;
	min-width: 300px;
	/*height: 340px;*/
}

#library .col-md-6:nth-child(2n+1){
    clear:both;
}

.media.pagination{height: auto}

.media h4{font-weight: 600;}


#library .fancybox-media img{
	width: 100%;
	height: 250px;
	margin-bottom: 20px;
}

.play-btn{
	top: 18%;
    left: 40%;
    position: absolute;
    display: none;
    height: 115px !important;
    width: 100px !important;
}


@media screen and (max-width: 768px) {
	 .media{
	 	padding: 0 15%;
	 }
}

@media screen and (max-width: 480px) {
	 .media{
	 	padding: 0 12%;
	 }
}


/***************************************/
/* EVENTS PAGE */
/***************************************/
#events-section{
	padding: 40px 0;
	height: 700px;
}

#events{
	padding: 0 6%;
}

#event-search{
	margin-top: 25px;
	margin-bottom: 40px;
}

#event-search input{
	height: 40px;
	padding-left: 5px;
	border: 1px solid gray;
	margin-right: 5px;
	width: 20%;
}
#event-search select{
	height: 40px;
	border: 1px solid gray;
	margin-right: 5px;
	width: 30%;
}
#event-search input:focus,
#event-search select:focus,
#event-search select:active{outline: none;}
#event-search button{
	background-color: #191d3d;
	color: white;
	border: none;
	height: 40px;
	width: 55px;
}

.event-date,
.latest-event-date{
	display: inline-block;
	text-align: center;
	background-color: #191d3d;
	color: white;
	border: none;
	height: 45px;
	min-width: 50px;
	padding-top: 3.5px;
	vertical-align: top;
}

.event-date span,
.latest-event-date span{
	display: block;
}

.event-info{
	display: inline-block;
	width: 88%;
	height: 45px;
	vertical-align: top;
}

.event{
	margin-bottom: 20px;

}

.event-info .panel{
	border: 1px solid gray;
	border-radius: 1px !important;
	-webkit-border-radius: 1px;
    -moz-border-radius: 1px;
}

.event-info .panel-title{
	padding: 0 8px;
	margin-top: 8px;
	font-weight: 600;
	text-transform: uppercase;
}

.event-info .panel-heading{
	position: relative;
	padding: 9px 8px;
	color: #92939d;
}

.event-info .panel-heading span{
	position: absolute;
	right: 10px;
	top: 15px;
	vertical-align: middle;
	border: none;
}

.event-info i{color: #191d3d;}

.event-info .panel-body{
	color: #92939d;
	background-color: #fff;
	position: relative;
	z-index: 1;
	padding:30px;
}

.event-info .panel-body p span{font-weight: 600;}
.event-info .panel-body .row p{margin-bottom: 0;}
.event-info .panel-body .row p:first-child{margin-bottom: 5px;}

.event-info .panel-body a{
	display: inline-block;
	padding: 15px;
	background-color: #ed145b;
	border-radius: 4%;
	-webkit-border-radius: 4%;
    -moz-border-radius: 4%;
	color: white;
	margin-top: 25px;
}
.event-info .panel-body a:hover{background-color: #191d3d;}

.event .collapse{border: 1px solid gray;}
#latest-events hr{margin: 10px 0;}

.latest-event{
	margin-bottom: 20px;
}

.latest-event-name{
	width: 69%;
	display: inline-block;
	margin-left: 10px;
	color: #92939d;
}


@media screen and (max-width: 1200px) {
    .event-info{width: 85%;}
	.latest-event-name{width: 63%;}
}

@media screen and (max-width: 1000px) {
    .event-info{width: 85%;}
	.latest-event-name{width: 62%;}
}

@media screen and (max-width: 768px) {
	#event-search input{width: 100%; margin-bottom: 5px;}
	#event-search select{width: 100%; margin-bottom: 5px;}
	#event-search button{width: 25%;}
}

@media screen and (max-width: 480px) {
	#event-search button{width: 100%;}
}

@media screen and (max-width: 420px) {
	.event{margin-bottom: 45px;}
    .event-info{width: 80%;}
}


/***************************************/
/* EVENT SINGLE PAGE */
/***************************************/
#event-single{
	padding: 0 6%;
	margin-top: 50px;
}

#event-image{
	width: 100%;
	min-height: 380px;
}

#event-single-side-desc hr{
	margin: 12px 0;
}

#event-single-side-desc p span{
	font-weight: 600;
}

#event-single-side-desc a{
	color: #ed145b;
}

#event-single-side-desc #share{
	font-size: 11px;
}

#event-single-side-desc #share a{
	color: white;
}

#event-single-side-desc .jssocials-share{
	font-size: 10px;
	margin: 0 !important;
	margin-right: 3px !important;
	margin-bottom: 5px !important;
}

#event-description{
	margin-top: 40px;
	padding: 0 15px;
	font-style: italic;
	color: #6d6a6a;
	font-size: 16px;
	line-height: 1.3;
}

#lectors{
	padding: 0 15px;
	margin-top: 20px;
	margin-bottom: 60px;
}

.lector-avatar{
	display: inline-block;
	vertical-align: top;
}

.lector{
	display: inline-block;
	width: 32%;
}

.lector-info{
	display: inline-block;
	margin-left: 10px;
	margin-top: 10px;
}

.lector-name{
	margin-bottom: 2px;
}

.lector-image{
	border-radius: 50%;
	-webkit-border-radius: 50%;
    -moz-border-radius: 50%;
	height: 75px;
	width: 75px;
}

@media screen and (max-width: 768px) {
	#event-image{
		margin-top: -25px;
	}

    #event-single-side-desc{
    	margin-top: 30px;
    }
}

@media screen and (max-width: 585px) {
	.lector-info{display: block; margin-left: 0;}
}

@media screen and (max-width: 480px) {
	#event-single .row:nth-child(2) p{padding:0 10px;}
	.lector{width: 100%; margin-bottom: 10px;}
	.lector-info{display: inline-block; margin-left: 5px;}
}

@media screen and (max-width: 350px) {#event-single .row:nth-child(2) p{padding:0 20px;}}
/***************************************/
/* ABOUT PAGE */
/***************************************/
#about-page{
	color: #92939d;
	padding: 60px 6%;
}

#about-page-heading{
	margin-bottom: 35px;
}

#about-page p{
	color: #6d6a6a;
	font-size: 16px;
	line-height: 1.3;
}

#about-page-heading h2{
	text-align: center;
	margin-bottom: 40px;
	color: #191d3d;
	font-weight: 600;
}

#section-title{
	font-weight: 600;
	margin-bottom: 20px;
}

#about-page-purpose span{
	font-weight: bold;
}

#about-page-purpose ul{
	padding-left: 5px;
}

#about-page-purpose ul li{
	list-style: none;
	text-indent: -5px;
}

#about-page-purpose ul li:before{
	content: "-";
 	text-indent: -5px;
 	margin-right: 5px;
}

/***************************************/
/* CONTACT PAGE */
/***************************************/
#contact{
	padding:50px 6% 120px 6%; 
	text-align: center;
}

#contact h2{
	font-weight: 600;
	margin-bottom: 20px;
}

#contact p{
	color: #92939d;
}

#contact form{
	margin-top: 50px;
}

#contact form input{
	margin-bottom: 30px;
	width: 47%;
	display: inline-block;
	height: 50px;
}

#contact form input[type=text]{
	margin-right: 5%;
}

#contact form input:focus,
#contact form textarea:focus{
  border:2px solid #17376e;
  box-shadow: none;
}

#contact form textarea{
	width: 99.5%;
	height: 180px;
}

#contact form button{
	padding: 10px 0;
	margin-top: 20px;
	color: #191d3d;
	font-weight: 600;
	background-color: #cccccc;
}

#contact form button:hover{
	background-color: #17376e;
	color: white;
}

#contact form button:focus{
	outline-color: #17376e;
}

.mail-success,
.mail-error{
	text-transform: uppercase;
    font-weight: bold;
    margin-top: 10px;
    color: #191d3d !important;
    border: 1px solid #191d3d;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    padding: 10px;
}

.mail-error{
    border: 1px solid red;
}

@media screen and (max-width: 450px) {
  #contact form input{
		width: 46%;
	}
}


/***************************************/
/* LOGIN PAGE */
/***************************************/
#login-page{padding: 50px 6% 420px 6%;}
#login-page h2{text-align: center;}
#login-page hr{width: 96%;}
#login-page img{
	width: 23%;
	margin-bottom: 20px;
}
#login-page input{border-radius: 2px;}
#login-page input:focus{
	border:2px solid #17376e;
  	box-shadow: none;
}
#login-page button{
	font-weight: bold;
	border-radius: 2px;
}
#login-page p{
	margin-top: 10px;
	color: #191d3d;
}
#login-facebook-page p span,
#login-page p span{font-weight: bold;}
#login-facebook-page a,
#login-page a{
	font-weight: bold;
	color: #191d3d;
}
#login-page a:hover{
	cursor: pointer;
}

@media screen and (max-width: 768px) {
  #login-page{padding: 50px 6% 80px 6%;}
}

/***************************************/
/* LOGIN FACEBOOK PAGE */
/***************************************/
#login-facebook-page{
	padding: 50px 6% 420px 6%;
	text-align: center;
}
#login-facebook-page img{
	width: 15%;
	border-radius: 50%;
}
#login-facebook-page form p:nth-child(2){
	color: #191d3d;
	font-weight: bold;
	font-size: 20px;
	margin-top: 10px;
	margin-bottom: 20px;
}
#login-facebook-page button{
	font-weight: bold;
	border-radius: 3px;
	width: 55%;
	margin: 0 auto;
	background-color: #3b5998;
	color: white;
	margin-bottom: 10px;
}
#login-facebook-page button:hover{background-color: #191d3d;}
#login-facebook-page button:focus{outline: none;}
#login-facebook-page p:last-child{color: #191d3d;}


@media screen and (max-width: 768px) {
  #login-facebook-page{padding: 50px 6% 80px 6%;}
}

/***************************************/
/* REGISTER */
/***************************************/
#register-page{
	padding: 50px 6% 420px 6%;
	text-align: center;
}
#register-page a{
	display: inline-block;
	border: 2px solid red;
	color: #191d3d;
	border-radius: 3px;
	padding: 8px;
	margin:40px 20px;
}
#register-page a:hover{
	border-color: #191d3d;
	transition: 0.5s;
}

@media screen and (max-width: 768px) {
  #login-facebook-page{padding: 50px 6% 80px 6%;}
}
@media screen and (max-width: 480px) {
  #register-page{padding: 50px 0 80% 0}
  
  #register-page a:first-child{margin-left: 0;}
  #register-page a:last-child{margin-right: 0;}

}
@media screen and (max-width: 420px){
	#register-page a{
		margin:40px 0;
		padding: 8px 5px;
	}
}

/***************************************/
/* EMAIL REGISTER */
/***************************************/
#email-register-page{padding: 50px 6% 420px 6%;}
#email-register-page h2{text-align: center;}
#email-register-page hr{width: 96%;}
#email-register-page input{border-radius: 2px;}
#email-register-page input:focus{
	border:2px solid #17376e;
  	box-shadow: none;
}
#email-register-page button{
	font-weight: bold;
	border-radius: 2px;
}
#email-register-page p{
	margin-top: 10px;
	color: #191d3d;
}
#email-register-page a{
	font-weight: bold;
	color: #191d3d;
}
@media screen and (max-width: 768px) {
  #email-register-page{padding: 50px 6% 80px 6%;}
}

/***************************************/
/* PROFILE PAGES */
/***************************************/
#profile-page{padding: 50px 6% 420px 6%;}
#profile-page h2{text-align: center;}
#profile-page hr{width: 96%; margin-bottom: 40px;}
#profile-image-group{
	text-align: center;
}
#profile-image-group .profile-image{
	height: 200px;
	width: 200px;
	margin-bottom: 22px;
}
#profile-image-group button{width: 200px; margin: 0 auto; }
#profile-page input{border-radius: 2px;}
#profile-page input:focus{
	border:2px solid #17376e;
  	box-shadow: none;
}
#profile-page button{
	font-weight: bold;
	border-radius: 2px;
}
#profile-page button:hover{
	color: white;
	background-color: #17376e;
}

@media screen and (max-width: 768px) {
   #profile-page{padding: 50px 6% 80px 6%;}
   #profile-image-group .profile-image{height: 300px;width: 300px;}
   #profile-image-group button{width: 300px;}
}

@media screen and (max-width: 480px) {
   #profile-image-group .profile-image{height: 250px;width: 250px;}
   #profile-image-group button{width: 250px;}
}


/***************************************/
/********** FOOTER *************/
/***************************************/
#main-footer{
	padding-top: 40px;
	background-color: #f2f4f5;
	color: #a9a9ab;
}

#main-footer .row{
	padding: 0 5%;
}

#main-footer .col{
	text-align: center;
}

#footer-col-1,
#footer-col-2,
#footer-col-3 {
	display: inline-block;
	vertical-align: top;
}

#footer-col-1{
	width: 40%;
	margin-right: 7%;
}

#footer-col-2{
	width: 21%;
	margin-right: 5%;
}

#footer-col-3{
	width: 25%;
}

#footer-col-1 p{
	line-height: 20px;
	font-weight: normal;
	letter-spacing: 0.5px;
	font-size: 14px;
}

.footer-logo{
	margin-bottom: 20px;
}

.footer-logo img{
	width: 100px;
	height: 50px;
}

#social-icons{
	margin-top: 20px;
}

#social-icons img{
	height: 30px;
	width: 30px;
	display: inline-block;
	border-radius: 7%;
	-webkit-border-radius: 7%;
    -moz-border-radius: 7%;
	margin-right: 5px;
}

#main-footer h4{
	margin-bottom: 30px;
	color: #242a52;
}

#main-footer ul{
	list-style: none;
	padding:0;
}

#main-footer ul li{
	margin-bottom: 15px;
}

#main-footer ul li a{
	font-size: 14px;
	color: #a9a9ab;
	font-weight: 600;
}

.footer-bottom-logo{
	margin-top: 15px;
}
	.footer-bottom-logo img{
		margin-bottom: 10px;
		float: left;
		width: 25%;
	}

	.footer-bottom-logo p{
		float: right;
		width: 72%;
	}

#develop-by{
	background-color: #cccccc;
	height: 55px;
	text-align: center;
	margin-top: 40px;
}

#develop-by h4{
	top: 18px;
	margin-bottom: 0;
	position: relative;
	color: white;
}

#develop-by .tendrik-logo{
	width: 85px;
	margin-bottom: 2px;
    margin-left: 5px;
}


@media screen and (max-width: 768px) {
    #main-footer{text-align: center;}

    .footer-bottom-logo img{
    	width: auto;
    	float: none;
    	width: 215px;
    	margin-top: 20px;
    }
    .footer-bottom-logo p{
		float: none;
		width: 100%;
	}
}

@media screen and (max-width: 585px) {
    #footer-col-1{
		width: 100%;
		margin:0 0 20px 0;	
	}

	#footer-col-2{
		width: 48%;
		margin-right: 0
	}

	#footer-col-3{
		width: 48%;
	}
}

/*FancyBox Aspect Ration Fix*/
.fancybox-type-iframe .fancybox-inner{
    padding-top: 56.2%; /* (9/16 * 100%) -- your aspect ratio in percents */
    height: 0 !important;
}

.fancybox-type-iframe .fancybox-inner .fancybox-iframe{ 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0;
}