EVOLUTION-NINJA

Edit File: main.css

html, body {
	margin:0 !important;
	padding:0 !important;
	color: #616161 !important;
	font-family: 'Roboto', sans-serif !important;
	overflow-x:hidden !important;
}
span, label, h1, h2, h3, h4, h5, h6, p, ul, li {
	margin:0 auto;
	padding:0;
}
p {
    margin: 0 0 0px !important; 
}
a
{
	text-decoration:none !important;
	transition:all .5s ease-in-out;
}
.clr {
	clear:both;
}
.scrollup{
	width:70px;
	height:70px;
	position:fixed;
	bottom:32px;
	right:10px;
	display:none;
	text-indent:-9999px;
	background:url('../images/top-bt.png') no-repeat center center;
	border-radius:50%;
}
/*-------------------------------- Header Top--------------------------------------------*/
.my_logo
{
	padding-top:10px;
	padding-bottom: 10px;
}
.my_logo img{
	width: 75%;
}

.act a
{
	background:#f0db8e;
	color:#556b2f !important;
}
/*------------ important --------*/
.mail_phone
{
	padding:10px 0px;
	background:#556b2f;
	position:relative;
	
}
.mail_phone::before
{
	content:'';
	position:absolute;
	left:100%;
	top:0;
	width:100%;
	height:100%;
	background:#556b2f;
}
.mail_phone::after
{
	content:'';
	position:absolute;
	left:-50px;
	bottom:0;
	width:0;
	height:0;
	border-top: 50px solid #556b2f;
	border-left: 50px solid transparent;
	
}
/*----------------------*/
.mail_phone span
{
	margin-left:20px;
	color:#fff;
}

.mail_phone span a
{
	color:#fff;
}

.mail_phone span a:hover
{
	color:#FFF402;
}

@media only screen and (min-width:320px) and (max-width:640px) {
	.mail_phone span
	{
		display:block;
	}
	/* .mail_phone::after
	{
		left:initial;
		right:100%;
		width:100%;
		height:100%;
		border-top: 67px solid #556b2f;
	} */
	.mail_phone::after
	{
		content: '';
		position: absolute;
		right: 100%;
		top: 0;
		width: 100%;
		height: 100%;
		background: #556b2f;
		z-index: -1;
	}
	.cf {
		top: 0;
		position: absolute;
		right: 0;
	}
	.smobitrigger {
		color: #FBEF01 !important;
	}
	
}

@media only screen and (min-width:641px) and (max-width:991px) {
	.navigation nav {
		padding-top: 0px !important;
		padding-bottom: 0px !important; 
	}
}
/**********************************************************************/
.top_row{
	padding-left: 15px !important;
	padding-right: 15px !important;
}
.top_right{
	float: right;
}
.top_right li{
	float: left;
	list-style-type: none;
	padding-left: 20px;
}
.top_right a{
	color: white;
	font-size:16px;
}
.top_right a:hover{
	color: white;
	font-size:16px;
}
.top_left li{
	float: left;
	list-style-type: none;
	padding-left:15px;
}
.top_left a{
	color: white;
}
.top_left a:hover{
	color: white;
}
.top_left i{
	color: white;
	font-size: 15px;
}
@media only screen and (min-width:320px) and (max-width:640px) {
  	.top_left ul{
  		margin-left: -5px;
  	}
  	.top_left li{
		padding-left:8px;
	}
	.top_left a{
		font-size: 13px;
	}
	.top_right{
		float: left;
		margin-top: 5px;
	}
}
@media only screen and (min-width:641px) and (max-width:991px) {

}
@media only screen and (min-width:992px) and (max-width:1258px) {
	.my_logo img{
		width: 85%;
	}
  .cf{
  	margin-top: 0px !important;
  }
}
/***********************************************************************/
footer{
	padding-top: 30px;
	padding-bottom: 10px;
	background: url("../images/footer_bg.png") no-repeat center center /cover;	
	text-align: center;
	color: white;
}
.footer_addr i, .footer_phone i, .footer_mail i{
	color: darkolivegreen;
	font-size: 20px;
	width:45px;
	height:45px;
	border-radius: 50%;
	background: white;
	padding-top: 10px;
	margin-bottom: 5px;
}
.footer_addr i:hover, .footer_phone i:hover, .footer_mail i:hover{
	color: white;
	border: 2px solid white;
	width:45px;
	height:45px;
	border-radius: 50%;
	padding-top: 10px;
	background: transparent;
	margin-bottom: 5px;
}

.footer_follow a{
	color: white;
}
.footer_follow a:hover{
	color: white;
}
.social{
    text-align:center;
    width:45px;
    height:45px;
    //float:left;
    background:rgb(255,255,255);
    //border:1px solid rgb(204,204,204);
    box-shadow:0 2px 4px rgba(0,0,0,0.15), inset 0 0 50px rgba(0,0,0,0.1);
    border-radius:50%;
    padding-top: 7px;
    font-size: 20px;
    color: gray;
    margin-left:20px;
}
.facebook:hover{background:#3b5998;color:#FFF;}
.twitter:hover{background:#00acee;color:#FFF;}
.linkedin:hover{background:#0e76a8;color:#FFF;}

.footer_follow p{
	text-align: left;
}

.footer_follow ul
{
	text-align:center;
}

.footer_follow ul li
{
	display:inline-block;
	list-style:none;
}
@media only screen and (min-width:320px) and (max-width:640px) {

.footer_follow{
		margin-top: 5px;
		//margin-left: 17%;
	} 	
}
@media only screen and (min-width:641px) and (max-width:991px) {
	.social{
		margin-left:  7px;
	}
	.social_row{
		margin-left: 25% !important;
	}	
}
@media only screen and (min-width:992px) and (max-width:1258px) {
  
}
/********************************************************************************/
.home_mid{
	background: url("../images/home_bg1.png") no-repeat center center /cover;
	padding-top: 3%;
	padding-bottom: 3%;	
}
/* Slider */
.slick-slide {
    margin: 0px 20px;
}

.slick-slide img {
    width: 100%;
}

.slick-slider
{
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
            user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;
    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;
    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;
    height: auto;
    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}
/********************************************************************************/
.gallery_mid1{
	padding-top: 3%;
	padding-bottom: 3%;
	background: #ececec;
}
.image-full-gallery
{
	//border:1px solid #eee;
	margin-bottom:10px;
	margin-top:10px;
}

.image-full-gallery:hover .desc
{
	background:#017DC6;
}

.image-full-gallery:hover .desc p a
{
	color:#fff;
}

.image-gallery
{
    overflow: hidden;
    //border: 5px solid silver;
    box-shadow: 0 2px 10px 0 rgba(0,0,0,.4);
}

.image-gallery img
{
	transform:scale(1);
	transition:.5s;
}

.image-gallery:hover img
{
	transform:scale(1.1);
	transition:.5s;
}

.image-gallery:hover .image {
  opacity: 0.3;
}

.image-gallery:hover .middle {
  opacity: 1;
}

.image {
	opacity: 1;
	display: block;
	width: 100%;
	height: auto;
	transition: .5s ease;
	backface-visibility: hidden;
}

.middle {
	  transition: .5s ease;
	  opacity: 0;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  -ms-transform: translate(-50%, -50%)
}

.text {
	background-color: #00bcd4;
	color: white;
	font-size: 30px;
	border-radius: 5px;
	text-align: center;
	width: 40px;
	height: 40px;
}

.text a
{
	color:#fff;
}

.text a:hover
{
	color:#fff;
}

.text i
{
	width: 40px;
	height: 40px;
}
/**************************************************************************/
.contact_mid1{
	padding-top: 3%;
	padding-bottom: 3%;
	background: #f4f4f4;
}
.contact_div1{
	background: #304156;
	padding:15px; 
	padding-bottom:25px;
}
.contact_div1 h3{
	font-weight: 600;
    //text-shadow: 0px 5px 5px silver;
    text-transform: uppercase;
    margin-top: 10px;
    margin-bottom: 20px; 
    color: white;
    text-align: center;
}	
.contact_div1 input{    
    height: 35px !important;     
    background-color: white !important;
    background-image: none;
    border: 0px solid transparent !important;
    border-radius: 0px !important;
    -webkit-box-shadow: inset 0 1px 1px transparent !important;
    margin-bottom: 15px;
}
.contact_div1 textarea{
  background-color: white !important;
    background-image: none;
    border: 0px solid transparent !important;
    border-radius: 0px !important;
    -webkit-box-shadow: inset 0 1px 1px transparent !important;
    margin-bottom: 15px;  
}
.h_btn_h2{
    background-color: #d88b85 !important;
    padding: 5px 15px !important;
    color: white;
    border-radius: 0px !important;
    width: 100%;
}
.h_btn_h2:hover{
  color: white !important;
}
@media only screen and (min-width:320px) and (max-width:640px) {
	.contact_div1{
		padding-bottom: 15%;
	}
 	.contact_div1 h3{
 		margin-top: 0px;
 		margin-bottom: 10px;
 	}
}
@media only screen and (min-width:641px) and (max-width:991px) {
	.contact_div1{
		padding-bottom: 12px;
	}
	.contact_div1 h3{
		margin-top: 0px;
		margin-bottom: 18px;
	}
}
@media only screen and (min-width:992px) and (max-width:1258px) {
  	.contact_div1{
  		height: 420px;
  	}
}

/*------------------------ back to top ---------------*/
.back-to-top {
    cursor: pointer;
    position: fixed;
    bottom: 0;
    right: 20px;
    display: none;
    background: transparent !important;
    border-color: transparent !important;
}

.back-to-top img
{
	background:#898989;
	transition:all 0.5s ease-in-out;
	border-radius:5px;
}

.back-to-top img:hover
{
	background:#8D9559;
}