@charset "UTF-8";

/*  
Theme Name: Rumbolt Design
Description: Portfolio website for Rumbolt Design
Author: Carol Rumbolt
Author URI: http://www.rumboltdesign.com

body {font: 13px/1.231 sans-serif;}
*/

body {
	background:url(images/bg.jpg) repeat scroll top #A69784;
	font-size:100%;
	line-height:140%;
	overflow-x:hidden;
	width:100%;
}
body, select, input, textarea {
    color: #534233;
    font-family: Arial, Helvetica, sans-serif;
}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    border: 0 none;
    font: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}
html {overflow-y: scroll;}
header, footer, menu, nav {display: block;}
select, input, textarea, button {font: 90%  "Lucida Sans Unicode", "Lucida Grande", sans-serif;}

a:link, a:visited { color:#534233; text-decoration: none; }
a:hover, a:active { color:#990000; text-decoration: none; }

#container {
	float:left;
	background-color:#fff;
	width:100%;
}
#header { 
	width: 100%;
	margin: 0 auto;
	height:135px;
	border-top:#FFD401 4px solid;
} 
#headLeft {
	float:left;
	width:40%;
}
#logo { 
	float:left;
	margin:4px 0 0 0;
	min-width:8%;
}
#logo img {
        width: 80px;
        height: 120px;
}
#name {
	float:left;
	font:1.5em Arial, Helvetica, sans-serif;
	padding:33px 0 0 6px;
}
#nav{
	font:bold .75em Arial, Helvetica, sans-serif;
	letter-spacing:2px;
	text-transform:uppercase;
	list-style:none;
	float:right;
	margin:12px 5% 0 0;
}
#nav ul {
  margin: 0;
  padding: 0;
}
#nav ul li {
  float:left;
  margin:0;
  padding: 0px 0px 0px 15px;
  list-style: none;
}
#nav ul li.workmob { display: none; }
#nav ul li.current-menu-item a,
#nav ul li.current-menu-parent a {
 color:#534233; text-decoration: none; border-top:#900 4px solid; padding-top:12px; 
}
#nav a:link, #nav a:visited { color:#900; text-decoration: none; }
#nav a:hover, #nav a:active { color:#534233; text-decoration: none; border-top:#900 4px solid; padding-top:12px; }

#nav ul ul {
  display:none;
  position:absolute;
  float:left;
  margin: 0 0 0 -4px;
  padding: 4px 7px 10px 7px;
  width: 200px;
  z-index: 99999;
  background-color: #fff;
   /* background: #fff url(images/menu_bkg.gif) no-repeat;*/
	letter-spacing:normal;
	font:12px Arial, Helvetica, sans-serif;
	text-transform:capitalize;
}

#nav ul ul li {
   float: left;
   width: 86px;
   margin-left:8px;
   list-style:disc;
   padding:1px;
   line-height:130%;
}

#nav ul li:hover > ul {
  display: block;
}

#nav ul ul a:link,
#nav ul ul a:visited { 
  color:#534233;
  text-decoration: none; 
  border: none;
  padding: 0;
  display: block;
  text-align: left;
  width: 115px;
} 

#nav ul ul a:hover,
#nav ul ul a:active {
  color:#900; 
  text-decoration: none;
  border: none;
  padding: 0;
}
.wrapper {
	width:96%;
	float:left;
	padding:0 2% 2% 2%;
        margin-bottom: 10px;
}
.workimg {
        float: left;
        width: 64%;
		padding-bottom:4%;
}
.leftNav {
	width:7%;
        padding-right:1%;
	float:left;
	text-align:right;
	margin:25% 0 0 0;
}
.pix {
	float:left;
	width:84%;
	text-align:center;
}
.pix img { 
	width:100%; 
	text-align:center;
}
.rightNav {
	float:left;
	width:7%;
        padding-left:1%;
	text-align:left;
	margin:25% 0 0 0;
}
.textArea {
	float:left;
	width:30%;
	padding-left:2%;
       /* padding-right:1%;*/
		padding-bottom:2%;
	 	padding-right:2%;
}
.category {
	font:normal 1.5em Georgia, "Times New Roman", Times, serif; 
	margin:0 0 6px 0; 
}
.title {
	font: 1em Georgia, "Times New Roman", Times, serif;
	color:#900;
}
.client {
	font:.75em Arial, Helvetica, sans-serif;
	color:#534233;
	padding-top:2px;
}
.description {
	font:.875em Georgia, "Times New Roman", Times, serif;
	padding:20px 0px;
}
.text {
	font-size:.75em;
	line-height:160%;
}
.link {
	font:.8em Arial, Helvetica, sans-serif;
	margin:0 0 18px 0;
}
.link a:link, .link a:visited {
	color:#900;
	text-decoration:underline;
}
.link a:hover, .link a:active {
	color:#900;
	text-decoration:none;
}
.more {
}
.sub {
	font: bold .875em Arial, Helvetica, sans-serif; 
	margin:4px 0; 
	letter-spacing:4px;
	color:#900; 
}
#content {
	float:left;
	width:98%;
	font-size:.9em;
	margin-bottom:20px;
	margin-left:5%;
}
#mainText {
	float:left;
	width:65%;
	padding-right:5%;
	line-height:140%;
	font:16px/22px Georgia, "Times New Roman", Times, serif;
}
#sideText {
	float:left;
	width:15%;
	font: .85em Arial, Helvetica, sans-serif; 
	line-height:140%;
}
.desSub { font:bold 1em Arial, Helvetica, sans-serif; color:#900; letter-spacing:2px;}

#content a:link, #content a:visited { color:#900; text-decoration: none; }
#content a:hover, #content a:active { color:#534233; text-decoration: underline; }

h1 { font:normal 1.25em Arial, Helvetica, sans-serif; margin:0 0 6px 0; }
h2 { font:bold .8em Arial, Helvetica, sans-serif; margin:4px 0; letter-spacing:3px;color:#534233; }
h3 { font:normal .9em Arial, Helvetica, sans-serif; margin:0; line-height:140%;  }
h4 { font:normal .9em Georgia, "Times New Roman", Times, serif; color:#fff;margin:4px 0 0 0;line-height:140%; }
h5 { font:normal .9em Georgia, "Times New Roman", Times, serif; margin:4px 0 24px 0; }

p {margin:0 0 15px 0; }

ul.workcats {
  float: left;
  width: 20%;
  margin: 0;
  padding: 0;
}
.workcolumn {
	float:left;
	margin-right:0;
	list-style:inside disc;
  	font:.8em/150% Arial, Helvetica, sans-serif;
}
.workcolumn li {
   float: left;
   width: 100px;
   margin-right: 14px;
}

.insetPhoto {
	padding:3px;
	float:left;
	width:50px;
	height:50px;
	background:#7C6C5B;
	border:2px solid #D0C8BD;
	margin-right:10px;
	margin-top:3px;
}
.biotext {font-size:.9em;}

.insetRight {
	padding-left:10px;
	text-align:right;
	float:right;
}
.clearfloat {
  clear: both;
}

#footer {
	border: none;
	clear: both;
	width:100%;
	background-color:#a69784;
	color:#fff;
	margin:4px 0 0 0;
}
#footer ul li {
	font:normal .8em/1.75em Arial, Helvetica, sans-serif; 								
	list-style: none;
}

.about {margin-left:7%;}
.about,.connect {
	float:left;
	width:11%;
	margin-top:1%;
}
.about a:link,.connect a:link, .about a:visited,.connect a:visited { color:#fff; text-decoration:none; }
.about a:hover,.connect a:hover, .about a:active,.connect a:active { color:#900; }

.connect img {
	vertical-align:text-bottom;
}
.portfolio {
	float:left;
	width:18%;
	margin:1% 0 0 0;
/*	  -moz-column-count: 2; */
/*	  -moz-column-gap: 10px; */
/*	  -moz-column-rule: none; */
/*	  -moz-column-width:210px; */
/*	  -webkit-column-count: 2; */
/*	  -webkit-column-gap: 10px; */
/*	  -webkit-column-rule: none; */
/*	column-count: 2; */
/*	column-gap: 10px; */
/*	column-rule: none; */
	}
ul.portfolio li {
   float: left;
}
.portfoliocolumn {
	float:left;
	margin-right:12%;
}
.portfoliocolumn li {
   float: left;
   width: 45%;
   margin-right: 5%;
}

.portfolio a:link, .portfolio a:visited { color:#fff; text-decoration:none; }
.portfolio a:hover, .portfolio a:active { color:#900; }
.bio {
	float:left;
	width:45%;
	margin:1% 0 0 3%;
	line-height:1.5em;
}
.copyright {
	font:.7em Arial, Helvetica, sans-serif;
	float:left;
	margin:15px 0 0 50%;
	padding-bottom:2%;
}

.bio a:link, .bio a:visited {color:#900; text-decoration:none; }
.bio a:hover, .bio a:active {color:#534233;}

hr {color:#534233;}

.space {margin:20px 0 0 0;}

#smcolumns {
   width: 100%;
   margin-left: 20px;
   float: left;
}

.smcolumn {
	width:220px;
	margin-right:20px;
	margin-top:10px;
	float:left;
	font:12px Arial, Helvetica, sans-serif;
	line-height:16px;
	text-decoration:none;
}

#smcolumns h3 {
  font: bold 14px Arial, Helvetica, sans-serif;
}

#smcolumns ul.sitemap {
  margin-bottom: 20px;
  font:1em Arial, Helvetica, sans-serif;
  width: 100%;
}

#smcolumns li {
  float: left;
  list-style-type: none;
  margin-left: 0px;
  width: 100%;
  font-weight:bold;
}

#smcolumns li ul li {
  margin-bottom: 15px;
}

#smcolumns li li {
  float: left;
  margin: 5px 35px 0px 15px;
  list-style:square;
  width: 200px;
  font:bold .9em Arial, Helvetica, sans-serif;
  padding: 0;
}
#smcolumns li li li{
  margin: 5px 35px 0px 15px;
  list-style:square;
  width: 200px;
  font:normal .9em Arial, Helvetica, sans-serif;
  padding: 0;
}

.smxml {
   float: left;
   width: 120px;
   margin-top: 40px;
   text-align: right;
   padding-right: 20px;
}
.smxml li a {
}

.mobile { display: none; }
 
@media only screen and (max-width: 700px) {

 #header {border:none; height:100px;} 
#headLeft {width:100%;}
 #logo img {width:50px;height: 75px;}
 #name {
	font:1.15em Arial, Helvetica, sans-serif;
        padding-top:20px;
		float:left;}

 #nav{
	font:bold .7em Arial, Helvetica, sans-serif;
	background-color:#FFD401;
	padding:6px 0 6px 0;
	letter-spacing:1px;
	width:100%;
        margin: 0 0;
        text-align: center;
 }
 #nav ul {
  display: inline-block;
  margin: 0;
  padding: 0;
}
#nav ul li {
  text-align:center;
  margin:0;
  padding: 0px 0px 0px 15px;
  list-style: none;
}
#nav ul li.work { display: none; }
#nav ul li.workmob { display: inline; }

#nav a:link, #nav a:visited { color:#900; text-decoration: none; }
#nav a:hover, #nav a:active { color:#534233;}

#nav ul ul {
  display:none;
  position:absolute;
  float:left;
  margin: 6px 0 0 0;
  padding: 0 0;
  width: 200px;
  z-index: 99999;
	letter-spacing:normal;
	font:16px Arial, Helvetica, sans-serif;
	/*text-transform:capitalize;*/
}

#nav ul ul li {
   float: left;
   width: 134px;
   margin-left: 0px;
   list-style:none;
   padding:8px 15px;
   line-height:110%;
   background-color: #FFD401;
   border-top: 1px solid #ffffff;
}

#nav ul li:hover > ul {
  display: none;
}

#nav ul ul.showsub,
#nav ul li:hover > ul.showsub {
  display: block;
  font-size:1.3em;
  background-color:#fff;
  color:#900;
  padding:0px 0px;
  margin-left:-10px;
	letter-spacing:2px;
}

 .wrapper {	width:100%;padding:0;}
 .workimg { width:100%; }
.leftNav img {width:17px;height:25px;}
.rightNav img {width:17px;height:25px;}

 .pix {
	float:left;
	width:84%;
	text-align:center;
}
 .pix img { 
	width:90%; 
	text-align:center;
}
.textArea {width:90%;margin-left:2%;}
.category {font-size:1.1em;}
.title {font-size:.9em;}

.about, .portfolio, .bio, .nomobile { display:none;}
.mobile { display: inline; }
#footer {padding:10px 0 0 0;}
.connect {margin-left:4%; width:90%;}
.copyright {margin-left:4%;width:90%;line-height:130%;padding-bottom:3%;}
.workcolumn {padding-bottom:10px; width: 200px;}
#content {
	float:left;
	width:90%;
	font-size:.9em;
	margin-bottom:10px;
	margin-left:5%;
}
#mainText {
	float:left;
	width:100%;
}
#sideText {
	float:left;
	width:100%;
}
}

@media only screen and (min-width: 701px) and (max-width: 990px) {
 #header {height:115px;} 
 #logo img {width: 60px;height: 90px;}
 #name {
	font:1.2em Arial, Helvetica, sans-serif;
        padding-top: 24px;
 }
 #nav{
	font:bold .75em Arial, Helvetica, sans-serif;
 }
.wrapper {
	width:90%;
	float:left;
	padding:0 2% 2% 2%;
}
.workimg {
        float: left;
        width: 64%;
}
.leftNav img {width:17px;height:25px;}
.rightNav img {width:17px;height:25px;}
/* .textArea {float:left;width:34%;} */
.about {float:left;width:15%;}
.portfolio{display:none;}
.connect {float:left;width:17%;}
.bio{float:left;width:50%;}
.copyright {margin-left:42%;padding-bottom:3%;}

}

@media only screen and (min-width: 1000px) {
.workcolumn { margin-right: 20%; }
}
@media only screen and (min-width: 1224px) {
   #container {
        float: none;
	width:1224px;
        margin: 0 auto;
   }
}