html {
  width: 100%;
  height: 100%;
  background: #f6f7f9; }

body {
  padding: 0;
  text-align: left;
  margin: 0px auto;
  font-size: 16px;
  min-height: 900px;
  font-family: 'Spartan', sans-serif;
  font-weight: lighter;
  color: #000;
  -webkit-font-smoothing: antialiased; 
  background: #f6f7f9; 
  max-width: 100%;
  overflow-x: hidden;
}

/*
font-family: 'Barlow', sans-serif;
font-family: 'League Spartan', sans-serif;
font-family: 'Lexend', sans-serif;
font-family: 'Montserrat', sans-serif;
font-family: 'Nunito', sans-serif;
font-family: 'Open Sans', sans-serif;
font-family: 'Oswald', sans-serif;
font-family: 'Raleway', sans-serif;
font-family: 'Roboto', sans-serif;
font-family: 'Roboto Slab', serif;
font-family: 'Sofia Sans Semi Condensed', sans-serif;
*/

/* revmatics brand colors */
:root {
  --body-bg-rgb: 245, 246, 250;
  --primary-rgb: 29, 86, 247;
  --base-black: #000000;
  --base-white: #FFFFFF;
  /* --monochrome */
  --monochrome-25: #FCFCFC;
  --monochrome-50: #F2F2F4;
  --monochrome-100: #E6E5E9;
  --monochrome-200: #CCCCD3;
  --monochrome-300: #B3B2BE;
  --monochrome-400: #9999A8;
  --monochrome-500: #808092;
  --monochrome-600: #67667C;
  --monochrome-700: #4D4C66;
  --monochrome-800: #343351;
  --monochrome-900: #010025;
  /* --primary */
  --primary-25: #F4F7FF;
  --primary-50: #E8EEFE;
  --primary-100: #C7D5FD;
  --primary-200: #A2BAFC;
  --primary-300: #8EABFB;
  --primary-400: #5680F9;
  --primary-500: #1D56F7;
  --primary-600: #1641B9;
  --primary-700: #0F2B7B;
  --primary-800: #0C2263;
  --primary-900: #091A4A;
  /* --purple */
  --purple-50: #F6E4FF;
  --purple-100: #F2D9FF;
  --purple-200: #E9BFFF;
  --purple-300: #D380FF;
  --purple-400: #BD40FF;
  --purple-500: #A700FF;
  --purple-600: #8E00D9;
  --purple-700: #7900B8;
  --purple-800: #67009C;
  --purple-900: #530080;
  /* --red */
  --red-25: #FDE5E5;
  --red-50: #FCDADA;
  --red-100: #FAC7C7;
  --red-200: #F9B4B4;
  --red-300: #F69898;
  --red-400: #F26969;
  --red-500: #EF4444;
  --red-600: #CB3A3A;
  --red-700: #A73030;
  --red-800: #8F2929;
  --red-900: #782222;
  /* --green */
  --green-25: #E6F7ED;
  --green-50: #CCEEDA;
  --green-100: #B2E6C7;
  --green-200: #99DDB4;
  --green-300: #73D198;
  --green-400: #33BC69;
  --green-500: #00AB44;
  --green-600: #00913A;
  --green-700: #007830;
  --green-800: #006729;
  --green-900: #005622;
  /* --yellow */
  --yellow-25: #FFF9DF;
  --yellow-50: #FFF5CC;
  --yellow-100: #FFF1B2;
  --yellow-200: #FFEC99;
  --yellow-300: #FFE573;
  --yellow-400: #FFD933;
  --yellow-500: #FFCF00;
  --yellow-600: #D9B000;
  --yellow-700: #B39100;
  --yellow-800: #997C00;
  --yellow-900: #806800;
  /* --orange */
  --orange-50: #FFE4CC;
  --orange-100: #FFD6B2;
  --orange-200: #FFC999;
  --orange-300: #FFB473;
  --orange-400: #FF7700;
  --orange-500: #FF7700;
  --orange-600: #994700;
  --orange-700: #994700;
  --orange-800: #994700;
  --orange-900: #803C00;
  --secondary-rgb: 255, 90, 41;
  --warning-rgb: 255, 154, 19;
  --info-rgb: 12, 156, 252;
  --success-rgb: 12, 199, 99;
  --danger-rgb: 255, 56, 60;
  --light-rgb: 247, 248, 250;
  --dark-rgb: 10, 10, 10;
  --orange-rgb: 254, 124, 88;
  --pink-rgb: 254, 84, 155;
  --teal-rgb: 0, 216, 216;
  --purple-rgb: 123, 118, 254;
  --green-rgb: 1, 239, 140;
}
/* revmatics styles */
@media screen and (min-width: 768px) {
  .croNavWrap{
    max-width: 250px;
    height: 92vh;
    position: fixed;
    overflow-y: auto;
  }

  .row_content_fb > div.row > div.col-md-10 {
    margin-left: 250px;
  }
}
@media screen and (max-width: 767px){
  .hideMobile{
    display: none;
  }
  .funnel-nav-butt{
    font-size:14px!important;
    max-width: 150px!important;
    margin: 0px;
    padding: 5px!important;
    margin-left: 0px!important;
  }
  .mobileFlex{
    display: flex;
    align-items: center;
  }
  .mr-auto-mob{
  margin-right: auto;
  }
}
textarea{
  border-radius: 6px!important;
}
.revIcon{
  width: 20px;
  height: 20px;
  margin-right: 10px;
}
.revBtn{
  font-size: 14px!important;
  transition: all .2s ease;
  background-color: #1D56F7!important;
  border: 1px solid #1D56F7;
  color: white!important;
  font-weight: 700;
  text-decoration: none!important;
  padding: 5px 16px!important;
  border-radius: 4px!important;
  cursor: pointer;
  min-width: 0px!important;
}
.revBtn:hover{
 background-color: #1641B9!important;
}
.revBtnDisabled{
  background-color: #E6E5E9!important;
  color: #B3B2BE!important;
  cursor: default;
  text-decoration: none!important;
  padding: 5px 16px!important;
  border-radius: 4px!important;
  height: 38px;
}
.revBtnRed{
  font-size: 14px!important;
  transition: all .2s ease;
  background-color: #EF4444!important;
  color: white!important;
  font-weight: 700;
  text-decoration: none!important;
  padding: 5px 16px!important;
  border-radius: 4px!important;
  cursor: pointer;
  min-width: 0px!important;
}
.revBtnRed:hover{
  background-color: #CB3A3A!important;
}
.revBtn2{
  font-size: 14px!important;
  transition: all .2s ease;
  background-color: white;
  border: 1px solid #1D56F7;
  color: #1D56F7!important;
  text-decoration: none!important;
  border-radius: 4px!important;
  font-weight: 700;
  text-decoration: none!important;
  padding: 5px 16px!important;
  height: fit-content;
}
.revBtn2:hover{
 background-color: #E8EEFE;
}
.revBtn2Disabled{

}
.disabledField{
  border: 1px solid #CCCCD3!important;
  color: #808092!important;
}

.b_shade_1{
  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.20), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.b_shade_2{
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15)!important;
}
.pagination_selector{
  border: 1px solid #CCCCD3; 
  border-radius: 4px;
  padding: 10px 12px;
  line-height: 100%;
}
.rev_select{
  font-size: 16px;
  margin-bottom: 0px;
  border: 1px solid #CCCCD3; 
  border-radius: 4px;
  padding: 7px 12px 7px 5px;
  line-height: 100%;
  background: white url(https://cdn.revmatics.ai/536f59a7a000647f61e8aa8a9454b206.png) !important;
  background-repeat: no-repeat!important;
  background-size: 30px !important;
}
.disabled {
  pointer-events: none;
  opacity: 0.5;
  cursor: default;
}
.hover_scale:hover{
  scale: 1.5;
  transition: all .4s ease;
}
.funnel_list_drop_select{
  background: white;
  border-radius: 8px;
  padding: 8px;
  position: absolute;
  right: 20px;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  transition: all ease .4s;
}
.funnel_list_drop_select a p{
  background-color: white;
  transition: all ease .4s;
  padding: 10px;
  border-radius: 4px;
}
.funnel_list_drop_select a p:hover{
  background-color: #E8EEFE;
}

.noRotate{
  transform: rotate(0deg)!important;
}

#show_pages{
  padding: 0px 0px 1px!important;
  padding-bottom: 16px;
}
#show_settings{
  padding: 0px!important;
  margin: 0px;
  width: 100%;
  padding-bottom: 8px;
}
#show_funnels{
  padding: 0px 0px 1px!important;
  margin: 0px;
  padding-bottom: 16px;
}
#show_snips{padding: 0px 0px 1px!important; width: 100%;}
#show_prods{padding: 0px 0px 1px!important; width: 100%; padding-bottom: 16px;}
#show_assets{padding: 0px 0px 1px!important; width: 100%;padding-bottom: 16px;}
#show_forms{padding: 0px 0px 1px!important; width: 100%;}
/* dashboard classes */
.dash-modal{
  border-radius: 8px!important;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15)!important;
  border: 0px!important;
}
/* Dashboard Styles */
.active_nav{
  background-color: var(--primary-50);
}
.profileInfoWrap{
  background: white;
  width: 95%;
  max-width: 800px;
  margin: auto;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
}
.profileInfoWrap div ul{
  display: flex;
  justify-content: space-evenly;
}
.profileInfoWrap div ul li{
  flex: 1;
  text-align: center;
  color: #9999A8;
  font-weight: 700;
}
.profileInfoWrap div ul li.active{
  color: #1D56F7!important;
  border-bottom: 2px solid #1D56F7!important;
}
.revForm input{
  border: 1px solid #CCCCD3;
  border-radius: 4px;
  width: 100%;
}
.revForm select{
  border: 1px solid #CCCCD3;
  border-radius: 4px;
  width: 100%;
}
.revForm password{
  border: 1px solid #CCCCD3;
  border-radius: 4px;
}
.revRedBtn{
  transition: all .4s ease;
  padding: 5px 16px; border-radius: 4px;
  font-weight: bold;
  text-decoration: none;
}
.revRedBtn:hover{
background: #FCDADA;
}
.revNavHover:hover{
  color: #1D56F7!important;
}
.revTable thead{
  background-color: rgba(22, 65, 185, 0.14);
  border-bottom: 1px solid #CCCCD3;
}
.revTable thead tr th{
  padding: 12px 10px!important;
  font-size: 14px!important;
  color: black!important;
  font-weight: bold;
  border-right: 1px solid #1641b945;
  font-family: 'Roboto', sans-serif !important;
}
.revTbody div{
  padding: 12px 10px;
  font-size: 14px!important;
  color: black!important;
  border: 1px solid #091A4A14;
}
.revTablebody tr td{
  padding: 13px 10px;
    text-align: left;
    font-size: 14px!important;
    border-right: 1px solid #091A4A14;
    background-color: white;
    white-space: nowrap;
    font-family: 'Roboto', sans-serif !important;
}
.revTablebody tr{
  border-bottom: 1px solid #091A4A14;
}
.revBox{
  text-align: center;
  width: 100%;
  padding: 20px;
  margin: 8px;
  margin-left: 0px;
  font-size: 32px;
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
}
.revBox h6{
  text-align: left;
  font-size: 14px;
  color:#808092;
  width: 100%;
  margin-bottom: 15px;
}
.revBox p{
  width: 100%;
  text-align: left;
  font-weight: bold;
}
.revCircleNav{
border-radius: 100px;
color: #9999A8;
padding: 5px 12px;
font-weight: bold;
display: flex;
justify-content: center;
border: 1px solid #CFCFCF;
}
.revCircleNav.revActive{
  border: 1px solid #1D56F7!important;
  color: #1D56F7;

}
.revLink{
  color: #1D56F7;
  font-weight: bold;
}
.revShadow{
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
}
.revRedBubble{
border-radius: 100px;
background-color: #FCDADA;
color: #CB3A3A;
font-weight: bold;
padding: 1px 10px;
text-align: center;
}
.revGreenBubble{
  border-radius: 100px;
  background-color: #CCEEDA;
  color: #00913A;
  font-weight: bold;
  padding: 1px 10px;
  text-align: center;
}
.revGrayText{
  color: #808092;
}
.revEllipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.abtestHolder{
  padding: 20px;
}
.winnerHead{
  padding: 8px 10px!important;
}
.revHoverbg:hover{
  background-color: #1D56F70D!important;
}

#funSideBarNav{
  display: flex;
  justify-content: space-evenly;
}
#funSideBarNav button{
  all: unset;
  font-weight: bold;
  color: #9999A8;
  text-align: center;
  font-size: 14px;
  cursor: pointer;
  padding: 4px;
  width: 25%;
}
#funSideBarNav button.active{
  color: #1D56F7;
  border-bottom: 2px solid #1D56F7 !important;
}
.funnel_sidebar_inner article{
  padding: 6px;
}
.funnel_sorter{
  background-color: white;
  transition: all .4s ease;
}
.funnel_sorter:hover{
  background-color: #01002514!important;
}
.funnel_sorter.active{
  background-color: #01002514!important;
}
.funnel_sorter.active div div article div div p span {
  font-weight: bold;
  color: #1D56F7;
}
.spanColor span{color: #4D4C66!important;}
.revSectIcons{
  display: flex;
}
.revSectIcons a{
  color: #4D4C66; 
  background-color: white;
  transition: all .4s ease;
  border-radius: 4px;
  padding: 10px;
  font-size: 16px;
  height: 36px;
  display: flex;
}
.revSectIcons a:hover{
  background-color: #9999A826; 
}
.detailNav a{
  all: unset;
  font-weight: bold;
  color: #9999A8;
  text-align: center;
  font-size: 14px;
  cursor: pointer;
  padding: 4px 7px;
}
.detailNav a.active{
  color: #1D56F7;
    border-bottom: 2px solid #1D56F7 !important;
}
.revTooltip_container {
  position: relative;
  display: inline-block;
}

.revTooltip {
  position: absolute;
  font-size: 14px;
  font-weight: 400;
  bottom: 100%; /* places it directly above */
  left: 50%;
  transform: translateX(-50%);
  background: white;
  color: #000;
  padding: 8px 12px;
  border-radius: 4px;
  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.20), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease-in-out;
  z-index: 100;
}
.revTooltip_below {
  position: absolute;
  font-size: 14px;
  font-weight: 400;
  top: 100%; /* places it directly below */
  left: 50%;
  transform: translateX(-50%);
  background: white;
  color: #000;
  padding: 8px 12px;
  border-radius: 4px;
  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.20), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease-in-out;
  z-index: 100;
}

.revTooltip_container:hover .revTooltip {
  opacity: 1;
  pointer-events: auto;
}
.revTooltip_container:hover .revTooltip_below {
  opacity: 1;
  pointer-events: auto;
}
.revSelect-wrapper {
  position: relative;
}
.revSelect{
  appearance: none;            
  -webkit-appearance: none;    
  -moz-appearance: none;       
  width: 100%;
  padding: 10px;
  padding-right: 40px;         
  font-size: 16px;
  cursor: pointer;
}

.custom-arrow {
  position: absolute;
  right: 12px;
  top: 45%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #666;
  font-size: 16px;
}
.showTablet{
  display: none;
}
.backArrowContain{
  cursor: pointer; 
  background-color: white; 
  border: 1px solid #CCCCD3; 
  border-radius: 4px;
  display: flex; 
  height: fit-content; 
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  margin-right: 10px; 
  padding: 10px;
}

.backArrowContain i{
  color: #67667C;
  font-size: 16px!important;
}
#sec_div_main{
  margin-left: 15px;
}
.revWhiteCard{
  background: white;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
}
.dayClick{
  width: 40px!important;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #CCCCD3;
  margin: 5px;
  font-size: 14px;
  border-radius: 8px;
  cursor: pointer;
}
.revHeatDiv{
  width: 100%;
  height: 27px;
  border-radius: 4px;
    background: linear-gradient(
      to right,
      #4C0F0F,
      #A50808,
      #FF4500,
      #FFA500,
      #FFBD59,
      #FFD602,
      #CCFF00,
      #33CD32,
      #03F19D,
      #87CEFA,
      #1D90FF,
      #0000FF
    );
}
.shadow-box {
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
  position: relative;
  z-index: 0;
}

.shadow-box::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 4px;
  width: 100%;
  background: white; /* match your background */
  z-index: 1;
}
.rev-vis-color-wrap{
  margin-bottom: 20%;
}
.rev-vis-color-wrap div{padding: 10px; white-space: nowrap;}
.rev-vis-color-wrap div div {
  padding: 0px;
  color: #67667C;
  font-weight: 400;
  font-size: 12px;
}
.rev-vis-color-wrap div div span{max-width: 100%; padding: 5px; border: 1px solid #CCCCD3; border-radius: 4px;}
.rev-vis-color-wrap div div span input { max-width: 75%;color: #67667C; border: 0px; cursor: pointer; padding-left: 6px;}
.rev-vis-color-wrap div div span div {padding: 0px; border: 1px solid #CCCCD3; border-radius: 4px;}

.sp-original-input-container{
  display: flex;
  align-items: center;
}
.sp-colorize-container{
  width: 25px;
  height: 25px;
}
.sp-colorize{
  width: 25px;
  height: 25px;
}

.rev_status_1{
  background-color: #F6E4FF;
  border-radius: 100px;
  color: #8E00D9;
  padding: 6px 12px;
  border: 0px;
  height: fit-content;
  line-height: 100%;
}
.rev_status_1 i {
  color: #8E00D9!important;
}
@media screen and (min-width: 1200px) {
  .hideDesk{
    display: none!important;
  }
}
@media screen and (max-width: 1200px){
  #sec_div_main{
    margin-left: 0px;
  }
  #sort-links div{
    margin-left: 0px!important;
  }
  .tabFullW{
    width: 100%!important;
  }
  .revNavInner{
    flex-wrap: wrap;
    background-color: white!important;
    margin: auto;
    border-radius: 6px;
  }
  .hideTablet{
    display: none;
  }
  .showTablet{
    display: flex;
  }
  #funSideBarNav{
    width: 100%!important;
  }
  .revNavInner article{
    width: 100%!important;
  }
  .funSections{
    width: 100%!important;
  }
  #funTools div {
    width: 100%;
  }
  #funTools div i{
    margin-right: 5px;
  }
  #funTools div span{
    margin-left: 5px;
  }
  #funStats div {
    width: 100%;
  }
  #funStats div i{
    margin-right: 5px;
  }
  #funStats div span{
    margin-left: 5px;
  }
  .detailNav{
    flex-wrap: nowrap;
    overflow-x: scroll;
    padding-bottom: 8px;
  }
  .detailNav a{
   font-size: 14px;
   line-height: 120%;
   white-space: nowrap;
  }
  .detailNav a b{
    white-space: nowrap;
  }

  #sectEditWrap{
    width: 100%;
  }
  #sort-links{
    padding: 0px!important;
  }
  #sectEditWrap{
    padding-top: 40px;
  }
  #funnel_preview{
    width: 100%;
  }
  #funnel_preview i{
    margin: 0px;
  }
  #funnel_preview span{
    margin-left: 0px;
  }
  .funnel_sorter{
    margin-top: 0px!important;
  }
}
@media screen and (max-width: 767px){
  .abtestHolder{
    padding: 0px;
  }
  .winnerHead{
    padding: 8px 5px!important;
  }
  .revBox{
    margin-left: 0px;
  }
  .mobiPic{
    max-width: 130px!important;
  }
  .mobi-butt{
    scale: 0.8!important;
  }
}

/* --- general --- */
a{color:#2194B6;text-decoration:none;}
.fa {font-size: 16px;font-size: inherit;color:#333;}
.fab {font-size: 16px;font-size: inherit;margin-right:5px;color:#333;}
.fa-solid {color:#333;}
ul,div,p{margin:0;padding:0;}
img{border:0; vertical-align:middle;}
section{width:100%;}
input[type=text]{font-family: 'Spartan', sans-serif; font-size:18px; border: 1px solid #CCCCD3;background-color: #fff;
                 padding: 8px; margin: 6px 0px 4px 0px; border-radius: 6px; padding-left: 20px; border-width: 1px;}
#inputimg{font-family: 'Spartan', sans-serif; font-size:14px; background: #fff; border:0;}

select{font-size:18px; margin: 0px; border: 1px solid #CCCCD3!important; background: #fff;
       padding: 6px 10px; margin: 0px 0px 4px 0px; border-radius: 6px!important;}

textarea{font-family: 'Spartan', sans-serif; font-size:14px; background: #fff;border:1px solid;border-color:#999;}
form{margin: 0 0 0 0;}
div.pad{padding:10px;}
div.smallpad{padding:5px;}
.clear{clear:both;}
div {display:block;}
label{border-color: #ccc;}
b, strong {font-weight: bold !important;}

.muy-darko{background:#000;}
.fa-top {color: transparent;
      -webkit-text-stroke-width: 1px;
      -webkit-text-stroke-color: #fff;
     font-size: 14px;padding:0px;margin:0px;}
.fa-top-link {color: transparent;
      -webkit-text-stroke-width: 1px;
      -webkit-text-stroke-color: #2194B6;}
.fa-butt {color: transparent;
      -webkit-text-stroke-width: 1px;
      -webkit-text-stroke-color: #fff;
     font-size: 20px;}
.fa-huge {color: transparent;
      -webkit-text-stroke-width: 2px;
      -webkit-text-stroke-color: #fff;
     font-size: 64px;padding:0px;margin:0px;}    

.title-header {color:#333;padding-top:60px;line-height:50px;font-size: 34px;}
.title-main {padding-top:60px;font-size:52px;}
.title-header-top {color:#fff;padding:30px;padding-bottom:20px;line-height:50px;font-size: 42px;font-weight: bold;text-shadow: 0 1px 0 #333;}
.subtitle-header-top{font-size: 28px;line-height:32px;}
.title-smaller {font-size:38px;text-shadow: 0 1px 0 #333;}
.title-inner-bold {font-size:28px;font-weight:bold;line-height: 36px;}
.title-inner-bottom {font-size:22px;margin-left:10%;margin-right:10%;}
.title-inner-middle {font-size:28px;color:#000;font-weight:bold;}
.solve-list {margin-left:30%;}
.splash-top {width:100%;padding-top:20px;}
.home-feed-img {text-align:center;margin:0 auto;width:70%;}
.title-logo {width:30%;}
.homepage-top {padding-top:20px;color:#fff;background: #000;height:500px;}
.embedimg {width:98%;border-radius: 8px;max-width:180px;}
.reg-btn {text-align:center;min-width:150px;height:45px;border-radius:12px;color:#fff;background-color:#8c52ff;
          box-shadow:2px 2px #777;padding:5px;padding-left:20px;padding-right:20px;font-size: 18px;font-family: 'Spartan';
          padding-top:10px;cursor: pointer;}
.reg-btn-alt {text-align:center;min-width:150px;height:50px;border-radius:16px;color:#fff;background-color:#8c52ff;
              box-shadow:2px 2px #777;padding:10px;padding-left:30px;padding-right:30px;font-size:18px;font-family: 'Spartan';
              font-weight: bold;padding-top:14px;cursor: pointer;white-space: nowrap;}
.live-btn-alt {text-align:center;min-width:144px;height:50px;border-radius:30px;color:#fff;background-color:#8c52ff;
               padding-bottom:15px;padding-top:0px;padding-left:30px;padding-right:30px;font-size:18px;font-family: 'Spartan';
               font-weight: bold;padding-top:14px;cursor: pointer;white-space: nowrap;}              
.under-title-heading {font-size: 20px;font-weight: bold;}
.high-five {width:300px;margin: 0 auto;}
.triv-btn {text-align:center;min-width:250px;width:100%;height:50px;border-radius:12px;color:#fff;background-color:#40bfbc;
           box-shadow:2px 2px #ccc;padding:10px;padding-left:20px;padding-right:20px;font-size: 18px;font-family: 'Spartan';
           padding-top:12px;margin-top:6px;cursor: pointer;}

.man-btn {float:right;text-align:center;border-radius:12px;color:#fff;background-color:#40bfbc;
          box-shadow:1px 1px #fff;padding:0px;padding-left:8px;padding-right:8px;font-size: 10px;margin-top:3px;font-family: 'Spartan';
          cursor: pointer;text-shadow:none;height:30px;}
.man-btn:hover {background-color:#fa702b;color:#fff;text-decoration: none;}          

.triv-btn:hover{background-color:#fa702b;color:#fff;text-decoration: none;}
.reg-btn:hover{background-color:#fa702b;color:#fff;text-decoration: none;}
.reg-btn-alt:hover{background-color:#333;color:#fff;text-decoration: none;}
.clickable {cursor: pointer;}
.clickable:hover {background-color:#40bfbc;}

.ad_right {width:98%;max-width:250px;padding:10px;padding-top: 0px;}
.ad_right_img {width:100%;border-radius:20px;}
.ad_headline {padding-top:10px; font-size: 14px; font-weight: normal; line-height: 18px;}
.stretch-vid {margin-left:-30px;width:108%;margin-right:-20px;max-height:550px;border-radius: 12px;}
.live-stretch-vid {margin-left:-20px;width:103%;margin-right:-15px;max-height:550px;border-radius: 12px;position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.inner-choice {width:100%;background-color: #fff;border-radius: 20px;padding:15px;margin: 10px;min-height:580px;}

.show-more{display: none;}
.bigperc {font-size: 42px; font-weight: bold;}
.btn-group {border-color: #ccc;border-radius: 10px;}
.btn{font-size: 12px;line-height: 16px;padding: 7px 15px;box-shadow: none!important;-webkit-box-shadow: none!important;color:#000;}
.btn-default{color: #bdbcbc;background-color: #f1f1f1;border-color: #ccc;font-size:18px;padding:12px;}
.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .btn-default.active:hover 
.open > .dropdown-toggle.btn-default{background-color: #fff!important;color: #525f71!important;border-color: #ccc!important;}
.btn-circle{border-radius: 30px;background-color: #fff;color: #ccc;border-color: #ccc;font-size: 30px;line-height: 20px;
        padding: 1px 5px;width:30px;}
.btn-white{background-color: #fff;color: #525f71;border:0;}
.dropdown-toggle.btn-secondary{background-color: #fff!important;width:30px;color: #525f71!important;border-color: #ccc!important;font-size:16px;padding:1%;}
.form-group{margin:1%;}
.form-longer {box-shadow: none!important;-webkit-box-shadow: none!important;border:0;font-size: 18px;height: 40px;
        color: #525f71; width:70%;padding:1%;}
.form-shorter {box-shadow: none!important;-webkit-box-shadow: none!important;border:0;font-size: 18px;height: 40px;
        color: #525f71; width:20%;padding:1%;margin:1%;}
.filter{margin-bottom: 10px;text-align: left;}
.filter .btn-circle{margin-left: 10px;}
.filter-label{text-align: center;font-size: 18px;margin-bottom: 5px;color: #525f71;}
.filter-label-left{text-align: left;font-size: 18px;margin-bottom: 5px;margin-left:100px;color: #525f71;}
.filter-nolabel{padding-top: 31px;}

.hidden {
    display: none;
}

.funnel-header-links {float:right;min-width:50%;padding-left:20px;padding-top:0px;padding-right: 20px;text-align: center;}
.funnel-header-link {width: fit-content;margin:8px;cursor: pointer;transition: transform .5s ease;display: inline-flex!important;}
.funnel-header-link:hover {transform: scale(1.1);}
.funnel-link-active {font-weight: bold;}
.funnel-logo-img {max-width:250px;height:45px;}
.funnel-ham-cont {padding-top:10px; cursor: pointer;}
.funnel-day-link {float:left;background-color: #fff;border-radius: 10px;padding:6px;color:#000;font-size: 20px;margin:4px;
                  width:60px;text-align: center;border:1px solid #ccc;
                  transition: transform .5s ease;cursor: pointer;}
.funnel-day-link:hover {font-weight: bold;transform: scale(1.1); background-color: #eee;}
.day-active { background-color: #9999A826; font-weight: 600;}
.form_element_click{border-radius:20px;cursor:pointer;transition: transform .5s ease;}
.form_element_click:hover {font-weight: bold;transform: scale(1.3);}

.variant-swatch {width:45px;height:45px;margin:3px;border-radius:50%;cursor: pointer;transition: transform .5s ease;}
.variant-swatch-square {width:45px;height:45px;margin:3px;border-radius:0px;cursor: pointer;transition: transform .5s ease;}
.variant-swatch:hover {transform: scale(2.5);}
.variant-swatch-square:hover {transform: scale(2.5);}
.variant-swatch-small {width:20px;height:20px;margin:3px;border-radius:50%;border:1px solid #fff; cursor: pointer;transition: transform .5s ease;}
.container-xxl {max-width: 1600px !important;}
.formcontain {min-height:500px;}

.funnel-header-center {
  display: flex;
  justify-content: center;
}

.product-item {
    position: relative;
    line-height: 20px;
}

.product-item img {
    max-width: 90%;
    object-fit: cover;
}

.variant-option {
    text-align: center;
}

.variant-options {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.6);
    padding: 10px;
    border-radius: 10px;
    width: 96%;
    height: 100%;
    box-sizing: border-box;
    z-index: 10;
}

.grid-container {
    display: grid;
    margin: 0 auto;
    padding: 10px;
    max-width: 96%;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

.slot-trash {
    position: absolute;
    top: 5px;
    right: 5px;
    color: rgba(0,0,0,0.4);
    background: rgba(255,255,255,0.6);
    border-radius: 50%;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
}

.clear-items {float:left;margin-top:-12px;padding-right:8px;font-size: 13px;}

.grid-slot {
    position: relative;
    border: 1px solid #ccc;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0.9em;
    padding: 5px;
    height: 100%;
    box-sizing: border-box;
    cursor: pointer;
}

.grid-slot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.grid-slot .variant-title {
    position: absolute;
    top: 10px; /* Adjust as necessary */
    right: 10px; /* Adjust as necessary */
    background-color: #fff;
    border-radius: 50%;
    padding: 5px 10px;
    font-size: 14px; /* Adjust as necessary */
    font-weight: bold;
    width: 40px;
    height: 40px;
    color: #000;
    display: flex;
    justify-content: center;
    align-items: center;
}

 .grid-scrollable {
    display: flex !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 5px !important;
    max-width: 98% !important;
    height: 90px !important; /* adjust this slightly smaller than your parent */
    border: 1px solid #ccc !important;
    box-sizing: border-box !important;
}

.grid-scrollable .grid-slot {
    flex: 0 0 auto !important; /* don't shrink or grow, fixed width */
    width: 80px !important;    /* adjust slot width as needed */
    height: 100% !important;
}

.grid-scrollable::-webkit-scrollbar {
    height: 8px !important;
}

.grid-scrollable::-webkit-scrollbar-thumb {
    background-color: #ccc !important;
    border-radius: 4px !important;
}

.grid-scrollable::-webkit-scrollbar-track {
    background-color: #f8f8f8 !important;
}

.ticket-control {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px; /* spacing between buttons and text */
  margin-top: 10px;
}

.ticket-control button {
  width: 50px;
  height: 50px;
  font-size: 24px;
  padding: 0;
  line-height: 50px;
  text-align: center;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  flex-shrink: 0; /* prevents shrinking */
}

.ticket-text {
  display: inline-block;
  font-size: 18px;
  line-height: 50px; /* aligns vertically */
}

/* Explicit mobile optimization */
@media (max-width: 600px) {
  .ticket-control {
    gap: 5px; /* reduce spacing on smaller screens */
  }

  .ticket-control button {
    width: 40px;
    height: 40px;
    font-size: 20px;
    line-height: 40px;
  }

  .ticket-text {
    font-size: 16px;
    line-height: 40px;
  }
}

.hidden {
    display: none;
}

.checkout-button {
    margin: 20px;
    padding: 10px 20px;
    background-color: #28a745;
    color: #fff;
    border: none;
    cursor: pointer;
    display: block;
    margin: 20px auto;
    font-size: 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.cart-subtotal {max-width:96%;font-size: 24px;}

.checkout-button:hover {
    transform: scale(1.1); /* Increase the size by 20% */
    box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.3); /* Add a stronger shadow */
}

.cart-counter {
    display: none !important;
    position: fixed;
    top: 130px;
    right: 30px;
    background: black; background-size: cover; background-position: center;
    color: #fff;
    padding: 13px 20px;
    border-radius: 50%;
    font-size: 20px;
    font-weight: bold;
    width: 60px; height: 60px;
    cursor: pointer;
    border: 1px solid white;
    z-index: 1000; /* Ensure it's always on top */
}


   /* Container for color swatches */
.color-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

/* Individual color swatches */
.color-swatch {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    cursor: pointer;
    border: 1px solid #fff;
    transition: transform 0.3s ease-in-out, border 0.3s ease-in-out;
}

/* Color swatch selected state */
.color-swatch.selected {
    border: 2px solid black;
    transform: scale(1.1);
}

/* Text-based color options (if no hex match) */
.opt-btn {
    font-size: 16px;
    border-radius: 4px;
    min-width: 24px;
    text-align: center;
    border: 1px solid #ccc;
    background-color: white;
    cursor: pointer;
    margin: 1px;
    padding: 6px;
    min-height: 24px;
    padding-top:2px;
    padding-bottom:0px;
    transition: background-color 0.3s ease-in-out;
}

.opt-btn.selected {
    background-color: black;
    color: white;
    transform: scale(1.1);
}

.size-btn {
    font-size: 16px;
    border-radius: 4px;
    min-width: 24px;
    text-align: center;
    border: 1px solid #ccc;
    background-color: white;
    cursor: pointer;
    margin: 1px;
    padding: 4px;
    height: 24px;
    padding-top:0px;
    padding-bottom:6px;
    transition: background-color 0.3s ease-in-out;
}

.size-btn.selected {
    background-color: black;
    color: white;
    transform: scale(1.1);
}

/* Container for size options */
.size-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.color-swatch:hover {transform: scale(1.4);}
.opt-btn:hover {transform: scale(1.4);}
.size-btn:hover {transform: scale(1.4);}

.darkened {
    position: relative;
    overflow: hidden;
}

.very-darkened {
    position: relative;
    overflow: hidden;
}

.darkened::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: inherit; /* Inherit the background image from the parent */
    background-size: cover;
    background-position: center;
    z-index: 1;
    -webkit-filter: brightness(0.7) contrast(1.1) saturate(1.1); /* For older WebKit browsers */
    filter: brightness(0.7) contrast(1.1) saturate(1.1);         /* Standard syntax */
    opacity: 1; /* Adjust if you want a lighter overlay */
}

.very-darkened::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: inherit; /* Inherit the background image from the parent */
    background-size: cover;
    background-position: center;
    z-index: 1;
    -webkit-filter: brightness(0.5) contrast(1.2) saturate(1.1); /* For older WebKit browsers */
    filter: brightness(0.5) contrast(1.2) saturate(1.1);         /* Standard syntax */
    opacity: 1; /* Adjust if you want a lighter overlay */
}

.darkened > * {
    position: relative;
    z-index: 2; /* Keeps content above the darkened background */
}

.very-darkened > * {
    position: relative;
    z-index: 2; /* Keeps content above the darkened background */
}

.modal-dialog.modal-90 {
    min-width: 80%;
    min-height: 92%;
    max-width: 90%;
    margin: auto;
}

.modal-dialog.modal-90 .modal-content {
    height: 90%;
}

#post_ment_mess:empty:before {
    content: attr(data-placeholder);
    color: #888;
}

#post_ment_mess {
    min-height: 60px;
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
}

/*.prod-img { max-width:100%;max-height:250px;transition: transform .5s ease;object-fit: cover;}*/
.prod-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: inherit; /* Background color is set inline */
    margin: 5px;
    min-height: inherit; /* Minimum height is set inline */
    color: inherit; /* Text color is set inline */
    border-radius: inherit; /* Border radius is set inline */
    box-sizing: border-box; /* Ensure padding is included in width/height calculations */
}

.prod-action-container {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.variant-select-container {
    margin-bottom: 10px;
    width: 100%;
}

.variant-select {width:100%;}

.prod-buybutt {
    width: 100%;
}

.prod-img {
    border-radius: inherit; /* Ensure the image inherits the container's border radius */
    width: 100%; /* Make sure the image takes the full width of its container */
    height: auto; /* Maintain the aspect ratio */
    transition: transform .5s ease;
}

.prod-buybutt a {
    display: block; /* Makes the button a block element to fill the width */
    width: 100%; /* Ensure the button takes up the full width */
    text-align: center;
    background-color: inherit; /* Button color is set inline */
    color: inherit; /* Button text color is set inline */
    padding: 10px 20px;
    border-radius: 5px; /* You can customize this as needed */
    box-sizing: border-box; /* Include padding in width calculations */
    text-decoration: none;
    font-weight: bold; /* Ensures text is bold */
    border: inherit; /* Border is set inline */
}

.prod-img:hover {transform: scale(1.1); } 
.prod-buybutt a:hover {opacity: 0.9;}

.card img.img-fluid {
  border-radius: 15px; /* Rounded corners */
  width: 100%;
  height: auto;
}

.card .card-img-overlay {
  top: auto;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5); /* Semi-transparent overlay */
  border-radius: 0 0 15px 15px; /* Rounded corners at the bottom */
}

.card .card-title {
  color: white;
}

.card .channel-icon {
  width: 30px; /* Adjust size as needed */
  height: 30px; /* Adjust size as needed */
  border-radius: 50%; /* Circle shape */
}

.card {border:0px; border-radius: 20px !important;background: none !important;}

.vCarousel {
  padding-left: 0px;  
  padding-right: 0px;  
  width: 98%;
  height: 280px;
}

.vCarousel-slide {
  text-align: center;
  font-size: 32px;
  background: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.vCarousel-slide img {
  display: block;
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
  object-fit: cover;
}

.vCarousel-slide:hover img {
    cursor: pointer;
    transform: scale(1.1); /* Adjust scale as desired */
}

.pCarousel {
  padding: 0px;  
  width: 96%;
  height: 650px;
}

.pCarousel-slide {
  text-align: center;
  font-size: 18px;
  background: none;
  display: flex;
  justify-content: center;
  align-items: center;
  height:90% !important;
  border-radius: 20px;
  padding:0px;
}

.pCarousel-slide img {
  display: block;
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
  object-fit: cover;

}

.pCarousel-slide:hover img {
    cursor: pointer;
    transform: scale(1.1); /* Adjust scale as desired */
}

.dark-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); /* Adjust the opacity as needed */
    z-index: 1; /* Ensure it's below the content */
}

.dark-overlay-other {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4); /* Adjust the opacity as needed */
    z-index: 1; /* Ensure it's below the content */
    margin-bottom: 30px;
}

.funnel_top_text {font-weight: 700;font-size: 20px;}
.funnel-bg-img {display: flex;align-items: center;justify-content: center;height: 100%;min-height:550px;}
.funnel-bg-img-sm {margin:0px;padding:0px;display: flex;align-items: center;justify-content: center;min-height:480px;}
.funnel-bg {position: relative;min-height:550px;padding:0px;}
.funnel-bg-sm {min-height:400px;padding:0px;}

.funnel-pad {padding-top:30px;padding-bottom:30px;} /* margin-top:-10px; */
.funnel-pad-sm {margin-top:-10px;padding-top:30px;padding-bottom:10px;}
.funnel-pad-m {padding-top:60px;padding-bottom:60px;}
.funnel-pad-l {padding-top:85px;padding-bottom:85px;}
.funnel-pad-xl {padding-top:125px;padding-bottom:125px;}
.funnel-pad-xxl {padding-top:160px;padding-bottom:160px;}
.funnel-pad-xxxl {padding-top:220px;padding-bottom:220px;}
.funnel-pad-xxl-top {padding-top:300px;padding-bottom:50px;}

.funnel-img {width:98%;margin-top:30px;margin-bottom:30px;border-radius: 20px;}
.funnel-img-sm {width:75%;margin-top:30px;margin-bottom:30px;border-radius: 20px;}
.funnel-col-img {max-width: 75%;border-radius: 20px;}
.funnel-img-mid {max-width: 30%;margin-top:30px;margin-bottom:10px;}
.funnel-single-image {margin:0px auto; max-width: 45%;}
.funnel-img-rounded {border-radius: 20px;}
.funnel-img-circle {border-radius: 50%;}
.funnel-img-square {border-radius: 0px;}
.funnel-img-slight {border-radius: 8px;}
.funnel-img-half {border-radius: 0px;border-bottom-left-radius: 20px;border-top-right-radius: 20px;}
.hidden-div { opacity: 0.5; }
.funnel_sidebar { float:left;width:25%;}
.funnel_mainbar {float:left;width:75%;padding-left: 12px;}
.funnel_sidebar_inner {width:96%;background-color:white;border:1px solid #E6E5E9;border-radius:6px!important;padding:10px;text-align:left;}
.funnel_sidebar_words {display: all;}


.funnel-butt {display: inline-block;transform-origin: center center;text-align:center;min-width:140px;margin-left:10px;transition: transform 0.3s ease, box-shadow 0.3s ease; position: relative;}
.funnel-butt-shop {display:flex; justify-content: center; align-items: center;width:100%;transition: transform 0.3s ease, box-shadow 0.3s ease;}

.funnel-butt-1 {border-radius:18px;box-shadow:2px 2px #555;padding:8px;padding-left:30px;padding-right:30px;
                font-size:20px;font-weight:bold;padding-top:10px;cursor: pointer;white-space: nowrap;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.funnel-butt-2 {border-radius:20px;padding:14px;padding-left:30px;padding-right:30px;
                font-size:20px;font-weight:bold;padding-top:12px;cursor: pointer;white-space: nowrap;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.funnel-butt-3 {height:50px;border-radius:50px;box-shadow:2px 2px #555;padding:14px;padding-left:30px;padding-right:30px;
                font-size:20px;font-weight:bold;padding-top:12px;cursor: pointer;white-space: nowrap;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.funnel-butt-4 {height:50px;border-radius:50px;padding:14px;padding-left:30px;padding-right:30px;
                font-size:20px;font-weight:bold;padding-top:10px;cursor: pointer;white-space: nowrap;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.funnel-butt-5 {border-radius:0px;box-shadow:2px 2px #555;padding:14px;padding-left:30px;padding-right:30px;
                font-size:20px;font-weight:bold;padding-top:12px;cursor: pointer;white-space: nowrap;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.funnel-butt-6 {border-radius:0px;padding:14px;padding-left:30px;padding-right:30px;
                font-size:20px;font-weight:bold;padding-top:12px;cursor: pointer;white-space: nowrap;transition: transform 0.3s ease, box-shadow 0.3s ease;}  
.funnel-butt-7 {border-radius:56px;padding:16px 30px; scale: 1;
                font-size:20px;font-weight:bold;padding-top:12px;cursor: pointer;white-space: nowrap;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.funnel-butt-7:before {
  background-color: initial;
  background-image: linear-gradient(#fff 0, rgba(255, 255, 255, 0) 100%);
  border-radius: 125px;
  border-top-right-radius: 300px;
    border-top-left-radius: 300px;
  content: "";
  height: 50%;
  left: 4%;
  opacity: .5;
  position: absolute;
  top: -1px;
  transition: all .3s;
  width: 92%;
}

.funnel-butt-8{
  border-radius: 12px;
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  font-weight: bold;
  outline: 0;
  padding: 10px 21px;
  position: relative;
  text-align: center;
  transition: all .3s;
}

.funnel-butt-8:before {
  background-color: initial;
  background-image: linear-gradient(#fff 0, rgba(255, 255, 255, 0) 100%);
  border-radius: 10px;
  content: "";
  height: 50%;
  left: 0%;
  opacity: .5;
  position: absolute;
  top: 0;
  transition: all .3s;
  width: 100%;
}
.funnel-butt-9{
  border-radius: 4px;display: inline-block;padding: 10px 16px;position: relative;text-align: center;scale: 1;font-size:20px;font-weight:bold;cursor: pointer;white-space: normal;transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.funnel-butt:hover {
  transform: scale(1.9);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
  transform: translateY(-4px);
}

.funnel-butt-shop:hover {
  transform: scale(1.9);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
  transform: translateY(-4px);
}                              

.funnel-center-vert{
  display: flex; flex-direction:column; justify-content: center;
}

.left-inner-links {padding-left: 30px;}
.funnel_navi {display: none;z-index:9999;font-size:20px;position: fixed; left:0px; height:100%;width:280px;padding:10px;padding-top:0px;text-align:left;background-color:#fff;border-right:2px solid #ccc;color:#000;}
.funnel-emote {display:inline-block;background-color: #F0F1F3;white-space:nowrap;padding:6px;padding-left:10px;padding-right:10px;margin:3px;margin-bottom:10px;border-radius:20px;font-weight: bold;color:#000;}
.funnel-edit-button {position:absolute;right:20px;top:20px;height:40px;font-size:14px;border-radius:0px;background-color:#1D56F7;z-index:1000;color:#fff;text-align:center;cursor:pointer; border-radius: 6px; padding-top: 5px; font-weight: bold;}
.editHov .funnel-edit-button {opacity: 0; transition: all .3s ease;}
.editHov:hover .funnel-edit-button {opacity: 1;}
.editHov.darkened {overflow: unset!important;}
.editHov:hover{border: none;outline: 4px dashed #41EFFF;outline-offset: -4px;box-sizing: border-box;}
.funnel-edit-popover {transition: all .4s ease;font-family: 'Roboto', sans-serif !important;position:fixed;right:-400px;top:0px;width:400px;max-width:90%; background-color: #fff;border-radius:0px;padding: 0px; z-index:1002;overflow-y: scroll;; height: 100vh; overflow-y: scroll;}
.topVisEdit{position: sticky;padding: 16px 16px 0px; margin-bottom: 16px; top: 0; background-color: white; z-index: 1000; border-bottom: 1px solid #E6E5E9; padding-top: 5px;}
.botVisEdit{position: sticky; bottom: 0; background-color: white; padding: 16px; z-index: 1000; box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.20), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);}
.roboto{font-family: 'Roboto', sans-serif !important;}
.fun_big_link {transition: all ease .4s;margin: 1% 0%;font-weight:400;width:90%;padding:8px;text-align:left;font-size:14px;cursor:pointer;color:#4D4C66; border-radius: 4px;display: flex;align-items: center;}
.fun_big_link i{width: 20px; display: flex; justify-content: center;}
.fun_big_link span{display: flex; align-items: center;}
.fun_box_link {transition: all ease .4s;width:100%;text-align:left;font-size:14px;cursor:pointer; border-radius: 4px; margin: 0; display: flex; align-items: center;}
.fun_box_link:hover{
  background: #01002514; 
}
.fun_box_link p{
  width: 100%;
  padding: 4px;
    padding-left: 40px;
}
.fun_reg_link {width:100%;padding:2px;text-align:left;font-size:14px;cursor:pointer;}
.fun_box_butt {width:90%;padding:4px;text-align:center;font-size:14px;cursor:pointer;border-radius:8px;margin:4px;background: linear-gradient(to right, #1753F8, #697FEC);color:#fff;transition: all 0.3s ease-in-out;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);}
.fun_side_link {background-color: white;border-radius: 4px!important;margin:0px;font-weight:400;width:100%;padding:4px;padding-left:12px;padding-top:6px;text-align:left;font-size:16px;cursor:pointer;color:#333;margin-bottom: 2px;transition: all 0.3s ease-in-out;}
.fun_box_butt:hover {
    transform: translateY(-4px); /* Raises the element up by 10px */
    background-color: #feb47b; /* Change to a solid color */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* Increase shadow for emphasis */
}
.fun_side_link:hover{
    /* transform: translateY(-2px); Raises the element up by 10px */
     /*font-weight: bold; Change to a solid color */
     /*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); Increase shadow for emphasis */ 
     background-color: #01002514;
}
.fun_side_link.active{
  background-color: #01002514;
    color: #1D56F7;
    font-weight: bold;
}
#cookie-consent-overlay {
    position: fixed; bottom: 40px; left: 0; right: 0; margin: auto; width: 80%; max-width: 800px; min-height: 100px;
    background-color: rgba(255, 255, 255, 0.8); color: #000; text-align: center; padding: 15px; border-radius: 10px; z-index: 9999;
    display: inline-block; box-shadow: 0px 0px 15px rgba(0,0,0,0.7); line-height: 18px;
 }

#cookie-consent-overlay button {
    margin: 5px auto; padding: 8px 20px; border: none; border-radius: 5px; cursor: pointer; height:32px; background-color: #000; color: #fff; margin-left:10px;
}

#cookie-consent-overlay button:hover {
    opacity: 0.9;
}

.mob_main_link {width:100%;padding:2px;text-align:center;font-size:16px;}
.edit-funnel-section {cursor: default;padding:15px;background-color: #fff;border-radius: 10px;font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section a{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section select{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section textarea{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section input{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section b{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section div{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section p{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section h2{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section option{font-family: 'Roboto', sans-serif !important;}
.edit-funnel-section span{font-family: 'Roboto', sans-serif !important;}

.para-format {display:none;background: #fff;border-radius: 20px;padding: 10px;margin:10px;margin-top: 0px;font-size: 16px;border:1px solid #CBD0DD;}
.fun-ana-boxes {text-align:center;width:100%;padding:20px;margin:8px;font-size: 32px;background-color: #fff;border-radius: 30px;border:1px solid #CBD0DD;}
.fun-active {background: #E8EEFE; border-radius: 4px;}
.rotate90{transform: rotate(90deg);}
.flex{display: flex;}

/* Active styles (when a link is selected) */
.fun_box_link.fun-active p {
  background-color: #01002514;
  color: #1D56F7;
  font-weight: bold;
}

.fun_big_link.fun-active.own-link {
  background-color: #01002514;
}

.fun_big_link:hover {
  background-color: #01002514;
}

.fun_big_link.fun-active p {
  color: #1D56F7;
  font-weight: bold;
}
.fun-active div span{color: #1D56F7;}
.fun-active i {
  transform: rotate(90deg) ;
  /* color: #1D56F7!important; */
  padding-top: 0px;
  padding-right: 0px!important;
}
.fun-active.icon{
  color: #1D56F7!important;
  background-color: transparent;
}
.fun-active p i {
  transform: rotate(0deg)!important;
  color: black;
}
.fun-active span i {
  transform: rotate(0deg) !important;
  color: #1D56F7!important;
  padding-top: 0px;
  padding-right: 0px!important;
}
.fun_box_link{
  transition: all ease .4s;
}
.fun_box_link i{
  transition: all ease .4s;
}
/* Rotate icon ONLY on hover of this .fun_box_link */
.fun_box_link:hover i {
  transform: rotate(90deg);
}

.fun_menu_heading {
  width:100%;padding:4px;text-align:left;
  color: #4D4C66;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.36px;
  text-transform: uppercase;
  padding-top: 20px;
}

#countdownTimer {
  background-color: red;
  height: 50px;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  font-size: 20px; /* Adjust based on your design */
}

.tracks {background-color:#9ADDE3;color:#333;border-radius:10px;font-size:18px;cursor:pointer;border:1px solid #ccc;box-shadow: 0 3px 3px rgba(66, 103, 178, 0.25);}
.tracks:hover{background-color:#40BFBC;color:#fff;}
.inner-circle {background:#fff;color:#333;font-family:'Spartan';border-radius:20px;width:100px;height:45px;padding:10px;font-size:12px;text-align:center;border:1px solid #ccc;box-shadow: 0 3px 3px rgba(66, 103, 178, 0.25);}
.sub-block {margin-bottom:20px;font-family:'Spartan';font-size:18px;height:250px;}

#classes {width:100%;height:100%;text-align:center;margin-top:10px;}
.classes-search-icon {float:left;padding-top:8px;padding-right:5px;font-size:18px;}
.search-box {float:left;font-size: 16px; 
  padding: 1%; border-radius: 12px;
  border: 1px solid #ccc;padding-left:10px;width:85%;height:38px;}

.search-box-vis {float:left;font-size: 16px; 
  padding: 1%; border-radius: 12px;
  border: 1px solid #ccc;padding-left:10px;width:85%;height:38px;}

#video-container {
    position: relative;
    /* Other styling for the video container */
}

.navigation-arrow {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    /* Add more styling (size, color, etc.) as needed */
}

#arrow-up-video {
    top: 10px; /* Adjust as needed */
     color:#fff;
}

#arrow-down-video {
    bottom: 10px; /* Adjust as needed */
    color:#fff;
}

.active-dot {
  display: block;
  content: " ";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1px solid white;
  position: absolute;
  background-color:green;
  right: 1px;
  bottom: 0px;
}  

.in-active-dot {
  display: block;
  content: " ";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1px solid white;
  position: absolute;
  background-color:#777;
  right: 1px;
  bottom: 0px;
}  

.ani-fadein {
    opacity:0;
}

.ani-fadeonload {
    opacity:0;
}

.ani-fadeinleft {
    opacity:0;
    margin-left:-300px; 
    max-width:100%;
}

.ani-slideinleft {
    margin-left:-300px;
    max-width:100%;
}

.ani-slideinright {
    opacity: 0;
    transform: translateX(100%);
    transition: opacity 0.25s, transform 0.25s;
}

.ani-slideinright.visible {
    opacity: 1;
    transform: translateX(0);
}

.ani-popin {
    opacity: 0;
    transform: scale(0.75);
}

.ani-scale {
    opacity: 0; /* Initially invisible */
    transform: scale(1); /* Default scale */
    transition: background-size 0.5s ease-in-out, opacity 0.5s ease-in-out;
}

/* When the element is in focus or scrolled into view */
.scale-in {
    opacity: 1; /* Make it visible */
    background-size: 120%;
}

.ani-bounce {
    opacity: 0;
    transform: translateY(20px);
}

.ani-skewin {
    opacity: 0;
    transform: skew(-10deg, -5deg);
}

.ani-zoomin {
    opacity: 0;
    transform: scale(0.8);
}

.ani-rotatein {
    opacity: 0;
    transform: rotate(-10deg);
}

.ani-slideinbottom {
    opacity: 0;
    transform: translateY(50px);
}


.opening-box{text-align:left; padding:20px; font-size:20px; }

.chat-left {min-height:40px;margin:1px;float:left;max-width:70%;min-width:300px;padding:7px;background-color:#eee;color:#333;font-size:14px;line-height:18px;border-radius:12px;border:1px solid #ccc;text-align:left;}
.chat-right {min-height:40px;margin:1px;float:right;max-width:70%;min-width:300px;padding:10px;background-color:#0084FF;color:#fff;font-size:14px;line-height:18px;border-radius:12px;border:1px solid #ccc;text-align:left;}
.chat-long {min-height:40px;margin:1px;float:left;width:100%;padding:7px;background-color:#eee;color:#333;font-size:14px;line-height:18px;border-top:1px solid #ccc;text-align:left;}
.chat-left-mini {min-height:40px;margin:1px;float:left;max-width:70%;min-width:50px;padding:7px;background-color:#eee;color:#333;font-size:14px;line-height:18px;border-radius:12px;border:1px solid #ccc;text-align:left;}
.chat-right-mini {min-height:40px;margin:1px;float:right;max-width:70%;min-width:50px;padding:10px;background-color:#0084FF;color:#fff;font-size:14px;line-height:18px;border-radius:12px;border:1px solid #ccc;text-align:left;}
.convo-box {width:100%;border:1px solid #eee; background-color:#fff; min-height:400px; max-height:400px; overflow-y:auto; display:flex; flex-direction:column-reverse;padding:5px;}
.convor-box {width:98%;border:1px solid #eee; background-color:#fff; min-height:300px; max-height:350px; overflow-y:auto; display:flex; flex-direction:column-reverse;padding:5px;}
.chan-con {float:left;width:18%; background-color:#fff; min-height:400px; max-height:400px; padding:6px; overflow-x:scroll; text-align: left;}
.convo-con {float:left;width:80%;}
.chan-links {text-decoration:none;color:#333;font-weight: normal;}
.chan-sel {font-weight: bold;color:#000;}

.chat-long-live {min-height:40px;margin:1px;float:left;width:100%;padding:7px;background-color:#fefefe;color:#333;font-size:14px;line-height:18px;border-top:1px solid #ccc;text-align:left;}
.chat-long-paid {min-height:40px;margin:1px;float:left;width:100%;padding:7px;background-color:#D5C2F4;color:#333;font-size:14px;line-height:18px;border-top:1px solid #ccc;text-align:left;}

.viewer_butt {cursor:pointer;float:left;margin-right:10px;width:120px;background-color:#999;font-size:14px;text-align:center;color:#fff;border-radius:10px;font-weight: bold;}
.giver_butt {cursor:pointer;float:left;margin-right:10px;width:120px;background-color:#D5C2F4;font-size:14px;text-align:center;color:#fff;border-radius:10px;font-weight: bold;}
.viewer_butt:hover {transform: translateY(-3px);background-color: #777;}
.giver_butt:hover {transform: translateY(-3px);background-color: #777;}
.lil_giver_butt {cursor:pointer;float:left;margin-right:10px;width:60px;background-color:#D5C2F4;font-size:14px;text-align:center;color:#fff;border-radius:10px;font-weight: bold;}

.last-cont {width:20px;padding:3px;padding-left:8px;padding-right:8px;padding-top:5px;background-color: red;color:#fff;font-weight: bold;font-size: 13px;border-radius: 50%;text-align:center;}
.side-img {border-radius:50%;width:16px;height:16px;margin:2px;}

.calendar { margin: 0px 40px; }
.calendar-day {width: 13%; border: 2px solid rgb(235, 235, 235); border-right-width: 0px; border-bottom-width: 0px; min-height: 150px; border-radius: 8px; margin: 1px; background-color:#F1F2F5;}
.calendar-no-current-month { color: rgb(200, 200, 200);}
.calendar-day > time {position: absolute; display: block; top: 0px; left: 0px; font-size: 20px; font-weight: 300; width: 100%; padding: 10px 10px 3px 0px; text-align: right; color:#000;}
.event-item {width:90%;color:#000;padding:5px;margin:1px;border-radius:4px;min-height:30px;cursor: pointer;font-size: 12px;font-weight: bolder;}

 /* O L D ---- V U R S I T Y ------ */
 .camp_main{width:100%;background:#eee;border-radius:5px;padding:10px;color:#000;} 
 #video{width:100%;font-size: 14px;font-family: 'Spartan', sans-serif;}
 .circle {float:left;position:relative;margin:30px;width:160px;padding-top:60px;height:100px;
         background-color:#333;border-radius:50%;border:10px solid #fff;cursor:pointer;}
.lesson_circle{float:left;width:160px;height:160px;margin-right:1%;border:10px solid #fff;border-radius:50%;}         
.topic {float:left;padding:2%;margin:1%;border-radius:20px;min-width:10%;text-align:center;
        height:20px;font-size:14px;background:#fff;border:2px solid #ccc;}              
.prog1 {border-top-color:#ff5b10;}
.prog2 {border-top-color:#ff5b10;border-right-color:#ffdd6b;}
.prog3 {border-top-color:#ff5b10;border-right-color:#ffdd6b;;border-bottom-color:#00db00;}
.prog4 {border-top-color:#ff5b10;border-right-color:#ffdd6b;;border-bottom-color:#00db00;border-left-color:#00BEFF;}
.prog5 {border-color:#00BEFF;}
.spanny{width:90%;border-radius:10px;height:30px;padding:2%;font-size:16px;}
.lesspoints {border-radius:10px;padding:1%;width:100%;background-color:#ccc;font-size: 14px;margin-top:1%;line-height: 18px;}
.lesson_message {padding:1%;}
.lesson_notes {padding:1%;width:96%;display:none;}
#lesson_note {width:95%;height:80px;}
.course {float:left;padding:1%;margin:1%;border-radius:20px;min-width:10%;text-align:center;height:20px;font-size:14px;background:#fff;border:1px solid #ccc;}
.trivia_option {width:90%;padding:1%;margin:1%;border-radius:10px;background:#00BEFF;color:#fff;cursor:pointer;text-align:center;}
.trivia_option:hover {background:#00db00;}
.trivia_green {background:#00db00;}
.trivia_red {background:#ff4000;}
.green_button{float:right;background:#00db00;padding:3px;min-width:50px;border-radius:10px;font-size:14px;cursor:pointer;color:#fff;font-weight:bold;text-align:center;}
.green_button:hover {background:#00BEFF;}
.lesson_item {width:96%;border:1px dashed #ccc;padding:2%;background-color: #eee;border-radius: 10px;}
.review_box {width:100%; text-align: left;padding:20px;background-color: #fff;border-radius:20px;}
.orangey_butt {width:100%;padding:12px;color:#fff;font-weight:bold;margin:6px;border-radius:12px;height:45px;
               text-align:center;margin-top:-1px;background:#333; color:#fff;font-size:20px;border-radius:12px;cursor:pointer;
               border:0px;padding-left: 20px;padding-right: 20px;
               box-shadow: 0 2px 2px rgba(0,0,0,.3);-webkit-box-shadow: 0 2px 2px rgba(0,0,0,.3);}

.resp_box {width:100%;text-align:center;padding:10%;background-color:#999;color:#fff;line-height:18px;}
.vote_box {width:100%;text-align:center;padding:10%;background-color:#40BFBC;color:#fff;line-height:18px;}
.inner_vote {background-color:#40BFBC;border-radius: 10px;box-shadow: 0 3px 3px rgba(66, 103, 178, 0.25);}
.inner_vote:hover {background-color:#fa702b;}
.b10 {border-radius: 10px;}
.minivote {background-color:#fff;color:#333;padding-top:2%;
  margin-bottom: 20px;
  box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
  border:0px;border-radius:4px;border-bottom: 1px solid #ccc;
  position: relative;
  margin: 1px;
  padding: 2%;}

.inner_comment {background-color:#fafafa;border-radius:12px;padding:10px;margin:3px;line-height:16px;}
.debate-side-one {background-color:#5CE1E6;}
.debate-side-two {background-color:#FFBD59;}
.debate-bubble {margin:3px;border-radius:8px;padding:10px;padding-top: 20px;}
.hall_question {margin-bottom:30px;padding-bottom:30px;border-bottom:1px solid #ccc;}
.row_content {width:100%; text-align: left; padding:30px; padding-top:50px;}
.row_content_fb {width:100%; text-align: left; padding:20px; padding-top:0px;}
.blue_content {margin:0px;padding:15px;text-align:center;background-color:#62afa3;color:#fff;height:100%;min-height:800px;}
.squeeze {margin:0px auto;max-width:800px;}
.squeeze-feed {margin:0px auto;max-width:850px;}
.squeeze-large {margin:0px auto;max-width:1300px;}
.squeeze-min {text-align:center;min-height:200px;padding-top:0px;margin:0px auto;max-width:650px;}
.squeeze-grid {margin:0px auto;max-width:450px;min-height: 150px;}
.just-min {text-align:left;min-height:200px;padding-top: 0px;}
.boldy {font-weight:bold;}

.dropdown-menu {
  position: absolute;
  width: 200px;
  z-index: 9999; 
  transform: translate3d(0px, 38px, 0px);
  top: -10px;
  left: -150px;
  will-change: transform;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
  background-color:#fff;
  color:#333;
}

.position-relative {
    position: relative;
}

.da_prof_pic {width:40px;height:40px;border-radius:50%;margin-right:10px;}
.lil_prof_pic {width:35px;height:35px;border-radius:50%;margin-right:10px;}
.liler_prof_pic {width:30px;height:30px;border-radius:50%;margin-right:10px;}
.lilest_prof_pic {width:25px;height:25px;border-radius:50%;margin-right:10px;}

.feed-class-img {width:38px;height:38px;border-radius:50%;border:2px solid #fff;}
.live-class-img {width:45px;height:45px;border-radius:50%;border:2px solid #fff;}
.feed-top-link {color:#333;font-weight: bolder;}
.top-top-link {color:#fff;font-weight: bolder;}

.guud-benefit {width:100%;padding:10px;margin:4px;border-radius: 20px;text-align: left;border:1px solid #000;background-color: #fff;font-size: 16px;font-weight: bolder;}

.row_content ul li {
  display: inline-block;
  padding: 0 10px;
  font-size: 16px;
  cursor: pointer; }
  .row_content ul li.active {
    color: #40BFBC;
    border-bottom: 2px solid #40BFBC;
    font-weight: 600; }
  .row_content ul li:hover {
    color: #40BFBC; }
  .row_content ul li.active:hover {
    color: #40BFBC; }
  .row_content ul li .fa {
    margin: 0; }
.row_content div.right span {
  width: 100%;
  padding: 6px 35px;
  border-radius: 20px;
  background: #fff;
  color: #333;
  font-size: 15px; }

.fb-login {
  width:94%;
  margin: 0px auto;
  margin-bottom:10px; 
  border-color: rgba(37, 93, 173, 0.25);
  color: #fff;
  box-shadow: 0 4px 10px rgba(66, 103, 178, 0.35);
  padding: 0.8em 1.4em;
  font-weight: 500;
  border-style: solid;
  border-width: 1px;
  border-radius: 5px;
  transition: all ease-in-out 0.05s;
  display: inline-block;
  text-align: center;
  text-transform: none;
  height: auto;
}

.s3 {color:#2194B6;font-size: 16px;margin:1px;}
.s4 {color:#fa702b;font-size: 18px;margin:1px;}
.s5 {color:#9ADDE3;font-size: 20px;margin:1px;}
.s6 {color:#999;font-size: 22px;margin:1px;}
.s7 {color:#333;font-size: 24px;margin:1px;}
.s8 {color:#111;font-size: 26px;margin:1px;}

.rotate-360 {
  -moz-transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
}

.rotate-90 {
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.rotate-180 {
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.rotate-270 {
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}

.live-container{padding-right: 10px;}
.live-icon {float:left;width:50px;}
.live-about {float:left;width:85%;}
.live-overlay {position: absolute; top: 10px; right: 20px; padding: 5px; background-color: red; color: white; font-weight: bold; z-index: 999;}
.live-end-stream {width:200px;padding:8px;text-align:center;border-radius: 10px;background-color: red;color:#fff;font-size: 16px; font-weight:bold;}

.user-nots {display:none;width:350px;height:400px;position:fixed;left: 73%;top:7%;overflow-y:auto;background-color:#fff;
            border-radius:6px;box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);-webkit-box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
            padding:0px;z-index:1001;font-size: 14px;line-height: 16px;}
.list-nots {width:100%;padding:5px;padding-top:15px;padding-bottom:10px;text-align: left;}
.not-new {background-color: #e2eaed;}
.list-nots:hover {background-color: #ccc;cursor: pointer;}
.actn {font-weight: bold;}

.dropdown-item {
  display: block;
  width: 100%;
  padding: 2%;
  padding-left: 20px;
  clear: both;
  font-weight: normal;
  color: #333;
  height: 35px;
  margin: 0px;
  text-align: inherit;
  white-space: nowrap;
  cursor: pointer;
  background-color: transparent;
  border: 0; }
  .dropdown-item:hover {
    color: #000;
    text-decoration: none;
    background-color: #f4f8f9; }

.logo_img{ width:90%;max-width:120px;margin-top:4px; }

.item {
  width: 100%;
  text-align: center; }

.video-item {
  display: block;
  text-decoration: none !important;
  margin-bottom: 30px; }

.video-img {
  position: relative; }

.video-item .badge-views {
  position: absolute;
  right: 0;
  bottom: 0; }
.video-item h3 {
  font-size: 18px;
  margin: 5px 0 0;
  color: rgba(255, 255, 255, 0.5); }

#modal-video .modal-content {
  background-color: #000; }
#modal-video .modal-body {
  padding: 10px; }
#modal-video button.close {
  background-color: #fff;
  font-weight: 300;
  width: 34px;
  height: 34px;
  border-radius: 34px;
  opacity: 1;
  filter: alpha(opacity=100);
  position: absolute;
  right: -10px;
  top: -10px;
  z-index: 100;
  font-size: 40px;
  line-height: 24px; }
  #modal-video button.close span {
    position: relative;
    top: -2px; }

.faq_popup {width:45px;font-size:14px;border-radius:50px;border:1px solid #fff;background-color:#000;padding:10px;position:fixed;right:15px;bottom:15px;z-index:10001;color:#fff;text-align:center;cursor:pointer;transition: transform .5s ease;}
.faq_popup:hover {transform: scale(1.3, 1.3); }

.vision_butt {width:60px;font-size:14px;border-radius:50px;border:1px solid #fff;background-color:#000;padding:10px;position:fixed;right:30px;top:16%;z-index:10001;color:#fff;text-align:center;cursor:pointer;}
.vision_butt a {
  color: #fff;
  font-size: 16px;
}
.vision_butt:hover a {
  color: #EA2D49;
}

.class_textarea {
  width: 100%;
  min-height: 70px;
  font-size: 14px;
  border-radius: 10px;
  box-shadow: 0 0 0 1px #ccc;
  border: 5px solid transparent; 
  overflow: auto;
}

.class_comments {
  font-size: 16px; }

.class_content {
  width: 100%;
  padding-top: 10px; }

.profile_pic_holder {
  float: left;
  margin-right: 10px; }

.profile_name {
  float: left;
  padding-top: 3px;
  font-size: 14px; }

.cred {
  color: #EA2D49;
  font-weight: bold; }

.cgreen {
  color: #00BF63;
  font-weight: bold; }

.cpurp {color:#8c52ff; font-weight: bold;}  

.header_links a img.top-icons {
  margin: 1%;
  margin-top: 3px; }

.header_mobile, .nav_button, #mobile_nav {
  display: none; }

.mobile_link {
  display: block; }

.tcenter {
  text-align: center; }

.store-icon {
  margin-right: 5px;
  width: 16px;
  margin-top: -3px; }

.export_link {
  float: right;
  font-size: 16px;
  width: 120px;
  margin: 3px; }

.fileinput-button {
  position: relative;
  overflow: hidden;
  display: inline-block; }
  .fileinput-button input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    -ms-filter: 'alpha(opacity=0)';
    font-size: 200px !important;
    direction: ltr;
    cursor: pointer; }

/* Fixes for IE < 8 */
@media screen\9 {
  .fileinput-button input {
    filter: alpha(opacity=0);
    font-size: 100%;
    height: 100%; } }
#create {
  float: left;
  padding: 20px; }

.inner-feed{
  padding-right:20px;
  padding-left:25px;
}  

.progress-bar-success {
  background-image: -webkit-linear-gradient(top, #9ADDE3 0%, #40BFBC 100%);
  background-image: -o-linear-gradient(top, #9ADDE3 0%, #40BFBC 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#9ADDE3), to(#40BFBC));
  background-image: linear-gradient(to bottom, #9ADDE3 0%, #40BFBC 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#40BFBC', GradientType=0);
}

/*background-color: #f6f7f9;*/

.headliner {
  width: 96%;
  margin-left: 2%;
  background-color:#fafafa;
  clear: both;
  padding: 15px;
  text-align: left;
  border-radius: 6px;
  border: 1px solid #E6E5E9!important;
  color: #333;
  margin-bottom: 10px;
  font-size: 18px;
  box-shadow: 0 2px 2px rgba(66, 103, 178, 0.25);
}

.headliner-form {
  width: 96%;
  margin-left: 2%;
  background-color:#fafafa;
  clear: both;
  padding: 15px;
  text-align: left;
  border-radius: 30px;
  border: 1px solid #eee;
  color: #333;
  margin-top: 20px;
  font-size: 18px;
  box-shadow: 0 2px 2px rgba(66, 103, 178, 0.25);
}

.warning {width:96%; background-color: #FFE5E5; color: black; padding: 15px; text-align: left; border-radius: 12px; border: 1px solid #FFB3B3;}

.headliner-links {
  width: 96%;
  margin-left: 2%;
  background-color:#fafafa;
  clear: both;
  padding: 15px;
  text-align: center;
  border-radius: 30px;
  border: 1px solid #eee;
  color: #333;
  margin-top: 12px;
  font-size: 18px;
  min-height:45px;
  box-shadow: 0 2px 2px rgba(66, 103, 178, 0.25);
  background-color:#fff;min-height:60px;max-height: 100px;
  cursor: pointer;
}

.live-headliner {
  width: 96%;
  margin-left: 2%;
  background-color:#fafafa;
  clear: both;
  padding: 15px;
  text-align: left;
  border-radius: 10px;
  border: 1px solid #eee;
  color: #333;
  margin-top: 20px;
  font-size: 18px;
  box-shadow: 0 2px 2px rgba(66, 103, 178, 0.25);
}

.feed-headliner {
  width: 96%;
  margin-left: 2%;
  background-color: #fff;
  clear: both;
  padding: 15px;
  text-align: left;
  border-radius: 10px;
  border: 1px solid #eee;
  color: #333;
  margin-top: 20px;
  font-size: 18px;
  box-shadow: 0 2px 2px rgba(66, 103, 178, 0.25);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.switchy {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
}

.switchy input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slidery {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slidery:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slidery {
  background-color: #40BFBC;
}

input:focus + .slidery {
  box-shadow: 0 0 1px green;
}

input:checked + .slidery:before {
  -webkit-transform: translateX(18px);
  -ms-transform: translateX(18px);
  transform: translateX(18px);
}

/* Rounded sliders */
.slidery.muy_roundy {
  border-radius: 24px;
}

.slidery.muy_roundy:before {
  border-radius: 50%;
}


.topliner {
  width: 96%;
  margin-left: 2%;
  background-color: none;
  clear: both;
  padding: 20px;
  text-align: left;
  color: #333;
  padding-top: 60px;
}

.topliner_center {
  float:left;
  width: 62%;
  min-width:50%;
  background-color: none;
  padding: 20px;
  text-align: left;
  color: #333;
  padding-top: 20px;
}

.topliner_right {
  float:left;
  width: 15%;
  max-width:300px;
  min-width: 250px;
  margin-left: 1%;
  background-color:#fff;
  padding: 5px;
  padding-left: 10px;
  text-align: left;
  margin-top:2%;
  color: #333;
  padding-top: 20px;
  border-right: 1px solid #eee;
  border-radius: 12px;
}

.topliner_left {
  float:left;
  width: 15%;
  max-width:300px;
  min-width: 250px;
  margin-left: 1%;
  background-color:#fff;
  padding: 5px;
  padding-left: 10px;
  text-align: left;
  margin-top:2%;
  color: #333;
  padding-top: 20px;
  border-right: 1px solid #eee;
  border-radius: 12px;
}

.left_big_link {width:100%;padding:1px;padding-bottom:2px;text-align:left;font-size:16px;cursor:pointer;font-weight: bold;color:#000;}
.left_box_link {width:100%;padding:1px;padding-bottom:2px;padding-top:2px;text-align:left;font-size:14px;cursor:pointer;}
.mob_box_link  {width:100%;padding:10px;text-align:left;font-size:16px;cursor:pointer;background-color: #fff;color:#333}
.left_reg_link {width:100%;padding:1px;text-align:left;font-size:16px;cursor:pointer;}
.mob_main_link {width:100%;padding:2px;text-align:center;font-size:16px;}
.feed_cat_icon {width:16px;}
.feed_left_icon {width:16px;}
.guud_box {width:100%;padding:1px;font-size: 16px;}
.editable-input {width: 100%; box-sizing: border-box;}    

.black_headliner {
  width: 85%;
  background-color: rgba(0, 0, 0, 0.9);
  color: #fff;
  clear: both;
  padding: 20px;
  text-align: left;
  border-radius: 5px;
  border: 1px solid #ccc; }

 .buy_now_comments {
  background-color: #EA2D49;
  padding: 7px 17px;
  font-size: 14px;
  color: #fff;
  text-transform: uppercase;
  border-radius: 25px;
  text-align: center;
  font-family: 'Spartan', sans-serif; }
  .buy_now_comments:hover {
    background-color: #333645;
    color: #fff;
    text-decoration: none;
    cursor: pointer; } 

.follow_pic {
  width: 50px;
  border-radius: 50%;
  margin: 2px;
  border: 2px solid #555; }

.email-form {
  width: 80%;
  font-size: 18px;
  height: 35x;
  padding: 10px;
  border-radius: 5px;
  margin: 3px;
  background-color: #fff; }

#create {float:left;padding:20px;}
.black_headliner{width:85%;background-color:rgba(0,0,0,0.9);color:#fff;clear:both;padding:20px;text-align:left;border-radius:5px;border:1px solid #ccc;}
.follow_pic {width:50px;border-radius:50%;margin:2px;border:2px solid #555;}
.email-form{width:80%;font-size:18px;height:35x;padding:10px;border-radius:5px;margin:3px;background-color:#fff;}

/* --- main containers --- */
#main_content {

  float: left;
  width: 100%;
  text-align: left;
  height: 100%;
  background: #fff; }

#main_center {
  width: 100%;
  height: 100%;
  padding-top: 0px;
  vertical-align: baseline; }

#content {
  float: left;
  width: 100%;
  height: 100%;
  text-align: left; }

#center_content {
  width: 100%;
  height: 100%;
  min-height: 717px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 0px;
  padding-bottom: 30px;
  vertical-align: baseline;
  background: #000; }

.inner_wrapper {
  float: left;
  width: 96%;
  background-color: #f4f8f9;
  min-height: 80px;
  border-radius: 5px;
  padding: 20px; }

.righty {
  float: right; }

.lefty {
  float: left; }

/* --- footer --- */
body {
  position: relative; }

#footer {
  min-height: 45px;
  width: 100%;
  /* background: #F0F2F5; */
  background-color: #fff;
  color: #333;
  padding-bottom: 20px;
  padding-top: 20px; font-size: 10px;}

#footer-content {
  text-align: center;
  vertical-align: middle;
  width: 100%;
  margin: auto;
  color: #333; font-size: 14px;}

#footer-links {
  margin-left: auto;
  margin-right: auto;
  font-weight: bold; }
  #footer-links a {
    color: #333;
    margin-bottom: 10px;
    display: inline-block;
    font-size: 12px; }

#dabottom {
  float: left;
  width: 94%;
  text-align: center;
  display: none; }

/* --- main --- */
#error {
  font-size: 22px;
  color: #333;
  font-weight: bold;
  margin: 5px;
  padding: 5px; }

#error2, #error3, #error4 {
  font-size: 22px;
  color: #333;
  font-weight: bold;
  margin: 1%;
  padding: 1%; }

#store_sign {
  padding: 20px;
  min-height: 250px;
  padding-top: 40px; }

#success {
  font-size: 22px;
  color: #333;
  font-weight: bold;
  margin: 10px;
  border-radius: 10px;
  width: 50%;
  padding: 10px;
  margin-left: 25%; }

#center_inner_content {
  text-align: center; }

.main-section {position:relative;}  

.center-box {
  position: absolute;
  left: 20%;
  top: 33%;
  width: 60%;
  height: 52%;
  min-height: 400px;
  z-index: 1; }

.main-logo {
  position: absolute;
  left: 30%;
  top: 15%;
  width: 40%;
  z-index: 201; }

#cart_error {
  position: relative;
  left: 25%;
  top: 80%;
  width: 55%;
  border-radius: 10px;
  height: 50px;
  z-index: 201;
  font-size: 18px; }

.listo {
  min-height: 50px;
  margin: 1px;
  padding: 1%;
  color: #000;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  background-color: #fff; }

.listo_checked {
  min-height: 50px;
  margin: 1px;
  padding: 1%;
  color: #000;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  background-color: #E3FEE5; }

.listo2 {
  min-height: 50px;
  margin: 1px;
  padding: 1%;
  padding-top: 4%;
  color: #000;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
  border-radius: 6px;
  background-color: #fff;
  font-size: 16px;
  padding-left: 4%; }

.box {
  height: 100%;
  margin: 1%;
  padding: 1%;
  margin-top: 2%;
  color: #000;
  width: 50%;
  margin-left: 25%;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  position: relative;
  background-color: #fff; }

 .text-checked-list {
      text-align: left;
      padding-left: 40px; }
      .text-checked-list .text-checked-item {
        margin-bottom: 10px;
        display: flex;
        align-items: flex-start; }
        .text-checked-list .text-checked-item .checked-icon-wrapper {
          padding-right: 15px; }
          .text-checked-list .text-checked-item .checked-icon-wrapper .checked-icon {
            width: 20px; }
        .text-checked-list .text-checked-item .item-text {
          font-size: 16px; font-weight: bold;}
      .text-checked-list .text-checked-list-call-to-action {
        margin-top: 20px; } 

.bigbox {
  background-color: #fff;
  border-radius: 6px;
  height: 100%;
  padding: 1%;
  margin-top: 0%;
  color: #000;
  width: 96%;
  margin-left: 2%;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
  height: 100%;
  min-height: 700px;
  font-size: 18px;
  line-height: 25px;
  margin-bottom: 45px; }
  .inner_box {
    background-color: #8FD7FF;
    height: 100%;
    padding: 2%;
    margin-top: 2%;
    color: #000;
    margin-left: 2%;
    width: 96%;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    position: relative;
    font-size: 18px; }
  
  .inner_bottom {
    position: absolute;
    bottom: 0;
    width: 100%;
    margin-left: -2%;
    margin-top: -10px;
    background-color: #E8F1F6;
    font-size: 16px;
    font-weight: normal;
    padding: 10px; }
  
  .minibox {
    border: 1px solid #ccc;
    margin-bottom: 20px;
    box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    position: relative;
    margin: 1px;
    padding: 20px; 
    background-color: #9ADDE3;
    color:#333;
  }
  
  .minibox_top {
    margin-bottom: 20px;
    box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    position: relative;
    margin: 1px;
    padding: 0px;
    padding-top:0px; 
    background-color: #fff;
    color:#333;
    height:250px;
  }
  
  .mini_container {margin-bottom:20px;min-height:435px;}
  
  .mini_inner {
    position:absolute;left:0;bottom:0;width:100%;padding:10px;font-size:12px;text-align: center; background:url('../img/minibg.png') repeat-x;text-shadow: 0 1px 0 white;
  }
  
  .minibox_middle {
    margin-bottom: 20px;
    box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.1);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    position: relative;
    margin: 1px;
    padding: 2%;
    padding-top:4%; 
    background-color: #fff;
    color:#333;
    min-height: 180px;
  }
  
  .minibox_middle:hover {background-color: #eee;}
  
  .minibottom {
    position:absolute;left:0;bottom:0;width:100%;padding:10px;background-color:none;font-size:12px;text-align: left;
  }  

.number{
  height: 22px;
  width:  22px;
  background-color: #d63031;
  border-radius: 20px;
  color: white;
  font-size: 10px;
  line-height: 10px;
  text-align: center;
  border-style: solid;
  border-width: 2px;
  margin: 0px;
  margin-left:-3px;
  float: left;
  padding: 3px;
  padding-top: 4px;
}

.number:empty {
   display: none;
}

.notBtn{
  transition: 0.5s;
  cursor: pointer
}
@media screen and (max-width: 767px) and (min-width: 480px) {
  .projCardContain{
    max-width: 48%!important;
  }
}

.minibox_top {
  width: 100%;
  text-align: left;
  padding: 10px;
  font-size: 16px;
  padding-bottom: 15px;
}

.minibox_text {
  width: 100%;
  text-align: center;
  padding: 10px;
  height: 100px;
  font-size: 15px; }

.longtext {
  width: 94%;
  height: 45px;
  font-size: 16px; 
  padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;
 }

 .longsel {
  width: 94%;
  height: 55px;
  font-size: 16px; 
  padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;
 }

 .shortsel {
  width: 40%;
  height: 55px;
  font-size: 16px; 
  padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;
 }

.longertext {
  width: 94%;
  height: 50px;
  font-size: 16px;
  padding: 1%;
  border-color: #ccc; 
  border: 1px solid #ccc;
  border-radius: 12px; padding-left: 20px;
}

.short_text {
  width: 60%;
  height: 50px;
  font-size: 16px;
  padding: 1%; border-radius: 12px; padding-left: 20px; border: 1px solid #ccc;}  

.search_text {
  width: 60%;
  height: 35px;
  font-size: 12px;
  padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;}

.shorter_text {
  width: 30%;
  height: 45px;
  font-size: 18px; padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;}

.smalltext {
  width: 15%;
  height: 45px;
  font-size: 16px;  
  padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;
}

.longtextarea {
  width: 80%;
  height: 115px;
  font-size: 18px; 
  padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;
}

.summertextarea {
  width: 98%;
  height: 450px;
  font-size: 16px; 
  padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;
}

.longertextarea {
  width: 98%;
  height: 145px;
  font-size: 16px; padding: 1%; border-radius: 12px; padding-left: 20px;
  border: 1px solid #ccc;}

.white_row {
  width: 100%;
  border: 1px solid #ccc;
  background: #fff;
  color: #333;
  font-size: 16px; }

.gray_row {
  width: 100%;
  border: 1px solid #ccc;
  background-color: #f4f8f9;
  color: #ccc;
  font-size: 16px; }

.under_error {
  display: none;
  width: 100%;
  padding: 5px; }

.inner_heading {
  font-size: 16px;
  margin-top: 10px;
  font-family: 'Spartan', sans-serif;
 }

.inner_text {
  font-size: 38px;
  padding: 10px;
  color: #fff; }

.inner_small_text {
  font-size: 14px;
  padding: 5px;
  color: #1fbb68;
  font-family: 'Spartan', sans-serif;
  font-weight: normal;
  line-height: 20px;
  margin-bottom: 5px; }

.join-fb-connect a {padding: 0 0 0 0; height: 52px;background: url('../img/fbconnect.png') no-repeat; background-position: 0 0; width: 320px; margin-bottom: 7px;cursor: pointer;}
a.signup-button {width: 318px;height: 49px;background: url('../img/fbconnect.png');background-position: 0 0;text-indent: -9999px;margin: 10px auto 0 auto;display: block;}
a.signup-button:hover {background-position: 0 -55px;}
a.signup-button:active {background-position: 0 -106px;}
.signin_prompt{ width:960px;height:100px;background-color:#CFD2D4;padding:20px;}
.tagline {font-family: 'Spartan', sans-serif;color: #777; display: block; font-size: 32px; font-weight: lighter; margin: 0 auto; padding: 0px; text-align: left;}
.subtag {font-family: 'Spartan', sans-serif;font-size: 20px;color: #6E7172;font-weight: lighter;padding: 0px; padding-left:10px;text-shadow: 0 1px 0 white;text-align: left;}
.info-green h3, .info-green .info-box-number, .info-green .infolg-box-number, .info-green{color: #1fbb68;}
.info-red h3, .info-red .info-box-number, .info-red .infolg-box-number, .info-red{color: #e46f6f;}
#mymodal {
    z-index: 9999; /* or higher, depending on your other elements */
}

/* START PAGE */
.getting_started {
  float: left;
  padding: 10px;
  background-color: #FF9999;
  width: 87%;
  font-size: 20px;
  border-radius: 5px;
  margin-bottom: 5px; }

/* PROFILE */
.myprofile_options {
  float: right;
  margin-right: 100px;
  margin-top: -10px;
  font-size: 16px; }

.larger_profile_pic {
  float: left;
  padding: 5px;
  width: 90px; }

.profile_pic_holder {
  float: left;
  margin-right: 10px; }

.bio {
  width: 320px; }

.score_box {
  float: right;
  width: 80px;
  padding: 5px;
  min-height: 60px;
  background-color: #555;
  color: #fff;
  font-size: 24px;
  text-align: center;
  border-left: 1px solid;
  background-color: #f4f8f9; }

.follow_block {
  float: left;
  width: 50%; }

.pfollow {
  float: left;
  width: 94%; }

.fb_follow {
  width: 94%;
  height: 500px;
  overflow: auto; }

#bio {
  float: left;
  width: 40%; }

.profile_info {
  float: left;
  width: 65%; }

.profile_sec_image {
  float: left;
  padding: 0px;
  width: 15%; }

.graph_name {
  float: left;
  text-align: left;
  width: 20%;
  padding: 4px;
  margin: 2px;
  font-size: 14px;
  font-weight: bold;
  height: 40px; }

.graph_holder {
  float: left;
  width: 77%;
  height: 50px; }

.graph_data {
  min-width: 50px;
  max-width: 87%;
  margin: 3px;
  font-size: 16px;
  border: 1px solid;
  border-color: #ccc;
  color: #fff;
  border-radius: 4px;
  background-color: #ff6b6b;
  padding: 10px;
  height: 40px;
  text-align: left; }

/* --- buttons --- */
.form_button{min-width:150px;height:38px;text-align:center;margin-top:-1px;background:#8c52ff;
             color:#fff;font-size:18px;border-radius:12px;cursor:pointer;border:0px;padding-left: 20px;padding-right: 20px;
             box-shadow: 0 2px 2px rgba(0,0,0,.3);-webkit-box-shadow: 0 2px 2px rgba(0,0,0,.3);
             font-family: 'Spartan';}
.form_button:hover{background:#333645;}

.short_button{width:60px;height:50px;text-align:center;padding:7px;margin-top:10px;padding-top:5px;background:#EA2D49;
              color:#fff;font-size:18px;border-radius:6px;cursor:pointer;border:0px;
              box-shadow: 0 2px 2px rgba(0,0,0,.3);-webkit-box-shadow: 0 2px 2px rgba(0,0,0,.3);
              font-weight: bold;}
.short_button:hover{background:#333645;}
.short_black_button{margin-left:5px;width:80px;height:35px;text-align:center;padding:7px;margin-top:0px;padding-top:5px;background-color:#8c52ff;
              color:#fff;font-size:16px;border-radius:12px;cursor:pointer;border:0px;
              box-shadow: 0 2px 2px rgba(0,0,0,.3);-webkit-box-shadow: 0 2px 2px rgba(0,0,0,.3);}
.short_black_button:hover{background:#333645;}
.su_player_share_action {background:#fff;border:1px solid #ccc;text-align:center;border-radius:5px;width:80px;font-size:14px;margin:3px;padding:4px;padding-top:8px;}

/*_search*/
h1 {
  font: bold 32px/1.1 'Spartan', sans-serif;
  margin: 0;
  padding: 0 0 10px; }

h2 {
  font-family: 'Spartan', sans-serif;
  display: block;
  font-size: 1.5em;
  -webkit-margin-before: 0.83em;
  -webkit-margin-after: 0.83em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  font-weight: normal; }

h3 {
  font-family: 'Spartan', sans-serif;
  display: block;
  font-size: 1.17em;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  font-weight: bold; }

.gray_text {
  font: normal 18px/1.2 'Spartan', sans-serif;
  color: #8A8F9C;
  width: 80%; }

.gray_text_mini {
  font: normal 12px 'Spartan', sans-serif;
  color: #8A8F9C; }

h4 {
  font-size: 16px;
  font-weight: normal; }

.div-container {
  padding: 80px;
  margin: 0 50px 20px;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 6px; }
  .div-container .text-center-sm {
    padding-right: 60px; }

@media (max-width: 991px) {
  .div-container .text-center-sm {
    margin-bottom: 40px;
    text-align: center; } }

.active_now {
  background-color: #40BFBC;
  color: #FFF; }

.row_main_content {
  background: #F4F7FF;
  background-size: cover;
  position: relative;
  display: inline-block;
  width: 100%;
  margin-left: 0%;
  margin-right: 0%;
  text-align: center;
  padding: 15px 2% 30px 2%;
  font-size: 16px;
  color: #333;
  font-family: 'Spartan', sans-serif;
  line-height: 30px;
  min-height: 900px;
  height: 100%;
  max-width: 100%;
}

.row_main_content {
  margin-top: 50px;
  padding: 0 !important;
}
.row_main_content .row_main_content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

.row_main_content .bigbox .row_main_content {
  background-color: #fff;
}

/* Coursol section */
#myCarousel .item {
  padding-top: 70px;
  padding-bottom: 30px;
  color: #fff;
  min-height: 330px;
  border: 1px solid #fff; }
  #myCarousel .item h3 {
    font-size: 36px;
    line-height: 40px;
    margin-bottom: 30px;
    font-weight: 300; }
  #myCarousel .item p {
    font-size: 24px;
    line-height: 25px;
    font-weight: 300;
    margin-bottom: 30px; }
  #myCarousel .item .slide_buy_now a {
    border: 1px solid #fff;
    padding: 10px 22px;
    display: inline-block;
    margin-bottom: 70px;
    color: #fff;
    font-size: 24px; }

.carousel-indicators li {
  background: #fff;
  border: none;
  width: 18px;
  height: 18px; }
  .carousel-indicators li.active {
    background-color: #EA2D49;
    width: 18px;
    height: 18px; }

/*#myCarousel .item.boutiques {
  background: url(../img/boutiques.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center; }
#myCarousel .item.influencers {
  background: url(../img/influencers.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center; }
#myCarousel .item.streamers {
  background: url(../img/streamers.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center; }
#myCarousel .item.brands {
  background: url(../img/brands.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center; }
#myCarousel .item.customers {
  background: url(../img/shoppers2.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center; } */

.main-color {
  background-color: #ea2d49; }

.zoom-color {
  background-color: #549EFF;
}  

.facebook-color {
  background-color: #3a559f; }

.twitch-color {
  background-color: #6441a5; }

.instagram-color {
  background-color: #cd486b; }

.youtube-color {
  background-color: #dc472e; }

.youtube-bg-color {
  background-background-color: #dc472e; }

.stripe-color {
  background-color: #008cdd; }

.word-space-4 {
  word-spacing: 4px; }

.btn:focus {
  box-shadow: none !important; }

.btn-success{background-color:#40bfbc; color: #fff;font-weight:bold;border-radius: 14px;border:0px;padding-top: 15px;}
.btn-success:hover{background-color:#fa702b; color: #fff;font-weight:bold;border-radius: 14px;border:0px;}

.facebook-btn {
  background: url("../img/facebook-btn.png"); }
  .facebook-btn:hover {
    background: url("../img/facebook-btn.png"); }

.twitch-btn {
  background: url("../img/twitch-btn.png"); }
  .twitch-btn:hover {
    background: url("../img/twitch-btn.png"); }

.gmail-btn {
  background: url("../img/gmail-btn.png"); }
  .gmail-btn:hover {
    background: url("../img/gmail-btn.png"); }

.stripe-btn {
  background: url("../img/stripe-btn.png"); }
  .stripe-btn:hover {
    background: url("../img/stripe-btn.png"); }

.instagram-btn {
  background: url("../img/instagram-btn.png"); }
  .instagram-btn:hover {
    background: url("../img/instagram-btn.png"); }

.youtube-bg-color {
  background-color: #dc472e; }

.font-muli {
  font-family: 'Muli', sans-serif; }

 .comm_top {
  font-size: 16px;
  font-weight: bold;
  color: #000;
  margin-bottom: 5px; 
  line-height: 16px; 
 } 

.lesson-mats {max-width:100%;margin:1%;padding:1%;padding-top: 0px;}
.lesson-tabs {
    margin-top: 0px;
    margin-bottom: 0px;
    min-height: 50px;
    line-height: 50px;
    color: #333;
    background: #e2eaed; 
    width:100%;
    padding-left: 7%;
    padding-right: 7%;
  }

.browse {
  background: #F4F7FF;
  padding-top: 20px;
  padding-bottom: 40px;
  min-height: 900px; 
  border-radius: 20px;
 }
  
 .browse .top-tabs {
    position: fixed;
    z-index: 101;
    top:100;
    margin-top: 0px;
    margin-bottom: 40px;
    min-height: 50px;
    line-height: 50px;
    color: #333;
    background: #e2eaed; 
    width:100%;
    padding-left: 2%;
    padding-right: 2%;
  }

.p20 {padding:20px;}
ul.left {
  float: left; }
ul.right {
  float: right; }
div.right {
  float: right; padding-top: 7px;}  

.browse ul li {
  display: inline-block;
  padding: 0 15px;
  font-size: 16px;
  cursor: pointer; }
  .browse ul li.active {
    color: #40BFBC;
    border-bottom: 2px solid #40BFBC;
    font-weight: 600; }
  .browse ul li:hover {
    color: #40BFBC; }
  .browse ul li.active:hover {
    color: #40BFBC; }
  .browse ul li .fa {
    margin: 0; }
.browse div.right span {
  width: 100%;
  padding: 6px 35px;
  border-radius: 20px;
  background: #fff;
  color: #333;
  font-size: 15px; }

 .lesson-tabs ul li {
  display: inline-block;
  padding: 0 15px;
  font-size: 16px;
  cursor: pointer; }
  .lesson-tabs ul li.active {
    color: #40BFBC;
    border-bottom: 2px solid #40BFBC;
    font-weight: 600; }
  .lesson-tabs ul li:hover {
    color: #40BFBC; }
  .lesson-tabs ul li.active:hover {
    color: #40BFBC; }
  .lesson-tabs ul li .fa {
    margin: 0; }
.lesson-tabs div.right span {
  width: 100%;
  padding: 6px 35px;
  border-radius: 20px;
  background: #fff;
  color: #333;
  font-size: 15px; } 

.reverse-colors:hover, .regular-colors:hover {
  font-weight: bold; }

.browse div.right li.reverse-colors > span {
  color: #fff;
  background: #40BFBC; }

.reverse-colors > span {
  color: #fff;
  background: #40BFBC;
  border-radius: 20px;
  padding: 4px 20px;
  width: 80px;
  margin-right: 0px; }

.mainBtn-container {
  display: inline-block;
  margin-bottom: 10px;
  margin-right: 10px; }

.mainBtn {
  position: relative;
  height: 38px;
  line-height: 37px;
  padding-right: 20px;
  padding-left: 70px;
  background: #1dd1a1;
  border: none;
  color: #fff;
  border-radius: 6px;
  font-size: 12px;
  font-family: sans-serif; }

.activeBtn {
  position: relative;
  height: 38px;
  line-height: 37px;
  padding-right: 20px;
  padding-left: 70px;
  background: #40BFBC;
  border: none;
  color: #fff;
  border-radius: 6px;
  font-size: 12px;
  font-family: sans-serif; }

.mainBtn-container:hover .mainBtn {
  background: #ff6b6b;
  cursor: pointer; }

.mainBtn::before {
  content: "";
  position: absolute;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 50px;
  background: #00b894;
  border-radius: 6px 0 0 6px; }

.activeBtn::before {
  content: "";
  position: absolute;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 50px;
  background: #e95051;
  border-radius: 6px 0 0 6px; }

.mainBtn-container:hover .mainBtn::before {
  background: #e95051; }

.mainBtn .iconBtn, .activeBtn .iconBtn {
  position: absolute; }
/***
    Start Responsive Flip Scroll Table
    Added by Sayed
***/
.padding-15, .flip-scroll {
  padding: 15px; }

.table td, .table th {
  font-size: 14px; }
.table.table-bordered thead > tr > th {
  border-bottom: 0; }

.flip-scroll table {
  width: 100%;
  border-radius: 4px; }

@media only screen and (max-width: 768px) {
  /* 768px */
  .flip-scroll .flip-content:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0; }
  .flip-scroll * html .flip-content, .flip-scroll *:first-child + html .flip-content {
    zoom: 1; }
  .flip-scroll table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0; }
  .flip-scroll th, .flip-scroll td {
    margin: 0;
    vertical-align: top; }
  .flip-scroll th {
    text-align: left;
    border: 0 !important;
    border-bottom: 1px solid #ddd !important;
    border-right: 1px solid #ddd !important;
    font-size: 13px !important;
    padding: 5px;
    width: auto !important; }
  .flip-scroll table {
    display: block;
    position: relative;
    width: 100%; }
  .flip-scroll thead {
    display: block;
    float: left; }
  .flip-scroll tbody {
    display: block;
    width: auto;
    position: relative;
    overflow-x: auto;
    white-space: nowrap; }
  .flip-scroll .flip-content tbody tr td {
    font-size: 13px;
    line-height: 1.483; }
  .flip-scroll .table-bordered.flip-content tbody tr td {
    font-size: 13px;
    line-height: 1.43; }
  .flip-scroll thead tr {
    display: block; }
  .flip-scroll th {
    display: block;
    text-align: right; }
  .flip-scroll tbody tr {
    display: inline-block;
    vertical-align: top;
    margin-left: -5px; }
  .flip-scroll td {
    display: block;
    min-height: 1.25em;
    text-align: left;
    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important; }
  .flip-scroll th {
    border-bottom: 0;
    border-left: 0; }
  .flip-scroll td {
    border-left: 0;
    border-right: 0;
    border-bottom: 0; }
  .flip-scroll tbody tr {
    border-left: 1px solid #ddd; }
  .flip-scroll th:last-child, .flip-scroll td:last-child {
    border-bottom: 1px solid #ddd; }

  /* sort out borders */ }
.table {
  font-family: 'Spartan', sans-serif; }
  .table > caption + thead > tr:first-child > td, .table > caption + thead > tr:first-child > th {
    color: #333;
    font-size: 18px;
    font-weight: bold;
    text-align: left; }
  .table > colgroup + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > th {
    color: #333;
    font-size: 18px;
    font-weight: bold;
    text-align: left; }
  .table > thead:first-child > tr:first-child > td, .table > thead:first-child > tr:first-child > th {
    color: #333;
    font-size: 18px;
    font-weight: bold;
    text-align: left; }

.table-bordered {
  padding: 10px 20px; }
  .table-bordered > tbody > tr > td {
    font-size: 15px;
    text-align: left;
    padding: 10px 20px; }
  .table-bordered > tbody > tr > th {
    padding: 10px 20px; }
  .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th {
    padding: 10px 20px; }
  .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {
    padding: 10px 20px; }

.table {
  margin-bottom: 0; }

.portlet.box > .portlet-body {
  padding: 0; }

table th.sorting-link a i {
  margin: 0; }
table td.shipped {
  font-size: 15px; }
  table td.shipped i {
    font-size: 15px;
    color: #00CC00;
    padding-right: 5px;
    font-size: 19px; }

@media (max-width: 768px) {
  .table-bordered {
    padding: 10px 10px;
    padding: 0; }
    .table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th {
      padding: 10px 10px; }
    .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th {
      padding: 10px 10px; }
    .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {
      padding: 10px 10px; }

  .table > thead:first-child > tr:first-child > th {
    text-align: left; }

  .flip-scroll .table-bordered.flip-content tbody tr td {
    font-size: 15px !important; }

  .table-bordered {
    font-size: 15px !important; }
    .table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th {
      font-size: 15px !important; }
    .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th {
      font-size: 15px !important; }
    .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {
      font-size: 15px !important; }

  table th.sorting-link a i {
    float: left; }
  table td.shipped {
    font-size: 20px; }
    table td.shipped i {
      font-size: 20px; } }
@media (max-width: 768px) {
  .row_main_content {
    padding-right: 0;
    padding-left: 0; }

  .bigbox {
    width: 100%;
    margin-left: 0;
    border: 0;
    padding-left: 0;
    padding-right: 0; }
    .bigbox > div {
      padding-left: 0 !important;
      padding-right: 0 !important; }

  .thank-you {
    padding: 2%; } }
/***
    End Responsive Flip Scroll Table
***/

.profile_sec_image {
  display: block;
  float: none;
  text-align: center;
  width: 100%;
  padding-top: 20px;
  padding-bottom: 10px; }
  .profile_sec_image .profile_img_wrapper {
    border-radius: 50%;
    width: 140px;
    height: 140px;
    margin: auto;
    overflow: hidden; }

.store_img_wrapper {
  border-radius: 50%;
  width: 45px;
  border: 2px solid #fff; }

.in_img_wrapper {
  border-radius: 50%;
  width: 35px;
  box-shadow: 0 1px 4px 0 #fff; }

.profile_sec_image .profile_img_wrapper img {
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important; }

.profile_info {
  float: none;
  width: 100%;
  padding-bottom: 20px;
  padding-top: 10px;
  font-family: 'Spartan', sans-serif; }
  .profile_info p.h1 {
    font-size: 24px;
    text-align: center;
    text-transform: capitalize;
    font-family: 'Spartan', sans-serif; 
    padding-bottom:0px;
  }
  .profile_info p.h4 {
    font-size: 16px;
    text-align: center;
    font-family: 'Spartan', sans-serif;
    color: #999; }
  .profile_info a {
    display: block;
    text-align: center;
    font-size: 16px;
    margin-top: 5px;
    color: #333;
    font-family: 'Spartan', sans-serif; }
    .profile_info a img {
      width: 20px;
      margin-right: 5px; }

hr.profile_info_hr {
  border-top: 2px solid #f4f8f9;
  margin-top: 0; }


.profile_recent_orders p.h3 {
  font-size: 20px;
  font-weight: 600;
  font-family: 'Spartan', sans-serif;
  font-weight: lighter;
  margin-bottom: 20px; }

.profile_orders_table .table > thead:first-child > tr:first-child > th {
  font-size: 18px;
  background: #f9f9f9; }
  .profile_orders_table .table > thead:first-child > tr:first-child > th img {
    width: 18px;
    margin-right: 3px;
    margin-top: -3px; }
.profile_orders_table .table-striped > tbody > tr:nth-of-type(odd) {
  background: #fff; }

@media (max-width: 850px) {
  .profile_sec_image {
    float: none !important;
    padding: 10px 0 !important;
    width: 100% !important; }

  .profile_info {
    float: none !important;
    width: 100% !important; } }
.headliner.bg-none {
  background: none;
  border: none;
  padding: 0; }

.headliner {
    transition: transform 0.3s ease, margin 0.3s ease, background-color 0.3s ease;
}

.headliner.swiping-right {
    transform: translateX(60px);
    background-color: rgba(0, 123, 255, 0.2); /* Light blue highlight for right swipe */
}

.headliner.swiping-left {
    transform: translateX(-60px);
    background-color: rgba(255, 193, 7, 0.2); /* Light yellow highlight for left swipe */
}


#sortable {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 100%; }
 #sortable li {
    background-color: #fff;
    margin: 1%;
    padding: 2%;
    padding-top: 2px;
    height: 45px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 16px; }

#sortable2 {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 100%; }
  #sortable2 li {
    background-color: #fff;
    margin: 3px;
    padding: 2%;
    padding-top: 2px;
    height: 45px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 16px; }

.not_sortable {
  cursor: pointer;
  margin: 0;
  padding: 0;
  width: 98%;
  background-color: #fff;
  margin: 3px;
  padding: 2%;
  padding-top: 2px;
  height: 45px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 16px; }
  .not_sortable:hover {
    background-color: #FFF3F5; }

.headline{
    font-family: 'Spartan', sans-serif;
    font-size: 32px;
    margin:0%;
}

.twhite {
  color: #fff; }

.tblack {
  color: #000; }

.twhitetop {
  color: #fff; }

#editmodal{background-color:white;border-radius:10px;}
#editmodal2{background-color:#F9FAFF;border-radius:10px;}

.copy_button {
  background: none !important;
  color: inherit;
  border: none;
  padding: 0 !important;
  font: inherit;
  /*border is optional*/
  border-bottom: 1px solid #444;
  cursor: pointer; }

 .copyit {
    font-size:14px;width:80px;text-align:center;margin:0px auto;height:25px;padding-top:0px;padding-bottom:18px;line-height:24px;border-radius: 8px;
    background-color: #000; color: #fff;
 }  

.copy-btn {font-size:14px;width:80px;text-align:center;margin:0px auto;height:25px;padding:8px;line-height:24px;border-radius:8px;background-color: #000; color: #fff;}
.carousel-control.left, .carousel-control.right {
  background: none; }

.course_link{text-transform: uppercase;color:#fff; letter-spacing: 2px; font-size: 16px;}
.course_linkunder{text-transform: uppercase;color:#fff; letter-spacing: 2px; font-size: 16px;}
.course_downlink{text-transform: uppercase;color:#fff; letter-spacing: 2px; font-size: 12px;padding:10px;border:1px solid #fff;border-radius:6px;margin:1%;margin-right:20px;}
.course_all_link{float:left;text-transform: uppercase;color:#fff; letter-spacing: 2px; font-size: 12px;padding:10px;padding-top:0px;padding-bottom:0px;border:1px solid #fff;border-radius:6px;margin:1%;margin-right:20px;}
.course_linkdark{text-transform: uppercase;color:#000; letter-spacing: 2px; font-size: 18px;}
.course_downlinkdark{text-transform: uppercase;color:#000; letter-spacing: 2px; font-size: 12px;padding:10px;border:1px solid #000;border-radius:6px;margin:1%;margin-right:20px;}
.course_giantlink{text-transform: uppercase;color:#000; letter-spacing: 2px; font-size: 38px;}
.course_section{text-transform: uppercase;color:#555;font-size:20px;}
.course_section_title{text-transform: uppercase;color:#000;font-size:24px;}
.course_descr {font-size:16px;color:#fff;line-height: 25px;}

.row-shop-content-padding {
  padding-top: 25px !important;
}

.modal {
  font-size: 16px;
  line-height: 24px;
  margin-top: 80px;
  max-height: 80%;
}

.modal-backdrop.show {
    opacity: .8;
}

.col-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}