@charset "utf-8";
/* CSS Document */
::-webkit-scrollbar {width: 8px;}
::-webkit-scrollbar-thumb {-webkit-border-radius: 10px;border-radius: 10px;background: rgba(255,203,5,0.8);-webkit-box-shadow: inset 0 0 6px rgba(255,203,5,0.5);}
::-webkit-scrollbar-track {   -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);     -webkit-border-radius: 10px;    border-radius: 10px;}

body{ margin:0px; padding:0px; font:Arial; font-size:13px; line-height:20px; font-family:"Arial", Helvetica, sans-serif;background:#ccc;}
a{-webkit-transition: all 0.3s ease-in-out;}
a:hover{-webkit-transition: all 0.3s ease-in-out;}
.main{ width:1135px;  margin:auto;}
*:focus{ outline:none;}

.amazingslider-text-0{display:none!important;}
.amazingslider-slides{ height:100%!important; position:fixed;}
.amazingslider-slides img{max-height:800px; height:100%!important;}
.amazingslider-wrapper-0{}
.header{ width:100%; position:fixed; top:20px; background:url(../images/bg-black.png); background-repeat:repeat; z-index:99;  }
.headerinner{max-width:1024px; margin:auto;}
.logo{ width:auto; float:left;}
.clear{ clear:both;}
.menu{  float:right;}
.footer{ background:url(../images/bg-black.png); position:fixed; z-index:99; width:100%; bottom:20px; color:#666;}
.footerinner{max-width:1024px; margin:auto; overflow:hidden; padding:8px 0px;}
.footerinner a{text-decoration:none; color:#666;}
.footerinner a:hover{text-decoration:none; color:#fddd00;;}
.mobilemenu{ background:url(../images/mobilemenu.png) no-repeat left; color:#FFF; cursor:pointer; padding-left:30px; line-height:20px; height:30px; font-size:14px; padding-top:10px; display:none; border-top:solid 1px #fcdf18;}
.innerpagecontainermain{ max-width:1024px; margin:auto; height:70%; position:absolute; left:0px; top:0px; right:0px; bottom:0px; z-index:9;}


.titlemain{background:url(../images/bgtitle.png);}
.titlemain h2{ cursor:pointer; margin:0px 10px 0px 0px; padding:10px; line-height:20px; text-transform:uppercase; color:#0c0c0a; background:url(../images/arrodown.png) no-repeat right; font-weight:400; }

.accordiantitle1{background:url(../images/bgtitle.png);}
.accordiantitle1 h2{ cursor:pointer; margin:0px 10px 0px 0px; padding:10px; line-height:20px; text-transform:uppercase; color:#0c0c0a; background:url(../images/arroup.png) no-repeat right; }
.innertextarea{ padding:15px;  background:url(../images/bg-black.png); height:430px; overflow:auto; color:#EEE; text-align:justify}
.innertextarea h3{color: #fddd00; text-transform:uppercase}
.hometextarea{ padding:15px; background:url(../images/bg-black.png); height:200px; overflow:auto;  color:#EEE; font-size:13px;}
.clients{ overflow:hidden;}
.clients ul{ margin:0px; padding:0px;}
.clients ul li{ margin:0px; margin:10px; list-style:none; float:left; border:solid 3px #ccc;}
.clients ul li:hover{ margin:0px; margin:10px; list-style:none; float:left; border:solid 3px #fddd00;}
.gallery{ overflow:hidden;}
.gallery ul{ margin:0px; padding:0px;}
.gallery ul li{  background:#fff; width:218px; margin:10px; padding:0px; list-style:none; float:left; border:solid 3px #ccc;}
.gallery ul li:hover{  border:solid 3px #fddd00;}
.gallery img{ width:100%;}
.photogallerytitle{ min-height:60px; padding:10px; width:180px;}
.photogallerytitle h2{ margin:0px; padding:0px; font-size:14px; color:#990000;}
.photogallerytitle h3{ margin:0px; padding:0px;  font-size:13px; text-transform:capitalize;}
.highslide img{ border:0px!important; }
.portfolio li{ height:164px;}
.clients li{ height:150px;}
.viewgallery{ background:#fddd00; color:#000; text-decoration:none; padding:3px 20px; font-size:14px; margin-top:10px; float:right;}
.articlemain{ border-bottom:solid 1px #ccc; padding-bottom:10px; margin-bottom:10px; overflow:hidden;}
.articlemain h2{ color: #fddd00; padding-bottom:10px; margin:0px; text-transform:none !important}
.articlemain h3{color: #fddd00; padding-bottom:10px; margin:0px; text-transform:none !important}
.articlemain h4{color: #ccc; padding-bottom:5px; margin:0px; font-style:italic; text-transform:none !important}
.contactleft{ width:45%; float:left;}
.contactright{ width:45%; float:right;}
.textfield{ padding:5px; border:solid 1px #ccc; width:100%;}
.submitbutton{ background:#fddd00; color:#000; border:0px; padding:5px 10px; cursor:pointer; }
.submitbutton:hover{ background:#000; color:#fddd00; border:0px; padding:5px 10px; cursor:pointer; }
.homebottombox{ position:fixed; bottom:140px; width:100%; z-index:9; overflow:hidden;}
.homebottomboxinner{ max-width:1024px; margin:auto; background:url(../images/bg-black.png); overflow:hidden;}
.homebottomboxinner ul{ margin:0px; padding:0px; display:table; width:100%; font-weight:400;}
.homebottomboxinner ul li{ color:#FFF; margin-right:14px; text-align:center; padding:30px 0px; display:table-cell; font-size:18px;;  list-style:none; cursor:pointer; }
.homebottomboxinner ul li:hover{ background:#fcdf18; color:#000;  }
.current{ background:#fcdf18; color:#000 !important;  }
.current a{color:#000 !important;  }
.homebottomboxinner h2{ height:30px; font-size:15px; padding:30px 1px 20px 27px; margin:0px; font-weight:normal;  letter-spacing:4px; font-family:Arial;  }
.homebottomboxinner h3{ color:#000; height:30px; font-size:17px; padding:5px 0px 0px 10px; margin:0px; font-weight:normal;   }
#architecturdesign{  display:none;}
#interiordesign{ display:none;}
#landscapedesign{ display:none;}
#studiodesign{ display:none;}
#association{ display:none;}
.association{ margin-right:0px !important;}
#menu li {float:left; margin-right:1px; border-right:solid 1px #fff;}
.ketanimg{ float:left; padding-right:20px;}
.footerleft{ width:auto; float:left;}
.footerright{ width:auto; float:right;}
.downloadpdf{ float:left; margin-top:10px;}

/* client */

figure {
  display: block;
  position: relative;
  float: left;
  overflow: hidden;
  margin: 0 20px 20px 0;
}
figcaption {
  position: absolute;
  background: black;
  background: rgba(0,0,0,0.75);
  color: white;
 /* padding: 10px 20px; */
 margin-left:10px;
 margin-bottom: 10px;
  opacity: 0;
  width:190px;
    -webkit-transition: all 0.6s ease;
  -moz-transition:    all 0.6s ease;
  -o-transition:      all 0.6s ease;
}
figure:hover figcaption {
  opacity: 1;
}
figure:before {
 /* content: "?";*/
  position: absolute;
  font-weight: 800;
  background: black;
  background: rgba(255,255,255,0.75);
  text-shadow: 0 0 5px white;
  color: black;
  width: 24px;
  height: 24px;
  -webkit-border-radius: 12px;
  -moz-border-radius:    12px;
  border-radius:         12px;
  text-align: center;
  font-size: 14px;
  line-height: 24px;
  -moz-transition: all 0.6s ease;
  opacity: 0.75;
}
figure:hover:before {
  opacity: 0;
}

.cap-bot:before { bottom: 10px; left: 10px; }
.cap-bot figcaption { left: 0; bottom: -30%;}
.cap-bot:hover figcaption { bottom: 0; }


/*menu code here*/

#menu {padding:0; margin:0; list-style:none; height:42px; position:relative; z-index:500; font:Arial; background-image:url(../images/bgmenu.jpg); background-repeat:no-repeat; color:#000000; }
#menu li a {display:block;  height:65px; line-height:65px;  color:#fff; font:Arial; text-decoration:none; font-size:13px; font-weight:normal; padding:0 22px 0 22px; text-transform:uppercase; }
#menu table {border-collapse:collapse; position:absolute; top:0; left:0;}
/* Default link styling */
/* Style the list OR link hover. Depends on which browser is used */
#menu li a:hover {z-index:200; position:relative;color:#fff;}
#menu li:hover {position:relative; z-index:200; background:url(../images/bgmenu.png) no-repeat bottom;}
#menu li:hover > a {color:#000; background:#fff; }
#menu li:hover > a.sub {color:#fff; }
#menu li.current a {color:#fff; background:#840;}
#menu li a.sub {background: #D8D8D8 url(down-arrow.gif) no-repeat right center;}
#menu li.current a.sub {color:#fff; background:#840 url(down-arrow.gif) no-repeat right center;;}
#menu :hover ul {left:0; top:65px;  background:#423e4c; }
/* keep the 'next' level invisible by placing it off screen. */
#menu ul, 
#menu :hover ul ul {position:absolute; left:-9999px; top:-9999px;  height:0; margin:0; padding:0; list-style:none; z-index:99999999; }
#menu :hover ul :hover ul
{left:150px; top:0px;  white-space:nowrap; width:150px; z-index:150; height:auto; }
#menu :hover ul li {margin:0; border-bottom:1px solid #ffffff; border-right:0px solid #7E7E7E;}
#menu :hover ul li a {width:150px; padding:0; text-indent:10px; font-size:11px; font-family:Arial, Helvetica, sans-serif; text-transform:none; background:#424343; color:#fff; height:30px; line-height:30px; text-transform:uppercase;}
#menu :hover ul li a.fly {background:#423e4c url(right-arrow.gif) no-repeat right center;}
#menu :hover ul :hover {background-color:#FDDD00; color:#000;}
#menu :hover ul :hover a.fly { color:#fff;}
#menu :hover ul li.currentsub a {background:#840; color:#fff;}
#menu :hover ul li.currentsub a.fly {background:#840 url(right-arrow.gif) no-repeat right center; color:#fff;}
#menu :hover ul :hover ul li a {width:150px; padding:0; text-indent:10px;   color:#fff;}
#menu :hover ul :hover ul :hover {background-color:#fddd00; color:#000;}
#menu :hover ul :hover ul li.currentfly a,
#menu :hover ul :hover ul li.currentfly a:hover {background:#840; color:#fff;}

.homemainimg{ float:left; padding-right:10px; }

.artclenews{ float:left; padding-right:10px;}

@media (max-width: 1024px) {
.homebottomboxinner ul li{  width:18%; float:left; }
.homebottomboxinner ul li img{  width:100%;  }
.slides img{ position:fixed; width:100%; height:100%;}

}

@media (max-width: 980px) {
.menu{ width:auto; padding-right:10px;}
.logo img{ width:250px;}
}

@media (max-width:768px) {

.mobilemenu{ display:block; width:100%; text-align:left;}
#menu{display:none; width:100%; position:static;  }
.homebottomboxinner ul li img{  width:100%;  }
.homebottomboxinner h2{ color:#fff; height:30px; font-size:18px; padding:10px 0px 0px 10px; margin:0px; font-weight:normal  }
.homebottomboxinner h3{ color:#fddd00; height:30px; font-size:18px; padding:5px 0px 0px 10px; margin:0px; font-weight:normal  }

#menu li{ float: none; display:block; background:#fddd00; text-align:left; border-right:0px; width:100%; border-bottom:dotted 1px #fff; }
#menu li:hover{ float: none; display:block; background:#fddd00!important;   }
#menu ul{ background:#fddd00; display:block !important;  }
#menu :hover ul {left:0; top:25px;  background:#423e4c;}
#menu li a {display:block;  height:25px; line-height:25px;  color:#000; font:Arial; text-decoration:none; font-size:13px; font-weight:normal; padding:0 22px 0 22px; text-transform:uppercase; }
}

/* Smartphones (portrait and landscape) ----------- */

@media (max-width:  650px) {
.homebottomboxinner ul li{ font-size:14px;  }
.homebottomboxinner ul li img{  width:100%;  }
.homebottomboxinner h2{ font-size:12px; height:15px;}
.homebottomboxinner h3{ font-size:12px; height:20px;}
.contactleft{ width:100%; float:none;}
.contactright{ width:100%; float:none;}
.homemainimg{ width:150px;}


}

@media (max-width:  580px) {
	#architecturdesign, #interiordesign, #studiodesign, #association{ display:block; position:static; }
.homebottombox{ position:static;}
.homebottomboxinner ul{ display:block;}
.homebottomboxinner ul li{ font-size:14px; padding:10px 0px; display:block;  }
.footerright{ display:none;}
.footerleft{ width:100%; text-align:center; float:none; }
.innertextarea{ height:350px;}
.innerpagecontainermain{ height:65%;}

.homemainmobile{ position:absolute; z-index:9; top:100px; width:100%;}
.hometextarea{ height:auto; display:none;}
.hometextarea h2{ margin:0px; padding:0px;}
.titlemain{ border-bottom:dotted 1px #fff;}
}

@media (max-width:  450px) {
.logo{ float:none; text-align:center}
.logo img{ width:250px;}
.header{ top:8px;}
.menu{ text-align:center; float:none;}
.ketanimg{ display:block;}

}


@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {

}

/* Smartphones (landscape) ----------- */
@media only screen 
and (max-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}