@charset "UTF-8";
/*/
Theme Name: Carsley
Theme URI: carsley_foundation.com
Author: Axis Cross media
Author URI: http://www.axiscrossmedia.com
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

divv{border: black 1px dashed;}

.bg-fluid {
    transition: all 0.3s;
}

.navbar-scrolled {
    background-color: white;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.20);
}

.playfair-display-extraBold {
  font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-weight: 800;
  font-style: normal;
}

.playfair-display-semi {
  font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}


.barlow-regular {
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.barlow-bold {
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-style: normal;
}

body {
    font-family: 'Barlow', sans-serif;
}

p {
font-family: "Barlow", sans-serif;
  font-weight: 400;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-family: "Playfair Display", serif;
  font-weight: 600;
}

.navbar-nav .nav-item a{color:#000000;}
.navbar-nav .nav-item a:hover{color:#777777;}

.text-blue {
    color:#1177bb;
}
a.text-blue:hover {
    color:#005599;
}

.text-problue {
    color:#22aaee;
}

a > .bg-blue:hover{
    background-color: #005599;
}


.bg-blue {
    background-color: #1177bb;
}

.bg-problue {
    background-color: #22aaee;
}

.bg-lite-blue {
    background-color: #cceeff;
}

.bg-liter-blue {
    background-color: #eeffff;
}

.bg-gray {
    background-color: #999999;
}

.btn-blue {
    --bs-btn-color: #fff;
    --bs-btn-bg: #1177bb;
    --bs-btn-border-color: #1177bb;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #005599;
    --bs-btn-hover-border-color: #005599;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #005599;
    --bs-btn-active-border-color: #005599;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #1177bb;
    --bs-btn-disabled-border-color: #1177bb;
}


.border-blue {
    --bs-border-opacity: 1;
    border-color: #1177bb !important;
    border-top-color: rgb(17, 119, 187);
    border-right-color: rgb(17, 119, 187);
    border-bottom-color: rgb(17, 119, 187);
    border-left-color: rgb(17, 119, 187);
}

.home-hero-image {
  background-image: url("http://www.fpoimg.com/1950x300"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  height: 300px; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
}

.nav-logo{width:230px;}
.pageStart{margin-top:-4rem;}
.heroContainer{height: calc(100vw / 1);}
.homeHeroContainer{height: calc(100vw / 1);}
.homeHeadPosition{margin-top:100px;}
.blogPic {height: 200px;}

@media (min-width: 576px) {
    .nav-logo{width:400px;}
    .pageStart{margin-top:-6rem;}
    .heroContainer{height: calc(100vw / 1.15);}
  .homeHeroContainer{height: calc(100vw / 1.15);}
  .homeHeadPosition{margin-top:125px;}
}

@media (min-width: 768px) {
    .nav-logo{width:400px;}
    .pageStart{margin-top:-6rem;}
    .heroContainer{height: calc(100vw / 1.3);}
  .homeHeroContainer{height: calc(100vw / 1.3);}
  .homeHeadPosition{margin-top:125px;}
  .blogPic {height: 190px;}
}

@media (min-width: 992px) {
    .nav-logo{width:168px;}
    .pageStart{margin-top:-6rem;}
    .heroContainer{height: calc(100vw / 1.6);}
  .homeHeroContainer{height: calc(100vw / 1.6);}
  .homeHeadPosition{margin-top:125px;}
  .blogPic {height: 225px;}
}

@media (min-width: 1200px) {
    .nav-logo{width:350px;}
    .pageStart{margin-top:-6rem;}
    .heroContainer{height: calc(100vw / 2);}
  .homeHeroContainer{height: calc(100vw / 2);}
  .homeHeadPosition{margin-top:125px;}
}

@media (min-width: 1400px) {
    .nav-logo{width:460px;}
    .pageStart{margin-top:-6rem;}
    .heroContainer{height: calc(100vw / 2.25);}
  .homeHeroContainer{height: calc(100vw / 2);}
  .homeHeadPosition{margin-top:125px;}
  .blogPic {height: 255px;}
}

@media (min-width: 1750px) {
  .homeHeadPosition{margin-top:155px;}
}

@media (min-width: 2200px) {
  .homeHeadPosition{margin-top:240px;}
}

