/*--------------------------------------------------------------------------
 Project 		: ME+ | Responsive Modern V-card
 Author 		: Mias Marthinus
---------------------------------------------------------------------------------
 Copyright (c) 2016 - MiasStudio 
-------------------------------------------------------------------------------*/


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
							  TABLE OF CONTENT
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

[1] BACKGROUND COLOR
+-- [1.1] Strong
+-- [1.2] Medium
+-- [1.3] Dimmed
+-- [1.4] Canvas
+-- [1.5] Reverse
+-- [1.6] None
+-- [1.7] Gradient
+-- [1.8] Alpha
+-- [1.9] Available
+-- [1.10] Unvailable
|	
[2] FONT COLOR
+-- [2.1] Strong
+-- [2.2] Reverse
|
[3] BORDER COLOR
+-- [3.1] Strong
+-- [3.2] Dimmed
+-- [3.3] Inherit
+-- [3.4] Background
+-- [3.5] None

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

@charset "utf-8";

/* 
===============================================================================
 BACKGROUND COLOR
===============================================================================
*/

/* STRONG */
#loading-panel,
#main-menu,
#page-resume-skills > div > div:nth-child(2) > div > div,
.bg-strong{
	background-color:#e5e5e5;
}

/* MEDIUM */
#portofolio-detail-view,
.bg-medium{
	background-color:#eee;
}

/* DIMMED */
body,
.bg-dimmed{
	background-color:#f9f9f9;
}

/* CANVAS */
#canvas,
#canvas > .ec-page:nth-child(1) > div > div:nth-child(2),
.section-title > span{
	background-color:#fff;
}

/* REVERSE */
#portofolio-category > .active,
#main-menu > .active,
.bg-reversed,
.button-full,
.button-framed:hover{
	background-color:rgb(57,202,116);
}

/* NONE */
.button-full:hover{
	background-color:rgba(0,0,0,0);
}

/* GRADIENT */
#blog-picture > div:nth-child(1),
#portofolio-picture > div:nth-child(1),
#canvas > .ec-page:nth-child(1) > div > div:nth-child(1) > div:nth-child(1){
	background-image:
		linear-gradient(
			to bottom,
			rgba(0, 0, 0, 0),
			rgba(0, 0, 0, 0),
			rgba(0, 0, 0, 0),
			rgba(0, 0, 0, 0.6)
		);
}

/* ALPHA */
#blog-items > div > div:nth-child(1){
	background-color:rgba(0,0,0,0.8);
}

/* AVAILABLE */
.available{
	background-color:#2ECC71;
}

/* UNAVAILABLE */
.unavailable{
	background-color:#E74C3C;
}

/* 
===============================================================================
 FONT COLOR
===============================================================================
*/

/* STRONG */
.button-full:hover,
#canvas{
	color:#222;
}

/* REVERSED */
#blog-items > div > div:nth-child(1),
#availability,
#portofolio-category > .active,
#main-menu > .active,
#blog-picture > div:nth-child(2),
#portofolio-picture > div:nth-child(2),
#canvas > .ec-page:nth-child(1) > div > div:nth-child(1) > div:nth-child(2),
.bg-reversed,
.button-full,
.button-framed:hover{
	color:#fff;
}

/* 
===============================================================================
 BORDER COLOR
===============================================================================
*/

/* STRONG */
hr,
.frame-thin{
	border-color:#e9e9e9;
}

.bg-dimmed hr,
.bg-dimmed .frame-thin{
	border-color:#ddd;
}

.bg-medium hr,
.bg-medium .frame-thin{
	border-color:#d9d9d9;
}

.bg-strong hr,
.bg-strong .frame-thin{
	border-color:#ccc;
}

/* DIMMED */
#page-resume-skills > div > div:nth-child(2) > div{
	border-color:#f9f9f9;
}

/* INHERIT */
#canvas > .ec-page:nth-child(1) > div > div:nth-child(1) > div:nth-child(2) hr,
.button-full:hover{
	border-color:inherit;
}

/* BACKGROUND */
#loading-panel > div{
	border-color:#fff;
}

/* NONE */
.button-full{
	border-color:rgba(0,0,0,0);
}