/*!
Theme Name: VND
Theme URI: https://vndtechsolutions.com/
Author: Visual Net Design
Author URI: https://vndtechsolutions.com/
Description: VND Custom Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: vnd
Tags: custom-background, custom-logo, custom-menu, custom-theme

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

VND is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}


dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: #fff;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 0px;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
a {
	color: #4169e1;
	text-decoration: none;
}

a:hover,
a:focus,
a:active {
	color: #191970;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */
.main-navigation {
	display: block;
	width: 100%;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
	}
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 0px;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}

footer{
    padding: 50px 0px;
}

.full-box{
	max-width:100%
}

.footer-container{
	background-color:#002A3F;
}

.footer-header{
	font-size:15px;
	color:#FFB605;
	font-family:'Proxima Nova';
	font-weight:700;
	margin-bottom:25px
}

.footer-menu {
    margin-top: 10px;
}

.vertical-menu {
    list-style: none;
    padding: 0;
}

.vertical-menu li{
		font-family:'Proxima Nova';
		font-size:11px;
		margin-bottom:2px;
}

.vertical-menu li a {
		color:white;
}

.vertical-menu li a:hover {
		color:#FFB605;
		text-decoration:none;
		transition:0.5s
}

.footer-text{
		font-family:'Proxima Nova';
		font-size:11px;
	color:white;
}

.contact-footer-col{
	padding-left:50px;
	border-left:solid 0.5px;
	border-left-color:#6ACDEB
		
}

.header-container{
	padding-left:40px;
	z-index: 2;
}

.social-list{
	list-style:none;
	padding-left:0px;
}

.social-list {
    display: flex;
    list-style: none; 
    padding: 0;
    margin: 0;
}

.social-list li {
 margin-right: 1px; 
}


.social-list a {
    text-decoration: none; 
    display: inline-block;
}

.social-list img {
    max-width: 60%;
}

h1{
	font-family:'Proxima Nova';
	font-size:70px;
	text-transform:uppercase;
}

.large-hl{
	color:#FFB605;
	background-color:#002A3F;
	margin-left:10px;
	padding:10px 50px;
clip-path: polygon(0 0, 95% 0, 100% 100%, 5.5% 100%);
		margin-left:-35px
}

.small-hl{
	color:#FFB605;
	background-color:#002A3F;
	margin-left:10px;
	padding:10px 50px;
clip-path: polygon(0 0, 95% 0, 100% 100%, 10% 100%);
		margin-left:-35px
}

ho{
	color:#FFB605;
	background-color:#002A3F;
	margin-left:10px;
	padding:10px 0px;
clip-path: polygon(0 0, 63% 0, 100% 100%, 0 100%);
	margin-left:-150px
}

.custom-logo , .toggle-menu-btn{
	max-width:70%
}

@media (min-width: 1400px){
.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
	max-width: 1300px!important;
}
}
.carousel-caption{
	position:initial;
	text-align:start;
	padding-left:100px
}

.hero-description{
	padding-left:100px;
}

.carousel-item{
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	padding:450px 0px 100px 0px;
}

.carousel-indicators{
	bottom:40%!important;
	margin:0px;
	left:95%;
	display:grid;
}

.carousel-indicators [data-bs-target]{
	width:10px;
	height:10px;
	border-radius:100%!important;
	margin-top:-5px;
	background-color:#FA8400!important;
	opacity:1;
		
}

.carousel-indicators .active{
	background-color:white!important
}

.vnd-btn{
	background-color:#FFB605!important;
	color:#002A3F;
	border:none;
	border-radius:0px;
	font-weight:700;
	padding: 10px 20px 10px 30px;
	font-size:18px;
	font-family:'Proxima Nova';
	text-transform:uppercase;
-webkit-box-shadow: 10px 10px 0px 0px #002A3F;
    -moz-box-shadow: 10px 10px 0px 0px #002A3F;
    box-shadow: 10px 10px 0px 0px #002A3F;
}

.vnd-btn:hover{
		background-color:#002A3F!important;
	color:#FFB605;
-webkit-box-shadow:none;
    -moz-box-shadow:none;
    box-shadow: none;
		
}

.vnd-btn:hover .cls-1{
	stroke:#FFB605;
}

.vnd-btn-icon svg{
	width:14px;
	margin: 17px 0px 0px 20px
}
/** SINGLE PROJECTS **/
.project-hero {
	padding: 180px 0 100px;
	margin-top: -102px;
}
.project-hero h1 {
	background-color: #FFB605;
	padding: 10px 65px;
	color: #002A3F;
	width: fit-content;
	clip-path: polygon(0 0, calc(100% - 50px) 0%, 100% 100%, 50px 100%);
	margin-bottom: 60px;
}
.project-hero p {
	font-size: 28px;
	color: #FFF;
	font-weight: 500;
	max-width: 85%;
}
.mockup-image.mobile-phone {
	position: relative;
	height: 588px;
}
.mobile-phone .project-image {
	position: absolute;
	top: 5px;
	height: calc(100% - 20px);
	border-radius: 30px;
	transform: translateX(15px);
}
.mobile-phone .phone-image {
	position: absolute;
	top: 0;
	z-index: 2;
	height: 100%;
}
.mockup-image.laptop {
	position: relative;
	aspect-ratio: 1280 / 781;
	height: auto;
}
.laptop .project-image {
	position: absolute;
	top: 5.51%;
	left: 15.39%;
	width: 69.22%;
	height: 70.81%;
	border-radius: 0;
	object-fit: cover;
	object-position: top center;
}
.laptop .laptop-image {
	position: absolute;
	top: 0;
	z-index: 2;
	width: 100%;
}
.two-mobile-phones {
	position: relative;
	height: 588px;
}
.two-mobile-phones .phone1 {
	position: absolute;
	z-index: 1;
	height: 500px;
	width: 50%;
	top: 88px;
}
.two-mobile-phones .phone2 {
	position: absolute;
	z-index: 2;
	height: 500;
	width: 50%;
	left: 40%;
	top: 0;
}
.home-hero {
	margin-top: -200px;
}
/** ALT HOME HERO **/
.home-hero-alt {
	position: relative;
	padding: 200px 0 100px;
	background-size: cover;
	background-position: center center;
	min-height: 780px;
	display: flex;
	align-items: end;
}
.home-hero-alt::before {
	/* The nav bar is fixed + fully transparent until the page is scrolled
	   (see .navbar / .navbar.active above), so at the top of the page the
	   logo and menu items sit directly on this photo with nothing behind
	   them. This darkens the photo itself so nav contrast doesn't depend
	   on which part of the image happens to be behind it. */
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 10, 20, 0.55) 0%, rgba(0, 10, 20, 0.3) 30%, rgba(0, 10, 20, 0.45) 100%);
	pointer-events: none;
}
.home-hero-alt .content-wrapper {
	position: relative;
	width: 90%;
	margin: 0 auto;
}
.home-hero-alt h1 {
	font-size: 70px;
	font-weight: 500;
	color: #fff;
}
.home-hero-alt h1 span {
	color: #FFB605;
	display: block;
	width: fit-content;
	background-color: #002A3F;
	padding: 10px 50px;
    padding-top: 10px;
	clip-path: polygon(0 0, calc(100% - 50px) 0%, 100% 100%, 50px 100%);
	min-height: 104px;
	margin-left: -50px;
}
@keyframes cursorDisplay {
	from {opacity: 1}
	to {opacity: 0}
}
.home-hero-alt h1 span:after {
	content: '|';
	animation: cursorDisplay;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	font-size: 130%;
	position: relative;
	top: 4px;
}
.home-hero-alt .content {
	color: #FFF;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: 40px;
	gap: 40px 150px;
}
.home-hero-alt .content p {
	color: #FFF;
	padding-left: 100px;
	font-size: 20px;
}
@media (max-width: 767px) {
	.home-hero-alt .content-wrapper {
		width: 100%;
		padding: 0 20px;
	}
	.home-hero-alt .content p {
		color: #FFF;
		padding-left: 0;
	}
	.home-hero-alt .content {
		grid-template-columns: 1fr;
	}
	.home-hero-alt h1,
	.home-hero-alt h1 span {
		font-size: 35px !important;
	}
	.home-hero-alt h1 span {
		min-height: 62px;
		clip-path: polygon(0 0, calc(100% - 20px) 0%, 100% 100%, 20px 100%);
		padding: 10px 20px;
		margin-left: -20px;
	}
}

*{
	text-decoration:none!important;

}


body .uwy.userway_p3 .uai {
	margin-bottom:80px;
}

.typing-carousel .carousel-item {
    transition-duration: 0.0000000001s!important;
}

html{
	overflow-x:hidden!important;
}

hl{
	display:inline-flex;
	width:fit-content;
		
}
.pageClickprev.disable {
	display: none !important;
}

.show-submenu-third-level .dropdown-menu {
	display: block !important;	
}
/*.navbar .dropdown-menu .show-submenu-third-level.dropdown-menu {
	display: flex !important;
    flex-direction: row !important;
    position: absolute !important;
    background-color: #002a40 !important;
    width: 100% !important;
    top: 36px !important;
    left: 0 !important;
}*/
#menu-item-2648  {
	padding-top: 15px;
}
.navbar-nav .dropdown-menu .dropdown-toggle[aria-expanded="true"] {
	background-color: rgb(255, 182, 5);
}
.navbar .description {
	display: flex;
	flex-direction: column;
}
.page-id-2303 .navbar-nav>#menu-item-2470>a>span{
	color: #FFB605 !important
}
.menu-item.highlight>a>span{
	color: #FFB605;	
}
.page-id-2303 .current_page_ancestor.menu-item-2889>a>span,
.page-id-2303 .current_page_ancestor.menu-item-3429>a>span{
	color: #fff !important
}
.navbar .btn-feature {
	display: flex;
	justify-content: end;
}
.navbar .btn-feature a span {
	color: #fff !important;
}
.navbar .dropdown-menu .dropdown-menu .dropdown-menu li.btn-feature:hover a {
	opacity: 1;
	background-color: #fff !important;
}

.navbar .btn-feature a{
	
	display: inline-block;
	background-color: #FFB605 !important;
	width: fit-content;
	align-items: end;
	padding: 0.25rem 1rem !important; 
	font-size: 1rem !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	line-height: 1.5;
}
.navbar .btn-feature a:hover {
	
	background-color: #fff !important;
}
.navbar .btn-feature a:hover span {
	color: #FFB605 !important;
}
.navbar.active {
	background-color: rgba(0, 42, 63, .8) !important
}
.navbar  {
	position: fixed; 
	top: 0;
	left: 0;
	z-index: 9999;
	width: 100%;
	background-color: transparent !important; 
}

.navbar .custom-logo {
	filter: brightness(0) invert(1);
	max-height: 50px;
	width: auto
	
}


.navbar .dropdown-menu .dropdown-menu .dropdown-menu li:hover a{
	background-color: transparent !important;
	opacity: 1;
}

.navbar .dropdown-menu .dropdown-menu{
	min-height: initial !important;
	position: relative !important;
}


.navbar .dropdown-menu .dropdown-menu .dropdown-item {
	text-transform: uppercase !important;
	padding-top: 5px !important;
	padding-bottom: 5px !important;
	font-weight: 500 !important;
}
.navbar .dropdown-menu .dropdown-menu .dropdown-item:hover {
	background-color: transparent !important;
	color: #FFB605 !important;
}
.dropdown-item:focus, .dropdown-item:hover {
	background-color: #FFB605 !important
}
.navbar ul#menu-main-nav>li>a:hover,.navbar ul#menu-main-nav>li>a.show {
	color: #FFB605 !important
}.current_page_ancestor>a,.current-menu-item>a{
	background-color: transparent !important;
}
.current_page_ancestor>a>span,.current-menu-item>a>span{
	color: #FFB605 !important;
}
#menu-item-3533.current-menu-item>a>span{ 
color: #fff !important}
.navbar .current-page-ancestor .vnd-btn.current_page_item>a {
	background-color: #fff !important;
	color: #FFB605 !important
	
}
.navbar ul#menu-main-nav>li>a{
padding: 15px  0 !important;}
.navbar ul>li a {
	font-weight: 600;
	
	color: #fff !important;
	text-transform: uppercase;
}
.navbar ul>li a:hover {
	color: #fff !important;
	
}
.nav-title a{
	color: #fff !important;
		padding: 0 !important;
	font-size: 25px !important;
	margin-bottom: 15px;
	font-weight: 600 !important;
	 pointer-events: none;
}
/*.current_page_ancestor>a>span:hover, .current-menu-item>a>span:hover {
	color: #fff !important
}*/
.nav-title:hover a {
	background-color: transparent;
}
.navbar .hide-title>a{
	display: none !important;
}
.navbar .vnd-btn {
	
	
	background-color: transparent !important;
}
.navbar .dropdown-menu .dropdown-menu .dropdown-menu li.vnd-btn:hover a,
.navbar .vnd-btn>a:hover {
	opacity: 1;
	background-color: #fff !important;
	color: #FFB605 !important
}
.navbar .current-menu-item.vnd-btn>a {
	background-color: #fff !important;
}
.navbar .vnd-btn>a {
	border: none;
	font-size: 13px !important;
		font-weight: 600 !important;
	text-transform: uppercase !important;
	    background-color: #FFB605!important;
    border-radius: 0px;
    font-weight: 700;
    padding: 5px 10px !important;
    font-size: 18px;
    font-family: 'Proxima Nova';
    text-transform: uppercase;
	display: inline-block !important;
	width: fit-content;
	padding: 0px;
	font-size: 13px;
	margin: 10px;
	box-shadow: none;
	margin: 0 0 15px 0;
}
.navbar .nav  {
	width: 100%;
	display: flex;
	flex: 1 1 0px;
	justify-content: end;
}
.navbar .nav>li {
	margin-right: 20px;
}
.navbar p {
		order: 2;
	color: #fff;
	  word-break: break-word;
}
.navbar .columns-3:last-child,.navbar .columns-4:last-child {
	border: none;
}
.navbar .columns-2 {
	width: 50%;
}
.navbar .columns-3 {
	width: 33%;
}
.navbar .columns-4 {
	width: 25%;
}
.navbar .columns-3,.navbar .columns-4 {
	
	display: flex;
	flex-direction: column;
	border-right: 1px solid rgba(255,255,255,.3);
	padding: 0 25px 25px 25px;
	position: relative;
}
.dropdown, .dropend, .dropstart, .dropup {
	position: unset
}
#menu-main-nav>li>.dropdown-menu.show{ 
	display: flex;
}
#menu-main-nav>li.submenu-row>.dropdown-menu  {
	/*display: flex;*/
	width: 100%;
    flex: 1 1 0px;
    justify-content: space-around;
}
.submenu-row .current_page_ancestor>a>span{
	color: #fff !important
}
#menu-main-nav>li.submenu-row>.dropdown-menu ul {
	display: none;
}
#menu-main-nav .second-level:hover{
	background-color: rgb(255, 182, 5);
}
#menu-main-nav>li.submenu-row>.dropdown-menu li.menu-item-has-children>.dropdown-menu.show .dropdown-menu{ 
	display: block !important;
	position: relative !important;
	top: 0 !important
}

#menu-main-nav>li.submenu-row>.dropdown-menu li.menu-item-has-children>.dropdown-menu .dropdown-menu .nav-item:hover span {
	color: #fcb900 !important
}
#menu-main-nav>li.submenu-row>.dropdown-menu.show li.menu-item-has-children>.dropdown-menu.show{
	display: flex;
}
#menu-main-nav>li.submenu-row>.dropdown-menu li.menu-item-has-children>.dropdown-menu{
	/*display: flex;*/
	flex-direction: row;
	position: absolute !important;
	background-color: #002a40;
	width: 100%;
	top: 50px;
	left: 0;
}
#menu-main-nav>li>.dropdown-menu {
	display: none;
	margin-top: 0 !important;
	width: calc(100% + 1px);
	
	
	left: 0;
	transform: translate(-1px,-1px);
	border-radius: 0;
	top: 55px;
	background-color: #002a40 !important; 
}
#menu-main-nav li>.dropdown-menu .dropdown-menu {
	min-height: 200px;
	padding: 0 ;
	margin: 6px 0;
	display: block;
	border-radius: 0;
	width: 100%;
	border: none;
	display: flex;
	flex-direction: column;
	background-color: transparent;
}


h1 > p{
	color:white;
		font-weight:500;
}

li{
	font-family:'Gillsans';
}



p{
	font-family:'Gillsans';
	color:#002A3F;
	font-weight:300;
	
}

h2{
	font-family:'Proxima Nova'
}

h4{
	font-family:'Proxima Nova'
}

.about-banner{
	padding:50px 0px;
	background-color:#FFB605
}

.text{
	font-size:16px;
	font-weight: 300;
}

.hero-description > p{
	color:white;
	font-size: 1.15rem;
}

.about-title{
	color:#002A3F;
	font-weight:700;
	font-size:26px;
}

.about-description{
		padding-left:50px;
		color:#002A3F;
}

.vnd-link{
	color:#002A3F;
}

.vnd-link:hover{
	color:#002A3F;
}

.vnd-link-icon svg {
    margin-left: 10px;
    width: 20px;
    height: 20px;
    transition: margin-left 0.2s, margin-top 0.2s;
}

.vnd-link:hover > .vnd-link-icon svg {
    margin-left: 20px;
    margin-top: 15px;
    width: 20;
    height: 20;
}

.service-link{
	color:#FFB605!important;
}

.service-link:hover{
	color:#FFB605!important;
}

.service-link .cls-1{
	stroke:#FFB605;
}

.service-link:hover .cls-1{
	stroke:#FFB605;
}



/*offer area*/
.offer-area {position: relative;z-index: 1; width: 100%; overflow: hidden;} 
.offer-tab-link {text-align: center;}
.offer-tab-link ul li {display: inline-block;padding: 10px 0;margin: 0 -3px;}
.offer-tab-link ul li a {display: block;color: #000;font-size: 20px;padding: 10px 60px;border-bottom: 4px solid #000; font-weight: 500;}
.offer-tab-link ul {list-style: none;padding: 0;margin: 0; border: 0;justify-content: center;}
.offer-tab-link ul li a.active {color: darkcyan; border-color: darkcyan;}
.p {text-align: left;margin: 0;width: 100%;}
.offer-content h2 {text-align: left;}
.offerItem {padding: 0 15px;width: 80px;overflow: hidden;float: left;position: relative; transition: 0.3s ease; background-repeat:no-repeat; background-position:center; background-size:cover;}
.offer-img {margin: 0 -15px;}
.offer-detail {width: 800px;}
.offerItemTitle {position: absolute;left: 40px;z-index: 1;width: 600px;color: #fff;transform: rotate(-90deg);transform-origin: left;text-align: center;margin: 0 auto;top: 93.6%;height: 80px;line-height: 80px;background: rgba(0,0,0,0.5); cursor: pointer; text-transform: uppercase;font-family: 'Proxima Nova';
font-weight: 400;}
.offerItem.active {width: calc(100% - 3*80px);}
.offerItem.active .offer-detail {width: 1007px;}
.offerItem.active .offer-img {max-width: 415px;}
.offerItem.active .offer-detail .row .col:first-child {max-width: 40% !important;}
.offer-content {max-width: 100%;margin: 0 auto;top: 50%;position: relative;transform: translate(0, -50%); opacity: 0; transition: opacity 0.3s ease;}
.offer-tabs.tab-content {padding: 0px 0;}
.offerslide:after {content: '';clear: both;display: block;}
.offer-content p {color: #000;}
.offer-content h2 {font-size: 24px;color: #000; text-transform: uppercase;}
.offerItemTitle.hide {display: none;}
.offerItem.active .offer-content{ transition: 0.3s ease; opacity: 1;}
/*end*/




  /*media area*/
  @media (max-width:1750px){
    .container {max-width: 1540px;}
  }
  
  @media (max-width:1550px){
    .container {max-width: 1340px;}
  }
  
  @media (max-width:1450px){
    .container {max-width: 1240px;}
    .offer-content {margin: 0; max-width: 100%;}
  }
  

  @media (max-width:1280px){
    .container {max-width: 1140px;}
    .offerItem.active .offer-detail {width: 750px;}
    .offer-detail {width: 595px;}
  }
 
 @media (max-width:1199px){
    .container {max-width: 960px;}
    h4.offerItemTitle {height: 75px;line-height: 72px; left: 25px; top: 94%;}
    .offerItem{ width: 50px;}
    .offerItem.active { width: calc(100% - 3*50px);}
    .offerItem.active .offer-content{ margin-left: 20px;}
}



 @media (max-width:991px){
    .container {max-width: 100%;}
    .offer-content p{ font-size: 14px;}
    .offerItem.active .offer-content {margin-left: 0;}
    h4.offerItemTitle {font-size: 14px;top: 93%; width: 280px;font-family: 'Proxima Nova'; height: 38px; line-height: 36px; left: 17px;}
    .offerItem.active .offer-detail {width: 500px;}
    .offer-content h2 {font-size: 18px;margin: 0;}
    .offer-content a {padding: 7px 13px; font-size: 16px; margin-top: 10px;}
    .offer-detail {width: 395px; max-height: 279px;}
    .offerItem {width: 35px;}
    .offerItem.active {width: calc(100% - 3*35px);}
  }
 
 @media (max-width:767px){
    .container {max-width: 100%;}
    .offerItem {width: 100%;}
    .offer-detail {width: 100%;max-height: unset;display: none;}
    h4.offerItemTitle{ text-align: left;padding-left: 15px; position: relative; transform: rotate(0); border-bottom: 0px solid #999; height: 40px; line-height: 40px; width: 100%; left: 0;}
    .offer-img {margin: 0;}
    .offer-content {margin: 0;max-width: 100%;}
    .offerItemTitle.hide {background: #de9400; display: block;}
    .offerItem.active .offer-detail {width: 100%; display: block;}
    .offerItem.active .offer-detail .row .col:first-child {max-width: 50% !important;}
    .offerItem.active{ width: 100%;}
   
  }
 
 @media (max-width:574px){
    .container {max-width: 100%;}
    .offerItem.active .offer-detail .row {display: block;}
    .offerItem.active .offer-detail .row .col {max-width: 100% !important;}
    .offer-content {transform: translate(0);top: 0;padding: 10px 0;}
    .offer-img,.offerItem.active .offer-img {width: 100%;max-width: unset;}
    .offer-img img{ width: 100%;}
    .offerItem.active .offer-detail .row .col:first-child {max-width: 100% !important;}

  }


.tab-accordion{
	height:600px
}

.offer-content{
	padding:60px;
	
}

.service-category{
	color:white;
	font-size:16px;
	text-transform:uppercase;	
	margin-bottom:150px;
}

.service-title{
	color:#FA8400!important;
	font-size:55px!important;
	padding-left:30px
}

.service-description{
	color:white!important;
	padding-right:250px;
	padding-left:30px;
}

.service-link{
	padding-left:30px;
	color:#FA8400;
}

.home-portfolio{
	background-color:white;
	padding: 70px 0px;
	z-index:99;
	margin-top:-15px;
	border-bottom: solid 1px;
	border-bottom-color:#FFB605;
		
}

.projects-accordion{
	margin-bottom:25px;
}

.little-title{
	font-size:16px;
	margin-bottom:25px;
	text-transform:uppercase;
}

.project-title{
	font-size:80px!important;
	text-transform:none!important;
	transition:0.4s;
	cursor:pointer;
}

.project-number h5{
	color:#FA8400;
	font-family:'Proxima Nova';
	font-weight:400;
	font-size:26px
}

.project-number-orange h5{
	color:#FA8400;
	font-family:'Proxima Nova';
	font-weight:400;
	font-size:26px
}

.project-number-blue h5{
	color:#002A3F;
	font-family:'Proxima Nova';
	font-weight:400;
	font-size:26px
}


.project-description{
	word-wrap: break-word;
	margin-bottom:5px!important

}

.project-tab{
	padding: 15px 5px;
border-top: solid 1px;
border-bottom: solid 1px;
}


.project-tab .project-link{
display:none!important
}


.project-tab .project-images-col{
display:none;
}

.active-project{
	background-color:#FFB605!important;
		border:none;
}

.project-title{
	color:#002A3F;
}

.active-project .project-title{
word-wrap: break-word!important;
font-size:45px!important;
transition:0.4s
}

.active-project .project-description{
display:flex!important;
word-wrap: break-word!important;
}

.active-project .project-link{
display:flex!important;
padding-bottom:25px
}

.active-project .project-images-col{
display:flex!important;
}

.active-project .toggle-project {
	content: url('<?php echo esc_url($full_image_url); ?>') !important;
}


.project-tab {
    max-height: 120px;
    overflow: hidden;
    transition: max-height 0.04s ease-in-out;
}

.active-project {
    max-height: 1000px; /* Ajusta esto al valor máximo posible */
    overflow: visible;
    transition: max-height 0.8s ease-in-out;
}

.project-info{
	width:92.33%
}

.active-project .project-info{
	width:33.33333333%!important;
}

.vnd-badge{
	font-family: 'Proxima Nova';
font-weight: 400;
border: solid 1px;
border-radius: 0px;
color: #002A3F;
}

.vnd-badge:hover{
	color:#002A3F;
	cursor: default!important;
}

.home-news{
	padding:50px 0px;
}

.news-title{
	color:#002A3F;
	font-size:30px;
}

.news-date{
	color:#002A3F;
	font-size:12px;
}

.news-description{
	color:#002A3F;
	font-size:16px;
}

.news-link{
	color:#002A3F;
	font-size:16px;
	width:100%!important;
	text-align:center;
	
}

.view-our-work-link{
		font-size:20px!important;
}

.news-link-row{
	padding-left:50%;
}

.swiper-slide{
	height:550px;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}

.news-slider .swiper-slide{
	height:275px;
	padding:20px!important;
}

.news-slider .news-description{
	display:-webkit-box;
	-webkit-line-clamp:3;
	-webkit-box-orient:vertical;
	overflow:hidden;
}

.swiper-slide.with-overlay {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
}

.swiper-slide.with-overlay-1::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
		background-color: rgba(250, 132, 0, 0.85);
 /* Cambia este valor para ajustar la opacidad y el color del overlay */
    z-index: 1;
}

.swiper-slide.with-overlay-2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
		background-color: rgba(255, 182, 5, 0.85);
 /* Cambia este valor para ajustar la opacidad y el color del overlay */
    z-index: 1;
}

.swiper-slide.with-overlay-3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
		background-color: rgba(106, 205, 235, 0.85);
 /* Cambia este valor para ajustar la opacidad y el color del overlay */
    z-index: 1;
}

.swiper-slide.with-overlay-4::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
		background-color: rgba(52, 165, 166, 0.85);
 /* Cambia este valor para ajustar la opacidad y el color del overlay */
    z-index: 1;
}

.swiper-slide .news-title,
.swiper-slide .news-date,
.swiper-slide .news-description,
.swiper-slide .news-link {
    position: relative;
    z-index: 3;
}

.home-news{
	background-color:white;
	padding: 70px 0px;
	z-index:99;
	border-bottom: solid 1px;
	border-bottom-color:#FFB605;
		
}

.home-partners{
		padding: 70px 0px;
		border-bottom: solid 1px;
	border-bottom-color:#FFB605;
}


.partners-title{
	color:#002A3F;
	font-weight:700;
	font-size:26px;
}

.partners-description{
		padding-left:50px;
		color:#002A3F;
}

.swiper-button-next{
	right:30px;
	color:#FFB605;
	/***/
}

.swiper-button-prev{
	left:30px;
	color:#FFB605;
	/***/
}

.contact-section{
		padding: 70px 0px;
}

.contact-details {
    display: flex;
    flex-direction: column; /* Apila elementos verticalmente */
    gap: 10px; /* Espacio entre elementos */
}

.contact-detail {
    display: flex; /* Mostrar elementos en línea */
    align-items: center; /* Centrar verticalmente los elementos */
}

.contact-detail img {
    width: 15%; /* Establece el ancho al 60% */
    height: auto; /* Mantén la proporción de aspecto original */
    margin-right: 10px; /* Espacio entre la imagen y el texto */
}

yl{
	color:#FFB605
}

.contact-title{
	color:#002A3F;
	font-size:80px
}

.form-column{
	padding:20px 50px;
}
.wpcf7-form-control-wrap input, .wpcf7-form-control-wrap textarea {
	margin-bottom:10px;
	width:100%;
	border:none;
	border-radius:0px;
	background-color:#bee7f3;
	padding:6px;
	font-family:'Gillsans';
	font-weight:300;
	color:#002A3F;
}

.form-title{
	font-weight:400;
	font-size:35px
}

.wpcf7-submit{
padding: 0px!important;
background: white!important;
border: none!important;
font-family: 'Proxima Nova'!important;
}

.wpcf7-submit:before{
	content:''!important
}

.wpcf7 {
	position: relative;
}

.project-number-blue div{
	color: #002A3F;
	font-family: 'Proxima Nova';
	font-weight: 400;
	font-size: 26px;
}

.project-number div{
	color: #FA8400;
	font-family: 'Proxima Nova';
	font-weight: 400;
	font-size: 26px;
}

.wpcf7-spinner{
	display:flex;
	position: absolute;
    bottom: 1px;
    right: 130px;
}

form p{
	text-align:end!important;
}


/* Hide validation & response by default */
.wpcf7-not-valid-tip,
.wpcf7-response-output {
    display: none;
}

/* Show validation ONLY after submit */
.wpcf7-form.invalid .wpcf7-not-valid-tip,
.wpcf7-form.failed .wpcf7-not-valid-tip,
.wpcf7-form.sent .wpcf7-response-output {
    display: block;
}

/* Disable submit while sending */
.wpcf7-form.submitting input[type="submit"],
.wpcf7-form.submitting button[type="submit"] {
    pointer-events: none;
    opacity: 0.6;
    cursor: not-allowed;
}

/* Highlight invalid fields after submit */
.wpcf7-form.invalid input.wpcf7-not-valid,
.wpcf7-form.invalid textarea.wpcf7-not-valid,
.wpcf7-form.invalid select.wpcf7-not-valid {
    border-color: #d63638;
}

.send-arrow{
	margin-left:10px;
	width:25px
}

.hero-banner{
	margin-top:-200px;
	padding-top:500px;
	padding-bottom:100px;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center;
	padding-left:10%;
}

.inner-name{
	color:white;
	font-size:25px;
	text-transform:uppercase;
	font-family:'Proxima Nova';
	font-weight:600;
}

.industries-header{
	color:#FFB605;
	font-size:70px;
	font-weight:400;
}


hli{
	color:#002A3F;
	background-color:#FFB605;
	margin-left:10px;
clip-path: polygon(0 0, 95% 0, 100% 100%, 5.5% 100%);
	padding-top:8px;
	padding-bottom:8px;
	padding-left:40px;
	padding-right:40px;
	display: inline-flex;
	width: fit-content;
}

pd{
	padding-left:90px;
	color:#FFB605;
}

pdw{
	padding-left:90px;
	color:white;
}

.industries-description{
	padding: 50px 0px
}

#INDUSTRIES .offerItem.active{
	width:calc(100% - 7*80px)
}

.vnd-link path{
	stroke-width:1px!important;
}

.industries-portfolio{
	padding-top:50px;
}

.services-description{
	padding: 50px 0px
}

.breadcrumbs{
	padding:20px 0px;
	border-bottom:solid 1px;
	border-bottom-color:#002A3F;
}

.breadcrumb{
	color:white;
	font-family:'Proxima Nova';
	text-transform:uppercase;
	padding:10px 20px;
	background-color:#002A3F;
	font-weight:500;
}

.breadcrumb:hover{
	color:white;
	background-color:#FFB605;
}

.current-page{
	background-color:#FFB605;
}

.breadcrumb-dot{
	height:45px;
	width:15px;
	z-index:999;
	margin: 0px -5px;
}

.inner-header-white-logo{
	margin-top:40px;
	
}

.services-banner{
	padding:40px;
	background: url('https://vndtechsolutions.com/wp-content/uploads/2023/08/banner.png');
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
}

.banner-btn{
	background-color:white!important;
}

.services-banner-title{
	font-family:'Proxima Nova';
	color:white;
	font-size:40px;
	font-weight:400;
}

.services-banner-description{
	font-family:'Proxima Nova';
	color:#002A3F;
	font-size:20px;
	font-weight:400;
}

.services-offer{
	padding:50px 0px;
}

.service-list-title{
	color:#FFB605!important;
	font-size:25px;
	font-weight:500;
	text-transform:uppercase;
}

.service-list-icon{
	width:80%;
}

.service-list-technologies{
	list-style:none;
	padding:10px 0px 0px 0px;
	text-transform:uppercase;
	font-size:20px;
	color:#002A3F;
	font-weight:300;
}

.services-offer{
	border-bottom:solid 1px;
	border-bottom-color:#FFB605;
}

.proposal{
	text-align:center;
	font-size:35px;
	font-weight:400;
}

.proposal span {
		padding:10px;
		background-color:#FFB605;
		color:#002A3F;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	line-height:50px;
}

.blue span {
		padding:3px;
		background-color:#32a4a6;
		color:white;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

.banking-banner-image{
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
}

.value-offer-title{
	text-transform:uppercase;
	color:#FFB605;
	font-size:35px;
	font-weight:400;
}

.value-offer-description{
	font-size:20px;
}

.benefit-title{
	font-size:25px;
	padding-top:10px;
	text-transform:uppercase;
	color:#002A3F;
}

.benefit-description{
	font-size:20px;
}

.subtitle{
	font-size:50px!important;
	text-transform:uppercase;
	color:#002A3F;
}

.box-title{
	font-size:23px!important;
	text-transform:uppercase;
	
}

.box-list{
	margin-left:-25px;
}


.box-list > li{
	font-size:18px;
	font-weight:300;

}

.box-list li::before{
	color:#FFB605;
}

.box-list li {
            /* Default bullets style erased */
            list-style: none;
        }
 
       .box-list li::before {
 
            /* Unicode for a bullet */
            content: "\2022";
             
            /* Styles for Indentation*/
             
            display: inline-block;
            width: 1em;
            margin-left: -1em;
        }



.white{
	color:white!important;
}

.technology-title{
	font-size:30px;
	font-weight:300;
	color:#FFB605;
}

.technology-description{
	font-size:20px;
	font-weight:300;
}

.breadcrumbs-link{
	color:white;
}

.breadcrumbs-link:hover{
	color:#FFB605;
}

.location-title{
	color:#002A3F;
	font-size:18px;
	font-weight:600;
}

.location-image{
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
}

.blue{
	color:#002A3F!important
}

.offer-title{
	font-size:50px;
	color:#FFB605;
	font-weight:400;
}

.our-story-title{
	color:#000000;
	font-size:50px;
}

.our-story-title{
	color:#000000;
	font-size:50px;
}

.our-story-subtitle{
		color:#000000;
	font-size:25px;
	font-weight:300;
}

.our-story-description{
	color:#002A3F;
	font-size:17px;
	font-weight:400;
}

.company-blockquote{
	padding:50px 30px;
	text-align:center;
	font-size:30px;
	font-weight:400;
	position:relative;
	margin-bottom:10px;
}

.company-blockquote:before{
	content:'';
    width: 44px;
    height: 30px;
    background: url(https://vndtechsolutions.com/wp-content/uploads/2023/10/tilde.svg);
    background-size: cover;
	position:absolute;
	left: 0px;
    top: 20px;
}

.company-blockquote:after{
	content:'';
    width: 44px;
    height: 30px;
    background: url(https://vndtechsolutions.com/wp-content/uploads/2023/10/tilde.svg);
    background-size: cover;
	position:absolute;
	right: 0px;
    bottom: 40px;
	transform: rotate(180deg);
}

.blockquote-name{
	text-align:center;
	color:#34A5A6;
	font-family:'Proxima Nova';
	font-weight:600;
	font-size:22px;
		
	
}

.blockquote-position{
	text-align:center;
	font-family:'Proxima Nova';
	color:#002A3F;
	font-size:18px;
}


.company-yellow-tag{
	color:#002A3F;
	padding: 10px 10px;
	background-color:#FFB605;
	margin-right:10px;
	border-radius:2px;
		
}

.company-yellow-tag{
	color:#002A3F;
	padding: 10px 10px;
	background-color:#FFB605;
	margin-right:10px;
	border-radius:2px;
		
}

.company-blue-tag{
	color:#34A5A6;
	padding: 10px 10px;
	background-color:#002A3F;
	border:solid 1px;
	border-color:#FFFFFF33;
	margin-right:10px;
	border-radius:2px;
}

.company-full-button{
	display:block;
	color:#002A3F;
	margin-top:20px;
	padding:15px;
	background-color:#FFB605;
	text-align:center;
	font-weight:500;
	letter-spacing:3px;
}

.company-full-button:hover{
background-color:white;
}

h2y{
	color:#FFB605;
	font-size:40px;
	font-weight:500;
	
}

h2b{
	color:#002A3F;
	font-size:40px;
		font-weight:500;
}

.certfication-boxes {
    display: flex;
    justify-content: stretch;
    align-items: center;
    gap: 20px;
}

.vnd-shadow-tag{
background-color: #FFB605!important;
color: #002A3F;
border: none;
border-radius: 0px;
font-weight: 500;
padding: 8px 40px;
font-size: 15px;
font-family: 'Proxima Nova';
text-transform: uppercase;
-webkit-box-shadow: 10px 10px 0px 0px #002A3F;
-moz-box-shadow: 10px 10px 0px 0px #002A3F;
box-shadow: 10px 10px 0px 0px #002A3F;
	
}

.vnd-shadow-tag:hover{
	color:#002A3F;
	cursor:default;
}

.certification-logos {
    margin: 50px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.trusted-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.partners-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.core-value-images {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 60px;
    margin-top: 50px;
}

/** SINGLE PROJECTS **/
.project-hero {
	margin-top: -102px;
}
.project-hero h1 {
	background-color: #FFB605;
	padding: 10px 65px;
	color: #002A3F;
	width: fit-content;
	clip-path: polygon(0 0, calc(100% - 50px) 0%, 100% 100%, 50px 100%);
	margin-bottom: 60px;
}
.project-hero p {
	font-size: 28px;
	color: #FFF;
	font-weight: 500;
	max-width: 85%;
}
.mockup-image.mobile-phone {
	position: relative;
	height: 450px;
}
.mobile-phone .project-image {
position: absolute;
top: 5px;
height: calc(100% - 7px);
border-radius: 40px;
transform: translateX(10px);
}

.mobile-phone .phone-image {
	position: absolute;
	top: 0;
	z-index: 2;
	height: 100%;
}
.mockup-image.laptop {
	position: relative;
	aspect-ratio: 1280 / 781;
	height: auto;
}
.laptop .project-image {
	position: absolute;
	top: 5.51%;
	left: 15.39%;
	width: 69.22%;
	height: 70.81%;
	border-radius: 0;
	object-fit: cover;
	object-position: top center;
}
.laptop .laptop-image {
	position: absolute;
	top: 0;
	z-index: 2;
	width: 100%;
}

.two-mobile-phones {
	position: relative;
	height: 588px;
}
.two-mobile-phones .phone1 {
	position: absolute;
	z-index: 1;
	height: 500px;
	width: 50%;
	top: 88px;
}
.two-mobile-phones .phone2 {
	position: absolute;
	z-index: 2;
	height: 500;
	width: 50%;
	left: 40%;
	top: 0;
}

.project-list-number{
	font-size:30px;
	font-weight:300;
}

.project-name{
	font-size:50px;
	color:black;
}

.what-we-do-title{
	color:black;
	font-size:20px;
	font-weight:300;
}

.what-we-do-services{
	color:black;
	font-weight:600;
	text-transform:uppercase;
}

.optimizing-mobile-title{
	color:black;
}

.optimizing-mobile-points > li{
	color:black;
	font-weight:200;
}

.related-industries-icons{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.project-carousel-item{
	padding:300px 0px 15px 0px!important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #002A3F;
}


.project-slider-title{
	font-size:60px!important;
	color:#FA8400!important;
	padding:10px;
	background:#002A3F;
}

.project-slider-description{
	font-size:20px!important;
	color:white!important;
}

.related-project-box{
	padding:30px;
	display: flex;
flex-direction: column;
justify-content: space-between;
}

.related-project-number{
	color:white;
	font-weight:400;
	font-family:'Proxima Nova';

}

.related-project-title{
	color:white;
	font-weight:400;
	font-family:'Proxima Nova';
	font-size:30px;
}

.related-project-service{
	color:white;
	font-weight:700;
	font-family:'Proxima Nova';
	font-size:20px;
	text-transform:uppercase;
}


.related-project-description{
	color:white;
	font-weight:300;
	font-size:17px;
}


.related-mobile-phone{
	height:400px!important;
	left: 50%;
transform: translateX(-25%);
text-align: left;
}

.related-mobile-phone > .phone-image{

}

.related-mobile-phone > .project-image{
position: absolute;
top: 1px;
height: calc(100% - 3px);
border-radius: 40px;
transform: translateX(9px);
}

.related-laptop > .project-image{
	transform: translateX(12px);
}

.mockup-image.laptop.related-laptop{
	margin-top:30%;
}

.custom-title{
	font-size:55px!important;
	margin-bottom:20px!important
}
.project-categories {
	background-color: #FFB605;
	padding: 50px 0;
}

.project-categories .nav-link {
	border-color: #002A3F;
	border-radius: 2px;
	margin: 5px 15px
}
.project-categories .nav-link  {
	margin:  5px !important;
}
.project-categories .nav-link.active {
	background-color: #002A3F !important;
	border-color: #002A3F !important;
	box-shadow: none !important;
	color: #FFB605;
}
.project-categories .nav-tabs {
	border: none;
	margin-bottom: 30px;
}
.project-categories .filter{
	border: 1px solid #002A3F;
	color: #002A3F;
	padding: 5px 10px; 
	display: inline-block;
	margin: 5px;
}
.project-categories .filter:hover,.project-categories .filter.active {
	background-color: #002A3F;
	color: #FFB605;
	cursor: pointer;
}
.projects-list .item {
	padding: 25px;
	overflow: hidden;
}
.projects-list .project-header {
	display: grid;
	grid-template-columns: 1fr 30%;
}
.projects-list .project-header .view-more a{
	color: #fff;
	font-size: 13px;
	font-weight: 600;
}
.projects-list .project-header .view-more a .vnd-link-icon{
	filter: brightness(0) invert(1);
}
.projects-list .title-project {
	color: #fff ;
	font-weight: 600;
	font-size: 22px;
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
	border-color: #002A3F;
}
.projects-lists .item .img-project {
	margin: 30px 0;
}
.projects-list .item .mockup-wrapper {
	position: relative;
	margin: 30px 0;
	align-items: end;
    display: flex;
}

.projects-list .mobile-phone .item .mockup-wrapper .img-mockup{

	max-width: 31%;
	left: 50%;
	transform: translate(-50%,0);
	position: relative;
}
.projects-list .mobile-phone  .item .mockup-wrapper .img-project {
	width: 28.7%;
	height: 95%;
	left: 36%;
	bottom: 2%;
}
#pager {
	margin: 25px 0;
	width: 100%;
	display: flex;
    align-items: center;
    justify-content: center;
}
#pager a {
	border: 1px solid #000;
	margin: 0 10px 0 0;
	padding: 5px;
	width: 30px;
	height: 30px;
	line-height: 17px;
	text-align: center;
	display: inline-block;
	color: #002A3F;
	font-weight: 700;
}
#pager a:hover {
	cursor: pointer;
}
#pager a.active {
	background-color: #002A3F !important;
	color: #FFB605;
}



.projects-list .image-phone-two .item .mockup-wrapper .img-project {
max-width: 23.8%;
    bottom: 15.6%;
    left: 46%;
	
}
.projects-list .image-phone-two .item .mockup-wrapper .img-mockup-two {
	    left: 30.3%;
    bottom: .97%;
    z-index: 2;
    max-width: 23.8%;
}
.projects-list .image-phone-two .item .mockup-wrapper .img-mockup {
max-width: 42.5%;
	transform: translate(-50%,0);
	left: 50%;
}
.projects-list .item .mockup-wrapper .img-mockup {
	z-index: 10;
	position: relative;
}
.projects-list .item .mockup-wrapper .img-project{
	position: absolute;
	z-index: 0;
	left: 16.36%;
	top: 4.72%;
	width: 66.41%;
	height: 67.19%;
	object-fit: cover;
	object-position: top center;
}

.projects-list .item .intro{
	color: #fff;
	font-size: 14px;
	
}

.actionsbtn {
    position: fixed;
    top: 50%;
    margin-top: -64px;
    width: 64px;
    height: 64px;
    right: 0;
    background-color: #e6e7e8;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    overflow: hidden;
    z-index: 1000;
}

.analysisTool {
    width: 64px;
    height: 64px;
    float: left;
    background-image: url(https://vndtechsolutions.com/wp-content/uploads/2023/10/analysis.png);
    text-indent: -9999px;
    background-color: #e2682d;
    background-position: center;
    background-repeat: no-repeat;
    border: none;
}

.offer-tabs{
	margin-top:-10px
}

.background-image{
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
	}
	.startups-image{
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
	}

#wpcf7-f3901-o1 .wpcf7-submit{
	background-color:#00000000!important
}

.actionsbtn{
	display:none!important
}

.startup-icon:hover > circle{
	fill: rgb(0, 42, 63);
}

.startup-icon:hover > rect{
	fill: white;
}

.btn.btn-primary.vnd-btn.banner-btn:focus {
color: #002A3F;
}

.offer-box{
	display:flex;
	flex-direction: column;
    justify-content: space-between;
}

.wpcf7-submit{
	transition: all 0.2s ease;
}

.wpcf7-submit:hover{
	padding-top:12px!important;
	padding-right:12px!important;

}

.form-column{
	padding-bottom:60px
}

.database-header > p > hli{
	clip-path: polygon(0 0, 98% 0, 100% 100%, 2.5% 100%)!important;
}

.managed-it-hli > p > hli{
	margin-left:-30px;
}

.panel-footer{
	display:flex;
	justify-content:center;
}

.mobile-swiper{
		display:none;
	}
.news{
		display:block;
	}

.free-site-banner{
	padding-top:350px!important;
}

#wpcf7-f3901-o1{
	padding: 30px;
border-radius: 10px;
background-color: RGBA(255,182,5);
}

 .modal-menu {
                background-color: #002A3F; 
                height: 100vh;
            }

            
            .primario{
                font-size: 3.5rem;
                color: white;
                 font-weight: 600;
                text-decoration: none;
                background-color: transparent;
                margin-top: 25px;    
            }

            .modal-menu ul{
                text-align: center;
            }

            .modal-menu a{
                text-decoration: none;
                color: white;
            }

            .modal-menu ul{
                list-style-type: none;
							font-weight:400;
            }

            .menu div{
                height: 95%;
                max-height: 95%;
            }

            .modal-menu li{
                display: block;
                width: 100%;
            }

            .modal-menu li a:hover{
                color: #FFB605;
            }

            #secundario ul li a:hover{
                color: #FFB605;
            }

            .secundario{
                height: 100%;
                font-size: 1.7rem;
                color: rgba(0, 0, 0, 0.25);   
            }

            .custom-logo {
                filter: brightness(0) invert(1);
                height: 34px;
                width: 98px;
                max-height: 34px;
                max-width: 98px;
            }

            .mano:hover{
                cursor: pointer;
            }

            .vnd-btn{
                background-color:#FFB605!important;
                color:#002A3F;
                border:none;
                border-radius:0px;
                font-weight:700;
                padding: 10px 20px 10px 30px;
                font-size:18px;
                font-family:'Proxima Nova';
                text-transform:uppercase;
            -webkit-box-shadow: 10px 10px 0px 0px #002A3F;
                -moz-box-shadow: 10px 10px 0px 0px #002A3F;
                box-shadow: 10px 10px 0px 0px #002A3F;
            }

            .vnd-btn:hover{
                    background-color:#002A3F!important;
                color:#FFB605;
            -webkit-box-shadow:none;
                -moz-box-shadow:none;
                box-shadow: none;
                    
            }

            .vnd-btn:hover .cls-1{
                stroke:#FFB605;
            }

            .vnd-btn-icon svg{
                width:14px;
                margin: 17px 0px 0px 20px
            }

            

            .vertical-menu {
                list-style: none;
                padding: 0;
            }

            /* Animación de entrada para los submenús */
            .menu2 {
                display: none;
                animation: fadeIn 0.3s ease-in forwards;
                
            }

            .menu2 {
                display: none;
                opacity: 0; /* Comienza con opacidad 0 */
                transition: opacity 0.3s ease-in-out; /* Aplica una transición suave */
            }

            @keyframes fadeIn {
                0% {
                    opacity: 0;
                    transform: translateY(-20px);
                }
                100% {
                    opacity: 1;
                    transform: translateY(0);
                }
            }

            /* Animación de salida para los submenús */
            .menu2.fade-out {
                animation: fadeOut 0.5s ease-out forwards;
            }

            @keyframes fadeOut {
                0% {
                    opacity: 1;
                    transform: translateY(0);
                }
                100% {
                    opacity: 0;
                    transform: translateY(-20px);
                }
            }

            /* Animación de entrada para el menú principal */
            .menu-entry {
                animation: fadeIn 0.5s ease-in forwards;
            }

            @keyframes fadeIn {
                0% {
                    opacity: 0;
                    transform: translateY(-20px);
                }
                100% {
                    opacity: 1;
                    transform: translateY(0);
                }
            }

            .menu{
                margin-top: 20px;
                margin-bottom: 20px;
            }

           

            .modal-menu{
                margin:15px;
            }

            .social-list {
                display: flex;
                list-style: none;
                padding: 0;
                margin: 0;
            }

            .social-list li {
                margin-right: 10px; /* Añade margen entre los elementos */
            }

            .social-list img {
                width: 30px; /* Ajusta el ancho de las imágenes a tu preferencia */
                height: 30px; /* Ajusta la altura de las imágenes a tu preferencia */
						max-width:130%
            }

            /* Opcional: Alinea los elementos verticalmente en el centro */
            .social-list a {
                display: flex;
                align-items: center;
            }
            .modal-menu{
                 overflow: hidden;
            }
 body.modal-open {
    overflow: hidden;
    position: fixed;
    width: 100%;
  }

.close-menu-button{
	cursor:pointer;
}

.mobile-toggle-button{
	display:none;
}

.social-list-mobile{
	display:none;
}
.close-button-mobile{
	display:none;
}

.industries-verticals-url > img:hover{
	background-color:#34A5A6;
}

.collapsing{
	transition:none!important;
}

#accordionExample{
	margin-top:30px;
}

.accordion-header{
	
}

.accordion-header > .accordion-button{
	
}

.accordion-item{
	background-color:#002A3F;
	border:none;
}

.accordion-button{
	background-color:#002A3F;
	color:white;
	font-family:'Proxima Nova';
	font-size:25px;
	
}

.accordion-button:not(.collapsed) {
    color: white;
    background-color: #002A3F;
    box-shadow: inset 0 0 0 rgba(0,0,0,0);
}

.accordion-button:not(.collapsed)::after {
    background-image: url(https://vndtechsolutions.com/wp-content/uploads/2023/11/arrow-down-2.svg);
}

.accordion-button::after {
    background-image: url(https://vndtechsolutions.com/wp-content/uploads/2023/11/arrow-down-2.svg);
}

.drop-menu-mobile-item{
	text-align:start;
	color:white;
	font-size:23px;
}

.drop-menu-mobile-item:hover{
	color:#FFB605;
}

#accordionExample{
	display:none;
}

.quote-carousel{
	padding-top:280px!important;
	padding-bottom:20px!important;
}

.wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required{
	margin-bottom: 10px;
    width: 100%;
    border: none;
    border-radius: 0px;
    background-color: #BEE7F3;
    padding: 7.5px;
    font-family: 'Gillsans';
    font-weight: 300;
    color: #002A3F;
}

.first_dropdown_level[aria-labelledby="menu-item-dropdown-2664"]{
		margin-top:-2px!important;
	border-top:solid 2px orange!important;
}

.first_dropdown_level[aria-labelledby="menu-item-dropdown-2662"]{
		margin-top:-2px!important;
	border-top:solid 2px orange!important;
}


.first_dropdown_level[aria-labelledby="menu-item-dropdown-2663"]{
		margin-top:-2px!important;
	border-top:solid 2px orange!important;
}

.first_dropdown_level[aria-labelledby="menu-item-dropdown-2665"]{
		margin-top:-2px!important;
	border-top:solid 2px orange!important;
}

.first_dropdown_level[aria-labelledby="menu-item-dropdown-3533"]{
		margin-top:-2px!important;
	border-top:solid 2px orange!important;
}

.first_dropdown_level[aria-labelledby="menu-item-dropdown-3534"]{
		margin-top:-2px!important;
	border-top:solid 2px orange!important;
}

.first_dropdown_level[aria-labelledby="menu-item-dropdown-3535"]{
		margin-top:-2px!important;
	border-top:solid 2px orange!important;
}

.first_dropdown_level[aria-labelledby="menu-item-dropdown-4582"]{
		margin-top:-2px!important;
	border-top:solid 2px orange!important;
}



.portfolio{
	padding-bottom:0px!important
}

.single-block{
	min-height:300px;
	padding:20px 30px;
}

.block-tag{
	color:white;
	font-weight:400;
	font-size:20px;
	margin-bottom:20px;
	font-family:'Proxima Nova'
}

.block-title{
	color:white;
	font-size:30px;
	font-weight:600;
	margin-bottom:20px;
}

.block-description{
	color:white;
}

.block-container{
    overflow: hidden;
    position: relative;
}

.block-holder {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: all 1s;
}

.block-holder:hover {
    transform: scale(1.05);
}

#see-more{
	width: 200px;
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto!important;
}

.mega-menu-section-image{
    height:150px;
    display:flex;
    align-items:center;
    justify-content:center;
    background-repeat:no-repeat;
    background-size:cover!important;
    background-position:center center!important;
    background-color:rgba(0, 0, 0, 0.2)!important;
    background-blend-mode: multiply;
	margin-bottom:20px;
}
.mega-menu-section-title{
    padding:10px;
    color:#002A3F;
    background-color:#FFB605;
	font-size:20px!important;
}

.technology-list img{
	width:150px!important
}


.technologies-row{
	padding:50px 0px;
	border-bottom: solid 1px!important;
}

.technologies-row > .offer-box:first-child{
border-right: solid 0.5px!important;
}

.technologies-row > .offer-box:last-child{
border-right: solid 0.5px!important;
}

.our-story-image-col > img{
	height:500px!important;
}

.project-badges{
	color:white!important
}

.mockup-image.laptop.related-laptop {
	margin-top: 15%!important;
}


/*MEDIA QUERYS */

@media (max-width: 1200px){
	.managed-it-hli > p > hli{
	margin-left:0px;
}
	
		.project-open-close-icon > img{
		padding:0px!important;
	}
		#INDUSTRIES .offerItem.active {
width: calc(100% - 4.4*80px);
}
}

/*TABLET*/
@media (max-width: 992px){
	h1{
		font-size:4em;
	}
	.home-hero-carousel-caption ho{
		display:none;
	}
	.home-hero-carousel-caption{
		padding:0px
	}
		.carousel-item{
		padding:400px 35px 100px 35px
	}
	.hero-description{
		padding:0px;
	}
	.about-description{
		padding:0px;
	}
		.about-home-link{
		margin-top:30px;
	}
	.offer-content{
		padding:30px;
	}
	.service-category{
		margin-bottom:20px;
		font-size:7px;
	}
	.service-title{
		font-size:30px!important;
	}
	.service-description{
		padding-right:0px;
	}
	#INDUSTRIES .offerItem.active {
width: calc(100% - 3.07*80px);
}
.hero-banner.industries-inner{
		padding: 400px 50px 200px 50px;
	}
	pd{
		padding-left:0px;
	}
	.industries-header{
		font-size:50px;
	}
		.offer-title{
		font-size:30px;
	}
	.offer-description,.managed-hosting-description,.dedicating-hosting-description,.colocation-description,.shared-hosting-description{
		font-size:16px!important;
	}
	

	
	.benefit-description{
		font-size:15px;
	}
		.box-title{
		font-size:25px!important;
	}
	.little-title{
		font-size:17px!important;
	}
.value-offer{
		padding:0px 0px!important;
	}
		.related-laptop > .laptop-image{
		height:auto;
	}
	.related-mobile-phone{
		margin-left:-10%
	}
	.hero-banner{
		padding-left:2%;
	}
	.background-image{
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
		height:400px;
	}
	.startups-image{
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
			height:400px;
	}
}

.little-title.box-title{
	font-size:18px!important;
	margin-bottom:40px;
}

.home-hero-alt h1 span {
padding: 0px 50px 10px 50px!important;
}


/*MOBILE*/

@media (max-width: 768px){
		h1{
		font-size:35px;
	}
	.home-hero-carousel-caption{
		padding:0px;
	}
		.carousel-item{
		padding:400px 35px 100px 35px
	}
	.vnd-btn {
		padding:8px;
		font-size:14px;
	}
	.vnd-btn-icon svg{
		margin:3px 0px 0px 4px;
		width:13px;
	}
	
	.about-icon{
		justify-content:center;
		padding-bottom:50px;
	}
	.about-icon > img{
		max-width: 40%;
	}
	.offerItem{
		padding:0px;
	}
	.offer-tabs{
	margin-top:0px
}
	
	.offer-content{
		padding:20px;
	}
	.service-category{
		margin-bottom:20px;
		font-size:15px;
	}
	.service-title{
		font-size:25px!important;
	}
	.service-description{
		padding-right:0px;
	}
	.tab-accordion{
		height:400px
	}
	.home-portfolio > .container{
		max-width:100%!important
	}
	.project-info{
		width:67.33%!important
	}
	.project-number > h5{
		font-size:20px!important
	}
	.project-title{
		font-size:35px!important
	}

	.project-tab{
		max-height:60px;
	}
	.active-project{
		max-height:400px;
	}
	.project-number{
		width:10.33%!important;
	}
	.project-open-close-icon{
		width:14.33%!important;
	}
	.project-tab .project-images-col {
display: none!important;
}
		.active-project .project-title {
		font-size:25px!important
	}
	.active-project .project-description {
		font-size:13px!important
	}
	.active-project .project-info 	{
		width:70.33%!important
	}
	.active-project .project-link 	{
		padding-bottom:0px;
		padding-top:20px;
		width:100%
	}
	.news-title{
		font-size:17px;
	}
	.swiper-slide{
		height:390px;
	}
	.news-link-row {
    padding-left: 0%;
}
	.about-description{
		padding-right:0%!important;
	}
	.contact-title{
		font-size:35px;
		
	}
	footer > .row{
		text-align:center;
	}
	.contact-footer-col{
		padding-left:0px;
	}
	.social-list{
		justify-content:center;
	}
			#INDUSTRIES .offerItem.active {
width: calc(100% - 0*80px);
}
	.project-number-blue{
		width:15%!important
	}
	.industries-portfolio  .project-tab{
		padding:10px 28px!important;
	}
	.inner-name{
		font-size:15px;
		
	}
	.industries-header{
		font-size:30px;
	}
	hli{
		margin-left:-5px;
		font-size:30px!important;
	}
	.hero-banner.industries-inner{
		padding: 400px 50px 50px 50px;
	}
	.services-banner-title{
		font-size:25px;
	}
	.services-banner-description{
		font-size:17px;
	}
	.service-list-title{
		font-size:17px;
	}
	.service-list-technology-item{
		font-size:15px;
	}
	.proposal{
		font-size:17px;
	}
	.principal-description{
		font-size:21px!important;
	}
	.offer-title{
		font-size:20px;
	}
	.offer-image{
		text-align:center;
	}
	.offer-image > img{
		width:30%;
	}
	.offer-box{
		padding:10px 10px 40px 10px!important;
	}
	.button-col{
		text-align:initial;
		display:flex;
	}
	.carousel-caption{
		padding-left:0px;
	}
	.contact-content-1{
		font-size:25px!important;
	}
	.contact-content-2{
		font-size:20px!important;
	}
	pdw{
		padding-left:0px;
	}
	.value-offer-title{
		font-size:25px;
		padding-top:20px;
	}
	.value-offer-description{
		font-size:16px;
	}
		.news-card{
		padding:0px 0px!important;
	}
	.button-div{
		text-align:initial!important;
	}
	.benefit-title{
		font-size:20px;
	}
	.benefit-description{
		font-size:15px;
	}
	.technology-description{
		font-size:16px;
	}
	.technology{
		padding-right:10px!important;
		padding-left:10px!important;
	}
	.technologies-columns img{
		width:40%;
		padding-bottom:20px;
		
	}
		.technologies-columns .col-md-3{
		text-align:center;
	}
	.box-title{
		font-size:24px!important;
	}
	.little-title{
		font-size:16px!important;
	}
	.technology-title{
		font-size:20px;
	}
	
	.col-image{
		text-align:center;
	}
	.custom-title{
		font-size:30px!important;
	}
	.custom-title-description{
		font-size:20px!important;
	}
	.project-hero{
		padding: 180px 0px 50px 0px!important;
	}
	.project-name{
		font-size:25px;
	}
	.project-list-number{
		font-size:20px;
	}
	.col-image img{
		padding-bottom:30px;
	}
	.related-industries-icons a{
		text-align:center;
	}
	.project-carousel-item{
		padding:200px 10px 10px 10px!important
	}
	.project-slider-title{
		font-size:20px!important;
	}
	.project-slider-description{
		font-size:15px!important;
	}
	.related-project-title{
		font-size:20px;
	}
	.related-project-service{
		font-size:18px;
	}
	.related-laptop > .laptop-image{
		height:auto;
	}
	.related-mobile-phone{
		margin-left:-10%
	}
	.industries-first-text{
		font-size:20px!important;
	}
	.capabilities-title{
		font-size:25px!important;
	}
	.subtitle{
		font-size:28px!important;
	}
	.training-first-text{
		font-size:22px!important;
	}
	.row.project-tab{
		padding:10px 10px!important;
	}
	.our-story-title{
		font-size:30px;
	}
	.our-story-image-col{
		justify-content:center!important;
	}
	.company-blockquote p{
		font-size:23px;
	}
		.background-image{
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
		height:300px;
	}
	.startups-image{
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
			height:300px;
	}
	.certfication-boxes{
		flex-wrap:wrap!important;
	}
	.vnd-shadow-tag{
		margin-left:0px!important;
	}
		.technology{
		padding-right:0px!important;
		padding-left:0px!important
	}
	.technology-list img{
		width:150px!important
	}
	.technology-list{
		padding-left:10px!important;
		padding-right:10px!important;
	}
	.footer-header{
		font-size:20px;
	}
	.footer-menu > li{
		font-size:17px!important;
	}
	.footer-text{
		font-size:17px!important;
	}
		.mobile-swiper{
		display:block;
	}
	/**.news{
		display:none!important;
	}*/
	.escribiendo{
		margin-left:-25px;
	}
	
	.mockup-image.laptop.related-laptop{
	margin-bottom:-80px;
}
	.technology{
		padding-left:20px!important;
		padding-right:20px!important;
	}
	.slide-content{
		padding:0px 20px!important;
	}
	#menu-1{
		display:none!important
	}
	#menu-2{
		display:none!important
	}
	#menu-3{
		display:none!important
	}
	#menu-4{
		display:none!important
	}
	#menu-5{
		display:none!important
	}
	#menu-6{
		display:none!important
	}
	.mobile-toggle-button{
	display:block;
}
	.social-list-desktop{
		display:none;
	}
	.social-list-mobile{
		display:flex;
	}
	.menu div {
    height: min-content;
}
	.text-right{
		display:none;
	}
	.primario {
    font-size: 2.5rem;
}
	.close-button-mobile{
	display:block;
}
	.menu2{
		padding-left:0px!important
	}
	.mobile-col{
		display:flex;
		justify-content:space-between;
	}
	.home-hero-alt h1 {
min-height: 205px;
}
	.menu2{
		display:none!important;
	}
	#accordionExample{
	display:block;
}
	.modal-menu{
		overflow:scroll!important;
	}
	
	.navbar > .container-fluid{
		flex-direction:row-reverse!important
	}
	
				.technologies-row{
	border-bottom: 0px!important;
			padding:0px;
}
	.offer-box{
    border-bottom: solid;
	}
	
	
.our-story-image-col > img{
	height:auto!important;
}

.principal-card {
    color: #FFF;
    /*padding-top: 20px !important;
    margin-left: 20px !important;*/
    position: relative;
}

.back-card {
	opacity: 1 !important;
	/*margin-left: -30px;
	margin-right: 60px;*/
}

.card-go-new {
	color: #fff;
	opacity: 1 !important;
	position: relative;
	top: -17% !important;
	left: 77% !important;
}
}

@media (min-width: 992px){
	.line-height-9-d{
		min-height: 67.1px;
    padding-top: 25px;
	}
	
	.line-height-14-d{
		min-height: 67.1px;
    padding-top: 25px;
	}
}

@media (min-width: 768px) and (max-width: 991px){

	.line-height-6-d,  .line-height-7-d, .line-height-12-d, .line-height-13-d, .line-height-15-d{
		min-height: 67.3px;
    padding-top: 25px;
	}
	
		.line-height-9-d, .line-height-14-d{
		min-height: 90.15px;
    padding-top: 35px;
	}
	
			.technologies-row{
	border-bottom: 0px!important;
			padding:0px;
}
	.offer-box{
		padding: 45px 100px!important;
    border-bottom: solid;
	}
	.back-card {
		opacity: 1 !important;
		margin-left: -40px;
		margin-right: 45px;
	}
	
	.card-go-new {
		color: #fff;
		opacity: 1 !important;
		position: relative;
		top: -15% !important;
		left: 60% !important;
	}
}


@media only screen and (min-width: 768px) and (max-width: 850px) {
	.navbar > .container-fluid{
		flex-direction:row-reverse!important;
	}
	.navbar .nav {
    justify-content:right!important;
		flex-direction:row-reverse!important
}
}

.project-images-col{
	align-items:center;
}
.project-images{
	height:170px!important
}

.vertical-menu li {
    font-size: 16px;
}

.footer-text{
		font-size:16px
	}

.callNow {
    position: fixed;
    top: 50%;
    margin-top: -100px;
    right: 0;
    z-index: 9999;
    background-color: #e2682d;
    color: #fff;
    padding: 10px 0px;
    border-radius: 10px 0 0 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    text-transform: uppercase;
    width: 74px;
    flex-direction: column;
    text-align: center;
    line-height: 12px;
}

.scheduleNow {
    position: fixed;
    top: 50%;
    margin-top: -20px;
    right: 0;
    z-index: 9999;
    background-color: #e2682d;
    color: #fff;
    padding: 10px 0px;
    border-radius: 10px 0 0 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    text-transform: uppercase;
    width: 74px;
    flex-direction: column;
    text-align: center;
    line-height: 12px;
}

swiper-container {
	width: 100%;
	height: 100%;
  }

  swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
  }

  swiper-slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
  }

  swiper-container {
	margin-left: auto;
	margin-right: auto;
  }

  .sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	border: 0;
  }

  a.card-vnd {
	position:relative;
	overflow:hidden;
	background:#191970;
  }

  a.card-vnd > img{
	position: absolute;
    top: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
	transition: 0.5s ease;
  }


  .card-category-vnd {
	color:#fff;
	font-size: 14px;
    font-weight: 500;
	line-height:1.2;
	text-transform:uppercase;
  }

  .principal-card {
	color:#FFF;
	/*padding-top: calc(1.75rem + 1.9485vw - 28.07794px);
	margin-left: calc(1.5rem + 1.67015vw - 24.06681px);*/
	padding:30px 20px;
	position: relative;
  }

  .card-title-vnd {
	color: #fff;
	/*margin-right: calc(1.5rem + 1.67015vw - 24.06681px);*/
	font-size: 20px;
    font-weight: 500;
	line-height:1.2;
  }

  .back-card {
	opacity: 0;
    -webkit-transform: translateX(45px);
    transform: translateX(45px);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
	padding:0px 20px;
  }

  /*.back-card-content {
	/*margin-right: calc(1.5rem + 1.67015vw - 24.06681px);
	margin-left: calc(1.5rem + 1.67015vw - 24.06681px);
	margin-top: calc(1.5rem + 1.67015vw - 24.06681px);
  }*/

  .back-card-description {
	color: #fff;
    font-weight: 400;
    letter-spacing: -0.005em;
    line-height: 1.5;
  }

  .card-go-new {
	color: #fff;
	opacity: 0;
    -webkit-transform: translateY(45px);
    transform: translateY(45px);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
	position: relative;
    top: -8%;
    left: 64%;
  }

  a.card-vnd:hover{
	transform: scale(1.06);
  }

  a.card-vnd:hover > .back-card{
	opacity: 1;
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
  }

  a.card-vnd:hover > .card-go-new{
	opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
  }

  a.card-vnd:hover > img{
	-ms-transform: scale(1.02);
    -moz-transform: scale(1.02);
    -webkit-transform: scale(1.02);
    -o-transform: scale(1.02);
	transform: scale(3);
  	background-blend-mode: overlay;
  	filter: blur(6px);
  	transform-origin: center center;
  	opacity: 0.4;
  }
  
.cf7-loading {
    opacity: 0.7;
    cursor: not-allowed;
    position: relative;
}

.cf7-loading::after {
    content: "";
    width: 16px;
    height: 16px;
    border: 2px solid #fff;
    border-top: 2px solid transparent;
    border-radius: 50%;
    display: inline-block;
    margin-left: 10px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    100% { transform: rotate(360deg); }
}

.btn-portfolio {
	display: inline-block;
    background-color: #FFB605;
    width: fit-content;
    align-items: end;
    padding: 0.25rem 1rem !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    line-height: 1.5;
    border-radius: unset;
    color: #002A3F;
}

.btn-portfolio:hover {
	background-color: #002A3F;
	color: #FFB605;
}

.industries-header h1 > span {
	font-size: 40px;
    line-height: 0.7 !important;
}
/* Portfolio grid phone mockups: position the screen image exactly inside the phone frame's screen opening
   (measured from SmartphoneMockup-3.png and SmartphoneMockup2-1.png), with rounded screen corners, so the
   screenshot no longer sticks out below or beside the frame. Percentages are relative to .mockup-wrapper.
   Sep 28 correction: the single-phone screen box was centered on the frame's outer edges rather than its
   actual transparent screen cutout (measured directly from the PNG's alpha channel: cutout spans x 40-627
   of 670px width, 36-1307 of 1342px height), which left a visibly wider gap on the right than the left.
   left/width recalculated from that measurement so the gap is even on both sides. */
.projects-list .mobile-phone .item .mockup-wrapper .img-project {
	left: 36.4%;
	width: 27.2%;
	top: 2.7%;
	bottom: auto;
	height: 94.7%;
	border-radius: 10.7% / 4.9%;
	object-fit: cover;
	object-position: top center;
}
.projects-list .image-phone-two .item .mockup-wrapper .img-project {
	left: 46.6%;
	width: 22.7%;
	max-width: none;
	top: 2.3%;
	bottom: auto;
	height: 80.4%;
	border-radius: 10.7% / 4.9%;
	object-fit: cover;
	object-position: top center;
}
.projects-list .image-phone-two .item .mockup-wrapper .img-mockup-two {
	left: 30.3%;
	width: 23.1%;
	max-width: none;
	top: 17%;
	bottom: auto;
	height: 80.5%;
	border-radius: 10.7% / 4.9%;
	z-index: 2;
}

/* Login nav button — outline only, transparent fill, matches the nav's own
   font weight/case (600, uppercase) so it reads as one typeface with the
   rest of the menu instead of a mismatched button font. Square corners,
   same as the rest of the site's buttons (e.g. Learn More). White by
   default, turns to the brand gold accent on hover.
   Selector needs to be at least as specific as the existing
   ".navbar ul#menu-main-nav>li>a" rule (which carries an ID) or that rule's
   own padding/line-height wins the !important tie by specificity, not
   source order — repeating the #menu-main-nav ID here is what makes this
   win instead. The <li> itself gets flex centering because the button's
   own box is shorter than a plain nav link's (border + tighter line-height),
   so without it the button sits flush at the top of its slot instead of
   centered like the other items' text. */
.navbar ul#menu-main-nav > li.vnd-login-nav-btn {
	display: flex !important;
	align-items: center !important;
}
.navbar ul#menu-main-nav > li.vnd-login-nav-btn > a {
	background: transparent !important;
	color: #fff !important;
	border: 1px solid #fff !important;
	border-radius: 0 !important;
	padding: 6px 16px !important;
	line-height: 1.2 !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	transition: color .15s ease, border-color .15s ease;
}
.navbar ul#menu-main-nav > li.vnd-login-nav-btn > a:hover {
	background: transparent !important;
	color: #FFB605 !important;
	border-color: #FFB605 !important;
}

/* Login button in the hamburger overlay menu (header.php, next to Get a
   Quote) — same outline treatment as the desktop nav Login button, sized to
   sit comfortably beside the solid .vnd-btn Get a Quote button. */
.vnd-login-modal-btn {
	display: inline-block;
	background: transparent !important;
	color: #fff !important;
	border: 1px solid #fff !important;
	border-radius: 0 !important;
	padding: 10px 20px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	font-size: 1rem;
	line-height: 1.2;
	transition: color .15s ease, border-color .15s ease;
}
.vnd-login-modal-btn:hover {
	color: #FFB605 !important;
	border-color: #FFB605 !important;
}

/* At desktop widths the 4 hamburger-menu columns (col-sm-2/4/3/3) sit side
   by side, stretched to equal height by the tall nav-item column. By design
   the social icons and the Login/Get a Quote/phone-number group sit pinned
   to the very BOTTOM of their own short columns, not trailing right under
   the logo/close button. A flex "margin-top:auto" push was tried here first,
   but it depends on the column's flex-stretch height resolving correctly,
   which wasn't reliable across window sizes - these groups ended up
   somewhere in the middle instead of flush against the bottom. Explicit
   height + position:absolute is unambiguous: each column is exactly the
   row's own height, and the group is pinned to its bottom edge regardless
   of how tall the column's other content is. overflow-y:auto on the row
   (see header.php) still covers any window too short for this to fit. */
@media (min-width: 769px) {
	#modalMenu .row.menu > .order-sm-1,
	#modalMenu .row.menu > .order-sm-4 {
		position: relative;
		height: 100%;
	}
	/* top:auto is explicit (not just the default) because some other rule
	   was setting a stray top offset on these, which combined with bottom:0
	   to stretch the element's height across most of the column instead of
	   letting it shrink to its own content and sit flush at the bottom. */
	#modalMenu .row.menu > .order-sm-1 .social-list-desktop {
		position: absolute;
		left: 0;
		bottom: 0;
		top: auto !important;
		height: auto !important;
	}
	#modalMenu .row.menu > .order-sm-4 .vnd-modal-bottom-group {
		position: absolute;
		top: auto !important;
		height: auto !important;
		right: 27px;
		bottom: 0;
	}
}

/* The hamburger overlay has two parallel button rows for Login/Get a Quote:
   one in the mobile accordion column (.mobile-menu-buttons), one in the
   desktop/tablet phone-numbers column. Now that the modal scrolls instead of
   clipping, both would otherwise be reachable at once and show duplicate
   buttons - so each row only shows in its own breakpoint. */
@media (min-width: 769px) {
	.mobile-menu-buttons {
		display: none !important;
	}
}
@media (max-width: 768px) {
	.vnd-desktop-menu-buttons {
		display: none !important;
	}
}

/* Google's reCAPTCHA badge (fixed bottom-right/left) was still wide enough to
   overlap the Tawk.to and UserWay widgets no matter which corner it sat in.
   Google's terms allow hiding it outright as long as the required
   attribution text is shown near any form it protects - that text is added
   automatically under every CF7 form via functions.php, so it's safe to
   hide the floating badge entirely here. */
.grecaptcha-badge {
	visibility: hidden !important;
}
.vnd-recaptcha-notice {
	font-size: 11.5px;
	color: #8b93a1;
	margin-top: 8px;
}
.vnd-recaptcha-notice a {
	color: inherit;
	text-decoration: underline;
}