
/* ////////////////////////////////////////////////////   HELP   ////////////////////////////// */
/*
          ##     ## ######## ##       ########
          ##     ## ##       ##       ##     ##
          ##     ## ##       ##       ##     ##
          ######### ######   ##       ########
          ##     ## ##       ##       ##
          ##     ## ##       ##       ##
          ##     ## ######## ######## ##

FLEX:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
CHARSET:
https://www.toptal.com/designers/htmlarrows/
ASCII TEXT ART:
http://patorjk.com/software/taag/#p=display&h=0&f=Banner3&t=GALLERY
FontAwesome	-	https://fontawesome.bootstrapcheatsheets.com/
*/

/* RWD: */

/* /////////////////////////////   RESPONSIVE   ///////////////////////////// */

@media only screen and (max-width: 1280px) { /*----------  HD+  ----------------*/ }
@media only screen and (max-width: 1250px) { /*----------  HD  -----------------*/ }
@media only screen and (max-width: 1080px) { /*----------  DESKTOP  ------------*/ }
@media only screen and (max-width: 992px)  { /*----------  Laptop  -------------*/ }
@media only screen and (max-width: 880px)  { /*----------  Tablet  -------------*/ }
@media only screen and (max-width: 768px)  { /*----------  MOBILE  -------------*/ }
@media only screen and (min-width: 768px)  { /*----------  MOBILE (down)  ------*/ }
@media only screen and (max-width: 600px)  { /*----------  S  ------------------*/ }
@media only screen and (max-width: 480px)  { /*----------  XS  -----------------*/ }



/* ////////////////////////////////////////////////////   GENERAL   ////////////////////////////// */
/*
           ######   ######## ##    ## ######## ########     ###    ##
          ##    ##  ##       ###   ## ##       ##     ##   ## ##   ##
          ##        ##       ####  ## ##       ##     ##  ##   ##  ##
          ##   #### ######   ## ## ## ######   ########  ##     ## ##
          ##    ##  ##       ##  #### ##       ##   ##   ######### ##
          ##    ##  ##       ##   ### ##       ##    ##  ##     ## ##
           ######   ######## ##    ## ######## ##     ## ##     ## ########
*/

/* --------------------- headers ------------------------- */

h1,h2,h3,h4,h5,h6 { font-family: jost, "Roboto Condensed", sans-serif; font-style:italic; margin-bottom:0; font-weight:700; line-height:1.1; }
h1 { font-size: 3.2em; color:#97be0d; font-weight:700; text-transform: uppercase; }
h2 { font-size: 2.2em; color:#97be0d; font-weight:600; }
h3 { font-size: 1.5em; color:#97be0d; font-weight:500; }
h4, h5 { font-size: 1.1em; color:#000; font-weight:700; }
h6 { font-size: 1em; color:#000; font-weight:700; }

h1.title{ font-weight: 300; font-size: 2.5em; margin-bottom: 30px; }
h1.title span{ font-weight: 600 !important; }

/**  style dark  **/

.style-dark h1, .style-dark h2, .style-dark h3, .style-dark h4, .style-dark h5 { color:#fff !important; }

/* --------------------- paragraphs ------------------------- */

p { margin:1.2em 0 0 0; }
b, strong{ font-weight:700; }

.white { color:#fff; }
.comment{ color:rgba(40, 50, 78, 0.3); font-style:italic; }
.important{ color:#4b6f1f; font-weight:bold; font-size:1em; }
.quotation{ color:rgb(40, 50, 78); font-style: italic; }

/**  style dark  **/

.style-dark, .style-dark p { color:#fff !important; }
.style-dark .comment { color:rgba(255,255,255,0.6); }

/* --------------------- links ------------------------- */

a{ color: #97be0d; }
a:hover{ color: rgb(40, 50, 78); }

a, li{
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/**  style  **/

.dark a, .dark2 a { color: #97be0d; }

/**  style dark  **/

.style-dark .accordion:not(.bg-light) a{ color: rgba(255,255,255,0.8); }
.style-dark .accordion:not(.bg-light) a:hover{ color: #fff; }


/* /////////////////////////////   RESPONSIVE   ///////////////////////////// */

@media only screen and (max-width: 992px)  { /*----------  Laptop  -------------*/
  h1 { font-size: 3.2em; }
  h1.title { font-size: 3.6em; }
  h2 { font-size: 2.2em; }
  h3 { font-size: 1.4em; }
}
@media only screen and (max-width: 768px)  { /*----------  MOBILE  -------------*/
  h1 { font-size: 2.2em; }
  h1.title { font-size: 2.5em; margin-bottom: 20px; }
  h2 { font-size: 1.8em; }
  h3 { font-size: 1.4em; }
  h4 { font-size: 1.1em; }
}
@media only screen and (max-width: 600px)  { /*----------  S  ------------------*/
  h1 { font-size: 1.8em; }
  h1.title { font-size: 2em; }
  h2 { font-size: 1.4em; }
  h3 { font-size: 1.2em; }
  h4 { font-size: 1em; }
}
@media only screen and (max-width: 480px)  { /*----------  XS  -----------------*/
  h1 { font-size: 1.5em; }
  h1.title { font-size: 1.6em; }
  h2 { font-size: 1.2em; }
  h3 { font-size: 1em; }
  h4 { font-size: 0.9em; }
}



/* ////////////////////////////////////////////////////   LISTs   ////////////////////////////// */
/*
          ##       ####  ######  ########  ######
          ##        ##  ##    ##    ##    ##    ##
          ##        ##  ##          ##    ##
          ##        ##   ######     ##     ######
          ##        ##        ##    ##          ##
          ##        ##  ##    ##    ##    ##    ##
          ######## ####  ######     ##     ######
*/

.content ul, .content ol {
	list-style-type: none;
	padding-left: 1em;
	counter-reset: li;
}
.content ul > li, .content ol > li {
	position: relative;
	padding-left: 1.5em;
	margin-top: 1em;
	counter-increment: li;
}
.content ul > li::before {
	position: absolute;
	top: 0;
	left: 0;
	font-family: FontAwesome;
	content: "\f105";
	color: #97be0d;
}
.content ul.checklist > li::before {
	font-family: FontAwesome;
	content: "\f00c";
}
.content ol > li::before {
	position: absolute;
	top: 0;
	left: 0;
	font-family: "Roboto", sans-serif;
  font-weight: bold;
	content: counter(li) ".";
	color: #97be0d;
}
.content .lev-2 {
	padding-left: 2em;
	padding-top: 1em;
	font-size: 0.9em;
	counter-reset: li2;
}
.content .lev-2 > li {
	counter-increment: li2;
	margin-top: 0.6em;
}
.content ul.lev-2 > li::before {
	font-family: "Roboto", sans-serif;
	content: "\2022";
}
.content ol.lev-2 > li::before {
	content: counter(li2, lower-latin) ")";
}
.content .lev-3 {
	padding-left: 4em;
	padding-top: 1em;
	font-size: 0.85em;
	counter-reset: li3;
}
.content .lev-3 > li {
	counter-increment: li3;
	margin-top: 0.2em;
}
.content ul.lev-3 > li::before {
	font-family: "Roboto", sans-serif;
	content: "\2013";
}
.content ol.lev-3 > li::before {
	content: counter(li3, lower-roman) ".";
}

/**  short  **/

.content ol.short, .content ul.short{
    margin-top: 1.2em;
}
.content ol.short > li, .content ul.short > li{
    margin-top: 0;
    font-size: 0.9em;
    line-height: 1.05;
}

/**  style  **/

*[class*="c-"] ul > li, *[class*="c-"] > li { color: rgb(40, 50, 78); }

/**  style dark  **/

.style-dark ul, .style-dark ol, .style-dark ul > li, .style-dark ol > li {
  color:#fff !important;
}


/* ////////////////////////////////////////////////////   IMAGES   ////////////////////////////// */
/*
          #### ##     ##  ######
           ##  ###   ### ##    ##
           ##  #### #### ##
           ##  ## ### ## ##   ####
           ##  ##     ## ##    ##
           ##  ##     ## ##    ##
          #### ##     ##  ######
*/

.content > .img{
  display: flex;
  flex-direction: column;
}
.img img{
	width:100%;
}
.img-circle{
  width: 10rem;
  height: 10rem;
  margin: 2rem auto -1em auto !important;
  padding: 1rem !important;
  border: 3px solid #f8f8f8;
  border-radius: 50% !important;
}
.img-circle img{
  border-radius: 50% !important;
  width: auto;
  max-width: 100%;
}
.section:nth-child(odd) .img-circle { border: 3px solid #f1f1f1; }

/* ////////////////////////////////////////////////////   BUTTONS   ////////////////////////////// */
/*
          ########  ######## ##    ##  ######
          ##     ##    ##    ###   ## ##    ##
          ##     ##    ##    ####  ## ##
          ########     ##    ## ## ##  ######
          ##     ##    ##    ##  ####       ##
          ##     ##    ##    ##   ### ##    ##
          ########     ##    ##    ##  ######
*/

/* container */

.btns{
	display:flex;
	align-items:flex-start;
	flex-wrap:wrap;
	margin-top:2em;
}
.btns a{
	margin:0 10px 10px 0;
}
.btns.center{
	justify-content: center;
  flex-direction: row;
}

/* btn */

.btn{
  position: relative;
	overflow: hidden;
	padding: 1rem 2.2rem;
	margin-bottom: 0.5rem;
	min-width:120px;

	color: #474b4f;
	background-color: #97be0d;
	border: 1px solid #97be0d;
	border-radius: 40px;
	box-shadow: 2px 4px rgba(0,0,0,0.1);
	outline-offset: -2px;

	font-family: jost, "roboto condensed", sans-serif;
	font-weight: 700 !important;
	font-size: 0.9em !important;
  font-style: italic;
	letter-spacing: 0.08rem;
	line-height: 1.1;

	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	vertical-align: middle;

	transition: all .25s ease-in-out;
	cursor: pointer;
}
.btn:hover{
	color: #97be0d;
	background-color: #222629;
	border-color: #222629;
}

/* btn with icon */

.btn.icon{
	padding: 1.2rem calc(2rem + 3em);
}
.btn.icon:not(.right){
  padding-right: 2rem;
}
.btn.icon.right{
  padding-left: 2rem;
}
.btn.icon i{
  font-size: 2em;
  position: absolute;
  top: 50%;
}
.btn.icon:not(.right) i{
  transform: translate(0%,-50%);
  left: 2rem;
}
.btn.icon.right i{
  transform: translate(0%,-50%);
  right: 2rem;
}
.btn p:first-of-type {
  margin-top: 0px !important;
}

/* btn - circle icon */

.btn-icon{
  min-width:1px;
  width: 4rem;
  height: 4rem;
  padding: 0 !important;
}
.btn-icon i{
  position: absolute;
  top: calc(50% - 1px);
  left: calc(50% + 1px);
  transform: translate(-50%, -50%);
  font-size: 1.6rem !important;
}

/**  style  **/

*[class*="bg-"] > .btn, .btn[class*="bg-"],
.style-dark *[class*="bg-"] > .btn:hover > i, .style-dark .btn[class*="bg-"]:hover > i,
.style-dark *[class*="bg-"] > .btn:hover span, .style-dark .btn[class*="bg-"]:hover span
{ color:#fff !important; }

*[class*="bg-"] > .btn:hover, .btn[class*="bg-"]:hover {
  background-color: #222629 !important;
  /*border-color: #222629 !important;*/
}
.style-dark *[class*="bg-"] > .btn, .style-dark .btn[class*="bg-"] {
    background-color: transparent !important; border-color: rgba(255,255,255,0.4) !important; }
.style-dark *[class*="bg-"] > .btn:hover, .style-dark .btn[class*="bg-"]:hover{ color:#fff !important; }

/**  style dark  **/

.style-dark .btn{
	color:white;
	background-color: transparent;
	border-color: rgba(255,255,255,0.4);
  border-width: 2px;
}
.style-dark .btn i{
  color: #97be0d;
}
.style-dark .btn span{
  color: #97be0d;
}
.style-dark .btn:hover{
	color:#fff;
	background-color: #97be0d;
	border-color: #97be0d;
}
.style-dark .btn:hover span, .style-dark .btn:hover i{
  color: #fff !important;
}


/* /////////////////////////////   RESPONSIVE   ///////////////////////////// */

@media only screen and (max-width: 768px)  { /*----------  MOBILE  -------------*/
  .btn{
    padding: 1rem 2rem;
    margin-bottom: 1rem;
    box-shadow: 3px 6px rgba(0,0,0,0.1);
    font-size: 1.1em !important;
  }
  .btn-icon{
    width: 3rem;
    height: 3rem;
  }
  .btn-icon i{
    font-size: 1.2rem !important;
  }
}
@media only screen and (max-width: 600px)  { /*----------  S  ------------------*/
	.btns a:not(.btn-icon){ margin: 0 0 10px 0; }
	.btn:not(.btn-icon){
		padding: 1rem;
		font-size: 1em !important;
		width: 100%;
	}
	.btn.icon{
    padding: 1rem calc(1.2rem + 2.8em);
	}
  .btn.icon:not(.right){ padding-right: 1.2rem; }
  .btn.icon.right{ padding-left: 1.2rem; padding-right: 2rem; }
  .btn.icon:not(.right) i{ left: 1.5rem; font-size:1.6em !important; }
  .btn.icon.right i{ right: 1.5rem; font-size:1.6em !important; }
}
@media only screen and (max-width: 480px)  { /*----------  S  ------------------*/
	.btn:not(.btn-icon){
		padding: 0.6rem 0.8rem;
		font-size: 0.8em !important;
	}
	.btn.icon{
    padding: 0.6rem calc(0.8rem + 2.5em);
	}
  .btn.icon:not(.right){ padding-right: 0.8rem; }
  .btn.icon.right{ padding-left: 0.8rem; padding-right: 2rem; }
  .btn.icon:not(.right) i{ left: 0.8rem; font-size:2em !important; }
  .btn.icon.right i{ right: 0.8rem; font-size:2em !important; }
}



/* ////////////////////////////////////////////////////   BLOCKQUOTE   ////////////////////////////// */
/*
          ########  ##        #######   ######  ##    ##
          ##     ## ##       ##     ## ##    ## ##   ##
          ##     ## ##       ##     ## ##       ##  ##
          ########  ##       ##     ## ##       #####
          ##     ## ##       ##     ## ##       ##  ##
          ##     ## ##       ##     ## ##    ## ##   ##
          ########  ########  #######   ######  ##    ##
*/

blockquote{
	background-color: #daeaf7;
	border-left: 4px solid #4b6f1f;
	margin: 2em 0;
	padding: 3em;
}

/**  style  **/

blockquote[class*="bg-"] { border-left-color: rgb(40, 50, 78) !important; color: #fff; }


/* /////////////////////////////   RESPONSIVE   ///////////////////////////// */

@media only screen and (max-width: 768px)  { /*----------  MOBILE  -------------*/
  blockquote {
    border-left: none;
    border-top: 3px solid #4b6f1f;
    margin: 1em 0;
    padding: 1.5em;
  }
  blockquote[class*="bg-"] { border-top-color: rgb(40, 50, 78) !important; }
}



/* ////////////////////////////////////////////////////   BOXES   ////////////////////////////// */
/*
          ########   #######  ##     ## ########  ######
          ##     ## ##     ##  ##   ##  ##       ##    ##
          ##     ## ##     ##   ## ##   ##       ##
          ########  ##     ##    ###    ######    ######
          ##     ## ##     ##   ## ##   ##             ##
          ##     ## ##     ##  ##   ##  ##       ##    ##
          ########   #######  ##     ## ########  ######
*/

.box{
  background: rgba(19,77,178,0.08);
  margin-bottom: 1.5em;
  padding: 1.5em 2em;
}
.box:last-of-type{
  margin-bottom: 0;
}
.box.margin-top{
  margin-top: 1.5em;
}
.box > *:first-child, .box > img + *{
  margin-top: 0;
}
.box img{
  clear: both;
  float: right;
  margin-left: 1em !important;
  margin-bottom: 1em;
  width: 150px;
  height: 150px;
  box-shadow: 4px 4px 0px rgba(0,0,0,0.1);
}

/* -------------------------  Boxes with icons  -------------------------- */
.box-icon{
  position: relative;
  margin-bottom: 1.5em;
  padding: 0.5em 0 0 3em;
}
.box-icon[class*="bg-"]{
  padding: 1.5em 2em 1.5em 5em
}
.box-icon:last-of-type{
  margin-bottom: 0;
}
.box-icon p:first-of-type{
  margin-top: 0;
}
.box-icon > i.fa{
  position: absolute;
  display: block;
  width:2.2em;
  height:2.2em;
  top: 0;
  left: 0;
  color: rgb(40, 50, 78);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.box-icon[class*="bg-"] > i.fa{
  width: auto;
  height: auto;
  top: 50%;
  left: 0.8em;
  font-size: 2em;
  transform: translate(0,-50%);
}


/* /////////////////////////////   RESPONSIVE   ///////////////////////////// */

@media only screen and (max-width: 768px)  { /*----------  MOBILE  -------------*/
  .box img{ float: none; display: block; margin: 0 auto 1em !important; }
}
@media only screen and (max-width: 600px)  {
}



/* ////////////////////////////////////////////////////   ARROWs   ////////////////////////////// */
/*
             ###    ########  ########   #######  ##      ##  ######
            ## ##   ##     ## ##     ## ##     ## ##  ##  ## ##    ##
           ##   ##  ##     ## ##     ## ##     ## ##  ##  ## ##
          ##     ## ########  ########  ##     ## ##  ##  ##  ######
          ######### ##   ##   ##   ##   ##     ## ##  ##  ##       ##
          ##     ## ##    ##  ##    ##  ##     ## ##  ##  ## ##    ##
          ##     ## ##     ## ##     ##  #######   ###  ###   ######
*/

div[class*="arrow-"] {
  width: 0;
  height: 0;
  border: 12px solid white;
  background: transparent !important;
  position: absolute;
}
div.arrow-down{
  top: -1px;
  left: calc(50% - 12px);
}
div.arrow-right{
  left: -1px;
  top: calc(50% - 12px);
}
div.arrow-up{
  bottom: -1px;
  left: calc(50% - 12px);
}
div.arrow-left{
  right: -1px;
  top: calc(50% - 12px);
}

div[class*="c-"].arrow-down, div.arrow-down{
  border-right-color: transparent !important;
  border-bottom-color: transparent !important;
  border-left-color: transparent !important;
}

div[class*="c-"].arrow-right, div.arrow-right{
  border-top-color: transparent !important;
  border-right-color: transparent !important;
  border-bottom-color: transparent !important;
}
div[class*="c-"].arrow-up, div.arrow-up{
  border-top-color: transparent !important;
  border-right-color: transparent !important;
  border-left-color: transparent !important;
}
div[class*="c-"].arrow-left, div.arrow-left{
  border-top-color: transparent !important;
  border-bottom-color: transparent !important;
  border-left-color: transparent !important;
}



/* ////////////////////////////////////////////////////   ICONS   ////////////////////////////// */
/*
          ####  ######   #######  ##    ##  ######
           ##  ##    ## ##     ## ###   ## ##    ##
           ##  ##       ##     ## ####  ## ##
           ##  ##       ##     ## ## ## ##  ######
           ##  ##       ##     ## ##  ####       ##
           ##  ##    ## ##     ## ##   ### ##    ##
          ####  ######   #######  ##    ##  ######
*/

/* --------------------  ikony: text / span  ---------------------- */

*.i-doc, *.i-date {
	font-size: 1em;
	display:block;
	padding: 0 0 0 1.6em;
}
*.i-doc::before, *.i-date::before {
  font-family: 'FontAwesome';
  font-weight:300;
  float: left;
  margin-left: -1.6em;
  color: #97be0d;
}
.style-dark *.i-doc::before, .style-dark *.i-date::before { color: #fff; }

.i-date::before { content: '\f073'; }
.i-doc::before { content: '\f016'; }

/* --------------------  ikony: message  ---------------------- */

*[class*="ico-msg-"] {
	background-size: 150px;
	background-repeat: no-repeat;
	background-position: 25px 50%;
	padding-left: 200px;
}
.ico-msg-bulb{ background-image:url(../img/icons/msg/ico-bulb.png); }
.ico-msg-alert{ background-image:url(../img/icons/msg/ico-alert.png); }
.ico-msg-quote{ background-image:url(../img/icons/msg/ico-quote.png); }
.ico-msg-target{ background-image:url(../img/icons/msg/ico-target.png); }
.ico-msg-finance{ background-image:url(../img/icons/msg/ico-finance.png); }

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (max-width:768px){
  *[class*="ico-msg-"] {
  	background-size: 100px;
  	background-position: 50% 20px;
  	padding-top: 100px;
  	padding-left: 1.5em;
  }
}



/* ////////////////////////////////////////////////////   UNDERLINE   ////////////////////////////// */
/*
          ##     ## ##    ## ########  ######## ########  ##       #### ##    ## ########
          ##     ## ###   ## ##     ## ##       ##     ## ##        ##  ###   ## ##
          ##     ## ####  ## ##     ## ##       ##     ## ##        ##  ####  ## ##
          ##     ## ## ## ## ##     ## ######   ########  ##        ##  ## ## ## ######
          ##     ## ##  #### ##     ## ##       ##   ##   ##        ##  ##  #### ##
          ##     ## ##   ### ##     ## ##       ##    ##  ##        ##  ##   ### ##
           #######  ##    ## ########  ######## ##     ## ######## #### ##    ## ########
*/

.underline{
  display:block;
  width: 100%;
  height: 33px;
  margin-top:1.5em;
  background:url(../img/layout/underline.png) no-repeat;
  background-size: cover;
  background-position: 50% 50%;
}
.style-dark .underline, .bg-dark .underline{
  background:url(../img/layout/underline-style-dark.png) no-repeat;
  background-size: cover;
  background-position: 50% 50%;
}



/* ////////////////////////////////////////////////////   SEPARATORs   ////////////////////////////// */
/*
           ######  ######## ########     ###    ########     ###    ########  #######  ########
          ##    ## ##       ##     ##   ## ##   ##     ##   ## ##      ##    ##     ## ##     ##
          ##       ##       ##     ##  ##   ##  ##     ##  ##   ##     ##    ##     ## ##     ##
           ######  ######   ########  ##     ## ########  ##     ##    ##    ##     ## ########
                ## ##       ##        ######### ##   ##   #########    ##    ##     ## ##   ##
          ##    ## ##       ##        ##     ## ##    ##  ##     ##    ##    ##     ## ##    ##
           ######  ######## ##        ##     ## ##     ## ##     ##    ##     #######  ##     ##
*/

.top-line{
  border-top: 5px solid #97be0d;
}
.top-line-slim{
  border-top: 1px solid #97be0d;
}
.no-line{
  border: none !important;
}



/* ////////////////////////////////////////////////////   ACCORDIONS   ////////////////////////////// */
/*
             ###     ######   ######   #######  ########  ########  ####  #######  ##    ##
            ## ##   ##    ## ##    ## ##     ## ##     ## ##     ##  ##  ##     ## ###   ##
           ##   ##  ##       ##       ##     ## ##     ## ##     ##  ##  ##     ## ####  ##
          ##     ## ##       ##       ##     ## ########  ##     ##  ##  ##     ## ## ## ##
          ######### ##       ##       ##     ## ##   ##   ##     ##  ##  ##     ## ##  ####
          ##     ## ##    ## ##    ## ##     ## ##    ##  ##     ##  ##  ##     ## ##   ###
          ##     ##  ######   ######   #######  ##     ## ########  ####  #######  ##    ##
*/

.accordion{
  margin: 0em;
  border-top: 1px solid rgba(0,0,0,0.08);
  -webkit-transition: .3s;
  transition: .3s;
}
.accordion:first-of-type{
  margin-top: 1.5em;
}
.accordion:last-of-type{
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.accordion > *:nth-child(1){
  padding: 0.8em calc(28px + 1em) 0.8em 0em;
  position: relative;
  -webkit-transition: .3s;
  transition: .3s;
  cursor: pointer;
  min-height: 36px;
}
.accordion.active > *:nth-child(1) {
  /*background-color: rgba(0,0,0,0.04);*/
}
.accordion > *:nth-child(1):hover, .accordion.active > *:nth-child(1):hover{
  color: #4b6f1f;
}
.accordion > *:nth-child(2){
  padding: 0 0 1.5em 0;
  overflow: hidden;
}
.accordion.active > *:nth-child(2){
  //
}
.accordion > *:nth-child(1)::after{
  display: block;
  width: 28px;
  height: 28px;
  position: absolute;
  top: 50%;
  right: 0.5em;
  -webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  -webkit-transition: .3s;
  transition: .3s;

  font-family: 'FontAwesome';
  content:"\f067";
  font-size: 14px;
  font-weight:300;
  font-style: normal;
  text-align: center;
  color: #97be0d;

  border-radius: 50%;
  padding-top: 6.5px;
}
.accordion.active > *:nth-child(1)::after {
  transform: translate(0, -50%) scale(0.8) rotate(-135deg);
  background: #97be0d;
  color: #fff;
  top: 1.2em;
}
.accordion > *:nth-child(1):hover * {
  color: #4b6f1f !important;
}
.accordion > *:nth-child(1):hover::after {
  color: #4b6f1f;
  background: rgba(0,0,0,0.06);
}
.accordion.active > *:nth-child(1):hover::after{
  color: #fff;
  background: #4b6f1f;
}

/* ---  Dark style  --- */

.style-dark .accordion:not(.bg-light) > *:nth-child(1)::after { color: #fff; }
.style-dark .accordion{
    border-top: 1px solid rgba(255,255,255,0.08);
    background: #97be0d;
    padding: 0 20px;
    margin-top: 10px;
}
.style-dark .accordion.first{ margin-top: 30px !important; }
.style-dark .accordion:last-of-type{ border-bottom: 1px solid rgba(255,255,255,0.08); }
.style-dark .accordion > *:nth-child(1):hover, .style-dark .accordion.active > *:nth-child(1):hover{
  color: #222629 !important;
}
.style-dark .accordion > :nth-child(1)::after{
    right: calc(0.5em - 20px);
}
.style-dark .accordion:not(.bg-light) > *:nth-child(1):hover::after {
  color: #222629;
  background: rgba(255,255,255,0.06);
}
.style-dark .accordion.active:not(.bg-light) > *:nth-child(1)::after {
  color: #4b6f1f;
  background: #fff;
}
.style-dark .accordion.active:not(.bg-light) > *:nth-child(1):hover::after{
  color: #fff;
  background: #222629;
}
.style-dark .accordion:not(.bg-light) h3, .style-dark .accordion p{
    color: #474b4f !important;
}
.style-dark .accordion.bg-light h3{
    color: #4b6f1f !important;
}
.style-dark .accordion.bg-light ul, .style-dark .accordion.bg-light ol, .style-dark .accordion.bg-light ul > li, .style-dark .accordion.bg-light ol > li {
    color: #474b4f !important;
}



/* ////////////////////////////////////////////////////   NEWS   ////////////////////////////// */
/*
          ##    ## ######## ##      ##  ######
          ###   ## ##       ##  ##  ## ##    ##
          ####  ## ##       ##  ##  ## ##
          ## ## ## ######   ##  ##  ##  ######
          ##  #### ##       ##  ##  ##       ##
          ##   ### ##       ##  ##  ## ##    ##
          ##    ## ########  ###  ###   ######
*/

.news {
  padding: 0 0 0 3em;
}

.news .title{
  margin-bottom: 0.5em;
}

.news .title span{
  color:rgba(255, 255, 255, 0.5); font-weight:400; font-size:0.6em;
  background: rgba(0, 0, 0, 0.12);
  padding: 0.1em 0.5em;
  border-radius: 4px;
  white-space: nowrap;
}

.news .foto{
  margin: 1.2em 0 0 0;
}


/* ////////////////////////////////////////////////////   e-MAIL   ////////////////////////////// */
/*
          ######## ##     ##    ###    #### ##
          ##       ###   ###   ## ##    ##  ##
          ##       #### ####  ##   ##   ##  ##
          ######   ## ### ## ##     ##  ##  ##
          ##       ##     ## #########  ##  ##
          ##       ##     ## ##     ##  ##  ##
          ######## ##     ## ##     ## #### ########
*/

span.contact4s{
  display: inline-block;
  margin-top: -5px !important;
  margin-left: 3px !important;
  top: 5px;
  position: relative;
}
span.contact4s img{
  width:auto !important;
}
#footer span.contact4s {
  top: 3px;
}
