/*
Theme Name: microsale
Author: Will and Don..
Author URI: https://www.microsalenz.com/
*/

/* MAIN STYLES
-------------------------------------------*/
* { margin: 0; padding: 0; }

@font-face {
    font-family: tahoma,"segoe ui";
    font-weight: normal;
    font-style: normal;
}
 

body,html {font-family: tahoma,"segoe ui", calibri,  sans-serif;
	font-weight:normal;
	
	font-size:14px;
	color:#555;
	margin:0;
	padding:0;
	background:#000 url(images/bk_body.jpg) 50% 15px no-repeat;
	line-height:130%;
}



<div itemscope itemtype="http://schema.org/Organization">
  <a itemprop="url" href="https://www.microsalenz.com/">Home</a>
  <img itemprop="logo" src="https://www.microsalenz.com/wp-content/uploads/2012/05/MicrosaleNZnew.ico"/>

</div>

div.submitWrapper  {
   text-align: center;    
}    



input[type=number]
{
    font-size:16px;
size : 40px;
}
input[type=text]
{
    font-size:14px;

}

textarea  
{  
font-family: tahoma,"segoe ui", calibri,  sans-serif;
   font-size: 12px;   
}

input[type=email]
{
    font-size:14px;
}
input[type="submit"] {
  ! text-indent:-9999px;
    width:auto;
text-align : center;
font-size:16px;
height : 40px;
 
}



ul {
	list-style:none;
}




a img  {border-width:1px;}
a {border-width:2px;
	color:#3393D9;
	text-decoration:none;
vertical-align: top;
}

a:hover {color:#3badff;
	text-decoration:none;
}

a:focus {
	outline:none;
}


p {
	margin:1em 0;
}


h1 {font-weight:normal;
	font-size:28px;

	color:#3393D9;
	line-height:120%;
	margin-bottom:5px;
	
	padding:5px 0 5px;
}

h1 a:hover {
	
}

h1.home {

	font-size:28px;
	font-weight:normal;
	border-bottom:3px solid #DDD;
	border-top:1px solid #DDD;
	padding-bottom:9px;
	padding-top:17px;
	margin-top:20px;
	position:relative;
	
}


h2 {
font-family: Tahoma,"Segoe ui", Calibri,  Arial, Helvetica, sans-serif;
	font-size:20px;
	color:#3393D9;
	font-weight:normal;
	
width: 100%;
height : auto;
margin-bottom:5px;
	padding:5px 0 5px;
}

h2.comments {
	color:#333;
	padding:20px 0;
font-size:20px;
}

h3 {
	font-family: tahoma,"Segoe Ui", calbri,  Arial, Helvetica, sans-serif;

font-size:18px;
}

h4 {
	font-family: "Segoe ui", calbri, tahoma, Arial, Helvetica, sans-serif;
	


font-size:16px;

}
h5 {
	font-family: tahoma, "Segoe ui", calbri,  Arial, Helvetica, sans-serif;
	

letter-spacing:1px;
font-size:12px;
}
sup,
sub {z-index:-0;
	height: 0;
	line-height: 1;
	vertical-align: baseline;
	_vertical-align: bottom;
	position: relative;
}
sup {
	bottom: 0.5ex;
}
sub {
	top: 0.5ex;
}


.note {
 /* FireFox 1+ */
	/* Safari 3+, Chrome */

/* FireFox 3.6 */
-moz-border-radius: 6px;
	background-image: -moz-linear-gradient(top, #ffffff, #efefef);
	/* Safari4+, Chrome */
-webkit-border-radius: 6px; 	
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, ffffff),color-stop(1, #efefef));
	/* IE6,IE7 */
	border-radius: 6px;
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='efefef', endColorstr='#ffffff');
	/* IE8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#efefef', endColorstr='#f4f4f4')";

border: 1px solid #dedede;  margin:0 0 15px 0; padding: 10px 40px 10px 10px; 

}

.slideshow-container {
  width : auto;
  max-width: 1000px;
  position: relative;
  margin: auto;
 
}

/* Next & previous buttons 
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 0;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}
*/
/* Position the "next button" to the right 
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}*/

/* On hover, add a black background color with a little bit see-through 
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}*/

/* Caption text */
.text {
 /* color: #f2f2f2;*/
   color: black;
width: 100%;
height : auto;
 background-color: #ffffff;
  font-size: 16px;
font-weight: bold;
  padding: 8px 12px;
  position: absolute;
  bottom: -30px;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
 /* color: #f2f2f2;*/
color :black;
   font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor:pointer;
  height: 13px;
  width: 13px;
  margin: -18px 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}



.prodnote {

height:300px;

 /* FireFox 1+ */
	/* Safari 3+, Chrome */

/* FireFox 3.6 */
-moz-border-radius: 6px;
	background-image: -moz-linear-gradient(top, #ffffff, #efefef);
	/* Safari4+, Chrome */
-webkit-border-radius: 6px; 	
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, ffffff),color-stop(1, #efefef));
	/* IE6,IE7 */
	border-radius: 6px;
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='efefef', endColorstr='#ffffff');
	/* IE8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#efefef', endColorstr='#f4f4f4')";

border: 1px solid #dedede;  margin:0 0 15px 0; padding: 10px 40px 10px 15px; 
display: table; width:550px; height: 100%; position: relative; overflow: hidden;
}
.notefloat {width: 40%;
position: absolute; top: auto; 
display: table-cell; vertical-align: middle;

padding-left: 320px;

font-family: "Segoe ui",Georgia, serif;
font-size: 16px;
font-style: italic;
font-weight: bold;
text-transform: normal;
letter-spacing: normal;
line-height: 1.4em;
}


 /* LAYOUT STRUCTURE
--------------------------------------------------*/


 p.searcht {
    padding-right: 50px;
}


ul.topnav {
    list-style-type: none;
 text-align: center;
    margin: 0;
    padding: 0;
    overflow: hidden;
 width: 90%;
    height: auto;
    background-color: #447745;
   }

/* Float the list items side by side */
ul.topnav li {float: left;}
/* Style the links inside the list items */
ul.topnav li a {
    display:inline-block;
    color: #f2f2f2;
       padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}
/*
ul.topnav li {
    border-right: 1px solid #bbb;
}

ul.topnav li:last-child {
    border-right: none;
}*/

/* Change background color of links on hover */
ul.topnav li a:hover {background-color: #ecbc73;}

/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.topnav li.icon {display: none;}


ul.topnav2 {
    list-style-type: none;
 text-align: center;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: darkgrey;
}

/* Float the list items side by side */
ul.topnav2 li {float: left;}
/* Style the links inside the list items */
ul.topnav2 li a {
    display:inline-block;
    color: #f2f2f2;
       padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}
/*
ul.topnav2 li {
    border-right: 1px solid #bbb;
}

ul.topnav2 li:last-child {
    border-right: none;
}*/

/* Change background color of links on hover */
ul.topnav2 li a:hover {background-color: green;}

/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.topnav2 li.icon {display: none;}


ul.topnav3 {
    list-style-type: none;
 text-align: center;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: darkgrey;
}

/* Float the list items side by side */
ul.topnav3 li {float: left;}
/* Style the links inside the list items */
ul.topnav3 li a {
    display:inline-block;
    color: #22407c;
       padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}
/*
ul.topnav3 li {
    border-right: 1px solid #bbb;
}

ul.topnav3 li:last-child {
    border-right: none;
}*/

/* Change background color of links on hover */
ul.topnav3 li a:hover 
{background-color:#f0f0f0;}

/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.topnav3 li.icon {display: none;}


ul.topnav4 {
    list-style-type: none;
 text-align: center;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: black;
}

/* Float the list items side by side */
ul.topnav4 li {float: left;}
/* Style the links inside the list items */
ul.topnav4 li a {
    display:inline-block;
    color: #f2f2f2;
       padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}
/*
ul.topnav4 li {
    border-right: 1px solid #bbb;
}

ul.topnav4 li:last-child {
    border-right: none;
}*/

/* Change background color of links on hover */
ul.topnav4 li a:hover {background-color: red;}

/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.topnav4 li.icon {display: none;}




#wrapper {
	margin:0 auto;
	width:944px;
}


#header {
	height:123px;
	position:relative;
	z-index:99; 
	padding:0 8px;
}

#content {
	padding:18px 20px;
	padding-bottom:30px;
	background:#FFF;
}

#content h1 {	font-weight: normal;
font-family:"Segoe ui",'ArvoBold', Arial, Helvetica, sans-serif;}

#colLeft{
	width:595px;
	float:left;

}

#colRight {
	width:285px;
	float:left;	
	margin-left:23px;
}

#footer {
	background:#F3F3F3 url(images/bk_footer.jpg) 0 0 repeat-x;
	padding:30px 0 0;
	color:#666;
	position:relative;
}

#footerInner {
	margin-left:-7px;
	padding-bottom:30px;
}

#footerInnerBottom {
	background:#000;
	border-top:8px solid #333;
	padding:0 10px 50px;
	font-size:11px;
	position:relative;
}

/* HEADER ELEMENTS
------------------------------------------*/
#site5top {
	position:absolute;
	top:40px;
	right:8px;
}

/* -- logo --*/
#logo {
	position:absolute;
	
	top:5px;
left: 25px;
}

#logo a img{
	border:none;
width : 90%;
}

#logo span {Float:left;
position: relative left: 10px;
	display:block;
	color:#999;
	padding-top:5px;
	padding-left:5px;
	font-size:12px;
}

#logo address {
	color:#fff; 
	margin-top:12px;
	font-family: calibri,"tahoma",'ArvoBold', Arial, Helvetica, sans-serif;
	font-style: italic;
/*font-weight : bold;*/
	
font-size:15px;     /*software development and support since 1988*/

}


/* -- top menu --*/

#topMenu {
	
	position:absolute;
	bottom:0;
	right:0;
	border-top:1px solid #80E1FF;
	border-right:1px solid #80E1FF;
	/*background:url(images/bk_top_menu.jpg) 0 0 repeat-x;*/
	background:url(images/bk_top_menu_ov.jpg) 0 0 repeat-x;
	
}

#topMenu ul.sf-menu li {
	float:left;
}

#topMenu ul.sf-menu li:hover {
	
}

#topMenu ul.sf-menu li a{
	display:block;
	text-transform:uppercase;
	color:#B3E3FD;
	font-size:12px;
	line-height:36px;
	border-left:1px solid #54C1FB;
	padding:0 17px;
	height:36px;
}

#topMenu ul.sf-menu li a:hover {
	color:#FFF;
	text-decoration:none;
	/*background:url(images/bk_top_menu_ov.jpg) 0 0 repeat-x;*/
	background:url(images/bk_top_menu.jpg) 0 0 repeat-x;
}

#topMenu ul.sf-menu li li ul.children {	
	margin:0 0 0 26px;
}

#topMenu ul.sf-menu li li a {
	padding:0 12px;
}

#topMenu ul.sf-menu li li a:hover {
	background:#009FFF;
}

#topMenu ul.sf-menu li li {
	padding:0;
	background:#0082CE;
	border-bottom:1px solid #21AEFA;
	border-right:1px solid #21AEFA;
}


#primary-menu li.current-menu-item a {
	background: #fff url(images/primary-menu-active.png) repeat-x 0 0;
	border-top: none;
	border-bottom: 2px solid #fff;
	}

/* CONTENT ELEMENTS
--------------------------------------------------*/

.alignleft {
	float:left;
	margin:5px 10px 5px 0;
}

.alignright {
	float:right;
	margin:5px 0 5px 10px;
}

#homeHeader {
	height:306px;
	background:url(images/bk_slider.jpg);
	position:relative;
}

#homeHeader #headerImg {
	position:absolute;
	right:60px;
	top:30px;
}

#homeHeader #headerText {
	padding-top:30px;
	padding-left:20px;
	width:400px;
	font-size:16px;
	color:#999;
}

#homeHeader #headerText a {
	color:#93CA0C;
	

}

#homeHeader #buttons {
	position:absolute;
	bottom:15px;
	left:10px;
}

#homeHeader #buttons a {
	display:block;
	width:112px;
	height:35px;
	background:url(images/but_slider.png) 0 0 no-repeat;
	padding:8px 40px 0 13px;
	font-weight:normal;
	
	
	font-size:14px;
	float:left;
	margin-left:10px;
}

.headercontainer2 {
  position: relative;
  !border: 1px solid #222;
  padding-bottom: 10px;
  !height : 20px;
   color : black;
  background: #898a8c;
}

.headercontainer {
  position: relative;
  !border: 1px solid #222;
  padding-bottom: 10px;
  !height : 20px;
  background: #f2f2f2;
}
/* this is for the data area that is scrollable */
.tablecontainer {
  overflow-y: auto;
  height: 950px;
  background: #fff;
}

/* remove default cell borders and ensures table width 100% of its container*/
.tablecontainer table {
  border-spacing: 0;
  width:100%;
}

/* add a thin border to the left of cells, but not the first */

/* cell padding and bottom border */
.tablecontainer td, th {
width : 50%;
  border-bottom:1px solid #eee;
  padding: 10px;
}

/* make the default header height 0 and make text invisible */


/* reposition the divs in the header cells and place in the blank area of the headercontainer */
.tablecontainer th div{
  visibility: visible;
  position: absolute;
  background: #fff;
  color: black;
  padding: 9px 10px;
  top: 0;
  margin-left: -10px;
  line-height: normal;
   border-left: 1px solid #222;
}
/* prevent the left border from above appearing in first div header */
th:first-child div{
  border: none;
}


/* alternate colors for rows */
.tablecontainer tbody  tr:nth-child(even){
     background-color: #ddd;
}

table.lamp tr:nth-child(even) {
    background-color: #fcfcfc;
font-size:16px;
color : black;
!font-weight: bold;
	!#fffaf0;
	
}
table.lamp tr:nth-child(odd) {
    background-color :#fafafa;
font-size:16px;
	color : black;
!font-weight: bold;
}


thead {
    display: inline-block;
    width: 100%;
    height: 40px;
}

table.lamp {
table-layout:fixed;
display :table;
   width : auto;
     max-width: 85%;
 height: auto;

   /* border:4px solid  #C0C0C0 ;*/
  	/*padding : 40px;
	padding-left : 60px;
padding-right : 20px;*/

	
}


table.lamp th, td {
    padding:10px;
	
	}


table.lamp th {
    width:auto;
}


ul.enlarge{
list-style-type:none; /*remove the bullet point*/
margin-left:0;
}
ul.enlarge li{
display:inline-block;/*places the images in a line*/
float : left;
 position: relative; 
   
 /* 
 resets the stack order of the list items - later we'll increase this*/
/*margin:3px 3px 3px 3px;text-align : center;  */
}

ul.resize25 img{
   max-width:65%;   /*55%*/
   max-height:65%;
 	/*border-left: 3px solid #d0d0d0;
	border-right: 3px solid #d0d0d0;
border-top: 3px solid #d0d0d0;
	border-bottom: 3px solid #d0d0d0;*/

}


ul.enlarge img{
background-color:#eae9d4;
/*padding: 1px;*/
border-left: 3px solid #d0d0d0;
	border-right: 3px solid #d0d0d0;
border-top: 3px solid #d0d0d0;
	border-bottom: 3px solid #d0d0d0;
position: relative;
/*max-width : 100%;
max-height : 100%;*/
float : left;
/*-webkit-box-shadow: 0 0 4px rgba(132, 132, 132, .75);
-moz-box-shadow: 0 0 4px rgba(132, 132, 132, .75);
box-shadow: 0 0 4px rgba(132, 132, 132, .75);*/

}
ul.enlarge span{
/*span is the text part at the bottom of the image*/
position : absolute;
z-index : 1;
float : left;
left: -9999px;
background-color: white;
padding: 4px;
font-family: "Lato","Arial";
!font-size:.9em;
text-align: top; 
color: black;/*#495a62; */
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);

}
ul.enlarge li:active{

cursor:pointer;
display:inline-block;
    /*places the images in a line*/
z-index: 1;
    position: relative;


}
ul.enlarge span img{
padding:2px;
background:#ccc;


}

ul.enlarge li:hover span{ 

top: 10px; /*the distance from the bottom of the thumbnail to the top of the popup image*/
left: -20px; /*distance from the left of the thumbnail to the left of the popup image*/


}

ul.enlarge li:hover:nth-child(2) span{
left: -100px; 
z-index : -1;

}
/*ul.enlarge li:hover:nth-child(3) span{
left: -200px; 

}*/

/**IE Hacks - see http://css3pie.com/ for more info on how to use CS3Pie and to download the latest version**/
ul.enlarge img, ul.enlarge span{
behavior: url(pie/PIE.htc); 
}

#features {
	background: url(images/bk_featured.jpg) 0 0 repeat-x;
	
background: #ececec; /* Old browsers */
background: -moz-linear-gradient(top,  #ececec 34%, #e1e8ed 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(34%,#ececec), color-stop(100%,#e1e8ed)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ececec 34%,#e1e8ed 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ececec 34%,#e1e8ed 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ececec 34%,#e1e8ed 100%); /* IE10+ */
background: linear-gradient(top,  #ececec 34%,#e1e8ed 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ececec', endColorstr='#e1e8ed',GradientType=0 ); /* IE6-9 */
margin-left:-31px;
	padding-left:28px;
width:938px;
	position:relative;
	
list-style:none;
}

#featuresBottom {
	width:966px;
	margin-left:-31px;
	height:10px;
	background:url(images/bk_featured_bottom.png) 0 0 no-repeat;
}

#features .featuresInner {
	padding:25px 10px 20px 10px;
width:210px;
	float:left;

	background:url(images/bk_line_vert.jpg) 0 0 repeat-y;
text-align: center;
	
}

#features .featuresInner h2 {

	font-size:16px;
	font-weight:normal;
	text-transform:uppercase;
}
#features .featuresInner h1 {


	font-weight:normal;
	text-transform:uppercase;
	
}


#features .first {
	background:none;
	padding-left:0;
}

#features .featuresInner img {
	display:block;
	margin-left:auto;
margin-right:auto;

padding-bottom:15px


}

.latestPosts {
	margin-left:-25px;
}

.latestPosts li {
	display:block;
	border-bottom:1px solid #ddd;
	padding:15px 0;
	width:283px;
	float:left;
	margin-left:25px;
}	

.latestPosts li img {
	float:left;
	padding:5px;
	background:url(images/bk_thumbs.jpg) 0 0 no-repeat;
	margin:0 10px 0 0;
}

.latestPosts li span {
	font-size:14px;
	color:#999;
}

h1.home .links {
	position:absolute;
	font-size:14px;
	right:5px;
	top:18px;
	color:#ddd;
	font-weight:normal;
	font-family: "Segoe ui",Tahoma, Arial, Helvetica, sans-serif;
}

h1.home .links img {
	vertical-align:middle;
	margin-right:7px;
	margin-bottom:1px;
}


#innerTop {
	height:90px;
	padding:28px 20px 0 20px;
	background:url(images/bk_top_inner.jpg) 0 0 no-repeat;

}

.innerTitle, .innerTitle h1{
	font-family:"Segoe Ui", Arial, Helvetica, sans-serif;
	font-size:30px;
	font-weight:normal;
	padding:0;
	padding-right:	15px;
	float:left;
	height:38px;

    color:#fff;
	line-height:38px;
	text-transform:uppercase;
}


.innerDesc {
	float:left;

font-family: "Segoe ui",Georgia, "Times New Roman", Times, serif;
	border-left:1px solid #666;
	padding-left:20px;
	font-size:16px;
	font-weight:bold;
font-style:italic;
	line-height:26px;
	
	padding-top:10px;
}

.innerDesc p{
	margin:0;float:left;
}

/* COL LEFT
-------------------------------------------------*/

/* share icons */
#colLeft .social {
	padding:0 0 15px;
	border-bottom:1px solid #ddd;
	margin-top:-15px;
}

#colLeft .social img {
	border:none;
	margin:5px 5px 0 0;
}

.more-link {
	display:block;
	clear:both;
}

#archive-title, .searchQuery {
	border-bottom:1px solid #ddd;
	padding:7px 0 10px;
	margin-bottom:20px;
}

#colLeft .blogItem {
	border-bottom:1px solid #ddd;
	margin-bottom:25px;
	position:relative;
	/*padding-left:12px;*/
}

#colLeft .blogItem .postComments {
	position:absolute;
	left:0;
	top:-3px;
	width:37px;
	background:url(images/bk_ico_comments.png) 0 3px no-repeat;
	text-align:center;
	height:40px;
	font-size:14px;
	font-weight:normal;
	line-height:27px;
	text-shadow:#CF881E 1px 1px;
	padding-right:12px;
	/*border-right:1px solid #ddd;*/
	padding-top:3px;
}

#colLeft .blogItem .postComments a{
	color:#fff;
}

#colLeft .blogItem .postRight{
	float:left;
	width:520px;
	/*padding-left:12px;*/
}

#colLeft .blogItem .meta {
	font-size:14px;
	/*width:520px;*/
	color:#999;
}

#colLeft .blogItem .meta .metadata {
	display:block; 
	background:#F3F3F3; 
	padding:6px 10px 4px; 
	margin-bottom:15px; 
	margin-left:37px;
	color:#444; 
	font-size:14px;
}

#colLeft .blogItem .meta img {
	vertical-align:middle;
}

#colLeft ul {
margin-bottom:20px;
	list-style:disc;
	list-style-position:inside;
}


#colLeft li {list-style-position: outside;

margin: 0 0 0.2em 15px; padding: 0 0 0 12px;

}

#colLeft h1 {
	font-family: "Segoe ui",'LeagueGothicRegular', Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	font-size:20px;


}

#colLeft .testimonial {
	padding:15px 0 25px;
	border-bottom:1px solid #ddd;
	background:url(images/bk_testimonial.png) 95% 80% no-repeat;
}

#colLeft .testimonial p img {
	float:left;
	margin:0 10px 0 0;
	padding:5px;
	background:url(images/bk_thumbs.jpg) 0 0 no-repeat;
}

#colLeft .testimonial p{
	font-family: "segoe ui",Georgia, "Times New Roman", Times, serif;
	font-size:14px;
	font-style:italic;
	margin:0.7em 0 0.2em;
}


.wp-pagenavi, .navigation{
	clear:both;
}



/* COL RIGHT
--------------------------------------------------*/
#colRight h2{
	display:block;
	background:url(images/bk_rightbox_top.jpg) 0 0 no-repeat;
	color:#3393D9;
	padding:11px 10px 9px;
	margin-top:13px;
	text-transform:uppercase;
	font-size:14px;
	font-weight:normal;
}

#colRight h2 span {
	padding-top:4px;
}

#colRight .boxRight {
	border:1px solid #ddd;
	border-top:none;
	border-bottom:none;
}

#colRight .boxRight ul li {
	padding:6px 10px;
	border-bottom:1px solid #ddd;
	background:url(images/bullet_list_footer.png) 10px 13px no-repeat;
	padding-left:20px;
}


#colRight h2.testimonials {
	background:url(images/bk_rightbox_top_testimonials.jpg) 0 0 no-repeat;
}

#colRight h2.twitter {
	background:url(images/bk_rightbox_top_twitter.jpg) 0 0 no-repeat;
}

#colRight .testimonialsList ul li {
	padding:10px;
	background:none;
}

#colRight .testimonialsList ul li span {
	font-size:12px;
	color:#999;
	font-family: "segoe ui",Arial, Helvetica, sans-serif;
	font-style:normal;
}


#colRight .testimonialsList ul li img {
	float:left;
	margin:0 10px 0 0;
	padding:5px;
	background:url(images/bk_thumbs.jpg) 0 0 no-repeat;
}

#colRight .testimonialsList ul li p{
	font-family: "segoe ui",Georgia, "Times New Roman", Times, serif;
	font-size:13px;
	font-style:italic;
	margin:0.7em 0 0.2em;
}

#colRight .twitterList div.aktt_tweets li {
	font-family: calibri,"segoe ui",Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-size:14px;
	background:none;
	padding:10px;
}

#colRight .twitterList div.aktt_tweets li a.aktt_tweet_time{
	display:block;
	clear:both;
	font-size:12px;
	color:#999;
}

#colRight .twitterList div.aktt_tweets li.aktt_more_updates a{
	font-family:"segoe ui",Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-style:normal;
}

#colRight #searchBox {
	background:url(images/bk_search.png) 0 0 no-repeat;
	padding:13px 10px;
	width:265px;
	height:47px;
}

#colRight #searchBox h2 {
	background:none;
	color:#666;
	padding:0;
	margin:0;
	line-height:100%;
	height:20px;
}

/* FOOTER ELEMENTS
--------------------------------------------*/

#footer .footerBox {
	width:283px;
	float:left;
	margin-left:25px;
}


#footer .footerBox h2  {
	border-bottom:1px solid #DDD;
	padding-bottom:10px;
	text-transform:uppercase;
	font-size:14px;
	color:#3393D9;
	font-weight:normal;
}


#footer .footerBox ul li {
	border-bottom:1px solid #DDD;
	padding:5px 0;
	background:url(images/bullet_list_footer.png) 0 12px no-repeat;
	padding-left:12px;
}


#footer .contact {
	background:url(images/bk_footer_contact.jpg) 100% 0 no-repeat;
	padding-left:10px;
	width:265px;
	border-left:1px solid #ddd;
	min-height:200px;
}

#footer .contact .social {
	font-size:11px;
	display:block;
	padding-top:15px;
	margin-top:10px;
	border-top:1px solid #ddd;
}

#footer .contact .social img {
	vertical-align:middle;
	margin-right:5px;
}



#copy {
	clear:both;
	padding:20px 0 10px;
}

#footer ul#footerMenu li{
	float:left;
	padding:0 10px;
	border-left:1px solid #292929;
	line-height:100%;
}

#site5bottom {
	position:absolute;
	right:10px;
	top:20px;
}

/*COMMENTS
---------------------------------------------*/
#colLeft ul.commentlist {
	margin:25px 0 -20px;
	list-style:none;
	list-style-position:outside;
}

#colLeft ul.commentlist ul {
	list-style-type:none;
	list-style-position:outside;
}

#colLeft ul.commentlist li {
	background:none;
	border:1px solid #ddd;
	padding:10px 15px;
	position:relative;
	background:#F3f3f3;
	margin-bottom:40px;
}

#colLeft ul.commentlist li .comment-meta {
	margin-top:-36px;
}

#colLeft ul.commentlist li .comment-meta span {
	font-size:12px;
	padding-top:7px;
	line-height:210%;
	font-family:"segoe ui",Georgia, "Times New Roman", Times, serif;
	font-style:italic;
}

#colLeft ul.commentlist li .comment-meta span strong {
	font-size:18px;
}

#colLeft ul.commentlist li .commentRight .text {
	padding-bottom:15px;
}



#colLeft ul.commentlist li .avatar {
	border:1px solid #FFF;
	padding:5px;
	background:#E6E6E6;
	float:left;
	margin-right:5px;
}

#colLeft ul.commentlist .reply a {
	font-size:11px;
	position:absolute;
	bottom:10px;
	right:15px;
	margin-top:15px;
	display:block;
	background:url(images/but_reply.png) 0 0 no-repeat;
	width:47px;
	text-align:center;
	color:#fff;
	height:20px;
}

#colLeft ul.commentlist li em {
	font-size:12px;
	padding-top:5px;
	display:block;
}

#colLeft ul.commentlist li .children li {
	background:#fff;
	margin-left:20px;
	margin-top:25px;
	
}


/* FORMS
-------------------------------------------*/

fieldset {
	border:1px solid #ddd;
	background:#F3f3f3;
	padding:15px;
	padding-bottom:20px;
	position:relative;
}


#searchform input {
	border:1px solid #DADADA;
	background:#FFF;
	padding:4px;
	color:#999;
	width:175px;
	float:left;
}

#searchform input#searchsubmit {
	width:72px;
	height:26px;
	border:none;
	background:url(images/but_form.png) 0 0 no-repeat;
	cursor:pointer;
	text-align:center;
	color:#FFF;
	font-size:16px;
	margin-left:5px;
	font-weight:bold;
	padding:0;
}

/* contact */

#contact label {
	display:block;
	padding:8px 0 2px;
	font-weight:bold;
}

#contact input, #contact textarea {
	border:1px solid #fff;
	border-top:1px solid #ddd;
	border-left:1px solid #ddd;
	padding:5px;
	font-size:12px;
	font-family: "segoe ui",Arial, Helvetica, sans-serif;
	color:#666;
	width:300px;
	margin-bottom:10px;
}

#contact textarea {
	width:500px;
}

#contact input.submit {
	border:none;
	width:74px;
	height:26px;
	margin-top:20px;
	background:url(images/but_form.png) 0 0 no-repeat;
	color:#FFF;
	font-weight:bold;
	text-align:center;
	cursor:pointer;
	
}

.errormsg, .successmsg{
	background:#FEF4F1;
	border:1px solid #F7A68A;
	color:#DA4310;
	padding:10px;
}

.successmsg {
	background:#F5FAF1;
	border:1px solid #C2E1AA;
	color:#8FA943;
}


#image2 { display: none;}
#image1 { display: none;}
#image3 { display: none;}
#image4 { display: none;}
#image5 { display: none;}
#image6 { display: none;}
#image7 { display: none;}
#image8 { display: none;}
#doitlarge { display: none;}
#doitsmall { display: none;}

@media only screen and (max-width: 750px){ //some value
   #image1 {display: none; }
   #image2 {display: block; }
  #image3 {display: none; }
   #image4 {display: block; }
 #image5 {display: none; }
   #image6 {display: block; }
 #image7 {display: none; }
   #image8 {display: block; }
#doitlarge { display: none;}
#doitsmall { display: block;}
.inputblock label{
    display: inline-block;
    float: left;
    clear: left;
    width: 200px;
    text-align: left;
margin-left : 2px;
}
.inputblock textarea{
display: inline-block;
  }

.inputblock input{
 display: inline-block;
    float: left;
margin-left : 2px;
margin-bottom : 10px;
}

}

@media only screen and (min-width: 750px){ //some value
   #image2 {display: none; }
   #image1 {display: block; }
 #image4 {display: none; }
   #image3 {display: block; }
 #image6 {display: none; }
   #image5 {display: block; }
#image8 {display: none; }
   #image7 {display: block; }
#doitsmall { display: none;}
#doitlarge { display: block;}
.inputblock label{
    display: inline-block;
    float: left;
    clear: left;
    width: 200px;
    text-align: right;
}
.inputblock textarea{
display: inline-block;
   margin-left : 2px;}




.inputblock input{
 display: inline-block;
    float: left;
margin-left : 20px;
margin-bottom : 10px;
}

}




/* CLEARING
---------------------------------------------------*/
.clearfix:after {
    content: "."; 
    display:block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {
	display: block;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.clear {
	clear: both;
}

.noclear {
	clear: none;
}

#cboxTitle { display: none !important; } 

.boxgrid{ 
	width: 220px; 
	height: 220px; 
	margin:0 20px 20px 0; 
	float:left; 
	border:1px solid #ddd;
	overflow: hidden; 
	position: relative; 
	 /* FireFox 1+ */
	/* Safari 3+, Chrome */

/* FireFox 3.6 */
-moz-border-radius: 6px;
	background-image: -moz-linear-gradient(top, #ffffff, #efefef);
	/* Safari4+, Chrome */
-webkit-border-radius: 6px; 	
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, ffffff),color-stop(1, #efefef));
	/* IE6,IE7 */
	border-radius: 6px;
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='efefef', endColorstr='#ffffff');
	/* IE8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#efefef', endColorstr='#f4f4f4')";

border: 1px solid #dedede; 
padding:15px ;
	padding-top:10px ;
-moz-box-shadow: 0 0 5px #ddd;
-webkit-box-shadow: 0 0 5px#ddd;
box-shadow: 0 0 5px #ddd;

}
.boxgrid img{ z-index:9999;
		position: absolute; 
		top: 0px; 
		left: 0px; 
		border: 0; 
		border:1px solid #FFF;
}
.boxgrid p{ 
		color:#999; 
		
	
}

.boxgrid p a.title {
	font-size:16px;
	color:#eee;
	line-height:100%;

}
	
.boxcaption{  
	padding:0 0 0 10px;
	font-size:12px; !important
	float: left; 
	position: absolute; 
	background: #000; 
	height: 100px; 
	width: 100%; 
	opacity: .85; 
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
}
.captionfull .boxcaption {
		top: 250px;
		left: 0;
}
.caption .boxcaption {
		top: 190px;
		left: 0;
}
 
/* Add Drop Shadow, Rounded Corners, and Background to Contact Form 7 */

.wpcf7 input, textarea {
border: 1px solid #ccc;
font-size: 14px; margin: 0 10px 10px 0;
padding: 8px 10px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
box-shadow: 0 2px 2px #ddd;
-moz-box-shadow: 0 2px 2px #ddd;
-webkit-box-shadow: 0 2px 2px #ddd
}
 
/* Adjusting Widths for Input and Text Area fields to Contact Form 7 */
 
.wpcf7 input {
width: 200px;
}
 
.wpcf7 textarea {
width: 80%;
}
 
/* Adding Icons to Text Fields for Contact Form 7 */
 
.wpcf7 .your-name input[type="text"], .name {
background: #fff url(images/person1.png) /* name.png */ no-repeat 10px center;
padding-left: 35px
}
 
.wpcf7 .your-email input[type="text"], .wpcf7 .your-email input[type="email"] {
background: #fff url(images/email.png) /* email.png */ no-repeat 10px center;

padding-left: 35px
}
 
.wpcf7 .your-subject input[type="text"], .subject {
background: #fff url(images/note.png) no-repeat 10px center;
padding-left: 35px
}
 
/* Customizing the Submit Button for Contact Form 7 */
 
.wpcf7 input[type="submit"] {
background: #217b30 url(images/green.png) repeat-x top;
border: 1px solid #137725;
color: #fff;
cursor: pointer;
font-size: 14px;
font-weight: bold;
padding: 3px 5px;
text-shadow: -1px -1px #1c5d28;
text-transform: uppercase;
width: auto
}
 
/* Optional For Genesis Users that use a Global margin-bottom variable for the
 
tag */
.wpcf7 p {
font-size: 14px;
font-weight: bold;

margin-bottom: .45rem;
}

Read more: http://avgjoegeek.net/how-to-add-css-style-contact-form-7/#ixzz3Dw0KlNlb