/* This general font for the site. */
@font-face {
    font-family: "LibreBaskerville-Regular";
    src: url("../fonts/LibreBaskerville-Regular.ttf") format("truetype");
}

@font-face {
    font-family: "Cabin-Regular";
    src: url("../fonts/Cabin-Regular.ttf") format("truetype");
}

@font-face {
    font-family: "Cabin-Bold";
    src: url("../fonts/Cabin-Bold.ttf") format("truetype");
}

/* Direct override of the Bootstrap 4 code to set the font family */
 html {
    font-family: "LibreBaskerville-Regular";
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
  
body {
    margin: 0;
    font-family: "LibreBaskerville-Regular";
    font-size: 1.0rem;
    font-weight: 400;
    line-height: 1.15;
    color: #212529;
    text-align: left;
    background-color: #89bac1;
}

/* Index page card background colour */
.cardindex {
  background-color: #e0e0e0;
}

/* This font is for All Aerospace headings. */
@font-face {
    font-family: "Copperplate-Gothic";
    src: url("../fonts/COPRGTB.ttf") format("truetype");
}

/* Amazing Aerospace heading style */
.aa-page-heading {
    font-family: 'Copperplate-Gothic', serif;
    font-size: 8vw;
    font-weight: 400;
    line-height: 1.0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
    color: #000000 !important;
    text-shadow: 4px 4px 2px #a9a9a9;
}

/* Pen Pencil Bristles heading style */
.ppb-page-heading {
  font-family: 'LibreBaskerville-Regular', serif;
  font-size: 5vw;
  font-weight: 400;
  line-height: 1.2;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
  color: #000000 !important;
  text-shadow: 4px 4px 2px #a9a9a9;
}

/* This font is for Skyluxe headings. */
@font-face {
    font-family: "Smythe-Regular";
    src: url("../fonts/Smythe-Regular.ttf") format("truetype");
}

/* Skyluxe heading style */
.sd-page-heading {
    font-family: 'Smythe-Regular', serif;
    font-size: 9vw;
    font-weight: 400;
    line-height: 1.2;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: #007BC7;
    background-image: linear-gradient(180deg, #006999, #A8C4E6);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

/* Skyluxe card background colour */
.cardsd {
    background-color: #d5f0f9;
}

.sd-text-muted {
    color: #bee7f6 !important;
}

/* This font is for Tarkine headings. */
@font-face {
    font-family: "Hill-House";
    src: url("../fonts/Hill-House.ttf") format("truetype");
}

/* Tarkine heading style */
.tt-page-heading1 {
    font-family: 'Hill-House', serif;
    font-size: 11vw;
    font-weight: 400;
    line-height: 1.0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: #C49A72;
    background-image: linear-gradient(180deg, #432324, #F9CA92);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent;
}

  /* Tarkine heading style */
.tt-page-heading2 {
    font-family: 'Hill-House', serif;
    font-size: 9vw;
    font-weight: 400;
    line-height: 1.0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
    background-color: #C49A72;
    background-image: linear-gradient(0deg, #432324, #F9CA92);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

.tt-page-heading3 {
    font-family: 'Hill-House', serif;
    font-size: 6vw;
    font-weight: 400;
    line-height: 1.0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: #C49A72;
    background-image: linear-gradient(180deg, #432324, #F9CA92);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent;
}

/* Tarkine background colour */
.cardtt {
    background-color: #F9CA92;
}

.tt-text-muted {
    color: #F9CA92 !important;
}

/* This font is for Aircat and Verdajuvel headings. */
@font-face {
    font-family: "Futura";
    src: url("../fonts/Futura-Md-BT.ttf") format("truetype");
}

/* Aircat heading style */
.ao-page-heading1 {
    font-family: 'Futura', serif;
    font-size: 12vw;
    font-weight: 400;
    line-height: 0.8;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: #33B3E7;
    background-image: linear-gradient(180deg, #04A9FC, #99FFFF);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

  /* Aircat heading style */
.ao-page-heading2 {
    font-family: 'Futura', serif;
    font-size: 9vw;
    font-weight: 400;
    line-height: 0.8;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
    background-color: #33B3E7;
    background-image: linear-gradient(0deg, #04A9FC, #99FFFF);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

/* Aircat background colour */
.cardao {
    background-color: #99FFFF;
}

.ao-text-muted {
    color: #99FFFF !important;
}

/* This font is for Mondiale headings. */
@font-face {
    font-family: "Geometos";
    src: url("../fonts/Geometos.ttf") format("truetype");
}

/* Mondiale heading style */
.ms-page-heading1 {
    font-family: 'Geometos', serif;
    font-size: 9vw;
    font-weight: 400;
    line-height: 1.0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: #33B3E7;
    background-image: url(../images/MondialeVectorFill.jpg);
    /* Set the background size and repeat properties. */
    background-size: 80%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

  /* Mondiale heading style */
.ms-page-heading2 {
    font-family: 'Geometos', serif;
    font-size: 7vw;
    font-weight: 400;
    line-height: 1.0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
    background-color: #33B3E7;
    background-image: url(../images/MondialeVectorFill.jpg);
    /* Set the background size and repeat properties. */
    background-size: 80%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

/* Mondiale background colour */
.cardms {
    background-color: #EE9803;
}

.ms-text-muted {
    color: #FFC100 !important;
}

/* This font is for Archangel II headings. */
@font-face {
    font-family: "Earthbound";
    src: url("../fonts/Earthbound-Regular.otf") format("opentype");
}

/* Archangel II heading style */
.am-page-heading1 {
    font-family: 'Earthbound', serif;
    font-size: 8vw;
    font-weight: 400;
    line-height: 1.0
    ;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: #E7AD63;
    background-image: linear-gradient(180deg, #C37C44, #E7AD63);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

  /* Archangel II heading style */
.am-page-heading2 {
    font-family: 'Earthbound', serif;
    font-size: 8vw;
    font-weight: 400;
    line-height: 0.8;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
    background-color: #E7AD63;
    background-image: linear-gradient(0deg, #C37C44, #E7AD63);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

/* Archangel II background colour */
.cardam {
    background-color: #E7AD63;
}

.am-text-muted {
    color: #E7AD63 !important;
}

/* Verdajuvel heading style */
.vg-page-heading1 {
    font-family: 'Futura', serif;
    font-size: 9vw;
    font-weight: 400;
    line-height: 0.9;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-color: #a9ed60;
    background-image: linear-gradient(to right, #1C4B01, #91EB32, #1C4B01);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

  /* Verdajuvel heading style */
.vg-page-heading2 {
    font-family: 'Futura', serif;
    font-size: 8vw;
    font-weight: 400;
    line-height: 0.9;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
    background-color: #a9ed60;
    background-image: linear-gradient(to right, #1C4B01, #91EB32, #1C4B01);
    /* Set the background size and repeat properties. */
    background-size: 100%;
    background-repeat: repeat;
    /* Use the text as a mask for the background. */
    /* This will show the gradient as a text color rather than element bg. */
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-background-clip: text;
    -moz-text-fill-color: transparent; 
}

/* Verdajuvel background colour */
.cardvg {
    background-color: #a9ed60;
}

.vg-text-muted {
    color: #91EB32 !important;
}

/* Laxfala collection related. */
.jumboLaxfala{
    margin-top: 20px;
    background-image: url("../images/galaxies2.jpg");
    background-origin: content-box;
    background-position: center center;
    color: white;
}

/* Unique collection related. */
.jumboUnique{
    margin-top: 20px;
    background-image: url("../images/r-dCloud01.jpg");
    background-origin: content-box;
    background-position: center bottom;
    color: white;
}

.lx-text-muted {
    color: #7fa8b6 !important;
}

.actionlink {
    font-family: 'Cabin-Regular', serif;
    font-size: 0.8rem;
    font-weight: 400;
    line-height: 1.0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(94, 92, 92, 0.453);  
}

.navbar-brand {
    display: inline-block;
    padding-top: 0.3125rem;
    padding-bottom: 0.3125rem;
    margin-right: 1rem;
    font-size: 1.5rem;
    line-height: inherit;
    white-space: nowrap;
}

.container {
    padding: 1rem;
}

img.image-fluid {
    margin: 20px 0px 0px 20px;
}

.jumbotron{
    margin-top: 20px;
    padding-top: 0%;
    padding-bottom: 0%;
    background-color: white;
}

.announceheading {
    padding-top: 2%;
    font-family: 'Cabin-Bold', serif;
    font-size: 2.0rem;
    font-weight: 400;
    line-height: 1.2;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
}

.announcelargeheading {
    padding-top: 1%;
    font-family: 'Cabin-Regular', serif;
    font-size: 3.0rem;
    font-weight: 400;
    line-height: 1.2;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
}

.announcesubheading {
    font-family: 'Cabin-Regular', serif;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.2;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
}

.shipheading {
    font-family: 'Cabin-Regular', serif;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.2;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
}

.announcesubheading2 {
    font-family: 'Cabin-Regular', serif;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.2;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
}

.blog-main {
    background-color: #ffffff;
}

p {
    font-family: 'Cabin-Regular', serif;
    font-size: 1.0rem;
    font-weight: 400;
    line-height: 1.4;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
}

.piece {
    padding-top: 1%;
    text-align: left;
    font-family: 'Cabin-Regular', sans-serif;
    font-size: 1.0rem;
    font-weight: 400;
    line-height: 1.4;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
    color: #000000 !important;
    /* text-shadow: 4px 4px 2px #a9a9a9; */
}

li {
    font-family: 'Cabin-Regular', sans-serif;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.4;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
}

.textli {
    font-family: 'Cabin-Regular', sans-serif;
    font-size: 1.0rem;
    font-weight: 400;
    line-height: 1.2;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
}

figcaption {
    margin: 10px;
    font-family: 'Cabin-Regular', sans-serif;
    font-size: 0.8rem;
    font-weight: 400;
    line-height: 1.2;
    color: #212529;
    text-align: center;
}

.small {
    font-family: 'Cabin-Regular', sans-serif;
    font-size: 0.8rem;
    font-weight: 400;
    line-height: 1.2;
}


.text-muted {
    color: #eaf0f2 !important;
}

