@CHARSET "ISO-8859-1";
@font-face {
	font-family : deus;
	src : url("../fonts/contl.ttf");
}
a:hover {
	text-decoration : none;
}
body {
	width : 100%;
	margin : auto;
	background : #f8f9fa !important;
	color : #535353;
	z-index : -2;
	font-size : 14px;
}

.head {
	width : 100%
}

.navbar {
	width : 100%;
	margin : 0px;
	position : fixed;
	z-index : 2;
	left : 1px;
	margin-top : -30;
	font-size : 14px;
}

.nav-item a:hover {
	display : block;
	background : #c0c0c0;
	color : black;
}

.dropdown-menu a:hover {
	display : block;
	background : #c0c0c0;
	color : black;
}

.dropdown-item {
	background : #484848;
	display : block;
}

.active {
	color : white;
	background : grey;
}

.container {
	margin-top : 30px;
	
}

.banner {
	width : 100%;
	height : 600px;
}
.banner img {
	width : 100%;
	background : url("../images/banner/dream.jpg");
}
.deus2 img {
	background : white;
	display : absolute;
	z-index : 5;
	opacity : 1!important;
}

.pointer {
	min-height : 150px;
	text-align : center;
	font-weight : bold; 
	color : white; 
	background : linear-gradient(170deg, #80ff80 0%, #9b87f8 100%);
	padding : 50px;
	margin : 0;
}

section {
	width : 100%;
	padding : 0;
	margin : 0;
	overflow : hidden;
}

.container {
	
}

.ima {
	width : 100%;
	padding : 0;
	margin : 0;
	position : relative;
}

.ima img {
  opacity: 0.1;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}


.about_row {
	width : 100%;
	margin : auto;
}

.about {
	width : 300px;
	height : 350px;
	padding-left : 40px;
	padding-right : 40px;
	margin : auto;
}
.about:hover {
	background : white;
	box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.11);
}

.num_box {
	font-weight : bold;
	font-size : 150px;
	position : absolute;
	z-index : -1;
	color : #c0c0c0;
	opacity : 0.4;
}

.about_head {
	width : 100%;
	margin : auto;
	padding : 10px;
	padding-bottom : 10px;
}
.about_head h2 {
	margin : auto;
	text-align : center;
}
.about_head i {
	width : 100%;
	padding-bottom : 20px;
	margin : auto;
	text-align : center;
}
.about_head i:hover {
	color : rgba(150,255,150,1);
}

.about_details {
	width : 100%;

	padding : 10px;
	text-align : center;
}

.sec_head {
	width : 100%;
	text-align : center;
	margin : auto;
	padding-top : 50px;
	padding-bottom : 30px;
}

.sec {
	width : 100%;
}

.sec_left {
	width : 40%;
	padding-right : 10px;
	background : url("../images/deusv.png");
	repeat : no-repeat;
	opacity : 0.2;
}

.sec_right {
	width : 60%;
	padding : 20px;
	background : transparent;
}

.sec_right_child {
	width : 100%;
}

.sec_icon {
	width : 30%;
	padding-left : 10px;
	padding : 10px;
	box-sizing : border-box;
	color : rgba(150,255,150, 1);
}

.sec_det {
	width : 70%;
	padding : 10px;
	padding-left : 20px;
	box-sizing : border-box;
	padding-bottom : 50px;
}
.sec_det h2 {
	color : green;	
}



.skill {
	width : 100%;
	padding : 0;
}

.row {
	margin : 0;
}

.skill_det {
	width : 50%;
	top : 200px;
	padding-right : 20px;
	padding-left : 100px;
	
}
.skill_det h1 {
	font-size : 60px;
	font-weight : 1;
	color : #c0c0c0;
}
.skill_det p {
	padding : 20px;
	padding-right : 100px;
	font-size : 20px;
	font-weight : 1;
	font-style : italic;
}

.skill_image {
	width : 50%;
	overflow : hidden;
}

.skill_chart {
	width : 50%;
	overflow : hidden;
}
.skill_chart p{
	font-size : 17px;
}
.skill_chart img{
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding : 0;
}

.our_skill_inner {
	padding : 20px;
}

.skill_chart h3 {
	font-size : 10px;
}

.progress-bar {
	color : black;
	background : linear-gradient(9deg, white 0%, green 100%);
}


.work  {
	width : 300px;
	height : 300px;
	margin : auto;
	margin-bottom : 30px;
	box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.11);
	
}
.work:hover {
	
	transition: all 0.5s linear 0s;
}

.work_image {
	width : 100%;
	height : 50%;
	padding : 0;
	overflow : hidden!important;
}
.work_image img {
	
}
.work_info {
	width : 100%;
	height : 50%;
	background : white;
	text-align : center;
	padding-left : 20px;
	padding-right : 20px;
}
.work_info h3 {
	font-size : 20px;
	padding-top : 20px;
	width : 100%;
	height : 50%;
}
.work_info a{
	width : 100%;
	height : 50%;
	padding : 10px;
	margin : auto;
	font-size : 15px;
	text-align : left;
}

.client {
	width : 100%;
	background : white!important;
	padding : 30px;
}

.client_image {
	width : 100%;
	margin : auto;
}
.client_image img {
	width : 100px!important;
	height : 100px;
	border-radius : 100px;
	margin : auto;
}

.client_name {
	width : 100%;
	margin : auto;
}
.client_name p {
	color : black;
	font-weight : bold;
	text-align : center;
}

.client_comment {
	width : 100%;
	margin : auto;
	color : #c0c0c0;;
	font-style : italic;
	font-size : 30px;
	font-weight : 200;
	text-align : center;
}
.owl-item {
	background : #f8f9fa;
}

.work_view {
	
}
.work_view img {
	padding-bottom : 100px;
}

.contact {
	padding :50px;
}

.contact_left {
	width : 50%;
	padding : 20px;
	padding-right : 50px;
	margin : auto;
	margin-top : 0;
}
.contact_left input {
	border : 0;
	border-bottom : 1px solid #c0c0c0;
	border-radius : 10px;
	padding-bottom : 10px;
	font-size : 14px;
	font-style : italic;
	color : #c0c0c0;
}
.contact_left textarea {
	border : 0;
	border-bottom : 1px solid #c0c0c0;
	border-radius : 10px;
	font-size : 14px;
	font-style : italic;
	color : #c0c0c0;
}

.submit {
	display : block;
	width : 100px;
	background : rgba(0, 255, 0, 1);
	color : white!important;
	font-weight : bold;
	border : 2px solid rgba(0, 255, 0, 1);
	border-radius : 3px;
	padding-top : 5;
}
.submit:hover {
	display : block;
	width : 100px;
	color : rgba(0, 255, 0, 1)!important;
	background : white;
	font-weight : bold;
	border : 2px solid rgba(0, 255, 0, 1);
	border-radius : 3px;
	padding-top : 5;
}

.contact_right {
	width : 50%;
	padding : 20px;
	padding-left : 50px;
	margin : auto;
	margin-top : 0;
}

.contact_det {
	
}
.contact_det li {
	list-style : none;
	padding-bottom : 10px;
}
.contact_det a {
	color : rgba(0, 255, 0, 1);
	text-decoration : none;
}
.contact_det a:hover {
	color : white;
	background :  rgba(0, 255, 0, 1);;
	border-radius : 2px;
	text-decoration : none;
}

.icons a:hover {
	color : white;
	background :  rgba(0, 255, 0, 1);;
	display : block;
	border-radius : 5px;
	text-decoration : none;
}

.contact_map {
	width : 100%;
	padding-top : 50px;
}

@media all and (max-width : 1000px){
	.ima {
		display : none;
	}
}

@media all and (min-width : 1500px){
	section {
		width : 1500px;
		margin : auto;
	}
	.banner {
		width : 1500px;
		margin : auto;
	}
}

@media all and (max-width : 900px){
	.content {
		width : 100%;
		border-bottom : none;
	}
	.topic {
		width : 100%;
	}
	.banner {
		display : none;
		height : 300px;
	}
	
	.sec_left {
	width : 40%;
	display : none;
	}
	
	.sec_right {
		width : 100%;
	}
	
	.sec_right_child {
		width : 100%;
	}
	
	.sec_icon {
		width : 100%;
		margin : auto;
		text-align : center;
	}		
	
	.sec_det {
		width : 100%;
		margin : auto;
		text-align : center;
	}
	
	.skill_det {
		width : 100%;
		padding : 50px;
		text-align : center;
	}
	.skill_det p{
		padding : 20px;
	}
	
	.skill_image {
		display : none;
	}
	
	.skill_chart {
		width : 100%;
	}
	
	.contact_left {
		width : 100%;
		margin : auto;
	}
	
	.contact_right {
		width : 100%;
		margin : auto;
	}
}

.work_with {
	padding-top : 20px;
	padding-bottom : 30px;
	width : 100%;
	text-align : center;
	font-weight : bold;
	font-size : 30px;
	background : rgba(150,255,200,0.5);
	}
	

footer {
	width : 100%;
	height : 50px;
	background : black;
	color : white;
	font-weight : bold;
	border-top : 1px solid black;
	margin : auto;
	text-align : center;
	position : bottom;
	bottom : 0;
	position : relative;
}

footer p {
	padding-top : 10px;
}

.amordeus {
	font-family : deus;
	color : rgba(150,255,150,1);
}
.amordeus2 {
	font-family : deus;
	color : black;
}
