/*
Theme Name: SSD
Theme URI: https://superseedstudio.com
Template: hello-elementor
Author: Superseed Digital
Author URI: https://superseedstudio.com
Description: Based on Hello
Version: 1.1655299352
Updated: 2022-06-15 13:22:32
*/

/* MESO - DEPIGMENTATION CAMPAIGN */

/* INDEX 
*  PADDING
*  GLOBAL BUTTONS
*  GLOBAL STYLING
*  GRAVITY FORMS
*  MEDIA QUERIES
*/

:root {
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-grey: #F8F8F8;
  --vfx: all 0.3s ease-in-out;
}

/* PADDING */

.pad-top {
  padding-top: 6rem;
}

.pad-bot {
  padding-bottom: 6rem;
  padding-left: 3rem;
  padding-right: 3rem;
}

.pad-tb {
  padding: 6rem 3rem;
}

.pad-sides {
  padding-left: 3rem;
  padding-right: 3rem;
}

.pad-sides-large {
  padding-left: 6rem;
  padding-right: 6rem;
}

.pad-col-right {
  padding-right: 6rem;
}

.pad-col-left {
  padding-left: 6rem;
}

.pad-tb-small {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

/* GLOBAL BUTTONS */

.solid-black-btn a {
	background-color: var(--color-black) !important;
	color: var(--color-white) !important;
	padding: 1.3rem 2.2rem !important;
  transition: var(--vfx) !important;
}

.solid-black-btn a:hover {
  background-color: var(--color-white) !important;
  color: var(--color-black) !important;
}

.solid-black-btn.ghost-hover a {
	background-color: var(--color-black) !important;
	border: solid 1px var(--color-black) !important;
	color: var(--color-white) !important;
	padding: 1.3rem 2.2rem !important;
 	transition: var(--vfx) !important;
}

.solid-black-btn.ghost-hover a:hover {
	background-color: transparent !important;
	border: solid 1px var(--color-black) !important;
	color: var(--color-black) !important;
}

.ghost-black-btn a {
  background-color: transparent !important;
  font-size: 11px !important;
  border: solid 1px var(--color-black) !important;
	color: var(--color-black) !important;
	padding: 1rem 2.2rem !important;
  width: 250px !important;
  transition: var(--vfx) !important;
}

.ghost-black-btn a:hover {
  background-color: var(--color-black) !important;
  color: var(--color-white) !important;
  border: solid 1px var(--color-black) !important;
}

/* GLOBAL STYLING */

html,
body {
  width: 100%;
  overflow-x: hidden;
  scroll-behavior: smooth;
}

.lead-txt p {
  font-size: clamp(1.125rem, 1.05rem + 0.375vw, 1.5rem);
  font-weight: 400;
}

.terms-and-conditions ul,
.what-bundle-include ul {
	padding-left: 1rem;
}

/* GRAVITY FORMS */

.gform_heading {
	display: none !important;
}

.entry-form #gform_2 input:not(.button) {
	border-bottom: 1px solid var(--color-black);
  border-top: none;
  border-left: none;
  border-right: none;
  padding-bottom: 1rem;
  padding-left: 0;
	border-radius: 0;
}

.entry-form #gform_2 input::placeholder {
  color: var(--color-black);
}

.entry-form #gform_2 #field_2_8 .gfield_label {
  font-size: clamp(0.875rem, 0.8375rem + 0.1875vw, 1.0625rem) !important;
  font-weight: 400 !important;
  line-height: 1.5rem !important;
}


.entry-form #gform_2 #label_2_6_1,
.entry-form #gform_2 #label_2_6_2,
.entry-form #gform_2 #label_2_6_3 {
	font-size: 1rem;
	font-weight: 400;
}

.entry-form #gform_2 .ginput_container_consent {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 0.5rem;
  font-size: 0.75rem;
  padding-top: 2rem;
}

.entry-form #gform_2 .ginput_container_consent a {
  color: var(--color-black) !important;
}

.entry-form #gform_2 .ginput_container_consent a {
  text-decoration: underline;
}

.entry-form #gform_2 #gform_submit_button_2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  border: solid 1px var(--color-black);
  font-size: 11px;
  padding: 1rem 5.19063rem 1rem 5.18938rem;
  transition: var(--vfx) !important;
}

.entry-form #gform_2 #gform_submit_button_2:hover{
  color: var(--color-black) !important;
  background-color: transparent !important;
}

.gfield_required.gfield_required_text {
  display: none !important;
}



/* MEDIA QUERIES */

/* TABLET - 1024px */
@media (width <= 64em) {
  .pad-top {
    padding-top: 3rem;
  }
  
  .pad-bot {
    padding-bottom: 3rem;
    padding-left: 2rem;
    padding-right: 2rem;
  }
  
  .pad-tb {
    padding: 3rem 2rem;
  }
  
  .pad-sides {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  
  .pad-sides-large {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  
  .pad-col-right {
    padding-right: 0;
  }
  
  .pad-col-left {
    padding-left: 0;
  }
  
  .pad-tb-small {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}

/* MOBILE - 767px */
@media (width <= 47.938em) {
  .pad-top {
    padding-top: 2rem;
  }
  
  .pad-bot {
    padding-bottom: 3rem;
    padding-left: 2rem;
    padding-right: 2rem;
  }
  
  .pad-tb {
    padding: 3rem 2rem;
  }
  
  .pad-sides {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  
  .pad-sides-large {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  
  .pad-col-right {
    padding-right: 0;
  }
  
  .pad-col-left {
    padding-left: 0;
  }
  
  .pad-tb-small {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .cosmelan-logo svg {
    transform: scale(0.8) !important;
  }
	
  .solid-black-btn a {
	background-color: var(--color-black) !important;
	color: var(--color-white) !important;
	padding: 1.3rem 2.2rem !important;
    transition: var(--vfx) !important;
	width: 100% !important;
  }

  .solid-black-btn a:hover {
    background-color: var(--color-white) !important;
    color: var(--color-black) !important;
  }

  .solid-black-btn.ghost-hover a {
	background-color: var(--color-black) !important;
	border: solid 1px var(--color-black) !important;
	color: var(--color-white) !important;
	padding: 1.3rem 2.2rem !important;
 	transition: var(--vfx) !important;
	width: 100% !important;
 }

  .solid-black-btn.ghost-hover a:hover {
	background-color: transparent !important;
	border: solid 1px var(--color-black) !important;
	color: var(--color-black) !important;
 }

 .ghost-black-btn a {
   background-color: transparent !important;
   font-size: 11px !important;
   border: solid 1px var(--color-black) !important;
   color: var(--color-black) !important;
   padding: 1rem 2.2rem !important;
   width: 250px !important;
   transition: var(--vfx) !important;
   width: 100% !important;
  }

 .ghost-black-btn a:hover {
   background-color: var(--color-black) !important;
   color: var(--color-white) !important;
   border: solid 1px var(--color-black) !important;
   width: 100% !important;
 }
	
 .entry-form #gform_2 #gform_submit_button_2 {
   display: flex;
   flex-direction: column;
   align-items: center;
   border: solid 1px var(--color-black);
   font-size: 11px;
   padding: 1rem 5.19063rem 1rem 5.18938rem;
   transition: var(--vfx) !important;
   width: 100% !important;
 }
	
 .thanda-logo svg {
   transform: scale(0.6) !important;		
 }
}