

/* =Main CSS
-----------------------------------------------------------------------------*/

input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="phone"], input[type="tel"], input[type="number"], input[type="datetime"], input[type="date"], input[type="month"], input[type="color"], input[type="time"], input[type="search"], input[type="datetime-local"], textarea
{
    width:80%;
}

input[type="radio"], input[type="checkbox"]
{
    vertical-align: middle;
  margin: 1em;
}


.menu-icon1 { 
 
 display:none;
  position: relative; 
   margin-left: 2em;
  width: 3em;
  height: 3em;
  cursor: pointer;
  /* to center */
  margin: 0 auto;
  float: right;
  -webkit-transition: all 0.3s;
	        transition: all 0.3s;
			  margin-top: -1em;
  margin-right: 1em;
}

.menu-icon1 > span {
  position: absolute;
  top: 50%;
  display: block;
  width: 100%;
  height: 0.5em;
  margin-top: -0.5em;
  background-color: #650606;
   
}

.menu-icon1 > span:before,
.menu-icon1 > span:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #650606;
   
  -webkit-transition: all 0.3s;
	        transition: all 0.3s;
}

.menu-icon1 > span:before {
  -webkit-transform: translateY(-1em);
	        transform: translateY(-1em);
}

.menu-icon1 > span:after {
  -webkit-transform: translateY(1em);
	        transform: translateY(1em);
}

/* OPENED */

.menu-icon1.open {
  -webkit-transform: rotate(45deg);
	        transform: rotate(45deg);
}

.menu-icon1.open > span:before {
  -webkit-transform: rotate(90deg);
	        transform: rotate(90deg);
}

.menu-icon1.open > span:after {
  -webkit-transform: rotate(90deg);
	        transform: rotate(90deg);
}

.hidemobile{display:block}
.showmobile{display:none}

.vshowmobile{visibility:hidden;height: 0;}

.vhidemobile{visibility:visible;height: auto;}

/* =Tablet (Portrait)
-----------------------------------------------------------------------------
@media only screen and (min-width: 768px) and (max-width: 959px)
{
    .wrapper
    {
        width: 748px;
    }
}
*/

/* =Mobile (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 959px)
{

.vshowmobile{visibility:visible;height: auto;}
.vhidemobile{visibility:hidden;height: 0;}
.banner_bg{background:none !important;}

div.added-to-cart{ 
  width: 85%;
  left: 0;
  margin: 0 5%;
}
.sliderblock{
display:none;
}
.showmobile{display:block;}
#service

{width:95%; }

#footer .footer_right img{margin-bottom:0;}
    #header .logo
    {
        position: relative !important;
        float: none;
        padding: 0;
        margin: 0;
        top: 0;
        display: inline-block;  width: 96%;
    }

    #header .header_right
    {
        float: none;
        margin: 0;
        width: 100%;
    }



    th[scope="col"]
    {
        display: none;
    }


    #scrolllogo
    {  
       
  clear: both;
  width: 95%;
       overflow: hidden;
    
}

    #header .header_right hgroup
    {
        display: none;
    }

    .banner_right_comm
    {
        width: 90%;
    }


    #banner
    {
        width: 97%;
        float: left;
        margin: 0 2%;position: relative;
    
}

    .logo img
    {
        width: 97%;
    }

    ul.prod_cat
    {
        width: 100%;
        float: none;
        margin: 0;
    }
#nav{display:none;}

#nav p{display:none;}

	.menu-icon1 { display:block;}
	
    ul.bags li div.img
    {
        width: 70%;
        margin: 0 10%;
    }
    table.contact
    {
        margin:0px;
    }

    input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="phone"], input[type="tel"], input[type="number"], input[type="datetime"], input[type="date"], input[type="month"], input[type="color"], input[type="time"], input[type="search"], input[type="datetime-local"], textarea
    {
        width:90%;
        display:inline-block;
    }

    table.contact tr td
    {

        width:90%;
        display:inline-block;
    }


    .prod_desc
    {
        width:100%;
    }
    #footer .footer_nav
    {
          width: 100%;

    }

    ul.bags li p
    {
        width: 70%;
        margin: 0 10%;
    }



    ul.prod_cat table tr td, ul.bags table tr td
    {
        width: 90% !important;
        display: inline-block;
        margin: 0 3%;
    }

    ul.prod_cat table
    {
        width: 100% !important;
    }

    ul.prod_cat li
    {
        width: 100% !important;
    }

    #header
    {
        float: none;
    }


    #nav ul
    {
         width: 94%;
  margin: 0 3%;
    }

    #banner_header h5
    {
        padding: 0.5em 5%;
    }

    .banner_bg .prod_col
    {
        display: none;
    }

    #banner_header .right
    {
        display: none;
    }

    #banner_bg
    {
        display: none;
    }

    .footer_nav
    {
        width: 100%;
    }

    #footer .footer_nav ul
    {
        width: 25%;
        margin: 0 3%;
    }

    #nav, #header h1
    {
        float: none;
    }

    #header h1
    {
        margin-bottom: .5em;
    }

    #nav ul li
    {
        margin: 0;
        float: none;
        margin-bottom: 1px;
        background-color: #f6f6f6;
        text-align: left;
    }

        #nav ul li a, #nav ul li span
        {
            display: block;
            padding: 2px 5px;
        }
		
		.footer_nav{display:none;}
		#header .header_right h2{display:none;}
		
		
		#banner_header{display:none;}
		div.hoverscroll ul.list li.item{text-align:center}
		
		.enq_btn{float:left;}
		
		.enq_btn a{padding: 10px 26px;
  font-size: 17px;
  float: left;}
  
  #footer .footer_right .right{float:none;}
  
  #footer .footer_right{
  float: none;
  text-align: center;
  }
  
  #footer h2{font-size:30px;}
  #footer{
    text-align: center;
  }
  
  .customdesign{
    margin-right: -2em;
  float: none !important;
  text-align: center;
  clear: both;
  }
  
  #ctl00_Content_AjaxForPopup .enq_btn{width: 80%;}
  #ctl00_Content_AjaxForPopup .enq_btn a{width: 100%;  text-align: center;}
  
  
  
  #footer .footer_right a.fb{
  display:none;
  }
  .hidemobile{display:none}
  ul.bags li{
  
    margin: 0 5%;
   
  width: 90%;
  }
}

/* =Mobile (Landscape)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px)
{
    .wrapper
    {
        width: 420px;
    }
}
