a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
input,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
select,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
textarea,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}
body,
input {
    line-height: 1
}
ol,
ul {
    list-style: none
}
blockquote,
q {
    quotes: none
}
blockquote:after,
blockquote:before,
q:after,
q:before {
    content: '';
    content: none
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
:focus {
    outline: 0
}
*,:after,:before {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box
}
.clear {
    clear: both
}
.hidden {
    display: none
}
.float-left {
    float: left
}
.float-right {
    float: right
}
.text-left {
    text-align: left
}
.text-right {
    text-align: right
}
.text-center {
    text-align: center
}
.no-margin-bottom {
    margin-bottom: 0 !important
}
.margin-bottom-20 {
    margin-bottom: 20px !important
}
.grid-100 {
    margin-right: -100px
}
.grid-100:after {
    clear: both;
    content: "";
    display: table
}
.grid-100 [class^=col-] {
    float: left;
    padding-right: 100px
}
.grid-90 {
    margin-right: -90px
}
.grid-90:after {
    clear: both;
    content: "";
    display: table
}
.grid-90 [class^=col-] {
    float: left;
    padding-right: 90px
}
.grid-50 {
    margin-right: -50px
}
.grid-50:after {
    clear: both;
    content: "";
    display: table
}
.grid-50 [class^=col-] {
    float: left;
    padding-right: 50px
}
.grid-40 {
    margin-right: -40px
}
.grid-40:after {
    clear: both;
    content: "";
    display: table
}
.grid-40 [class^=col-] {
    float: left;
    padding-right: 40px
}
.grid-20 {
    margin-right: -20px
}
.grid-20:after {
    clear: both;
    content: "";
    display: table
}
.grid-20 [class^=col-] {
    float: left;
    padding-right: 20px
}
.grid {
    margin-right: -10px
}
.grid:after {
    clear: both;
    content: "";
    display: table
}
.grid [class^=col-] {
    float: left;
    padding-right: 10px
}
.col-1 {
    width: 100%
}
.col-1-2 {
    width: 50%
}
.col-1-3 {
    width: 33.33%
}
.col-2-3 {
    width: 66.66%
}
.col-1-4 {
    width: 25%
}
.col-3-4 {
    width: 75%
}
.col-1-5 {
    width: 20%
}
.col-2-5 {
    width: 40%
}
.col-3-5 {
    width: 60%
}
.col-4-5 {
    width: 80%
}
.col-1-6 {
    width: 16.66%
}
.col-5-6 {
    width: 83.33%
}
.col-1-8 {
    width: 12.5%
}
.col-3-8 {
    width: 37.5%
}
.col-5-8,
.col-7-8 {
    width: 62.5%
}
.col-1-10 {
    width: 10%
}
.clear-col-2 [class^=col-]:nth-child(odd) {
    clear: both
}
.clear-col-3 [class^=col-]:nth-child(3n + 1) {
    clear: both
}
.clear-col-4 [class^=col-]:nth-child(4n + 1) {
    clear: both
}
@font-face {
    font-family: "Euclid Flex";
    src: url('../fonts/EuclidFlex.woff') format('woff');
    font-weight: 400
}
@font-face {
    font-family: "Euclid Flex";
    src: url('../fonts/EuclidFlexBold.woff') format('woff');
    font-weight: 700
}
@font-face {
    font-family: "Euclid Flex";
    src: url('../fonts/EuclidFlexLight.woff') format('woff');
    font-weight: 300
}
body {
    color: #424d57;
    font-family: 'Euclid Flex', sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    line-height: 200%
}
.icon {
    display: inline-block;
    font: var(--fa-font-solid);
    text-rendering: auto;
    -webkit-font-smoothing: antialiased
}
h1,
h2,
h3 {
    color: #11121a;
    font-weight: 700;
    font-size: 56px;
    line-height: 150%;
    margin-bottom: 20px
}
h1:last-child,
h2:last-child,
h3:last-child {
    margin-bottom: 0
}
h2 {
    font-size: 36px
}
h3 {
    font-size: 24px
}
.underline {
    position: relative
}
.underline:before {
    background: rgba(255, 255, 255, .1);
    content: '';
    height: 2px;
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 20px
}
.underline.dark:before {
    background: #f6f7f8
}
ol,
p,
ul {
    margin-bottom: 20px
}
ol:last-child,
p:last-child,
ul:last-child {
    margin-bottom: 0
}
ol+h1,
ol+h2,
ol+h3,
p+h1,
p+h2,
p+h3,
table+h1,
table+h2,
table+h3,
ul+h1,
ul+h2,
ul+h3 {
    margin-top: 60px
}
a {
    color: #ee3a43;
    text-decoration: none
}
a:hover {
    text-decoration: underline
}
.c {
    margin: 0 auto;
    max-width: 1280px;
    padding: 0 40px;
    width: 100%
}
.c.slim {
    max-width: 880px
}
main {
  background-image: url('https://dedicated.dev/hag/wp-content/uploads/2025/06/pattern-png-transparent-4.png');
  background-repeat: repeat;
  background-attachment: fixed;
  background-position: center;
},
section {
    padding: 40px 0
}
img {
    display: block;
    max-width: 100%
}
header {
    box-shadow: 0 1px 10px rgba(0, 0, 0, .05);
    -webkit-box-shadow: 0 1px 10px rgba(0, 0, 0, .05);
    -moz-box-shadow: 0 1px 10px rgba(0, 0, 0, .05);
    background: #fff;
    padding: 40px 0;\
    position: relative;
    z-index: 100
}
header:after {
    clear: both;
    content: "";
    display: table
}
header .logo {
    float: left
}
header .logo img {
    height: 80px
}
header .menu {
    float: right
}
header .menu li {
    float: left;
    margin-left: 60px
}
header .menu li a {
    color: #11121a;
    font-size: 16px;
    font-weight: 400
}
header .menu li a:hover {
    color: #ee3a43;
    text-decoration: none
}
.hero {
    background-color: #101f34;
    background-size: cover;
    background-position: center center;
    padding: 40px 0 50px;
    position: relative
}
.hero:before {
    background: rgba(0, 0, 0, .2);
    content: '';
    height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 3
}
.hero .hero-overlay {
    background: #101f34;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 2
}
.hero * {
    position: relative;
    z-index: 4
}
.hero h1,
.hero h3 {
    color: #fff
}
.hero h1 {
    position: relative;
    margin-bottom: 40px
}
.hero h1:before {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0
}
.hero h1.dark:before {
    background: #f6f7f8
}
.hero h1:before {
    background: #ee3a43;
    height: 5px;
    width: 50px
}
.hero p {
    color: #fff;
    margin-bottom: 40px;
    max-width: 800px
}
.breadcrumbs {
    background: #f6f7f8;
    padding: 20px 0
}
.breadcrumbs ul {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    list-style: none;
    margin: 0
}
.breadcrumbs ul:after {
    clear: both;
    content: "";
    display: table
}
.breadcrumbs ul li {
    float: left;
    margin-right: 40px;
    position: relative
}
.breadcrumbs ul li:after {
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    opacity: .37;
    -webkit-opacity: .37;
    -moz-opacity: .37;
    -khtml-opacity: .37;
    color: #74808b;
    content: "\f105";
    font: var(--fa-font-solid);
    font-size: 12px;
    line-height: 20px;
    position: absolute;
    top: 0;
    right: -22px
}
.breadcrumbs ul li a {
    color: #74808b;
    display: block;
    line-height: 20px;
    text-decoration: none
}
.breadcrumbs ul li a:hover {
    opacity: 1;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    text-decoration: underline
}
.breadcrumbs ul li:last-child:after {
    display: none
}
.breadcrumbs ul li:last-child a {
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}
footer {
    background: #101f34;
    line-height: 150%;
    padding: 80px 0
}
footer .logo {
    display: inline-block
}
footer .logo img {
    height: 80px;
    margin-bottom: 100px
}
footer h3 {
    position: relative;
    color: #fff;
    font-size: 20px
}
footer h3:before {
    background: rgba(255, 255, 255, .1);
    content: '';
    height: 2px;
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 20px
}
footer h3.dark:before {
    background: #f6f7f8
}
footer ol,
footer p,
footer ul {
    color: #fff;
    font-size: 16px
}
footer ol a,
footer p a,
footer ul a {
    color: #fff
}
footer ol a:hover,
footer p a:hover,
footer ul a:hover {
    color: #ee3a43
}
.copyright {
    background: #0a1321;
    padding: 40px 0
}
.copyright:after {
    clear: both;
    content: "";
    display: table
}
.copyright p {
    color: rgba(255, 255, 255, .54);
    float: left;
    font-size: 14px;
    margin: 0
}
.copyright ul {
    float: right;
    margin: 0
}
.copyright ul li {
    float: left;
    margin-left: 60px
}
.copyright ul li a {
    color: rgba(255, 255, 255, .54);
    font-size: 14px
}
.copyright ul li a:hover {
    color: #ee3a43
}
.btn {
    transition: all 0.2s ease-out;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    background: #ee3a43;
    border-bottom: 5px solid #a31f22;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-weight: 400;
    line-height: 20px;
    margin-bottom: 20px;
    padding: 20px 40px;
    text-decoration: none;
    text-align: center
}
.btn:hover {
    background: #a31f22;
    text-decoration: none
}
.btn:last-child {
    margin-bottom: 0
}
.btn.full {
    width: 100%
}
.btn.navy {
    background: #101f34;
    border-bottom: 5px solid #0a1321
}
.page-menu h3 {
    position: relative
}
.page-menu h3:before {
    content: '';
    height: 2px;
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 20px
}
.page-menu h3.dark:before,
.page-menu h3:before {
    background: #f6f7f8
}
.page-menu ul {
    font-size: 14px;
    line-height: 200%
}

.page-menu li:not(:last-child) {
    padding-bottom: 14px;
}

.page-menu ul li a {
    color: #101f34
}
.page-menu ul li a:hover {
    color: #ee3a43
}
.front-page-companies .front-page-companies-box {
    background: #e5e8eb;
    margin-top: 40px;
    padding: 20px
}
.front-page-companies .front-page-companies-box .front-page-companies-box-img {
    align-items: center;
    margin: -20px -20px 20px;
    background: #101f34;
    height: 200px;
    display: flex;
    justify-content: center
}
.front-page-companies .front-page-companies-box .front-page-companies-box-img img {
    max-height: 200px;
    max-width: 366px
}
.front-page-companies .front-page-companies-box h4 {
    color: #11121a;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px
}
.front-page-companies .front-page-companies-box p {
    font-size: 14px;
    line-height: 180%
}
.front-page-details {
    background-color: #101f34;
    background-image: url('../images/front-page-details-bg.jpg');
    background-size: cover;
    padding: 40px 0
}
.front-page-details h2 {
    color: #fff
}
.front-page-details p {
    color: #fff;
    max-width: 800px
}
.front-page-more {
    background: #f6f7f8;
    padding: 100px 0
}
.front-page-more .front-page-more-img {
    margin-top: -20px;
    display: block;
    width: 100%
}