/* Regular */
@font-face {
    font-family: 'Open Sans';
    
    src: url('../../font/OpenSans-Regular-webfont.eot');
    src: url('../../font/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-Regular-webfont.woff') format('woff'),
         url('../../font/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-weight: 400;
    font-style: normal;
}

/* Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-Italic-webfont.eot');
    src: url('../../font/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-Italic-webfont.woff') format('woff'),
         url('../../font/OpenSans-Italic-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
    font-weight: normal;
    font-weight: 400;
    font-style: italic;

}

/* Light */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-Light-webfont.eot');
    src: url('../../font/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-Light-webfont.woff') format('woff'),
         url('../../font/OpenSans-Light-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
    font-weight: 200;
    font-style: normal;

}

/* Light Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-LightItalic-webfont.eot');
    src: url('../../font/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-LightItalic-webfont.woff') format('woff'),
         url('../../font/OpenSans-LightItalic-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
    font-weight: 200;
    font-style: italic;

}

/* Semibold */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-Semibold-webfont.eot');
    src: url('../../font/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-Semibold-webfont.woff') format('woff'),
         url('../../font/OpenSans-Semibold-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
    font-weight: 700;
    font-style: normal;

}

/* Semibold Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-SemiboldItalic-webfont.eot');
    src: url('../../font/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
         url('../../font/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
    font-weight: 700;
    font-style: italic;

}

/* Bold */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-Bold-webfont.eot');
    src: url('../../font/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-Bold-webfont.woff') format('woff'),
         url('../../font/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
    font-weight: bold;
    font-weight: 800;
    font-style: normal;

}

/* Bold Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-BoldItalic-webfont.eot');
    src: url('../../font/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-BoldItalic-webfont.woff') format('woff'),
         url('../../font/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
    font-weight: bold;
    font-weight: 800;
    font-style: italic;

}

/* Extra Bold */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-ExtraBold-webfont.eot');
    src: url('../../font/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-ExtraBold-webfont.woff') format('woff'),
         url('../../font/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
    font-weight: 900;
    font-style: normal;

}

/* Extra Bold Italic */
@font-face {
    font-family: 'Open Sans';
    src: url('../../font/OpenSans-ExtraBoldItalic-webfont.eot');
    src: url('../../font/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../font/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
         url('../../font/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
         url('../../font/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic') format('svg');
    font-weight: 900;
    font-style: italic;

}



body{
	/*font-family: Arial, Helvetica, sans-serif;*/
}

.navbar .navbar-inner{
	background-color: #000000;
}

.brand{
	font-family: "Open Sans";
}

.purple .dropdown-menu > li > a {
  white-space: normal;
}

.btn-warning .dropdown-menu > li > a {
  white-space: normal;
  text-shadow: none;
}

.ZEF {
	background: #2D89EF !important;
	border-color: #2D89EF !important;
	color: #fff;
}

.ZEF.arrowed:before {
  border-right-color: #2D89EF;
}
.ZEF.arrowed-in:before {
  border-color: #2D89EF;
}
.ZEF.arrowed-right:after {
  border-left-color: #2D89EF;
}
.ZEF.arrowed-in-right:after {
  border-color: #2D89EF;
}


.KTN {
	background: #603CBA !important;
	border-color: #603CBA !important;
	color: #fff;
}
.KTN.arrowed:before {
  border-right-color: #603CBA;
}
.KTN.arrowed-in:before {
  border-color: #603CBA;
}
.KTN.arrowed-right:after {
  border-left-color: #603CBA;
}
.KTN.arrowed-in-right:after {
  border-color: #603CBA;
}


.KNT {
	background: #f0a30a !important;
  	background-color: #f0a30a !important;
	color: #0000;
}

.KRS {
	background: #00A300 !important;
  	background-color: #00A300 !important;
	color: #0000;
}

.TPT {
	background: #fa6800 !important;
  	background-color: #fa6800 !important;
	color: #0000;
}

.LUF {
	background: #37E8DD !important;
  	background-color: #37E8DD !important;
	color: #0000;
}




.btn-app.ZEF {
  background: #2D89EF !important;
  background-color: #2D89EF !important;
  background-image: -moz-linear-gradient(top, #4598EF, #2D89EF) !important;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#4598EF), to(#2D89EF)) !important;
  background-image: -webkit-linear-gradient(top, #4598EF, #2D89EF) !important;
  background-image: -o-linear-gradient(top, #4598EF, #2D89EF) !important;
  background-image: linear-gradient(to bottom, #4598EF, #2D89EF) !important;
  background-repeat: repeat-x !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4598EF', endColorstr='#ff2D89EF', GradientType=0) !important;
}

.btn-app.KNT {
  background: #f0a30a !important;
  background-color: #f0a30a !important;
  background-image: -moz-linear-gradient(top, #FFE100, #f0a30a) !important;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FFE100), to(#f0a30a)) !important;
  background-image: -webkit-linear-gradient(top, #FFE100, #f0a30a) !important;
  background-image: -o-linear-gradient(top, #FFE100, #f0a30a) !important;
  background-image: linear-gradient(to bottom, #FFE100, #f0a30a) !important;
  background-repeat: repeat-x !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffFFE100', endColorstr='#fff0a30a', GradientType=0) !important;
}
.btn-app.KNT.btn {
	text-shadow: 1px 1px 2px #000000 !important;
   filter: dropshadow(color=#000000, offx=1, offy=1) !important;
}
/* hell zu dunkel*/
.btn-app.KTN {
  background: #8763E1 !important;
  background-color: #8763E1 !important;
  background-image: -moz-linear-gradient(top, #8763E1, #613DBB) !important;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#8763E1), to(#613DBB)) !important;
  background-image: -webkit-linear-gradient(top, #8763E1, #613DBB) !important;
  background-image: -o-linear-gradient(top, #8763E1, #613DBB) !important;
  background-image: linear-gradient(to bottom, #8763E1, #613DBB) !important;
  background-repeat: repeat-x !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8763E1', endColorstr='#ff613DBB', GradientType=0) !important;
}
.btn-app.KRS {
  background: #00A300 !important;
  background-color: #00A300 !important;
  background-image: -moz-linear-gradient(top, #00A300, #009200) !important;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#00A300), to(#009200)) !important;
  background-image: -webkit-linear-gradient(top, #00A300, #009200) !important;
  background-image: -o-linear-gradient(top, #00A300, #009200) !important;
  background-image: linear-gradient(to bottom, #00A300, #009200) !important;
  background-repeat: repeat-x !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff00A300', endColorstr='#ff009200', GradientType=0) !important;
}


.btn-app.TPT {
  background: #fa6800 !important;
  background-color: #fa6800 !important;
  background-image: -moz-linear-gradient(top, #FF8B35, #fa6800) !important;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FF8B35), to(#fa6800)) !important;
  background-image: -webkit-linear-gradient(top, #FF8B35, #fa6800) !important;
  background-image: -o-linear-gradient(top, #FF8B35, #fa6800) !important;
  background-image: linear-gradient(to bottom, #FF8B35, #fa6800) !important;
  background-repeat: repeat-x !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffFF8B35', endColorstr='#fffa6800', GradientType=0) !important;
}
.btn-app.TPT.btn {
	text-shadow: 1px 1px 2px #000000 !important;
   filter: dropshadow(color=#000000, offx=1, offy=1) !important;
}

.btn-app.LUF {
  background: #37E8DD !important;
  background-color: #37E8DD !important;
  background-image: -moz-linear-gradient(top, #37E8DD, #41B5E8) !important;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#37E8DD), to(#41B5E8)) !important;
  background-image: -webkit-linear-gradient(top, #37E8DD, #41B5E8) !important;
  background-image: -o-linear-gradient(top, #37E8DD, #41B5E8) !important;
  background-image: linear-gradient(to bottom, #37E8DD, #41B5E8) !important;
  background-repeat: repeat-x !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff37E8DD', endColorstr='#ff41B5E8', GradientType=0) !important;
}
.btn-app.LUF.btn {
	text-shadow: 1px 1px 2px #000000 !important;
   filter: dropshadow(color=#000000, offx=1, offy=1) !important;
}


.btn-app.BRT {
  background: #9D7115 !important;
  background-color: #9D7115 !important;
  background-image: -moz-linear-gradient(top, #E3A21A, #9D7115) !important;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#E3A21A), to(#9D7115)) !important;
  background-image: -webkit-linear-gradient(top, #E3A21A, #9D7115) !important;
  background-image: -o-linear-gradient(top, #E3A21A, #9D7115) !important;
  background-image: linear-gradient(to bottom, #E3A21A, #9D7115) !important;
  background-repeat: repeat-x !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffE3A21A', endColorstr='#ff9D7115', GradientType=0) !important;
}

/* Farben  */
/*  GESETZ
id gesetz                   bezeichnung
 -- ------------------------ ---------------------------------------------------------------------
  1 Art. 74 IVG              Behinderte im IV-Alter
  2 Art. 101 bis AHVG o. Bst Behinderte im AHV-Alter ohne Besitzstand
  3 NBB                      Nicht beitragsberechtigt
  4 Bezugspersonen AHV       Beratene Bezugspersonen und Angehörige von Behinderten im AHV-Alter
  5 Art. 101 bis AHVG m. Bst Behinderte im AHV-Alter mit Besitzstand
  6 Bezugspersonen IV        Beratene Bezugspersonen und Angehörige Behinderte im IV-Alter
  7 Bezugspersonen NBB       Beratene Bezugspersonen und Angehörige von Nicht Beitragsberechtigten
*/
.gesetz_{	background-color: #FFFFFF !important; }	/* 	FEHLT */
.gesetz_1{	background-color: #82af6f !important; }	/* 	Art74 */
.gesetz_2{ 	background-color: #3a87ad !important; }	/*  	Art101oB */
.gesetz_3{	background-color: #abbac3 !important; } 	/* 	NBB */
.gesetz_4{ 	background-color: #f89406 !important; } 	/*		Bezugspersonen AHV */
.gesetz_5{ 	background-color: #4EBCDC !important; }	/*  	Art101mB */

.gesetz_6{	background-color: #FFCC33 !important; color:#000000; }	/*		Bezugspersonen IV */
.gesetz_7{	background-color: #E3B700 !important; }						/*		Bezugspersonen NBB */

.gesetz_8{	background-color: #FF6633 !important; }			/*		Bezugspersonen ADP */
.gesetz_9{	background-color: #BB2F00 !important; }			/*		Behinderte ADP */


/* LUFEB-Farben Auswertung    */
.LUFEB-hellblau{
	background-color: #99CCFF !important;
}
.LUFEB-grau{
	background-color: Silver !important;
}
.LUFEB-hellgelb{
	background-color: #FFFF99 !important;
}


/*   Formulare und Co. */

.journal{
	background-image: url(../../bilder/journal.jpg);
	background-position: top left;
	background-repeat: no-repeat;
}

.chzn-container-single{
	width: 100% !important;
}
.tab-content .chzn-container-single{
	width: 230px !important;
}

.tab-content .lang .chzn-container-single,
.tab-content .lang .chzn-container-multi{
	width: 100% !important;
}

.input-icon > input{
	padding-left: 26px;
}

.btn-app.btn{
	width: 110px;
}

.icon-animated-hand {
  display: inline-block;
  -moz-animation: ringing 2.0s 5 ease 1.0s;
  -webkit-animation: ringing 2.0s 5 ease 1.0s;
  -o-animation: ringing 2.0s 5 ease 1.0s;
  -ms-animation: ringing 2.0s 5 ease 1.0s;
  animation: ringing 2.0s 5 ease 1.0s;
  -moz-transform-origin: 0% 50%;
  -webkit-transform-origin: 0% 50%;
  -o-transform-origin: 0% 50%;
  -ms-transform-origin: 0% 50%;
  transform-origin: 0% 50%;
}

.user-info{
	max-width: 150px;
}

/* ***********************  TABS ************************ */
.tab-content{
	overflow: visible;
}

/* ************************* Tabelle ******************* */
table.SchmaleSpalten TH,
table.SchmaleSpalten TD{
	padding-left:3px;
	padding-right:3px;
}
/* Fuer datentabelle */
.table th, .table td{
	padding: 7px;
}

.kurstermin{
	background-color: #CCE49B;
	border-left: 2px solid #669900 !important;
	text-align: center !important;
}

.table tfoot tr{
	color:#707070;
	font-weight:normal;
	background:#d9edf7;
	background-color:#d9edf7;
	background-image:-moz-linear-gradient(top,#d9edf7,#ececec);
	background-image:-webkit-gradient(linear,0 0,0 100%,from(#d9edf7),to(#ececec));
	background-image:-webkit-linear-gradient(top,#d9edf7,#ececec);
	background-image:-o-linear-gradient(top,#d9edf7,#ececec);
	background-image:linear-gradient(to bottom,#d9edf7,#ececec);
	background-repeat:repeat-x;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7',endColorstr='#ffececec',GradientType=0)
}

TH.border-left, TD.border-left{
	border-left: 2px solid #AAAAAA !important;
}
TH.border-right, TD.border-right{
	border-right: 2px solid #AAAAAA !important;
}
.border-both-red {
	border-right: 1px solid red !important;
	border-left: 1px solid red !important;
}

/* *********************  FORMULARE ********************* */
.form-horizontal .span6{
	min-width: 375px;
}
.form-horizontal .controls{
	margin-left: 155px;
}
.form-horizontal .control-label{
	width: 140px;
}

.form-horizontal .control-group{
	margin-bottom: 1px;
}

.widget-body .form-actions{
	margin-top: 0px;
	margin-bottom: 0px;
}

.input-PLZ{
	width: 40px;
}

.taetigkeitsprojekt{
	color: Blue;
}

textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
  color: #000000;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  color: Black;
  border-color: #F67F12;
  background-color: #FFFFBB;
}

.chzn-container-single .chzn-single {
	color: 000000;
}
.chzn-results .chzn-results{
	z-index: 1000;
}
.chzn-container .chzn-results li{
	padding-top: 5px;
}

.wysiwyg-editor{
	height: 150px;
	max-height: 700px;
}

.wysiwyg-editor blockquote{
	border: 0px;
}
.wysiwyg-editor blockquote P{
	font-size: inherit;
}

.aktenfuehrung .lbl {
    min-width: 150px !important;
}


/*  Tabellenzeile, die nicht angezeigt werden soll     */
.InhaltUnsichtbar INPUT, 
.InhaltUnsichtbar TEXTAREA,
.InhaltUnsichtbar .lbl, 
.InhaltUnsichtbar BUTTON, 
.InhaltUnsichtbar input[type="checkbox"] .lbl, 
.InhaltUnsichtbar DIV{
	visibility: hidden;
}

/* ********************* Tabelle ********************** */
.dataTables_length input[type=text]{
	width: 300px;
}


/* *********************  Bereiche ******************** */
.alert-info{
	color: #006666;
}

.text-muted TD{
	color: #999999 !important;
	text-decoration: line-through;
}
li.text-muted {
	color: #999999 !important;
	text-decoration: line-through;
}

.braun {
  color: #996600 !important;
}

.hg-gelb{
	background: #FFFF55 !important;
  	background-color: #FFFF55 !important;
	color: #000000;
}

.dropdown-braun li a:hover,
.dropdown-braun li a:focus,
.dropdown-braun li a:active,
.dropdown-braun li.active a,
.dropdown-braun li.active a:hover,
.dropdown-braun .dropdown-submenu:hover > a,
.nav-tabs .dropdown-braun li > a:focus {
  background: #996600;
  color: #ffffff;
}

.nonvisible{
	display:none !important;
}

.versteckt{
	visibility: hidden;
}

#fussbereich { 
    position: fixed; 
    bottom: 0; 
    width: 100%; 
    height: 2em; 
}

/* SortierungsButtons */
.sortierungsliste li:first-child .up {
	visibility: hidden;
}
.sortierungsliste li:last-child .down {
	visibility: hidden;
}

/* Taetigkeiten fett, ausgeblendet */
.fett{
	font-weight: bold !important;
}

/*  Suchergebnisse */
.btn-success .muted{
	color: #FFFFFF;
}

.padding-top-1em{
	padding-top: 1em;
}
.padding-bottom-1em{
	padding-bottom: 1em;
}

/*    Abstaende */
.pa-0 {
    padding: 0px;
}

.pl-0 {
    padding-left: 0px;
}

.pt-0 {
    padding-top: 0px;
}

.pr-0 {
    padding-right: 0px;
}

.pb-0 {
    padding-bottom: 0px;
}

.pv-0 {
    padding-top: 0px;
    padding-bottom: 0px;
}

.ph-0 {
    padding-left: 0px;
    padding-right: 0px;
}

.pa-1 {
    padding: 1px;
}

.pl-1 {
    padding-left: 3px;
}

.pt-1 {
    padding-top: 3px;
}

.pr-1 {
    padding-right: 3px;
}

.pb-1 {
    padding-bottom: 3px;
}

.pv-1 {
    padding-top: 3px;
    padding-bottom: 3px;
}

.ph-1 {
    padding-left: 3px;
    padding-right: 3px;
}

.pa-2 {
    padding: 2px;
}

.pl-2 {
    padding-left: 6px;
}

.pt-2 {
    padding-top: 6px;
}

.pr-2 {
    padding-right: 6px;
}

.pb-2 {
    padding-bottom: 6px;
}

.pv-2 {
    padding-top: 6px;
    padding-bottom: 6px;
}

.ph-2 {
    padding-left: 6px;
    padding-right: 6px;
}

.pa-3 {
    padding: 3px;
}

.pl-3 {
    padding-left: 9px;
}

.pt-3 {
    padding-top: 9px;
}

.pr-3 {
    padding-right: 9px;
}

.pb-3 {
    padding-bottom: 9px;
}

.pv-3 {
    padding-top: 9px;
    padding-bottom: 9px;
}

.ph-3 {
    padding-left: 9px;
    padding-right: 9px;
}

.pa-4 {
    padding: 4px;
}

.pl-4 {
    padding-left: 12px;
}

.pt-4 {
    padding-top: 12px;
}

.pr-4 {
    padding-right: 12px;
}

.pb-4 {
    padding-bottom: 12px;
}

.pv-4 {
    padding-top: 12px;
    padding-bottom: 12px;
}

.ph-4 {
    padding-left: 12px;
    padding-right: 12px;
}

.ma-0 {
    margin: 0px;
}

.ml-0 {
    margin-left: 0px;
}

.mt-0 {
    margin-top: 0px;
}

.mr-0 {
    margin-right: 0px;
}

.mb-0 {
    margin-bottom: 0px;
}

.mv-0 {
    margin-top: 0px;
    margin-bottom: 0px;
}

.mh-0 {
    margin-left: 0px;
    margin-right: 0px;
}

.ma-1 {
    margin: 1px;
}

.ml-1 {
    margin-left: 3px;
}

.mt-1 {
    margin-top: 3px;
}

.mr-1 {
    margin-right: 3px;
}

.mb-1 {
    margin-bottom: 3px;
}

.mv-1 {
    margin-top: 3px;
    margin-bottom: 3px;
}

.mh-1 {
    margin-left: 3px;
    margin-right: 3px;
}

.ma-2 {
    margin: 2px;
}

.ml-2 {
    margin-left: 6px;
}

.mt-2 {
    margin-top: 6px;
}

.mr-2 {
    margin-right: 6px;
}

.mb-2 {
    margin-bottom: 6px;
}

.mv-2 {
    margin-top: 6px;
    margin-bottom: 6px;
}

.mh-2 {
    margin-left: 6px;
    margin-right: 6px;
}

.ma-3 {
    margin: 3px;
}

.ml-3 {
    margin-left: 9px;
}

.mt-3 {
    margin-top: 9px;
}

.mr-3 {
    margin-right: 9px;
}

.mb-3 {
    margin-bottom: 9px;
}

.mv-3 {
    margin-top: 9px;
    margin-bottom: 9px;
}

.mh-3 {
    margin-left: 9px;
    margin-right: 9px;
}

.ma-4 {
    margin: 4px;
}

.ml-4 {
    margin-left: 12px;
}

.mt-4 {
    margin-top: 12px;
}

.mr-4 {
    margin-right: 12px;
}

.mb-4 {
    margin-bottom: 12px;
}

.mv-4 {
    margin-top: 12px;
    margin-bottom: 12px;
}

.mh-4 {
    margin-left: 12px;
    margin-right: 12px;
}