/*----------------------------------------------------------------------
** VMS - Version 1.0 - (c) Vendomatic - Thomas Engel / Date: 08.07.2024
-----------------------------------------------------------------------*/


.key-point, .caution, .note, .success, .warning, aside {
    border-radius: 2;
    display: block;
    font-size: 14px;
    margin: 16px 0;
    padding: 16px 24px 16px 42px;
}

.key-point a, .caution a, .note a, .success a, .warning a {
	text-decoration: underline;
}

.key-point a:hover, .caution a:hover, .note a:hover, .success a:hover, .warning a:hover {
	background: hsla(0,0%,100%,.7);
	border-radius: 2px;
    margin: -4px;
    padding: 4px;
	text-decoration: none;
}

.warning, .warning :link, .warning :visited, .warning {
    color: #d50000;
    background: #fce8e6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='%23d50000' d='M13 14H11V9H13M13 18H11V16H13M1 21H23L12 2L1 21Z'%3E%3C/path%3E%3C/svg%3E") no-repeat 15px 17px;				
}

.caution, .caution :link, .caution :visited, .caution {
    color: #bf360c;
    background: #feefe3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='%23bf360c' d='M13,13H11V7H13M13,17H11V15H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'%3E%3C/path%3E%3C/svg%3E") no-repeat 15px 17px;				
}

.note, .note :link, .note :visited, .note {
    color: #01579b;
	background: #e1f5fe url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='%2301579b' d='M12,17.27L18.18,21L16.54,13.97L22,9.24L14.81,8.62L12,2L9.19,8.62L2,9.24L7.45,13.97L5.82,21L12,17.27Z'%3E%3C/path%3E%3C/svg%3E") no-repeat 15px 17px;
}

.success, .success :link, .success :visited, .success {
    color: #00796b;
    background: #e0f2f1 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='%2300796b' d='M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z'%3E%3C/path%3E%3C/svg%3E") no-repeat 15px 17px;
}

.key-point, .key-point :link, .key-point :visited, .key-point {
    color: #3f51b5;
    background: #e8eaf6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='%233f51b5' d='M12,2A7,7 0 0,1 19,9C19,11.38 17.81,13.47 16,14.74V17A1,1 0 0,1 15,18H9A1,1 0 0,1 8,17V14.74C6.19,13.47 5,11.38 5,9A7,7 0 0,1 12,2M9,21V20H15V21A1,1 0 0,1 14,22H10A1,1 0 0,1 9,21M12,4A5,5 0 0,0 7,9C7,11.05 8.23,12.81 10,13.58V16H14V13.58C15.77,12.81 17,11.05 17,9A5,5 0 0,0 12,4Z'%3E%3C/path%3E%3C/svg%3E") no-repeat 15px 15px;
}

/*--- SVG BOX -----------------------------------------------------------*/

.msg-box {
	text-align: left;		
	font-size: 13px;
  	padding: 7px 7px 7px 20px;
	margin: 7px 0px 7px 0px;	
}

.msg-alert {
	color: #D02D1C;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' viewBox='0 0 24 24'%3E%3Cpath fill='%23D02D1C' d='M13,13H11V7H13M13,17H11V15H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'%3E%3C/path%3E%3C/svg%3E") no-repeat left center;		
}

.msg-warn {
	color: #FFC107;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' viewBox='0 0 24 24'%3E%3Cpath fill='%23FFC107' d='M13,13H11V7H13M13,17H11V15H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'%3E%3C/path%3E%3C/svg%3E") no-repeat left center;		
}

.msg-caution {
	color: #bf360c;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' viewBox='0 0 24 24'%3E%3Cpath fill='%23bf360c' d='M13,13H11V7H13M13,17H11V15H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'%3E%3C/path%3E%3C/svg%3E") no-repeat left center;		
}

.msg-info {
	color: #00796b;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' viewBox='0 0 24 24'%3E%3Cpath fill='%2300796b' d='M13,13H11V7H13M13,17H11V15H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'%3E%3C/path%3E%3C/svg%3E") no-repeat left center;		
}

/*--- FIELD MSG -----------------------------------------------------------*/

.input-msg {
    font-size: 12px;
    line-height: normal;
    margin-top: 7px;
    padding-left: 24px;
    margin-bottom: 5px;
}

.input-alert {
	color: #d93025;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' viewBox='0 0 24 24'%3E%3Cpath fill='%23d93025' d='M13,9H11V7H13M13,17H11V11H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'%3E%3C/path%3E%3C/svg%3E") no-repeat left center;			
}

/*--- FIELD BOX -----------------------------------------------------------*/

.field-box {
	float: left;
	margin: 0px;
	padding: 0px 5px 0px 5px;
	border-radius: 4px;
	text-align: left;		
	font-size: 10px;
	color: #FFFFFF;
}

.field-green {
	background-color: #1aa260;
}

.field-red {
	background-color: #de5246;
}


/*--- ERROR FORMS -----------------------------------------------------------*/

.group-error {
    -webkit-border-radius: 4px;
    border-radius: 4px;	
	border: 1px solid #D93025 !important; 
   -webkit-transition: all 0.20s;
   -moz-transition: all 0.20s;
   -ms-transition: all 0.20s;
   -o-transition: all 0.20s; 
   outline: none;	
}
.group-error + label {	
   color: #D93025 !important;		
}

.group-error:focus {
  border-color:transparent;
  box-shadow: none  !important;	
  border-bottom: 1px solid #D93025 !important; 
  outline-style:none;
}



.line-error {
	border-bottom: 1px solid #D93025 !important; 
   -webkit-transition: all 0.20s;
   -moz-transition: all 0.20s;
   -ms-transition: all 0.20s;
   -o-transition: all 0.20s; 
   outline: none;	
}

.line-error + label {	
   color: #D93025 !important;		
}

.line-error:focus {
  border-color:transparent;
  box-shadow: none  !important;	
  border-bottom: 1px solid #D93025 !important; 
  outline-style:none;
}


.field-error {
	border: 1px solid #D93025 !important; 
   -webkit-transition: all 0.20s;
   -moz-transition: all 0.20s;
   -ms-transition: all 0.20s;
   -o-transition: all 0.20s; 
   outline: none;	
}
.field-error + label {	
   color: #D93025 !important;		
}

.field-error:focus {
  border-color:transparent;
  box-shadow: none  !important;	
  border-bottom: 1px solid #D93025 !important; 
  outline-style:none;
}