:root {
    --primary: #4772BE;
    --secondary: #C7D5F2;
}

body {
    font-family: 'Spartan', sans-serif;
    font-weight: 400;
    font-size: 1rem;
}

/*------------------------------------
  Main Colors
------------------------------------*/
.g-bg-primary {
    background-color: var(--primary) !important;
}

.g-bg-primary--hover:hover {
    background-color: var(--primary) !important;
}

.g-bg-secondary {
    background-color: var(--secondary) !important;
}

.g-color-primary {
    color: var(--primary) !important;
}

.g-brd-primary {
    border-color: var(--primary) !important;
}

.g-brd-primary--before::before {
    border-color: var(--primary) !important;
}

/*------------------------------------
  Background images
------------------------------------*/
.gr-bg-discount-code-blue{
    background-image: url("https://dbf494d77ed7e7544c04-f159651a7cba186adf40310b2873a334.ssl.cf1.rackcdn.com/Referral%20Tracking%20Template/img%20template%20discount%20code/blue-1.jpg");
}
.gr-bg-blue-col-img{
  background-image: url("https://dbf494d77ed7e7544c04-f159651a7cba186adf40310b2873a334.ssl.cf1.rackcdn.com/Referral%20Tracking%20Template/img%20template%20discount%20code/blue-2.jpg");
}

/*------------------------------------
  Brand image
------------------------------------*/
.gr-brand {
    height: auto;
    max-width: 150px;
}

/*------------------------------------
  Form Input
------------------------------------*/
.rounded-0 input{
    border-radius: 0 !important;
}
/*------------------------------------
  Discount Text
------------------------------------*/
@media (min-width: 450px){
    .g-larger-discount-amount{
        left: 0px !important;
    }
}

/*------------------------------------
  Terms and Conditions Checkbox
------------------------------------*/
.gr-discount-checkbox {
    -ms-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -webkit-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
}

.gr-discount-code-border {
    background-image:linear-gradient(to right, var(--primary) 50%, transparent 50%),
    linear-gradient(to right, var(--primary) 50%, transparent 50%),
    linear-gradient(to bottom, var(--primary) 50%, transparent 50%),
    linear-gradient(to bottom, var(--primary) 50%, transparent 50%);
    background-position: left top, left bottom, left top, right top;
    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
    background-size: 18px 2px, 18px 2px, 2px 18px, 2px 18px;
}