@charset "UTF-8"; 


@font-face {font-family: 'courierprime'; src: url(../fonts/Michroma-Regular.ttf)}
:root,
[data-bs-theme="synergy"] {
    --sc-body-font: courierprime;
    --sc-body-font-size: 16px;
    --sc-body-font-weight: 500;
    --sc-body-line-height: 1.5;
    --sc-body-text-color: #212529;
    --sc-body-text-align: left;
    --sc-body-back-ground-color: ;


}


body {
    margin: 0;
   font-family:var(--sc-body-font); 
    font-size: var(--sc-body-font-size);
    font-weight:var(--sc-body-font-weight);
    line-height: var(--sc-body-line-height);
    color: var(--sc-body-text-color);
   text-align: var(--sc-body-text-align);
   background: #FFFFFF;
   background-repeat: repeat;
  
   -webkit-text-size-adjust: 100%;
   -webkit-tap-highlight-color: transparent;
}

*,
::after,::before { box-sizing: border-box;}
@media (prefers-reduced-motion: no-preference) { :root { scroll-behavior: smooth; }}



h1,h2,h3{    margin-top: 0;   margin-bottom: 0.5rem;  line-height: 1.2;}
h1 { font-size: 38px; color: #1aabec;}

h2 {font-size: 20px;}
@media (min-width: 1200px) {
h2 {  font-size: 30px;  }}
h3 { font-size: 18px;}
@media (min-width: 1200px) { h3 {  font-size: 18px;}}

p { margin-top: 0;    margin-bottom: 1rem;    font-family: var(--sc-body-font);}



.nav {
    --bs-nav-link-padding-x: 1rem;
    --bs-nav-link-padding-y: 0.5rem;
    --bs-nav-link-font-weight: ;

    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;

}
.nav-link::first-letter {
  font-size: 16px;
  font-weight: bold;
  color: #1aabec;
}
.nav-link {
    display: block;

    padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
    font-size:16px;
    font-weight: var(--bs-nav-link-font-weight);
   
    text-decoration: none;
    background: 0 0;
    border: 0;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
    .nav-link {
        transition: none;
    }
}
.nav-link:focus,
.nav-link:hover {
    color: #000;
}
.nav-link:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.nav-link.disabled,
.nav-link:disabled {
    color: var(--bs-nav-link-disabled-color);
    pointer-events: none;
    cursor: default;
}
.nav-tabs {
    --bs-nav-tabs-border-width: var(--bs-border-width);
    --bs-nav-tabs-border-color: var(--bs-border-color);
    --bs-nav-tabs-border-radius: var(--bs-border-radius);
    --bs-nav-tabs-link-hover-border-color: var(--bs-secondary-bg) var(--bs-secondary-bg) var(--bs-border-color);
    --bs-nav-tabs-link-active-color: var(--bs-emphasis-color);
    --bs-nav-tabs-link-active-bg: var(--bs-body-bg);
    --bs-nav-tabs-link-active-border-color: var(--bs-border-color) var(--bs-border-color) var(--bs-body-bg);
    border-bottom: var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color);
}
.nav-tabs .nav-link {
    margin-bottom: calc(-1 * var(--bs-nav-tabs-border-width));
    border: var(--bs-nav-tabs-border-width) solid transparent;
    border-top-left-radius: var(--bs-nav-tabs-border-radius);
    border-top-right-radius: var(--bs-nav-tabs-border-radius);
}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
    isolation: isolate;
    border-color: var(--bs-nav-tabs-link-hover-border-color);
}
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: var(--bs-nav-tabs-link-active-color);
    background-color: var(--bs-nav-tabs-link-active-bg);
    border-color: var(--bs-nav-tabs-link-active-border-color);
}
.nav-tabs .dropdown-menu {
    margin-top: calc(-1 * var(--bs-nav-tabs-border-width));
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.nav-underline {
    --bs-nav-underline-gap: 1rem;
    --bs-nav-underline-border-width: 0.125rem;
    --bs-nav-underline-link-active-color: var(--bs-emphasis-color);
    gap: var(--bs-nav-underline-gap);
}
.nav-underline .nav-link {
    padding-right: 0;
    padding-left: 0;
    border-bottom: var(--bs-nav-underline-border-width) solid transparent;
}
.nav-underline .nav-link:focus,
.nav-underline .nav-link:hover {
    border-bottom-color: currentcolor;
}
.nav-underline .nav-link.active,
.nav-underline .show > .nav-link {
    font-weight: 700;
    color: var(--bs-nav-underline-link-active-color);
    border-bottom-color: currentcolor;
}
.nav-fill .nav-item,
.nav-fill > .nav-link {
    flex: 1 1 auto;
    text-align: center;
}
.nav-item{ margin-right: 20px; }
.nav-justified .nav-item,
.nav-justified > .nav-link {
    flex-basis: 0;
    flex-grow: 1;
    text-align: center;
}
.nav-fill .nav-item .nav-link,
.nav-justified .nav-item .nav-link {
    width: 100%;
}
.tab-content > .tab-pane {
    display: none;
}
.tab-content > .active {
    display: block;
}


.navbar {
    --bs-navbar-padding-x: 5%;
    --bs-navbar-padding-y:5px;

    --bs-navbar-disabled-color: rgba(var(--bs-emphasis-color-rgb), 0.3);
    --bs-navbar-active-color: rgba(var(--bs-emphasis-color-rgb), 1);

    --bs-navbar-nav-link-padding-x: 0px;
    --bs-navbar-toggler-padding-y: 0.25rem;
    --bs-navbar-toggler-padding-x: 0.75rem;
    --bs-navbar-toggler-font-size: 1.25rem;
    --bs-navbar-toggler-icon-bg: url("../img/nav.svg");
    --bs-navbar-toggler-border-color: rgba(var(--bs-emphasis-color-rgb), 0.15);
    --bs-navbar-toggler-border-radius: var(--bs-border-radius);
    --bs-navbar-toggler-focus-width: 0.25rem;
    --bs-navbar-toggler-transition: box-shadow 0.15s ease-in-out;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: var(--bs-navbar-padding-y) var(--bs-navbar-padding-x);
height: 110px;
background-color: #FFFFFF
    
}
.navbar > .container,
.navbar > .container-fluid,
.navbar > .container-lg,
.navbar > .container-md,
.navbar > .container-sm,
.navbar > .container-xl,
.navbar > .container-xxl {
    display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
}

.navbar-nav {
    --bs-nav-link-padding-x: 0;
    --bs-nav-link-padding-y: 5px;
    --bs-nav-link-font-weight: ;
   color: #ffffff;
   
  
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}
.navbar-nav .nav-link.active,
.navbar-nav .nav-link.show {
    color: var(--bs-navbar-active-color);
}
.navbar-nav .dropdown-menu {
    position: static;
}
.navbar-text {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    color: var(--bs-navbar-color);
}
.navbar-text a,
.navbar-text a:focus,
.navbar-text a:hover {
    color: var(--bs-navbar-active-color);
}
.navbar-collapse {
    flex-basis: 100%;
    flex-grow: 1;
    align-items: center;
}
.navbar-toggler {
    padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
    font-size: var(--bs-navbar-toggler-font-size);
    line-height: 1;
    color: var(--bs-navbar-color);
    background-color: transparent;
    border: var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);
    border-radius: var(--bs-navbar-toggler-border-radius);
    transition: var(--bs-navbar-toggler-transition);
}
@media (prefers-reduced-motion: reduce) {
    .navbar-toggler {
        transition: none;
    }
}
.navbar-toggler:hover {
    text-decoration: none;
}
.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: 0 0 0 var(--bs-navbar-toggler-focus-width);
}
.navbar-toggler-icon {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    background-image: var(--bs-navbar-toggler-icon-bg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
}
.navbar-nav-scroll {
    max-height: var(--bs-scroll-height, 75vh);
    overflow-y: auto;
}
@media (min-width: 576px) {
    .navbar-expand-sm {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    .navbar-expand-sm .navbar-nav {
        flex-direction: row;
    }
    .navbar-expand-sm .navbar-nav .dropdown-menu {
        position: absolute;
    }
    .navbar-expand-sm .navbar-nav .nav-link {
        padding-right: var(--bs-navbar-nav-link-padding-x);
        padding-left: var(--bs-navbar-nav-link-padding-x);
  
    }
    .navbar-expand-sm .navbar-nav-scroll {
        overflow: visible;
    }
    .navbar-expand-sm .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
    }
    .navbar-expand-sm .navbar-toggler {
        display: none;
    }
    .navbar-expand-sm .offcanvas {
        position: static;
        z-index: auto;
        flex-grow: 1;
        width: auto !important;
        height: auto !important;
        visibility: visible !important;
        background-color: transparent !important;
        border: 0 !important;
        transform: none !important;
        transition: none;
    }
    .navbar-expand-sm .offcanvas .offcanvas-header {
        display: none;
    }
    .navbar-expand-sm .offcanvas .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
    }
}
@media (min-width: 768px) {
    .navbar-expand-md {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    .navbar-expand-md .navbar-nav {
        flex-direction: row;
    }
    .navbar-expand-md .navbar-nav .dropdown-menu {
        position: absolute;
    }
    .navbar-expand-md .navbar-nav .nav-link {
        padding-right: var(--bs-navbar-nav-link-padding-x);
        padding-left: var(--bs-navbar-nav-link-padding-x);
    }
    .navbar-expand-md .navbar-nav-scroll {
        overflow: visible;
    }
    .navbar-expand-md .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
    }
    .navbar-expand-md .navbar-toggler {
        display: none;
    }
    .navbar-expand-md .offcanvas {
        position: static;
        z-index: auto;
        flex-grow: 1;
        width: auto !important;
        height: auto !important;
        visibility: visible !important;
        background-color: transparent !important;
        border: 0 !important;
        transform: none !important;
        transition: none;
    }
    .navbar-expand-md .offcanvas .offcanvas-header {
        display: none;
    }
    .navbar-expand-md .offcanvas .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
    }
}
@media (min-width: 1001px) {
    .navbar-expand-lg {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    .navbar-expand-lg .navbar-nav {
        flex-direction: row;
    }
    .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: absolute;
    }
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: var(--bs-navbar-nav-link-padding-x);
        padding-left: var(--bs-navbar-nav-link-padding-x);
    }
    .navbar-expand-lg .navbar-nav-scroll {
        overflow: visible;
    }
    .navbar-expand-lg .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
    }
    .navbar-expand-lg .navbar-toggler {
        display: none;
    }
    .navbar-expand-lg .offcanvas {
        position: static;
        z-index: auto;
        flex-grow: 1;
        width: auto !important;
        height: auto !important;
        visibility: visible !important;
        background-color: transparent !important;
        border: 0 !important;
        transform: none !important;
        transition: none;
    }
    .navbar-expand-lg .offcanvas .offcanvas-header {
        display: none;
    }
    .navbar-expand-lg .offcanvas .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
    }
}
@media (min-width: 1200px) {
    .navbar-expand-xl {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    .navbar-expand-xl .navbar-nav {
        flex-direction: row;
    }
    .navbar-expand-xl .navbar-nav .dropdown-menu {
        position: absolute;
    }
    .navbar-expand-xl .navbar-nav .nav-link {
        padding-right: var(--bs-navbar-nav-link-padding-x);
        padding-left: var(--bs-navbar-nav-link-padding-x);
    }
    .navbar-expand-xl .navbar-nav-scroll {
        overflow: visible;
    }
    .navbar-expand-xl .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
    }
    .navbar-expand-xl .navbar-toggler {
        display: none;
    }
    .navbar-expand-xl .offcanvas {
        position: static;
        z-index: auto;
        flex-grow: 1;
        width: auto !important;
        height: auto !important;
        visibility: visible !important;
        background-color: transparent !important;
        border: 0 !important;
        transform: none !important;
        transition: none;
    }
    .navbar-expand-xl .offcanvas .offcanvas-header {
        display: none;
    }
    .navbar-expand-xl .offcanvas .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
    }
}
@media (min-width: 1400px) {
    .navbar-expand-xxl {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    .navbar-expand-xxl .navbar-nav {
        flex-direction: row;
    }
    .navbar-expand-xxl .navbar-nav .dropdown-menu {
        position: absolute;
    }
    .navbar-expand-xxl .navbar-nav .nav-link {
        padding-right: var(--bs-navbar-nav-link-padding-x);
        padding-left: var(--bs-navbar-nav-link-padding-x);
    }
    .navbar-expand-xxl .navbar-nav-scroll {
        overflow: visible;
    }
    .navbar-expand-xxl .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
    }
    .navbar-expand-xxl .navbar-toggler {
        display: none;
    }
    .navbar-expand-xxl .offcanvas {
        position: static;
        z-index: auto;
        flex-grow: 1;
        width: auto !important;
        height: auto !important;
        visibility: visible !important;
        background-color: transparent !important;
        border: 0 !important;
        transform: none !important;
        transition: none;
    }
    .navbar-expand-xxl .offcanvas .offcanvas-header {
        display: none;
    }
    .navbar-expand-xxl .offcanvas .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
    }
}
.navbar-expand {
    flex-wrap: nowrap;
    justify-content: flex-start;
}
.navbar-expand .navbar-nav {
    flex-direction: row;
}
.navbar-expand .navbar-nav .dropdown-menu {
    position: absolute;
}
.navbar-expand .navbar-nav .nav-link {
    padding-right: var(--bs-navbar-nav-link-padding-x);
    padding-left: var(--bs-navbar-nav-link-padding-x);
}
.navbar-expand .navbar-nav-scroll {
    overflow: visible;
}
.navbar-expand .navbar-collapse {
    display: flex !important;
    flex-basis: auto;
}
.navbar-expand .navbar-toggler {
    display: none;
}
.navbar-expand .offcanvas {
    position: static;
    z-index: auto;
    flex-grow: 1;
    width: auto !important;
    height: auto !important;
    visibility: visible !important;
    background-color: transparent !important;
    border: 0 !important;
    transform: none !important;
    transition: none;
}
.navbar-expand .offcanvas .offcanvas-header {
    display: none;
}
.navbar-expand .offcanvas .offcanvas-body {
    display: flex;
    flex-grow: 0;
    padding: 0;
    overflow-y: visible;
}


@media (min-width: 1000px) {
.nav-position  {
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
     color:  #000000;
}

.nav-link{ color:  #000000;}
}
@media (min-width: 0px) and (max-width: 1000px){
.nav-position {position:fixed;top:0;right:0;left:0;z-index:1030}
.navbar{background-color: #000}
.nav_link_padding_top{ padding-top: 20px }
}



body {overflow-x: hidden; /* Prevent scroll on narrow devices */}

@media (max-width: 1000px) {
  .offcanvas-collapse {
    position: fixed;
    top: 100px; /* Height of navbar */
    bottom: 0;
    left: 100%;
    width: 100%;
    padding-right: 1rem;
    padding-left: 1rem;
    overflow-y: auto;
    visibility: hidden;
    background-color: #000;
      color:  #fff !important;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out;
  }
  .offcanvas-collapse.open {
    visibility: visible;
    transform: translateX(-100%);
  }
}




.footer-top{width: 900px;}

footer { background-color: #000000; z-index: 30; padding: 1px 0; text-align: left;  margin-top: 0px;  padding-top: 50px; padding-bottom: 100px; min-height: 300px; }
footer a { color: #FFFFFF;  text-decoration: none }
footer a:hover { color: #ffc800; text-decoration: none;}
footer .box{padding-left: 40px; padding-right: 40px}
footer p {  font-size: 14px; color: #FFFFFF; margin: 10; padding: 0;} 

 footer hr {border-top: 1px solid #FFFFFF}


::selection {background-color:rgba(0, 166, 243, 0.9); color:#ffffff/* WebKit/Blink Browsers */}

::-moz-selection { background: rgba(0, 166, 243, 0.9); color:#ffffff /* Gecko Browsers */}
/*! *  Font Awesome 4.4.0 by @davegandy - https://fontawesome.io - @fontawesome *  License - https://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) *//* FONT PATH * -------------------------- */
@font-face {
  font-family: 'FontAwesome';  src: url('../fonts/fontawesome-webfont.eot?v=4.4.0');  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
  font-weight: normal;  font-style: normal;}
.fa { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;}
.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}


.fa-envelope:before { content: "\f0e0";}
  .fa-phone:before{content:"\f095"}.fa-envelope-o:before{content:"\f003"}
.fa-anchor:before{content:"\f13d";}
.fa-search-plus:before {
  content: "\f00e";
}.fa-calendar:before{content:"\f073"}
.fa-shopping-cart:before{content:"\f07a"}
.fa-angle-double-right:before{content:"\f101"}
.fa-lock:before{content:"\f023"}
.fa-caret-right:before{content:"\f0da"}
.fa-desktop:before{content:"\f108"}
.fa-gear:before,.fa-cog:before{content:"\f013"}
.fa-pie-chart:before{content:"\f200"}
.fa-paint-brush:before{content:"\f1fc"}
.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\f080"}
.fa-comment:before{content:"\f075"}
.fa-puzzle-piece:before{content:"\f12e"}
.fa-camera:before{content:"\f030"}
.fa-rocket:before{content:"\f135"}
.fa-code:before{content:"\f121"}
.fa-newspaper-o:before{content:"\f1ea"}
.fa-check:before{content:"\f00c"}

.text_right{text-align: right;}

.text_color_white{color: #fff !important}
.text_color_light_blue{color:#2ca2f3 }
.text_color_dark_blue{color:#0b7ecb }
.text_align_left{ text-align: left; }
@media (max-width: 450px) {
    .lead_title{ color: #000000; font-size: 25px;   font-family:var(--sc-body-font);  }
}
.lead_title{ color: #000000; font-size: 40px;   font-family:var(--sc-body-font);  }


.text_shadow{text-shadow: 1px 1px 2px #000000;}
.text_35{font-size: 35px}
.text_biger{font-size: 18px;}
.text_small{font-size: 14px}
.text_bold{font-weight: 600}

.box_width_small{max-width: 400px}
@media (min-width:450px) {
 .padding_15p{padding-right: 0%; padding-left: 10%}   
}


.lead_small{letter-spacing: 16px; color: #ccc}

.padding-top-50{padding-top: 50px;}
.padding_top_25{padding-top: 25px}
.padding_left_25{ padding-left: 25px  }
.padding_right_25{ padding-right: 25px  }
.padding_left_50{ padding-left: 50px  }
.padding_right_50{ padding-right: 50px  }

.padding_top_100{padding-top: 100px}
.padding_bottom_100{padding-bottom: 100px}
.padding_bottom_50{padding-bottom: 50px}
.padding_bottom_25{padding-bottom: 25px}
.margin_right_img{margin-right: 15px}

.background_color_black{background-image: url(../img/milad-fakurian-3hIaqX3VuXE-unsplash.jpg);}
.background_color_dark{ background-color:#000;}
.background_color_dark_blue{ background-color:#0075c6;}
.background_color_orange{ background-color:#ff914d;}

.background_one{ background-image: url(../img/bg.png);
min-height: 100px; background-size: cover;}
.background_two{ background-image: url(../img/headway-5QgIuuBxKwM-unsplash.jpg);
background-size: cover; background-position: center;}


  .background_header_left{background: linear-gradient(0deg,rgba(204, 230, 255, 1) 0%, rgba(255, 255, 255, 0.57) 41%);  }




.background_hex{background-image: url(../img/right-pattern.png);  background-repeat: no-repeat; background-position: bottom right;  }
.background_hex_left{background-image: url(../img/left-pattern.jpg);  background-repeat: no-repeat;  }
.background_hex_2{background-image: url(../img/g1.png);  }
.blur{ background-color: rgba(0,0,0,.7); }

@media (min-width:1001px ) {
  .background_inner_top_nav{ background-color: rgba(0,0,0,.7); border-bottom: #000 solid 1px;}

}


@media (max-width:1001px ) {
  .background_inner_top_nav{ background-color: rgba(0,0,0,1); border-bottom: #000 solid 1px;}

}


.background_inner_top{ background-image: url(../img/backgound-inner-top.jpg) ; background-size: cover; height: 300px;}



  .btn-header, .btn-header:link, .btn-header:visited {
    color:#fff;
    font-size: 20px;
    line-height: 1em;
 
    text-decoration: none;
    width: 150px;
    border-radius: 4px;
    background-color: #2ca2f3 ;
 
 
    padding: 0.8em;
    text-align: center;


  }

.btn-header:hover{ background-color: #000 }
  .btn-blue, .btn-blue:link, .btn-blue:visited {
    color:#fff;
    font-size: 20px;
    line-height: 1em;
  
    text-decoration: none;
    width: 150px;
  
    background-color: #2ca2f3 ;
 
 
    padding: 0.8em;
    text-align: center;


  }

.btn-blue:hover{ background-color: #ffc800; color: #fff}

  .btn-black, .btn-black:link, .btn-black:visited {
    color:#fff;
    font-size: 20px;
    line-height: 1em;
  
    text-decoration: none;
    width: 150px;
    border-radius: 4px;
    background-color: #000;
 
 
    padding: 0.8em;
    text-align: center;


  }

.btn-black:hover{ background-color: #fff; color:#2ca2f3}

.btn-center {
    display: block;
    margin: auto;
    position: relative;
}




.welcome-section {
  position: relative;

 
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.welcome-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.content {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
 
}

.service-boxes {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

.service-box {
  flex: 1;
  min-width: 250px;
  padding: 20px;

  backdrop-filter: blur(10px); 

  border-radius: 10px;

  text-align: left;
  transition: transform 0.3s;
  margin: 25px;
}

.service-header {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.service-header i {
  font-size: 24px;
  margin-right: 10px;
  color: #63a8f6;
}

.service-box h2 {
  font-size: 1.5em;
  margin-bottom: 5px;
}

.service-box p {
  font-size: 1em;
  margin: 0;
}

/* Hover effect */
.service-box:hover {
  transform: scale(1.05);
}

@media (max-width: 768px) {
  h1 {
      font-size: 2em;
  }


  .service-boxes {
      flex-direction: column;
      align-items: center;
  }

  .service-box {
      max-width: 90%;
      width: 100%;
  }
}

.creative-cards{
  padding: 120px 0;
  position: relative;
}
.creative-cards .container {
  max-width: 1320px;
  width: 100%;
  padding-right: .75rem;
  padding-left: .75rem;
  margin-right: auto;
  margin-left: auto;
}
.creative-cards .container .row{
  display: flex;
  flex-wrap: wrap;
}
.creative-cards .container .row .card-column {
  flex: 0 0 auto;
  width: 33.33333333%;
  text-align: center;
  max-width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}
.card-details {
  width: 80%;
  margin: auto;
  position: relative;
  transition: .3s ease-in-out;
}
.card-details:before {
  content: "";
  width: 190px;
  height: 380px;
  background: #c2e9ff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) skew(-20deg, 0deg);
  z-index: -1;
  transition: .3s ease-in-out;
}
.card-details:hover:before{
  background-color: #b7ecfb;
}
.card-icons .fa{ color: #24c3f3 }

.card-icons {
  width: 140px;
  height: 150px;
  position: relative;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.card-icons:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  border: 2px solid;
  width: 100%;
  height: 100%;
  transform: skew(-20deg, 0deg);
  background: #FFFFFF;
  border-color: #24c3f3 ;
  transition: .3s ease-in-out;
}

.card-details:hover .fa-shopping-cart  { color: #fff }
.card-details:hover .fa-calendar { color: #fff }
.card-details:hover .fa-camera { color: #fff }
.card-details h3{color: #000} 
.card-details:hover .card-icons:before{
  background-color:#24c3f3 ;
 
}

.card-icons i{
  font-size: 50px;
  position: relative;
  width: 70px;
  height: 70px;
}
.card-details h3{
  margin-bottom: 15px;
  margin-top: 50px;
  font-weight: 700;
  font-size: 28px;
  line-height: 1.2;
}
.card-details h3 a{
color: #000;
text-decoration: none;
}
.card-details p{
  font-size: 16px;
  line-height: 30px;
  color: #444;
  font-weight: 400;
  margin-bottom: 30px;
}
.read-more-btn {
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid;
  border-radius: 100%;
  margin: auto;
  background: #fff;
  transform: translateX(-10px);
  opacity: 0;
  visibility: hidden;
  border-color: #24c3f3 ;
  transition: .3s ease-in-out;
  text-decoration: none;
}
.read-more-btn i{
  color: #000;
  font-size: 12px;
}
.card-details:hover .read-more-btn{
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
}

/* ============= Responsive Ipad ==================== */
@media (max-width: 992px) {
.creative-cards .container .row .card-column {
  flex: 0 0 auto;
  width: 50%;
  margin-bottom: 40px;
}
}

/* ============= Responsive Iphone ==================== */
@media (max-width: 480px) {
.creative-cards .container .row .card-column {
  flex: 0 0 auto;
  width: 100%;
  margin-bottom: 20px;
}
.card-details{
  width: 100%;
}
.read-more-btn{
      transform: translateX(0px);
  opacity: 1;
  visibility: visible;
}
}


#box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 400px;
  height: 200px;
  color: white;
  font-family: 'Raleway';
  font-size: 2.5rem;
}
.gradient-border {
  --borderWidth: 3px;
  background: #1D1F20;
  position: relative;
  border-radius: var(--borderWidth);
}
.gradient-border:after {
  content: '';
  position: absolute;
  top: calc(-1 * var(--borderWidth));
  left: calc(-1 * var(--borderWidth));
  height: calc(100% + var(--borderWidth) * 2);
  width: calc(100% + var(--borderWidth) * 2);
  background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
  border-radius: calc(2 * var(--borderWidth));
  z-index: -1;
  animation: animatedgradient 3s ease alternate infinite;
  background-size: 300% 300%;
}


@keyframes animatedgradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}





/* seevices ection------------------------------------------- */

.slider-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80%; /* Adjust width to match the layout */
    margin: auto;
    position: relative;
    overflow: hidden;
}

/* Slide styles */
.slide {
    display: none; /* Hide all slides by default */
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 40px; /* Increased gap between image and text */
    margin: 40px 0;
    opacity: 0; /* Start transparent */
    transition: opacity 1s ease; /* Smooth fade-in/out effect */
}

/* Active slide */
.slide.active {
    display: flex; /* Show the active slide */
    opacity: 1; /* Fully visible */
}

/* Image container */
.image {
    width: 45%; /* Adjust width to make space for text */
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Image styles */
.image img {
    width: 100%;
    height: 600px;
    object-fit: cover;
    border-radius: 15px; /* Rounded corners */
}

/* Text container */
.text {
    width: 45%; /* Adjust width to match the image */
    padding: 20px 40px;
    color: #333;
    background-color: transparent;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* Header styles */
.text h4 {
    font-size: 18px;
    margin-bottom: 10px;
    color: #0056b3; /* Match blue heading */
}

.text h2 {
    font-size: 32px;
    margin: 0;
    text-align: left;
}

/* Paragraph styles */
.text p {
    font-size: 18px;
    margin: 10px 0;
    text-align: left;
}

/* Icons container */
.icons {
    display: flex;
    flex-direction: column; /* Stack icons vertically */
    margin-top: 20px;
}

/* Icon text styles */
.icons span {
    display: flex;
    align-items: center;
    margin-bottom: 0px;
    font-size: 20px;
    color: #333;
}

/* Icon styles */
.icons i {
    margin-right: 10px;
    color: #0056b3; /* Blue icons to match the theme */
  
}

/* Indicator styles */
.indicator {
    position: absolute;
    bottom: 10px;
    width: 100%;
    text-align: center;
}

/* Dot styles */
.dot {
    height: 5px;
    width: 40px;
    margin: 0 5px;
    background-color: lightgrey; /* Default dot color */
    border-radius: 20%;
    display: inline-block;
    cursor: pointer;
}

.dot.active {
    background-color: black; /* Active dot color */
}

/* Responsive Design */
@media screen and (max-width: 768px) {
    .slider-container {
        width: 90%;
    }

    .slide {
        flex-direction: column;
        align-items: center;
    }

    .image, .text {
        width: 100%;
        padding: 10px;
    }

    .image img {
        height: auto;
    }
}



.text p {
    padding-left: 30px; /* Adjust this value as needed to align text with the title */
    font-size: 18px;
  margin-bottom:40px;
}


.pp p{
    margin-top: 20px;
    padding: 0;
    font-size: 18px; /* You can adjust the font-size if needed */
    text-align: left; /* Align text to the left */
}

.background_light_blue{ background-color:  #1aabec; height: 200px; }
.img_center {  display: block;
  margin: auto;}

@media (min-width:676px) {
  

.Iam {

  font-size: 40px ;
  color: #999;
}
.Iam p {
    font-family: var(--sc-body-font);
  float: left;
  font-size:40px;
  margin-right: 0.3em;
}

}

@media (max-width:676px) {
.Iam {

  font-size: 30px ;
  color: #999;
}
.Iam p {
    font-family: var(--sc-body-font);
  float: left;
  font-size:30px;
  margin-right: 0.3em;
}

}

@media (max-width:450px) {
.Iam {

  font-size: 25px ;
  color: #999;
}
.Iam p {
    font-family: var(--sc-body-font);
  float: left;
  font-size:25px;
  margin-right: 0.3em;
}

}

.Iam .b {
  float: left;
  overflow: hidden;
  position: relative;
  height: 50px;
  
}
.Iam .innerIam {
  display: inline-block;
  color: #2ca2f3 ;
  position: relative;
  white-space: nowrap;
  top: 0;
  left: 0;



/*animation*/
-webkit-animation:move 5s;
   -moz-animation:move 5s;
    -ms-animation:move 5s;
     -o-animation:move 5s;
        animation:move 5s;
/*animation-iteration-count*/
-webkit-animation-iteration-count:infinite;
   -moz-animation-iteration-count:infinite;
    -ms-animation-iteration-count:infinite;
     -o-animation-iteration-count:infinite;
        animation-iteration-count:infinite;
/*animation-delay*/
-webkit-animation-delay:2s;
   -moz-animation-delay:2s;
    -ms-animation-delay:2s;
     -o-animation-delay:2s;
        animation-delay:2s;
}
@keyframes move{
0%  { top: 0px; }
20% { top: -70px; }
40% { top: -130px; }
60% { top: -190px; }
80% { top: -260px; }
}

@-webkit-keyframes move {
    0%  { top: 0px; }
    20% { top: -70px; }
    40% { top: -130px; }
    60% { top: -190px; }
    80% { top: -260px; }
}
@-moz-keyframes move {
    0%  { top: 0px; }
    20% { top: -70px; }
    40% { top: -130px; }
    60% { top: -190px; }
    80% { top: -260px; }
}
@-o-keyframes move {
    0%  { top: 0px; }
    20% { top: -70px; }
    40% { top: -130px; }
    60% { top: -190px; }
    80% { top: -260px; }
}
@keyframes move {
    0%  { top: 0px; }
    20% { top: -70px; }
    40% { top: -130px; }
    60% { top: -190px; }
    80% { top: -260px; }
}

.publishing{text-align: center;padding-top: 5%; color: #FFFFFF;  font-size: 18px }
.publishing .container {max-width: 960px;  }
.publishing h2{padding-bottom: 15px; padding-top: 3%}
@media (max-width:1200px) {.publishing h2{padding-bottom: 15px; padding-top: 70px}}
  
 .pub__bg {
    background-image: url(../img/krakenimages-376KN_ISplE-unsplash.jpg);

   
    min-height: 500px; 
    background-attachment: fixed;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;

}    
@media (max-width:991px){ .sm_padding_top_50{padding-top: 50px;} }
@media (max-width:1001px){ .nav_moblie_padding_top{padding-top: 150px;} }
@media (max-width:576px){

   .hidden_xs {
        display: none!important
    }
}

@media (min-width:576px) and (max-width:768px)  {
    .hidden_sm {
        display: none!important
    }
}

@media  (min-width:768px) and (max-width:1000px) {
    .hidden_md {
        display: none!important
    }
}

@media  (min-width:1001px) {
    .hidden_lg {
        display: none!important
    }
}

@media (min-width:1500px) {
    .hidden_xl {
        display: none!important
    }
}