/* --Bg Color-- */
.lite-gray-bg {
    background-color: #f1f3f3;
}
.lite-gray-bg1 {
    background-color: #bac8d9;
}

.dark-gray-bg {
    background-color: #0b1e33;
}

.lite-blue-bg {
    /* background-color: #b8c9d1; */
    background-color: #e4eaed;
}

.pink-blue-gradient-bg {
    background: linear-gradient(135deg, #531a7a, #00227b);
}

.blue-pink-gradient-bg {
    background: linear-gradient(135deg, #00227b, #9f0359);
}

.blue-pink-gradient-bg1 {
    background: linear-gradient(135deg,rgba(0, 34, 123, 1) 0%, rgba(116, 11, 99, 1) 75%, rgba(148, 4, 110, 1) 61%, rgba(116, 11, 99, 1) 100%);
}

.orange-pink-gradient-bg {
    background: linear-gradient(135deg, #ff6a00, #ee0979);
}

.gray-gradient-bg {
  background: linear-gradient(124deg,rgba(186, 200, 217, 1) 0%, rgba(79, 105, 137, 1) 10%, rgba(157, 174, 195, 1) 10%, rgba(79, 105, 137, 1) 90%, rgba(158, 175, 196, 1) 90%, rgba(79, 105, 137, 1) 100%);
  background-attachment: fixed;
}

.gray-gradient-bg1_l {
  background: linear-gradient(236deg,rgba(240, 244, 247, 1) 0%, rgba(240, 244, 247, 1) 35%, rgba(213, 221, 230, 1) 60%, rgba(240, 244, 247, 1) 60%, rgba(213, 221, 230, 1) 100%);
  background-attachment: fixed;
}
.gray-gradient-bg1_r {
  background: linear-gradient(124deg,rgba(240, 244, 247, 1) 0%, rgba(240, 244, 247, 1) 35%, rgba(213, 221, 230, 1) 60%, rgba(240, 244, 247, 1) 60%, rgba(213, 221, 230, 1) 100%);
  background-attachment: fixed;
}

.gray-gradient-bg2_l {
  background: linear-gradient(236deg,rgba(240, 244, 247, 1) 0%, rgba(240, 244, 247, 1) 35%, rgba(213, 221, 230, 1) 60%, rgba(240, 244, 247, 1) 60%, rgba(213, 221, 230, 1) 100%);
  background-attachment: fixed;
}
.gray-gradient-bg2_r {
  background: linear-gradient(124deg,rgba(240, 244, 247, 1) 0%, rgba(240, 244, 247, 1) 35%, rgba(213, 221, 230, 1) 60%, rgba(240, 244, 247, 1) 60%, rgba(213, 221, 230, 1) 100%);
  background-attachment: fixed;
}

.darkblue-gradient-bg {
    background-color: #0b1e33;
    background: linear-gradient(124deg, rgba(11, 30, 51, 1) 0%, rgba(11, 30, 51, 1) 35%, rgba(1, 22, 48, 1) 60%, rgba(20, 44, 74, 1) 60%, rgba(11, 30, 51, 1) 100%);
    background-attachment: fixed;
}

.darkblue-gradient-bg1 {
    background-color: #0b1e33;
    background: linear-gradient(236deg, rgba(11, 30, 51, 1) 0%, rgba(11, 30, 51, 1) 35%, rgba(1, 22, 48, 1) 60%, rgba(20, 44, 74, 1) 60%, rgba(11, 30, 51, 1) 100%);
    background-attachment: fixed;
}

.circle-pattern {
    position: relative;
    overflow: hidden;
}

.circle-pattern:before {
    content: "";
    position: absolute;
    width: 2000px;
    height: 2000px;
    background: linear-gradient(135deg, rgb(255 255 255 / 10%), #ffffff00);
    border-radius: 100%;
    left: 20%;
    top: -30px;
    animation:  moveBefore 10s ease infinite;
}

.circle-pattern:after {
    content: "";
    position: absolute;
    width: 2000px;
    height: 2000px;
    background: linear-gradient(135deg, rgb(255 255 255 / 0%), rgb(255 255 255 / 10%));
    border-radius: 100%;
    right: 60%;
    top: -30px;
    animation:  moveAfter 10s ease infinite;
}




@keyframes moveBackground {
  0% {
    background-position: 0 0;
  }
  50% {background-position: center;}
  50% {background-position: bottom right;}
  75% {background-position: center right;}
  100% {
    background-position: top left;
  }
}
@keyframes moveAround {
  0%   { transform: translate(0, 0); }
  25%  { transform: translate(100px, 0); }
  50%  { transform: translate(100px, 100px); }
  75%  { transform: translate(0, 100px); }
  100% { transform: translate(0, 0); }
}

@keyframes moveBefore {
  0%   { transform: translate(40px, 0); }
  25%  { transform: translate(0, 40px); }
  50%  { transform: translate(-40px, 0); }
  75%  { transform: translate(0, -40px); }
  100% { transform: translate(40px, 0); }
}
@keyframes moveAfter {
  0%   { transform: translate(0, -40px); }
  25%  { transform: translate(40px, 0); }
  50%  { transform: translate(0, 40px); }
  75%  { transform: translate(-40px, 0); }
  100% { transform: translate(0, -40px); }
}
/* --Bg Color-- */

/* --Bg Imaage-- */

.cc-bg {
    background-image: url(../images/cc-bg.jpg);
    background-size: auto 100%;
    background-position: top right;
}
.cc-bg1 {
  position: relative;
  margin: 0px;
  padding: 0px;
  background-color: #f0f4f7;
  background: linear-gradient(124deg,rgba(240, 244, 247, 1) 0%, rgba(240, 244, 247, 1) 75%, rgba(213, 221, 230, 1) 90%, rgba(240, 244, 247, 1) 90%, rgba(213, 221, 230, 1) 100%);
}
.cc-bg1::before {
    content: "";
    position: absolute;
    background-image: url(../images/cc-bg.png);
    background-size: auto 100%;
    background-position-y: top;
    background-position-x: calc(100% - 150px);
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
}

.cc-bg2 {
  position: relative;
  margin: 0px;
  padding: 0px;
}
.cc-bg2::before {
    content: "";
    position: absolute;
    background-image: url(../images/cc-bg.png);
    background-size: auto 100%;
    background-position-y: top;
    background-position-x: calc(100% - 150px);
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
}
/* --Bg Imaage-- */

/* --Border-- */
.bt-w {
  border-top: 1px solid #ffffff;
}

.bt5-w {
  border-top: 5px solid #ffffff;
}
.bb5-w {
  border-bottom: 5px solid #ffffff;
}
/* --Border-- */

/* --text Color-- */

.white-text {
    color: var(--txt--color-white);
    -webkit-text-fill-color: var(--txt--color-white) !important;
}

.white-text-o {
    color: rgb(255 255 255 / 70%);
}

.orange-text {
    color: #fa4e23;
    -webkit-text-fill-color: #fa4e23 !important;
}

.darkgray-text {
  color: #182f40
}


.blue-grad-text {
  background: linear-gradient(135deg, #531a7a, #00227b);  
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.orange-grad-text {
  background: linear-gradient(90deg, #ff6a00, #ee0979); 
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* --text Color-- */


/*--box shadow--*/
.shadow-top {
  box-shadow: 0px 60px 40px -70px rgb(122 140 153) inset;
}
.shadow-top1 {
    box-shadow: 0px 60px 40px -70px rgb(10 19 26) inset;
}
.shadow-bottom {
  box-shadow: 0px -60px 40px -70px rgb(122 140 153) inset;
}
/*--box shadow--*/