@import url('https://lacasuriortodoxe.ro/scripturi/fonturi/literata/style.css');
@import url('https://lacasuriortodoxe.ro/scripturi/fonturi/source-sans-pro/style.css');


/* ============================================
   MAIN DESIGN
   ============================================ */

:root {
    --font-family-1: 'Literata', Arial, Tahoma, Helvetica, sans-serif;
    --font-family-2: 'Source Sans Pro', Arial, Tahoma, Helvetica, sans-serif;
    --font-size-base: 10px;
    --font-weight-bold: 700;
    --body-background: #FCFCF2;
    
    --color-white: #FFFFFF;
    
    --background-color-primary: #c5a63d;
    --border-color-primary: #c5a63d;
    --color-primary: #c5a63d;
    
    --color-success: #5BB594;
    --color-danger:  #FC3E2A;
}

/* ============================================
   GENERAL
   ============================================ */

/* Main styles */
*, *::before, *::after { box-sizing: border-box; border: 0; text-decoration: none; font-family: inherit; font-size: inherit; text-align: inherit; word-wrap: break-word; }
html { padding: 0; margin: 0; font-size: var(--font-size-base); }
body { padding: 0; margin: 0; font-size: 1.4rem; font-family: var(--font-family-1); background: var(--body-background); }

/* Basic elements */
a { color: #990000; text-decoration: none; }
img { max-width: 100%; }
b { font-weight: var(--font-weight-bold);}
strong { font-weight: bold; }
input, textarea, button, label { margin: 0; padding: 0; }

/* Basic helpers */
.block { display: block; }
.iblock { display: inline-block; vertical-align: top; }
.clear { clear: both; }
.overflow { overflow: auto; }
.hidden { display: none; }

@media all and (max-width: 768px) {
    .on-sm { display: block; }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .on-md { display: block; }
}

@media (min-width: 1024px) {
    .on-lg { display: block; }
}

/* ============================================
   ALIGNMENT
   ============================================ */

/* Text alignment */
.tleft { text-align: left; }
.tright { text-align: right; }
.tcenter { text-align: center; }

/* Floats */
.left { float: left; }
.right { float: right; }
.center { margin-left: auto; margin-right: auto; }

/* ============================================
   SPACING UTILITIES
   ============================================ */

/* No margin */
.m0 { margin: 0; }

/* Margin classes (all sides) */
.m1 { margin: 0.1rem; }
.m2 { margin: 0.2rem; }
.m3 { margin: 0.3rem; }
.m4 { margin: 0.4rem; }
.m5 { margin: 0.5rem; }
.m6 { margin: 0.6rem; }
.m7 { margin: 0.7rem; }
.m8 { margin: 0.8rem; }
.m9 { margin: 0.9rem; }
.m10 { margin: 1rem; }
.m11 { margin: 1.1rem; }
.m12 { margin: 1.2rem; }
.m13 { margin: 1.3rem; }
.m14 { margin: 1.4rem; }
.m15 { margin: 1.5rem; }
.m16 { margin: 1.6rem; }
.m17 { margin: 1.7rem; }
.m18 { margin: 1.8rem; }
.m19 { margin: 1.9rem; }
.m20 { margin: 2rem; }
.m21 { margin: 2.1rem; }
.m22 { margin: 2.2rem; }
.m23 { margin: 2.3rem; }
.m24 { margin: 2.4rem; }
.m25 { margin: 2.5rem; }
.m26 { margin: 2.6rem; }
.m27 { margin: 2.7rem; }
.m28 { margin: 2.8rem; }
.m29 { margin: 2.9rem; }
.m30 { margin: 3rem; }
.m31 { margin: 3.1rem; }
.m32 { margin: 3.2rem; }
.m33 { margin: 3.3rem; }
.m34 { margin: 3.4rem; }
.m35 { margin: 3.5rem; }
.m36 { margin: 3.6rem; }
.m37 { margin: 3.7rem; }
.m38 { margin: 3.8rem; }
.m39 { margin: 3.9rem; }
.m40 { margin: 4rem; }

/* Margin directional classes */
.mt1 { margin-top: 0.1rem; }
.mt2 { margin-top: 0.2rem; }
.mt3 { margin-top: 0.3rem; }
.mt4 { margin-top: 0.4rem; }
.mt5 { margin-top: 0.5rem; }
.mt6 { margin-top: 0.6rem; }
.mt7 { margin-top: 0.7rem; }
.mt8 { margin-top: 0.8rem; }
.mt9 { margin-top: 0.9rem; }
.mt10 { margin-top: 1rem; }
.mt11 { margin-top: 1.1rem; }
.mt12 { margin-top: 1.2rem; }
.mt13 { margin-top: 1.3rem; }
.mt14 { margin-top: 1.4rem; }
.mt15 { margin-top: 1.5rem; }
.mt16 { margin-top: 1.6rem; }
.mt17 { margin-top: 1.7rem; }
.mt18 { margin-top: 1.8rem; }
.mt19 { margin-top: 1.9rem; }
.mt20 { margin-top: 2rem; }
.mt21 { margin-top: 2.1rem; }
.mt22 { margin-top: 2.2rem; }
.mt23 { margin-top: 2.3rem; }
.mt24 { margin-top: 2.4rem; }
.mt25 { margin-top: 2.5rem; }
.mt26 { margin-top: 2.6rem; }
.mt27 { margin-top: 2.7rem; }
.mt28 { margin-top: 2.8rem; }
.mt29 { margin-top: 2.9rem; }
.mt30 { margin-top: 3rem; }
.mt31 { margin-top: 3.1rem; }
.mt32 { margin-top: 3.2rem; }
.mt33 { margin-top: 3.3rem; }
.mt34 { margin-top: 3.4rem; }
.mt35 { margin-top: 3.5rem; }
.mt36 { margin-top: 3.6rem; }
.mt37 { margin-top: 3.7rem; }
.mt38 { margin-top: 3.8rem; }
.mt39 { margin-top: 3.9rem; }
.mt40 { margin-top: 4rem; }

.mb1 { margin-bottom: 0.1rem; }
.mb2 { margin-bottom: 0.2rem; }
.mb3 { margin-bottom: 0.3rem; }
.mb4 { margin-bottom: 0.4rem; }
.mb5 { margin-bottom: 0.5rem; }
.mb6 { margin-bottom: 0.6rem; }
.mb7 { margin-bottom: 0.7rem; }
.mb8 { margin-bottom: 0.8rem; }
.mb9 { margin-bottom: 0.9rem; }
.mb10 { margin-bottom: 1rem; }
.mb11 { margin-bottom: 1.1rem; }
.mb12 { margin-bottom: 1.2rem; }
.mb13 { margin-bottom: 1.3rem; }
.mb14 { margin-bottom: 1.4rem; }
.mb15 { margin-bottom: 1.5rem; }
.mb16 { margin-bottom: 1.6rem; }
.mb17 { margin-bottom: 1.7rem; }
.mb18 { margin-bottom: 1.8rem; }
.mb19 { margin-bottom: 1.9rem; }
.mb20 { margin-bottom: 2rem; }
.mb21 { margin-bottom: 2.1rem; }
.mb22 { margin-bottom: 2.2rem; }
.mb23 { margin-bottom: 2.3rem; }
.mb24 { margin-bottom: 2.4rem; }
.mb25 { margin-bottom: 2.5rem; }
.mb26 { margin-bottom: 2.6rem; }
.mb27 { margin-bottom: 2.7rem; }
.mb28 { margin-bottom: 2.8rem; }
.mb29 { margin-bottom: 2.9rem; }
.mb30 { margin-bottom: 3rem; }
.mb31 { margin-bottom: 3.1rem; }
.mb32 { margin-bottom: 3.2rem; }
.mb33 { margin-bottom: 3.3rem; }
.mb34 { margin-bottom: 3.4rem; }
.mb35 { margin-bottom: 3.5rem; }
.mb36 { margin-bottom: 3.6rem; }
.mb37 { margin-bottom: 3.7rem; }
.mb38 { margin-bottom: 3.8rem; }
.mb39 { margin-bottom: 3.9rem; }
.mb40 { margin-bottom: 4rem; }

.ml1 { margin-left: 0.1rem; }
.ml2 { margin-left: 0.2rem; }
.ml3 { margin-left: 0.3rem; }
.ml4 { margin-left: 0.4rem; }
.ml5 { margin-left: 0.5rem; }
.ml6 { margin-left: 0.6rem; }
.ml7 { margin-left: 0.7rem; }
.ml8 { margin-left: 0.8rem; }
.ml9 { margin-left: 0.9rem; }
.ml10 { margin-left: 1rem; }
.ml11 { margin-left: 1.1rem; }
.ml12 { margin-left: 1.2rem; }
.ml13 { margin-left: 1.3rem; }
.ml14 { margin-left: 1.4rem; }
.ml15 { margin-left: 1.5rem; }
.ml16 { margin-left: 1.6rem; }
.ml17 { margin-left: 1.7rem; }
.ml18 { margin-left: 1.8rem; }
.ml19 { margin-left: 1.9rem; }
.ml20 { margin-left: 2rem; }
.ml21 { margin-left: 2.1rem; }
.ml22 { margin-left: 2.2rem; }
.ml23 { margin-left: 2.3rem; }
.ml24 { margin-left: 2.4rem; }
.ml25 { margin-left: 2.5rem; }
.ml26 { margin-left: 2.6rem; }
.ml27 { margin-left: 2.7rem; }
.ml28 { margin-left: 2.8rem; }
.ml29 { margin-left: 2.9rem; }
.ml30 { margin-left: 3rem; }
.ml31 { margin-left: 3.1rem; }
.ml32 { margin-left: 3.2rem; }
.ml33 { margin-left: 3.3rem; }
.ml34 { margin-left: 3.4rem; }
.ml35 { margin-left: 3.5rem; }
.ml36 { margin-left: 3.6rem; }
.ml37 { margin-left: 3.7rem; }
.ml38 { margin-left: 3.8rem; }
.ml39 { margin-left: 3.9rem; }
.ml40 { margin-left: 4rem; }

.mr1 { margin-right: 0.1rem; }
.mr2 { margin-right: 0.2rem; }
.mr3 { margin-right: 0.3rem; }
.mr4 { margin-right: 0.4rem; }
.mr5 { margin-right: 0.5rem; }
.mr6 { margin-right: 0.6rem; }
.mr7 { margin-right: 0.7rem; }
.mr8 { margin-right: 0.8rem; }
.mr9 { margin-right: 0.9rem; }
.mr10 { margin-right: 1rem; }
.mr11 { margin-right: 1.1rem; }
.mr12 { margin-right: 1.2rem; }
.mr13 { margin-right: 1.3rem; }
.mr14 { margin-right: 1.4rem; }
.mr15 { margin-right: 1.5rem; }
.mr16 { margin-right: 1.6rem; }
.mr17 { margin-right: 1.7rem; }
.mr18 { margin-right: 1.8rem; }
.mr19 { margin-right: 1.9rem; }
.mr20 { margin-right: 2rem; }
.mr21 { margin-right: 2.1rem; }
.mr22 { margin-right: 2.2rem; }
.mr23 { margin-right: 2.3rem; }
.mr24 { margin-right: 2.4rem; }
.mr25 { margin-right: 2.5rem; }
.mr26 { margin-right: 2.6rem; }
.mr27 { margin-right: 2.7rem; }
.mr28 { margin-right: 2.8rem; }
.mr29 { margin-right: 2.9rem; }
.mr30 { margin-right: 3rem; }
.mr31 { margin-right: 3.1rem; }
.mr32 { margin-right: 3.2rem; }
.mr33 { margin-right: 3.3rem; }
.mr34 { margin-right: 3.4rem; }
.mr35 { margin-right: 3.5rem; }
.mr36 { margin-right: 3.6rem; }
.mr37 { margin-right: 3.7rem; }
.mr38 { margin-right: 3.8rem; }
.mr39 { margin-right: 3.9rem; }
.mr40 { margin-right: 4rem; }

/* Padding classes (all sides) */
.p1 { padding: 0.1rem; }
.p2 { padding: 0.2rem; }
.p3 { padding: 0.3rem; }
.p4 { padding: 0.4rem; }
.p5 { padding: 0.5rem; }
.p6 { padding: 0.6rem; }
.p7 { padding: 0.7rem; }
.p8 { padding: 0.8rem; }
.p9 { padding: 0.9rem; }
.p10 { padding: 1rem; }
.p11 { padding: 1.1rem; }
.p12 { padding: 1.2rem; }
.p13 { padding: 1.3rem; }
.p14 { padding: 1.4rem; }
.p15 { padding: 1.5rem; }
.p16 { padding: 1.6rem; }
.p17 { padding: 1.7rem; }
.p18 { padding: 1.8rem; }
.p19 { padding: 1.9rem; }
.p20 { padding: 2rem; }
.p21 { padding: 2.1rem; }
.p22 { padding: 2.2rem; }
.p23 { padding: 2.3rem; }
.p24 { padding: 2.4rem; }
.p25 { padding: 2.5rem; }
.p26 { padding: 2.6rem; }
.p27 { padding: 2.7rem; }
.p28 { padding: 2.8rem; }
.p29 { padding: 2.9rem; }
.p30 { padding: 3rem; }
.p31 { padding: 3.1rem; }
.p32 { padding: 3.2rem; }
.p33 { padding: 3.3rem; }
.p34 { padding: 3.4rem; }
.p35 { padding: 3.5rem; }
.p36 { padding: 3.6rem; }
.p37 { padding: 3.7rem; }
.p38 { padding: 3.8rem; }
.p39 { padding: 3.9rem; }
.p40 { padding: 4rem; }

/* Padding directional classes */
.pt1 { padding-top: 0.1rem; }
.pt2 { padding-top: 0.2rem; }
.pt3 { padding-top: 0.3rem; }
.pt4 { padding-top: 0.4rem; }
.pt5 { padding-top: 0.5rem; }
.pt6 { padding-top: 0.6rem; }
.pt7 { padding-top: 0.7rem; }
.pt8 { padding-top: 0.8rem; }
.pt9 { padding-top: 0.9rem; }
.pt10 { padding-top: 1rem; }
.pt11 { padding-top: 1.1rem; }
.pt12 { padding-top: 1.2rem; }
.pt13 { padding-top: 1.3rem; }
.pt14 { padding-top: 1.4rem; }
.pt15 { padding-top: 1.5rem; }
.pt16 { padding-top: 1.6rem; }
.pt17 { padding-top: 1.7rem; }
.pt18 { padding-top: 1.8rem; }
.pt19 { padding-top: 1.9rem; }
.pt20 { padding-top: 2rem; }
.pt21 { padding-top: 2.1rem; }
.pt22 { padding-top: 2.2rem; }
.pt23 { padding-top: 2.3rem; }
.pt24 { padding-top: 2.4rem; }
.pt25 { padding-top: 2.5rem; }
.pt26 { padding-top: 2.6rem; }
.pt27 { padding-top: 2.7rem; }
.pt28 { padding-top: 2.8rem; }
.pt29 { padding-top: 2.9rem; }
.pt30 { padding-top: 3rem; }
.pt31 { padding-top: 3.1rem; }
.pt32 { padding-top: 3.2rem; }
.pt33 { padding-top: 3.3rem; }
.pt34 { padding-top: 3.4rem; }
.pt35 { padding-top: 3.5rem; }
.pt36 { padding-top: 3.6rem; }
.pt37 { padding-top: 3.7rem; }
.pt38 { padding-top: 3.8rem; }
.pt39 { padding-top: 3.9rem; }
.pt40 { padding-top: 4rem; }

.pb1 { padding-bottom: 0.1rem; }
.pb2 { padding-bottom: 0.2rem; }
.pb3 { padding-bottom: 0.3rem; }
.pb4 { padding-bottom: 0.4rem; }
.pb5 { padding-bottom: 0.5rem; }
.pb6 { padding-bottom: 0.6rem; }
.pb7 { padding-bottom: 0.7rem; }
.pb8 { padding-bottom: 0.8rem; }
.pb9 { padding-bottom: 0.9rem; }
.pb10 { padding-bottom: 1rem; }
.pb11 { padding-bottom: 1.1rem; }
.pb12 { padding-bottom: 1.2rem; }
.pb13 { padding-bottom: 1.3rem; }
.pb14 { padding-bottom: 1.4rem; }
.pb15 { padding-bottom: 1.5rem; }
.pb16 { padding-bottom: 1.6rem; }
.pb17 { padding-bottom: 1.7rem; }
.pb18 { padding-bottom: 1.8rem; }
.pb19 { padding-bottom: 1.9rem; }
.pb20 { padding-bottom: 2rem; }
.pb21 { padding-bottom: 2.1rem; }
.pb22 { padding-bottom: 2.2rem; }
.pb23 { padding-bottom: 2.3rem; }
.pb24 { padding-bottom: 2.4rem; }
.pb25 { padding-bottom: 2.5rem; }
.pb26 { padding-bottom: 2.6rem; }
.pb27 { padding-bottom: 2.7rem; }
.pb28 { padding-bottom: 2.8rem; }
.pb29 { padding-bottom: 2.9rem; }
.pb30 { padding-bottom: 3rem; }
.pb31 { padding-bottom: 3.1rem; }
.pb32 { padding-bottom: 3.2rem; }
.pb33 { padding-bottom: 3.3rem; }
.pb34 { padding-bottom: 3.4rem; }
.pb35 { padding-bottom: 3.5rem; }
.pb36 { padding-bottom: 3.6rem; }
.pb37 { padding-bottom: 3.7rem; }
.pb38 { padding-bottom: 3.8rem; }
.pb39 { padding-bottom: 3.9rem; }
.pb40 { padding-bottom: 4rem; }

.pl1 { padding-left: 0.1rem; }
.pl2 { padding-left: 0.2rem; }
.pl3 { padding-left: 0.3rem; }
.pl4 { padding-left: 0.4rem; }
.pl5 { padding-left: 0.5rem; }
.pl6 { padding-left: 0.6rem; }
.pl7 { padding-left: 0.7rem; }
.pl8 { padding-left: 0.8rem; }
.pl9 { padding-left: 0.9rem; }
.pl10 { padding-left: 1rem; }
.pl11 { padding-left: 1.1rem; }
.pl12 { padding-left: 1.2rem; }
.pl13 { padding-left: 1.3rem; }
.pl14 { padding-left: 1.4rem; }
.pl15 { padding-left: 1.5rem; }
.pl16 { padding-left: 1.6rem; }
.pl17 { padding-left: 1.7rem; }
.pl18 { padding-left: 1.8rem; }
.pl19 { padding-left: 1.9rem; }
.pl20 { padding-left: 2rem; }
.pl21 { padding-left: 2.1rem; }
.pl22 { padding-left: 2.2rem; }
.pl23 { padding-left: 2.3rem; }
.pl24 { padding-left: 2.4rem; }
.pl25 { padding-left: 2.5rem; }
.pl26 { padding-left: 2.6rem; }
.pl27 { padding-left: 2.7rem; }
.pl28 { padding-left: 2.8rem; }
.pl29 { padding-left: 2.9rem; }
.pl30 { padding-left: 3rem; }
.pl31 { padding-left: 3.1rem; }
.pl32 { padding-left: 3.2rem; }
.pl33 { padding-left: 3.3rem; }
.pl34 { padding-left: 3.4rem; }
.pl35 { padding-left: 3.5rem; }
.pl36 { padding-left: 3.6rem; }
.pl37 { padding-left: 3.7rem; }
.pl38 { padding-left: 3.8rem; }
.pl39 { padding-left: 3.9rem; }
.pl40 { padding-left: 4rem; }

.pr1 { padding-right: 0.1rem; }
.pr2 { padding-right: 0.2rem; }
.pr3 { padding-right: 0.3rem; }
.pr4 { padding-right: 0.4rem; }
.pr5 { padding-right: 0.5rem; }
.pr6 { padding-right: 0.6rem; }
.pr7 { padding-right: 0.7rem; }
.pr8 { padding-right: 0.8rem; }
.pr9 { padding-right: 0.9rem; }
.pr10 { padding-right: 1rem; }
.pr11 { padding-right: 1.1rem; }
.pr12 { padding-right: 1.2rem; }
.pr13 { padding-right: 1.3rem; }
.pr14 { padding-right: 1.4rem; }
.pr15 { padding-right: 1.5rem; }
.pr16 { padding-right: 1.6rem; }
.pr17 { padding-right: 1.7rem; }
.pr18 { padding-right: 1.8rem; }
.pr19 { padding-right: 1.9rem; }
.pr20 { padding-right: 2rem; }
.pr21 { padding-right: 2.1rem; }
.pr22 { padding-right: 2.2rem; }
.pr23 { padding-right: 2.3rem; }
.pr24 { padding-right: 2.4rem; }
.pr25 { padding-right: 2.5rem; }
.pr26 { padding-right: 2.6rem; }
.pr27 { padding-right: 2.7rem; }
.pr28 { padding-right: 2.8rem; }
.pr29 { padding-right: 2.9rem; }
.pr30 { padding-right: 3rem; }
.pr31 { padding-right: 3.1rem; }
.pr32 { padding-right: 3.2rem; }
.pr33 { padding-right: 3.3rem; }
.pr34 { padding-right: 3.4rem; }
.pr35 { padding-right: 3.5rem; }
.pr36 { padding-right: 3.6rem; }
.pr37 { padding-right: 3.7rem; }
.pr38 { padding-right: 3.8rem; }
.pr39 { padding-right: 3.9rem; }
.pr40 { padding-right: 4rem; }

/* ============================================
   BORDER UTILITIES
   ============================================ */

/* Border radius */
.rounded1 { border-radius: 0.1rem; }
.rounded2 { border-radius: 0.2rem; }
.rounded3 { border-radius: 0.3rem; }
.rounded4 { border-radius: 0.4rem; }
.rounded5 { border-radius: 0.5rem; }
.rounded6 { border-radius: 0.6rem; }
.rounded7 { border-radius: 0.7rem; }
.rounded8 { border-radius: 0.8rem; }
.rounded9 { border-radius: 0.9rem; }
.rounded10 { border-radius: 1rem; }
.rounded11 { border-radius: 1.1rem; }
.rounded12 { border-radius: 1.2rem; }
.rounded13 { border-radius: 1.3rem; }
.rounded14 { border-radius: 1.4rem; }
.rounded15 { border-radius: 1.5rem; }
.rounded16 { border-radius: 1.6rem; }
.rounded17 { border-radius: 1.7rem; }
.rounded18 { border-radius: 1.8rem; }
.rounded19 { border-radius: 1.9rem; }
.rounded20 { border-radius: 2rem; }

/* ============================================
   GRID SYSTEM
   ============================================ */

.container { width: 100%; max-width: 1200px; margin-right: auto; margin-left: auto; }
.container-fluid { width: 100%; margin-right: auto; margin-left: auto; }
.row { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0; }

/* Small devices */
.col-sm-1  { grid-column: span 1; }
.col-sm-2  { grid-column: span 2; }
.col-sm-3  { grid-column: span 3; }
.col-sm-4  { grid-column: span 4; }
.col-sm-5  { grid-column: span 5; }
.col-sm-6  { grid-column: span 6; }
.col-sm-7  { grid-column: span 7; }
.col-sm-8  { grid-column: span 8; }
.col-sm-9  { grid-column: span 9; }
.col-sm-10 { grid-column: span 10; }
.col-sm-11 { grid-column: span 11; }
.col-sm-12 { grid-column: span 12; }

/* Medium devices */
@media (min-width: 768px) {
    .col-md-1  { grid-column: span 1; }
    .col-md-2  { grid-column: span 2; }
    .col-md-3  { grid-column: span 3; }
    .col-md-4  { grid-column: span 4; }
    .col-md-5  { grid-column: span 5; }
    .col-md-6  { grid-column: span 6; }
    .col-md-7  { grid-column: span 7; }
    .col-md-8  { grid-column: span 8; }
    .col-md-9  { grid-column: span 9; }
    .col-md-10 { grid-column: span 10; }
    .col-md-11 { grid-column: span 11; }
    .col-md-12 { grid-column: span 12; }
}

/* Large devices */
@media (min-width: 1024px) {
    .col-lg-1  { grid-column: span 1; }
    .col-lg-2  { grid-column: span 2; }
    .col-lg-3  { grid-column: span 3; }
    .col-lg-4  { grid-column: span 4; }
    .col-lg-5  { grid-column: span 5; }
    .col-lg-6  { grid-column: span 6; }
    .col-lg-7  { grid-column: span 7; }
    .col-lg-8  { grid-column: span 8; }
    .col-lg-9  { grid-column: span 9; }
    .col-lg-10 { grid-column: span 10; }
    .col-lg-11 { grid-column: span 11; }
    .col-lg-12 { grid-column: span 12; }
}

/* ============================================
   FORM
   ============================================ */

form {
    margin-bottom: 20px;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    font-weight: 500;
    margin-bottom: 0.5rem;
    font-family: var(--font-family-2);
    font-size: inherit;
}

.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="password"],
.form-group textarea,
.form-group select {
    width: 100%;
    padding: 0.8rem 1rem;
    border: 0.2rem solid var(--border-color-primary);
    border-radius: 0.5rem;
    font-family: var(--font-family-2);
    font-size: inherit;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
    max-width: 70rem;
}

.form-group input[type="text"]:focus,
.form-group input[type="email"]:focus,
.form-group input[type="password"]:focus,
.form-group textarea:focus,
.form-group select:focus {
    border-color: var(--border-color-primary);
    outline: none;
}
    

/* ============================================
   ARTICLE CONTENT
   ============================================ */

.content h1 {
    font-size: 3.5rem;
    font-weight: var(--font-weight-bold);;
    margin-top: 4.0rem;
}
.content h2, h3, h4, h5, h6 {
    font-size: 2.8rem;
    font-weight: var(--font-weight-bold);;
    margin-top: 3.0rem;
}
.content p {
    display: block;
    margin: 0 auto 0;
    margin-bottom: 1rem;
    line-height: 1.5;
    text-align: justify;
    position: relative;
    font-size: 1.8rem;
}
.content b {
    font-weight: var(--font-weight-bold);;
}
.content i {
    font-style: italic;
}
.content code {
    background: #EFEFEF;
    border-radius: 0.5rem;
    padding: 0.2rem 0.5rem;
}
.content mark {
    background: #F2E7D5;
    border-radius: 0.5rem;
    padding: 0.2rem 0.5rem;
}
.content a {
    color: #990000;
    font-weight: var(--font-weight-bold);;
    padding-bottom: 1px;
    border-bottom: 0.2rem solid #990000;
}
.content a::after {
    content: '';
    position: relative;
    left: 2px;
    height: 2rem;
    width: 2rem;
    margin-right: 2px;
    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPgoJPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz4KCTxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZD0iTTUuNjE2IDIwcS0uNjkxIDAtMS4xNTMtLjQ2MlQ0IDE4LjM4NFY1LjYxNnEwLS42OTEuNDYzLTEuMTUzVDUuNjE2IDRoNS42MTV2MUg1LjYxNnEtLjIzMSAwLS40MjQuMTkyVDUgNS42MTZ2MTIuNzY5cTAgLjIzLjE5Mi40MjN0LjQyMy4xOTJoMTIuNzdxLjIzIDAgLjQyMy0uMTkydC4xOTItLjQyM3YtNS42MTZoMXY1LjYxNnEwIC42OS0uNDYyIDEuMTUyVDE4LjM4NCAyMHptNC4xMjMtNS4wM2wtLjcwOC0uNzA5TDE4LjI5MiA1SDE0VjRoNnY2aC0xVjUuNzA4eiIgLz4KPC9zdmc+Cg==');
    background-size: auto;
    background-size: 2rem 2rem;
    vertical-align: -0.4rem;
    fill: #99000;
    display: inline-block;
}
.content blockquote {
    border-left: 0.5px solid #990000;
    padding-left: 1.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    color: #777;
}
.content pre {
    background: #F3E8E8;
    padding: 1rem 1.5rem;
    color: #000;
    font-family: monospace;
    text-align: left;
    border-radius: 10px;
    font-size: 12px;
    overflow-x: auto;
}
.content .lo-left {
    text-align: left;
}
.content .lo-center {
    text-align: center;
}
.content .lo-right {
    text-align: right;
}
.content p img {
    display: block;
    margin: 0 auto 0;
    max-width: 100%;
}
.content hr {
    width: 100%;
    height: 0.5rem;
    background: #ccc;
    margin-bottom: 1.5rem;
    margin-top: 1.5rem;
    -webkit-user-select: none;
    user-select: none;
}

/* ALERTS */

.alert {
    border: 3px solid transparent;
    padding: 20px;
    border-radius: 15px;
    background-color: var(--color-white);
    font-size: 1.7rem;
    margin-bottom: 20px;
}

.alert.success {
    border-color: var(--color-success);
    color: var(--color-success);
}

.alert.danger {
    border-color: var(--color-danger);
    color: var(--color-danger);
}

.bg-success {
    background-color: var(--color-success);
}

.bg-danger {
    background-color: var(--color-danger);
}

.color-danger {
    color: var(--color-danger);
}

/* Headers */

.header-1 h1 {
    font-family: var(--font-family-2);
    font-weight: bold;
    font-size: 4.5rem;
    color: var(--color-white);
}

/* BUTTONS */

/* Base button styles */
.btn {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 4px;
    font-size: 1.6rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    border: 1px solid transparent;
    font-family: var(--font-family-2);
}

.btn.primary {
    background-color: var(--background-color-primary);
    color: var(--color-white);
}
.btn.primary:hover {
    opacity: 0.6;
}

/* Disabled state */
.btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* LOGIN FORM */

.login-form {
    max-width: 400px;
    width: 100%;
}

.login-form form {
    border: 3px solid var(--border-color-primary);
    padding: 40px;
    border-radius: 1.5rem;
    background-color: var(--color-white);
}

.login-form label {
    font-size: 1.9rem;
    font-weight: bold;
    color: var(--color-primary);
}

.login-form .form-group input[type="text"],
.login-form .form-group input[type="password"] {
    font-size: 1.6rem;
}
