@charset "utf-8";
/* CSS Document */

.img-box img{border:1px solid blue; box-shadow: 3px 3px 5px black;}
.img-text{border:1px solid gray; margin-top: 10px; background: white;color:blue;}
.img-text a{color:blue;}
.img-text a:hover{text-decoration: none; color:black;}
.img-1 img{float: left; margin-left: 100px; margin-bottom: 10px; }
.img-sec img{border: 1px solid blue; margin-bottom: 10px; margin-left: 50px; box-shadow: 6px 6px 20px black;}
.img-cont{float: left; margin-right: 10px; margin-left: 50px;}
.img-1 {padding: 10px; background: red; width: 400px; height: auto;}
.pro-name{margin-left: 60px;}
.pro-name2{border:1px solid black; background: white; padding-top: 10px;}
.img-pro img{}
.main-cont{margin: 0px  auto; width:100%; max-width: 1200px; height:200px; margin-top: 50px;}
.p1 {
	padding:15px;
	background-color:#FFFFFF;
}


.footro{margin: 20px 0px; background: white; padding-top: 13px;}

.p2 {
	height:40px;
	line-height:40px;
	background-color:#FF0000;
	color:#FFFFFF;
}
.p3 {
	vertical-align:middle;
	line-height:45px;
	background-color:#FFFFFF;
}
/* HEADER */
header {
	position:fixed;
	background-color:#ff0000;
	width:100%;
	height:45px;
	z-index: 999;
}
header h1 {
	padding-left:45px;
	font-size:20px;
	color:#ffffff;

	font-weight:700;
}
header p {
	font-family: 'Open Sans', sans-serif;
	font-size:16px;
	color: #4A463B;
	margin-left:132px;
}
nav {
	position:absolute;
	right:0;
	bottom:0;
}
nav ul {
	list-style:none;
}
nav ul li {
	display:block;
	float:left;
	padding:3px 15px;
}
nav ul li a {
	font-family: 'Open Sans', sans-serif;
	text-transform:uppercase;
 transition: all .25s ease;
	color:#FFFFFF;
}
nav ul li a:hover {
	color:#FFFF00;
}
#mobileMenu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	display: none;
}
#mobileMenu ul li {
	display:block;
	background-color: #E56038;
	color: #fff;
	padding: 12px 0;
	letter-spacing: 0.1em;
	text-align: center;
	text-transform: uppercase;
	border-bottom: 1px solid #CC5836;
}
.toggleMobile {
	display: none;
	color: #fff;
}
/* input box */

#input1 {
	font-family: 'Open Sans', sans-serif;
	font-size:16px;
	padding: 7px;
	outline: 0;
	border:0;
	width:250px;
	background: #ffffff;
	border-radius:5px;
}
#input1[type=submit] {
	width:auto;
	padding: 5px 18px;
	line-height:25px;
	text-shadow:none;
	cursor:pointer;
	box-shadow: none;
	background: #333333;
	color: #fff;
}


/* Search */
.search {
	position:relative;
	padding:10px;
}
/* 3 COLUMNS */

#boxcontent {
	width:auto;
	max-width:450px;
	margin:0 auto;
	padding:0px 0 0px 0;
	margin: 0 auto;
	border:1 thin #000000;
}
#boxcontent article {
	float:left;
	width:400px;
	font-size:14px;
	text-align:left;
	}
#boxcontent article h3 {
	font-family: 'Open Sans', sans-serif;
	font-size:20px;
}
#boxcontent article h2 {
	font-family: 'Open Sans', sans-serif;
	font-size:15px;
}
#boxcontent article img {
	float:left;
}
#boxcontent article p {
	line-height:25px;
	font-family: 'Open Sans', sans-serif;
}
.product_desc {
	position:relative;
	padding:10px;
	width:auto;
	margin: 0 auto; 
   
}


.contact {
	position:relative;
	padding:10px;
	width:auto;
	margin: 0 auto;
}
.footer_menu {
	position:relative;
	padding:10px;
	width:auto;
	margin: 0 auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	
}
 @media (max-width: 915px) {
 #boxcontent article {
 float: none;
 margin: 0px auto 0 auto;
 width: 90%;
}
}
 @media (max-width: 500px) {
 header {
 text-align: center;
}
 #mobileMenu {
 display: block;
 z-index: 99;
 
}
 .toggleMobile {
 position: fixed;
 top: 10px;
 left: 10px;
 display: block;
 width: 40px;
 height: 25px;
 cursor: pointer;
 z-index: 999;
}
 .toggleMobile span.menu1, .toggleMobile span.menu2, .toggleMobile span.menu3 {
 display: block;
 position: absolute;
 width: 30px;
 height: 5px;
 left: 0;
 background: #EDA28C;
 -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
 transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
}
 .toggleMobile span.menu1 {
 top: 0;
}
 .toggleMobile span.menu2 {
 top: 8px;
}
 .toggleMobile span.menu3 {
 top: 16px;
}
 .toggleMobile.active span.menu1 {
 top: 8px;
 -webkit-transform: rotate(45deg);
 -moz-transform: rotate(45deg);
 -o-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 transform: rotate(45deg);
 -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
 transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
}
 .toggleMobile.active span.menu2 {
 -webkit-transform: rotate(-45deg);
 -moz-transform: rotate(-45deg);
 -o-transform: rotate(-45deg);
 -ms-transform: rotate(-45deg);
 transform: rotate(-45deg);
 -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
 transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
}
 .toggleMobile.active span.menu3 {
 opacity: 0;
 -webkit-transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
 transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
}
 header nav {
 display:none;
}
}


.product_head
{
font-family: 'Open Sans', sans-serif;
font-size:30px;
padding-left:24px;

}

.footer_menu_color
{
color:#000000;
}

.p1_size {
font-family: 'Open Sans', sans-serif;
font-size:12px;
color:#000000;
}

.p1_sub {
font-family: 'Open Sans', sans-serif;
font-size:23px;
color:#000000;
line-height:30px;
}

.p1_matter {
font-family: 'Open Sans', sans-serif;
font-size:14px;
color:#000000;
line-height:22px;
}

.product_desc_matter {
font-family: 'Open Sans', sans-serif;
font-size:14px;
color:#000000;
line-height:22px;
}

.product_desc_border {
border:1px solid #ccc;
}

.product_desc_textbox {
border: 1px solid #ccc;
	border-radius:5px;
	height: 20px;
	width: 170px;
}

.product_desc_textbox2 {
border: 1px solid #ccc;
	border-radius:5px;
	height: 25px;
	width: 170px;
}

/***FIRST STYLE THE BUTTON***/
input#gobutton{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:5px 10px; /*add some padding to the inside of the button*/
background:#000; /*the colour of the button*/
border:1px solid #33842a; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 7px;
/*style the text*/
color:#f3f3f3;
font-size:1.1em;
}
/***NOW STYLE THE BUTTON'S HOVER AND FOCUS STATES***/
input#gobutton:hover, input#gobutton:focus{
background-color :#fff; /*make the background a little darker*/

color:#999;
}




/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) { 


.main-cont{ }





}
.p-text{padding-top: 15px; }
.img-thumbnail{border:1px solid blue!important; box-shadow: 3px 3px 5px black;  }
.card-body{padding-top: 5px;}
.cont-img{margin-top: 30px;}
.card{margin-bottom: 10px;}
.p-text a{color:blue;  }
.card-text{border: 1px solid gray; border-radius: 3px; background: white;}

.p-text a:hover{color: darkred; text-decoration: none;}
 .pr-box{margin-bottom: 10px;}

.p1-bg{border: 1px solid black;}

.img-border{border:1px solid blue; border-radius: 3px;}
.card-text1{border:1px solid gray; background: #fff;}


.footer-btm{float:left;}
 .pr-box{float:left; margin-bottom: 10PX;}
    .product-img{}
    .p-img{margin-left: 13px;}
    .p-text{text-align: center; padding-top: 0px; }
    .card-text{margin-left: 13px; width: 100px;  height: 50px;}