[type="checkbox"].tick:checked+span:not(.lever):before{

	border-right:2px solid #b71c1c;
	border-bottom:2px solid #b71c1c;
  /* if just wanted to change the color of tick mark you can change the above borders 	 */
  
}

 [type="checkbox"].tick:checked+span:not(.lever):after{
	
	border:1px solid #b71c1c;
	background-color: #b71c1c;
   
  /* if you want to change the filling color when the user checks the box by mouse click you can change the above values */
}

[type="checkbox"].tick.tabbed:checked:focus+span:not(.lever):after{
	
	background-color:black;
	border-color:black;
  
  /* if you want to change the filling color when the user checks the box by pressing tab and press spacebar you can change the above values */
}

html {
    font-size: 22px
}

/* label focus color */
 .input-field input:focus + label {
   color: #b71c1c !important;
 }
 /* label underline focus color */
 .row .input-field input:focus {
   border-bottom: 1px solid #b71c1c !important;
   box-shadow: 0 1px 0 0 #b71c1c !important
 }

 .row .no-margin-bottom {
  margin-left: auto;
  margin-right: auto;
}

 .row .col[class="no-padding"] {
  float: left;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-height: 1px;
}

h1 {
font-family: "Oswald", cursive;
  font-size: 8rem;
  font-weight: 400;
  font-optical-sizing: auto;
  letter-spacing: 4px
}

h2 {
  font-family: "Oswald", cursive;
  font-size: 6rem;
  font-weight: 400;
  font-optical-sizing: auto;
  letter-spacing: 3px
}
h3 {
font-family: "Oswald", cursive;
  font-size: 4rem;
  font-weight: 300;
  font-optical-sizing: auto;
  font-weight: 40;
}
h4 {
font-family: "Oswald", cursive;
  font-size: 3rem;
  font-weight: 200;
  font-optical-sizing: auto;
}

h5 h6 {
font-family: "Oswald", cursive;
  font-size: 2rem;
  font-weight: 100;
  font-optical-sizing: auto;
}

p, span, a {
  font-family: "Oswald", cursive;
  font-weight: 90;
  font-style: normal;
  letter-spacing: 2px
}

.simple-margin-left {
  margin-left: 5%
}

nav {
  background-color: white;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none !important;
  color: black;
}

nav .brand-logo {
  color: black;
  font-family: "Oswald", cursive;
  font-weight: 400;
  font-style: normal;
}

nav ul a {
  color: black;
  font-family: "Oswald", cursive;
  font-weight: 300;
  font-style: normal;
}

blockquote {
  border-left: 5px solid black;
}

.pagination li.active {
  background-color: black;
}

.google-font-h1 {
   font-family: "Oswald", cursive;
   font-weight: 500;
   font-style: normal;
}

.vintage-white {
    background: #FFF5E4
}

.vintage-blue {
    background: #C1D8C3
}

.vintage-red {
    background: #C96868
}

@media only screen and (max-width: 600px) {
    .hide-on-small-only {
        display: none !important;
    }
    nav a.brand-logo {
        font-size: 1.1rem;
    }
    nav ul li div.user-view a.brand-logo {
        color: black;
    }
}

/* Your custom CSS file (e.g., custom.css) */

/* Apply flow-text styles to headings on smaller screens */
@media only screen and (max-width: 992px) { /* Materialize's breakpoint for larger screens */
  h1.flow-text { font-size: 1.8rem; }
  h2.flow-text { font-size: 1.6rem; }
  h3.flow-text { font-size: 1.4rem; }
  h4.flow-text { font-size: 1.3rem; }
  h5.flow-text { font-size: 1.2rem; }
  h6.flow-text { font-size: 1.1rem; }
}

/* Desktop - Set fixed font sizes for headings with flow-text */
@media only screen and (min-width: 993px) {
  h1.flow-text {
    font-size: 8rem
  }
  h2.flow-text {
    font-size: 6rem
  }
  h3.flow-text {
    font-size: 4rem
  }
  h4.flow-text {
    font-size: 3rem
  }
  h5.flow-text {
    font-size: 2rem
  }
  h6.flow-text {
    font-size: 1rem
  }
}

.card {
    border-radius: 20px;
}

.collection {
    border-radius: 20px;
}

.pagination li i {
    font-size: 1.4rem;
}

.pagination li a {
    font-size: 1rem;
}

footer {
    border-radius: 15px;
}