body{
font-family: "Ubuntu Sans", sans-serif !important;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
background-color: #333;
}

.nav-pills .nav-link {
color:#333;
}

.link-light{
color:#ccc !important;
}

.h6{
font-size:1.05rem !important;
}

.brand-logo img {
height: 3rem;
}

.carousel-control-next, .carousel-control-prev {
width:10%;
color: #666;
}

.carousel-control-next:hover, .carousel-control-prev:hover {
color: #333;
}

/* .carousel-item-col{
height: 10rem;
}

@media (max-width: 992px){
    .carousel-item-col{
    height: 5rem;
    }
} */

.bg-grey{
background-color:rgb(70, 75, 86);
}

.bg-light-grey{
background-color:#ececec;
}

a{
color:#333;
text-decoration: none;
}

#top-bar a {
color: #ccc;
text-decoration: none;
font-size: .9rem;
line-height: 1.8rem;
}

#footer a {
color: #ccc;
text-decoration: none;
}

#top-bar a:hover, #footer a:hover{
color: #fff;
}

.navbar-brand img{
   height: 2.5rem;
}
.navbar-brand span{
font-size: 1.3rem; line-height: 1.6rem; margin:0; padding:0;
font-weight: 400;
}

hr.accent {
border-color: rgb(220, 53, 69);
max-width: 150px;
border-width: 5px;
opacity: 1;
margin-top: 15px;
margin-bottom: 25px;
margin-left: auto;
margin-right: auto;
}

hr.accent-grey {
border-color: #ccc;
max-width: 150px;
border-width: 5px;
opacity: 1;
margin-top: 15px;
margin-bottom: 25px;
margin-left: auto;
margin-right: auto;
}

.card{
border-color:#eee;
}

.card .border-light{
border-color:#eee !important;
}

.ion{
font-size:1.8rem;
line-height:1.8rem;
}
.ion-md {
font-size: 2.3rem;
line-height: 2.3rem;
}
.ion-lg{
font-size:2.8rem;
line-height:2.8rem;
}
.ion span{
font-size:.6rem;
line-height:.6rem;
}

img {
max-width: 100%;
height: auto;
transform: scale(1);
vertical-align: middle;
-ms-interpolation-mode: bicubic;
}

.blog-details img, .blog-item img, .info-item img, .info-item-first img{
width: 100%;
height: 100%;
object-fit: cover;
overflow: hidden;
aspect-ratio: 1.33 / 1;
}

.view_page img{
width: 100%;
height: 100%;
object-fit: cover;
overflow: hidden;
aspect-ratio: 1.55 / 0.75;
}

/*img-nav-scroller*/

.img-nav-scroller img{
width: 300px;
height: 100px;
object-fit: cover;
overflow: visible;
aspect-ratio: 1.55 / 0.75;
}

.img-nav-scroller {
position: relative;
z-index: 2;
height: 12.75rem;
overflow-y: hidden;
}

.img-nav-scroller a{
color:#333;
}

.img-nav-scroller a:hover{
color:rgb(220, 53, 69);
}

.img-nav-scroller .nav {
display: flex;
flex-wrap: nowrap;
padding-bottom: 1rem;
margin-top: -1px;
overflow-x: auto;
text-align: center;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}

/*nav-scroller*/

.nav-scroller {
position: relative;
z-index: 2;
height: 2.55rem;
overflow-y: hidden;
}

.nav-scroller a{
color:#333;
}

.nav-scroller a:hover{
color:rgb(220, 53, 69);
}

.nav-scroller .nav {
display: flex;
flex-wrap: nowrap;
padding-bottom: 1rem;
margin-top: -1px;
overflow-x: auto;
text-align: center;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}

/*---*/

#nav {
position: sticky;
position: -webkit-sticky;
left: 0;
right: 0;
-webkit-transition: 0.2s ease-out;
-o-transition: 0.2s ease-out;
transition: 0.2s ease-out;
z-index: 888;
}

#nav a, .nav-tabs a{
color: #333 !important;
font-weight: 500;
}

#nav a:hover{
color: #000 !important;
}

/* carousel */

.carousel-caption {
position: absolute;
top: 0;
left: 0;
text-align: left;
width: 100%;
height: 100%;
padding: 3rem;
text-shadow: .1rem .1rem #444;
}

.phon{
width: 100%;
height: 100%;
object-fit: cover;
overflow: hidden;
aspect-ratio: 1.55 / 0.55;
}

.h-img{
width: 100%;
height: 100%;
object-fit: cover;
overflow: hidden;
aspect-ratio: 1 / 1;
}

.carousel-caption h5{
font-size: 3.75rem;
line-height:110%;
}

.carousel-caption p{
font-size: 2.25rem;
line-height:115%;
padding:0 !important;
margin:0 0 .7rem 0 !important;
}

.carousel-caption span{
font-size: 1.25rem;
line-height:115%;
border-bottom: .1rem #fff solid;
}

.carousel-indicators {
position: absolute;
right: 0;
bottom: 0;
left: 0;
z-index: 2;
display: flex;
justify-content: center;
padding: 0;
margin-right: 15%;
margin-bottom: .5rem;
margin-left: 15%;
}

@media (max-width: 1200px){

    .carousel-caption {
    width: 100%;
    padding:.3rem 1.75rem;
    }

    .phon{
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
    aspect-ratio: 1.55 / 1;
    }

    .carousel-caption h5{
    font-size: 1.65rem;
    line-height:100%;
    }
    
    .carousel-caption p{
    font-size: 1rem;
    line-height:100%;
    margin:0 0 .2rem 0 !important;
    }
    
    .carousel-caption span{
    font-size: .85rem;
    line-height:100%;
    border-bottom:.1rem #fff solid;
    }

}

/* --- */

#alert {
    z-index: 9999;
    position: fixed;
    top: 30%;
    left: 50%;
    width: 300px;
    margin-left: -150px;
}

@media (min-width: 960px) {
    #alert {
        width: 500px;
        margin-left: -250px;
    }
}

@media (min-width: 1140px) {
    #alert {
        width: 500px;
        margin-left: -250px;
    }
}

@media (min-width: 1320px) {
    #alert {
        width: 500px;
        margin-left: -250px;
    }
}

#alert .alert {
    margin-bottom: 15px;
}

#alert .alert-primary {
    box-shadow: 0 0 0 5px rgb(var(--bs-primary-rgb), 0.1);
}

#alert .alert-secondary {
    box-shadow: 0 0 0 5px rgb(var(--bs-secondary-rgb), 0.1);
}

#alert .alert-success {
    box-shadow: 0 0 0 5px rgb(var(--bs-success-rgb), 0.1);
}

#alert .alert-warning {
    box-shadow: 0 0 0 5px rgb(var(--bs-warning-rgb), 0.1);
}

#alert .alert-danger {
    box-shadow: 0 0 0 5px rgb(var(--bs-danger-rgb), 0.1);
}

#alert .alert-info {
    box-shadow: 0 0 0 5px rgb(var(--bs-info-rgb), 0.1);
}

#alert .alert-light {
    box-shadow: 0 0 0 5px rgb(var(--bs-light-rgb), 0.1);
}

#alert .alert-dark {
    box-shadow: 0 0 0 5px rgb(var(--bs-dark-rgb), 0.1);
}