/* 	==========================================================================
==========================================================================
					   3. PAGE CAREER COACHING
==========================================================================
========================================================================== */

/* 	==========================================================================
						3.1. SECTION  HERRO-BANNER
========================================================================== */
.wrapper-career-coaching .section-title h4{
	font-size: 18px;
	color: #01948E;
	margin: 0 0 5px;
	text-align: center;
	float: left;
	width: 100%;
	text-transform: uppercase
}
.wrapper-career-coaching .section-title h3{
	clear: both;
	font-size: 30px !important;
	color: rgb(0,105,180);
	margin: 0 !important;
	text-align: center;
	text-transform: uppercase;
}
.wrapper-career-coaching .section-title p{
	text-align: center;
	margin: 25px 0 35px;
} 
.wrapper-career-coaching .section{
	float: left;
	width: 100%;
	padding: 60px 0
}
.wrapper-career-coaching .hero-banner { 
	position: relative; 
	width: 100%; 
	/*background-image: url('../images/home_hero_banner.jpg');*/
	float: left;
	height: 310px;
	background-repeat: no-repeat;
	background-position: center;
	/*background-size: calc(100%) auto;*/
	margin-top: 150px;
}
.wrapper-career-coaching .hero-banner .mask {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.4); 
	float: left;
	text-align: center;
}
.wrapper-career-coaching .nopadding{ padding: 0}

.search-bar .form-group{ margin: 20px;}
.search-bar .form-control{
	padding: 30px 20px;
	font-size: 16px;
	border-color: #80bce0;
	border-radius: 2px;
}
.wrapper-career-coaching .margin{ margin-top: 20px;}
.wrapper-career-coaching .padding{ padding: 0 15px 30px;}
.wrapper-career-coaching .all-list-item:hover,
.wrapper-career-coaching .all-list-item{
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.wrapper-career-coaching .all-list-item:hover{
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.1);
}
.wrapper-career-coaching .all-list-item .link{
    float: left;
    margin: 0 auto;
    top: 28%;
    left: 0;
    width: 100%;
    position: absolute;
    -webkit-transform: translateY(-72%);
    -moz-transform: translateY(-72%);
    -ms-transform: translateY(-72%);
    -o-transform: translateY(-72%);
    transform: translateY(-72%);
    text-align: center;
    right: 0;
    opacity: 1;
}
.wrapper-career-coaching .all-list-item .link  .video-icon{
	background: transparent url("../images/icon/youtube-media-play.png") no-repeat center / 70px auto;
	color: transparent;
	content: '';
	height: 80px;
	width: 80px;
	display: flex;
	margin: 0 auto;
}
.wrapper-career-coaching .all-list-item .bg-white{ padding: 20px;}
.wrapper-career-coaching .all-list-item .bg-white span.title{
	font-size: 20px;
	float: left;
	width: 100%;
	margin-bottom: 30px;
	color: rgb(0,105,180);
}
.wrapper-career-coaching .all-list-item .list-item .bg-white{ padding: 20px;}

/**
============================================
    Customize pagination laravel's
============================================
 */
.wrapper-career-coaching .pagination > li:first-child > a::before,
.wrapper-career-coaching .pagination > li:first-child > span::before {
    content: url("../../fron-end/images/icon/left_arrow_pagination.png");
    padding-right: 5px;
    top: 3px;
    position: relative;
}
.wrapper-career-coaching .pagination > li:last-child > a::after,
.wrapper-career-coaching .pagination > li:last-child > span::after {
    content: url("../../fron-end/images/icon/right_arrow_pagination.png");
    padding-left: 5px;
    top: 3px;
    position: relative;
}
.wrapper-career-coaching .pagination > .active > a,
.wrapper-career-coaching .pagination > .active > a:focus,
.wrapper-career-coaching .pagination > .active > a:hover,
.wrapper-career-coaching .pagination > .active > span,
.wrapper-career-coaching .pagination > .active > span:focus,
.wrapper-career-coaching .pagination > .active > span:hover {

    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #4592c8;
    border-color: #4592c8;

}
.wrapper-control-user .pagination > li:last-child > a,
.wrapper-control-user .pagination > li:last-child > span {

    border-radius: 0;
    color: #156bb5;
    margin-right: 0px !important;
    border-color: #156bb5;

}
.wrapper-career-coaching .pagination > li:first-child > a,
.wrapper-career-coaching .pagination > li:first-child > span {

    border-radius: 0;
    color: #156bb5;
    margin-left: 0px !important;
    border-color: #156bb5;

}
.wrapper-career-coaching .pagination > li:last-child > a,
.wrapper-career-coaching .pagination > li:last-child > span {

    border-radius: 0;
    color: #156bb5;
    margin-right: 0px !important;
    border-color: #156bb5;

}
.wrapper-career-coaching .pagination > li > a,
.wrapper-career-coaching .pagination > li > span {
    margin: 0 3px;
    border-radius: 1px;
    border-color: #156bb5;
}
.wrapper-career-coaching .pagination>.disabled>a,
.wrapper-career-coaching .pagination>.disabled>a:focus,
.wrapper-career-coaching .pagination>.disabled>a:hover,
.wrapper-career-coaching .pagination>.disabled>span,
.wrapper-career-coaching .pagination>.disabled>span:focus,
.wrapper-career-coaching .pagination>.disabled>span:hover {
    border-radius: 1px;
}

/* 	==========================================================================
	==========================================================================
   							 		TABLATE
	==========================================================================
   	========================================================================== */
@media only screen 	and (min-width : 720px) and (max-width : 1280px){
	.wrapper-career-coaching .hero-banner{ margin-top: 100px}
}
@media only screen 	and (min-device-width : 768px) and (max-device-width : 992px){
	.wrapper-career-coaching .all-list-item .link .video-icon{ 
		background: transparent url("../images/icon/youtube-media-play.png") no-repeat center / 50px auto;
	}
	.wrapper-career-coaching .all-list-item .link{ top: 19%;}
}


@media only screen 	and (min-device-width : 992px) and (max-device-width : 1024px){
	.wrapper-career-coaching .all-list-item .link{ top: 26%;}
}