/*
Theme Name: MITCHELL CRITTLE
Version: 1.0
Description: Custom Mitchell Crittle Decorating website
Author: FazeDesigns (Ehren Fergusson)
Author URI: http://www.fazedesigns.com
*/





/************************************/
/*** CSS CODED BY EHREN FERGUSSON ***/
/************************************/






/************************************/
/************ START CSS *************/

html {height:100%;}
body {margin:0px; padding:0; line-height:1.5em; height:100%; background:#fff;}
body,td,th {color:#666; font-family: 'Open Sans', arial, sans-serif; font-size: 13px; font-weight:400;}

/**********************************/
/************* RESET **************/

h1, h2, h3, h4, h5, h6, div, a, li, ul, fieldset, form, p, span {padding:0; margin:0; text-decoration:none; font-weight:normal; list-style:none; border:0; outline:none;}
img { margin:0 0 -5px 0 !important; padding:0; outline:none; border:0;}
h1, h2, h3, h4, h5, h6 {font-weight:400; font-family: 'Oswald', sans-serif; text-transform: uppercase;}
a { color: #333; outline: none;}
a:hover { color: #000;}
.clear {clear:both;}
::selection {background: #262626; color:#fff;}
::-moz-selection {background: #262626; color:#fff;}

/************************************/
/************** HEADER **************/

#header { width: 960px; margin: 0 auto; height: 190px; display: block; position: relative;}
#header h1#logo { width: 285px; height: 190px; float: left; display: block; position: relative; background: url(images/artisan-painting.png) no-repeat; background-size: contain;}

/************************************/
/*************** MENU ***************/

#menu { width: 640px; float: right; position: relative; display: block; height: 190px;}
#menu ul {}
#menu ul li { float: right; margin: 0 0 0 1px;}
#menu ul li a { display: block; height: 190px; color: #666;}
#menu ul li a h2 { padding: 150px 10px 0 10px; font-size: 18px; text-transform: uppercase;}
#menu ul li a:hover {color: #000;}
#menu ul li.current-menu-item a { background: url(images/bg_nav.jpg) repeat-x bottom; color: #000;}
#menu ul li.hover a h2 {}
#menu ul li ul {display: none;}

/************************************/
/*************** MAIN ***************/

#wrapper { display: block; position: relative; width: 100%; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; padding: 25px 0;}
#maincontent {display: block; position: relative; width:960px; margin: 0 auto;}
#left { float: left; width: 300px;}
#right { float: right; width: 640px;}

#homeslides { position: relative; display: block; width: 960px; height: 500px; background: #000;}
#homeslides_nav { width: 39px; position: absolute; top:155px; right: 0; height: 140px; padding: 40px 0 30px 0; background: url(images/nav.png) no-repeat top; z-index: 999;}
#homeslides_nav li { float: left;}
#homeslides_nav li a span { display: block; width: 39px; height: 26px; background: url(images/slide-nav.png) no-repeat;}
#homeslides_nav li a.activeSlide span {background: url(images/active.png) no-repeat;}

.cycle-pager { width: 39px; position: absolute; top:155px; right: 0; height: 140px; padding: 40px 0 30px 0; background: url(images/nav.png) no-repeat top; z-index: 999;}
.cycle-pager span { display: block; width: 39px; height: 26px; background: url(images/slide-nav.png) no-repeat; color: rgba(0,0,0,0);}
.cycle-pager span.cycle-pager-active {background: url(images/active.png) no-repeat;}

#caption { position: absolute; top: 25px; right: 25px; background: url(images/clear_90.png) repeat; padding: 10px; color: #333; z-index: 9999; width: 310px;}

#gallery { position: relative; display: block; width: 960px; margin: 0 auto;}
#gallery li { float: left; width: 300px; margin:10px;}

/************************************/
/************** FOOTER **************/

#footer {display: block; position: relative; width:960px; margin: 0 auto;}
.copyright { color: #ccc; padding: 10px 0 0 0; text-align: right;}
.copyright a { color: #999;}
.fazedesigns { font-size: 10px; color: #ccc; text-align: right;}
.fazedesigns a { color: #ccc;}
.fazedesigns a:hover { color: #000;}

/************************************/
/*********** SORTING TRANSITIONS ***********/

.isotope-item {z-index: 2;}
.isotope-hidden.isotope-item { pointer-events: none; z-index: 1;}
.isotope, .isotope .isotope-item {-webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s;}
.isotope {-webkit-transition-property: height, width; -moz-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width;}
.isotope .isotope-item {-webkit-transition-property: -webkit-transform, opacity; -moz-transition-property:-moz-transform, opacity; -o-transition-property:top, left, opacity; transition-property:transform, opacity;}
.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s;}

/************************************/
/*********** TEXT STYLING ***********/

h2.title { font-size: 36px; color: #000; padding: 0 0 10px 0;}
.text { line-height:1.5em; display:block; padding: 15px 0;}
.text p { padding:0 0 7px 0;}
.text ul { padding:0 0 7px 0;}
.text ul li { list-style:square; list-style-position:outside; margin:0 0 0 20px;}
.text ul.gap li { list-style:square; list-style-position:outside; margin:0 0 0 20px; padding: 0 0 10px 0;}
.text a {}
.text h6 { font-size:14px;}
.text h5 { font-size:16px;}
.text h4 { font-size:18px;}
.text h3 { font-size:24px;}
.text h2 { font-size:36px;}
.text h1 { font-size:42px;}
.text ul.contact_list li { list-style:none; margin:0; list-style-position:inside;}
.text ul li.ico_add {}
.text ul li.ico_ema { list-style-image:url(images/ico_ema.png); padding-top:5px;}
.text ul li.ico_pho { list-style-image:url(images/ico_pho.png);}
.text ul li.ico_mob { list-style-image:url(images/ico_mob.png);}
.text ul li.ico_fax { list-style-image:url(images/ico_fax.png);}

.text input[type="text"], .text input[type="password"], .text textarea {width:270px;}
.text textarea { height:70px;}
.text input[type="text"], .text textarea { margin:3px 0; padding:10px; background:#fff; color:#333; font-size:13px; border:1px solid #eee;}
.text input[type="text"]:focus, .text textarea:focus { border: 1px solid #666;}
.text input[type="submit"]{ margin: 5px 0; padding:5px 15px; border: none; color: #fff; font-size:13px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; cursor: pointer; background: #262626;}


/************************************/
/************ SHORTCODES ************/

.column_01 { width:25%;}
.column_02 { width:50%;}
.column_03 { width:75%;}
.column_04 { width:100%;}
.textrow {margin: 0 auto; overflow: hidden; position:relative; display:block;}
.textcolumn {float: left; display: inline;}
.paddingcol { padding:5px 10px 5px 0;}

ul.square li { list-style:square;}
ul.circle li { list-style:circle;}
ul.tick li { list-style-image:url(images/li_tick.png);}
ul.arrow li { list-style-image:url(images/li_arrow.png);}

.twothirdonethird { display:block; padding:5px 0;}
.twothird { float:left; width:60%;}
.onethird { float:right; width:35%; border-left:1px dotted #999; padding:0 0 0 10px;}

.dropcap { float:left; padding:5px; background:rgba(0,0,0,0.4); color:#fff; font-size:24px; text-transform:uppercase; font-family:"Times New Roman", Times, serif; margin:4px 5px 0 0;}
hr.line { margin:0 0; border:0; background:none; border-bottom:1px dotted #666;}
.highlight { padding:1px 3px 2px 3px; background:#438; color:#fff;}
.quotes { font-size:14px; font-style:italic;}
.quote { float:left; margin:4px 5px 0 -10px; width:40px; height:24px; font-family:Arial, Helvetica, sans-serif; font-size:90px; line-height:0.8em; letter-spacing:-0.09em;}

/************************************/
/************* COMMENTS *************/

.commentboxes .text { padding:20px;}
#commentform { display:block; padding:15px;}
#commentform input[type="text"] { width:200px;}
#commentform textarea { height:65px; width:430px;}
#comments {display:block;}
#comments h2 { font-size:18px; padding:15px; font-weight:bold;}
#comments ol { margin:0; padding:0 15px;}
#comments ol li { border-top:1px solid #ccc; padding:10px 20px;}
#comments ol li .quote {}
#comments ol li cite { font-size:10px; padding:10px 0; color:#999;}

/************************************/
/************ ALIGNMENTS ************/

.aligncenter { display: block; margin-left: auto; margin-right: auto; padding:10px 0;}
.wp-caption { border: 1px solid rgba(0,0,0,0.6); text-align: center; background-color:rgba(0,0,0,0.5); color:#fff; padding-top: 4px; margin-bottom: 10px; }
.wp-caption.alignleft { margin: 0px 10px 10px 0px; }
.wp-caption.alignright { margin: 0px 0px 10px 10px; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; }
.alignright { float: right; margin:0 0 10px 10px;}
.alignleft { float: left; margin:0 10px 10px 0;}
.textleft { float: left; margin: 0; padding: 0 10px 0 0;}
.shopterms { margin: 4px 0 0 0; padding: 0 !important;}
img.alignleft { display:inline; float:left; margin:2px 10px 0 0 !important;}
img.alignright { display:inline; float:right; margin:2px 0 0 10px !important;}

/************************************/
/************* PAGENAVI *************/

.wp-pagenavi { font-size:13px; margin:0 auto; background:#fff; padding:10px; text-align:right; display: block;}
#pagenavs a, #pagenavs a:link, #pagenavs span.pages, #pagenavs span.current, #pagenavs span.extend {margin:10px 3px; padding:5px 15px; border: none; color: #666; font-size:13px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; cursor: pointer;
background: #ebe6dd url(images/bg.jpg) repeat;}
#pagenavs a:hover, #pagenavs a:link:hover, #pagenavs span.current:hover {}
#pagenavs span.current {background: #325176 url(images/bg_menu.jpg) repeat; color: #fff;}
#pagenavs span.pages, #pagenavs span.extend { cursor:text;}

/************************************/
/********** CONTACT FORM 7 **********/

.wpcf7-form .wpcf7-validation-errors{ border:none;  background-color:#ca3400; color: #fff;  margin:0;  padding:7px; -webkit-border-radius:3px; -moz-border-radius:3px;  border-radius:3px}
.wpcf7-form .wpcf7-mail-sent-ok{ border:none;  background-color:#92a800; color: #fff;  margin:0;  padding:7px; -webkit-border-radius:3px; -moz-border-radius:3px;  border-radius:3px}
.wpcf7-form .wpcf7-mail-sent-ng{ border:none;  background-color:#ca3400; color: #fff;  margin:0;  padding:7px; -webkit-border-radius:3px; -moz-border-radius:3px;  border-radius:3px}
.wpcf7-form span.wpcf7-not-valid-tip{ border:none;  background-color:#ca3400; color: #fff;  padding:7px; -webkit-border-radius:3px; -moz-border-radius:3px;  border-radius:3px}

/************************************/
/************* END CSS! *************/