/*==== Light-Blue  skin  ====*/

/*

Light - Blue: #5e95c8
Light - Blue -shadow :#334e67;

*/

/* This are the primary elements that you need to change if you want to create your own color scheme, 
beside this elements properties, you also need to change the active state for the menu from the script.js ,
 and IE Css files for respective color more about how to create or change the color scheme in the documentation file*/



/*=================================
		General Typography
=================================*/
h1,h2,h3 { color:#5e95c8; }
.outside-header { border-color:#5e95c8; }
.nav .primary li a { background:#5e95c8; }
.nav .primary li { text-shadow: 0px 1px 1px #334e67; }
.employment ul.description li span, .education ul.description li span { color:#5e95c8; }
span.cross { border-color:#5e95c8; }
.thirteen.columns.offset-by-three { border-color:#5e95c8; }

/* ========== Profile ========== */
h1.title { text-shadow:1px 1px 1px #334e67; }
.about.four.columns img { border-color:#5e95c8; }
.profile h4 {
	color:#5e95c8;
	border-color:#5e95c8;
}
.profile .eight.columns.about p.me span { color:#5e95c8;  }
span.corner { background: url(../../images/light-blue/corner.png) no-repeat; }
/* ========== End Profile ========== */

/* ========== Employment ========== */
.date { background:rgba(94,149,200, 0.4); }
.employment h4 span, .education h4 span { color:#5e95c8; }
.employment .eight.columns, .education .eight.columns { background: url(../../images/light-blue/sep-line.png) bottom center repeat-x; }

/* ========== End Employment ========== */



/* ========== Skills ========== */
.skills h4 span { color:#5e95c8; }
.skill-bar li { background:#5e95c8; }
/* ========== End Skills ========== */

/* ========== Portfolio ========== */
.portfolio .four.columns img { border-color: #5e95c8; }
.portfolio ul.twelve.columns li:hover .img-holder .hover h4 { color:#5e95c8; }
.portfolio ul.twelve.columns li:hover .img-holder .hover span { color:#5e95c8; }
/* ========== End Portfolio ========== */

/* ========== Contact ========== */
#contact h1 { text-shadow:1px 1px 1px #334e67; }
#contact form button {
	background: url(../../images/light-blue/send-button.png) no-repeat;
	text-shadow:1px 1px 1px #334e67;
}
/* ========== End Contact ========== */




/* ========== Footer ========== */
#footer { background:#5e95c8; }
#footer ul.social li a.download-btn {
	text-shadow:1px 1px 1px #334e67;
	background: url(../../images/light-blue/download-btn.png) no-repeat;
}

/* ========== End Footer ========== */




#fancybox-content { border-color: #5e95c8 !important; }





/* =================================
	Colors for Media Queries 
  ================================= */
/* #Media Queries
================================================== */



	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
#footer { background:#5e95c8; }
.nav .contact-form-mob { background: url(../../images/light-blue/mail-mob.png) no-repeat; }
	}
	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
select { border:1px solid #5e95c8; }
 #footer {
 background:#5e95c8;
}
.portfolio ul.twelve.columns li .img-holder .hover h4  {color:#5e95c8;}
 .nav .contact-form-mob {
 background: url(../../images/light-blue/mail-mob.png) no-repeat;
}
}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
select { border:1px solid #5e95c8; }
.nav .contact-form-mob { background: url(../../images/light-blue/mail-mob.png) no-repeat; }
#footer { background:#5e95c8; }
/*========================================
 	====End Begin #Porfolio ====  
========================================*/

.portfolio .four.columns img { border:5px solid #5e95c8; }
.portfolio ul.twelve.columns li .img-holder .hover h4 { color:#5e95c8 !important; }
.portfolio ul.twelve.columns li .img-holder .hover span { color:#5e95c8; }
.portfolio ul.twelve.columns li:hover .img-holder .hover h4 { color:#5e95c8; }
.portfolio ul.twelve.columns li:hover .img-holder .hover span { color:#5e95c8; }
/*========================================
 	====End #Porfolio ====  
========================================*/
.nav .contact-form-mob { background: url(../../images/light-blue/mail-mob.png) no-repeat; }
.portfolio ul.twelve.columns li .img-holder .hover h4 { color:#5e95c8; }
}