@media only screen and (min-width:200px) and ( max-width:767px) {

/*
=====================================================================================================================================================
WRAPPER
=====================================================================================================================================================
*/

.wrap1 {width:95%; }
.footerwrap-home    {position:static;}

header.sticky {position:relative;}
#headerpan-home  {border-bottom:1px solid #009cde; }
.header > .contact {width:90%; padding-bottom:10px; }
.header .bismillah-hm { display:none;  }

.home-slider {min-height:auto; }
.home-bgcolor {margin-bottom:0px; }

.home-bgcolor { background:none !important; } 
#footerpan {display:none;}

.footerwrap, .footerwrap1 {min-height:70px; padding-top:10px; background:#656565; text-align:center; width:100%;  color:#fff;}
.footerwrap p, .footerwrap1 p {text-align:center; color:#fff; }
.ss-footer {display:block;   }
.footerwrap a, .footerwrap1 a {color:#fff; }


.wrapper { margin:0 auto -70px; }
.wrapper1  { margin:0 auto -70px; }
.push1 { height:70px; }

.link-holder {width:90%; }
ul.jb-skr-btnlist li {width:80%;}

.home-data {margin-top:10px; }

.c-openings {width:100%; }
.banners {width:100%; }
.dd-industries {float:left; margin:0px; }
.c-openings .hd {border-bottom:none; }

.c-openings .hd,  .dd-industries, .dd-industries select {width:100%; margin-bottom:5px;  } 
.banner-bg {width:90%; }
.banner-bgcolor a  {width:90%;}

/*
=====================================================================================================================================================
COMMON TAGS
=====================================================================================================================================================
*/
#header, .bodyarea, .footer {max-width:100%; width:100%; float:none; margin:0px auto;}

#headerpan      {min-height:inherit; z-index:9; position:static;}
#headerpan-home {min-height:inherit; width:100%; display:block; float:left; background:#fff; position:relative;}

#bodycontainerpan           {margin-top:0%; z-index:0}
#bodycontainerpan-inside    {margin-top:0px;}


/*
=====================================================================================================================================================
HEADER STYLE
=====================================================================================================================================================
*/
.header                 {width:94%; min-height:inherit; position:static; height:auto}

.header .logo           {float:left; margin:0px; padding:10px 0px 0px 0px; width:100%; text-align:center}
.header .logo-pic       {padding-right:0px; width:auto; float:none;}
.header .logo-pic img   {position:inherit; z-index:9; max-width:75%}

.header .logo-caption           {float:none; margin:0px auto;}
.header .logo-caption .compname {font-size:1.3em; padding-top:15px; padding-bottom:0px;}
.header .logo-caption .caption  {font-size:.8em;}

.header .emblem         {float:left; color:#42b0eb; width:50%; text-align:left; margin:0px;} 

.header .bismillah-hm   {float:right; width:50%; text-align:right;}
.header .bismillah      {display:none}

.header .bismillah-hm img, .header .bismillah img   {max-width:90%;}

.header .nav    {padding:25px 0px 0px 0px; right:10px; z-index:2; top:0px;}




/*
=====================================================================================================================================================
BODY STYLE
=====================================================================================================================================================
*/
.body-content-holder        {padding:0% 0px; margin:0px auto; float:none; width:94%;}
.body-content-holder-home   {width:100%; height:auto; float:none; margin:0px auto}

.left-panel     {width:100%; float:left; margin:0px; padding:0px;}
.right-panel    {width:100%; float:left; margin:0px; padding:0px; margin-left:1%}

.home-bgcolor   {background:#23a0ef; float:left; position:static; height:auto; top:45%; margin-top:0px; padding:15px 0px; width:auto;
background:-webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #23a0ef), color-stop(100%, #07447b));
background:-webkit-radial-gradient(center, ellipse cover, #23a0ef 0%, #07447b 100%);
background:-webkit-radial-gradient(center, ellipse, #23a0ef 0%, #07447b 100%);
background:radial-gradient(ellipse at center, #23a0ef 0%, #07447b 100%);}

.home-caption       {width:100%; padding:20px 0px; float:left;}

ul.hm-btnlist li    {width:47%; padding:0px 1%;}

/*------------------------------------------
Video
------------------------------------------*/
.video-area {width:100%; height:auto; padding:0px; margin:0px; float:left;}
video       {width:100%; height:auto; margin:0px; padding:0px; float:left}


/*------------------------------------------
Visual
------------------------------------------*/
.visual     {width:100%; padding:0px; margin:0px; position:relative; float:left}


/*------------------------------------------
home-about
------------------------------------------*/
.about {width:100%; padding:0%}

/*------------------------------------------
home-statistics
------------------------------------------*/
.stats  {display:none}

/*------------------------------------------
Chairman Desk
------------------------------------------*/
.desk           {width:100%; padding:2% 0%;}
.desk-holder    {max-width:100%; width:96%; padding:2%;}
.dskleft        {display:none}
.dskright       {width:100%; padding:3% 0%;}



/*
=====================================================================================================================================================
FOOTER STYLE
=====================================================================================================================================================
*/
#footerpan-home {z-index:99; font-size:.9em}
.footer         {width:96%; margin:0px auto; padding:0px; float:none; color:#312a22; font-size:90%;}

.copyright-home {width:100%; margin:0px; padding:10px 0px 0px; float:left; text-align:center}
.nav-home       {width:100%; margin:0px; padding:0px 0px 10px 0px; float:left; text-align:center}
.nav            {width:100%; margin:0px; padding:0px; float:left; text-align:center}

.copyright      {width:100%; text-align:center}

ul.ftrnav-list      {padding:10px 0px 0px; text-align:center; width:100%;}
ul.ftrnav-list li   {padding:0px 5px; margin:0px 0px 10px 0px; border:0px;}

/*------------------------------------------
Enquiry
------------------------------------------*/
.enq-lft        {width:100%;}
.enq-rgt        {width:100%; float:left}

.btn-ftr               {width:100%; padding:0px; margin:10% 0px; float:left}
.btn-ftr ul.btnlist    {list-style:none; width:100%; padding:0px; margin:0px; display:inline-block}

.btn-ftr ul.btnlist li a.employer-login {padding:10px; padding-top:80px;}




/*
=====================================================================================================================================================
BREADCRUMB STYLE
=====================================================================================================================================================
*/
#breadcrumb {width:auto; margin:0px auto; color:#000; padding:0px; font-size:.8em; float:left; margin-top:0px;}

#crumbs li:first-child  {margin-left:0px;}	




/*
=====================================================================================================================================================
HEADER STYLE
=====================================================================================================================================================
*/
h2  {font-size:1.7em;}
h3  {font-size:1.4em;}

h1.hm   {font-size:1.7em;}
h3.hm   {font-size:1.7em; line-height:normal}










.sitemap-col {display:block; width:100%; } 
hgroup {width:100%;}



.two-cols {width:95%; }

.about-lft {width:100%; }
.about-rgt {display:none;} 

ul.tmlist li {width:100%;}
.about-pic {float:left; }

.lft-pan {width:100%; }
.recruitment > .lft-panel {vertical-align:top; width:38%;  }
.recruitment {margin-top:20px; }
.rgt-pan {width:100%; margin-top:20px;}  
ul.indus-list li {width:100%;}
ul.client-list {text-align:center;}
ul.gallery {text-align:center; }
ul.gallery li {width:73%; text-align:center; margin:0 12% 20px 12% } 


.client-left {width:100%; text-align:center; }
.client-right   {width:100%; }


.header-client .close {padding:0px; }
.header-client .logo-pic {width:100%; text-align:center; }
.header-client .logo-caption {width:100%; text-align:center; }
 
.header-client .logo {width:100%; }


.contact-lft {display:none; }
.contact-rgt {width:100%; }
.contact-detail  {width:100%; } 
.cnt-lftpan {width:100%; } 
.cnt-rgtpan  {width:100%; } 



.career-lft {width:100%; }
.career-rgt {width:100%; margin-top:10px;  }

}








@media only screen and ( min-width: 361px) and ( max-width: 639px) 
{
ul.gallery li {width:50%; text-align:center; margin:0 20% 20px 20%; } 
.header > .contact {width:73% }

}


 @media only screen and (min-width:320px) and (max-width:359px) { .home-slider, #bodycontainerpan-home { display:none} 
 
 #bodycontainerpan { margin-top:10px; }
 .visual {display:none}
 }
@media only screen and (min-width:240px) and (max-width:319px) { .home-slider, #bodycontainerpan-home { display:none}
 #bodycontainerpan { margin-top:10px;  }
  .visual {display:none}

}