/*
=============================================================================================
																	HOME PAGE - LOGOFF HEADER
=============================================================================================
*/


.upperContainer.home header{
	height:				470px;
}

/************************************/
/*	LOGO							*/
/************************************/

.upperContainer.home .roundButtonResize.enormous{
	margin-left:		185px
}

/************************************/
/*	LOGIN FORM						*/
/************************************/

.upperContainer.home .loginForm{
	position:			absolute;
	right:				0px;
	top:				-8px;
	width:				460px;
	font-size: 			0px
}

.upperContainer.home .loginForm .fieldArea{
	background-color:	#ffffff;
	border:				dashed 1px #c6c6c6;
	border-radius: 		12px;
	padding: 			5px 10px;
	margin:				10px 0px;
	display:			inline-block;
	vertical-align:		middle;
}

.upperContainer.home .loginForm .fieldArea.error{
	border:				dashed 1px #e30075;
	-webkit-box-shadow: 0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
	-moz-box-shadow: 	0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
	box-shadow: 		0px 0px 7px 0px rgba(222,0,122,1), inset 0px 0px 7px 0px rgba(222,0,122,1);
}

.upperContainer.home .loginForm .fieldArea input{
	vertical-align:		middle;
	background-color:	transparent;
	border:				0px;
	color:				#585858;
	font-family: 		'Raleway' , seans-serif;
	font-weight:		400;
	padding:			3px;
	border-radius:		10px;
	font-size:			13px;
}

.upperContainer.home .loginForm .fieldArea input[name="email"]{
	width:				180px;
}

.upperContainer.home .loginForm .fieldArea input[name="password"]{
	width:				90px;
}

.upperContainer.home .loginForm .fieldArea img{
	vertical-align:		middle;
	margin:				0px 10px;
}

.upperContainer.home .loginForm input[type="submit"]{
	display:			inline-block;
	vertical-align:		middle;
	margin:				10px 15px 10px 10px;
	font-size:			13px;
	float: 				right;
	
}

.upperContainer.home .loginForm a.facebookLogin{
	display:			inline-block;
	vertical-align:		middle;
	background-image:	url(/img/form/facebook.png);
	background-repeat:	no-repeat;
	background-position:right;
	background-color:	#375794;
	border:				0px;
	color:				#ffffff;
	font-family: 		'Raleway' , seans-serif;
	font-weight:		400;
	padding: 			3px 38px 3px 15px;
	border-radius:		10px;
	font-size:			13px;
	line-height: 		24px;
	float: 				right;
	margin-right: 		15px;
	margin-top:			 -5px;
}

.upperContainer.home .loginForm a.facebookLogin:hover{
	background-color:	#1f3e7a
}


/************************************/
/*	LARGE CIRCLE				*/
/************************************/

.circleLogoContainer{
	position:			absolute;
	left:				190px;
	top:				30px
}

/************************************/
/*	EMPLOYER BOX					*/
/************************************/

.employerBox{
	background-repeat:	no-repeat;
	background-position:left;
	background-image:	url(/img/home/employer.png);
	display:			block;
	position:			absolute;
	width:				650px;
	height:				390px;
	top:				82px;
}

.employerBox h2{
	bottom:				100px;
	position:			absolute;
	left:				210px;
}

.employerBox h4{
	bottom:				50px;
	position:			absolute;
	left:				210px;
}

/************************************/
/*	USER BOX						*/
/************************************/

.userBox{
	background-repeat:	no-repeat;
	background-position:right;
	background-image:	url(/img/home/user.png);
	display:			block;
	position:			absolute;
	width:				460px;
	height:				365px;
	top:				110px;
	right:				0px
}

.userBox h2{
	width:				240px;
	top:				50px;
	position:			absolute;
	left:				0px;
}

.userBox h4{
	width:				250px;
	top:				157px;
	position:			absolute;
	left:				0px;
}


/*
=============================================================================================
															   HOME PAGE - LOGED USERS HEADER
=============================================================================================
*/





/************************************/
/*	USER SUGGESTED ADVERTISEMENTS	*/
/************************************/

.advertisement{
	width:				570px;
	margin-right:		40px
}

.advertisement #suggestedAdverts a.noData{
	margin:				10px 10px 10px 0px
}

.btnBar{
	text-align:			right
}

.moreAdv{
	margin-right:		5px;
	margin-top:			10px;
	display:			inline-block;
	font-size:			16px
}

.moreAdv .fadeIco{
	height:				15px;
	margin-left:		7px
}

/* SINGLE ADVERTISEMENT */
.adv{
	display:			block;
	margin-top:			12px;;
	font-size:			0
}

.adv:hover{
	color:				#585858
}

.adv > *{
	display:				inline-block;
	vertical-align:		middle
}

.adv > img{
	width:				52px;
	height:				52px;
	border-radius:		100%;
	margin-right:		10px
}

.adv:hover span.more{
	color:				#e30074
}

.adv h4{
	margin-right:		15px;
}

.adv .whiteDashedBox{
	display:			inline-block;
	width:				calc(100% - 96px)
}

.adv .whiteDashedBox > *{
	font-size:			14px
}

.adv h4, .adv .whiteDashedBox{
	vertical-align:		middle;
	moz-transition: 	all 0.3s ease-out;
	-webkit-transition: all 0.3s ease-out;
	-o-transition: 		all 0.3s ease-out;
	-ms-transition: 	all 0.3s ease-out;
	transition: 		all 0.3s ease-out;	
}

.adv:hover h4, .adv:hover .whiteDashedBox{
	-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.15);
	-moz-box-shadow: 	0px 0px 15px 0px rgba(0,0,0,0.15);
	box-shadow: 		0px 0px 15px 0px rgba(0,0,0,0.15);
}

.adv span.title{
	font-weight:		600;
	margin-bottom:		5px;
}

.adv span.date{
	float:				right;
	font-weight:		600
}

.adv span.location{
	clear:				both
}

.adv span.info{
	float:				right
}




/************************************/
/*	USER CALENDAR					*/
/************************************/

.columns .calendar{
	width:				350px
}

/************************************/
/*	EMPLOYER ADVERTICEMENTS			*/
/************************************/

.employerHeader .employerAdvertHeaders{
	width:				660px;
	margin-right:		30px
}

.employerHeader .employerAdvertHeaders > h1{
	margin:				0 0 8px 15px
}


/************************************/
/*	EMPLOYER MANAGEMENT				*/
/************************************/

.employerHeader .management{
	width:				270px
}

.employerHeader .management a{
	display:			block;
	margin-bottom:		10px
}

/*
=============================================================================================
																		HOME PAGE - MAIN BODY
=============================================================================================
*/

.home.lowerContainer h1{
	font-size:			32px;
	line-height:			36px	
}

/************************************/
/*	USER OF THE WEEK				*/
/************************************/

.weekusers{
	font-size:			0px;
	margin-bottom:		15px;
}

.weekusers h1{
	margin-bottom:		10px;
}

.weekusers .user{
	display:			inline-block;
	vertical-align:		top;
	width:				175px;
	text-align:			center;
	font-size:			14px;
}

.weekusers .user:nth-child(3){
	margin:				0px 27px
}

.weekusers .user .photo{
	height:				200px;
	overflow:			hidden;
	text-align:			center;
	width:				100%;
	margin-bottom:		15px;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;	
}

.weekusers .user .photo img{
	display:				inline-block;
	height:				100%
}

.weekusers .user img{
	margin-bottom:		10px;
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;	
}




.weekusers .user div.star{
	width:				35px;
	height:				35px;
	display:			inline-block;
	vertical-align:		middle;
	margin-bottom:		0px;
	background-color:	#e30075;
	border-radius:		50px
}

.weekusers .user img.star{
	moz-transition: 	all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-o-transition: 		all 0.4s ease-out;
	-ms-transition: 	all 0.4s ease-out;
	transition: 		all 0.4s ease-out;	
}

.weekusers .user h3{
	display:			inline-block;
	vertical-align:		middle;
	font-weight:		400;
	width:				auto;
	margin-left:		10px;
	font-size:			20px;
	text-align:			left;
}

.weekusers .user:hover img.star{
	transform:			rotate(90deg);
	-ms-transform:		rotate(90deg);
	-webkit-transform:	rotate(90deg);
}

.weekusers .user:hover .photo:not(.star){
	-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 	0px 0px 15px 0px rgba(0,0,0,0.2);
	box-shadow: 		0px 0px 15px 0px rgba(0,0,0,0.2);
}


/************************************/
/*	NEWS BOX						*/
/************************************/

.newsContainer{
	font-size:			0px;
}

.newsContainer > :last-child{
	margin-left:			20px
}

.newsContainer .news{
	display:			inline-block;
	vertical-align:		top;
	margin-bottom:		20px;
	width:				165px
}

.newsContainer .news.left{
	margin-right:		20px;
}

.newsContainer .news .date{
	display:			inline-block;
	vertical-align:		middle;
	margin-right:		10px;
	border:				1px solid #e30075;
	border-radius:		50px;
	width:				30px;
	height:				30px;
	color:				#e30075;
	moz-transition: 	all 0.3s ease-out;
	-webkit-transition: all 0.3s ease-out;
	-o-transition: 		all 0.3s ease-out;
	-ms-transition: 	all 0.3s ease-out;
	transition: 		all 0.3s ease-out;	
}

.newsContainer .news:hover .date{
	background-color:	#e30075;
	color:				#ffffff;
}

.newsContainer .news .date span{
	display:			block;
	width:				100%;
	text-align:			center;	
}

.newsContainer .news .date .day{
	font-size:			13px;
	line-height:			13px;
	font-family:        'Roboto', sans-serif;
	margin-top:			2px;
	font-weight:			400
}

.newsContainer .news .date .mounth{
	font-size:			9px;
	font-weight:			500
}

.newsContainer .news h2{
	display:			inline-block;
	vertical-align:		middle;
	width:				calc(100% - 42px);
	font-size:			12px;
	font-weight:			400;
	max-height:				29px;
	overflow:			hidden
}

.newsContainer .news p{
	font-size:			12px;
	text-align:			justify
}

.newsContainer .news img{
	margin:				10px 0;
	width:				100%	
}




/* LARGE CONTAINER */
.newsContainer .news.large{
	display:			block;
	margin-top:			10px;
	width:				100%;
}

.newsContainer .news.large .date{
	width:				55px;
	height:				55px;
	margin-right:		20px
}


.newsContainer .news.large .date .day{
	font-size:			28px;
	line-height:			28px;
	font-weight:			100;
	margin-top:			4px
}

.newsContainer .news.large .date .mounth{
	font-size:			14px;
	font-weight:			300
}

.newsContainer .news.large h2{
	width:				calc(100% - 77px);
	font-size: 			21px;
	line-height:			24px;
	font-weight:			300;
	height:					auto;
	max-height:				none;
	overflow:				visible
}

.newsContainer .news.large p{
	font-size:			14px;
}




/************************************/
/*	OUR USERS						*/
/************************************/
.ourUsers{
	margin-right:		0px;
	display:				block;
	vertical-align:		top;
}

.ourUsers h1{
	margin-bottom:		15px
}

.ourUsers a{
	display:				inline-block;
	vertical-align:		middle;
	margin:				0 15px 15px 0;
	width:				calc((100% - 45px) / 4);
	overflow:			hidden
}

.ourUsers a:nth-child(4n + 1){
	margin-right:		0
}

.ourUsers a img{
	width:				100%
}

/************************************/
/*	TRUSTED US						*/
/************************************/

.trustedUs{
	width:				174px;
	display:			inline-block;
	vertical-align:		top;
	display:				none
}


