/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 General and reset
2.0 Header
		2.1 Logo
		2.2 Menu
3.0 Footer
4.0 The content
5.0 Helpers
6.0 Forms
7.0 Tables
8.0 Lists
9.0 Wp & plugins elements
10.0 Blog
11.0 
12.0 Comments
13.0 Sidebar
14.0 Contact form
15.0 Fullwidth page template

99.0 Tests & tmp
--------------------------------------------------------------*/








/*------------------------------
1.0 General and reset
------------------------------*/

	/*html & body*/
	html, body { 
		height: 100%;
		color:#333;
		font-family: "Open Sans", Helvetica, Arial, sans-serif;
		font-size: 13px;
		line-height: 15px;
	}

	/*headings*/
	h1, h2, h3, h4, h5, h6 {
		font-weight: 500;
		color:#535353;
		/*text-transform: uppercase;*/
	}

	h1 { font-size: 26px; }
	h2 { font-size: 22px; }
	h3 { font-size: 18px; }
	h4 { font-size: 14px; }
	h5 { font-size: 12px; }
	h6 { font-size: 12px; }

	/*links*/
	body a { color: #007FBF; }
	body a:hover { text-decoration: underline; }

	/*image defaults*/
	img {
	  height: auto;
	  max-width: 100%;
	  vertical-align: baseline; /*override bootstrap's default*/
	}

	/*break text into new lines*/
	.break, h1, h2, h3, h4, h5, h6, 
	p, ul, ol, dl, blockquote {
	  word-break: break-word;
	  word-wrap: break-word;
	}

	/*no focus for any element, it's ugly*/
	body :focus { outline: none !important; } /*no border around clicked links*/

	/*for iframes (specially youtube videos)*/
	/*iframe { width: 100% !important; }*/

	/*quotes*/
	body blockquote { border-left: 5px solid #dfecf2; }
	body blockquote p { margin-bottom: 5px; }
	body blockquote cite { 
		font-size: 14px;
		color: #777;
	}

	/*backToTop*/
	a#backToTop {
		position: fixed; 
		bottom: 12px; 
		right: 15px;
		font-size: 25px;
		display: none;
		z-index: 9999999999999999999999;
	}


	/*.container width 100% up to 992px (includes xs & sm)*/
	@media screen and (max-width: 992px) {
		body .container {
		  max-width: 100%;
		}
	}











/*------------------------------
2.0 Header
------------------------------*/

	/*<header>*/
	header {
		height:50px;
		background-color: white;
		/*border-bottom: 1px solid #ccc;*/
		margin-bottom: 20px;
	}
	
	/*adminBar position (not for blank page template)*/
	body:not(.page-template-template_page_blank-php) #wpadminbar { position: initial; }











/*------------------------------
2.1 Logo
------------------------------*/

	/*.logo { font-weight: bold; font-size: 16px; }
	.logo span:first-child { color: #555; }
	.logo span:last-child { color: #007FBF; padding-left: 0; }
	.logo a:hover { text-decoration: none; }

	.logo_inverted { font-weight: bold; font-size: 17px; }
	.logo_inverted span:first-child { color: #FFF; }
	.logo_inverted span:last-child { color: #999; padding-left: 3px; }
	*/








/*------------------------------
2.2 Menu
------------------------------*/

	nav.navbar { 
		margin:0;
		min-height: 1px;
	}

	/*both mobile & PC ***********************************/
	
	/*active submenu font color*/
	#main_menu .dropdown-menu li.active a { color:white; }

	/*remove default "ul li" margin*/
	#main_menu > ul li { margin: 0; }

	/*for mobile ****************************************/
	@media screen and (max-width:767px) {
		
		#main_menu_container { /*padding-top:11px;*/ }
		
		nav.navbar { position: initial; }
		nav.navbar .navbar-toggle { 
			margin:0;
			padding: 7px 10px; /*overriding bootstrap*/
		}
		nav.navbar .navbar-toggle .icon-bar { background-color: #888; }

		#main_menu { 
			position: absolute; /*by default, the menu does not float over content*/;
			top: 49px;
			left: 15px;
			right: 15px;
			
			background-color: #f8f8f8;
			border: 1px solid #ccc;
			padding: 0 !important;
			z-index: 1;
		}

		#main_menu > ul { margin:0; }

		/*item bottom border*/
		#main_menu ul li:not(:last-child) {
			border-bottom: 1px solid #e7e7e7;
		}

		/*link*/
		#main_menu > ul li a { color: #555; }

		/*submenus **********/

		#main_menu .dropdown-menu > li > a { padding: 10px 15px 10px 25px; }

	}


	/*for PC ****************************************/
	@media screen and (min-width:768px) {
		
		#main_menu_container { /*padding-top:15px;*/ }
		
		#main_menu.navbar-collapse { padding-right: 0; }
		#main_menu > ul > li > a.dropdown-toggle span.caret { color: #999; }
		
		/*no bg*/
		#main_menu > ul > li >a, 
		#main_menu > ul > li >a:focus, 
		#main_menu > ul > li >a:hover {
			background: none;
		}
		
		/*menu item*/
		#main_menu > ul > li {
			/*height:16px;*/
			line-height: initial;
			overflow: visible; 
			padding:0 7px;
		}
		/*menu item separator*/
		#main_menu > ul > li:not(:last-child) { border-right: 1px solid #e7e7e7;	}
	
			/*menu item link*/
			#main_menu > ul li a {
				margin: 0; 
				padding: 0; 
				font-size: 13px;
				line-height: 13px;
				color: #555;
				text-decoration: none;
				/*text-transform: uppercase;*/
			}

		/*submenus **************/

		#main_menu .dropdown-menu { 
			padding: 0;
			/*top: calc(100% + 10px) !important;*/
			right: 0 !important;
			left: initial !important;
		}
		#main_menu .dropdown-menu li:not(:last-child) {
			border-bottom: 1px solid #dddddd;
		}

		#main_menu .dropdown-menu li a {
			padding: 8px;
		}
		
		#main_menu .dropdown-menu li:hover {
			background-color: #f4f4f4;
		}

	}









/*------------------------------
3.0 Footer
------------------------------*/

	footer {
		padding:15px 0 15px 0;
		background-color: #333;
		border-bottom:4px solid #006A9D;
	}
	footer .social_icons { margin-right: 30px; }
	footer .social_icons i {
		margin-right: 8px;
		font-size: 18px;
	}

	footer .copy p { line-height: 18px; } /*same height icons*/
	
	@media screen and (max-width: 400px) {
		footer .copy { max-width: 150px; }
	}










/*------------------------------
4.0 The content
------------------------------*/

	/*<main>*/
	body main {
		/*flex items parent*/
		display: flex;
		flex-direction: column;
		
		width: 100%;
		padding:0; /*no default padding pls, I have my own rules*/

		/*set height (default with no adminBar)*/
		height: calc(100vh);
		overflow-y: scroll;		
	}
	/*main #main_content: for sticky footer*/
	body main #main_content { flex: 1; } /*just for the first item so it respects it's next items*/

	/*has adminBar on PC? Override height*/
	body.admin-bar main {
		/*height: calc(100vh - 92px);*/
	}
	
	/*has adminBar on mobile? Override height again*/
	/*@note: On mobile adminBar height is 46px, on PC is 32px*/
	@media screen and ( max-width: 782px ) {
		/*html body.admin-bar main {
			height: calc(100vh - 106px);
		}*/
	}
	
	
	.entry-content { margin-bottom: 10px; }

	.entry-content:after {
		clear: both;
		content: ' ';
		display: block;
	}
	.entry-footer,
	.entry-comments { 
		border-top: 1px solid #ccc;
		padding: 20px 0;
	}

	#pagination { 
		text-align: center;
		margin:20px 0;
	}

	#pagination .page-numbers {
		padding:5px 9px;
		border:1px solid #ccc;
		border-radius: 2px;
		margin:0 4px;
	}

	#pagination .page-numbers.current,
	#pagination .page-numbers.dots {
		background-color: #f4f4f4;
	}









/*------------------------------
5.0 Helpers
------------------------------*/

	.clear { 
		display: block;
		content: ' ';
		clear: both;
	}

	.clear_after:after {
		display: block;
		content: ' ';
		clear: both;
	}

	hr { margin:15px 0; }

	/*fontawesome icons *************/
		
		/*defaults*/
		i.fa, i.fas, i.far, i.fab { color: #999; }

		/*circle bg*/
		body .icon_circle_bg {
	    background-color: #555;
	    color: white;
	    border-radius: 50%;
	    display: inline-block;
		  text-align: center;
		  vertical-align: middle;

	    font-size: 		12px;
	    width:  			20px; 
	    height: 			20px;
	    line-height:  20px; /*when customizing use the same line-height as height*/
	  }
	   .icon_circle_bg:before { line-height: inherit; }










/*------------------------------
6.0 Forms
------------------------------*/

	/*submit and buttons*/
	body input[type="submit"],
	body button {
	    cursor: pointer;
	    background: #337ab7;
	    border: none;
	    display: inline-block;
	    color: white;
	    letter-spacing: 1px;
	    text-align: center;
	    border-radius: 2px;
	    text-decoration: none;

			font-family: inherit;
	    font-size: inherit;
	    line-height: inherit;
	    padding: 4px 8px;
	}
	/*buttons with icons*/
	body input[type="submit"]::before,
	body button i { color: white !important; }

	/*fields*/
	textarea:not(.editor-post-title__input), 
	input[type="date"], 
	input[type="datetime"], 
	input[type="datetime-local"], 
	input[type="email"], 
	input[type="month"], 
	input[type="number"], 
	input[type="password"], 
	input[type="search"], 
	input[type="tel"], 
	input[type="text"], 
	input[type="time"], 
	input[type="url"], 
	input[type="week"],
	select {
		padding: 3px !important;
		border: 1px solid #cccccc !important;
		background-color: #f8f9f9 !important;
	}


	label {
		display: block;
		color: #555;
		font-weight: normal;
		font-size: 12px;
		margin-bottom: 0;
	}











/*------------------------------
7.0 Tables
------------------------------*/

	main table {
	  margin-bottom: 20px;
	  border: 1px solid #e9e9e9;
	  border-collapse: collapse;
	  border-spacing: 0;
	}

	main table th, 
	main table td {
	  border: 1px solid #e9e9e9;
	  line-height: 1.42857;
	  padding: 5px;
	  vertical-align: middle;
	}

	main table > thead > th { border-bottom-width: 2px; }

	main table th {
	  font-size: 13px;
	  letter-spacing: 1px;
	  text-transform: uppercase;
	}











/*-----------------------------
8.0 Lists
------------------------------*/

	main ul,
	main ol { padding-left: 20px; }

	main ul { list-style: disc; }
	main ol { list-style: decimal; }

	main ul li, 
	main ol li { margin: 8px 0; }












/*------------------------------
9.0 Wp & plugins elements
------------------------------*/

	.wp-caption {
	  max-width: 100%;
	  font-style: italic;
	  line-height: 1.35;
	  margin-bottom: 15px;
	  margin-top: 5px;
	}
	.wp-caption img[class*="wp-image-"] {
	  display: block;
	  max-width: 100%;
	}
	.wp-caption .wp-caption-text {
	  margin: 10px 0px;
	}

	.wp-caption-text,
	.entry-thumbnail-caption,
	.cycle-caption {
	  font-style: italic;
	  line-height: 1.35;
	  font-size: 13px;
	}
	
	/*wp default "edit this" link*/
	.edit_in_admin { padding: 5px 0 2px 15px; }
	.edit_in_admin a::before {
		font-family: "FontAwesome5_solid";
		content: "\f044";
		display: inline-block;
		margin-right: 4px;
	}








/*------------------------------
10.0 BLog
------------------------------*/

body.blog .post .post_thumbnail { float: left; }
body.blog .post .post_info { 
	overflow: hidden;
	padding-left: 20px;
}
























/*------------------------------
12.0 Comments
------------------------------*/
/*@note: I'm leaving comments here because pingbacks/trackbacks won't load a PHP comments-conditional CSS file*/

	/*Comments list ***********************/

	ol.commentlist li { list-style-type: none !important; }

	/*reset <ol> default left padding*/
	ol.commentlist { padding-left: 0; }

	ol.commentlist div.comment_content {
		padding: 5px 10px 10px 10px; 
		background-color: #f8f9f9;
		float: none; 
		overflow: hidden;
	}

	ol.commentlist div.comment_avatar { margin-right: 10px; }

	ol.commentlist .comment_body p { 
		margin:0;
		font-size: 13px;
	}
	ol.commentlist .reply a { font-size: 12px; }

	ol.commentlist .comment_meta { font-size: 12px; color: #888; padding-left: 5px; }

	/*child comments ********************/
		
	/*image sizes (by override)*/
	ol.commentlist ul.children div.comment_avatar img { width: 40px; height: 40px; }
	ol.commentlist ul.children ul.children div.comment_avatar img { width: 30px; height: 30px; }

	/*sub-comments left indentation (same for all childs)*/
	ol.commentlist ul.children { padding-left: 10px; }


	/*Comments form **********************/

	#comments-form form > p { margin-bottom: 20px; }









/*------------------------------
13.0 Sidebar
------------------------------*/









/*------------------------------
14.0 Contact form
------------------------------*/
	
	/*mark error fields*/
	form#contact_form .ajax_field.error {
		border:1px solid red;
	}

	/*text errors from ajax*/
	form#contact_form .field_errors {
		margin:5px 0 0 5px;
		color:#d94e4e;
		font-size: 12px;
	}
	form#contact_form .field_errors div::before {
		font-family: "FontAwesome5_solid";
		content: "\f06a";
		display: inline-block;
		margin-right: 4px;
	}

	/*submit btn*/
	form#contact_form button[type="submit"] { padding: 8px 12px; }
	form#contact_form button[type="submit"]:disabled { background-color: #cdcdcd; }











/*------------------------------
15.0 Fullwidth page template
------------------------------*/


















/*------------------------------
99.0 Tests & tmp
------------------------------*/

	/*image alignment (accesibility)*/
	/*@todo Move to helpers or wp-elements*/

	.alignleft {
	  float: left;
	  margin-right: 20px;
	}

	.alignright {
	  float: right;
	  margin-left: 20px;
	}

	.aligncenter {
	  clear: both;
	  display: block;
	  margin-left: auto;
	  margin-right: auto;
	}