  .f-r-1 {
	font-size: calc(16px + (20 - 16) * ((100vw - 320px) / (1600 - 320)));
  }
  .f-r-2 {
	font-size: calc(24px + (42 - 24) * ((100vw - 320px) / (1600 - 320)));
  }
  .f-r-3 {
	font-size: calc(24px + (28 - 24) * ((100vw - 320px) / (1600 - 320)));
  }
  .f-r-4 {
	font-size: calc(20px + (32 - 20) * ((100vw - 320px) / (1600 - 320)));
  } 
  
  .p-r-1 {
	font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
  }
  .p-r-2 {
	font-size: calc(10px + (14 - 10) * ((100vw - 320px) / (1600 - 320)));
  } 
  .p-r-3 {
	font-size: calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320)));
  }  
 
.artikel p {

  font-size: calc(14px + (18 - 14) * ((100vw - 320px) / (1600 - 320)));
  color: #1e2022 !important;
} 

.artikel h3 {
  margin-top: 3rem !important;
  font-size: calc(24px + (28 - 24) * ((100vw - 320px) / (1600 - 320)));
  font-weight: 600 !important;
  color: #1e2022 !important;
} 

/* whatsapp */
.btn-whatsapp {
  color: #fff;
  background-color: #25D366;
  border-color: #25D366;
}

.btn-whatsapp:hover {
  color: #fff;
  background-color: #25D366;
  border-color: #25D366;
}

.btn-whatsapp:focus, .btn-whatsapp.focus {
  color: #fff;
  background-color: #25D366;
  border-color: #25D366;
  box-shadow: 0 0 0 0.2rem rgba(88, 114, 167, 0.5);
}

.btn-whatsapp.disabled, .btn-whatsapp:disabled {
  color: #fff;
  background-color: #25D366;
  border-color: #25D366;
}

.btn-whatsapp:not(:disabled):not(.disabled):active, .btn-whatsapp:not(:disabled):not(.disabled).active,
.show > .btn-whatsapp.dropdown-toggle {
  color: #fff;
  background-color: #25D366;
  border-color: #25D366;
}

.btn-whatsapp:not(:disabled):not(.disabled):active:focus, .btn-whatsapp:not(:disabled):not(.disabled).active:focus,
.show > .btn-whatsapp.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(88, 114, 167, 0.5);
}




/* whatsapp button :hover, :focus, :active effects */
.btn-whatsapp[href]:hover, .btn-whatsapp[href]:focus, .btn-whatsapp[href]:active, .btn-whatsapp[type]:hover, .btn-whatsapp[type]:focus, .btn-whatsapp[type]:active {
  box-shadow: 0 4px 11px rgba(59, 89, 152, 0.35);
}

.btn-whatsapp:not(label.btn), .btn-whatsapp:not(label.btn):not([href]):not(:disabled):not(.disabled), .btn-whatsapp:not([href]), .btn-whatsapp:not([href]):not([href]):not(:disabled):not(.disabled) {
  background-color: #25D366;
  border-color: #25D366;
}

.btn-whatsapp:hover {
  background-color: #25D366;
  border-color: #25D366;
}
 
 
 /* xing */
.btn-xing {
  color: #fff;
  background-color: #126567;
  border-color: #126567;
}

.btn-xing:hover {
  color: #fff;
  background-color: #076F72;
  border-color: #076F72;
}

.btn-xing:focus, .btn-xing.focus {
  color: #fff;
  background-color: #076F72;
  border-color: #076F72;
  box-shadow: 0 0 0 0.2rem rgba(88, 114, 167, 0.5);
}

.btn-xing.disabled, .btn-xing:disabled {
  color: #fff;
  background-color: #3b5998;
  border-color: #3b5998;
}

.btn-xing:not(:disabled):not(.disabled):active, .btn-xing:not(:disabled):not(.disabled).active,
.show > .btn-xing.dropdown-toggle {
  color: #fff;
  background-color: #076F72;
  border-color: #076F72;
}

.btn-xing:not(:disabled):not(.disabled):active:focus, .btn-xing:not(:disabled):not(.disabled).active:focus,
.show > .btn-xing.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(88, 114, 167, 0.5);
}




/* xing button :hover, :focus, :active effects */
.btn-xing[href]:hover, .btn-xing[href]:focus, .btn-xing[href]:active, .btn-xing[type]:hover, .btn-xing[type]:focus, .btn-xing[type]:active {
  box-shadow: 0 4px 11px rgba(59, 89, 152, 0.35);
}

.btn-xing:not(label.btn), .btn-xing:not(label.btn):not([href]):not(:disabled):not(.disabled), .btn-xing:not([href]), .btn-xing:not([href]):not([href]):not(:disabled):not(.disabled) {
  background-color: #126567;
  border-color: #126567;
}

.btn-xing:hover {
  background-color: #128C7E;
  border-color: #128C7E;
}
 
 
 
  
 .u-header__navbar-brand-text {

	font-size: calc(22px + (36 - 22) * ((100vw - 320px) / (1600 - 320)));
	color: #377dff;
}
 .u-header__navbar-brand-text2 {

	font-size: calc(22px + (36 - 22) * ((100vw - 320px) / (1600 - 320)));
	font-weight: 300;
	color: #377dff;
}

.u-header__navbar-brand-text2-white .u-header__navbar-brand-text2, .u-header__navbar-brand-text2-white .u-header__navbar-brand-text2:focus, .u-header__navbar-brand-text2-white .u-header__navbar-brand-text2:hover {
  color: #fff;
}

.u-header__navbar-brand-text {
  margin-left: 0rem;
}

.load-more__btn {
  padding: 1rem 1.125rem;
  font-size: 0.875rem;
  line-height: 1.5;
  border-radius: 0.25rem;
  display: block;
  width: 100%;
  color: #377dff;
  background: rgba(55, 125, 255, 0.1);
  border-color: transparent;  
  text-align: center;
}

.load-more__btn[href]:hover, .load-more__btn[href]:focus, .load-more__btn[href]:active, .load-more__btn[href].active, .load-more__btn[type]:hover, .load-more__btn[type]:focus, .load-more__btn[type]:active, .load-more__btn[type].active {
  color: #fff;
  background: #377dff;
  box-shadow: 0 4px 11px rgba(55, 125, 255, 0.35);
}



.rate {
	float: left;
    height: 46px;
    padding: 0px;

}
.rate:not(:checked) > input {
    position:absolute;
    top:-9999px;
}
.rate:not(:checked) > label {
    float:right;
    width:1em;
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    font-size:30px;
    color:#ccc;
}
.rate:not(:checked) > label:before {
    content: '★ ';
}
.rate > input:checked ~ label {
    color: #ffc700;    
}
.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
    color: #deb217;  
}
.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
    color: #c59b08;
}


.rate2 {
	float: left;
    height: 46px;
    padding: 0px;
	text-align: center;
}
.rate2:not(:checked) > input {
    position:absolute;
    top:-9999px;
	text-align: center;	
}
.rate2:not(:checked) > label {
    float:right;
    width:1em;
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    font-size:34px;
    color:#ccc;
}
.rate2:not(:checked) > label:before {
    content: '★ ';
}
.rate2 > input:checked ~ label {
    color: #ffc700;   
}
.rate2:not(:checked) > label:hover,
.rate2:not(:checked) > label:hover ~ label {
    color: #deb217;  
}
.rate2 > input:checked + label:hover,
.rate2 > input:checked + label:hover ~ label,
.rate2 > input:checked ~ label:hover,
.rate2 > input:checked ~ label:hover ~ label,
.rate2 > label:hover ~ input:checked ~ label {
    color: #c59b08;
}

