/*
	Template Name: Stiri
	Description: Mobile News Template
	Author: Alfisahr
	Author URI: http://themeforest.net/user/alfisahr
	Version: 1.1
*/

/*==============================================================
>>> TABLE OF CONTENTS:
================================================================
1. Import
2. Normalize
3. Global
	3.1. Links
	3.2. Forms
	3.3. Components
	3.4. Helper class
	3.5. Clearings
4. Content & Navbar
	4.1. Content
	4.2. Navbar
	4.3. Sidenav
	4.4. Main menu
5. Homepage
	5.1. Slider
	5.2. Issue list
	5.3. Dark color
6. News
	6.1. Small listing
	6.2. News card
	6.3. News inside
	6.4. Comments
7. Gallery
8. Pages
	8.1. FAQ
	8.2. Not Found
	8.3. Indeks
9. Membership
	9.1. Login
	9.2. Profile
10. Features
	10.1. Icons
	10.2. Colors
11. Footer
--------------------------------------------------------------*/

/*==============================================================
1. Import
==============================================================*/

@import url('../../assets/plugins/materialize/css/materialize.min.css');
@import url('../../assets/plugins/slick/css/slick.css');
@import url('../../assets/plugins/swipebox/css/swipebox.min.css');
@import url('../../assets/plugins/animate.css/keyframe.css');
@import url('../../assets/plugins/font-awesome/css/font-awesome.min.css');
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');

/*==============================================================
2. Normalize
==============================================================*/
html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}

body {
	margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
}

a:active,
a:hover {
	outline: 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	max-width: 100%;
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 1em 40px;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
	height:auto;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"] {
	-webkit-appearance: textfield;
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}

input:not([type]):focus:not([readonly]),
input[type=text]:focus:not([readonly]),
input[type=password]:focus:not([readonly]),
input[type=email]:focus:not([readonly]),
input[type=url]:focus:not([readonly]),
input[type=time]:focus:not([readonly]),
input[type=date]:focus:not([readonly]),
input[type=datetime-local]:focus:not([readonly]),
input[type=tel]:focus:not([readonly]),
input[type=number]:focus:not([readonly]),
input[type=search]:focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
	border-bottom: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	outline:0;
	background-image: none;
}

/*==============================================================
3. Global
==============================================================*/

body {
	font-family: 'Roboto', sans-serif;
	background-color: #fff;
	line-height: 1.5;
	font-size: 16px;
	color: rgba(0,0,0,0.8);
}
body::-webkit-scrollbar { 
    display: none; 
}

h1,h2,h3,h4,h5,h6 {font-weight:500;margin:0;padding:0;}
h1 {font-size:30px;}
h2 {font-size:26px;}
h3 {font-size:24px;}
h4 {font-size:20px;}
h5 {font-size:18px;}
h6 {font-size:16px;}

ul,ol {
	padding-left:15px;
}
ul li {
	list-style-type: disc;
}
ul li,
ol li {
	list-style-position: inside;
}

address {
	font-style:normal;
	margin-bottom:20px;
}

tr {
	border-bottom: 0;
	border-top: 1px solid #e9ecef;
}
td, th {
	padding: .75rem;
}
thead th {
	border-bottom: 2px solid #e9ecef;
}
.bordered tr {
	border-top: 0;
}
.bordered td,
.bordered th {
	border: 1px solid #e9ecef;
}
.bordered thead td,
.bordered thead th {
    border-bottom-width: 2px;
}

pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #333;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px;
}

blockquote {
	border-left: 0;
	background-color: #f7f7f7;
	font-style: italic;
	padding: 10px 15px;
	font-weight: 500;
}
blockquote cite {
	display: block;
	font-style: normal;
	font-weight: 700;
	margin-top: 5px;
	font-size: 15px;
}
code {
	padding: 2px 4px;
	font-size: 90%;
	color: #c7254e;
	background-color: #f9f2f4;
	border-radius: 4px;
}

embed,
iframe,
object {
	width: 100%;
	border:0;
}

.block {
	display: block;
}
button.block{
	width: 100%;
}

.fb-share {
	background-color: #3b5998 !important;
}
.twitter-share {
	background-color: #55acee !important;
}
.gplus-share {
	background-color: #dd4b39 !important;
}

@media only screen and (max-width: 600px) {
	.container {
		width: calc(100% - 20px);
	}
}

@media only screen and (max-width: 320px) {
	.container {
		width: 95%;
	}
}

.center-element {
	position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}


/*--------------------------------------------------------------
3.1. Links
--------------------------------------------------------------*/
a {
	color: #C00;
	text-decoration:none;
}

a:visited {
}

a:hover,
a:focus,
a:active {
	color:none;
	text-decoration:none;
}

a:focus {
	outline: 0;
	text-decoration:none;
}

a:hover,
a:active {
	outline: 0;
	text-decoration:none;
}
/*--------------------------*/


/*--------------------------------------------------------------
3.2. Forms
--------------------------------------------------------------*/

input:not([type]),
input[type=text]:not(.browser-default),
input[type=password]:not(.browser-default),
input[type=email]:not(.browser-default),
input[type=url]:not(.browser-default),
input[type=time]:not(.browser-default),
input[type=date]:not(.browser-default),
input[type=datetime]:not(.browser-default),
input[type=datetime-local]:not(.browser-default),
input[type=tel]:not(.browser-default),
input[type=number]:not(.browser-default),
input[type=search]:not(.browser-default),
textarea.materialize-textarea {
	padding: 10px;
	border-bottom: 0;
	border: 1px solid #CCC;
	height: auto;
	box-sizing: border-box;
}

input:not([type]):focus:not([readonly]),
input[type=text]:not(.browser-default):focus:not([readonly]),
input[type=password]:not(.browser-default):focus:not([readonly]),
input[type=email]:not(.browser-default):focus:not([readonly]),
input[type=url]:not(.browser-default):focus:not([readonly]),
input[type=time]:not(.browser-default):focus:not([readonly]),
input[type=date]:not(.browser-default):focus:not([readonly]),
input[type=datetime]:not(.browser-default):focus:not([readonly]),
input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
input[type=tel]:not(.browser-default):focus:not([readonly]),
input[type=number]:not(.browser-default):focus:not([readonly]),
input[type=search]:not(.browser-default):focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #CCC;
    -webkit-box-shadow: none;
    box-shadow: none;
}

input:not([type]):disabled,
input:not([type])[readonly="readonly"],
input[type=text]:not(.browser-default):disabled,
input[type=text]:not(.browser-default)[readonly="readonly"],
input[type=password]:not(.browser-default):disabled,
input[type=password]:not(.browser-default)[readonly="readonly"],
input[type=email]:not(.browser-default):disabled,
input[type=email]:not(.browser-default)[readonly="readonly"],
input[type=url]:not(.browser-default):disabled,
input[type=url]:not(.browser-default)[readonly="readonly"],
input[type=time]:not(.browser-default):disabled,
input[type=time]:not(.browser-default)[readonly="readonly"],
input[type=date]:not(.browser-default):disabled,
input[type=date]:not(.browser-default)[readonly="readonly"],
input[type=datetime]:not(.browser-default):disabled,
input[type=datetime]:not(.browser-default)[readonly="readonly"],
input[type=datetime-local]:not(.browser-default):disabled,
input[type=datetime-local]:not(.browser-default)[readonly="readonly"],
input[type=tel]:not(.browser-default):disabled,
input[type=tel]:not(.browser-default)[readonly="readonly"],
input[type=number]:not(.browser-default):disabled,
input[type=number]:not(.browser-default)[readonly="readonly"],
input[type=search]:not(.browser-default):disabled,
input[type=search]:not(.browser-default)[readonly="readonly"],
textarea.materialize-textarea:disabled,
textarea.materialize-textarea[readonly="readonly"] {
	color: rgba(0,0,0,0.42);
	border-bottom: 1px solid #E0e0e0;
	background-color: #f7f7f7;
}

label {
	font-size: 14px;
	color: #212121;
}

.input-field > label {
	font-size: 16px;
	color: #212121;
	font-weight: 500;
	position: static;
}

.input-field .prefix {
	top: 27px;
}

.btn, .btn-large, .btn-small {
	font-weight: 700;
	background-color: #C00;
	letter-spacing: 0;
}
.btn:hover, .btn-large:hover, .btn-small:hover {
	background-color: #C00;
	opacity: .8;
}
.btn:focus, .btn-large:focus,
.btn-small:focus,
.btn-floating:focus {
	background-color: #C00;
	opacity: .8;
}


[type="checkbox"].filled-in:checked+span:not(.lever):after {
	border: 2px solid #C00;
	background-color: #C00;
}
[type="checkbox"]:checked+span:not(.lever):before {
	border-right: 2px solid #C00;
	border-bottom: 2px solid #C00;
}
[type="radio"]:checked+span:after,
[type="radio"].with-gap:checked+span:before,
[type="radio"].with-gap:checked+span:after {
	border: 2px solid #C00;
}
[type="radio"]:checked+span:after,
[type="radio"].with-gap:checked+span:after {
	background-color: #C00;
}

.select-wrapper input[type=text]:not(.browser-default) {
	padding: 0 10px;
}

select {
	padding: 10px;
	outline: 0;
}

.switch label input[type=checkbox]:checked+.lever:after {
	background-color: #C00;
}
.switch label input[type=checkbox]:checked+.lever {
	background-color: rgba(192,0,0,.4);
}

input[type=range]::-webkit-slider-thumb {
	background-color: #C00;
}
input[type=range]::-moz-range-thumb {
	background-color: #C00;
}
input[type=range]::-ms-thumb {
	background-color: #C00;
}
input[type=range]+.thumb {
	background-color: #C00;
}
input[type=range]+.thumb .value {
	color: #C00;
}

.datepicker-date-display,
.timepicker-digital-display {
	background-color: #000;
}
.datepicker-calendar-container .select-wrapper input[type=text]:not(.browser-default),
.datepicker-calendar-container input[type=text]:not(.browser-default) {
	padding: 0;
}
.datepicker-calendar-container input[type=text]:not(.browser-default) {
	border: 0;
}


/*--------------------------------------------------------------
3.3. Components
--------------------------------------------------------------*/
@media only screen and (max-width: 992px) {
	.tabs .tab {
		-webkit-box-flex: 0;
		-webkit-flex-grow: 0;
		-ms-flex-positive: 0;
		flex-grow: 0;
	}
}
.tabs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}
.tabs .tab {
	-webkit-box-flex: 1;
	-webkit-flex-grow: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
}
.tabs .tab:not(:last-child):not(:nth-last-child(2)) {
	border-right: 1px solid #CCC;
}
.tabs .tab a {
	background-color: #e0e0e0;
	border-top: 4px solid #ccc;
	font-weight: 700;
	color: #212121;
	opacity: .8;
}
.tabs .tab a:hover {
	background-color: #e0e0e0;
	color: #212121;
	opacity: 1;
}
.tab a.active {
	opacity: 1;
	background-color: #fff !important;
	border-top: 4px solid #c00;
	color: #212121 !important;
}
.tabs .indicator {
	background-color: transparent;
	height: 0;
}

.tabs-content {
	padding: 20px 0;
}

table.bordered {
	border-left: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
	border-top: 1px solid #e0e0e0;
}

.collection {
	margin: 0;
	border: 0;
	border-radius: 0;
}
.collection > li > a {
	color: #212121;
	display: block;
	position: relative;
}
.collection > li > a:after {
	position: absolute;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: 'FontAwesome';
	content: "\f101";
	color: #999;
}
.collection > li > a .icon {
	position: absolute;
	left: 0;
	top: 15px;
	color: #ccc;
	font-size: 22px;
}
.collection > li > a .caption {
	width: calc(100% - 40px);
	margin-left: 40px;
	border-bottom: 1px dashed #e0e0e0;
	padding: 15px 11px 15px 0;
}
.collection > li > a .caption .title {
	font-size: 16px;
	font-weight: 700;
}
.collection > li > a .caption p,
.collection > li > a .caption .desc {
	margin: 0;
	font-size: 13px;
	color: #757575;
}

/*--------------------------------------------------------------
Modals
--------------------------------------------------------------*/
.modal {
	outline: 0;
	background-color: #fff;
}

/*--------------------------------------------------------------
Dropdown
--------------------------------------------------------------*/
.dropdown-content {
	min-width: 200px;
}
.dropdown-content li > a,
.dropdown-content li > span {
	color: rgba(0,0,0,0.87);
}
.dropdown-content li > a > i {
	color: rgba(0,0,0,0.3);
}

/*--------------------------------------------------------------
3.4. Helper class
--------------------------------------------------------------*/
.m-0 {margin: 0px!important;}
.mr-0 {margin-right: 0px!important;}
.ml-0 {margin-left: 0px!important;}
.mb-0 {margin-bottom: 0px!important;}
.mt-0 {margin-top: 0px!important;}
.m-5 {margin: 5px!important;}
.mr-5 {margin-right: 5px!important;}
.ml-5 {margin-left: 5px!important;}
.mb-5 {margin-bottom: 5px!important;}
.mt-5 {margin-top: 5px!important;}
.m-10 {margin: 10px!important;}
.mr-10 {margin-right: 10px!important;}
.ml-10 {margin-left: 10px!important;}
.mb-10 {margin-bottom: 10px!important;}
.mt-10 {margin-top: 10px!important;}
.m-15 {margin: 15px!important;}
.mr-15 {margin-right: 15px!important;}
.ml-15 {margin-left: 15px!important;}
.mb-15 {margin-bottom: 15px!important;}
.mt-15 {margin-top: 15px!important;}
.m-20 {margin: 20px!important;}
.mr-20 {margin-right: 20px!important;}
.ml-20 {margin-left: 20px!important;}
.mb-20 {margin-bottom: 20px!important;}
.mt-20 {margin-top: 20px!important;}
.m-25 {margin: 25px!important;}
.mr-25 {margin-right: 25px!important;}
.ml-25 {margin-left: 25px!important;}
.mb-25 {margin-bottom: 25px!important;}
.mt-25 {margin-top: 25px!important;}
.m-30 {margin: 30px!important;}
.mr-30 {margin-right: 30px!important;}
.ml-30 {margin-left: 30px!important;}
.mb-30 {margin-bottom: 30px!important;}
.mt-30 {margin-top: 30px!important;}
.no-m {margin: 0!important;}
.no-mb {margin-bottom: 0!important;}
.no-mt {margin-top: 0 !important;}
.no-ml {margin-left: 0 !important;}
.no-mr {margin-right: 0 !important;}

.p-0 {padding: 0px!important;}
.pr-0 {padding-right: 0px !important;}
.pl-0 {padding-left: 0px !important;}
.pb-0 {padding-bottom: 0px!important;}
.pt-0 {padding-top: 0px!important;}
.p-5 {padding: 5px!important;}
.pr-5 {padding-right: 5px !important;}
.pl-5 {padding-left: 5px !important;}
.pb-5 {padding-bottom: 5px!important;}
.pt-5 {padding-top: 5px!important;}
.p-10 {padding: 10px!important;}
.pr-10 {padding-right: 10px !important;}
.pl-10 {padding-left: 10px !important;}
.pb-10 {padding-bottom: 10px!important;}
.pt-10 {padding-top: 10px!important;}
.p-15 {padding: 15px!important;}
.pr-15 {padding-right: 15px !important;}
.pl-15 {padding-left: 15px !important;}
.pb-15 {padding-bottom: 15px!important;}
.pt-15 {padding-top: 15px!important;}
.p-20 {padding: 20px!important;}
.pr-20 {padding-right: 20px !important;}
.pl-20 {padding-left: 20px !important;}
.pb-20 {padding-bottom: 20px!important;}
.pt-20 {padding-top: 20px!important;}
.p-25 {padding: 25px!important;}
.pr-25 {padding-right: 25px !important;}
.pl-25 {padding-left: 25px !important;}
.pb-25 {padding-bottom: 25px!important;}
.pt-25 {padding-top: 25px!important;}
.p-30 {padding: 30px!important;}
.pr-30 {padding-right: 30px !important;}
.pl-30 {padding-left: 30px !important;}
.pb-30 {padding-bottom: 30px!important;}
.pt-30 {padding-top: 30px!important;}
.no-p {padding: 0!important;}
.no-pt {padding-top: 0 !important;}
.no-pb {padding-bottom: 0 !important;}
.no-pl {padding-left: 0 !important;}
.no-pr {padding-right: 0 !important;}


.no-top {top: 0 !important;}

.text-muted {
	color: #999;
}
.line {height:1px;background:#eee;margin-bottom:20px;}
.text-center {text-align:center;}
.font-weight-bold {font-weight: 700;}
.semibold {font-weight: 500;}
.font-weight-normal {font-weight: 700;}
.font-italic {font-style: italic;}

.pagination {
	padding:0;
	font-size: 0;
	margin: 0;
	text-align: center;
	background-color: rgba(0,0,0,.05);
	border-radius: 2px;
	-webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.02);
	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.02);
}
.pagination li {
	height: auto;
	margin-right: 1px;
	border-radius: 0;
	background-color: transparent;
}
.pagination li i {
	font-size: 16px;
}
.pagination li a {
	text-decoration: none;
	color: #444;
	line-height: 35px;
}
.pagination li.active {
	background-color: #C00;
}
.pagination li.disabled a {
	color: #ccc;
}

.load-more {
	display: inline-block;
	position: relative;
	padding-right: 15px;
}
.load-more:after {
	position: absolute;
	right: 0;
	top: 0;
	font-family: 'FontAwesome';
	content: "\f103";
}

.hide {
	display: none;
}

span.highlight {
	background:#F7F7A3;
	display:inline-block;
	padding:0 5px;
}
span.dropcap {
	font-weight: 700;
	display:block;
	float: left;
	padding: 0px 10px 0 5px;
	line-height: 36px;
	font-size: 35px;
	text-transform: uppercase;
}


/*--------------------------------------------------------------
3.5. Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after {
	clear: both;
}



/*==============================================================
4. Content & Navbar
==============================================================*/
/*--------------------------------------------------------------
4.1. Content
--------------------------------------------------------------*/
#main {
	position: relative;
	height: 100vh;
}
#page {
	padding-top: 56px;
	min-height: calc(100% - 32px);
}
.dark-bg {
	background-color: #212121;
}
.content-container {
	padding: 20px;
}
.row.justify {
	margin-left: -.75rem;
	width: calc(100% + 1.5rem);
}
.subcontent-list {
	width: calc(100% - 15px);
	margin: 0 0 0 15px;
	padding: 0;
}
.subcontent-list > li {
	list-style-type: disc !important;
	list-style-position: outside;
	border-bottom: 1px dashed #e0e0e0;
	padding: 10px 0;
}
.subcontent-list > li .list-heading {
	font-size: 16px;
	font-weight: 700;
}

.section {
	padding: 20px;
}
.section.grey:not(.darken-2):not(.darken-3):not(.darken-4) {
	background-color: #eee!important;
	border-top: 1px solid #e0e0e0;
	border-bottom: 1px solid #e0e0e0;
}
.section.grey .card-list > li .card {
    margin: 0;
}
.section-title {
	padding: 0;
	padding-left: 15px;
	position: relative;
    font-weight: 700;
    color: #212121;
    font-size: 24px;
    text-transform: uppercase;
	margin: 0 0 20px 0;
}
.section-title:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
    height: 100%;
    width: 5px;
	background-color: #c00;
}


.title-container {
	padding: 15px 20px;
}
.title-container.grey {
	background-color: #EEE !important;
}
.page-title {
	padding: 0 0 0 15px;
	position: relative;
	font-weight: 700;
	color: #212121;
	font-size: 24px;
	text-transform: uppercase;
}
.page-title:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
    height: 100%;
    width: 5px;
	background-color: #c00;
}
.banner-container {
	position: relative;
	height: 200px;
	background-position: center center;
	background-size: cover;
}
.banner-container .overlay {
	background-color: rgba(0,0,0,.5);
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
.banner-container .caption,
.banner-container .profile-caption {
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	padding: 40px 20px 20px;
	background: -moz-linear-gradient(transparent, rgba(0,0,0,.7));
	background: -webkit-linear-gradient(transparent, rgba(0,0,0,.7));
	background: linear-gradient(transparent, rgba(0,0,0,.7));
}
.banner-container .profile-caption:after {
	content: "";
	clear: both;
	display: table;
}
.banner-container .caption .page-title {
	padding: 0;
	color: #fff;
}
.banner-container .caption .page-title:before {
	width: 0;
}
.banner-container .profile-caption .thumb {
	float: left;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	overflow: hidden;
	border: 3px solid #fff;
}
.banner-container .profile-caption .ctn {
	margin-left: 15px;
	width: calc(100% - 75px);
	color: #fff;
}
.banner-container .profile-caption .ctn .name {
	font-size: 16px;
	font-weight: 700;
}
.banner-container .profile-caption .ctn .desc,
.banner-container .caption .desc {
	margin: 0;
	font-size: 13px;
	color: rgba(255,255,255,.7);
}

.content-container > .section {
	padding: 0;
	margin-bottom: 25px;
}
.content-container > .section.with-line {
	padding: 0 0 25px 0;
	border-bottom: 1px solid #ddd;
}
.tabs-content.profile .section > .section-title,
.content-container > .section > .section-title {
	padding: 0;
	font-size: 16px;
	margin-bottom: 15px;
	text-transform: none;
}
.tabs-content.profile .section > .section-title:before,
.content-container > .section > .section-title:before {
	background-color: transparent;
}


/*--------------------------------------------------------------
4.2. Navbar
--------------------------------------------------------------*/
.top-navbar-container {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
}
.navbar {
	position: relative;
	background-color: #fff;
	padding: 0 20px;
	min-height: 56px;
	z-index: 900;
	box-shadow: 0 0 10px #333;
	-moz-box-shadow: 0 0 10px #333;
	-webkit-box-shadow: 0 0 10px #333;
}
.navbar .navleft {
	position: absolute;
	left: 20px;
	top: 0;
	width: 20px;
	padding: 11px 0;
}
.navbar .navleft a {
	color: #000;
	font-size: 22px;
}
.navbar .navright {
	position: absolute;
	right: 20px;
	top: 0;
	width: 20px;
	padding: 11px 0;
}
.navbar .navright a {
	color: #000;
	font-size: 22px;
}
.navbar .navright .show-search.active {
	color: rgba(255,255,255,.5);
}
.navbar .navright .close-sidenav,
.navbar .navright .show-search.hide {
	display: none;
}
.navbar .navright .close-sidenav.show {
	display: block;
}
.navbar .app-title {
	width: calc(100% - 40px);
	margin-left: 20px;
	color: #fff;
	padding: 11px 0;
	text-align: center;
	text-transform: lowercase;
}
.navbar .app-title span {
	font-weight: 300;
}
.navbar .app-title h1 {
	font-weight: 900;
}
.searchbar {
	position: absolute;
	width: 100%;
	left: 0;
	top: -2px;
	z-index: 98;
	padding: 8px 20px;
	background-color: #ccc;
}
.searchbar.show {
	top: 100%;
}
.searchbar input[type="text"] {
	background-color: #fff;
	width: calc(100% - 50px);
	margin: 0;
}
.searchbar .btn {
	float: right;
	width: 50px;
	font-size: 16px;
	height: auto;
	line-height: 39px;
	-webkit-box-shadow: 0 0 0 0 rgba(0,0,0,0.14), 0 0 0 0 rgba(0,0,0,0.12), 0 0 0 0 rgba(0,0,0,0.2);
    box-shadow: 0 0 0 0 rgba(0,0,0,0.14), 0 0 0 0 rgba(0,0,0,0.12), 0 0 0 0 rgba(0,0,0,0.2);
}

.top-left-nav {
	position: relative;
	background-color: #E0E0E0;
	border-bottom: 1px solid rgba(0,0,0,.1);
	min-height: 70px;
	padding: 15px 20px;
}
.top-left-nav .thumb {
	position: absolute;
	left: 20px;
	top: 15px;
	width: 45px;
	height: 45px;
	overflow: hidden;
	border-radius: 50%;
}
.top-left-nav .caption {
	padding: 0 55px;
}
.top-left-nav .caption span {
	font-size: 14px;
}
.top-left-nav .caption .name {
	font-size: 16px;
	font-weight: 700;
}
.top-left-nav .btn-nav {
	position: absolute;
	right: 20px;
	top: 17px;
}

/*--------------------------------------------------------------
4.3. Sidenav
--------------------------------------------------------------*/
.sidenav {
	width: 100%;
	top: 56px;
	z-index: 998;
	height: calc(100% - 56px);
	padding-bottom: 0;
}
.sidenav-section {
	border-bottom: 1px solid #ccc;
	padding: 15px 0;
	text-align: center;
	font-size: 14px;
}
.sidenav-section p {
	margin: 0;
}
.sidenav-section.footer {
	border: 0;
	padding: 15px 0;
	background-color: transparent;
}
.sidenav-section.footer .ft-menu a {
	color: #757575;
	text-decoration: underline;
	margin: 0 4px;
	font-weight: 400;
}


/*--------------------------------------------------------------
4.4. Main menu
--------------------------------------------------------------*/
#main-menu,
#main-menu ul,
#main-menu ul li,
#main-menu ul li a {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#main-menu {
	width: 100%;
	color: rgba(0,0,0,.8);
	border-bottom: 1px solid #CCC;
}
#main-menu ul ul {
	display: none;
}
#main-menu ul ul.expand {
	display: block;
}
#main-menu > ul > li {
	position: relative;
}
#main-menu ul li a {
	height: auto;
}
#main-menu > ul > li > a {
	padding: 10px 0 10px 20px;
	cursor: pointer;
	z-index: 2;
	text-decoration: none;
	color: #212121;
	font-size: 16px;
	width: calc(100% - 50px);
	text-transform: uppercase;
}
#main-menu ul li a:hover {
	background-color: transparent;
}
#main-menu > ul > li > a span.badge {
	float: none;
	margin: 0 0 0 5px;
	font-size: 12px;
	padding: 1px 4px;
	font-weight: 300;
	background-color: #C00;
	color: #fff;
	border-radius: 50px;
	line-height: 1;
}
#main-menu > ul > li > a .icon {
	display: inline-block;
	width: 30px;
	height: 25px;
	line-height: 1.6;
	float: none;
	margin: 0;
}
#main-menu > ul > li.active ul li.active a,
#main-menu > ul > li.active > a {
	font-weight: 700;
}
#main-menu > ul > li.open {
}
#main-menu li.active {
    background-color: transparent;
}
#main-menu > ul > li.open > a {
	border-bottom: 0px solid #eee;
}
#main-menu > ul > li > a:hover > span::after,
#main-menu > ul > li.active > a > span::after,
#main-menu > ul > li.open > a > span::after {
	border-color: #eeeeee;
}
#main-menu ul ul li a {
	cursor: pointer;
	padding: 10px 20px 10px 55px;
	z-index: 1;
	font-size: 15px;
	font-weight: 400;
	text-decoration: none;
	color: rgba(0,0,0,.8);
	text-transform: uppercase;
}
#main-menu ul ul li:first-child > a {
	box-shadow: none;
}
#main-menu ul ul ul li a {
	padding: 5px 10px 5px 70px;
}
#main-menu > ul > li > ul > li:last-child > a,
#main-menu > ul > li > ul > li.last > a {
	border-bottom: 0;
}
#main-menu > ul > li > ul > li.open:last-child > ul > li:last-child > a {
	border-bottom: 0;
}
#main-menu ul ul li.has-sub > a::after {
	display: block;
	position: absolute;
	content: "";
	width: 5px;
	height: 5px;
	right: 20px;
	z-index: 10;
	top: 11.5px;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}
#main-menu ul li.has-sub .arrow-icon {
	position: absolute;
	right: 0;
	top: 0;
	padding: 0 20px;
	line-height: 2.9;
	cursor: pointer;
	color: #ccc;
}
#main-menu ul li.has-sub .arrow-icon:hover {
}
#main-menu > ul > li.open > .arrow-icon .fa,
#main-menu ul ul li.open > .arrow-icon .fa{
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
#main-menu ul ul li.active > a::after,
#main-menu ul ul li.open > a::after,
#main-menu ul ul li > a:hover::after {
	border-color: #ffffff;
}


/*==============================================================
5. Homepage
==============================================================*/
/*--------------------------------------------------------------
5.1. Slider
--------------------------------------------------------------*/
.slick-slider .slick-slide {
	outline: 0;
}
.home-slider,
.home-slider2,
.gallery-page-slider,
.gallery-slider {
	display: none;
}
.home-slider.slick-initialized,
.home-slider2.slick-initialized,
.gallery-page-slider.slick-initialized,
.gallery-slider.slick-initialized {
	display: block;
}

.home-slider {
	margin-bottom: 20px;
	position: relative;
}
.home-slider:after {
	position: absolute;
	bottom: 0;
	left: 20px;
	height: 5px;
	content: '';
	width: calc(100% - 40px);
	border-top: 2px dashed #e0e0e0;
}
.home-slider .item {
	position: relative;
}
.home-slider .item .thumb {
	margin-bottom: 10px;
}
.home-slider .item .thumb img {
	width: 100%;
}
.home-slider .item .caption {
	padding: 0 20px 20px 20px;
}
.home-slider .item .caption .category,
.home-slider2 .item .caption .category {
	text-transform: uppercase;
	font-size: 14px;
	color: #C00;
	font-weight: 700;
}
.home-slider .item .caption .meta {
	font-size: 12px;
	color: #757575;
}
.home-slider .item .caption .entry-title,
.home-slider2 .item .caption .entry-title,
.home-slider .item .caption .entry-title h1 {
	font-size: 22px;
	font-weight: 900;
	line-height: 1.25;
}
.home-slider .item .caption .entry-title a,
.home-slider2 .item .caption .entry-title a {
	color: #212121;
}
.home-slider .slick-dots,
.home-slider2 .slick-dots,
.gallery-page-slider .slick-dots,
.gallery-slider .slick-dots {
	position: absolute;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	bottom: 0;
	left: 50%;
	padding: 0 8px;
	margin: 0;
	line-height: 0;
	z-index: 20;
}
.home-slider .slick-dots {
	background-color: #fff;
}
.home-slider .slick-dots li,
.home-slider2 .slick-dots li,
.gallery-page-slider .slick-dots li,
.gallery-slider .slick-dots li {
	display: inline-block;
	margin: 0 1px;
	line-height: 0;
}
.home-slider .slick-dots li button,
.home-slider2 .slick-dots li button,
.gallery-page-slider .slick-dots li button,
.gallery-slider .slick-dots li button {
	width: 8px;
	height: 8px;
	padding: 0;
	border-radius: 50%;
	color: transparent;
	border: 0;
}
.home-slider .slick-dots li button {
	background-color: rgba(0,0,0,.3);
}
.home-slider .slick-dots li.slick-active button {
	background-color: rgba(0,0,0, 1);
}

.home-slider2 {
	position: relative;
}
.home-slider2 .item {
	position: relative;
}
.home-slider2 .item .thumb {
}
.home-slider2 .item .thumb img {
	width: 100%;
}
.home-slider2 .item .caption {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 20px 20px 30px;
	background: linear-gradient(transparent, rgba(0,0,0,.9));
}
.home-slider2 .item .caption .entry-title a {
	color: #fff;
}
.home-slider2 .item .caption .meta {
	font-size: 12px;
	color: rgba(255,255,255,.6);
}
.home-slider2 .slick-dots {
	bottom: 5px;
}
.home-slider2 .slick-dots li button {
	background-color: rgba(255,255,255,.5);
}
.home-slider2 .slick-dots li.slick-active button {
	background-color: rgba(255,255,255, 1);
}


.gallery-page-slider {
	margin-bottom: 30px;
}
.gallery-page-slider .item {
	position: relative;
}
.gallery-page-slider .item .thumb {
}
.gallery-page-slider .item .thumb img {
	width: 100%;
}
.gallery-page-slider .item .caption {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 20px 20px 30px;
	background: linear-gradient(transparent, #212121);
}
.gallery-page-slider .item .caption .category {
	text-transform: uppercase;
	font-size: 14px;
	color: #C00;
	font-weight: 700;
}
.gallery-page-slider .item .caption .meta {
	font-size: 12px;
	color: #757575;
}
.gallery-page-slider .item .caption .entry-title {
	font-size: 22px;
	font-weight: 900;
	line-height: 1.1;
}
.gallery-page-slider .item .caption .entry-title a {
	color: #fff;
}
.gallery-page-slider .slick-dots li button {
	background-color: rgba(255,255,255,.4);
}
.gallery-page-slider .slick-dots li.slick-active button {
	background-color: rgba(255,255,255, 1);
}


/*--------------------------------------------------------------
5.2. Issue list
--------------------------------------------------------------*/
.issue-list {
	margin: 0;
}
.issue-list li {
	border-bottom: 1px dashed #e0e0e0;
}
.issue-list li a {
	display: block;
	position: relative;
	color: #212121;
	font-weight: 700;
}
.issue-list li:not(.first-child) a {
	padding: 10px 0 10px 20px;
}
.issue-list li.first-child a {
	padding: 0 0 10px 20px;
}
.issue-list li a:before {
    content: '#';
    position: absolute;
    left: 0;
    top: 10px;
    color: #ccc;
    font-weight: 700;
}
.issue-list li:not(.first-child) a:before {
    top: 10px;
}
.issue-list li.first-child a:before {
    top: 0;
}

/*--------------------------------------------------------------
5.3. Dark color
--------------------------------------------------------------*/
.dark-bg .section-title {
	color: #fff;
}
.dark-bg .small-listing .item {
	border-bottom: 1px dashed #555;
}
.dark-bg .small-listing .item .post-content .entry-title a {
	color: rgba(255,255,255,.95);
}
.dark-bg .small-listing .item .post-content .meta {
	color: rgba(255,255,255,.5);
}
.dark-bg .tabs {
	background-color: transparent;
}
.dark-bg .tabs .tab:not(:last-child):not(:nth-last-child(2)) {
	border-right: 1px solid #444;
}
.dark-bg .tabs .tab a {
    background-color: #555;
    border-top: 4px solid #444;
    font-weight: 700;
    color: rgba(255,255,255,8);
}
.dark-bg .tab a.active {
    background-color: #212121 !important;
    border-top: 4px solid #c00;
    color: #FFF !important;
}

.dark-bg .issue-list li a:before {
	color: rgba(255,255,255,.4);
}
.dark-bg .issue-list li a {
	color: rgba(255,255,255,.95);
}
.dark-bg .issue-list li {
	border-bottom: 1px dashed #555;
}

.dark-bg .comment-title {
	color: #fff !important;
}

.dark-bg .comment-list {
	color: rgba(255,255,255,.95);
}
.dark-bg .comment-list li  {
	border-bottom: 1px dashed #555;
}
.dark-bg .comment-list li.has_child > ul li {
	border-top: 1px dashed #555;
}
.dark-bg .comment-list li.has_child > ul li textarea {
	border: 1px solid #555;
}
.dark-bg .comment-form .input-field input[type="text"],
.dark-bg .comment-form .input-field input[type="email"],
.dark-bg .comment-form textarea {
	border: 1px solid #555;
	color: #fff;
}
.dark-bg .comment-form .input-field input[type="text"]::-webkit-input-placeholder,
.dark-bg .comment-form .input-field input[type="email"]::-webkit-input-placeholder,
.dark-bg .comment-form textarea::-webkit-input-placeholder {
	color: rgba(255,255,255,.2)!important;
}
.dark-bg .comment-form .input-field input[type="text"]:-moz-placeholder,
.dark-bg .comment-form .input-field input[type="email"]::-webkit-input-placeholder,
.dark-bg .comment-form textarea::-webkit-input-placeholder {
	color: rgba(255,255,255,.2)!important;
}
.dark-bg .comment-form .input-field input[type="text"]::-moz-placeholder,
.dark-bg .comment-form .input-field input[type="email"]::-webkit-input-placeholder,
.dark-bg .comment-form textarea::-webkit-input-placeholder {
	color: rgba(255,255,255,.2)!important;
}
.dark-bg .comment-form .input-field input[type="text"]:-ms-input-placeholder,
.dark-bg .comment-form .input-field input[type="email"]::-webkit-input-placeholder,
.dark-bg .comment-form textarea::-webkit-input-placeholder {
	color: rgba(255,255,255,.2)!important;
}


/*==============================================================
6. News
==============================================================*/

/*--------------------------------------------------------------
6.1. Small listing
--------------------------------------------------------------*/
.small-listing .item {
	position: relative;
	border-bottom: 1px dashed #E0E0E0;
	min-height: 111px;
	padding: 10px 0;
	display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: center;
    align-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.small-listing .item.first-child {
	min-height: 100px;
	padding: 0 0 10px 0;
}
.small-listing .item .post-thumb {
	width: 90px;
	height: 90px;
	position: absolute;
	left: 0;
	top: 10px;
	overflow: hidden;
	border-radius: 2px;
}
.small-listing .item .post-thumb .postformat {
	position: absolute;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 2px solid #fff;
	text-align: center;
	color: #fff;
	background-color: rgba(0,0,0,.5);
	line-height: 1.6;
}
.small-listing .item.first-child .post-thumb {
	top: 0;
}
.small-listing .item .post-thumb img {
	width: 100%;
}
.small-listing .item .post-content {
	padding-left: 100px;
}
.small-listing .item .post-content .category {
	font-weight: 700;
    text-transform: uppercase;
	color: #999;
	font-size: 14px;
	line-height: 1;
}
.small-listing .item .post-content .meta {
	color: #757575;
    padding-left: 0;
    display: block;
    font-size: 12px;
}
.small-listing .item .post-content .entry-title {
	font-size: 16px;
	line-height: 1.25;
}
.small-listing .item .post-content .entry-title a {
	color: #212121;
	font-weight: 700;
}

/*--------------------------------------------------------------
6.2. News card
--------------------------------------------------------------*/

.card-list {
	margin-left: -10px;
	width: calc(100% + 20px) !important;
	margin-top: 0;
	margin-bottom: 0;
}
.card-list:after {
	content: "";
	clear: both;
	display: table;
}
.card-list.scrollable {
	overflow-x: auto;
	overflow-y: hidden;
	width: 100% !important;
	position: relative;
	white-space: nowrap;
	padding-bottom: 3px;
	margin-left: 0;
}
.card-list.scrollable::-webkit-scrollbar { 
    display: none; 
}
.card-list:not(.scrollable) > li {
    float: left;
    width: 100%;
    padding: 0 10px;
}
.card-list.scrollable > li {
	display: inline-block;
	width: 312px;
	white-space: normal;
}
.card-list.scrollable li {
	margin: 0 10px;
}
.card-list.scrollable li:first-child {
	margin: 0 10px 0 0;
}
.card-list.scrollable li:last-child {
	margin: 0 20px 0 10px;
}
@media screen and (min-width: 568px) {
	.card-list:not(.scrollable) > li {
		width: 50%;
	}
}
@media screen and (min-width: 1024px) {
	.card-list:not(.scrollable) > li {
		width: 33.3333%;
	}
}
.card-list > li .card {
	margin: 0 0 20px 0;
}
.card-list > li .card .card-content {
	padding: 15px;
}
.card-list > li .card .card-content .category {
	font-weight: 700;
    text-transform: uppercase;
    color: #999;
    font-size: 14px;
}
.card-list > li .card .card-content .entry-title {
	font-size: 16px;
	line-height: 1.3;
}
.card-list > li .card .card-content .entry-title a {
	color: #212121!important;
    font-weight: 700;
}
.card-list > li .card .card-content .meta {
    color: #757575;
    padding-left: 0;
    display: block;
    font-size: 12px;
}
.card-list > li .card-image .postformat {
	position: absolute;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	border: 3px solid #fff;
	font-size: 34px;
	text-align: center;
	color: #fff;
	background-color: rgba(0,0,0,.5);
	line-height: 1.9;
	z-index: 20;
}
.card-list > li .card-image .media-caption {
	position: absolute;
	bottom: 5px;
	right: 10px;
}
.card-list > li .card-image .media-caption span {
	display: block;
	float: left;
	background-color: #000;
	color: #fff;
	padding: 2px 5px;
	font-size: 12px;
}
.card-list > li .card-image .media-caption .icon {
	margin-right: 1px;
}

/*--------------------------------------------------------------
6.3. News inside
--------------------------------------------------------------*/
.blog .entry-header {
	padding: 20px;
}
.blog .entry-header .entry-meta {
	color: #757575;
	font-size: 14px;
}
.blog .share a {
	display: inline-block;
	background-color: #ccc;
	color: #fff;
	border-radius: 2px;
	padding: 0 12px;
	line-height: 2.1;
}
.blog .share a .icon {
	margin-right: 7px;
}
.blog .share a.facebook {
	background-color: #3b5998 !important;
}
.blog .share a.twitter {
	background-color: #55acee !important;
}
.blog .share a.linkedin {
	background-color: #0077b5 !important;
}
.blog .entry-thumb {
	line-height: 0;
	margin-bottom: 20px;
}
.blog .entry-thumb .caption {
	/*margin: 0 20px;*/
	padding: 10px;
	color: #c2c2c2;
	font-size: 12px;
	border-bottom: 1px dashed #e0e0e0;
	line-height: 1.5;
	font-style: italic;
	background: #252525;
}
.entry-thumb img,
.blog .entry-thumb img {
	width: 100%;
	line-height: 0;
}
.blog .entry-title,
.blog .entry-title h1 {
	font-size: 26px;
    line-height: 1.2;
    color: #000;
    font-weight: 700;
}
.blog .entry-content {
	padding: 0 20px;
}
.blog .entry-content p {
	margin: 0 0 15px 0!important;
	font-size: 18px!important;
	font-family: 'Source Sans Pro', sans-serif;
}
.blog .entry-content p span {
	margin: 0 0 15px 0!important;
	font-size: 18px!important;
	font-family: 'Source Sans Pro', sans-serif;
}
.entry-tags {
	padding: 10px 20px;
    background: #EEE;
    border-top: 1px solid #E0E0E0;
    border-bottom: 1px solid #E0E0E0;
	margin-bottom: 20px;
	margin-top: 25px;
}
.entry-tags .caption {
	line-height: 1;
	margin-bottom: 5px;
}
.entry-tags a {
	color: #333;
	font-weight: 700;
	display: inline-block;
    padding: 5px 10px;
    background: #FFF;
    border: 1px solid #E0E0E0;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    font-size: 10px;
}
.breadcrumbs a {
    text-decoration: none;
    padding-right: 10px;
    margin-right: 0;
    display: inline-block;
    position: relative;
    color: #C00;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 10px;
}
.breadcrumbs a:not(:last-child):after {
    font-family: 'fontawesome';
    content: "\f105";
    position: absolute;
    right: 0;
	top: -5px;
	font-size: 15px;
}

/*--------------------------------------------------------------
6.4. Comments
--------------------------------------------------------------*/
.comments {
	padding: 0 20px;
}

.comment-title {
	padding: 0 0 0 15px;
	position: relative;
	font-weight: 700;
	color: #212121;
	font-size: 18px;
	text-transform: uppercase;
	margin: 0 0 15px 0;
}
.comment-title:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
    height: 100%;
    width: 5px;
	background-color: #c00;
}

.comment-form {
	margin-bottom: 20px;
}
.comment-form .input-field {
	margin: 0 0 10px 0;
	line-height: 0;
}
.comment-form .input-field input[type="text"],
.comment-form .input-field input[type="email"],
.comment-form .input-field textarea {
	margin: 0;
}

.comment-list {
	margin: 0;
}
.comment-list li {
	border-bottom: 1px dashed #e0e0e0;
	position: relative;
	padding: 10px 0;
}
.comment-list > li:first-child {
	padding: 0 0 10px 0;
}
.comment-list li.has_child {
	padding: 10px 0 0 0;
}
.comment-list > li.has_child:first-child {
	padding: 0;
}
.comment-list li .thumb {
	position: absolute;
	top: 10px;
	left: 0;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	overflow: hidden;
}
.comment-list > li:first-child > .thumb {
	top: 0;
}
.comment-list li .thumb img {
	width: 100%;
}
.comment-list li .content {
	width: calc(100% - 65px);
	margin-left: 65px;
}
.comment-list li .content .name {
	font-size: 16px;
	font-weight: 500;
}
.comment-list li .content .meta {
	color: #757575;
	font-size: 13px;
	margin-bottom: 15px;
}
.comment-list li .content p {
	margin: 0 0 10px;
}
.comment-list li .content .c-nav {
	font-size: 14px;
	color: #757575;
}
.comment-list li .content .c-nav .love,
.comment-list li .content .c-nav .reply {
	display: inline-block;
	margin-right: 10px;
	cursor: pointer;
}
.comment-list li .content .c-nav .love.loved .fa {
	color: #ff0000;
}
.comment-list li .content .c-nav .love.loved.self {
	color: #ff0000;
}
.comment-list li.has_child > ul {
	padding: 0 0 0 60px;
	margin-top: 10px;
	height: 0;
	overflow: hidden;
}
.comment-list li.has_child > ul.show {
	height: auto;
}
.comment-list li.has_child > ul li {
	border: 0;
	border-top: 1px dashed #e0e0e0;
}
.comment-list li.has_child > ul li.form-reply {
	line-height: 0;
}
.comment-list li.has_child > ul li textarea {
	margin: 0;
	min-height: auto;
}

.blog .related {
	padding: 0 20px;
}


/*==============================================================
7. Gallery
==============================================================*/
.gallery-container {
	width: 788px;
	margin: 0 auto;
}

.gallery-slider {
	margin-bottom: 20px;
}
.gallery-slider .item {
	position: relative;
}
.gallery-slider .item .fullscreen {
	position: absolute;
	right: 15px;
	top: 10px;
	color: #fff;
}
.gallery-slider .item .thumb img {
	width: 100%;
}
.gallery-slider .item .caption {
	background-color: rgba(0,0,0,.5);
	color: #fff;
	padding: 10px;
	font-size: 14px;
}
.gallery-slider .item .caption .desc {
	display: block;
	margin-top: 15px;
}
.gallery-slider .slick-dots {
	bottom: 50px;
	z-index: 20;
}
.gallery-slider .slick-dots li button {
	background-color: rgba(255,255,255,.5);
}
.gallery-slider .slick-dots li.slick-active button {
	background-color: rgba(255,255,255, 1);
}

.entry-thumb.gallery-slider .item .caption {
	background-color: transparent;
	color: #757575;
	padding: 10px 0;
}



.thumb-video {
	position: relative;
	margin-bottom: 20px;
}
.thumb-video.ext-src {
    height: 0;
    padding-bottom: 56.25%;
}
.thumb-video.ext-src iframe.video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.thumb-video.int-src .video-js {
	position: relative;
}
.video-js .vjs-big-play-button {
	-webkit-transform: translate(-50%, -50%) !important;
	-ms-transform: translate(-50%, -50%) !important;
	transform: translate(-50%, -50%) !important;
	top: 50% !important;
	left: 50% !important;
	font-size: 4.2em !important;
	line-height: 1.4em !important;
	height: 1.5em !important;
	width: 1.5em !important;
    border-radius: 50% !important;
}
@media screen and (min-width: 788px) {
	.video-js .vjs-big-play-button {
		font-size: 7em !important;
		line-height: 1.4em !important;
		height: 1.5em !important;
		width: 1.5em !important;
	}
}

.gallery-content {
	color: #fff;
	margin-bottom: 20px;
}
.gallery-content .entry-title {
	font-size: 21px;
	font-weight: 900;
	margin: 0;
}
.gallery-content .meta {
	color: #e0e0e0;
	margin-bottom: 10px;
	font-size: 14px;
}
.gallery-content .entry-content {
	margin-bottom: 15px;
}
.gallery-content .tags .caption {
	font-size: 14px;
}
.gallery-content .tags {
	padding-bottom: 20px;
	border-bottom: 2px dashed #fff;
}
.gallery-content .tags a {
	padding: 5px 10px;
	background-color: #fff;
	color: #212121;
	display: inline-block;
	font-weight: 700;
}

.gallery-container .section {
	padding: 0;
}
.gallery-container .section .title {
	border-bottom: 3px solid #fff;
	position: relative;
	padding-top: 20px;
	margin-bottom: 30px;
}
.gallery-container .section .title h3 {
	text-transform: uppercase;
	background-color: #212121;
	padding: 0 20px;
	position: absolute;
	bottom: -15px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	color: #fff;
	margin-top: -70px;
}
.gallery-container .see-more {
	text-align: right;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
}
.gallery-container .see-more a {
	color: #fff;
}


.gallery-related-list {
	margin: 0 0 0 -5px;
	width: calc(100% + 10px);
}
.gallery-related-list:after {
	content: "";
	clear: both;
	display: table;
}
.gallery-related-list > li {
    float: left;
    width: calc(100% - 10px);
	margin: 0 5px 10px 5px;
}
@media screen and (min-width: 568px) {
	.gallery-related-list > li {
		width: calc(50% - 20px);
	}
}
@media screen and (min-width: 1024px) {
	.gallery-related-list > li {
		width: calc(33.3333% - 10px);
	}
}

.gallery-related-list li a {
	display: block;
	position: relative;
}
.gallery-related-list li a .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.1);
	z-index: 30;
}
.gallery-related-list li a:hover .overlay {
	background-color: rgba(0,0,0,.2);
}
.gallery-related-list li .thumb {
	line-height: 0;
}
.gallery-related-list li .badge {
	position: absolute;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: 4px solid #fff;
	color: #fff;
	font-size: 28px;
	line-height: 1.7;
	text-align: center;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	z-index: 10;
}
.gallery-related-list li .caption {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 12px 10px;
	background-color: rgba(0,0,0,.5);
	color: #fff;
	font-weight: 700;
	z-index: 20;
}

@media screen and (max-width: 788px) {
	.gallery-container {
		width: 100%;
		margin: 0;
	}
	.gallery-content,
	.gallery-container .section {
		padding: 0 20px;
	}
	.gallery-slider .item .caption {
		padding: 10px 20px;
	}
}

/*==============================================================
8. Pages
==============================================================*/
/*--------------------------------------------------------------
8.1. FAQ
--------------------------------------------------------------*/
.faq .collapsible {
	list-style: none;
	padding: 0;
	margin: 0;
	border-top: 0 solid #ddd;
    border-right: 0 solid #ddd;
    border-left: 0 solid #ddd;
	box-shadow: none;
	width: calc(100% - 15px);
	margin-left: 15px;
}
.faq .collapsible li {
	list-style-type: decimal;
	list-style-position: outside;
	margin: 0;
	background-color: #fff;
}
.faq .collapsible li .collapsible-header {
    display: block;
    cursor: pointer;
    background-color: transparent;
	padding: 15px 0 15px 0;
	font-weight: 700;
	color: #212121;
	position: relative;
	border-bottom: 1px dashed #e0e0e0;
}
.faq .collapsible li:first-child .collapsible-header {
	padding: 0 0 10px 0 !important;
}
.faq .collapsible li.active .collapsible-header {
	border-bottom: 0;
	color: #212121;
}
.faq .collapsible li .collapsible-header span.fa {
	position: absolute;
	right: 0;
	top: 17px;
	color: #999;
}
.faq .collapsible li:first-child .collapsible-header span.fa {
	top: 5px;
}
.faq .collapsible .active span.fa {
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
.faq .collapsible li .collapsible-body {
    display: none;
    border-bottom: 0;
    box-sizing: border-box;
	padding: 0;
}
.faq .collapsible li .collapsible-body p {
    margin: 0;
    padding: 0;
}

/*--------------------------------------------------------------
8.2. 404 Not Found
--------------------------------------------------------------*/
.not-found {
	text-align: center;
	padding: 0 20px;
}
.not-found .heading {
	font-weight: 900;
	font-size: 4em;
}
.not-found .desc {
	color: #757575;
	font-size: 14px;
	margin-bottom: 20px;
}
.go-to-home {
	color: #212121;
	letter-spacing: 1px;
	text-transform: uppercase;
	display: inline-block;
	position: relative;
	padding-right: 20px;
	font-size: 14px;
}
.go-to-home:after {
	content: "\f101";
	font-family: 'FontAwesome';
	position: absolute;
	right: 0;
	top: -3px;
	font-size: 16px;
	color: #999;
}

/*--------------------------------------------------------------
8.3. Indeks
--------------------------------------------------------------*/
.indeks-form label {
	font-weight: 700;
}
.indeks-form input[type=text]:not(.browser-default) {
	background-color: #fff;
}
.indeks-form select {
	padding: 5px;
}
.indeks-form input[type="text"] {
	padding: 7px;
}

/*--------------------------------------------------------------
8.4. Contact
--------------------------------------------------------------*/
.contact-form .input-field {
	margin-top: 0;
}
.contact-form .input-field.txtarea {
	line-height: 0;
}
.contact-form .input-field input[type=text],
.contact-form .input-field input[type=email],
.contact-form .input-field textarea {
	margin: 0;
}


/*==============================================================
9. Membership
==============================================================*/
/*--------------------------------------------------------------
9.1. Login
--------------------------------------------------------------*/
.login-title {
    padding: 15px 20px;
    text-align: center;
    color: #424242;
    background: #EEE;
}
.login-title h2 {
	font-size: 24px;
    text-transform: uppercase;
    line-height: 20px;
	font-weight: 700;
}

.form-login-container {
	border-bottom: 1px dashed #E0E0E0;
	padding: 15px 0;
	font-size: 14px;
}
.form-login-container .login,
.form-login-container .socmed-login {
	max-width: 305px;
	margin: 0 auto;
}
.form-login-container .socmed-login .socmed {
	margin-left: -5px;
	width: calc(100% + 10px);
}
.form-login-container .socmed-login .socmed:after {
	content: "";
	clear: both;
	display: table;
}
.form-login-container .socmed-login .socmed a {
	display: block;
	float: left;
	width: calc(50% - 10px);
	margin: 0 5px;
	padding: 10px;
	text-align: center;
	color: #fff;
	-webkit-box-shadow: 0 0 2px 0 rgba(33,33,33,.4);
    -moz-box-shadow: 0 0 2px 0 rgba(33,33,33,.4);
    box-shadow: 0 0 2px 0 rgba(33,33,33,.4);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}
.form-login-container .socmed-login .socmed a.fb {
	background-color: #4867aa;
}
.form-login-container .socmed-login .socmed a.tw {
	background-color: #55acee;
}

/*--------------------------------------------------------------
9.2. Profile
--------------------------------------------------------------*/
.activity-list {
	margin: 0;
}
.activity-list li {
	position: relative;
	margin-bottom: 10px;
	font-size: 14px;
}
.activity-list li .icon {
	position: absolute;
	left: 0;
	top: 0;
	width: 30px;
}
.activity-list li .ctn {
	padding-left: 30px;
}
.activity-list li .ctn .meta {
	color: #999;
	font-size: 13px;
}

.profile-list {
	margin: 0;
	padding: 0;
}
.profile-list li {
	margin-bottom: 15px;
}
.profile-list li .caption {
	font-weight: 700;
}

.tabs-content.profile .section {
	padding: 0;
	margin-bottom: 20px;
}
.tabs-content.profile .section .desc {
	font-size: 14px;
}


/*==============================================================
10. Features
==============================================================*/
/*--------------------------------------------------------------
10.1. Icons
--------------------------------------------------------------*/
.com-icons .caption {
	display: block;
	font-size: 80%;
}
#fontawesome .fa {
	margin-right: 10px;
}
#fontawesome .row {
	width: calc(100% + 1.5rem);
	margin-left: -.75rem;
}


/*--------------------------------------------------------------
10.2. Colors
--------------------------------------------------------------*/
.collapsible.colors-collapsible {
	border-top: 0;
	border-right: 0;
	border-left: 0;
	margin: 0;
	-webkit-box-shadow: 0 0 0 0 rgba(0,0,0,0.14), 0 0 0 0 rgba(0,0,0,0.12), 0 0 0 0 rgba(0,0,0,0.2);
	box-shadow: 0 0 0 0 rgba(0,0,0,0.14), 0 0 0 0 rgba(0,0,0,0.12), 0 0 0 0 rgba(0,0,0,0.2);
}
.collapsible.colors-collapsible .collapsible-header {
	padding: 15px 0;
	border-bottom: 1px dashed #e0e0e0;
	position: relative;
}
.collapsible.colors-collapsible .active .collapsible-header {
	border: 0;
}
.collapsible.colors-collapsible li .collapsible-header:after {
	position: absolute;
	right: 0;
	top: 15px;
	color: #ccc;
	font-family: 'FontAwesome';
	content: "\f107";
}
.collapsible.colors-collapsible li.active .collapsible-header:after {
	position: absolute;
	right: 0;
	top: 15px;
	color: #ccc;
	font-family: 'FontAwesome';
	content: "\f106";
}
.collapsible.colors-collapsible .collapsible-header .color {
	background-color: #ccc;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	margin-right: 10px;
}
.collapsible.colors-collapsible .collapsible-body {
	padding: 0 0 15px 0;
	border-bottom: 1px dashed #e0e0e0;
}



/*==============================================================
11. Footer
==============================================================*/
.footer {
	padding: 5px 20px;
	text-align: center;
	font-weight: 700;
	font-size: 14px;
	background: #E0E0E0;
	border-top: 1px solid #BDBDBD;
	color: rgba(0,0,0,.6);
}
.footer.dark {
	background: #000;
	border-top: 0 solid #BDBDBD;
	color: rgba(255,255,255,.5);
}

.footer a {
	color: #fff;
}
#to-top {
	position: fixed;
	right: 10px;
	bottom: 60px;
	width: 50px;
	height: 50px;
	line-height: 2;
	font-size: 22px;
	text-align: center;
	cursor: pointer;
	opacity: 0;
	background-color: rgba(153,0,0,.8);
	color: #fff;
	z-index: 111;
	border-radius: 50%;
	-moz-box-shadow: 0 0 10px #424242;
    -webkit-box-shadow: 0 0 10px #424242;
    box-shadow: 0 0 10px #424242;
	-moz-transition: all .7s ease-in-out;
	-o-transition: all .7s ease-in-out;
	-webkit-transition: all .7s ease-in-out;
	transition: all .7s ease-in-out;
}
/*custom*/
li.bacajuga {
  list-style-type: square!important;
  list-style-position: inherit;
  font-size: 13px;
}
ul.bacajuga {
  padding: 5px 5px 5px 20px;
  border: 1px solid #ffc3c3;
  border-radius: 7px;
}