/* CSS Document */

/* body start */
body {
margin:0 0 0 0;
}
.hd{
	width:100%;
	background-color:#000;
}

/* General res - controller */
* {
    box-sizing: border-box;
}
.row::after {
    content: "";
    clear: both;
    display: block;


}

[class*="col-"] {
    float: left;
    padding: 15px;
}
.col-3b {width: 29%;}

.col-13 {width: 4.165%;}
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

/* General res - controller-  end */

.product_wrapper {
	width:45%;
	float:left;
	padding: 10px;
	text-align: center;
	background-color: #FBFBFB ;
	margin:20px 10px;
	border:#F3F3F3 solid 1px;;
	}

.product_wrapper:hover {
	width:45%;
	float:left;
	padding: 10px;
	text-align: center;
	background-color: #F3F3F3;
	margin:20px 10px;
	}
.name {
	font-family:calibri;
	font-size:18px;
	color:#000;
	}
.price {
	font-family:calibri;
	font-size:24px;
	color:#000;
	}

.buy {
	width:120px;
	height:30px;
	background-color:#F60;
	color:#fff;
	font-size:14px;
	}

	.box1 {
	width:100%;
	height:470px;
	background-position:center center;
	margin-top:10px;
	float:left;
	padding:10px;
	text-align: center;
	background-color: ;
	border-radius:10px;
	border:#CCC solid 1px;
	box-shadow: 5px 1px 5px 1px #CCC;


	}

	.box2 {
	width:100%;
	height:300px;
	text-align:;
	background-color: ;
	border-radius:10px;
	border:#CCC solid 1px;
	box-shadow: 5px 1px 5px 1px #CCC;
	padding:10px;

	}
	.box2a {
	width:100%;
	height:auto;
	text-align:;
	background-color: ;
	border-radius:10px;
	border:#CCC solid 1px;
	box-shadow: 5px 1px 5px 1px #CCC;
	padding:10px;

	}

		.box3 {
	width:100%;
	height:50px;
	text-align: center;
	background-color: ;
	border-radius:5px;
	border:#CCC solid 1px;
	box-shadow: 5px 1px 5px 1px #CCC;
	padding:10px;

	}

.box4 {
	width:100%;
	height:auto;
	text-align: left;
	background-color: #EFEFEF ;
	padding:15px;

	}

	.box5 {
	width:100%;
	height:350px;
	background-position:center center;
	margin-top:10px;
	float:left;
	padding:10px;
	text-align: center;
	background-color: ;
	border-radius:10px;
	border:#CCC solid 1px;
	box-shadow: 5px 1px 5px 1px #CCC;


	}

		.box6 {
	width:97%;
	height:350px;
	margin-left:15px;
	float:left;
	padding:10px;
	text-align: center;
	background-color: #09C ;


	}

		.box7 {
	width:97%;
	height:350px;
	margin-left:15px;
	float:left;
	padding:10px;
	text-align: center;
	background-color: #666 ;


	}

.box8 {
	width:100%;
	height:auto;
	float:left;
	padding:20px 50px;
	text-align: left;
	background-color: #ccc ;


	}
	.box9 {
	width:100%;
	height:auto;
	float:left;
	padding:100px 100px;
	background-color: #fff ;


	}
			.box10 {
	width:97%;
	height:100px;
	margin-left:15px;
	float:left;
	padding:10px;
	text-align: center;
	background-color: #666 ;


	}

.box11 {
	width:100%;
	height:auto;
	float:left;
	padding:10px 10px;
	background-color: #fff ;
	margin-bottom:50PX;
}
.box12 {
	width:35%;
	height:auto;
	text-align: left;
	background-color: ;
	margin-right:50px;
	float:left;

	}

	.box13 {
	width:35%;
	height:auto;
	text-align: left;
	background-color: ;
	float:left;

	}
	.box14 {
	width:100%;
	height:500px;
	text-align: center;
	background-color: #E4E4E4 ;
	float:left;
	margin:0;

	}

	.box15 {
	width:100%;
	height:550px;
	text-align: center;
	background-color: #fff ;
	float:left;
	margin:0;

	}

		.box16 {
	width:100%;
	height:auto;
	text-align: center;
	background-color: ;
	border-radius:10px;
	border:#CCC solid 1px;
	box-shadow: 5px 1px 5px 1px #CCC;
	padding:10px;

	}

		.bttn {
	width:200px;
	height:50px;
	padding:15px;
	color: #69C;
	font-size:18px;
	text-align: center;
	background-color: #E4E4E4 ;
	border: 2px solid #666;
	border-radius:10px;
	margin-top:50px;
	margin-bottom:70px;
	margin-right:20px;
	float:left;

	}
		.bttn:hover {
	width:205px;
	height:52px;
	background-color: #E4E4E4 ;
	border: 1px solid #F90;


	}

			.bttn2 {
	width:200px;
	height:50px;
	padding:15px;
	color: #fff;
	font-size:18px;
	text-align: center;
	background-color: #F00 ;
	border: 2px solid #666;
	border-radius:10px;
	margin-top:50px;
	margin-bottom:70px;
	margin-right:20px;
	float:left;

	}
		.bttn2:hover {
	width:205px;
	height:52px;
	color: #000;
	background-color: #FC0 ;
	border: 1px solid #F90;


	}

.hgr{
	height:200px;
}

.hgr-1{
	height:70px;
}

td{font-family:calibri; font-size:19px; }
tr:hover {background-color: #f5f5f5;}
th, td {
  border-bottom: 1px solid #ddd;
  padding: 10px;

}
tr:nth-child(even) {background-color: #f2f2f2;}


table{ background-color:; font-family:calibri; font-size:19px; }


.foot2{
	width:100%;
	background-color:#069;
	height:300px;
}
.txt1{font-family:calibri; font-size:24px; color: #0CF;}
.txt2{font-family:calibri; font-size:18px; color:#000;}
.txt3{font-family:Arial Black; font-size:36px; color: #000;}
.txt4{font-family:calibri; font-size:24px; color:#000;}
.txt5{font-family:Arial Black; font-size:60px; color:#fff;}
.txt6{font-family:Arial Black; font-size:40px; color:#fff;}
.txt7{font-family:calibri; font-size:40px; color:#fff;}
.txtb16{font-family:calibri; font-size:16px; color:#fff;}
.txtb20{font-family:calibri; font-size:20px; color:#fff;}
.txt8{font-family:Arial Black; font-size:40px; color:#000;}
.txt9{font-family:calibri; font-size:30px; color: #666;}
.txt10{font-family:calibri; font-size:24px; color:#666;}


.cont {
  background-color: #f2f2f2;
  padding: 5px 20px 15px 20px;
  border: 1px solid lightgrey;
  border-radius: 3px;
}

input[type=text] {
  width: 100%;
  margin-bottom: 20px;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 3px;
}

label {
  margin-bottom: 10px;
  display: block;
}

.icon-cont {
  margin-bottom: 20px;
  padding: 7px 0;
  font-size: 24px;
}

.btn {
  background-color: #4CAF50;
  color: white;
  padding: 12px;
  margin: 10px 0;
  border: none;
  width: 100%;
  border-radius: 3px;
  cursor: pointer;
  font-size: 17px;
}

.btn:hover {
  background-color: #45a049;
}

span.price {
  float: right;
  color: grey;
}
.rimg{
	max-width:70%;
	height:auto;
}

/* Responsive layout - when the screen is less than 800px wide, make the two columns stack on top of each other instead of next to each other (and change the direction - make the "cart" column go on top) */

@media only screen and (max-width: 500px) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    }


  	.box1 {
	width:100%;
	height:auto;



	}
	.hd{
	width:100%;

}
.foot2{
	height:auto;
}

.box12 {
	width:40%;
	height:auto;
	text-align: left;
	background-color: ;
	margin-right:50px;
	float:left;

	}

	.box13 {
	width:40%;
	height:auto;
	text-align: left;
	background-color: ;
	float:left;

	}


		.box14 {
	width:100%;
	height:auto;


	}
		.box15 {
	width:100%;
	height:auto;


	}
	.rimg{
	max-width:100%;
	height:auto;
}
}