/*
Theme Name: Supercore
Theme URI: http://www.supercorethemes.com
Description: Clean and minimal portfolio theme
Author: Adriano Leo
Author URI: https://wondercore.wordpress.com
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


/* Table of Content
==================================================
#Reset
#Structure
#Typography
#Menu
#Gallery
#template-Home
#Various Elements
- Loading
- Icons
- Video
- Default WordPress CSS
#Media Query
=================================================*/




/* ------------------------ */
/* --------- RESET -------- */
/* ------------------------ */
	
	body {
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.4;
	word-spacing: 1.1pt;
	letter-spacing: 0.2pt;
		color: #000;
		background: none;
		position: relative;
		height: 100%;
	}
	
	div.page-wrap-full {
		height: 100%;
		position: relative;
	}

	
	html {
		width: 100%;
		height: 100%;
		position: relative;
	}
	
	h1,h2,h3,h4,h5,h6 { font-family: Helvetica, Arial, sans-serif; }
	h1 { font-size: 19pt; }
	h2 { font-size:17pt; }
	h3 { font-size:15pt; }
	h4,h5,h6 { font-size:12pt; }
	code { font: 10pt Courier, monospace; } 
	blockquote { margin: 1.3em; padding: 1em; }
	img { display: block; margin: 0px; }
	a img { border: none; }
	table { margin: 1px; text-align:left; }
	th { border-bottom: 1px solid #333;  font-weight: bold; }
	td { border-bottom: 1px solid #333; }
	th, td { padding: 4px 10px 4px 0; }
	caption { background: #fff; margin-bottom: 2em; text-align: left; }
	thead { display: table-header-group; }
	tr { page-break-inside: avoid; } 
	a { text-decoration: none; color: black; }
	


/* ---------------------------- */
/* --------- STRUCTURE -------- */
/* ---------------------------- */


	* { margin: 0; padding: 0; }
	
	body {
	
		margin:auto;
		padding:0px;
		
		background: white;
		font: 11px/1.4 "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
		color: black;
	}


	/* ************************ */
	/*		 HEADER-LEFT	
	/* ************************ */
	

	#header-left {
		width: 20%;
		min-height: 100%;
		
		padding-top: 40px;
		
		float: left;
		clear: left;
		padding-right: 4%;
		padding-left: 4%;
		
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		
		position: fixed;
	}
	
	
	
	
	/* ************************ */
	/*		  BODY RIGHT	
	/* ************************ */
	
	#body-right {
		width: 79%;
		float: left;
		height: 100%;
		margin-top: 40px;
		left: 20%;
		position: relative;
		
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
	}
	
	#body-right img {
		max-width: 100%;
		height: auto;
	}
	
	#body-right .post{
		width: 70%;
	}
	
	

	/* ************************ */
	/*		  FOOTER	
	/* ************************ */	

	#footer {
		float: left;
		position: absolute;
		bottom: 10px;
		font-size: 10px;
		color: gray;
	}
	
	#footer a {
		color: gray;
	}
			
	
	
	
/* ---------------------------- */
/* --------- TYPOGRAPHY -------- */
/* ---------------------------- */



	
	h1, h2, h3 {
		font-weight: normal;
		margin: 0 0 10px 0;
	}
	
	h1 {
		font-size: 18px;
		font-weight: bold;
		display: inline;
		float: left;
		clear: both;
	}

	li {
		line-height: 1em;
	}
	
	h2 {
		font-size: 12px;
		font-weight: bold;
	}
	
	
	.post h2 {
		margin-top: 16px;
	}

	
	h3 { }
	
	
	
	
	
	
	p {
	margin: 0 0 10px 0;
	clear: left;
	}
	
	a {
		color: black;		
		text-decoration: underline;
	}
	
	
	a:hover {
		text-decoration: none;
	}
	
	blockquote { }
	blockquote p { }
	


/* ---------------------------- */
/* LOGO
/* ---------------------------- */
		
		#logo {
			float: left;
			margin-bottom: 0;
			padding-bottom: 70px;
			width: 100%;
		}
		
		#logo h1 a {
			text-decoration: none;
			font-size: 20px ;
			color: #000000;
			font-weight: bold;
		}
			
			
/* --------------------------------- */
/* -------------- MENU ------------- */
/* --------------------------------- */

/* all .menu class is assigned to custom WP menu */	

		/* MENU container */
		
			#menu {
				float: left;
			}
					
		
		/* MENU Pages */
		

					
			
			.menu-item-object-page a {
				color: gray;
			}
			
			#menu li.page_item {
				clear: left;
				list-style: none;
				
				overflow: hidden;
			}
			
			#menu li.page_item a{
				color: gray;
			}
			
			#menu li a  {
			
			/*
			an other good selector for menu item
			li.menu-item a */
			text-decoration: none;
			
			
			text-decoration: none;
			line-height: 1.4em;
			margin-bottom: 10px;
			text-decoration: none;
			
			/* this padding avoid the text moves on mouse over. and is the same specified above for on mouse hover */
			padding: 0.3em;
			padding-right: 0.4em;
			clear: left;
			float: left;
		}
		
				
		
		/* ACTIVE MENU BACKGROUND */
		
		#menu a:hover, .current-menu-item > a, .current_page_item > a, .active_menu {
			
			background: black;
			
			color: white !important;
			
			clear: left;
			
			/* this padding avoid the text moves on mouse over.*/
			padding: 0.3em;
			padding-right: 0.4em;
			float: left;
		}
		
	
		/* PROJECTS CATEGORY TITLES MENU */
		
		#menu .parent-item {
			font-weight: bold;
			margin-bottom: 10px;
		}
		
		#menu ul.parent-tab {
			width: 100%;
			float: left;
			padding-bottom: 0;
			text-align: left;
			
			overflow: hidden;
		}
		
		
		/* CUSTO WP MENU */
		
		li.menu-item {
			float: left;
			clear: left;
		}
		
		.menu {
			float: left;
		}
		
		.menu-item {
			float: left;
			clear: left;
		}
		
		
				
		/* SUB-MENU */
		
		ul.sub-menu {
			
			padding-left: 10px;
		}
		
		.menu-item-has-children:hover>ul.sub-menu {
			display: block;
		}
		
		
		ul.children {
			padding-left: 10px;
		}
				
						
		/* ************************ */
		/*		  MOBILE MENU	
		/* ************************ */	
		
		button.mobile-nav-toggle {
		
			display: none;
		
			position: absolute;
			right: 20px;
			top: 20px;
			
			padding: 10px;
			
			border: none;
			
			 /* Safari 3-4, iOS 1-3.2, Android 1.6- */
			  -webkit-border-radius: 3px; 
			  /* Firefox 1-3.6 */
			  -moz-border-radius: 3px; 
			  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
			  border-radius: 3px; 
			
			background-color: black;
			color: white;
			font-weight: bold;
			
			cursor: pointer;
		}
		
		button.mobile-nav-toggle:active {
			background-color: gray;
		}
		
		
				
				
				
				
/* ------------------------------------ */
/* -------------- GALLERY ------------- */
/* ------------------------------------ */

	
		/* avoid flickering when changing image */
		.gallery .slideshow span {
		  padding-top: 0 !important;
		}
		
		.gallery .slideshow span img{
		 	max-height: 99%;
		 }
		 
		 .gallery .slideshow, .gallery div.thumbs {
		  width: 100%;
		  height: 610px;
		  
		  
		  position: absolute;
		  top: 50px;
		  left:0px;
		}
		
		.gallery .slideshow-caption{
			position: relative;
			font-size: 10px;
			line-height: 15px;
			left: 0;
			float: left;
			top: 15px;
		}
		
		.gallery .navi{
			position: relative;
			top:6px;
			left:0px;
			width:100%;
			float: left;
		}

		
		.gallery .navi a{
			
			margin-right:5px;
			float:left;
			
			text-decoration: none;
			font-size: 14px;
			
			
		}
		
		
		/* Thumbnails */

			.gallery .thumbs ul li {
			
				list-style: none;
				
				
				width: 16% !important;
				height: auto !important;
								
				margin-bottom: 10px;
				margin-right: 4% !important;
				
				float: left;
				
				max-height: 120px !important;
				overflow: hidden;
				
				}

			
			#thumbnail span img:hover {
				opacity: 0.8 !important;
			}
			
			a#thumbnail.activeSlide {
				opacity: 0.8;
				float: left;
			}
			
			/* the_content of the project in gallery format */
			#content_project {
				float: left;
				margin-top: 40px;
			}
											
										
										
										/*
	
	#content_project{
		margin-top: 40px;
		float: left;
	}
	
	
		//define a width to avoid an issue on firefox
		.slideshow span {
			width: 800px;
		}
		
		.gallery, .gallery .slideshow, .gallery div.thumbs {
		  width: 800%;	
		  height: px;
		}
		
		
		
		a.post-edit-link {
			position: absolute;
			top: 0;
			right: 0;
			background-color: #d0ffd0;
			padding: 5px;
			font-size: 10px;
		}
		
		.gallery .slideshow img{
		
			position:absolute;
			
			
			//max-width: 800px;
			
			
			max-width: 100%;
			
			width: auto;
			max-height: 600px;
		}
		
		.gallery .slideshow-caption{
			position: relative;
			font-size: 10px;
			line-height: 15px;
			left: 0;
			float: left;
			top: 15px;
		}
		
		
		a#thumbnail img{
			width: 100%;
			height: auto;
			float: left;
		}
		
		#thumbnail {
			display: inline-block;
			float: left;
			height: 100%;
			width: auto;
			overflow: hidden;
		}
		
	
		a.remove.first {
			display: none;
		}
		
		.gallery .navi{
			position: relative;
			top:6px;
			left:0px;
			width:100%;
			float: left;
		}
		
		.controls.navi a{
			margin-right:5px;
			float:left;
			//text-indent:-9999px;
		}
		
		.gallery .navi a{
			text-decoration: none;
			font-size: 14px;
		}

	
		#echoimg{
			width: 400px;
			height: 400px;
			position: absolute;
			top: 0;
			left: 0;
			background-color: orange;
		}
		
	
	
	*/
	
		
	
	






/* ---------------------------- */
/* 		  page template home
/* ---------------------------- */
	
	
	
	#home_single_cover img {
		height: 100%;
		width: auto;
	}
	
	#home_single_cover {
		overflow: hidden;
		height: 100%;
		background-position: center;
		background-size: cover;
	}
	
	.page-template-template-home-php #body-right {
		margin-top: 0px;
		width: 80%;
	}


/* ---------------------------- */
/* 		 	Blog
/* ---------------------------- */

a#cancel-comment-reply-link {
	margin-bottom: 10px;
	display: inline-block;
}

#commentform p {
	
}

#respond {
		float: left;
		width: 100%;
	margin-left: 20px;
	margin-top: 20px;
	padding-bottom: 50px;
}
	
	#body-right ol.commentlist {
		float: left;
		width: 100%;
	}
	
	#respond textarea#comment {
		margin-bottom: 20px;
	}
	
	textarea#comment {
		padding: 10px;
	}
	
	input#submit {
			
		padding: 10px;
		border: none;
		
		 /* Safari 3-4, iOS 1-3.2, Android 1.6- */
		  -webkit-border-radius: 3px; 
		  /* Firefox 1-3.6 */
		  -moz-border-radius: 3px; 
		  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
		  border-radius: 3px; 
		
		background-color: black;
		color: white;
		font-weight: bold;
		
		cursor: pointer;
		
	}
	
	
/* --------------------------------------------- */
/* -------------- VARIOUS ELEMENTS ------------- */
/* --------------------------------------------- */



	.screen-reader-text { position: absolute; left: -9999px; top: -9999px; }
	.clear { clear: both; }
	.group:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
	* html .group, *:first-child+html .group { zoom: 1; } /* First selector = IE6, Second Selector = IE 7 */
	

	
	#page-wrap-full {
		width: 100%;
	}
	

	ul, ol {
		margin: 0 0 0 0;
		list-style: none;
	}
	
	div.description {
		margin-bottom: 30px;
		font-size: 11px;
		float: right;
		color: silver;
	}
	
	.post {
		display: block;
		/*max-width: 650px;*/
		float: left;
		width: 100%;
		margin-bottom: 40px;
		margin-left: 20px;
	}
	
	




	.entry a { }
	.entry a:hover { }
	
	pre { }
	code, tt { }
	
	#meta { }
	.postmetadata { }
	
	#sidebar {
		float: left;
	}
	
	.navgation { }
	   .next-posts { }
	   .prev-posts { }
	
	#searchform { }
		#s { }
		#searchsubmt { }
		
	ol.commentlist { list-style: none;
	}
	
	h2#comments {
		float: left;
		width: 100%;
	}
	
	ol.commentlist li { }
	ol.commentlist li.alt { }
	ol.commentlist li.bypostauthor { }
	ol.commentlist li.byuser { }
	ol.commentlist li.comment-author-admin { }
	ol.commentlist li.comment { border-bottom: 1px dotted #666; padding: 10px; }
	ol.commentlist li.comment div.comment-author { }
	
	em.comment-awaiting-moderation {
		display: inline-block;
		margin-bottom: 10px;
	}
	
	ol.commentlist li.comment div.vcard {
		margin-bottom: 10px;
	}
	ol.commentlist li.comment div.vcard cite.fn { font-style: normal; }
	ol.commentlist li.comment div.vcard cite.fn a.url { }
	ol.commentlist li.comment div.vcard img.avatar { float:right; margin: 0 0 10px 10px; }
	ol.commentlist li.comment div.vcard img.avatar-32 { }
	ol.commentlist li.comment div.vcard img.photo { }
	ol.commentlist li.comment div.vcard span.says { }
	ol.commentlist li.comment div.commentmetadata { }
	ol.commentlist li.comment div.comment-meta { font-size: 10px;
		margin-bottom: 10px;
	}
	ol.commentlist li.comment div.comment-meta a { color: #ccc; }
	ol.commentlist li.comment p { }
	ol.commentlist li.comment ul { }
	ol.commentlist li.comment div.reply { font-size: 11px; }
	ol.commentlist li.comment div.reply a { font-weight: bold; }
	ol.commentlist li.comment ul.children { list-style: none; margin: 10px 0 0; }
	ol.commentlist li.comment ul.children li { }
	ol.commentlist li.comment ul.children li.alt { }
	ol.commentlist li.comment ul.children li.bypostauthor { }
	ol.commentlist li.comment ul.children li.byuser { }
	ol.commentlist li.comment ul.children li.comment { }
	ol.commentlist li.comment ul.children li.comment-author-admin { }
	ol.commentlist li.comment ul.children li.depth-2 { border-left: 5px solid #555; margin: 0 0 10px 10px; }
	ol.commentlist li.comment ul.children li.depth-3 { border-left: 5px solid #999; margin: 0 0 10px 10px; }
	ol.commentlist li.comment ul.children li.depth-4 { border-left: 5px solid #bbb; margin: 0 0 10px 10px; }
	ol.commentlist li.comment ul.children li.depth-5 { }
	ol.commentlist li.comment ul.children li.odd { }
	ol.commentlist li.even { background: #fff; }
	ol.commentlist li.odd { background: #f6f6f6; }
	ol.commentlist li.parent { border-left: 5px solid #111; }
	ol.commentlist li.thread-alt { }
	ol.commentlist li.thread-even { }
	ol.commentlist li.thread-odd { }
	
	form { }
	input[type=text] { }
	textarea { }



	/* -------------------------------- */
	/* -------- Loading Sprite -------- */
	/* -------------------------------- */
	
		a.loading {
			width:20px;
			height:20px;
	
			background-image: url('images/loader2.gif');
			position: absolute;
			right: 10px;
			top: 10px;
		}
		
		
		#echoimg{
			width: 400px;
			height: 400px;
			position: absolute;
			top: 0;
			left: 0;
			background-color: orange;
		}
	
	/* ---------------------------- */
	/* 			  ICONS
	/* ---------------------------- */
		     
		    .show-icon
		    {
		      font-family: "fontello";
		      font-style: normal;
		      font-weight: normal;
		      speak: none;
		     
		      display: inline-block;
		      text-decoration: inherit;
		      width: 1em;
		      margin-right: .2em;
		      text-align: center;
		      /* opacity: .8; */
		     
		      /* For safety - reset parent styles, that can break glyph codes*/
		      font-variant: normal;
		      text-transform: none;
		     
		      /* fix buttons height, for twitter bootstrap */
		      line-height: 1em;
		     
		      /* Animation center compensation - margins should be symmetric */
		      /* remove if not needed */
		      margin-left: .2em;
		     
		      /* You can be more comfortable with increased icons size */
		      /* font-size: 120%; */
		     
		      /* Font smoothing. That was taken from TWBS */
		      /* -webkit-font-smoothing: antialiased; */
		      -moz-osx-font-smoothing: grayscale;
		     
		    }

		/* ---------------------------- */
		/* VIDEO
		/* ---------------------------- */
	     		
			.media-container {
				position: relative;
				padding-bottom: 56.25%;
				height: 0;
				overflow: hidden;
			        width:100%;
			}
			
			.media-container iframe,  
			.media-container object,  
			.media-container embed {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
			}


		/* ---------------------------- */
		/* WordPress Generated Classes
		/* ---------------------------- */
 		
	 		/* =WordPress Core
	 		-------------------------------------------------------------- */
	 		.alignnone {
	 		    margin: 5px 20px 20px 0;
	 		}
	 		
	 		.aligncenter,
	 		div.aligncenter {
	 		    display: block;
	 		    margin: 5px auto 5px auto;
	 		}
	 		
	 		.alignright {
	 		    float:right;
	 		    margin: 5px 0 20px 20px;
	 		}
	 		
	 		.alignleft {
	 		    float: left;
	 		    margin: 5px 20px 20px 0;
	 		}
	 		
	 		a img.alignright {
	 		    float: right;
	 		    margin: 5px 0 20px 20px;
	 		}
	 		
	 		a img.alignnone {
	 		    margin: 5px 20px 20px 0;
	 		}
	 		
	 		a img.alignleft {
	 		    float: left;
	 		    margin: 5px 20px 20px 0;
	 		}
	 		
	 		a img.aligncenter {
	 		    display: block;
	 		    margin-left: auto;
	 		    margin-right: auto
	 		}
	 		
	 		.wp-caption {
	 		    background: #fff;
	 		    border: 1px solid #f0f0f0;
	 		    max-width: 96%; /* Image does not overflow the content area */
	 		    padding: 5px 3px 10px;
	 		    text-align: center;
	 		}
	 		
	 		.wp-caption.alignnone {
	 		    margin: 5px 20px 20px 0;
	 		}
	 		
	 		.wp-caption.alignleft {
	 		    margin: 5px 20px 20px 0;
	 		}
	 		
	 		.wp-caption.alignright {
	 		    margin: 5px 0 20px 20px;
	 		}
	 		
	 		.wp-caption img {
	 		    border: 0 none;
	 		    height: auto;
	 		    margin: 0;
	 		    max-width: 98.5%;
	 		    padding: 0;
	 		    width: auto;
	 		}
	 		
	 		.wp-caption p.wp-caption-text {
	 		    font-size: 11px;
	 		    line-height: 17px;
	 		    margin: 0;
	 		    padding: 0 4px 5px;
	 		}
	 		
	 		/* Text meant only for screen readers. */
	 		.screen-reader-text {
	 			clip: rect(1px, 1px, 1px, 1px);
	 			position: absolute !important;
	 			height: 1px;
	 			width: 1px;
	 			overflow: hidden;
	 		}
	 		
	 		.screen-reader-text:focus {
	 			background-color: #f1f1f1;
	 			border-radius: 3px;
	 			box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	 			clip: auto !important;
	 			color: #21759b;
	 			display: block;
	 			font-size: 14px;
	 			font-size: 0.875rem;
	 			font-weight: bold;
	 			height: auto;
	 			left: 5px;
	 			line-height: normal;
	 			padding: 15px 23px 14px;
	 			text-decoration: none;
	 			top: 5px;
	 			width: auto;
	 			z-index: 100000; /* Above WP toolbar. */
	 		}
	 		
	 		.sticky{
	 			
	 		}
	 		
	 		.gallery-caption{
	 			
	 		}
			
	
	
/*==========  Non-Mobile First Method  ==========*/

    /* Large Devices, Wide Screens */
    @media only screen and (max-width : 1200px) {
		#header-left {
		}
		
    }

    /* Medium Devices, Desktops */
    @media only screen and (max-width : 992px) {
		#header-left {
		}
    }

    /* Small Devices, Tablets */
    @media only screen and (max-width : 768px) {
		
		button.mobile-nav-toggle {
			display: block;
		}
		
		
		
			/* ************************ */
			/*		 HEADER-LEFT M.Q.
			/* ************************ */
			
		
			#header-left {
				
			
				
			
				width: 100%;
				min-height: 70px;
				
				padding-top: 20px;
				padding-right: 20px;
				padding-left: 20px;
				clear: left;
				position: relative;
				
				border-bottom: 1px solid black;
			}
			

			
			#logo {
				width: 100%;
				text-align: left;
				margin-top: 4px;
				margin-bottom: 0px;
				padding-bottom: 0px;
			}
	
			#logo h1 a {
				text-align: center;
				margin: 0 auto;
				float: none;
				padding: 0;
				
			}
			
			
			/* MENU M.Q. */
	
	
			#menu {
			
				display: none;
				width: 100%;
				margin-top: 20px;
			}
			
			#menu li a  {
				
				width: 100%;
				
				/*
				an other good selector for menu item
				li.menu-item a */
				text-decoration: none;
				
				
				text-decoration: none;
				line-height: 1.4em;
				margin-bottom: 10px;
				text-decoration: none;
				
				/* this padding avoid the text moves on mouse over. and is the same specified above for on mouse hover */
				padding: 0.8em;
				padding-right: 0em;
				display: inline-block;
			}
			
			#menu a:hover, .current-menu-item > a, .current_page_item > a, .active_menu {
				
				background: black;
				
				color: white !important;
				
				clear: left;
				
				/* this padding avoid the text moves on mouse over.*/

				
				padding: 0.8em;
				padding-right: 0em;
				display: inline-block;
				
				
			}
    			
            		    			
                		    		    			
                		        			
                        			
            /* ************************ */
			/*		  BODY RIGHT M.Q.
			/* ************************ */
			
			#body-right {
				width: 100% !important;
				float: left;
				height: 100%;
				left: 0%;
				position: relative;
			}
	

	
			#body-right img {
				max-width: 100%;
				height: auto;
			}
	

	
			#body-right .post{
				width: 90%;
			}
	
	#respond {
		margin-left: 0;
		padding-left: 10px;
		padding-right: 10px;
	}
    			
    			
    			
    			
    		
    			/* ************************ */
			/*		  FOOTER M.Q.
			/* ************************ */	
		
			#footer {
				
				display: none;
			
				float: left;
				font-size: 10px;
				color: gray;
				width: 100%;
				position: relative;
				bottom: 0;
				left: 0;
				border-top: 2px solid gray;
			}
	
			#footer_text {
				padding: 10px;
			}
			
			/* ------------ */
			/* GALLERY M.Q. */
	
			div.thumbs {
				padding-left: 20px;
				padding-right: 20px;
				
				width: auto !important;
				height: auto !important;
				
				position: absolute;
				top: 40px;
				left:0px;
				
			}
			
			.gallery .slideshow span  {
				padding-left: 20px;
				padding-right: 20px;
			}
			
			.gallery {
				padding-left: 20px;
				padding-right: 20px;
			}
			
			.gallery div.thumbs ul li  {
				width: 30% !important;
				margin-right: 3% !important;
			}

			
	}
	

    /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 480px) {
		#header-left {
		}
		
		#gallery div.thumbs ul li  {
			width: 45% !important;
			margin-right: 4% !important;
		}
		
    }

    /* Custom, iPhone Retina */ 
    @media only screen and (max-width : 320px) {
        #header-left {
        }
    }