@charset "utf-8";

/* CSS Document */



#top2{

	position:relative;

	top:0px;

}
#top2 img{

width:100%;
}
/* content body */

	body{
	Background-color: #efefef;
	}
	#work-text {
		Background-color: #efefef;
		Width: 100%;
	

	}

	#work-container {
		padding:80px 0;

		margin: 0 auto;
		width:840px;
		
		font-size:14px;

		line-height: 30px;

		font-weight:300;

	}
.mytitle{
	font-size: 60px;
	font-weight: 900;
	text-align: center;
	color: #040F2D;
	margin-bottom: 30px;
	line-height: 70px;	
}
hr.style1 {
	height: 6px;
	background: url(images/hr-12.png) repeat-x 0 0;
    border: 0;
}
	#work-container span2{

		font-weight:700;

	}

	#work-container h6{
		font-size:17px;
	}
	 .mycolum{
		margin:50px 0px;
		padding: 0px;
		-webkit-column-count: 2; /* Chrome, Safari, Opera */
    	-moz-column-count: 2; /* Firefox */
    	column-count: 2;
		-webkit-column-gap: 30px; /* Chrome, Safari, Opera */
    	-moz-column-gap: 30px; /* Firefox */
    	column-gap: 30px;
		text-indent: 20px;
		 font-weight: 400;
	}
	 .mycolum p{
		padding-bottom: 10px;
	}

	.mylink{
		text-align: center;
	}

	#work-container a{
		background-color: #D70026;
		font-weight: 700;
		box-shadow: 2px 2px rgba(20, 20, 20, 0.4);
		padding: 15px 30px;
}
#work-container a:hover{
	background-color: #040F2D;
	transition: all .5s;
}
	.my-work{
		
		width:60%;
		margin:0 20%;
		font-size: 0;
	}

	.my-work img, video{

		width:100%;
		padding-bottom: 35px;
	}

	.left{

		float:left;

		width:50%;

	}

	.right{

		float:right;

		width:50%;

	}

	/* footer */

	#bottom-navigation{

		width:100%;

		margin:  auto 0 auto;

		height: 60px;

	    background: #fff none repeat scroll 0% 0%;

		font-weight:400px;

		border-top: .08em solid #d9d9d9;

		z-index: 1000;

	}

	#bottom-navigation a, #bottom-navigation span{

		color:#777;

	}

	

	.previous-project{

		float:left;

		height:100%;

		text-align: center;

		padding: auto 20px auto 20px;

		box-shadow: .07em 0px .01em 0px rgba(40,40,40,.17);

	}

	.previous-project p{

		margin: 21px 40px auto 40px;

		letter-spacing: .07em;

		font-size:13px;

		font-weight:400;	

	}

	.next-project{

		float:right;

		height:100%;

		text-align: center;

		padding: auto 20px auto 20px;

		box-shadow: -.07em 0px .01em 0px rgba(40,40,40,.17);

	}

	.next-project p{

		margin: 21px 40px auto 40px;

		letter-spacing: .07em;

		font-size:13px;

		font-weight:400;

	}

	#icon{

		height:100%;

		border-left: .07em solid rgba(40,40,40,.17);

		border-right: .07em solid rgba(40,40,40,.17);

		width: 70px;

		margin: auto;

	}

	#icon img{

		margin: 8px 0px 0px 11px;

		height: 45px;

	}

@media screen and (max-width: 1001px){
		#work-container {

		width:840px;
	}
}


	@media screen and (max-width: 850px) {

	#work-container {

		padding:30px 0;

		margin:auto;

		width:85%;
		

	}
		
		.my-work{
		
		width:80%;
		margin:0 10%;

	}
	

	#work-container p, #work-container h6{

		font-size:15px;

		line-height: 25px;

	}
		.mytitle{
			font-size: 50px;
			margin-bottom: 40px;
			line-height: 57px;	
		}

	}

	@media screen and (max-width: 720px) {
		.left{

			width:100%;

		}
		.my-work{
		
		width:90%;
		margin:0 5%;

		}

		.right{

			width:100%;

		}
		.mycolum{
		margin:20px 0px;
		-webkit-column-count: 1; /* Chrome, Safari, Opera */
    	-moz-column-count: 1; /* Firefox */
    	column-count: 1;
	}
		

	}

	@media screen and (max-width: 520px) {
		.my-work{
		
		width:100%;
		margin:0;

		}
			#bottom-navigation span{

				display:none;

			}
		.mytitle{
			font-size: 40px;
			margin-bottom: 15px;
			line-height: 45px;	
		}

			#work-container p{

				font-size:12px;

				line-height: 22px;

			}	

		}