/*
================================================================
utility.css for LACHIC templates
Summer 2022
================================================================
*/


/*
----------------
html
----------------
*/



/*
----------------
box spacing
----------------
*/

.m-auto {
  margin: auto !important;
}

.mt-auto,
.my-auto {
  margin-top: auto !important;
}

.mr-auto,
.mx-auto {
  margin-right: auto !important;
}

.mb-auto,
.my-auto {
  margin-bottom: auto !important;
}

.ml-auto,
.mx-auto {
  margin-left: auto !important;
}

/* spacing */
.m-00, .m-00 * { margin: 0 !important;}
.m-05 { margin: 5px !important;}
.m-10 { margin: 10px !important;}
.m-15 { margin: 15px !important;}
.m-20 { margin: 20px !important;}
.m-25 { margin: 25px !important;}
.m-30 { margin: 30px !important;}
.m-40 { margin: 40px !important;}
.m-50 { margin: 50px !important;}
.m-60 { margin: 60px !important;}
.m-100 { margin: 100px !important;}
.m-120 { margin: 120px !important;}

.mt-00, .mt-00 * { margin-top: 0 !important;}
.mt-05 { margin-top: 5px !important;}
.mt-10 { margin-top: 10px !important;}
.mt-15 { margin-top: 15px !important;}
.mt-20 { margin-top: 20px !important;}
.mt-25 { margin-top: 25px !important;}
.mt-30 { margin-top: 30px !important;}
.mt-40 { margin-top: 40px !important;}
.mt-50 { margin-top: 50px !important;}
.mt-60 { margin-top: 60px !important;}
.mt-100 { margin-top: 100px !important;}
.mt-120 { margin-top: 120px !important;}

.mb-00, .mb-00 * { margin-bottom: 0 !important;}
.mb-05 { margin-bottom: 5px !important;}
.mb-10 { margin-bottom: 10px !important;}
.mb-15 { margin-bottom: 15px !important;}
.mb-20 { margin-bottom: 20px !important;}
.mb-25 { margin-bottom: 25px !important;}
.mb-30 { margin-bottom: 30px !important;}
.mb-40 { margin-bottom: 40px !important;}
.mb-50 { margin-bottom: 50px !important;}
.mb-60 { margin-bottom: 60px !important;}
.mb-100 { margin-bottom: 100px !important;}
.mb-120 { margin-bottom: 120px !important;}

.mr-00, .mr-00 * { margin-right: 0 !important;}
.mr-05 { margin-right: 5px !important;}
.mr-10 { margin-right: 10px !important;}
.mr-15 { margin-right: 15px !important;}
.mr-20 { margin-right: 20px !important;}
.mr-25 { margin-right: 25px !important;}
.mr-30 { margin-right: 30px !important;}
.mr-40 { margin-right: 40px !important;}
.mr-50 { margin-right: 50px !important;}
.mr-60 { margin-right: 60px !important;}
.mr-100 { margin-right: 100px !important;}
.mr-120 { margin-right: 120px !important;}

.ml-00, .ml-00 * { margin-left: 0 !important;}
.ml-05 { margin-left: 5px !important;}
.ml-10 { margin-left: 10px !important;}
.ml-15 { margin-left: 15px !important;}
.ml-20 { margin-left: 20px !important;}
.ml-25 { margin-left: 25px !important;}
.ml-30 { margin-left: 30px !important;}
.ml-40 { margin-left: 40px !important;}
.ml-50 { margin-left: 50px !important;}
.ml-60 { margin-left: 60px !important;}
.ml-100 { margin-left: 100px !important;}
.ml-120 { margin-left: 120px !important;}

.mx-00, .mx-00 * { margin-right: 0 !important; margin-left: 0 !important;}
.mx-05 { margin-right: 5px !important; margin-left: 5px !important;}
.mx-10 { margin-right: 10px !important; margin-left: 10px !important;}
.mx-15 { margin-right: 15px !important; margin-left: 15px !important;}
.mx-20 { margin-right: 20px !important; margin-left: 20px !important;}
.mx-25 { margin-right: 25px !important; margin-left: 25px !important;}
.mx-30 { margin-right: 30px !important; margin-left: 30px !important;}
.mx-40 { margin-right: 40px !important; margin-left: 40px !important;}
.mx-50 { margin-right: 50px !important; margin-left: 50px !important;}
.mx-60 { margin-right: 60px !important; margin-left: 60px !important;}
.mx-100 { margin-right: 100px !important; margin-left: 100px !important;}
.mx-120 { margin-right: 120px !important; margin-left: 120px !important;}

.my-00, .my-00 * { margin-top: 0 !important; margin-bottom: 0 !important;}
.my-05 { margin-top: 5px !important; margin-bottom: 5px !important;}
.my-10 { margin-top: 10px !important; margin-bottom: 10px !important;}
.my-15 { margin-top: 15px !important; margin-bottom: 15px !important;}
.my-20 { margin-top: 20px !important; margin-bottom: 20px !important;}
.my-25 { margin-top: 25px !important; margin-bottom: 25px !important;}
.my-30 { margin-top: 30px !important; margin-bottom: 30px !important;}
.my-40 { margin-top: 40px !important; margin-bottom: 40px !important;}
.my-50 { margin-top: 50px !important; margin-bottom: 50px !important;}
.my-60 { margin-top: 60px !important; margin-bottom: 60px !important;}
.my-100 { margin-top: 100px !important; margin-bottom: 100px !important;}
.my-120 { margin-top: 120px !important; margin-bottom: 120px !important;}

.p-00, .p-00 * { padding: 0 !important;}
.p-05 { padding: 5px !important;}
.p-10 { padding: 10px !important;}
.p-15 { padding: 15px !important;}
.p-20 { padding: 20px !important;}
.p-25 { padding: 25px !important;}
.p-30 { padding: 30px !important;}
.p-40 { padding: 40px !important;}
.p-50 { padding: 50px !important;}
.p-60 { padding: 60px !important;}
.p-100 { padding: 100px !important;}
.p-120 { padding: 120px !important;}

.pt-00, .pt-00 * { padding-top: 0 !important;}
.pt-05 { padding-top: 5px !important;}
.pt-10 { padding-top: 10px !important;}
.pt-15 { padding-top: 15px !important;}
.pt-20 { padding-top: 20px !important;}
.pt-25 { padding-top: 25px !important;}
.pt-30 { padding-top: 30px !important;}
.pt-40 { padding-top: 40px !important;}
.pt-50 { padding-top: 50px !important;}
.pt-60 { padding-top: 60px !important;}
.pt-100 { padding-top: 100px !important;}
.pt-120 { padding-top: 120px !important;}

.pb-00, .pb-00 * { padding-bottom: 0 !important;}
.pb-05 { padding-bottom: 5px !important;}
.pb-10 { padding-bottom: 10px !important;}
.pb-15 { padding-bottom: 15px !important;}
.pb-20 { padding-bottom: 20px !important;}
.pb-25 { padding-bottom: 25px !important;}
.pb-30 { padding-bottom: 30px !important;}
.pb-40 { padding-bottom: 40px !important;}
.pb-50 { padding-bottom: 50px !important;}
.pb-60 { padding-bottom: 60px !important;}
.pb-100 { padding-bottom: 100px !important;}
.pb-120 { padding-bottom: 120px !important;}

.pr-00, .pr-00 * { padding-right: 0 !important;}
.pr-05 { padding-right: 5px !important;}
.pr-10 { padding-right: 10px !important;}
.pr-15 { padding-right: 15px !important;}
.pr-20 { padding-right: 20px !important;}
.pr-25 { padding-right: 25px !important;}
.pr-30 { padding-right: 30px !important;}
.pr-40 { padding-right: 40px !important;}
.pr-50 { padding-right: 50px !important;}
.pr-60 { padding-right: 60px !important;}
.pr-100 { padding-right: 100px !important;}
.pr-120 { padding-right: 120px !important;}

.pl-00, .pl-00 * { padding-left: 0 !important;}
.pl-05 { padding-left: 5px !important;}
.pl-10 { padding-left: 10px !important;}
.pl-15 { padding-left: 15px !important;}
.pl-20 { padding-left: 20px !important;}
.pl-25 { padding-left: 25px !important;}
.pl-30 { padding-left: 30px !important;}
.pl-40 { padding-left: 40px !important;}
.pl-50 { padding-left: 50px !important;}
.pl-60 { padding-left: 60px !important;}
.pl-100 { padding-left: 100px !important;}
.pl-120 { padding-left: 120px !important;}

.px-00, .px-00 * { padding-right: 0 !important; padding-left: 0 !important;}
.px-05 { padding-right: 5px !important; padding-left: 5px !important;}
.px-10 { padding-right: 10px !important; padding-left: 10px !important;}
.px-15 { padding-right: 15px !important; padding-left: 15px !important;}
.px-20 { padding-right: 20px !important; padding-left: 20px !important;}
.px-25 { padding-right: 25px !important; padding-left: 25px !important;}
.px-30 { padding-right: 30px !important; padding-left: 30px !important;}
.px-40 { padding-right: 40px !important; padding-left: 40px !important;}
.px-50 { padding-right: 50px !important; padding-left: 50px !important;}
.px-60 { padding-right: 60px !important; padding-left: 60px !important;}
.px-100 { padding-right: 100px !important; padding-left: 100px !important;}
.px-120 { padding-right: 120px !important; padding-left: 120px !important;}

.py-00, .py-00 * { padding-top: 0 !important; padding-bottom: 0 !important;}
.py-05 { padding-top: 5px !important; padding-bottom: 5px !important;}
.py-10 { padding-top: 10px !important; padding-bottom: 10px !important;}
.py-15 { padding-top: 15px !important; padding-bottom: 15px !important;}
.py-20 { padding-top: 20px !important; padding-bottom: 20px !important;}
.py-25 { padding-top: 25px !important; padding-bottom: 25px !important;}
.py-30 { padding-top: 30px !important; padding-bottom: 30px !important;}
.py-40 { padding-top: 40px !important; padding-bottom: 40px !important;}
.py-50 { padding-top: 50px !important; padding-bottom: 50px !important;}
.py-60 { padding-top: 60px !important; padding-bottom: 60px !important;}
.py-100 { padding-top: 100px !important; padding-bottom: 100px !important;}
.py-120 { padding-top: 120px !important; padding-bottom: 120px !important;}


/*
----------------
heading
----------------
*/

.h, .h * {font-weight: bold;}

.page-content h1, .page-content .h1, .page-content .h1 * { font-size: 36px !important;}
.page-content h2, .page-content .h2, .page-content .h2 * { font-size: 24px !important;}
.page-content h3, .page-content .h3, .page-content .h3 * { font-size: 18px !important;}
.page-content h4, .page-content .h4, .page-content .h4 * { font-size: 16px !important;}


@media screen and (max-width: 768px){
.page-content h1, .page-content .h1, .page-content .h1 * { font-size: 27px !important;}
.page-content h2, .page-content .h2, .page-content .h2 * { font-size: 16px !important;}
.page-content h3, .page-content .h3, .page-content .h3 * { font-size: 12px !important;}
.page-content h4, .page-content .h4, .page-content .h4 * { font-size: 12px !important;}

}

/*
----------------
table
----------------
*/

.table { border-top: 2px solid #ccc; border-bottom: 2px solid #ccc;}

.table .tr { border-top: 1px dotted #ccc; padding: 10px 10px 5px;}


/*
----------------
layout
----------------
*/

.w-640 {max-width: 640px; width: 100%;}
.w-800 {max-width: 800px; width: 100%;}

/*
----------------
text
----------------
*/

.lh-10, .lh-10 * {line-height:1.0;}
.lh-11, .lh-11 * {line-height:1.1;}
.lh-12, .lh-12 * {line-height:1.2;}
.lh-13, .lh-13 * {line-height:1.3;}
.lh-14, .lh-14 * {line-height:1.4;}
.lh-15, .lh-15 * {line-height:1.5;}
.lh-16, .lh-16 * {line-height:1.6;}
.lh-17, .lh-17 * {line-height:1.7;}
.lh-18, .lh-18 * {line-height:1.8;}
.lh-19, .lh-19 * {line-height:1.9;}
.lh-20, .lh-20 * {line-height:2.0;}
.lh-25, .lh-25 * {line-height:2.5;}
.lh-30, .lh-30 * {line-height:3.0;}

.small, .small * { font-size: 85%;}

/*
----------------
image
----------------
*/

.fit img { width: 100%; height: auto;}


/*
----------------
text alignment
----------------
*/

.text-left, .text-left * { text-align: left;}
.text-center, .text-center * { text-align: center;}
.text-right, .text-right * { text-align: right;}

/*
----------------
alignment
----------------
*/


/*
----------------
font size
----------------
*/


/*
----------------
font weight
----------------
*/


/*
----------------
form inline
----------------
*/



/*
----------------
input-group
----------------
*/



/*
----------------
alert
----------------
*/



/*[EOF]*/