@media (min-width: 576px) {
  .container {
    max-width: 767px;
  }
}

@media (min-width: 768px) {
  body {
    font-size: 1em;
  }
  h1 {
    font-size: 2.6em;
  }
  h2 {
    font-size: 2.2em;
  }
  h3 {
    font-size: 1.8em;
  }
  h4 {
    font-size: 1.4em;
  }
  h5 {
    font-size: 1.2em;
  }
  h6 {
    font-size: 1.1em;
  }
.k1 {
  overflow: hidden;
  margin: 0 0 1em 0;
  height:150px;
color: #ffffff;

}
  .container {
    max-width: 990px;
    margin: 0 auto;
  }

.counter_value_suffix{
	font-size:36px;
	vertical-align: text-top;
	position: relative;
	left: -2px;
	top: -5px;
	/*color: #10b8c7;*/

}
  /* Layout */
  .no-sidebar .main-container {
    grid-template-columns: 1fr;
  }
  .sidebar-left .main-container {
    grid-template-columns: 30% 70%;
  }
  .sidebar-right .main-container {
    grid-template-columns: 70% 30%;
  }
  .two-sidebar .main-container {
    grid-template-columns: 30% 40% 30%;
  }
  #main {
    order: 2;
  }
  .sidebar {
    position: relative;
    width: 100%;
    margin: 0;
  }
  /* Sidebar */
  #sidebar-left {
    ordeR: 1;
    padding: 0 20px 0 0;
  }
  #sidebar-right {
    order: 3;
    padding: 0 0 0 20px;
  }
  .services,
  .full,
  .footer-container,
  .footer-bottom-last,
  .flex-container {
    flex-direction: row;
  }
  .full {
    margin-bottom: 1em;
  }
  .item {
    flex: 1;
    padding: 0 20px 0 0;
    margin: 0;
  }
  .item:last-child {
    padding: 0;
  }
  .service {
    margin: 0.6em;
    flex: 1 1 calc(33% - 1em);
    max-width: calc(33.333% - 1em);
  }


  /* main */
  .node-header {
    font-size: 1em;
  }
  li.taxonomy-term a {
    padding: 8px 20px;
  }
  li.node-readmore a {
    padding: 0.6em 1em;
  }
  /* Comment */
  .comment-user-picture {
    flex: 0 0 100px;
    padding: 0 10px;
  }
  /* Footer */
  .footer-bottom-last > * {
    margin-bottom: 0;
  }
  .footer-block {
    padding-right: 20px;
  }
  .last-flex-item, .last-footer-block {
    padding-right: 0;
  }
  .social-icons li {
    margin: 0;
  }
  /* components */
  .width30 {
    width: 30%;
  }
  .width40 {
    width: 40%;
  }
  .width50 {
    width: 50%;
  }
  .width60 {
    width: 60%;
  }
  .width70 {
    width: 70%;
  }
  .width80 {
    width: 80%;
  }
  .width90 {
    width: 90%;
  }
}
@media (min-width: 992px) {
  .container {
    max-width: 1168px;
  }
  th {
    padding: 10px;
  }
  td {
    padding: 5px 10px;
  }
  /* Header */
  .site-branding img {
    max-height: 80px;
  }
  .site-name {
    font-size: 1.6em;
  }
  .site-slogan {
    font-size: 0.9em;
    margin-top: 2px;
  }
  .morphist {
    text-align: left;
  }
  .menu-wrap {
    position: relative;
    float: right;
    margin-left: 0;
    transition: none;
  }
  .mobile-menu {
    display: none;
  }
  .main-menu {
    display: block;
  }
  .search-box-content .block {
    width: 70%;
  }
  #page-header {
    padding: 6em 0 1em 0;
  }
  .header-circle1,
  .header-circle2,
  .header-circle3,
  .header-circle4 {
    width: 7em;
    height: 7em;
  }
  .header-circle5,
  .header-circle6 {
    width: 10em;
    height: 10em;
  }
}
@media (min-width: 1170px) {
  .container {
    max-width: 1170px;
  }
}
/*Microcity Custome*/

.hover16 {
	opacity: 1;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	padding: .1em;
}
.hover16:hover {
	opacity: .5;
}

.hover15 figure img {
	opacity: 1;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	padding: .1em;
}
.hover15 figure:hover img {
	opacity: .5;
}

  .blog {
    margin: 0.4em;
    flex: 1 1 calc(100% - 1em);
    max-width: calc(100% - 1em);
    background: #181a25;
    padding: 0.5em;
  }
   .blog-post {  
     
      z-index: 3;
      margin-bottom: 0;
      left: 10px;
      bottom: 50px;
      position: relative;
  }
  
   .blog-post a {
	display: inline-block;
	max-width: 100px;
	height: 28px;
	line-height: 28px;
	padding: 0 1em;
	background-color: black;
	border: 1px solid #f26c4f;
	border-radius: 3px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	color: white;
	font-size: 13px;
	text-decoration: none;
	-webkit-transition: .2s;
	transition: .2s;
}
 .blog-post a:hover {
	background-color: #78C0A8;
	border: 1px solid #3498db;
	color: black;
}



.has-dropcap:first-letter {
  float: left;
  font-size: 6rem;
  line-height: 1;
  margin: 0.1em 0.1em 0.2em 0;
  padding: 0.1em;
  text-align: justify;
  text-justify: inter-word;
  color:#78C0A8;
}

.textJ {
  text-align: justify;
  text-justify: inter-word;
}

tagcloud01 ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.tagcloud01 ul li {
	display: inline-block;
	margin: 0 .3em .3em 0;
	padding: 0;
}
.tagcloud01 ul li a {
	display: inline-block;
	max-width: 100px;
	height: 28px;
	line-height: 28px;
	padding: 0 1em;
	background-color: black;
	border: 1px solid #f26c4f;
	border-radius: 3px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	color: white;
	font-size: 13px;
	text-decoration: none;
	-webkit-transition: .2s;
	transition: .2s;
}
.tagcloud01 ul li a:hover {
	background-color: #78C0A8;
	border: 1px solid #3498db;
	color: black;
}
.imagecenter {
   display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.main {
  font-family:Arial;
  width:500px;
  display:block;
  margin:0 auto;
}
.slider1 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    }
    
    #content-wrapper{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

.column{
	width: 600px;
	padding: 10px;

}

#featured{
	max-width: 500px;
	max-height: 600px;
	object-fit: cover;
	cursor: pointer;
	border: 2px solid black;

}

.thumbnail{
	object-fit: cover;
	max-width: 180px;
	max-height: 100px;
	cursor: pointer;
	opacity: 0.5;
	margin: 5px;
	border: 2px solid black;

}

.thumbnail:hover{
	opacity:1;
}

.active{
	opacity: 1;
}

#slide-wrapper{
	max-width: 500px;
	display: flex;
	min-height: 100px;
	align-items: center;
}

#slider{
	width: 440px;
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;

}

#slider::-webkit-scrollbar {
		width: 8px;

}

#slider::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);

}
 
#slider::-webkit-scrollbar-thumb {
  background-color: #dede2e;
  outline: 1px solid slategrey;
   border-radius: 100px;

}

#slider::-webkit-scrollbar-thumb:hover{
    background-color: #18b5ce;
}

.arrow{
	width: 30px;
	height: 30px;
	cursor: pointer;
	transition: .3s;
}

.arrow:hover{
	opacity: .5;
	width: 35px;
	height: 35px;
}