/*
* FOCUS V.1
* Copyright 2012, Mandar Shirke
* www.quadcodes.com
* DATE : 22/4/2012
*/

/* Table of Contents
==================================================
    
	1. BODY
	2. TOP BAR, TOP CONTENT & HEADER
	3. HOME INTRO MODULES
		3.1 AJAX PORTFOLIO DOOR
		3.2 FILTERABLE PORTFOLIO	
		3.3 PROJECT CASE STUDY
	4. BASIC PAGE LAYOUT & BLOG
	5. WIDGET AREA
	6. WIDGETS
		6.1 EVENTS & SOCIAL
		6.2 FLICKR
		6.3 DRIBBBLE
		6.4 SOCIAL PROFILES
	7. PAGE NEVIGATION
	8. FOOTER AREA
	9. TYPOGRAPHY
	10. GALLERY HOVERABLE
	11. COMMENTS
	12. AWESOME BUTTONS
	13. MISCELLENEOUS
	14. CONDITIONAL LAYOUT CSS FOR MOBILE / TABLET DEVICES [ MEDIA QUERIES ]
	

/* CSS Styles
================================================== */

/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	1. BODY  */
/* --------------------------------------------------------------------------------------------------------------------------- */

body                                    {
                                            font: 11px/18px 'Arial', sans-serif;
                                            background: #fff url('../img/theme/bg_lines.png') -180px 0 no-repeat;
                                        }
#qcTopFixedBorder                       {
                                            position: relative;
                                            width: 100%;
                                            border-top: 4px #C84D50 solid;
                                            z-index: 999;
                                        }
#qcUW                                   { }



/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	2. TOP BAR, TOP CONTENT & HEADER */
/* --------------------------------------------------------------------------------------------------------------------------- */

#qcTopFixed                             {
                                            position: relative;
                                            margin: 0 auto;
                                            z-index: 999;
                                        }
#qcTopFixedInset                        { background: url('../img/theme/bg_lines.pn') -180px 0 }
#qcTopbar                               { }
#qcTopContent                           {
                                            position: relative;
                                            padding: 0 20px;
                                            background: #000;
                                        }
#qcTopContentInset                      {
                                            position: relative;
                                            padding: 20px 0;
                                            margin-bottom: 0;
                                            display: none;
                                            color: #ddd;
                                            text-shadow: none;
                                        }
#qcTopTrigger                           {
                                            position: absolute;
                                            right: 0px;
                                            width: 32px;
                                            height: 26px;
                                            font: 400 20px/20px 'Open Sans', sans-serif;
                                            color: #FFFFFF;
                                            background: #C84D50;
                                            text-shadow: none;
                                            cursor: pointer;
                                            text-align: center;
                                            z-index: 9999;
                                        }
#qcHeader                               {
                                            position: relative;
                                            padding: 20px 0;
                                            
                                        }
#qcLogo                                 { float: left }
#qcNavigation                           {
                                            float: right;
                                            position: relative;
                                            top: 20px;
                                            right: 20px;
                                        }
#qcCenter                               { }
ul#qcPrimaryMenu                        {
                                            position: relative;
                                            top: -3px;
                                            font: 400 12px/16px 'Open Sans', sans-serif;
                                        }
ul#qcPrimaryMenu li:last-child          { border-right: 0 }
ul#qcPrimaryMenu li.current a           { color: #C84D50 }
ul#qcPrimaryMenu li.current ul li a     { color: #666 }
ul#qcPrimaryMenu li.current ul li a:hover
                                        { color: #C84D50 }
#qcHomeHeading                          {
                                            padding: 25px 0 0 0;
                                            font: 600 30px/55px 'Open Sans', sans-serif;
                                            color: #424242;
                                            text-align: center;
                                            text-transform: uppercase;
                                            border-top: 1px #ccc dotted;
                                        }
#qcHomeSubHeading                       {
                                            padding: 5px 0 15px 0;
                                            font: 300 13px/18px 'Open Sans', sans-serif;
                                            color: #000;
                                            text-align: center;
                                        }


                                        
/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	3. HOME INTRO MODULES   */
/* --------------------------------------------------------------------------------------------------------------------------- */

#qcIntroModule                          { padding: 25px 0 }

/* === 3.1 AJAX PORTFOLIO DOOR === */

#qcProjectDoor                          {
                                            position: relative;
                                            display: none;
                                            border-top: 1px #bbb dotted;
                                            z-index: 99;
                                        }
#qcProjectFullData                      { margin-top: 25px }
#qcProject                              { border-top: 1px #bbb dotted }
#qcProjectDoorWrapper                   { }
#qcAjaxPortfolio                        { padding: 0 0 50px 0 }
#qcAjaxNav,
#qcPostNav                              {
                                            float: right;
                                            position: relative;
                                            top: -1px;
                                            text-align: center;
                                            color: #fff;
                                            font: 600 10px/20px 'Open Sans', sans-serif;
                                            cursor: pointer;
                                        }
#qcAjaxNav                              { margin-bottom: 27px }
#qcAjaxPrev,
#qcPostPrev                             {
                                            float: right;
                                            padding: 0px 8px 1px 8px;
                                            margin-right: 2px;
                                            color: #fff;
                                            background: #85c902;
                                            transition: all .2s linear;
                                            -o-transition: all .2s linear;
                                            -moz-transition: all .2s linear;
                                            -webkit-transition: all .2s linear;
                                        }
#qcAjaxNext,
#qcPostNext                             {
                                            float: right;
                                            padding: 0px 8px 1px 8px;
                                            margin-right: 3px;
                                            color: #fff;
                                            background: #85c902;
                                            transition: all .2s linear;
                                            -o-transition: all .2s linear;
                                            -moz-transition: all .2s linear;
                                            -webkit-transition: all .2s linear;
                                        }
#qcAjaxClose                            {
                                            float: right;
                                            padding: 0px 8px 1px 8px;
                                            margin-right: 10px;
                                            color: #fff;
                                            background: #00a7d1;
                                            transition: all .2s linear;
                                            -o-transition: all .2s linear;
                                            -moz-transition: all .2s linear;
                                            -webkit-transition: all .2s linear;
                                        }
#qcAjaxPrev:hover,
#qcAjaxNext:hover,
#qcPostPrev:hover,
#qcPostNext:hover                       {
                                            color: #fff;
                                            border: 0;
                                            background: #666;
                                        }
#qcAjaxClose:hover                      {
                                            color: #fff;
                                            border: 0;
                                            background: #e90f17;
                                        }
.qcAjaxPortfolioImage                   {
                                            position: relative;
                                            left: -5px;
                                            width: 100%;
                                            display: block;
                                        }
.qcAjaxPortfolioImageWrapper            {
                                            padding: 0 7px;
                                            margin: 1px 0;
                                        }
.qcAjaxPortfolioImageWrapper iframe     {
                                            padding: 2px;
                                            border: 1px #ddd solid;
                                        }
.qcAjaxPortfolioImage img               {
                                            width: 100%;
                                            position: relative;
                                            display: block;
                                        }
.qcAjaxPortfolioContent                 {
                                            position: relative;
                                            left: 0px;
                                        }
.qcContentWrapper                       { }
.qcHeadTitle                            {
                                            font: 600 12px/20px 'Open Sans', sans-serif;
                                            color: #fff;
                                            display: block;
                                            padding: 8px 8px 8px 20px;
                                            background: #C84D50 url('../img/theme/tarr.png') no-repeat left center;
                                            text-transform: uppercase;
                                        }
ul.qcPortfolioFields                    { margin: 20px 15px }
ul.qcPortfolioFields li                 {
                                            margin-bottom: 5px;
                                            color: #666;
                                        }
ul.qcPortfolioFields li span            {
                                            display: inline-block;
                                            background: #ddd;
                                            padding: 1px 4px;
                                            margin: 2px 1px;
                                        }
.qcProjectLink                          {
                                            border-top: 1px #ccc dotted;
                                            text-align: center;
                                        }
.qcProjectLink a                        {
                                            margin: 0;
                                            padding: 0;
                                        }
.qcProjectLink a:hover                  { border-bottom: 0 }
a.qcQuickView                           {
                                            display: inline-block;
                                            width: 137px;
                                            height: 80px;
                                            background: url('../img/theme/qcProjectLink.png') no-repeat 0 0;
                                            border-right: 1px #ccc dotted;
                                        }
a.qcQuickView:hover                     { background: url('../img/theme/qcProjectLink.png') no-repeat 0 -80px }
a.qcCaseStudy                           {
                                            display: inline-block;
                                            width: 137px;
                                            height: 80px;
                                            background: url('../img/theme/qcProjectLink.png') no-repeat -140px 0;
                                        }
a.qcCaseStudy:hover                     { background: url('../img/theme/qcProjectLink.png') no-repeat -140px -80px }

/* === 3.2 FILTERABLE PORTFOLIO === */

#qcFilterablePortfolio                  { }
#qcFilterableNav                        {
                                            padding: 10px 0;
                                            margin-bottom: 35px;
                                            background: url('../img/theme/sort.png') no-repeat 15px 4px;
                                            border-top: 1px #ccc dotted;
                                            border-bottom: 1px #ccc dotted;
                                        }
#qcFilterableNav li                     {
                                            display: inline;
                                            padding: 2px 12px;
                                            font: 600 11px/16px 'Open Sans', sans-serif;
                                            text-align: center;
                                            text-transform: uppercase;
                                        }
#qcFilterableNav li a                   { color: #000 }
#qcFilterableNav li a:hover             { color: #FF9933 }
#qcFilterableNav li:last-child          { border: 0 }
#qcFilterableNav li.filter-tab          {
                                            color: #fff;
                                            padding: 2px 12px;
                                            margin: 0 15px 0 38px;
                                            background: #797979;
                                            border-right: 0;
                                            -moz-border-radius-topright: 10px;
                                            -moz-border-radius-bottomright: 10px;
                                            -webkit-border-top-right-radius: 10px;
                                            -webkit-border-bottom-right-radius: 10px;
                                            border-top-right-radius: 10px;
                                            border-bottom-right-radius: 10px;
                                        }
#qcFilterableNav li.active-tag          {
                                            background: #FF9900;
                                            -moz-border-radius: 10px;
                                            -webkit-border-radius: 10px;
                                            border-radius: 10px;
                                        }
#qcFilterableNav li.active-tag a        { color: #fff }
.qcFilterableWrapper                    {
                                            margin: 20px 0;
                                           /* background: #eee url('../img/placeholder/bfc4.png');
                                            -moz-box-shadow: inset 1px 0px 8px #ccc;
                                            -webkit-box-shadow: inset 1px 0px 8px #ccc;
                                            box-shadow: inner 1px 0px 8px #ccc;*/
                                        }
.qcFilterableItem                       {
                                            float: left;
                                            width: 240px;
                                            height: 200px;
                                            list-style: none;
                                            margin: 0;
                                            padding: 0;
                                            position: relative;
                                            overflow: hidden;
                                            background: #fff url('../img/theme/loader.gif') no-repeat center 58%;
                                        }
.qcProjectOverlay.video                 {
                                            display: none;
                                            position: absolute;
                                            width: 100%;
                                            height: 38px;
                                            right: 0px;
                                            background: url('../img/theme/ico-video.png') no-repeat 95% center;
                                            top: 0;
                                            left: 0;
                                            z-index: 999;
                                        }
.qcProjectOverlay.gallery               {
                                            display: none;
                                            position: absolute;
                                            width: 100%;
                                            height: 38px;
                                            top: 0;
                                            right: 0;
                                            background: url('../img/theme/ico-gallery.png') no-repeat 95% center;
                                            z-index: 999;
                                        }
.qcFilterableItem a,
.qcFilterableItem a:hover               { color: #fff }
.qcFilterableItem h2                    {
                                            position: absolute;
                                            width: 500%;
                                            overflow: hidden;
                                            padding: 10px;
                                            font: 600 11px/18px 'Open Sans', sans-serif;
                                            background: #000;
                                            text-transform: uppercase;
                                            z-index: 99;
                                        }
.qcFilterableItem:hover h2,
.qcFilterableItem.active h2             { background: #C84D50 }
.qcFilterableItem a:hover               {
                                            text-decoration: none;
                                            border: 0;
                                        }
.qcFilterableItem img                   {
                                            display: block;
                                            position: relative;
                                            top: 38px;
                                            width: 240px;
                                            height: 162px;
                                            z-index: 99;
                                            opacity: 0;
                                        }
.qcTitleGradient                        {
                                            background: url("../img/theme/gradient.png") repeat scroll 0 0 transparent;
                                            height: 38px;
                                            position: absolute;
                                            top: 0;
                                            right: 0;
                                            width: 55px;
                                            z-index: 99;
                                        }
.qcFilterableItem.active .qcTitleGradient,
.qcTitleGradient.hover                  { background: url("../img/theme/gradient.png") repeat scroll 0 -38px transparent }
.qcFilterableItem.active .qcProjectOverlay.video,
.qcFilterableItem.active .qcProjectOverlay.gallery
                                        { display: block }
#qcClients                              {
                                            position: relative;
                                            width: 100%;
                                            padding: 10px 0 0 0;
                                            margin-top: 40px;
                                            border-top: 1px #ccc dotted;
                                        }
#qcClientsList    li                       {
                                            float: left;
                                            list-style: none;
                                            margin: 0;
                                            background: #f2f2f2;
                                            text-align: center;
                                        }
.qcItemData                             { display: none }

/* === 3.3 PROJECT CASE STUDY === */

h1#qcPageHeading                        {
                                            padding: 25px 0 0 0;
                                            font: 400 26px/40px 'Open Sans', sans-serif;
                                            color: #888;
                                            text-align: left;
                                            text-transform: uppercase;
                                        }
.qcHeadTitle.grey                       { background-color: #C84D50 }
#qcBreadcrumb                           {
                                            padding: 12px 0 5px 0;
                                            font: italic 14px/18px 'Times New Roman', sans-serif;
                                            border-bottom: 1px #ccc dotted;
                                        }
#qcBreadcrumb strong                    { font: 600 11px/18px 'Open Sans', sans-serif }
#qcBreadcrumb a                         { color: #888 }
#qcPostNext                             { margin: 0 10px 0 2px }
#qcBackNav                              {
                                            float: left;
                                            position: relative;
                                            top: -1px;
                                            text-align: center;
                                            color: #fff;
                                            font: 600 10px/20px 'Open Sans', sans-serif;
                                            cursor: pointer;
                                        }
#qcPostBack                             {
                                            padding: 4px 10px 5px 10px;
                                            margin-left: 10px;
                                            color: #fff;
                                            background: #00a7d1;
                                            transition: all .2s linear;
                                            -o-transition: all .2s linear;
                                            -moz-transition: all .2s linear;
                                            -webkit-transition: all .2s linear;
                                        }
#qcPostBack:hover                       {
                                            color: #fff;
                                            border: 0;
                                            background: #666;
                                        }
.entry                                  { padding: 10px }



/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	4. BASIC PAGE LAYOUT & BLOG  */
/* --------------------------------------------------------------------------------------------------------------------------- */

#qcMainContentWrapper                   {
                                            position: relative;
                                            padding: 40px 0 30px 0;
                                            margin: 25px 0;
                                            border-top: 1px #ccc dotted;
                                        }
#qcMainContent                          {
                                            float: left;
                                            width: 610px;
                                            padding-right: 20px;
                                        }
#qcPostNextPrev                         {
                                            position: relative;
                                            top: -40px;
                                        }
#qcSidebar                              {
                                            float: left;
                                            width: 309px;
                                            padding-left: 20px;
                                        }
.qcBlogEntry                            {
								    position: relative;
                                            margin-bottom: 80px;
                                            border: 1px #ddd solid;
                                            overflow: hidden;
                                        }
.qcBlogEntry.entry                      { padding: 0 }
.qcBlogEntry.qcSinglePost               {
                                            -moz-box-shadow: none;
                                            -webkit-box-shadow: none;
                                            box-shadow: none;
                                            margin-bottom: 40px;
                                            border: 0;
                                        }
.qcBlogEntry:last-child                 { margin-bottom: 0 }
.qcBlogEntry img                        { display: block }
.hover-post-format                      {
                                            float: left;
                                            width: 100px;
                                            height: 50px;
                                            border-right: 1px #666 solid;
                                        }
.hover-post-format span                 {
                                            position: relative;
                                            top: -7px;
                                            font-family: Arial;
                                            font-size: 9px;
                                            text-shadow: none;
                                            color: #fff;
                                        }
.hover-post-format-text                 {
                                            font-family: Arial;
                                            font-size: 10px;
                                            text-shadow: none;
                                            color: #fff;
                                            width: 100px;
                                            border-right: 1px #ccc solid;
                                            text-align: center;
                                            padding-top: 4px;
                                            float: left;
                                            margin-top: -4px;
                                            text-transform: uppercase;
                                        }
.hover-post-meta                        {
                                            padding: 5px 0;
                                            text-shadow: none;
                                        }
.hover-post-metas                       {
                                            float: left;
                                            font-family: Arial;
                                            font-size: 10px;
                                            padding-right: 4px;
                                            border-right: 1px #ccc solid;
                                        }
.hover-post-meta-like                   {
                                            float: left;
                                            height: 18px;
                                            margin: 1px 5px;
                                            color: #fff;
                                            text-indent: 22px;
                                            text-decoration: none;
                                            background: url('../img/theme/sprite.png') 0px -54px no-repeat;
                                        }
.hover-post-meta-like:hover             {
                                            color: #ff0000;
                                            background: url('../img/theme/sprite.png') 0px -72px no-repeat;
                                            border: 0;
                                        }
.hover-post-meta-comment                {
                                            float: left;
                                            height: 18px;
                                            margin: 1px 5px;
                                            color: #fff;
                                            text-indent: 24px;
                                            text-decoration: none;
                                            background: url('../img/theme/sprite.png') 0px -90px no-repeat;
                                        }
.hover-post-meta-comment:hover          {
                                            color: #fff;
                                            border: 0;
                                            background: url('../img/theme/sprite.png') 0px -108px no-repeat;
                                        }
.hover-post-meta-date                   {
                                            float: left;
                                            height: 18px;
                                            margin: 1px 5px;
                                            color: #fff;
                                            text-indent: 24px;
                                            text-decoration: none;
                                            background: url('../img/theme/sprite.png') 0px -126px no-repeat;
                                        }
.hover-post-meta-date:hover             {
                                            color: #fff;
                                            border: 0;
                                            background: url('../img/theme/sprite.png') 0px -144px no-repeat;
                                        }
.hover-post-format-icon                 {
                                            position: relative;
                                            left: 42px;
                                            top: 19px;
                                            float: left;
                                            width: 18px;
                                            height: 18px;
                                        }
.hover-post-title                       {
                                            float: left;
                                            padding-left: 15px;
                                        }
.hover-post-head                        {
                                            position: relative;
                                            background: #222;
                                            padding: 10px 0 0 0;
                                            overflow: hidden;
                                        }
.hover-post-metas.last                  { border: 0 }
.text-gradient-blog                     {
                                            position: absolute;
                                            width: 40px;
                                            height: 60px;
                                            right: 0px;
                                            background: url('../img/theme/gradient-blog.png');
                                            z-index: 99;                                            
                                        }
.blog-meta                              {
                                            position: relative;
                                            background-color: #C84D50;
                                        }
.blog-meta .pf-heading                  {
                                            position: absolute;
                                            width: 100%;
                                            color: #FFFFFF;
                                            overflow: hidden;
                                            font: 600 14px/42px 'Open Sans',sans-serif;
                                            text-transform: uppercase;
                                        }
.blog-meta .pf-heading a                {
                                            position: relative;
                                            color: #FFFFFF;
                                        }
.blog-meta .pf-heading a:hover          {
                                            color: #C84D50;
                                            border: 0;
                                        }
.qcPostPreview img                      {
                                            width: 100%;
                                            position: relative;
                                            z-index: 9;
                                        }
.qcPostPreview img:hover                {
                                            width: 100%;
                                            opacity: 0.9;
                                        }
.pf-gallery                             { background: url('../img/theme/sprite.png') 0px -162px }
.pf-link                                { background: url('../img/theme/sprite.png') 0px -180px }
.pf-image                               { background: url('../img/theme/sprite.png') 0px -198px }
.pf-quote                               { background: url('../img/theme/sprite.png') 0px -216px }
.pf-status                              { background: url('../img/theme/sprite.png') 0px -234px }
.pf-video                               { background: url('../img/theme/sprite.png') 0px -252px }
.pf-audio                               { background: url('../img/theme/sprite.png') 0px -270px }
.pf-standard                            { background: url('../img/theme/sprite.png') 0px -288px }



/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	5. WIDGET AREA */
/* --------------------------------------------------------------------------------------------------------------------------- */

#qcTopbar .widget                       { border-right: 0 }
#qcTopContentInset .widget              {
                                            height: auto;
                                            margin-bottom: 0;
                                            padding-bottom: 0;
                                        }
#qcSidebar .widget                      {
                                            position: relative;
                                            top: -10px;
                                            height: auto;
                                            margin: 30px 0;
                                            border-top: 1px #ccc dotted;
                                            border-right: 0;
                                        }
#qcWidgetsWrapper                       {
                                           /* padding-bottom: 60px;*/
                                            margin-top: 40px;
                                            background: #333 url('../img/theme/darkdenim3.png');
                                        }
#qcWidgets                              {
                                            color: #eee;
                                            background: #000;
                                            -moz-box-shadow: 0 6px 12px #111;
											height:420px;
                                        }
.qcInnerWrapper                         { padding: 20px;
										  font-size:10px;
										 }
.qcInnerWrapper a                       { color: #C84D50 }
#qcWidgetIntro                          {
                                            padding: 10px 0 27px 0;
                                            font: 12px/24px 'Arial', Sans-serif;
                                            text-align: center;
                                            border-bottom: 1px #444 dotted;
                                        }
#qcWidgetBox                            {
                                            margin-top: 0px;
                                            padding: 10px 0 0 0;
                                        }
.widget                                 {
                                            float: left;
                                            width: 285px;
                                            height: 150px;
                                            margin: 35px 0;
                                            list-style: none;
                                            padding: 20px 10px;
                                            position: relative;
                                            border-top: 1px #333 dotted;
                                            border-right: 1px #333 dotted;
                                        }
.qcWidgetTitle                          {
                                            position: absolute;
                                            top: -22px;
                                            left: 0px;
                                            padding: 2px 8px;
                                            font: 600 9px/18px 'Open Sans', sans-serif;
                                            color: #fff;
                                            background: #333;
                                        }
.qcWidgetTitleactive                    { background: #C84D50 }
.qcWidgetArrow                          {
                                            position: absolute;
                                            top: 0px;
                                            right: -22px;
                                            width: 22px;
                                            height: 22px;
                                            background: #C84D50;
                                            text-align: center;
                                        }
                                        
                                        
                                                                               
/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	6. WIDGETS */
/* --------------------------------------------------------------------------------------------------------------------------- */

/* === 6.1 EVENTS & SOCIAL === */

.qcEvents,
#qcSocial                               { list-style: none }
.qcEvents li,
#qcSocial li                            {
                                            padding: 10px 0;
                                            border-bottom: 0px #333 dotted;
                                        }
.qcEvents li:first-child,
#qcSocial li:first-child                { padding: 0 0 10px 0 }
.qcEventTime,
.qcSocialIcon                           {
                                            float: left;
                                            width: 50px;
                                            margin-right: 10px;
                                            border-right: 1px #444 dotted;
                                        }
.qcSocialIcon                           {
                                            height: 35px;
                                            text-align: center;
                                        }
.qcSocialIcon.facebook                  { background: url('../img/theme/facebook-ico.png') no-repeat center center }
.qcSocialIcon.twitter                   { background: url('../img/theme/twitter-ico.png') no-repeat center center }
.qcSocialIcon.dribbble                  { background: url('../img/theme/dribbble-ico.png') no-repeat center center }
.qcEventDate                            {
                                            font: 600 20px/20px 'Open Sans', sans-serif;
                                            text-align: center;
                                        }
.qcEventMonth                           {
                                            font: 300 9px/18px 'Open Sans', sans-serif;
                                            text-align: center;
                                        }
                                        
/* === 6.2 FLICKR === */

#flickr                                 { margin: 12px 0 0 15px }
#flickr li                              {
                                            list-style: none;
                                            float: left;
                                            margin: 0 6px 6px 0;
                                            border: 1px #333 solid;
                                        }
#flickr li img                          {
                                            display: block;
                                            width: 55px;
                                        }
#flickr li:hover                        { border: 1px #fff solid }

/* === 6.3 DRIBBBLE === */

#shotsByPlayerId                        { margin: 12px 0 0 23px }
#shotsByPlayerId li                     {
                                            list-style: none;
                                            float: left;
                                            margin: 0 6px 6px 0;
                                        }
#shotsByPlayerId li img                 {
                                            display: block;
                                            width: 74px;
                                            border: 1px #333 solid;
                                        }
#shotsByPlayerId li img:hover           { border: 1px #fff solid }

/* === 6.4 SOCIAL PROFILES === */

#qcSocialProfiles                       { margin-left: 5px }
#qcSocialProfiles li                    {
                                            list-style: none;
                                            float: left;
                                            margin: 0 8px 8px 0;
                                        }
#qcSocialProfiles li a:hover            { border: 0 }
                                           
                                        
                                        
/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	7. PAGE NEVIGATION */
/* --------------------------------------------------------------------------------------------------------------------------- */

.page-navigation                        {
                                            position: relative;
                                            top: -10px;
                                            background: #fff;
                                            width: 96%;
                                            padding: 5px 10px;
                                            border-top: 1px #ccc dotted;
                                            border-bottom: 1px #ccc dotted;
                                        }
.pagenavi                               {
                                            color: #000;
                                            float: left;
                                            font-size: 11px;
                                            font-weight: bold;
                                            text-align: right;
                                            width: 88%;
                                            text-transform: uppercase;
                                        }
.pagenavi a,
.pagenavi a:link,
.pagenavi a:visited,
.pagenavi a:active                      {
                                            border-right: 1px #ccc dotted;
                                            color: #777;
                                            font-weight: normal;
                                            padding: 0 10px 0 6px;
                                            text-decoration: none;
                                        }
.pagenavi a:hover                       {
                                            color: #000;
                                            border-bottom: 0;
                                        }
.pagenavi span.pages                    { float: left }
.pagenavi span.current                  {
                                            border-right: 1px #ccc dotted;
                                            color: #777;
                                            padding: 0 8px 0 6px;
                                        }
.pagenavi span.extend                   {
                                            border-right: 1px #ccc dotted;
                                            padding: 0 8px 0 5px;
                                        }
.nav-previous a                         {
                                            background: #eee url("../img/theme/sprite.png") no-repeat scroll 1px -322px;
                                            float: right;
                                            height: 20px;
                                            width: 20px;
                                            margin: 1px 3px 0 0;
                                        }
.nav-next a                             {
                                            background: #eee url("../img/theme/sprite.png") no-repeat scroll 1px -340px;
                                            float: right;
                                            height: 20px;
                                            width: 20px;
                                            margin: 1px 0 0 0;
                                        }
.nav-previous a:hover,
.nav-next a:hover                       {
                                            background-color: #ccc;
                                            border-bottom: 0;
                                        }
.inactive a                             { background-image: none }
.inactive a:hover                       { background: #eee }



/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	8. FOOTER AREA  */
/* --------------------------------------------------------------------------------------------------------------------------- */

#qcPrimaryFooter                        {
                                            padding: 20px 0;
                                            color: #ddd;
                                            background: #222;
                                        }
#qcFooterMenu                           { float: left }
#qcFooterMenu li                        {
                                            float: left;
                                            padding: 0 15px;
                                            list-style: none;
                                            border-right: 1px #555 dotted;
                                        }
#qcFooterMenu li:first-child            { padding-left: 0 }
#qcFooterMenu li:last-child             { border: 0 }
#qcFooterMenu li a,
#qcCopyrights a                         { color: #fff }
a#qcScrollTop                           {
                                            display: block;
                                            position: absolute;
                                            bottom: -22px;
                                            right: 0px;
                                            padding: 0 10px;
                                            font: 300 10px/22px 'Open Sans', sans-serif;
                                            color: #fff;
                                            background: #C84D50;
                                        }
a#qcScrollTop:hover                     {
                                            color: #fff;
                                            border: 0;
                                        }
#qcCopyrights                           {
                                            float: right;
                                            margin-bottom: 0;
                                            color: #888;
                                        }
                                        

                                        
/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	9. TYPOGRAPHY  */
/* --------------------------------------------------------------------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6                       {
                                            font-family: 'Open Sans', sans-serif;
                                            font-weight: 600;
                                        }
.qcLine                                 {
                                            border-top: 0;
                                            border-right: 0;
                                            border-bottom: 1px #bbb dotted;
                                            border-left: 0;
                                            margin-bottom: 20px;
                                        }
strong                                  { color: #000 }
p                                       { margin-bottom: 20px }
a                                       {
                                            color: #000;
                                            text-decoration: none;
                                            transition: all .3s linear;
                                            -o-transition: all .3s linear;
                                            -moz-transition: all .3s linear;
                                            -webkit-transition: all .3s linear;
                                        }
#qcAjaxData a                           {
                                            transition: all 0 linear;
                                            -o-transition: all 0 linear;
                                            -moz-transition: all 0 linear;
                                            -webkit-transition: all 0 linear;
                                        }
h5 a                                    { border-bottom : 1px #000 dotted }
.sf-menu li a:hover,
a:hover,
ul#qcPrimaryMenu li a.current,
#qcBreadcrumb a:hover,
#qcFooterMenu li a:hover,
#qcCopyrights a:hover,
.qcPostTitle h2 a:hover,
.qcPostMetaLinks li a:hover             {
                                            color: #C84D50;
                                            border-bottom : 1px #C84D50 dotted;
                                        }
.qcPostMetaLinks li a:hover             {
                                            background: #fff;
                                            color: #666;
                                            border-bottom: 0;
                                        }
.qcBold                                 { color: #444 }
.qcExerpt                               { padding: 20px 20px 0 20px }
#qcLogo a:hover,
.sf-menu li a:hover,
.sf-menu li ul li a.sf-with-ul:hover,
.hoverable a:hover,
h4.toggle-trigger a:hover               {
                                            border: 0;
                                            text-decoration: none;
                                        }
.read-more                              {
                                            display: block;
                                            width: 80px;
                                            margin-top: 15px;
                                            color: #C84D50;
                                            border-bottom: 1px transparent dotted;
                                        }
#qcTopbar .widget a                     { color: #C84D50 }
.quote-heading                          {
                                            background: url('../img/theme/quote-icon.png') no-repeat scroll 0 20px transparent;
                                            color: #333;
                                            font-family: arvo;
                                            font-size: 16px;
                                            font-weight: normal;
                                            line-height: 28px;
                                            margin: 20px 20px 0 20px;
                                            padding: 20px 40px 10px 40px;
                                            text-transform: none;
                                        }
.blog-pf-link                           { margin: 25px 20px 0 20px }
.widget .blog-pf-link                   { margin: 0 0 20px 0 }
.clinkable                              {
                                            height: 20px;
                                            background: #000;
                                            text-shadow: none;
                                            padding: 0px 8px;
                                            font-family: Courier;
                                            font-size: 12px;
                                        }
.clinkable a                            {
                                            text-decoration: none;
                                            color: #fff;
                                        }
.clinkable a:hover                      { border: 0 }
td.linkmage                             {
                                            background: #000;
                                            padding-right: 8px;
                                        }
img.linkmage                            {
                                            position: relative;
                                            top: 1px;
                                        }
.absolute-text                          {
                                            height: 20px;
                                            overflow: hidden;
                                            border: 1px #ddd solid;
                                            font-family: Courier;
                                            font-size: 12px;
                                            padding: 2px 8px 0 8px;
                                            background: #fff;
                                        }
.qcContentText                          { margin: 30px 0 }
.dropcap                                {
                                            font-size: 30px;
                                            margin: 0 3px 5px 0;
                                            text-transform: uppercase;
                                        }
blockquote p                            {
                                            font-size: 11px;
                                            font-style: italic;
                                            line-height: 18px;
                                            padding-left: 10px;
                                            border-left: 1px #ddd solid;
                                        }
.nano                                   {
                                            font-size: 9px;
                                            text-transform: uppercase;
                                        }
.nano a                                 {
                                            color: #bbb;
                                            text-decoration: none;
                                        }
  

  
/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	10. GALLERY HOVERABLE   */
/* --------------------------------------------------------------------------------------------------------------------------- */

.hoverable                              { position: relative }
.hoverable .hoverable-over              {
                                            position: absolute;
                                            top: 0px;
                                            left: 0px;
                                            width: 100%;
                                            height: 100%;
                                            margin: 0;
                                            padding: 0;
                                            background: url('../img/theme/zoom.png') no-repeat center center;
                                            z-index: 1;
                                        }
.hoverable .hoverable-link              {
                                            position: relative;
                                            z-index: 2;
                                        }
.hoverable img                          {
                                            position: relative;
                                            z-index: 99;
                                            overflow: hidden;
                                            margin: 0;
                                            opacity: 1;
                                            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
                                            filter: alpha(opacity=100);
                                            background: transparent !important;
                                            -webkit-transition: opacity 0.4s linear;
                                            -o-transition: opacity 0.4s linear;
                                            -moz-transition: opacity 0.4s linear;
                                        }
.hoverable a:hover img                  {
                                            opacity: 0.1;
                                            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
                                            filter: alpha(opacity=10);
                                            -webkit-transition: opacity 0.4s linear;
                                            -o-transition: opacity 0.4s linear;
                                            -moz-transition: opacity 0.4s linear;
                                        }
.hoverable:hover                        { background: #fff url('../img/theme/transparency.png') }

/* === GALLERY COLUMN === */

.gallery-column                         {
                                            background: #ddd;
                                            border: 1px #ddd solid;
                                            width: 278px;
                                            height: 202px;
                                            float: left;
                                            display: block;
                                            margin: 10px;
                                            padding: 2px;
                                            background: #fff;
                                            overflow: hidden;
                                        }
.gallery-mask                           { height: 195px }
.gallery-column .masky                  {
                                            background-color: rgba(255, 255, 255, 1);
                                            background-color: white\9;
                                            height: 65px;
                                        }
.gallery-column img                     { width: 100% }
.hover-gallery-title                    { float: none }
.gallery-heading                        {
                                            text-shadow: none;
                                            color: #fff;
                                            font-size: 12px;
                                            padding: 0 0 0 15px;
                                        }
.hover-gallery-head                     {
                                            background: #222;
                                            padding: 0;
                                            position: absolute;
                                            width: 400px;
                                            overflow: hidden;
                                            height: 40px;
                                            border-bottom: 1px #333 dotted;
                                        }
.gallery-column .text-gradient          { height: 40px }
p.gallery-text                          {
                                            margin: 42px 0 0 0;
                                            padding: 0 15px;
                                        }
                                        


/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	11. COMMENTS   */
/* --------------------------------------------------------------------------------------------------------------------------- */

.comment-box                            { border: 1px #ddd solid }
.comment-box h6                         {
                                            text-align: center;
                                            font-size: 13px;
                                            padding: 12px 0;
                                        }
#comments                               {
                                            position: relative;
                                            padding: 20px;
                                            background: #fbfbfb;
                                            border-top: 1px #ddd solid;
                                            border-bottom: 1px #ddd solid;
                                        }
#comments h3                            {
                                            color: #333;
                                            font-weight: normal;
                                            margin-bottom: 20px;
                                        }
#comments .comment.thread-even          { border-bottom: 1px dashed #dedede }
#comments .comment.bypostauthor         { }
ol.commentlist                          { }
ol.commentlist li                       { margin: 10px 0 }
#comments .comment                      {
                                            border-top: 1px dashed #dedede;
                                            width: 100%;
                                            list-style-type: none;
                                        }
#comments .comment.depth-1:first-child  { border: none }
#comments .comment.depth-1:last-child   { border-bottom: none }
#comments .comment .comment-container   {
                                            position: relative;
                                            padding: 20px 0 0 0;
                                        }
#comments .comment-head                 { margin: 0 0 15px 50px }
#comments .comment-entry                { margin: 0 0 0 50px }
#comments .avatar                       {
                                            float: left;
                                            margin-right: 20px;
                                        }
#comments .avatar img                   {
                                            margin: 0;
                                            vertical-align: middle;
                                            padding: 3px;
                                            border: 1px solid #c2c5ca;
                                            background: #fff;
                                            -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
                                            -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
                                            box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
                                        }
#comments .comment-head .name           {
                                            margin: 0;
                                            font-weight: bold;
                                            font-size: 13px;
                                        }
#comments .comment-head .date,
#comments .comment-head .edit,
#comments .comment-head .perma          {
                                            color: #666;
                                            font-size: 11px;
                                        }
#comments .comment-entry p              { margin: 0 0 0 20px }
#comments .reply                        {
                                            padding-top: 10px;
                                            position: absolute;
                                            right: 0;
                                            top: 5px;
                                        }
#comments .reply a                      {
                                            font: 11px/18px sans-serif;
                                            text-transform: lowercase;
                                        }
#comments .reply a:hover                { }
#comments ul.children                   {
                                            background: url("../img/theme/comment-child-arrow.png") no-repeat scroll 1.25em 2.5em transparent;
                                            margin: 10px 0 0;
                                            padding: 0 0 0 50px;
                                        }
#comments ul.children li                { border-top: 1px dashed #dedede }
#comments .cancel-comment-reply         { margin: 10px 0 }
#comments .navigation                   { }
#comments .navigation a                 {
                                            display: block;
                                            margin: 15px 0 0 0;
                                            text-decoration: none;
                                        }
#comments .navigation a:hover           { }
#comments h3#pings                      { margin-top: 25px }
#comments .pingbacks li.pingback        { margin: 10px 0 }
#comments .pingbacks li.pingback .reply { display: none }
#comments .nocomments                   {
                                            font-size: 14px;
                                            font-weight: bold;
                                        }
.comment-header-border                  {
                                            background-color: #e9ebed;
                                            height: 1px;
                                            margin: 0 auto;
                                            display: block;
                                            width: 200px;
                                        }
/* === COMMENTS FORM === */

#respond                                {
                                            text-align: center;
                                            width: 100%;
                                            padding-bottom: 25px;
                                        }
.respond-inset-wrapper                  { padding: 20px }
#respond h4                             {
                                            color: #555;
                                            font-size: 13px;
                                            padding: 8px 0 15px 0;
                                        }
#respond label                          {
                                            font-size: 11px;
                                            color: #777;
                                        }
#commentform                            { margin: 10px 0 0 0 }
#commentform label                      {
                                            position: relative;
                                            display: inline;
                                            vertical-align: top;
                                            display: inline-block;
                                            margin-top: 5px;
                                        }
#commentform input.txt,
#commentform textarea                   { border: none }
#commentform input.txt                  {
                                            background: #f2f2f2;
                                            border: 1px #ddd solid;
                                            font-size: 11px;
                                            width: 50%;
                                            margin-right: 6px;
                                        }
#commentform textarea                   {
                                            background: #f2f2f2;
                                            width: 98% !important;
                                            border: 1px #ddd solid;
                                            font-size: 11px;
                                        }
#commentform input.txt:focus,
#commentform textarea:focus             {
                                            border-color: rgba(82, 168, 236, 0.40) !important;
                                            box-shadow: 0 0 3px rgba(82, 168, 236, 0.5);
                                        }
#respond #commentform #submit           {
                                            cursor: pointer;
                                            float: right;
                                            font-family: sans-serif;
                                            font-size: 12px;
                                            font-weight: bold;
                                            margin: 0;
                                        }
                                        


/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	12. AWESOME BUTTONS   */
/* --------------------------------------------------------------------------------------------------------------------------- */

.awesome,
.awesome:visited                        {
                                            background: #222 url('../img/theme/alert-overlay.png') repeat-x;
                                            display: inline-block;
                                            padding: 5px 10px 6px;
                                            color: #fff;
                                            text-decoration: none;
                                            -moz-border-radius: 5px;
                                            -webkit-border-radius: 5px;
                                            -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.3);
                                            -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.3);
                                            box-shadow: 0 1px 2px rgba(0,0,0,0.3);
                                            text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
                                            border-bottom: 1px solid rgba(0,0,0,0.25);
                                            position: relative;
                                            cursor: pointer;
                                        }
.awesome:hover                          {
                                            background-color: #111;
                                            color: #fff;
                                        }
.awesome:active                         { top: 1px }
.small.awesome,
.small.awesome:visited                  {
                                            font-size: 11px;
                                            padding: ;
                                        }
.awesome,
.awesome:visited,
.medium.awesome,
.medium.awesome:visited                 {
                                            font-size: 13px;
                                            font-weight: bold;
                                            line-height: 1;
                                            text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
                                        }
.large.awesome,
.large.awesome:visited                  {
                                            font-size: 14px;
                                            padding: 8px 14px 9px;
                                        }
.green.awesome,
.green.awesome:visited                  { background-color: #91bd09 }
.green.awesome:hover                    { background-color: #749a02 }
.blue.awesome,
.blue.awesome:visited                   { background-color: #2daebf }
.blue.awesome:hover                     { background-color: #007d9a }
.red.awesome,
.red.awesome:visited                    { background-color: #e33100 }
.red.awesome:hover                      { background-color: #872300 }
.magenta.awesome,
.magenta.awesome:visited                { background-color: #a9014b }
.magenta.awesome:hover                  { background-color: #630030 }
.orange.awesome,
.orange.awesome:visited                 { background-color: #ff5c00 }
.orange.awesome:hover                   { background-color: #d45500 }
.yellow.awesome,
.yellow.awesome:visited                 { background-color: #ffb515 }
.yellow.awesome:hover                   { background-color: #fc9200 }
.black.awesome,
.black.awesome:visited                  { background-color: #333 }
.black.awesome:hover                    { background-color: #000 }
.grey.awesome,
.grey.awesome:visited                   {
                                            background-color: #f2f2f2;
                                            color: #444;
                                            text-shadow: none;
                                        }
.grey.awesome:hover                     { background-color: #ddd }
.purple.awesome,
.purple.awesome:visited                 { background-color: #371a93 }
.purple.awesome:hover                   { background-color: #1a0168 }
.brown.awesome,
.brown.awesome:visited                  { background-color: #6b2c38 }
.brown.awesome:hover                    { background-color: #460914 }
table.table-standard                    {
                                            border: 1px #ddd solid;
                                            font-size: 11px;
                                            width: 100%;
                                            margin-bottom: 10px;
                                        }


                                        
/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	13. MISCELLENIOUS */
/* --------------------------------------------------------------------------------------------------------------------------- */

/* === COLUMNS === */

.qcOneColumn                            { width: 100% }
.qcTwoColumns                           {
                                            float: left;
                                            width: 470px;
                                            margin-right: 20px;
                                        }
.qcThreeColumns                         {
                                            float: left;
                                            width: 306px;
                                            margin-right: 20px;
                                        }
.qcFourColumns                          {
                                            float: left;
                                            width: 225px;
                                            margin-right: 20px;
                                        }
.qcFiveColumns                          {
                                            float: left;
                                            width: 176px;
                                            margin-right: 20px;
                                        }
.qcFC2,
.qcFC2 img                              {
                                            width: 480px;
                                            height: 400px;
                                        }
.qcFW2                                  { background: #eee url('../img/placeholder/bfc2.png') }
.qcFC3,
.qcFC3 img                              {
                                            width: 320px;
                                            height: 267px;
                                        }
.qcFW3                                  { background: #eee url('../img/placeholder/bfc3.png') }
.last                                   { margin: 0 }


#dd-menu                                {
                                            width: 100%;
                                            padding: 5px;
                                            margin: 0 0 20px 0;
                                            display: none;
                                        }
.qcFade                                 { opacity: 0.1 }
input#qcSubscribe                       {
                                            padding: 8px;
                                            margin: 0 0 0 5px;
                                            width: 80%;
                                            color: #666;
                                            background: #ddd;
                                            border: 0;
                                            -moz-border-radius: 3px;
                                            -webkit-border-radius: 3px;
                                            border-radius: 3px;
                                        }
input#qcSubscribeButton                 {
                                            display: block;
                                            padding: 4px;
                                            margin: 15px 0 0 5px;
                                            color: #fff;
                                            background: #C84D50;
                                            border: 0;
                                            cursor: pointer;
                                            -moz-border-radius: 3px;
                                            -webkit-border-radius: 3px;
                                            border-radius: 3px;
                                        }
#location iframe                        {
                                            width: 90%;
                                            height: 180px;
                                            border: 5px #555 solid;
                                            margin-bottom: 10px;
                                        }
#qcConatctMap                           {
                                            width: 100%;
                                            height: 250px;
                                            margin-top: 12px;
                                        }
.first                                  {
                                            width: 99%;
                                            padding: 2px;
                                            margin-bottom: 20px;
                                            border: 1px #ddd solid;
                                        }
#formquote                              { margin: 40px 0 }
#formquote input.input-txt,
#formquote textarea.input-txt           {
                                            width: 80%;
                                            background: #f2f2f2;
                                            font-size: 11px;
                                            padding: 7px;
                                        }
#formquote select.input-txt             {
                                            width: 83%;
                                            background: #f2f2f2;
                                            font-size: 11px;
                                            padding: 7px;
                                        }
#formquote .button                      { margin: 0 }
ul.bt li                                {
                                            list-style: none;
                                            float: left;
                                            margin: 0 15px 15px 0;
                                        }
.wmuSliderPrev:hover,
.wmuSliderNext:hover                    { background: #C84D50 }
.wmuSliderWrapper article a             { cursor: default }
#qcFilterableNav li.qcAjaxLoader        {
                                            display: none;
                                            float: right;
                                            width: 16px;
                                            height: 16px;
                                            padding: 0;
                                            list-style: none;
                                            background: url('../img/theme/ajax-loader.gif') center center no-repeat;
                                        }
.qcSubTitle                             { margin-bottom: 20px }
.qcBlogSB                               { margin-top: 21px }
.qcSocialShare li                       {
                                            float: left;
                                            list-style: none;
                                            margin-bottom: 10px;
                                        }
#contact-form p.form-success,
#contact-form p.form-success strong     { color: green }
#contact-form span.error                {
                                            position: relative;
                                            top: -10px;
                                            color: red;
                                        }
                                        
/* === TABS === */

ul.tabs                                 {
                                            display: block;
                                            margin: 0 0 15px 0;
                                            padding: 0;
                                            border-bottom: solid 2px #aaa;
                                        }
ul.tabs li                              {
                                            display: block;
                                            width: auto;
                                            height: 30px;
                                            padding: 0;
                                            float: left;
                                            margin-bottom: 0;
                                            padding-bottom: 2px;
                                            border-right: 1px #ddd dotted;
                                        }
ul.tabs li a                            {
                                            display: block;
                                            text-decoration: none;
                                            width: auto;
                                            height: 29px;
                                            padding: 0px 20px 3px 20px;
                                            line-height: 30px;
                                            margin: 0;
                                            color: #666;
                                            font-size: 11px;
                                            font-weight: bold;
                                        }
ul.tabs li a:hover                      { border: 0px }
ul.tabs li a.selected                   {
                                            border-bottom: 2px #C84D50 solid;
                                            color: #000;
                                        }
.tab-content                            { padding: 12px 10px }
#tab_block                              {
                                            position: relative;
                                            top: -15px;
                                        }
.qcBlogEntry #tab_block                 {
                                            position: relative;
                                            top: -10px;
                                        }                                      
                                        
/* === TOGGLE === */

.shortcode-toggle                       { margin-bottom: 15px }
.shortcode-toggle h4                    { margin: 0 }
.shortcode-toggle h4 a                  {
                                            display: block;
                                            font-size: 11px;
                                            padding: 5px 15px;
                                            text-decoration: none;
                                            text-shadow: none;
                                            color: #fff;
                                            background: #333 url('../img/theme/shortcode-toggle-close.png') no-repeat 99% center;
                                        }
.shortcode-toggle.closed h4 a           { background-image: url('../img/theme/shortcode-toggle-open.png') }
.shortcode-toggle .toggle-content       {
                                            padding: 10px 10px 1px 10px;
                                            background: #f2f2f2;
                                            -moz-box-shadow: inset 0 0 5px #ddd;
                                            -webkit-box-shadow: inset 0 0 5px #ddd;
                                            box-shadow: inner 0 0 5px #ddd;
                                        }
.shortcode-toggle.closed .toggle-content
                                        { display: none }
                                        
/* === TABLE === */

table.table-standard                    { border-collapse: collapse }
table.table-standard tr.table-head      {
                                            font-weight: bold;
                                            text-align: center;
                                            background: #f2f2f2;
                                        }
table.table-standard td                 {
                                            border: 1px #ddd dotted;
                                            padding: 5px 10px;
                                            text-align: center;
                                        }                                        


                                        
/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	14. CONDITIONAL LAYOUT CSS FOR MOBILE / TABLET DEVICES [ MEDIA QUERIES ]  */
/* --------------------------------------------------------------------------------------------------------------------------- */

/*    TABLET : 768px 
---------------------------------------------------------------------------------------------------------------------------------
    cols    1     2      3      4      5      6      7      8      9      10      11      12     13     14     15     16             
    px      28    76     124    172    220    268    316    364    412    460     508     556    604    652    700    748     */
    
@media only screen and (min-width: 768px) and (max-width: 959px)                             { 
    #qcNavigation,
    #qcLogo                                 {
                                                float: none;
                                                display: block;
                                                margin: 0 auto;
                                            }
    #qcNavigation                           { margin: 7px 10px 10px 10px }
    #qcHomeHeading                          { font-size: 26px }
    h1#qcPageHeading                        { font-size: 24px }
    .wmuSlider .wmuSliderWrapper article img
                                            { width: 98.8% }
    .sf-menu                                { text-align: center }
    .sf-menu li                             {
                                                display: inline-block;
                                                float: none;
                                            }
    .sf-menu li ul li                       { text-align: left }
    .qcTwoColumns                           {
                                                float: left;
                                                width: 344px;
                                                margin-right: 20px;
                                            }
    .qcThreeColumns                         {
                                                float: left;
                                                width: 222px;
                                                margin-right: 20px;
                                            }
    .qcFourColumns                          {
                                                float: left;
                                                width: 162px;
                                                margin-right: 20px;
                                            }
    .qcFiveColumns                          {
                                                float: left;
                                                width: 125px;
                                                margin-right: 20px;
                                            }
    .qcFilterableWrapper                    { background: #eee url('../img/placeholder/ipadp4.png') }
    .qcFilterableItem                       {
                                                width: 182px;
                                                height: 152px;
                                            }
    .qcFilterableItem img                   {
                                                width: 182px;
                                                height: 115px;
                                            }
    .qcProjectOverlay                       { visibility: hidden }
    a.qcQuickView,
    a.qcCaseStudy                           { width: 102px }
    a.qcQuickView                           { background: url('../img/theme/qcProjectLink.png') no-repeat -15px 0 }
    a.qcQuickView:hover                     { background: url('../img/theme/qcProjectLink.png') no-repeat -15px -80px }
    a.qcCaseStudy                           { background: url('../img/theme/qcProjectLink.png') no-repeat -154px 0 }
    a.qcCaseStudy:hover                     { background: url('../img/theme/qcProjectLink.png') no-repeat -154px -80px }
    .widget                                 {
                                                width: 208px;
                                                height: 180px;
                                            }
    li.qcLatestItem                         { width: 222px }
    #qcMainContent                          { width: 470px }
    #qcMainContent.qcBlog                   { width: 415px }
    #qcSidebar                              { width: 215px }
    #qcSidebar .widget                      { width: 195px }
    .gallery-column                         {
                                                width: 208px;
                                                height: 156px;
                                            }
    .gallery-mask                           { height: 156px }
    .qcFC2                                  {
                                                width: 364px;
                                                height: 302px;
                                            }
    .qcFC2 img                              {
                                                width: 364px;
                                                height: 265px;
                                            }
    .qcFW2                                  { background: #eee url('../img/placeholder/ipadp2.png') }
    .qcFC3                                  {
                                                width: 242px;
                                                height: 200px;
                                            }
    .qcFC3 img                              {
                                                width: 242px;
                                                height: 162px;
                                            }
    .qcFW3                                  { background: #eee url('../img/placeholder/ipadp3.png') }
    input[type="text"],
    input[type="password"],
    input[type="email"],
    textarea,
    select                                  { width: 90% }
    .qcSocialShare                          { display: none }
}



/*    MOBILE PORTRAIT : 320px 
---------------------------------------------------------------------------------------------------------------------------------
    cols    1     2      3      4      5      6      7      8      9      10      11      12     13     14     15     16             
    px      300   300    300    300    300    300    300    300    300    300     300     300    300    300    300    300     */
    
@media only screen and (max-width: 767px)                             { 
    #qcPrimaryMenu                          { display: none }
    #qcNavigation,
    #qcLogo                                 {
                                                float: none;
                                                display: block;
                                                position: relative;
                                                right: 0;
                                            }
    #dd-menu                                { display: block }
    .qcOneColumn,
    .qcTwoColumns,
    .qcThreeColumns,
    .qcFourColumns,
    .qcFiveColumns                          { width: 100% }
    .qcFilterableWrapper                    { background: #eee url('../img/placeholder/iphonep.png') }
    .qcFilterableItem                       {
                                                width: 300px;
                                                height: 250px;
                                            }
    .qcFilterableItem img                   {
                                                width: 300px;
                                                height: 216px;
                                            }
    .qcAjaxPortfolioImage,
    .qcAjaxPortfolioContent                 { left: 0 }
    .qcHeadTitle                            { background-image: none }
    .widget                                 {
                                                width: 260px;
                                                height: 180px;
                                                border-right: 0;
                                                text-align: center;
                                            }
    #qcTopbar .widget                       { padding-left: 0 }
    li.qcLatestItem                         {
                                                width: 320px;
                                                margin: 0;
                                                border-bottom: 0;
                                            }
    #qcMainContent,
    #qcSidebar                              {
                                                width: 300px;
                                                padding: 0;
                                                border: 0;
                                            }
    .gallery-column                         {
                                                width: 218px;
                                                height: 159px;
                                            }
    .gallery-mask                           { height: 159px }
    .wmuSlider .wmuSliderWrapper article img
                                            { width: 98% }
    .qcAjaxPortfolioContent                 { margin-top: 25px }
    #qcHomeHeading                          { font-size: 24px }
    h1#qcPageHeading                        { font-size: 18px }
    #qcConatctMap                           { height: 120px }
    #qcFilterableNav li                     {
                                                float: none;
                                                display: inline-block;
                                                margin: 5px 0;
                                            }
    #qcFilterableNav                        { background: url("../img/theme/sort.png") no-repeat scroll 17px 12px transparent }
    input[type="text"],
    input[type="password"],
    input[type="email"],
    textarea,
    select                                  { width: 98% }
    #formquote input.input-txt,
    #formquote textarea.input-txt           { width: 95% }
    #formquote #budget                      { width: 100% }
    #qcFooterMenu li                        {
                                                float: none;
                                                display: inline-block;
                                                margin-bottom: 10px;
                                            }
    #qcFooterMenu,
    #qcCopyrights                           {
                                                float: none;
                                                display: block;
                                                text-align: center;
                                            }
    .hover-post-meta-comment,
    .qcSocialShare                          { display: none }
}



/*    MOBILE WIDE / LANDSCAPE : 480px 
---------------------------------------------------------------------------------------------------------------------------------
    cols    1     2      3      4      5      6      7      8      9      10      11      12     13     14     15     16             
    px      420   420    420    420    420    420    420    420    420    420     420     420    420    420    420    420     */
    
@media only screen and (min-width: 480px) and (max-width: 767px)                             { 
    .qcOneColumn,
    .qcTwoColumns,
    .qcThreeColumns,
    .qcFourColumns,
    .qcFiveColumns          { width: 100% }
    .qcFilterableWrapper    { background: #eee url('../img/placeholder/iphonepp.png') }
    .qcFilterableItem       {
                                width: 420px;
                                height: 320px;
                            }
    .qcFilterableItem img   {
                                width: 420px;
                                height: 284px;
                            }
    .qcAjaxPortfolioImage,
    .qcAjaxPortfolioContent { left: 0 }
    .qcHeadTitle            { background-image: none }
    .widget                 {
                                width: 360px;
                                height: 160px;
                                border-right: 0;
                            }
    li.qcLatestItem         {
                                width: 420px;
                                margin: 0;
                                border-bottom: 0;
                            }
    #qcMainContent,
    #qcSidebar              {
                                width: 420px;
                                padding: 0;
                                border: 0;
                            }
    .gallery-column         {
                                width: 390px;
                                height: 284px;
                            }
    .gallery-mask           { height: 284px }
}