body, button {
  padding: 0px;
  font: 16px;
  /*font: 16px "Lucida Grande", Helvetica, Arial, sans-serif;
  font-family: 'Kumbh Sans', sans-serif;
  font-family: 'Inconsolata', monospace;*/
  font-family: Roboto, "Lucida Grande", Helvetica, Arial, sans-serif;
  background: #fcfcfc;
}


html{
  font-size:18px;
}
@media(max-width: 767px) {
  html{
    font-size: 16px; /* base size 1 em*/
  }
}

a {
  color: #005bff;
}








/* ARTICLE" */



.articleImgHead{
  width: 100%;
  border-radius:20px;
  border: 1px solid white;
  object-fit: cover;
  margin-bottom:1em;
}



.section {
  padding:0;
}

.hide, .hidden{
  display:none;
}
.truncate, .ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.line-clamp3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}


/*
.profile .column{
  border: #ccc 5px solid;
}

*/


.citiesListing a{
  line-height: 1.8em;
  font-size:18px;
}



.matches .title, .memberCard .title{
  margin-bottom: 0;
}
.matches  hr{
  margin: 0.5rem 0;
}


		/*
		 * Rating styles
		 */
		.rating {
			width: 250px;
			/*margin: 0 auto 1em;*/
			font-size: 38px;
			overflow:hidden;
		}
.rating input {
  float: right;
  opacity: 0;
  position: absolute;
}
		.rating a,
    .rating label {
			float:right;
			color: #000;
			text-decoration: none;
			-webkit-transition: color .4s;
			-moz-transition: color .4s;
			-o-transition: color .4s;
			transition: all .1s;
      opacity:0.15;
      margin-right:10px;
		}




.rating label:hover ~ label,
.rating input:focus ~ label,
.rating label:hover,
		.rating a:hover,
		.rating a:hover ~ a,
		.rating a:focus,
		.rating a:focus ~ a,
    .rating :checked ~ label		{
			color: orange;
      opacity: 1;
			cursor: pointer;
		}
		.rating2 {
			direction: rtl;
		}
		.rating2 a {
			float:none
		}

/*
.rating :checked ~ label {
      color: blue;
}*/


.circle-sketch-highlight{
  position:relative;
}
.circle-sketch-highlight:before{
  content:"";
  z-index:3;
  left:-0.2em;
  top:-0.1em;
  border-width:4px;
  border-style:solid;
  border-color:#00ff43ad;
  position:absolute;
  border-right-color:transparent;
  width:100%;
  height:1em;
  transform:rotate(2deg);
  opacity:0.7;
  border-radius:50%;
  padding:0.1em 0.25em;
}
.circle-sketch-highlight:after{
  content:"";
  z-index:3;
  left:-0.2em;
  top:0.1em;
  padding:0.1em 0.25em;
  border-width:4px;
  border-style:solid;
  border-color:#00ff43ad;
  border-left-color:transparent;
  border-top-color:transparent;
  position:absolute;
  width:100%;
  height:1em;
  transform:rotate(-1deg);
  opacity:0.7;
  border-radius:50%;
}


.realistic-marker-highlight{
  position:relative;
}
.realistic-marker-highlight:before{
  content:"";
  background-color:#ff6db7;
  width:100%;
  height:1em;
  position:absolute;
  z-index:3;
  filter:url(#marker-shape);
  left:-0.25em;
  top:0.1em;
  padding:0 0.25em;
}



.args3 h5{
  font-size: 22px;
  margin-top: 20px;
  margin-bottom: 0.3em;
}


.jsonPreview, .mono, code{
font-family: SFMono-Regular, Menlo, Monaco,
              Consolas, "Liberation Mono",
              "Courier New", monospace;
  }



.tag.center{
  display: flex; justify-content: center;
  width: 50%;
}

.navbar .is-active{
  border-bottom:2px blue solid;
}

.muted{
  opacity:0.5;
}

.right{
  float: right
}
.bold{
  font-weight: bold;
}

h1,h2,h3,h4,h5,h6,h6, .title{
  font-family: 'Kumbh Sans', sans-serif;
}

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

@media(max-width: 767px) { /* <== You can change this break point as per your  needs */
  .reverse-columns {
    flex-direction: column-reverse;
    display: flex;
  }
}

@media(min-width: 767px) { /* <== You can change this break point as per your  needs */
  .reverse-columns-desktop {
    flex-direction: column-reverse;
    flex-direction: row-reverse;
    display: flex;
  }
}


img.ib{
  max-height: 150px;
}

/* forms - chk box radio*/
.is-checkradio[type=checkbox]+label::before, .is-checkradio[type=checkbox]+label:before, .is-checkradio[type=radio]+label::after, .is-checkradio[type=radio]+label::before, .is-checkradio[type=radio]+label:after, .is-checkradio[type=radio]+label:before {
    background: white;
}

.label.bigger{
  font-size: 1.5em;
}


.dotMenu{
  float:right;
}
.dotMenu .button{
  border: 0;
  border-radius: 30px;
}
.dotMenu .icon{
  font-size:20px;
}



.image img{
  object-fit: cover;
}

section.success, section.success h1{
  background: #13e473;
  color:white;
}


section.danger, section.danger h1{
  background: #7c0aab;
  color:white;
}
section.success{
  min-height: 100vh;
}

section.fullH{
  min-height: 100vh;
}

.container{
  padding:0 20px;
  max-width:700px;
}
.container.mid{
  max-width:1000px;
}
.container.wide{
  max-width:1300px;
}
section.white{
  background: white;
}
section.blue{
  background: #d6004f;
  background: linear-gradient(139deg,#ffc92f,#ff185c,#f316d5,#b81ed2);
  background:blue;
  color: white
}

section.blue h1, section.blue h2, section.blue h3{
  color:white
}

svg.raw{
  width: 256px;
  height: 256px;
}
.max200{
  max-width:200px;
}
.max300{
  max-width:300px;
}

.max400{
  max-width:400px;
}


.max500{
  max-width:500px;
}

/* FORMS */


.label em{
  opacity: 0.5;
}

.empty {
  text-align: center;
}
.empty img{
  max-width: 300px;
  width:50%;
  margin-bottom: 20px;
  margin-top: 20px;
}


.powered{
  margin-top:30px;
}

.button.is-link {
   background-color: #005bff;
}


/* navbar */


.navbar.desktop{
  font-size: 20px;
}

.navbar .navbar-brand{
  margin-right: 20px;
}



/* FOOTER */


.foot .kickBrand img{
  max-width: 150px;
  margin-bottom: 20px;
}

.button.is-warning{
  background: linear-gradient(29deg,  #ff0038, #ff6b00);
}

.foot .container{
  margin-top: 0  ;
}
.foot{

    background: linear-gradient(139deg,#ffc92f,#ff185c,#f316d5,#b81ed2);
    background: #dcdcdc;
    min-height: 300px;
    padding-top: 30px;
    padding-bottom: 20px;
    background: linear-gradient(29deg, #005bff, #fb00ff);
    background: #222;
    background: linear-gradient(29deg, #1e2023, #2e3946);
    background: #dcdcdc;
    line-height: 25px;
}

.foot, .foot a, .foot .socialicon{
    color: #000;
    color: #fff;
    color: #333;
}

.footlinks h5{
    font-weight: 700;
    margin-top: 0;
    font-size: 1.15rem;
}

.footlinks nav a{
    display: block;
    white-space: nowrap;
}

.footlinks nav a:hover{
  text-decoration: underline;
}
.footlinks .icon{
    display: none;
}

.foot .inviteBrand img{
    max-height: 70px;
    margin-right: 3rem;
    margin-bottom: 20px;
}
.foot .inviteBrand{
  margin-bottom: 1rem;
}
.foot{
  padding-top: 4rem;
  padding-bottom: 1rem;
}

.foot .socialicon{
  font-size: 1.5rem;
  margin-right: 10px;
  opacity: 1;

}
