Rominou34/soft-css

/********** TEXT **********/

/* Makes the first letter of the paragraph shifted from the border */
.first-letter-spacing {
  text-indent: 2em;
}

.first-letter-spacing :not(.first-letter-spacing) {
  text-indent: 0;
}

/* Makes the first letter of the paragraph bigger */
.first-letter-big::first-letter {
  font-size: 200%;
}

.first-letter-huge::first-letter {
  font-size: 400%;
}

/* Makes the text float on the left */
.text-left {
  text-align: left !important;
}

/* Makes the text justified */
.text-justify {
  text-align: justify !important;
}

/* Makes the text float on the right */
.text-right {
  text-align: right !important;
}

/* Center the text */
.text-center {
  text-align: center !important;
}


/********** ELEMENTS PLACING **********/

/* Hides the element */
.hidden, [hidden] {
  display: none !important;
}

/* Makes the element float on the left */
.left {
  float: left !important;
}

/* Makes the element float on the right */
.right {
  float: right !important;
}

/* Clears the float on an element */
.clearfix:after {
   content: " ";
   display: block;
   height: 0;
   clear: both;
}

/* Center the element ( suppposing it has a width and it's display: block ) */
.center {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Makes the element takes the full width of its parent */
.fullWidth {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Makes the element takes the full width of the screen */
.fullScreenW {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Makes the element takes the full height of its parent */
.fullHeight {
  height: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Makes the element take the full height of the screen */
.fullScreenH {
  height: 100vh !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/********** ELEMENTS BEHAVIOUR **********/
.disabled {
  pointer-events: none;
}

/********** ELEMENTS ASPECT **********/

/* Sets a subtle background color */
.bg-subtle {
  background-color: $bg-color-primary !important;
}

.bg-subtle.secondary {
  background-color: $bg-color-secondary !important;
}

/* Sets a border */
.border {
  border: 1px solid $border-color-primary !important;
}

.border.secondary {
  border: 1px solid $border-color-secondary !important;
}

.shadow-tiny {
  box-shadow: 1px 1px 3px 0 $shadow-light;
}

.shadow-1 { box-shadow: 1px 2px 6px $shadow-normal; }
.shadow-2 { box-shadow: 2px 4px 12px $shadow-normal; }
.shadow-3 { box-shadow: 3px 6px 18px $shadow-normal; }
.shadow-4 { box-shadow: 4px 8px 24px $shadow-normal; }
.shadow-5 { box-shadow: 5px 10px 30px $shadow-normal; }

/********** SMALL CORRECTIONS ********/

/* Set no padding */
.no-padding {
  padding: 0 !important;
}

/* Set a small padding */
.padding-sm {
  padding: 0.5em !important;
}

/* Set a medium padding */
.padding-md {
  padding: 1em !important;
}

/* Set a big padding */
.padding-lg {
  padding: 2em !important;
}

/* Set no margin */
.no-margin {
  margin: 0 !important;
}

/* Set a small margin */
.margin-sm {
  margin: 0.5em !important;
}

/* Set a medium margin */
.margin-md {
  margin: 1em !important;
}

/* Set a big margin */
.margin-lg {
  margin: 2em !important;
}

/* The margin changes depending on the screen size */
.margin-auto {
  margin: auto !important;
}

/*******************************************************************************
*** ELEMENTS SPECIFIC
*******************************************************************************/

ul.no-style li {
  list-style: none;
}