body{background-color: #fff;}
.fxt-template-layout1 .fxt-bg-color { padding: 50px 20px 42px; display: flex; align-items: center; } 
.fxt-template-layout1 .fxt-content { max-width: 450px; width: 100%; }
.fxt-template-layout1 .fxt-header { margin-bottom: 80px; } 
.fxt-template-layout1 .fxt-form .fxt-otp-logo { margin-bottom: 20px; display: block; }
.fxt-template-layout1 .fxt-form h2 { font-weight: 400; margin-bottom: 5px; }
.fxt-template-layout1 .fxt-form p { margin-bottom: 20px; font-size: 15px; } 
.fxt-template-layout1 .fxt-form .form-group {position: relative; z-index: 1; margin-bottom: 15px; }
.fxt-template-layout1 .fxt-form .form-group i {position: absolute; z-index: 1; right: 5px; top: 50%; transform: translateY(-50%); }
.fxt-template-layout1 .fxt-form .form-group [class^="mdi-"]:before,
.fxt-template-layout1 .fxt-form .form-group [class*=" mdi-"]:before,
.fxt-template-layout1 .fxt-form .form-group [class^="mdi-"]:after,
.fxt-template-layout1 .fxt-form .form-group [class*=" mdi-"]:after {
  margin-left: 0; font-size: 17px; color: #a1a1a1; }
.fxt-template-layout1 .fxt-form .form-control { border-radius: 0; min-height: 40px; border: 0; border-bottom: 1px solid #e7e7e7; padding: 10px 30px 10px 0; color: #111111;}
.fxt-template-layout1 .fxt-form .label-txt.label-active ~ .form-control{border-color: #6467fb!important;}
.fxt-template-layout1 .fxt-form input::-webkit-input-placeholder { color: #a1a1a1; font-size: 15px; font-weight: 300; } 
.fxt-template-layout1 .fxt-btn-fill {font-weight: 500; border: 0; color: #fff; border-radius: 3px; background-color: #000; padding: 10px 36px; }
.fxt-template-layout1 .fxt-btn-fill:hover {background-color: #da0000; border-color: #da0000;} 
.fxt-template-layout1 .switcher-text2 { color: #cc0033 !important; font-size: 15px; margin-top: 5px;  transition: all 0.3s ease-in-out; }
.fxt-template-layout1 .switcher-text2:hover { color: #666; } 
 .social-boxes a, .button a{display: block; text-align: center; border: 1px solid #dad8d8; margin:10px 0px; padding:12px 30px;display:flex; gap:20%; transition: .3s all;}
 .button a{justify-content: center;}
 .social-boxes a:hover, .button a:hover{background-color: #f2f2f2;}
 .social-boxes a.email:hover{color: #fff; background-color: #000;}
 .social-boxes a.fb:hover{color: #fff;    background-color: #74abf2;}
 .social-boxes a.shopify:hover{color: #fff;background-color: #94cf6d;}
 .button a.btn-email:hover{color: #fff;background-color: #ff0000;} 
 .button a.btn-social:hover{color: #fff;background-color: #ff0000;}
 h4{text-align: center; border: 1px solid #f2f2f2; position: relative;}
 h4 span{position: absolute; top: 50%; transform: translate(-50%, -50%); background: #fff; padding: 4px; font-size: 14px;}
 .fxt-footer p{text-align: center;margin-bottom: 0 !important;} 
 .fxt-form{transition: all 0.3s ease-in-out;} 
 @media only screen and (max-width: 992px) {
  .social-boxes a, .button a{padding: 12px 16px; gap: 10%;}
}
@media only screen and (max-width: 767px) { 
  .fxt-none-767 { display: none !important; }
  .fxt-template-layout1 .fxt-bg-color{min-height: auto;text-align: center;}
}
@media only screen and (max-width: 575px) { 
  .social-boxes, .button{margin: auto;}
}

@media only screen and (max-width: 320px) {
  .fxt-template-layout1 .fxt-header { display: block; }
  .social-boxes a, .button a{padding: 12px 12px;}
}
 
.social-btns a.s-btn{width: 100%; height: 46px;margin:12px 0px; position: relative; border-radius:5px; display: flex; line-height: 42px; border:2px solid #f2f2f2; transition: all 0.3s ease-in-out;}
 .icon-box{width:58px; display: inline-block; text-align: center; border-right: 2px solid #f2f2f2; position: relative;}
 .icon-box img{position: relative; top: 50%; transform: translateY(-50%);}
 .social-btns a.s-btn .text{width: 100%; padding-left:20%;}
 .social-btns a.s-btn:hover .text{background-color: #da0000; color: #fff;transition: all 0.3s ease-in-out;}
 .social-btns a.s-btn.google:hover,  .social-btns a.s-btn.google:hover .icon-box{border-color: #da0000 !important;}
 .social-btns a.s-btn.shopify:hover, .social-btns a.s-btn.shopify:hover .icon-box{border-color: #95bf47;}
 .social-btns a.s-btn.shopify:hover .text{background-color: #95bf47;}
 .social-btns a.s-btn.facebook:hover, .social-btns a.s-btn.facebook:hover .icon-box{border-color: #1777f2;}
 .social-btns a.s-btn.facebook:hover .text{background-color: #1777f2;}