/* Style Sheet: capecodwebsitedesign.com --- Author: Billy Hardy - capecodwebsitedesign.com */

body {
    background-color: #fff;
    color: #02326C;
    font-family: 'ralewayregular';
    height: 100%;
}

.navbar-light .navbar-brand {
    color: #02326c;
}

.navbar-light .navbar-brand:hover,
.navbar-light .navbar-brand:focus {
    color: #02326c;
}

.navbar-light .navbar-nav .nav-link {
    font-family: 'raleway_semibolditalic';
    color: rgba(2, 50, 108, 0.6);
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus {
    color: #02326c;
}

nav-link:active {
    /*color: rgba(27, 82, 116, 0.7);*/
    color: rgba(2, 50, 108, 0.6);
}

.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .nav-link.active {
    font-family: 'raleway_semibolditalic';
    color: #02326c;
}

.navbar-light .navbar-toggler {
    /*color: rgba(27, 82, 116, 0.55);*/
    color: rgba(2, 50, 108, 0.6);
}

.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%282, 50, 108, 0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.navbar-light .navbar-text a,
.navbar-light .navbar-text a:hover,
.navbar-light .navbar-text a:focus {
    color: #02326c;
}

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition-property: height, visibility;
    transition-property: height, visibility;
    -webkit-transition-duration: 0.9s;
    transition-duration: 0.9s;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
}

.collapsing.width {
    -webkit-transition-property: width, visibility;
    transition-property: width, visibility;
    width: 0;
    height: auto;
}

.nav-item {
    padding: 1rem 3rem;
}


@font-face {
    font-family: 'sailregular';
    src: url('sail-regular-webfont.eot');
    src: url('sail-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('sail-regular-webfont.woff2') format('woff2'),
        url('sail-regular-webfont.woff') format('woff'),
        url('sail-regular-webfont.ttf') format('truetype'),
        url('sail-regular-webfont.svg#sailregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ralewayregular';
    src: url('raleway-regular-webfont.eot');
    src: url('raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('raleway-regular-webfont.woff') format('woff'),
        url('raleway-regular-webfont.ttf') format('truetype'),
        url('raleway-regular-webfont.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'raleway_semibolditalic';
    src: url('raleway-semibolditalic-webfont-webfont.woff2') format('woff2'),
        url('raleway-semibolditalic-webfont-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ralewaysemibold';
    src: url('raleway-semibold-webfont.eot');
    src: url('raleway-semibold-webfont.eot?#iefix') format('embedded-opentype'),
        url('raleway-semibold-webfont.woff') format('woff'),
        url('raleway-semibold-webfont.ttf') format('truetype'),
        url('raleway-semibold-webfont.svg#ralewaysemibold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'raleway_semibolditalic';
    src: url('raleway-semibolditalic-webfont.eot');
    src: url('raleway-semibolditalic-webfont.eot?#iefix') format('embedded-opentype'),
        url('raleway-semibolditalic-webfont.woff2') format('woff2'),
        url('raleway-semibolditalic-webfont.woff') format('woff'),
        url('raleway-semibolditalic-webfont.ttf') format('truetype'),
        url('raleway-semibolditalic-webfont.svg#raleway_semibolditalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

.bgimg {
    background-image: url("img/cape-cod-from-space.png");
    height: 500px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    outline: none;
    border: none;
}

.bgimg0 {
    background-image: url("img/pan-cape-cod.png");
    height: 500px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: top left;
    outline: none;
    border: none;
}

.bgimg1 {
    background-image: url("img/cape-cod-bay-10-13.png");
    height: 320px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    outline: none;
    border: none;
}

.bgimg2 {
    background-image: url("img/random-sand-patterns.png");
    height: 240px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    outline: none;
    border: none;
}

.bgimg3 {
    background-image: url("img/fort-hill.png");
    height: 400px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    outline: none;
    border: none;
}

.bgimg4 {
    background-image: url("img/scruffy-sunset.png");
    height: 400px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    outline: none;
    border: none;
}

.bgimg5 {
    background-image: url("img/fort-hill-vista.png");
    height: 400px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    outline: none;
    border: none;
}

.bgimg6 {
    background-image: url("img/sunray-sand-sea.png");
    height: 400px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    outline: none;
    border: none;
}

.bgimg7 {
    background-image: url("img/fort-hill-towards-coast-guard.png");
    height: 400px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    outline: none;
    border: none;
}

.bgimg7 {
    background-image: url("img/sand-sea-clouds.png");
    height: 400px;
    max-width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    outline: none;
    border: none;
}

.bgw {
    height: 200px;
}

.card {
    background: #fefefe;
    border: 1px solid rgba(27, 82, 116, 0.12)
}

.card-title {
    color: #02326c;
}

h1,
h2,
h3,
h4,
h5 {
    color: #fff;
    font-family: 'sailregular';
    font-weight: normal;
    text-transform: none;
}

p {
    text-align: justify;
}

.table {
    color: #02326c;
}

th {
    text-align: left;
    color: #02326c;
}

td {
    text-align: right;
    color: #02326c;
}

.table-hover > tbody > tr:hover {
    --bs-table-accent-bg: var(--bs-table-hover-bg);
    color: var(--bs-table-hover-color);
    --bs-table-hover-bg: #f6f6f6;
}

.accordion-body {
    text-align: left;
    padding: 1rem 1.25rem;
    color: #0c63e4;
    background-color: #f6f6f6;

}

.accordion-header {
    text-align: left;
}

.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    text-align: left;
    width: 100%;
    padding: 1rem 1.25rem;
    font-size: 1rem;
    color: #02326c;
    background-color: transparent;
    border: 1px solid rgba(27, 82, 116, 0.12);
    border-radius: 0;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
}

.accordion-button.collapsed {
    border-bottom-width: 0;
}

.accordion-button:not(.collapsed) {
    color: #0c63e4;
    background-color: #f6f6f6;
}

.accordion-button:focus {
    z-index: 3;
    border-color: transparent;
    outline: 0;
}


a.phone:link,
a.phone:active,
a.phone:visited,
a.phone:focus {
    color: #02326c;
    text-decoration: none;
}

a.phone:hover {
    color: rgba(2, 50, 108, 0.6);
}

.carousel-item {
    position: relative;
    display: none;
    float: left;
    width: 300px;
    height: 190px;
    margin-right: -100%;
    transition: transform 0.6s ease-in-out;
}

.fa-expand,
.fa-paint-brush,
.fa-user-friends {
    color: #02326c;
}

.ccwd {
    color: #02326c;
}


@media (min-width: 240px) {
    h1.resp {
        font-size: 1.5rem;
        text-align: center;
    }

    h2.resp {
        font-size: 0.8rem;
    }

    h3.resp {
        font-size: 0.7rem;
    }

    p.resp {
        font-size: 0.6rem;
    }
}

@media (min-width: 320px) {
    h1.resp {
        font-size: 1.7rem;
        text-align: center;
    }

    h2.resp {
        font-size: 1.1rem;
    }

    h3.resp {
        font-size: 1rem;
    }

    p.resp {
        font-size: 0.8rem;
    }
}

@media (min-width: 360px) {
    h1.resp {
        font-size: 1.8rem;
        text-align: center;
    }

    h2.resp {
        font-size: 1.2rem;
    }

    h3.resp {
        font-size: 1.1rem;
    }

    p.resp {
        font-size: 0.8rem;
    }
}

@media (min-width: 375px) {
    h1.resp {
        font-size: 2rem;
        text-align: center;
    }

    h2.resp {
        font-size: 1.3rem;
    }

    h3.resp {
        font-size: 1.1rem;
    }

    p.resp {
        font-size: 0.9rem;
    }
}

@media (min-width: 480px) {
    h1.resp {
        font-size: 3rem;
        text-align: center;
    }

    h2.resp {
        font-size: 1.8rem;
    }

    h3.resp {
        font-size: 1.2rem;

    }

    p.resp {
        font-size: 0.9rem;
    }
}

@media (min-width: 576px) {
    h1.resp {
        font-size: 3.4rem;
        text-align: center
    }

    h2.resp {
        font-size: 2rem;
    }

    h3.resp {
        font-size: 1.2rem;
    }

    p.resp {
        font-size: 1rem;
    }
}

@media (min-width: 667px) {
    h1.resp {
        font-size: 3.8rem;
        text-align: center
    }

    h2.resp {
        font-size: 2rem;
    }

    h3.resp {
        font-size: 1.2rem;
    }

    p.resp {
        font-size: 1rem;
    }
}

@media (min-width: 768px) {
    h1.resp {
        font-size: 4rem;
        text-align: center;
    }

    h2.resp {
        font-size: 2.5rem;
    }

    h3.resp {
        font-size: 1.2rem;
    }

    p.resp {
        font-size: 1rem;
    }
}

@media (min-width: 992px) {
    h1.resp {
        font-size: 4.2rem;
    }

    h2.resp {
        font-size: 2.6rem;
    }

    h3.resp {
        font-size: 1.4rem;
    }

    p.resp {
        font-size: 1rem;
    }
}

@media (min-width: 1200px) {
    h1.resp {
        font-size: 4.2rem;
    }

    h2.resp {
        font-size: 2.6rem;
    }

    h3.resp {
        font-size: 1.4rem;
    }

    p.resp {
        font-size: 1rem;
    }
}
 
