/*Header*/
.navbar-brand1{
 color:#318134;  
 font-size:30px;
 font-family:Comic Sans MS;
 font-weight: 700;
 padding-left:40px;
 float: left;
}
.navbar-brand1:hover{
 color:#267326;  
 font-weight: 800;
}
/*nav*/
.center-cropped-dp-nav {
  object-fit: cover;       /* Scale the image so it covers whole area, thus will likely crop */
  object-position: center; /* Center the image within the element */
  width: 32px;
  height: 32px;
  border-radius: 25%;
  overflow: hidden;
  border: 3px solid #318134;
}
.center-cropped-dp-nav:hover {
  border: 3px solid #267326;
}
.cat-nav-dd{
	background-color: #cc0099;
	font-size: 15px;	
	font-weight:500;
	color:#fff;	 
	text-align: center;
}
.dropdown-menu>li{
	background-color: black;
}
.dropdown>ul{
	background-color: #318134;
}
.active2{
	background-color: #318134;
	border-radius: 4px;	  
}
.navbar-nav1>li{
	float: left;	   
}
.navbar-nav1>li>a{
	font-size: 12px;	
	font-weight:500;
	color:#fff;	   
}
.nav>li>a:hover{
	background-color: #318134;
	color:black;
	font-weight:700;
	border-radius: 4px;  
}
.navbar-inverse .navbar-nav > li > a {
	color: #fff;
	font-size: 15px;
}
/*Body Mod Details*/
.hr-line{
	margin-top:35px;
	border-top: 3px double #8c8b8b;
}
.container{
    width: 100% !important;
    margin-right: auto;
	padding-right:0px;
	padding-left:0px;
    margin-left: auto;
}
.mod-details-heading{
	text-transform:uppercase;
	text-align:center;
	color:#318134;
}
.background-color{
	background-color: #f2f2f2;
	padding-bottom: 15px;
	padding-top: 15px;
}
.border1{
border-right: solid 4px #cccccc;
}
.mods-photos{
  border: 3px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
  padding-left: 0px;
  margin: auto;
}
.mod-img{
	height:171px; 
	overflow:hidden; 
	object-fit: cover;
	margin: auto;
	max-width: 100%;
}
.mod-img1{
	height:202px; 
	overflow:hidden; 
	object-fit: cover;
	margin: auto;
	max-width: 100%;
}
.img-text-block-11 {
  position: absolute;
  top: 1px;
  right: 10px;
  background-color: #fff;
  color: #3fa643;
  padding-left: 7px;
  padding-right: 7px;
  padding-top: 1px;
  border-radius: 20px;
  border: solid 2px #3fa643;
  border-style: inset;
  font-size: 14px;
}
.img-text-block-22 {
  position: absolute;
  top: 32px;
  right: 10px;
  background-color: #fff;
  color: #337ab7;
  padding-left: 7px;
  padding-right: 7px;
  padding-top: 1px;
  border-radius: 20px;
  border: solid 2px #337ab7;
  border-style: inset;
  font-size: 14px;
}
/*Buttons*/
.btn-visitmod {
    width: 100%;
    background-color: #318134;
    color: white;
    padding: 1px 1px;
	font-size: 22px;
    margin: 5px 0;
    border: none;
    border-radius: 10px;
    cursor: pointer;
	font-weight: 500;
	border: 3px solid #2a6f2c;
}
.btn-visitmod:hover {
    background-color: white;
	border: 3px solid #318134;
	color: #318134;
}
.login-nav-button{
	padding:7px 17px;
	background: #3fa643;
	margin:4px 2px;
	font-size:15px;
	border:0;
	float:left;
	color:#fff;
	font-weight:500;
	border-radius: 5px;
}
.login-nav-button:hover{
	background:#fff;
	border: 2px solid #0a6ebd;
	transition-duration: 0.4s;
	color: #3fa643;			
	font-weight:700;
}
/*Pagination*/
 .Pagi-nation{
	text-align: center !important;
	padding-top: 20px;
	padding-bottom: 15px;
	overflow: auto;	
 }
 .Pagination{
	margin:0 auto; 
	padding-top:35px;
	padding-bottom:35px;
 }
  .Pagination li{
	display:block;
	color:#fff;
	text-shadow: 0 1px 1px #eee;
	float: left;
 }
   .Pagination li span{
	letter-spacing:.1em;
	color: #318134;
	border: 2px solid #318134;
	padding: 4px 7px;
	border-radius: 5px;
 }
   .Pagination li a{
	background: #318134;
	color: #fff;
	border: 2px solid #235c25;
	padding: 4px 7px;
	text-decoration: none;
	border-radius: 5px;
 }
   .Pagination li a:hover{
	background: #38943b;
	border: 2px solid #2a6f2c;	
    color: #fff;
    transition: .4 ease-in-out;		
 }
   .Pagination li a:active{
	background: #3884c7;
    color: #fff;
	border-radius: 5px;	
 }
   .Pagination li.active a{
	background: #3884c7;
	border: 2px solid #2d6a9f;
	border-radius: 5px;
	color: #fff;	
 }
   .Pagination li .titik{
	color: #3fa643;
    font-weight: bolder;	
	
 } 
   .Pagination li.disable{
	pointer-events: none;
	cursor: default;
	border-radius: 2px;	
 }
/*Sidebar*/
ul.sidebar-ul{
	list-style-type:none;
	color:#000;
	font-size:15px;
	font-weight:700;
	margin-top:10px;
	background:#f2f2f2;
}
.sidebar-ul>a>li{
	padding-left:15px;
	padding:8px;
	border: 1px solid #318134;
}
.sidebar-ul>a>li:hover{
	background: #0a6ebd;
	border: 3px solid transparent;
}
ul>a{
	color:#000;
}
ul>a:hover{
	color:#fff;
	text-decoration:none;
}
.heading{
	padding-left:15px;
	color:#fff;
	background:#318134!important;
	padding-top:10px !important;
	padding-bottom:10px !important;
	margin-top:10px;
}
.active1{
	background: #6699cc;
	border: 3px solid transparent;	
	animation: colorchange 200s;
	-webkit-animation: colorchange 200s;
}
/*Footer*/
.footer-bar{
min-height:50px;
background:#000;
text-align:center;
padding:15px;
color:#fff;
}
/*Small Media Device*/
@media(max-width:768px){
	.border1{
		border-right: none;
	}
	.mods-photos {
		width:100%;
	}
	.center-cropped-dp {
		object-fit: cover;       /* Scale the image so it covers whole area, thus will likely crop */
		object-position: center; /* Center the image within the element */
		width: 100px;
		height: 100px;
		border-radius: 50%;
		overflow: hidden;
	}	
	.mod-img{
		width:100%;
		max-height: 320px
		overflow:hidden; 
		object-fit: cover;
	}
}