/* GLOBAL STYLES
-------------------------------------------------- */

/* Font Mont  */
/* @font-face {
	font-family: 'Montserrat';
	font-weight: 400;
	src: url('../css/font/Inter/Inter-Regular.woff') format('woff');
  } */
  
  /* @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	src: url('../css/font/Inter/Inter-Italic.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-weight: 100;
	src: url('../css/font/Inter/Inter-Thin-BETA.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	font-weight: 100;
	src: url('../css/font/Inter/Inter-ThinItalic-BETA.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-weight: 200;
	src: url('../css/font/Inter/Inter-ExtraLight-BETA.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	font-weight: 200;
	src: url('../css/font/Inter/Inter-ExtraLightItalic-BETA.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-weight: 300;
	src: url('../css/font/Inter/Inter-Light-BETA.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	font-weight: 300;
	src: url('../css/font/Inter/Inter-LightItalic-BETA.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-weight: 500;
	src: url('../css/font/Inter/Inter-Medium.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	font-weight: 500;
	src: url('../css/font/Inter/Inter-MediumItalic.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-weight: 600;
	src: url('../css/font/Inter/Inter-SemiBold.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	font-weight: 600;
	src: url('../css/font/Inter/Inter-SemiBoldItalic.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-weight: 700;
	src: url('../css/font/Inter/Inter-Bold.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	font-weight: 700;
	src: url('../css/font/Inter/Inter-BoldItalic.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-weight: 800;
	src: url('../css/font/Inter/Inter-ExtraBold.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	font-weight: 800;
	src: url('../css/font/Inter/Inter-ExtraBoldItalic.woff') format('woff');
  } */
  
  @font-face {
	font-family: 'Mont';
	font-style: normal;
	font-weight: 900;
	src: url('../../vendor/mont/Mont-Heavy.woff') format('woff');
  }

  @font-face {
	font-family: 'Montserrat';
	src: url('../../vendor/montserrat/Montserrat-ExtraBold.woff') format('woff');
	font-weight: 900;
	font-style: normal;
  }
  
  /* @font-face {
	font-family: 'Montserrat';
	font-style: italic;
	font-weight: 900;
	src: url('../css/font/Inter/Inter-BlackItalic.woff') format('woff');
  } */
  
  /* @font-face {
	font-family: 'Neutrif Pro';
	font-weight: 100;
	src: url('../../vendor/neutrifpro/NeutrifPro-Regular.woff') format('woff');
  } */
  
  /* @font-face {
	font-family: 'Neutrif Pro';
	font-style: italic;
	font-weight: 100;
	src: url('../../vendor/neutrifpro/NeutrifPro-Regular.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Neutrif Pro';
	font-weight: 200;
	src: url('../../vendor/neutrifpro/NeutrifPro-Regular.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Neutrif Pro';
	font-style: italic;
	font-weight: 200;
	src: url('../../vendor/neutrifpro/NeutrifPro-Regular.woff') format('woff');
  } */
  
  /* @font-face {
	font-family: 'Neutrif Pro';
	font-weight: 800;
	src: url('../../vendor/neutrifpro/NeutrifPro-Regular.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Neutrif Pro';
	font-style: italic;
	font-weight: 800;
	src: url('../../vendor/neutrifpro/NeutrifPro-Regular.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Neutrif Pro';
	font-style: normal;
	font-weight: 900;
	src: url('../../vendor/neutrifpro/NeutrifPro-Regular.woff') format('woff');
  }
  
  @font-face {
	font-family: 'Neutrif Pro';
	font-style: italic;
	font-weight: 900;
	src: url('../../vendor/neutrifpro/NeutrifPro-Regular.woff') format('woff');
  } */

  

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

/* Background Color  */
.bg-transparent {
	background: transparent;
}

.bg-tiger {
	background-color: #EF5431;
}

.bg-white {
	background-color: white;
}

.bg-gray {
	background-color: #A89D9F;
}

.bg-gray-2 {
	background-color: #8E8B8C;
}

.bg-gray-3 {
	background-color: #DEDEDE;
}

.bg-doff {
	background-color: #231F20;
}

.bg-blood {
	background-color:  #DA5C5C;
}

.bg-raspberry {
	background-color:  #FCE6EE;
}

.bg-raspberry-2 {
	background-color:  #E20055;
}

.bg-sunglow {
	background-color:  #FFFBEC;
}

.bg-sunglow-2 {
	background-color:  #CCA832;
}

.bg-neutral {
	background-color:  #F8F7F7;
}

.bg-torque {
	background-color:  #E9F6F6;
}

.bg-torque-2 {
	background-color:  #25A8A0;
}

.bg-tango {
	background-color:  #6FCACF;
}

.bg-tango-2 {
	background-color:  #F1FAFA;
}

/* Border Radius */
.border-radius-4 {
	border-radius: 4px;
}

.border-radius-8 {
	border-radius: 8px;
}

.border-radius-12 {
	border-radius: 12px;
}

.border-radius-16 {
	border-radius: 16px;
}

.border-radius-24 {
	border-radius: 24px;
}

/*--------------------------------------------------------------
# Button
--------------------------------------------------------------*/

.dhn-for-brand-title-button {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 900;
	font-size: 14px;
	line-height: 18px;
}

.btn.dhn-for-brand-title-button {
	border-radius: 16px;
	padding: 13px 24px;
	gap: 10px;
}

/*--------------------------------------------------------------
# Modal
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# CONTENT FEATURED
--------------------------------------------------------------*/

/*
---------------------------------------------
Text Style / Color
--------------------------------------------- 
*/

.text-color-gray {
	color: #787681!important;
}

.text-color-gray-2 {
	color: #777777!important;
}

.text-color-gray-3 {
	color: #8E8B8C!important;
}

.text-color-light-gray {
	color: #CDC5C7!important;
}

.text-color-white {
	color: white!important;
}

.text-color-tiger {
	color: #EF5431!important;
}

.text-color-raspberry {
	color: #E20055!important;
}

.text-color-doff {
	color: #231F20!important;
}

.text-color-neutral {
	color: #747172!important;
}

.text-color-neutral-2 {
	color: #D7D6D6!important;
}

.text-color-neutral-3 {
	color: #A7A4A5!important;
}

.text-color-neutral-4 {
	color:  #c3c1c1!important;
}

.text-color-neutral-5 {
	color:  #DFDFDF!important;
}

.text-color-ash {
	color:  #5D5A5B!important;
}

.text-color-ash-2 {
	color:  #454142!important;
}

.text-color-tango {
	color: #59A2A6!important;
}

.text-color-torque {
	color: #25A8A0!important;
}

.text-color-glow {
	color: #665419!important;
}

.text-color-error {
	font-size: 13px;
	margin: 8px;
 } 

.text-color-error,
.input-form-login-ves.error .error-message, 
.input-form-login-ves.error .input-form-login {
	color : #DA5C5C;
}

/*
---------------------------------------------
Input Style
--------------------------------------------- 
*/


/*
---------------------------------------------
Object
--------------------------------------------- 
*/

/* Global  */
.img-luminosity {
	mix-blend-mode: luminosity!important;
	padding:25px;
}

/* For Brand */
.dhn-for-brand-title {
	font-family: 'Montserrat';
	font-weight: 900;
	font-size: 36px;
	line-height: 40px;
}

.dhn-for-brand-desc {
	font-family: 'Neutrif Pro';
	font-weight: 500;
	font-size: 18px;
	line-height: 22px;
}

.dhn-for-brand-logo-list-title {
	font-family: 'Montserrat';
	font-weight: 900;
	font-size: 18px;
	line-height: 22px;
}

.dhn-for-brand-logo-list-title {
	font-family: 'Montserrat';
	font-weight: 900;
	font-size: 18px;
	line-height: 22px;
}

.dhn-for-brand-sub-title {
	font-family: 'Neutrif Pro';
	font-weight: 500;
	font-size: 12px;
	line-height: 16px;
}

.dhn-for-brand-strategy-title {
	font-family: 'Montserrat';
	font-weight: 900;
	font-size: 24px;
	line-height: 28px;
}

.dhn-for-brand-strategy-desc {
	font-family: 'Neutrif Pro';
	font-weight: 500;
	font-size: 18px;
	line-height: 150%;
}
.dhn-for-brand-strategy-desc {
	font-family: 'Neutrif Pro';
	font-weight: 500;
	font-size: 18px;
	line-height: 150%;
}

.dhn-for-brand-strategy-desc.strategy-list {
	line-height: 135%;
}

.dhn-for-brand-strategy-desc.strategy-sub-list {
	font-size: 15px;
	line-height: 20px;
}

.dhn-for-brand-strategy-sub-title {
	font-family: 'Neutrif Pro';
	font-weight: 700;
	font-size: 14px;
	line-height: 18px;
}

.dhn-for-brand-self-service-title {
	font-family: 'Montserrat';
	font-weight: 900;
	font-size: 24px;
	line-height: 135%;
}

.dhn-for-brand-self-service-menu-title {
	font-family: 'Neutrif Pro';
	font-weight: 700;
	font-size: 15px;
	line-height: 20px;
}

.dhn-for-brand-self-service-menu-title {
	font-family: 'Neutrif Pro';
	font-weight: 700;
	font-size: 15px;
	line-height: 20px;
}

.dhn-for-brand-schedule-desc {
	font-family: 'Neutrif Pro';
	font-weight: 500;
	font-size: 18px;
	line-height: 125%;	
}

/* RESPONSIVE
-------------------------------------------------- */

/* PHONE */
@media only screen and (min-width: 0px) { 
	/* Global Component */
	.h-100 {
		height: 100%!important;
	}
	
	.w-fit-content {
		width: fit-content!important;
	}

	/* Margin All  */
	/* Margin X  */
	/* Margin Y  */
	.my-cus-14 {
		margin-top: 14px!important;
		margin-bottom: 14px!important;
	}
	
	.my-cus-40 {
		margin-top: 40px!important;
		margin-bottom: 40px!important;
	}
	
	.my-cus-80 {
		margin-top: 80px!important;
		margin-bottom: 80px!important;
	}

	/* Margin Top  */
	/* Margin Bottom  */
	.mb-cus-10 {
		margin-bottom: 10px!important;
	}

	.mb-cus-20 {
		margin-bottom: 20px!important;
	}
	
	.mb-cus-40 {
		margin-bottom: 40px!important;
	}

	/* Margin Left  */
	/* Margin Right  */
	
	
	/* Padding All  */
	.p-cus-24-20 {
		padding: 24px 20px!important;
	}

	/* Padding X  */
	.px-cus-20 {
		padding-right: 20px!important;
		padding-left: 20px!important;
	}


	/* Padding Y  */
	.py-cus-60 {
		padding-top: 60px!important;
		padding-bottom: 60px!important;
	}

	/* Padding Top  */
	/* Padding Bottom  */
	/* Padding Left  */
	/* Padding Right  */

	/* For Banner  */
	.dhn-for-banner-img-list-logo {
		width: 100%;
		max-width: 171.5px;
	}
	.banner-for-brand {
		padding: 0 20px;
	}
	
	.banner-for-brand .banner-img {
		width: 100%;
		max-width: 500px;
	}

	.dhn-for-brand-img-strategy {
		width: 100%;
		max-width: 500px;
	}
	
	.dhn-for-brand-img-strategy.agency {
		max-width: 450px;
	}

	.dhn-for-brand-self-service-card {
		width: 100%;
		max-width: 344px;
		margin-bottom: 25px;
		margin-left: 0;
		margin-right: 0;
	}

	.dhn-for-brand-schedule-card {
		padding: 32px 20px;
	}
}

/* TABLET */
@media only screen and (min-width: 768px) { 
	
}

/* DESKTOP */
@media only screen and (min-width: 992px) {
	/* Global Component */	

	/* Padding All  */
	.p-lg-cus-20-12 {
		padding: 20px 12px!important;
	}
	
	/* Padding X  */
	.px-lg-cus-10 {
		padding-right: 10px!important;
		padding-left: 10px!important;
	}

	/* Padding Y  */
	.py-lg-cus-60 {
		padding-top: 60px!important;
		padding-bottom: 60px!important;
	}


	/* Padding Top  */
	.pt-lg-cus-120 {
		padding-top : 120px!important;
	}
	/* Padding Bottom  */
	/* Padding Left  */
	/* Padding Right  */

	/* For Banner  */
	.banner-for-brand {
		padding: 78px 20px;
	}

	.dhn-for-banner-img-list-logo {
		max-width: 221px;
	}

	.dhn-for-brand-self-service-card {
		max-width: 626px;
		margin-bottom: 0;
		margin-left: 12px;
		margin-right: 12px;
	}

	.dhn-for-brand-schedule-card {
		padding: 40px 32px;
	}
}

/* LARGE DESKTOP */
@media only screen and (min-width: 1200px) { 
	
}

