@font-face{font-family:"Century Gothic";font-style:normal;font-weight:400;src:url(GOTHIC.TTF) format(woff), url(GOTHIC.TTF) format(truetype), url(GOTHIC-regular-webfont.svg#webfontaidlMlh0) format(svg);}
body{background:#fff;;color:#666;font-size:14px;font-family:"Century Gothic";margin:0;padding:0;}
img{border:none;vertical-align:middle;}
form{display:inline;}
input{vertical-align:middle;}
ul,li{list-style-type:none;margin:0;padding:0;}
h1,h2,h3,h4,h5,h6,input,textarea,dl,dt,dd{margin:0;padding:0;font-weight:normal;}
a{color:#EC008C;outline:none;text-decoration:none;}

.fl{float:left;}
.fr{float:right;}
.clear{clear:both;}
.tl{text-align:left;}
.tr{text-align:right;}
.tc{text-align:center;}
.pink_txt{color: #e8008c !important;}
.container{max-width:768px;margin:0 auto; padding:0 8px}
.hide{display:none !important}

/*Header*/

header{position:fixed;display:inline-block;background:#fff;max-width:768px;z-index:10;width:100%;}
.header{padding:8px 0;width:100%;margin:0 auto;}
.socialNetwork{position:absolute;}
.logo{float:right;height:84px;width:263px;margin:0;padding:26px 0 8px 0}
.menu{color:#666;display:inline-block;padding:36px 0 0 0;display:none;}
.navigation{}
.navigation ul{float:left;padding:86px 0 0 0}
.navigation ul li{float:left;padding:0 15px 0 0;}
.navigation ul li a{display:inline-block;color:#666;font-size:19px;text-decoration:none;text-transform:lowercase;}
.navigation ul li a::first-letter{color:#ec008c}
.navigation ul li a:hover{color:#ec008c}
/*Content*/

.content{padding:0 0 10px 0;}
.home .content{position:relative;}
.content_inner{padding:134px 0 0px 0}
.home .content .content_inner{padding:126px 0 0 0;}
.content h2{color:#666;font-size:22px;margin:0;padding:0 0 8px 0;line-height:2em;}
.content h2 a{text-decoration:none;}
.content h2 span{color:#ec008c;text-transform:capitalize}
.content h2 a{padding: 0 8px 0 0;color:#666;}
.content p{margin:0;padding:0 0 10px;}

/*Home*/
.architech{padding:0 0 0 70px;max-width:698px;width:100%;background:url(../images/architecture_v.gif) no-repeat 0 50%;display:inline-block;}
.rslides{position:relative;list-style:none;overflow:hidden;padding:0;}
.rslides li{-webkit-backface-visibility:hidden;position:absolute;display:none;width:100%;left:0;top:0;}
.rslides li:first-child{position:relative;display:block;float:left;}
.rslides img{display:block;height:auto;float:left;border:0;width:100%;max-width:698px;}
.architech img{}
.mithilIntro{padding:10px 0 0 0}
/*Know Mithil*/

.mithilPhoto{max-width:306px;width:100%;float:right;padding:0 7px;}
.mithil{max-width:306px;width:100%;margin:0 0 10px 0}
.mithilInfo{display:inline-block;float:left;}

/*Projects*/
.breadCrumb{padding:0 0 10px 0}
.breadCrumb a{text-transform:capitalize}
.category {
}
.category li {
  background: #c7c7c7;
  float: left;
  margin: 0 4px 10px 0;
  vertical-align: top;
  overflow:hidden;
}
.category li:hover{}
.category li h3 {
  padding: 5px;
  font-size:19px;

}

.category li h3 {text-align:left;}
.category li h3 a{color:#666;display:block;}
.category li h3 a::first-letter{color:#ec008c}
.category li a.imgClass {
	display: block;
	padding: 0;
	text-align:center;
	position:relative;
	overflow:hidden;
}

.category li img {
	width:246px;
	height:240px;
	 -webkit-filter: grayscale(1);
    filter: gray;
    filter: grayscale(1);
	-webkit-transition: -webkit-transform 0.5s;
	-moz-transition: -moz-transform 0.5s;
	-ms-transition: -ms-transform 0.5s;
	-o-transition: -o-transform 0.5s;
	transition: transform 0.5s;
}
.category li a.imgClass.active img{
	 -webkit-filter: grayscale(0); /* Webkit */
    filter: gray; /* IE6-9 */
    filter: grayscale(0); /* W3C */
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
	transform: scale(1.2);
}

/*Album*/
.albumInfo{position:fixed;background:#fff;z-index:6;width:308px;}
.albumInfo h3 {
  color: #666;
  font-size: 19px;
  line-height:1.5em;
  padding:7px 0 20px 0;
}
.albumInfo h3::first-letter{color:#ec008c}
.viewDetails, .hideDetails{display:none;}
.albumDetails{}
.albumInfo h4 {
  border-bottom: 1px dotted #ec008c;
  color: #444;
  display: inline-block;
  margin: 0 0 8px;
  padding: 0 0 2px;
}
.albumInfo dl {
}
.albumInfo dl dt {
  padding: 0 0 3px 0;
  font-weight:bold;
  font-size:13px;
  color:#888;
}
.albumInfo dl dd{padding:0 0 15px 0;color:#666;}
.albumPhotos{max-width:450px;width:100%;position:relative;}
.album {}
.album li{}
.album a{margin:0 0 10px 0;width:100%;display:inline-block;position:relative;}
.webview {
  background-color: transparent;
  border: medium none;
  cursor: pointer;
  display: block;
  height: 35px;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 5px;
  top: 5px;
  width: 35px;
}
.webview em {
  background: rgba(0, 0, 0, 0) url(../images/webview.png) no-repeat scroll 0 0;
  display: block;
  height: 35px;
  width: 35px;
}

.album  img {
	max-width: 100%;
	height:auo;
	width:100%;
}
/*Testimonials*/

/*Contact*/
.contact .fl{width:49%;display:inline-block;float:none;vertical-align:top}
.contact .fr{width:49%;display:inline-block;float:none;vertical-align:top;text-align:right;}
.address{}

.address p{margin:0;padding:5px 0;}
.address p.addr{padding:5px 0 15px 0}
.lastp{}
.contactForm{padding:0}
.form_item{width:100%;padding:5px 0}
.form_item input[type="text"]{min-width:280px;width:97%;height:30px;padding:4px;border:1px solid #ccc}
.form_item textarea{min-width:280px;width:97%;height:60px;padding:4px;border:1px solid #ccc;font-family:"Century Gothic";font-size:14px;}
.form_item input[type="submit"] {
  background: #ec008c;
  border: none;
  color: #ffffff;
  margin: 0;
  padding: 8px;
  width: 100px;
}
/*Footer*/
.footerLinks {
  display: inline-block;
  padding: 10px 0;
  width: 100%;
}
.footerLinks ul{}
.footerLinks ul li {
  float: left;
  padding: 0 3px;
  text-align: center;
  width: 250px;
}
.footerLinks ul li a {
  border: 1px solid #ec008c;
  border-radius: 3px;
  color: #666;
  display: block;
  font-size: 24px;
  padding: 20px;
  text-decoration: none;
}
.footerLinks ul li a span{padding:0 0 0 8px}
.footerLinks ul li a:hover{background:#ec008c;color:#fff;}
footer{width:100%;}
.footer {
  display: inline-block;
  padding: 8px 0;
  width: 100%;
}
.footer a {
  color: #666;
  display: inline-block;
  font-weight: bold;
  text-decoration: none;
  vertical-align: top;
}
.footer .fl a{padding:0 4px 0 0;text-transform:lowercase}
.fbook{color:#4064AB}
.twitter{color:#5EA9DD}
/*Responsive*/

@media (min-width:320px) and (max-width:360px) {	
.logo, .logo img{width:240px;}

}
@media (min-width:320px) and (max-width:480px) {
.content h2{font-size:16px}

}
@media (min-width:320px) and (max-width:767px) {
.mithilPhoto{text-align:center;float:none;margin:0 auto;padding:0;}
.mithilInfo{width:100%;}

}

@media (min-width:320px) and (max-width:614px) {
	.category li {
	 width:100%;
	}
	.category li img {
		 width:100%;
		 height:300px;
	}
	
}
@media (min-width:320px) and (max-width:660px) {
	.fl{width:100%;float:none;}
	.fr{width:100%;float:none;}
	.contact .fl, .contact .fr{width:100%;float:none;text-align:left;}
	.contactForm{padding:0;}
}
@media (min-width:615px) and (max-width:767px) {
	.category li {
	 width:49%;
	}
	.category li img {
		 width:100%;height:240px;
	}
}
@media all and (max-width:767px) {
	.socialNetwork{}
	.logo{padding:16px 8px 0 0;height:auto;}
	.menu {
	  display: block;
	  float: left;
	  padding:36px 0 0;
	}
	.navigation {
	  float: left;
	  padding: 0 8px 0 0;
	}
	.navigation ul {
	  background: #fff none repeat scroll 0 0;
	  border: 1px solid #ccc;
	  padding: 0;
	  position: absolute;
	  left: -160px;
	  top: 76px;
	  width: 150px;
	  z-index:6;
	  transition : 500ms left;z-index:10000;
	}
	.navigation ul.showMenu{left:0;}
	.navigation ul li {
	  display: block;
	  float: none;
	  padding: 0;
	}
	.navigation ul li a {
	  display: block;
	  padding: 5px;
	}
	.navigation ul li a:hover{background:#ec008c;color:#fff;}
	.navigation ul li a:hover::first-letter{color:#fff}
	.architech{padding:0 0 50px 0px;width:100%;background:url(../images/architecture.gif) no-repeat 100% 100%;display:inline-block;}
	.rslides {
		width:100%;
	}
	.rslides img {
		width: 100%;
	}
	.content_inner{padding:117px 0 0 0;}
	.albumInfo{width:100%;float:none;top:108px;}
	.albumInfo h3{padding:7px 0 10px 0}
	.viewDetails{display:inline-block;float:right;font-size:12px;padding:0 16px 0 0;}
	.hideDetails{display:none;float:right;font-size:12px;padding:0 16px 0 0;}
	.albumDetails {
		background: #fff none repeat scroll 0 0;
		border: 1px solid #ccc;
		padding: 8px;
		position: absolute;
		right: -308px;
		top: 38px;
		width: 154px;
		transition : 1000ms right;
	}
	.albumDetails.show{right:16px;}
	.albumInfo dl dd{padding:0 0 8px 0;}
	.albumPhotos{width:100%;float:none;margin:0 auto 15px;top:45px;}
}
