body {

    margin: 0;

    padding: 0;

    font-family: "Open Sans", sans-serif

}



a:focus {

    outline: none

}



header {

    border-bottom: solid 1px #e4d3d3

}



a.navbar-brand.devi-logo {

    margin: 0;

}



a.navbar-brand.devi-logo img {

    width: 50%;

}



header.page-header {

    background: #fefefe;

}



.navbar-toggler {

    height: 50px;

    width: 30px;

    position: relative;

    transition: all 0.35s ease-out;

    border: none !important

}



.navbar-toggler, .navbar-toggler:focus, .navbar-toggler.active, .navbar-toggler-icon:focus {

    outline: none;

    box-shadow: none;

    border: 0

}



.navbar-toggler span {

    margin: 0;

    padding: 0

}



.toggler-icon {

    display: block;

    width: 100%;

    height: 3px;

    background: #040428;

    border-radius: 1px;

    opacity: 1;

    position: absolute;

    left: 0;

    transform: rotate(0deg);

    transition: 0.25s ease-in-out;

    border: none !important;

    box-shadow: none;

    outline: none

}



.middle-bar {

    margin-top: 0

}



.navbar-toggler .top-bar {

    margin-top: 0px;

    transform: rotate(135deg)

}



.navbar-toggler .middle-bar {

    opacity: 0;

    filter: opacity(0)

}



.navbar-toggler .bottom-bar {

    margin-top: 0px;

    transform: rotate(-135deg)

}



button:focus:not(:focus-visible) {

    outline: 0;

    box-shadow: none;

    border: none

}



.navbar-toggler.collapsed .top-bar {

    margin-top: -20px;

    transform: rotate(0deg)

}



.navbar-toggler.collapsed .middle-bar {

    opacity: 1;

    filter: opacity(1)

}



.navbar-toggler.collapsed .bottom-bar {

    margin-top: 20px;

    transform: rotate(0deg)

}



.submenu.dropdown-menu.show {

    display: block

}



ul.nav-main .nav-item {

    padding: 3px 5px

}



ul.nav-main .nav-item a.active {

    color: #91030e

}



ul.nav-main .nav-item a.nav-link {

    transition: all ease 1s;

    font-weight: 400;

    font-size: 16px;

    transform: scale(1);

    font-family: "MyriadProRegular";

    text-transform: capitalize;

    color: #868181 !important;

}



ul.nav-main .nav-item a.nav-link:hover {

    color: black !important;

    background: #16120e24;

}



.cart-icon ul.navbar-nav {

    width: 100%;

    margin: 0;

    padding: 0;

    display: flex;

    align-items: center

}



.cart-icon ul.navbar-nav li.nav-item.user a.nav-link i {

    color: #bcbaba;

    width: 35px;

    height: 35px;

    text-align: center;

    padding: 7px;

    border-radius: 60px;

    font-size: 20px;

    box-shadow: 1px 10px 39px -5px rgba(0, 0, 0, 0.75);

    -webkit-box-shadow: 0px 4px 7px 0px rgb(0 0 0 / 27%);

    -moz-box-shadow: 1px 10px 39px -5px rgba(0, 0, 0, 0.75)

}



.cart-icon ul.navbar-nav li.nav-item {

    position: relative

}



.cart-icon ul.navbar-nav span {

    position: absolute;

    right: -3px;

    top: 0px;

    background: #309ed8;

    padding: 0;

    border-radius: 57px;

    width: 20px;

    height: 20px;

    text-align: center;

    color: white;

    display: inline-block;

    font-size: 13px

}



.cart-icon ul.navbar-nav a.nav-link:hover i {

    transition: all ease 1s;

    color: red

}



.slider-main {

    padding: 15px

}



.slider-box {

    width: 40%;

    position: relative;

    margin: 0 auto;

    top: 0px;

    left: 0

}



.box-slider {

    width: 60%;

    margin: 0 auto

}



.slider-box .carousel-caption {

    position: absolute;

    right: -17%;

    bottom: 180px;

    left: 0;

    padding-top: 1.25rem;

    padding-bottom: 1.25rem;

    text-align: center

}



.slider-box .box-slider p {

    color: #534e4e;

    font-size: 23px

}



.slider-box .carousel-caption .box-slider span {

    width: 74%;

    border: solid 2px #00000091;

    display: block;

    margin: 10px auto

}



.slider-box .carousel-caption .box-slider h2 {

    font-size: 45px;

    text-align: left;

    font-weight: bolder;

    line-height: 54px;

    letter-spacing: 1px;

    font-family: 'FRADM';

    color: #222222;

    text-transform: uppercase;

    padding-left: 64px

}



.slider-box .carousel-caption .box-slider h3 {

    font-size: 35px;

    color: #000000b3;

    font-family: 'MyriadProRegular';

    letter-spacing: 2px

}



.carousel-control-next .right, .carousel-control-prev .left {

    position: absolute;

    top: 0;

    bottom: 0;

    z-index: 1;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 10%;

    padding: 0;

    color: #8b230d;

    text-align: center;

    background: 0 0;

    border: 0;

    opacity: 1;

    transition: opacity .15s ease;

    font-size: 45px

}



.bgimg {

    background-color: #f8f8f8;

    background-image: url(../img/band/bg-band.jpg);

    background-repeat: no-repeat;

    background-position: left top;

    background-size: cover;

    overflow: hidden;

    -webkit-box-shadow: 0px 10px 32px 3px rgba(0, 0, 0, 0.49);

    box-shadow: 0px 10px 32px 3px rgb(0 0 0 / 20%)

}



.para-main h2 {

    font-family: 'MyriadProRegular';

    font-size: 45px;

    text-transform: uppercase;

    color: #110209;

}



.para-main h3 {

    color: #040001;

    font-family: 'FRADM';

    letter-spacing: 1px;

    font-size: 36px

}



.para-main p {

    font-size: 17px;

    color: #4d4444;

}



.para-main p:last-of-type {

    color: #0d01019c

}



.para-main a {

    color: #fefdffd4;

    display: inline-block;

    transition: all ease 1s;    /* position: relative; */

    overflow: hidden;

    padding: 0;

    font-weight: 600;

    font-size: 35px;

    text-decoration: none;

    align-items: center;

    background: #000000;

    padding: 7px 11px;

    border-radius: 90px;

}



.para-main a i {

    font-size: 18px;

    align-items: center;

    justify-content: center;

    padding-left: 0;

    padding-top: 0;

    color: #f7fcff;

}



.para-main a:hover {

    background: #081161;

}



.image img {

    width: 100%

}



section.bgcolor {

    background: #e9e9e97a;

}



.slider-card {

    position: relative;

    top: 0

}



.slider-card h4 {

    font-size: 45px;

    font-family: 'Helvetica';

    font-weight: 500

}



.slider-card h4 span {

    display: block;

    font-size: 19px;

    color: #808080e6;

    padding-top: 18px

}



.brand .item {





}



.brand .owl-nav {

    width: 100%;

    position: relative;

    top: 0

}



.brand .owl-nav button.owl-prev, .brand button.owl-next {

    position: absolute;

    content: "";

    display: block

}



.brand .owl-nav button.owl-prev {

    left: -40px

}



.brand .owl-nav button.owl-next {

    right: -40px

}



button.owl-prev {

    left: 0

}



button.owl-next {

    right: 0

}



.owl-theme .owl-nav:hover button {

    background: transparent !important

}



.brand .owl-nav {

    width: 100%;

    position: absolute;

    top: 45%;

    overflow: visible

}



.brand .owl-nav button.owl-prev i, .brand .owl-nav button.owl-next i {

    font-size: 46px;

    color: #808080bd

}



.bg-ground {

    background-color: #f8f8f8;

    background-image: url(../img/shape-wave1.png);

    background-repeat: no-repeat;

    background-position: center top;

    background-size: cover;

    overflow: hidden;

    height: 100%

}



.img-left-bg h6 {

    font-size: 46px;

    font-weight: 700;

    color: white

}



.img-left-bg {

    top: 0;

    padding-top: 57%;

    margin-top: 0;

    width: 63%

}



.img-left-bg  p {

    font-size: 16px;

    line-height: inherit;

    margin: 11px 0 13px;

    color: white

}



.button a {

    display: inline-block;

    background: white;

    padding: 14px 32px;

    border-radius: 40px;

    text-decoration: none;

    color: black;

    transition: all ease 1s;

    color: #3c9bd5;

    font-weight: 700;

    margin: 4px

}





.card.card-box {

    margin: 16px;

}



.card.card-box:hover .card-img {

    position: relative;

    z-index: 9999999999

}



.gallery-img {

    border: solid 3px #898a83;

}



.gallery-img img {

    width: 100%;

}

.card.card-box:hover .overlay {

    background: #074e85d9;

    width: 100%;

    height: 100%;

    position: absolute;

    bottom: 0;

    top: 0;

    content: "";

    display: block;

    transition: all ease 1s;

    cursor: pointer;

    left: 0

}













@keyframes fadeInDown {

    0% {

        transform: translateY(100%);

        opacity: 0;

    }



    100% {

        transform: translateY(0%);

        opacity: 1;

    }



}



.fadeInUp-animation {

    animation: 1.5s fadeInUp;

}





.social-icon a {

    /* text-decoration: none; */

    /* line-height: 2.8; */

    font-size: 22px;

    border-radius: 0;

    border: solid 1px gray;

    margin: 4px;

    height: 50px;

    width: 50px;

    display: inline-flex;

    text-align: center;

    align-items: center;

    justify-content: center;

    text-decoration: none;

    transition: all ease 1s;

}



.social-icon a:hover {

    border: solid 1px #ffffff;

    border-radius: 80px;

}



.social-icon a i {

    color: #130101;

    text-decoration: none;

}



img.logo-f {

    width: 20%;

    margin-bottom: 10px;

}



ul.foote-p li {

    display: inline-block;

    width: 49%;

    line-height: 2;

}



ul.foote-p li a {

    /* display: inline-block; */

    width: 50%;

    text-decoration: none;

    transition: all ease 1s;

    color: gray;

}

ul.foote-p li a:hover {

    color: #2e2b2b;

}  



/*****aboutus******/





section.about-abnner {

    position: relative;

    overflow: hidden;

}

section.about-abnner img {

    width: 100%;

}



.about-b {

    background: #f4f4f4;

}



.about-b p a {

    display: inline;

    background: transparent;

    color: #2413abdb;

    font-size: 15px;

    padding: 0;

}



.about-b p a:hover {

    background: transparent;

}

/*****aboutus******/

/*****contact us******/

.contact-now { text-align: center; }



.contact-now h4 {

    font-size: 27px;

    color: #a5a4a4;

}



.contact-now h4 i {

    font-size: 21px;

    color: #1c26ac;

}

.contact-now h3 {

    font-size: 18px;

}

.contact-now p {

    margin: 0;

}



.contact-now a {

    text-decoration: none;

    font-size: 18px;

    color: black;

}



.contact-now:last-child {

    border-left:none;

}

.input-from input.form-control {

    padding: 15px;

    border-radius: 0;

    border: solid 1px #00000069;

    background: #ffffff;

    box-shadow: none;

    color: #b1a5a5;

}

.input-from textarea.form-control {

    padding: 15px;

    border-radius: 0;

    height: 100px !important;

border: solid 1px #00000069;

    background: #ffffff;

    box-shadow: none;

    color: #b1a5a5;

}



.btn.butn {

    background: #140202;

    padding: 9px 30px;

    border-radius: 0;

    border: none;

    font-size: 20px;

    color: white;

    text-transform: uppercase;

    transition: all ease  1s;

}



button.btn.butn:hover {

    background: #020d33;

}

/*****contact us******/



/*****workshop******/

.card.grid-workshop {

    width: 100%;

    position: relative;

    overflow: hidden;

    border: none;

    border-radius: 0;

}



.card.grid-workshop .workshobox {

    overflow: hidden;



}

.workshobox img {

    width: 100%;

    transition: all ease 1s;

     transform: scale(1.5);

}



.card.grid-workshop:hover .workshobox img {

    width: 100%;

    transform: scale(1.1);

    transition: all ease 1s;

}

.card.grid-workshop .card-body {

    padding: 6px 6px;

}



.card.grid-workshop h5.card-title {

    font-size: 17px;

    /* text-align: center; */

}

.card.grid-workshop p.card-text {

    font-size: 13px;

    margin: 0;

    color: gray;

}



.card.grid-workshop tr td {

  color: gray;

    font-size: 13px;

}

/*****workshop******/



.card.addtocard  {

    width: 100%;

    position: relative;

    overflow: hidden;

}

.card.addtocard img {

    width: 100%;

    border: solid 1px gray;

}

.add-to-proudct ul {

    list-style: outside none none;

    margin: 0;

    padding: 0;

    width: 70%;

}



.add-to-proudct li {

    font-size: 17px;

    line-height: 28px;

}

.add-to-proudct li strong {

    font-weight: 400;

}



.add-to-proudct a {

    background: rgb(28 33 2) none repeat scroll 0 0;

    border-radius: 0;

    color: rgb(255, 255, 255);

    outline: medium none;

    padding: 10px 12px;

    text-decoration: none;

    transition: all 1s ease 0s;

    display: inline-block;

    border-radius: 80px;

    margin-top: 20px;

}



.add-to-proudct a:hover {

    background: #999;

    color: #000;

}

/*****workshop******/



.whatspp {

    position: fixed;

    bottom: 60px;

    left: 0;

    /* width: 100%; */

    right: 12px;

    text-align: right;

    z-index: 9999999999;

}



.whatspp a img {

    width: 4%;

}





.card.grid-workshop:hover .overlay {

  height: 100%;

}



.overlay {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  background-color: #000000de;

  overflow: hidden;

  width: 100%;

  height: 0;

  transition: .5s ease;

}





.overlay-text {

    color: white;

    font-size: 15px;

    position: absolute;

    top: 40%;

    left: 50%;

    -webkit-transform: translate(-50%, -50%);

    -ms-transform: translate(-50%, -50%);

    transform: translate(-50%, -50%);

    text-align: center;

    width: 96%;

}







.contact-n ul  {

    margin: 0;

    padding: 0;

}



.contact-n ul li  {

    display: inline-block;

    text-decoration: none;

}



.contact-n ul li a {

    background: transparent;

    color: black;

        font-size: 17px;

        text-decoration: none;



}

.contact-n ul li a i {

    color: black;

}



.contact-n ul li a:hover {

    background: #000000;

    color: white;

}



.contact-n ul li a:hover i {

   color: white; 

}







.shape {



    width: 100px;

    height: 50px;



    border-radius: 200px 0px 0px 0px;

-webkit-border-radius: 200px 0px 0px 0px;

-moz-border-radius: 200px 0px 0px 0px;

border: 2px solid #ff6550;

}