p {
  /* color: #9a9a9a;  ORIGINAL */
  color: #1f2532;		/* JJazzLab (a bit darker) */
}

img[src$='#center']
{
    display: block;
    margin: 0.7rem auto; /* you can replace the vertical '0.7rem' by
                            whatever floats your boat, but keep the
                            horizontal 'auto' for this to work */
    /* whatever else styles you fancy here */
}

.single-page-header {
  padding: 10px 0;		/* original=50px 0 */
}

/** Padding of each section ! */
.section {
  padding: 70px 0;		/* original=100px 0 */
}

.section-sm {			/* small padding */
  padding: 50px 0;
}

.section-xs {			/* extra small padding */
  padding: 30px 0;
}

.section-xxs {			/* extra extra small padding */
  padding: 10px 0;
}

/*=================================================================
  Top navigation meny
==================================================================*/

.navigation .navbar-nav > li > a {
  color: #bdbdbd;			/* color of menu titles original #707d8f */
}


/*=================================================================
  Hero area
==================================================================*/

.hero-area {
  /* background: #1f2532; original  */
  background: url("../images/HeroBackgroundBig2.jpg");
  background-size: cover;    
}

.btn-main, .btn-main-sm {
  background-image: linear-gradient(100deg, #f9643d, #fe2a77);
  color: #fff;
}

.btn-main:hover, .btn-main-sm:hover {
  color: #f9f921;			/* JJazzLab yellow */
}



/*=================================================================
  Used for the home page features text
==================================================================*/

.services .service-block h3 {
  color: #1f2532;
  font-size: 18px; 
}

.services .service-block p {
	color: #1f2532 ;	 /* Don't know why can't inherit from the general p definition... */
}


/*=================================================================
  About us section: used for the 2 left/right image+text on homepage
==================================================================*/

.about .content {
  padding: 30px 0;
}


/* ======================================================================
  Documentation page container_doc sidenav_doc + main_doc
  ========================================================================*/
  
  .sidenav_doc {
  float: left; 
  width: 200px;
  height: auto; 
  background-color: #f9f9f9;  
  padding-top: 10px;
  padding-bottom: 10px;  
}

.sidenav_doc a {
  /* padding: 6px 8px 6px 16px; */
  padding: 5px;
  text-decoration: none;
  font-size: 14px;
  color: inherit;
  display: block;
}

.sidenav_doc a:hover {
  /* color: #f0326b; */
  background: #97d0f8;			/* light jjazz blue color */
  /* text-decoration: underline; */
}

.footer_doc {
	clear: both;
}

@media (max-width:576px) {
  .sidenav_doc {
    float: none;        /* main content will switch below the menu for smallest screens */
  }
}


@media screen and (max-height: 450px) {
  .sidenav_doc {padding-top: 15px;}
  .sidenav_doc a {font-size: 11px;}
}

/* ======================================================================
  Documentation page container_doc main_doc
  ========================================================================*/


.main_doc {
	width: auto;
	float:none;
	overflow: hidden;   /* important ! otherwise text will flow below the menu */ 
	padding: 0px 5px 0px 30px;	/* top right bottom left */
}

.main_doc p {
	margin: 5px 0px 10px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 16px;
}

.main_doc h1 {						/* should be used only for top page title */
	font-size: 32px;
	font-weight: bold;
	background: #1494ef;			/* JJazLab blue */
	color: #fff;
	margin: 0px 0px 20px 0px;	
	padding: 0px 0px 4px 10px;		/* top right bottom left */
}

.main_doc h2  {
	font-size: 28px;
	font-weight: bold;
	margin: 40px 0px 10px 0px;	
	padding: 00px 0px 0px 0px;
}

.main_doc h3 {
	font-size: 20px;
	font-weight: bold;
	margin: 30px 0px 5px 0px;	
	padding: 0px 0px 0px 0px;
}

.main_doc h2 + h3 {						/* h3 when it's right after h2 */
	margin: 20px 0px 10px 0px;	
}

.main_doc ul, ol {
	margin: 0px 0px 25px 0px;	
	padding: 0px 0px 0px 0px;
}

.main_doc ul {
  list-style: disc;
}

.main_doc ol {
	list-style: decimal;
}

.main_doc li {
	margin: 5px 0px 0px 30px;	
	padding: 0px 0px 0px 0px;
}

/* Hugo TOC for FAQ only works with H1 headers 
 * Make H1 equals H3 settings */
.doc_toc h1 {	
	background: none;
	color: #1f2532;
	font-size: 16px;	
	font-weight: bold;
	margin: 30px 0px 5px 0px;	
	padding: 0px 0px 0px 0px;
}


/*=================================================================
  LatestNews 2 section
==================================================================*/
.latestnews {
  background-color: #ffa535;
}

.latestnews h5 {
  position: relative;
}



/*=================================================================
  Footer section
==================================================================*/
.top-footer {
  /* background-color: #222222; original */
    background-color: #1f2532;
  /*padding: 100px 0 80px;   original */
  padding: 50px 0 30px;
}


.footer-bottom {
  /* background-color: #1b1b1b;  Original */
  background-color: #2a2532;
}

/* ====================================================================
  Panels for shortcode
  =====================================================================*/
  
.panel {
  margin-bottom: 2rem;
  margin-left: 2rem;
  margin-right: 3rem;
  padding: 1rem;
  color: #292932;
}

.panel-header h3 {
  margin: 0;
  margin-bottom: 1.6rem;
}

.panel-body {
  color: #292932;
}

.panel-body p {
  color: #292932;
}
	

.panel-primary {
  border: 1px solid #f0f0f0;
}

.panel-notice {
  background: #e67e22;
}

.panel-warning {
  background: #ddd5d2;
}

/* ====================================================================
  Emoji font for various OS
  =====================================================================*/

.emoji {
    font-family: Apple Color Emoji,Segoe UI Emoji,NotoColorEmoji,Segoe UI Symbol,Android Emoji,EmojiSymbols;
  }