html { font-size: 100%; }
body{background:#f3f3f3;color:black;font-family: 'Source Sans Pro', sans-serif;}
label{font-weight:normal;}

/***** BG color Extras *****/
.bg-purple { border-color: #694D9F;background: #694D9F;color: #fff; }
.bg-warningalt { border-color: #F3F3EB;background: #E9CEAC;color: #fff; }
.bg-successalt { border-color: #19B99A;background: #20A286;color: #fff; }
.bg-pink { border-color: #F1396D;background: #F56991;color: #fff; }
.bg-pink-dark{background:#F2116C; color:#ffffff;}
.bg-litebrown { border-color: #FF3D7F;background: #F8ECC9;color: #FF3D7F; }
.bg-blue{background:#00B4CC; color:#ffffff;}

/***** TXT color Extras *****/
.txt-blue{color: #00a8ff;}
.text-white { color:#ffffff;}
.text-pink { color:#F1396D;}

.parsley-errors-list{list-style:none;color:red;margin:0;padding:0;font-size:15px;}
.parsley-errors-list li{display:block;margin-top:10px;font-weight:normal;}
.quick_search {font-size:14px;color:#4a4a4a;}
.btm_border { border-bottom:1px solid #008C9E; padding-bottom:20px;}
.shadow{  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); transition: all 0.3s cubic-bezier(.25,.8,.25,1); }

#top-nav{background:#26ADE4;color:white;font-size:0.9em;}
#top-nav ul{margin:0;padding:0;}
#top-nav a, #top-nav a:hover{text-decoration:none; color:#ffffff;}
#top-nav li{padding:5px;}

#main-intro{background:url(../images/theme/introbg.jpg) no-repeat center center; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; padding:30px 0px;}
#main-intro select, #main-intro button{font-size:14px;}
.loginreg, .loginreg a, .loginreg:hover, .loginreg select, .loginreg button, .loginreg input, .loginreg label, .loginreg placeholder{font-size:14px;}

.feature, .feature i, .feature h5, .feature .title_border { -webkit-transition: all 1s ease-in-out;  -moz-transition: all 1s ease-in-out;   -o-transition: all 1s ease-in-out;   transition: all 1s ease-in-out;   }
.feature i{ color:#FFFFFF; background: linear-gradient(90deg, rgba(148,34,130,1) 0%, rgba(223,13,188,1) 100%, rgba(215,255,0,1) 100%); padding:30px;  border-radius:50%; }
.feature h5 { color:#1E825F; }
.feature:hover { background:#F5F5F5; -webkit-transform: translate(0,1em);  -moz-transform: translate(0,1em);  -o-transform: translate(0,1em); -ms-transform: translate(0,1em); transform: translate(0,0em);  }
.feature:hover i{ color:#ffffff; border-color:#1E825F; background:#f269a3; }
.feature:hover .title_border { background-color:#f269a3; width:25%; }
.feature .title_border { width: 0%; height: 2px;  background:#1E825F;  margin: 0 auto;  margin-top: 12px; margin-bottom: 8px; }

/* ---------------- Sticky Header  ------------------*/
.float-panel { width:100%; background:white; z-index:400; padding:10px 0; transform: translateZ(1); transition:all 0.5s; /* Effect for switching from .fixed to static */ }
.float-panel .content-area {margin:10px auto;}
.float-panel a {font-size:16px;text-decoration:none;color:#444;display:inline-block;}
.float-panel .fa-gg {color:#F0595C;font-size:30px;vertical-align:middle;transition:all 1s;}
/* when class="float-panel fixed" */
.fixed {box-shadow:0 2px 6px rgba(0,0,0,0.2);padding:4px 0;animation:slide-down 0.7s;}
.fixed .fa-gg {transform: rotate(360deg); }

/* ---------------- Content Animation on Scroll ---------------- */
.slideanim { visibility:hidden; visibility:visible\9;/*For old IE browsers IE6-8 */ }
.slideanim.slide {visibility: visible; animation:slide 1s;}
.slideanim::after { /* useful when its child elements are float:left; */ content: ""; display: table; clear: both; }

@keyframes slide-down {
    0% { opacity: 0; transform: translateY(-100%);  } 
    100% { opacity: 0.9; transform: translateY(0);  } 
}
@keyframes slide {
    0% {  opacity: 0;  transform: translateY(50%);  } 
    100% { opacity: 1;  transform: translateY(0);  } 
}

.modal-body {
    max-height: calc(120vh - 210px);
    overflow-y: auto;
}

[data-notify="progressbar"] {
	margin-bottom: 0px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 5px;
}

.item img{height:250px;}
.item-title{margin-top:10px;}
.item-sub{font-size:13px; color:#585858;}

/*footer section*/

footer { width:100%; background-color:#26ADE4; min-height:250px; padding:10px 0px 25px 0px ;}
.footer_heading { padding-top:40px ; margin-bottom:20px ;}
footer p { font-size:13px; color:#ffffbf; padding-bottom:0px; margin-bottom:8px;}
footer p a, footer p a:hover{color:#ffffff;}

.footer_list { margin:0px ; list-style-type:none ; font-size:14px; padding:0px 0px 10px 0px ; }
.footer_list li {padding:0px 0px 5px 0px;}
.footer_list li a{ color:#ffffbf;}
.footer_list li a:hover{ color:#fff; text-decoration:none;}

.footer_bottom_list { list-style-type:none;	padding:0px; display:table;	margin-top: 10px; margin-right: auto; margin-bottom: 10px;	margin-left: auto; }
.footer_bottom_list li { display:inline;}
.footer_bottom_list li a { color:#ffffff; margin:0 12px;}

.footer_social_list { display:table; margin:15px auto 0 auto; list-style-type:none;  }
.footer_social_list li { padding-left:20px; padding-top:10px; float:left; }
.footer_social_list li a { color:#ffffff; border:1px solid #ffffbf; padding:8px;border-radius:50%;}
.footer_social_list li i {  width:20px; height:20px; text-align:center;}

/* Breadcrumb*/
.breadcrumb-arrow {height: 36px; padding: 0; line-height: 36px; list-style: none; background-color: #b9b9c8;	margin:0; border-radius:0;}
/*.breadcrumb-arrow li:first-child a { border-radius1: 4px 0 0 4px;  -webkit-border-radius1: 4px 0 0 4px;  -moz-border-radius1: 4px 0 0 4px; }*/
.breadcrumb-arrow li, .breadcrumb-arrow li a, .breadcrumb-arrow li span { display: inline-block; vertical-align: top; }
.breadcrumb-arrow li:not(:first-child) { margin-left: -2px; }
.breadcrumb-arrow li+li:before { padding: 0; content: ""; }
.breadcrumb-arrow li span { padding: 0 10px; }
.breadcrumb-arrow li a, .breadcrumb-arrow li:not(:first-child) span { height: 36px; padding: 0 10px 0 25px; line-height: 36px; }
.breadcrumb-arrow li:first-child a { padding: 0 10px; }
.breadcrumb-arrow li a { position: relative; color: #fff; text-decoration: none; background-color: #66b3ff; border: 1px solid #66b3ff; }
.breadcrumb-arrow li:first-child a { padding-left: 10px; }
.breadcrumb-arrow li a:after, .breadcrumb-arrow li a:before { position: absolute; top: -1px; width: 0; height: 0; content: ''; border-top: 18px solid transparent; border-bottom: 18px solid transparent; }
.breadcrumb-arrow li a:before { right: -10px; z-index: 3; border-left-color: #66b3ff; border-left-style: solid; border-left-width: 11px; }
.breadcrumb-arrow li a:after { right: -11px; z-index: 2; border-left: 11px solid #2494be; }
.breadcrumb-arrow li a:focus, .breadcrumb-arrow li a:hover { background-color: #4ca6ff; border: 1px solid #BE0049; }
.breadcrumb-arrow li a:focus:before, .breadcrumb-arrow li a:hover:before { border-left-color: #4ca6ff; }
.breadcrumb-arrow li a:active { background-color: #DF5C7E; border: 1px solid #DF5C7E; }

/* menu */
.dropdown-menu{position:absolute;padding:0;border:0 solid transition!important;border:0 solid rgba(0,0,0,.15);border-radius:0;-webkit-box-shadow:none!important;box-shadow:none!important;}
.mainmenu a, .mainmenu ul li a, .navbar-default .navbar-nav > li > a, .navbar-expand-lg .navbar-nav .nav-link{color:#5a5a5a;text-transform:capitalize;padding:16px 0px 16px 16px;display: block !important;}
.mainmenu .active a,.mainmenu .active a:focus,.mainmenu .active a:hover,.mainmenu li a:hover,.mainmenu li a:focus ,.navbar-default .navbar-nav>.show>a, .navbar-default .navbar-nav>.show>a:focus, .navbar-default .navbar-nav>.show>a:hover{color: #5a5a5a;background: outline: 0;}
/*==========Sub Menu=v==========*/
.mainmenu .collapse ul > li:hover > a{color:#EE4C7C;}
.mainmenu .collapse ul ul > li a{color:#ffffff;}
.mainmenu .collapse ul ul > li:hover > a, .navbar-default .navbar-nav .show .dropdown-menu > li > a:focus, .navbar-default .navbar-nav .show .dropdown-menu > li > a:hover{background: #4ca6ff; color:#ffffff;}
.mainmenu .collapse ul ul ul > li:hover > a{background: #4ca6ff;}

.mainmenu .collapse ul ul, .mainmenu .collapse ul ul.dropdown-menu{background:#EE4C7C;position:absolute;left:0;}
.mainmenu .collapse ul ul ul, .mainmenu .collapse ul ul ul.dropdown-menu{background:#EE4C7C;}
.mainmenu .collapse ul ul ul ul, .mainmenu .collapse ul ul ul ul.dropdown-menu{background:#EE4C7C;}

/******************************Drop-down menu work on hover**********************************/
.mainmenu{background: none;border: 0 solid;margin: 0;padding: 0;min-height:20px;width: 100%;}
@media only screen and (min-width: 767px) {
	.mainmenu .collapse ul li:hover> ul{display:block;}
	.mainmenu .collapse ul ul{position:absolute;top:100%;left:-40%;min-width:250px;display:none;}
	/*******/
	.mainmenu .collapse ul ul li{position:relative;}
	.mainmenu .collapse ul ul li:hover> ul{display:block;}
	.mainmenu .collapse ul ul ul{position:absolute;top:0;min-width:250px;display:none}
	/*******/
	.mainmenu .collapse ul ul ul li{position:relative}
	.mainmenu .collapse ul ul ul li:hover ul{display:block}
	.mainmenu .collapse ul ul ul ul{position:absolute;top:0;left:-100%;min-width:250px;display:none;z-index:1}
}

@media only screen and (max-width: 767px) {
	.navbar-nav .show .dropdown-menu .dropdown-menu > li > a{padding:16px 15px 16px 35px}
	.navbar-nav .show .dropdown-menu .dropdown-menu .dropdown-menu > li > a{padding:16px 15px 16px 45px}
}

/* Accordion */
/*.sbaccordion { max-width1: 500px; margin1: 50px auto; box-shadow1: 0 0 1px rgba(0,0,0,0.1); }*/
.sbaccordion li{padding:0;}
.sbaccordion li a, .sbaccordion li a:hover{text-decoration:none; color:rgba(100,105,140,01);}
.sbaccordion .card, .sbaccordion .card:last-child .card-header { border: none; }
.sbaccordion .card-header { border-bottom-color: #EDEFF0; background: transparent; }
.sbaccordion .fa-stack { font-size: 12px; }
.sbaccordion .btn { width: 100%; font-weight: bold; color: rgba(0,105,140,0.8); padding: 0; }
.sbaccordion .btn-link:hover, .sbaccordion .btn-link:focus {  text-decoration: none; }
.sbaccordion li + li { margin-top: 10px; }

.page{background:#edede5; }
.page-title{font-family:'Roboto Slab'; font-weight:700; color:#EE4C7C;}

.dm-uploader { border: 0.25rem dashed #A5A5C7; text-align: center; }
.dm-uploader.active { border-color: red; 	border-style: solid; }
#debug { overflow-y: scroll !important; height: 280px; }

#photos-grid {
   /* Prevent vertical gaps */
   line-height: 0;
   
   -webkit-column-count: 5;
   -webkit-column-gap:   0px;
   -moz-column-count:    5;
   -moz-column-gap:      0px;
   column-count:         5;
   column-gap:           0px;
}

#photos-grid img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}

@media (max-width: 1200px) {
  #photos-grid {
  -moz-column-count:    4;
  -webkit-column-count: 4;
  column-count:         4;
  }
}
@media (max-width: 1000px) {
  #photos-grid {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
}
@media (max-width: 800px) {
  #photos-grid {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
}
@media (max-width: 400px) {
  #photos-grid {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
}

.overlay-container {
  position: relative;
}

.image {
  opacity: 1;
  display: block;  
  transition: .5s ease;
  backface-visibility: hidden;
}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  bottom: 5%;
  left: 20%;
  transform: translate(-5%, -2%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.overlay-container:hover .image {
  opacity: 0.3;
}

.overlay-container:hover .middle {
  opacity: 1;
}

.text {
  background-color: #4CAF50;
  color: white;
  font-size: 16px;
  padding: 16px 32px;
}

#carousel-thumb .list-inline {
  white-space:nowrap;
  overflow-x:auto;
}

#carousel-thumb .carousel-control-next, .carousel-control-prev {
	width: auto;
	top: 50%;
	bottom: initial;
}

#carousel-thumb .carousel-indicators {
  position: static;
  left: initial;
  width: initial;
  margin-left: initial;
}

#carousel-thumb .carousel-indicators > li {
  width: initial;
  height: initial;
  text-indent: initial;
}

#carousel-thumb .carousel-indicators > li.active img {
  opacity: 0.7;
}

/* GRADIENT RIBBON */
.ribbon {
  display: grid;
  font-size: 15px;
  grid-gap: 1px;
  grid-template-columns: repeat(3, 1fr) 1em;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1em;
  width: 100%;
}

.ribbon__element {
  background-color: #11d295;
  color: #fff;
  font-size: 1.1em;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.333em;
  padding: 0.667em 0.667em 0.667em 1.333em;
  position: relative;
  text-decoration: none;
}

.ribbon--alpha .ribbon__element:before {
  border-bottom: 1.333em solid transparent;
  border-left: 0.667em solid #edede5;
  border-top: 1.333em solid transparent;
  bottom: 0;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  top: 0;
  width: 0;
}
.ribbon--alpha .ribbon__element:after {
  border-bottom: 1.333em solid transparent;
  border-left: 0.667em solid;
  border-top: 1.333em solid transparent;
  bottom: 0;
  content: "";
  height: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: translateX(0.667em);
  width: 0;
}
.ribbon--alpha .ribbon__element.green:after {
  border-left-color: #11d295;
}

.ribbon--gradient .ribbon__element.green {
  background-image: linear-gradient(to right, #11ced2, #11d295);
}

.ribbon--alpha .ribbon__element.pink:after {
  border-left-color: #ef3675;
}

.ribbon--gradient .ribbon__element.pink {
  background-image: linear-gradient(to right, #ef36b2, #ef3675);
}

.ribbon--alpha .ribbon__element.blue:after {
  border-left-color: #4cd4e9;
}

.ribbon--gradient .ribbon__element.blue {
  background-image: linear-gradient(to right, #4c9fe9, #4cd4e9);
}

/* Profile Grid #ProfileGrid */

#ProfileGrid .btn-primary:hover,
#ProfileGrid .btn-primary:focus {
    background-color: #F1396D;
    border-color: #F1396D;
    box-shadow: none;
    outline: none;
}

#ProfileGrid .btn-primary {
    color: #fff;
    background-color: #F1396D;
    border-color: #F1396D;
}

#ProfileGrid section {
    padding: 60px 0;
}

#ProfileGrid section .section-title {
    text-align: center;
    color: #F1396D;
    margin-bottom: 50px;
    text-transform: uppercase;
}

#ProfileGrid .card {
    border: none;
    background: #ffffff;
}

.image-flip:hover .backside,
.image-flip.hover .backside {
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg);
    border-radius: .25rem;
}

.image-flip:hover .frontside,
.image-flip.hover .frontside {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.mainflip {
    -webkit-transition: 1s;
    -webkit-transform-style: preserve-3d;
    -ms-transition: 1s;
    -moz-transition: 1s;
    -moz-transform: perspective(1000px);
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transition: 1s;
    transform-style: preserve-3d;
    position: relative;
}

.frontside {
    position: relative;
    -webkit-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    z-index: 2;
    margin-bottom: 30px;
}

.backside {
    position: absolute;
    top: 0;
    left: 0;
    background: white;
    -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -o-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
    -webkit-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
    -moz-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
    box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
}

.frontside,
.backside {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: 1s;
    -webkit-transform-style: preserve-3d;
    -moz-transition: 1s;
    -moz-transform-style: preserve-3d;
    -o-transition: 1s;
    -o-transform-style: preserve-3d;
    -ms-transition: 1s;
    -ms-transform-style: preserve-3d;
    transition: 1s;
    transform-style: preserve-3d;
}

.frontside .card,
.backside .card {
    min-height: 312px;
}

.backside .card a {
    font-size: 18px;
    color: #F1396D !important;
}

.frontside .card .card-title,
.backside .card .card-title {
    color: #F1396D !important;
}

.frontside .card .card-body img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
}

/* Search Options Height */
.searchoptions{
	height: 250px; 
	overflow-y: auto; 
	overflow-x: hidden;
}
.searchoptions .list-group-item, .searchoption .list-group-item{padding:10px 15px;margin:0;font-size:14px;}
.searchoptions .list-group-item label, .searchoption .list-group-item label{padding:0;margin:0;}
.simplebar-scrollbar::before {
  background-color: #FF3D7F;
}