/*
Theme Name: Amp
Description: TSW theme, Amp, is a novelty theme replicating a classic electric guitar amplifier. Theme options include, Upload logo which sits in top of each article; Upload footer background image; Upload background image; Select colors for site links, background of content, text color and whole site background color. Also a header image can be uploaded. Top menu is volume, tone controls and is very basic but no worries as this theme has a mobile-type navigation for menu two and a menu in the footer for menu three. So you will be able to make the top menu work without losing overall site navigation. Sidebar for widgets is in footer. Demo at: http://tradesouthwest.net/wordpress/
Author: Tradesouthwest
Author URI: http://tradesouthwest.com
Tags: one-column, custom-background, custom-header, editor-style, theme-options, translation-ready
Copyright: Larry Judd Oliver 2015 Tradesouthwest
Version: 0.1
Theme URI: http://tradesouthwest.net/wordpress// 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: amp
*/
h1, h2, h3, h4, h5, h6, p, { word-wrap: break-word; }
h1{ font-size: 190%; }
h2{ font-size: 160%; }
h3{ font-size: 120%; }
h4{ font-size: 110%; }
h5{ font-size: 100%; }
h6{ font-size: 70%;  }
p {
    line-height: 1.333; 
    font-family: Arial, Tahoma, Helvetica, sans-serif;
    color: #2a2a2a;
    text-align: justify;
    margin: 0 0 9px 0;
}
a { 
    font-weight: 400; 
    text-decoration: none; 
}
a:visited {
    font-weight: normal;
}
a:hover {  
    text-decoration: underline; 
}
a img {  
    outline: none;
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}
audio,canvas,video{display:inline-block}
.clearfix:before,.clearfix:after{content:'';display:table;}
.clearfix:after{clear:both;}
.clearfix{zoom:1;}
blockquote {
    background: #f4f4f4;
    padding: 5px 15px;
    margin: 3px 30px;
}
img { max-width: 100% !important; }
/* ie 8 img max-width */
@media \0screen {
  img { width: auto;}
}
/*  =Initial Sturcture
------------------------------------------------- */
body{
    font-size:100%;
    line-height:1.2
    width: 90%; 
    margin: 0 auto;
    font-size: 16px;
    line-height: 24px;
    font-family: Arial, Tahoma, Helvetica, sans-serif;
    background-color: #f6f6f6;
    overflow-x: hidden;
    margin-top: 20px;
}

img {
    -ms-interpolation-mode: bicubic;
    border: 0;
    height: auto;
    max-width: 100%;
}
hr {
    background-color: #f6f6f6;
    border: 0;
    height: 1px;
}
/*  =Structure
------------------------------------------------- */
.wrapper {
max-width: 1200px;
width: 100%;
margin: 0 auto;
padding: 0;
}
.amp{
position: relative;
display: block;
background: url('assets/cloth-11.jpg'); 
background-size: 10%; 
width:90%; 
margin: 0 auto; 
border: 20px solid black; 
border-radius: 12px; 
height: 200px;
}
.feet {
display: block;
position: relative;
padding: 0;
width: 76%;
height: 12px;
margin: 0 auto;
border-left: 50px solid #282828;
border-right: 50px solid #282828;
}
.speaker{
position: relative;
background: url('assets/cloth-11.jpg'); 
background-size: 10%; 
width: 90%; 
margin: 0 auto; 
border: 20px solid black; 
border-radius: 12px; 
min-height: 800px;
height: auto;
}
.site-nav {
position: relative;
display: block;
width: 97.75%;
background: #2e2d2f;
color: silver;
margin: 1px;
border: 1px solid silver;
padding: 10px;
height: 50px;
}
.site-header {
position: relative;
padding: 0 20px;
overflow: hidden;
}
.site-header {
position: relative; 
left: 0;
height: 125px;
width: 95%;
margin: 0;
overflow: hidden;
z-index: 10;
}
.site-header .hgroup {
width: 80%;
position: relative;
left: 0;
}
.logo {
float: right;
position: relative;
right: 20px;
top: -132px;
max-height: 102px;
width: auto;  
display: block;
}
.logo #header-img {
max-height: 100px;
width: auto;
margin-top: .5em;
}
.logo:after {
content: "";
clear: both;
}
.site-title a {
color: #e8edf3;
text-shadow: 1px 2px 3px #000;
font-weight: 700;
}
.site-description {
    text-shadow:    1px 1px 3px #7c7c7c;
}
#access ul li {
    display:        inline;
    float:          left;
}
#access li a {
    color:          #fafafa;
    font -size:     1em;
    position:       relative;
    left:            -5%;
    top:             0;
}
#access li a:before {
    content:         "\2742";
    font-size:       2.885em;
    position:        relative;
    top:             -.1218em;
}
.select-menu {
    width:           240px;
    float:           right;
    text-align:      left;
    height:          45px;
    position:        relative;
    top:             -72px;
    padding:         0;
}
#content {
    position:         relative;
    margin:           20px auto;
    width:            90%
    padding:          0;
}
.entry-header {
    display:          block;
    width:            92%;
    margin:           0 auto;
    padding:          10px;
    border-radius:    10px 10px 0 0;
    box-shadow:       1px -1px 3px #888, -1px 0 2px #999;
}
.entry-title {
    transform:        rotate(-4deg);
    position:         relative;
    top:              -.222em;
    left:             1em;
    text-shadow:      0 1px 1px #aaa;
    z-index:          98;
}
.branding {
    float:            right;
    position:         absolute;
    right:            62px;
    top:              32px;
}
.site-logo img {
    width:            auto;
    height:           89px;
    padding:          0;
    margin:           0;
    z-index:          99;
}
article.entry {
    display:          block;
    width:            88.66667%;
    overflow:         hidden;
    height:           auto;
    position:         relative;
    opacity:          .9;
    padding:          20px;
    margin:           40px auto 40px auto;
    border:           thin solid #bbb;
    border-radius:    15px;
}
.no-thumb {
    margin:           0;
    padding:          0;
}
.content {
    display:          block;
    width:            92%;
    margin:           0 auto;
    padding:          10px;
    box-shadow:       0 1px 3px #888;
    min-height:       150px;
    overflow:         hidden;
}
.entry-container {
    width:            90%;
    margin:           0 auto;
    padding:          10px 25px;
}
.hentry {
    margin-top:       20px;
    margin-bottom:    20px;
}
.metadata {
    padding-left:     15px;
}
.meta-footer {
    display:          block;
    width:            92%;
    padding:          10px 0;
    margin:           40px auto;
    box-shadow:       0 1px 3px #888;
    min-height:       20px;
    overflow:         hidden;
    background:       rgba( 255, 255, 255, .7);
    border-radius:    10px;
}
#navigation {
    text-align:       center;
    width:            94%;
    margin:           10px auto;
}
.site-footer {
    width:            100%;
    padding:          10px;
    margin:           0;
    box-shadow:       0 -1px 2px rgba( 0, 0, 0, .4);
    overflow:         hidden;
}
.site-footer .nav-footer ul li {
    display:          inline-block;
    position:         relative;
    list-style:       none;
    margin:           0;
    padding:          0;
}
.site-footer .nav-footer li a {
    width:            100px;
    display:          inline-block;
    height:           auto;
    padding:          7px;
    border-radius:    20px 20px 20px 20px;
    background:       #edf1f1;
    margin:           2px;
    font-size:        .938em;
    border:           1px solid #999;
    box-shadow:       1px 2px 3px #777, 7px 10px 8px 10px rgba( 145, 145, 145, .45) inset;;
}
.nav-footer li.menu-item-has-children > a:after {
    content:          '\25bc';
    position:         relative;
    top:              0;
    right:            -1em;
    color:            #777;
}
.nav-footer li.menu-item-has-children > a {
    box-shadow: 12px 22px 12px 12px rgba( 0, 0, 0, .65), 7px 10px 8px 10px rgba( 145, 145, 145, .45) inset;
}
.nav-footer li li {
    position:         relative;
}
.footer-right {
    position:         relative;
    right:            1.33336em;
    float:            right !important;
    margin:           .75em;
    padding:          10px;
    width:            45%;
    opacity:          .9;
}
.footer-left {
    position:         relative;
    float:            left;
    margin:           .75em;
    padding:          10px;
    width:            45%;
    opacity:          .9;
}
.no-menu ul li {
    display:          inline;
}
.sidebar-container {
    width:            300px;
    display:          block;
}
#led {
    position:         relative;
    left:             240px;
    top:              -12px;
    width:            20px;
    height:           20px;
    border:           5px solid #c1c7cc;
    border-radius:    95px;
    background:       #df3500;
    box-shadow:       .5px 1px 4px 5px #ffa37a inset;
}
/* =mobile menu
-------------------------------------------------------------- */
.span.toggle {
    display:          none;
    position:         absolute;
    top:              5px;
    left:             0;
    margin:           0; 
    padding:          0;
    z-index:          9999;
}
.toggleline .span {
    display:          block;
}
button.t-button {
    position:         relative;
    top:              59px;
    right:            125px; 
    font-size:        1.25em;
    color:            black;
    display:          block;
    padding:          10px 15px;
    background-color: #e8e8e8;
    background:       linear-gradient(#f2f2f2, #c0c0c0);
    border: 0 none;
    border-radius: 3px;
    text-shadow: 1px -1px 0 #fff;
    cursor: pointer;
}
button.t-button:hover {
    cursor: pointer;
}
#nav {
    position: relative;
    top: 0;
    height: 100%;
    display: block;
    overflow: visible;
}
#nav ul {
    width: 256px;
    max-width: 256px;
    position: relative;
    top: 0;
    left: -55px;
    word-wrap: break-word;
}
#nav ul li { 
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}
#nav li a {
    background: linear-gradient(#ffffff, #efefef, #bababa);
    display: block;
    font-size: 120%;
    width: 100%;
    padding: 2px 10px;
    border-radius: 3px;
    margin: .25px;
    border: thin solid #bbb;
}
#nav li {
    margin-left: 0;
}
#nav ul li > ul {
    position: relative;
    left: 1%;
    background: none;
    width:82%;
}
#nav li.current_page_item a {
    color: black;
    font-weight: 700;
}

/* =WordPress Core
-------------------------------------------------------------- */
.sticky {}
.bypostauthor {}
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

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

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

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}
.attachment-post-thumbnail,
.post-thumb {
	position: relative;
	left: -.33336em;;
	float: left;
	margin-right: 1.75em;
	margin-bottom: .575em;
}
.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}
/* Text meant only for screen readers. */
.screen-reader-text {
	  clip: rect(1px, 1px, 1px, 1px);
    
    height: 1px;
    width: 1px;
    overflow: hidden;
position: absolute !important;
    left: -999em;
}
.screen-reader-text:focus {
    clip: auto !important;
    display: block;
    height: auto;
    left: 5px;
    top: 5px;
    width: auto;
    z-index: 100000; /* Above WP toolbar. */
}
/* =Gallery
-------------------------------------------------------------- */
@media (max-width: 480px) {
  .gallery .gallery-item {
    width: 100%;
    margin-bottom: 20px;
  }
}
.gallery {
 width: 98.8992%;
 display: block;
 clear: both;
 overflow: hidden;
 margin: 0 auto;
 }
 .gallery .gallery-row {
 display:block;
 clear: both;
 overflow: hidden;
 margin: 0;
 }
 .gallery .gallery-item {
 overflow: hidden;
 float: left;
 margin: 0;
 text-align: center;
 list-style: none;
 padding: 0;
 position: absolute
 bottom: 0
 }
 .gallery .gallery-item img, .gallery .gallery-item img.thumbnail {
 max-width: 89%;
 height: auto;
 padding: 1%;
 margin: 0 auto;
 }
 .gallery-caption {
 margin-left: 0;
 }
.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
    max-width:          100%;
    height:             auto;
    opacity: 1;
}
.entry .size-auto, 
.entry .size-full,
.entry .size-large,
.entry .size-medium,
.entry .size-thumbnail {}
form .form-allowed-tags code,
form .form-allowed-tags p {
    max-width:         98.8992%
    height:            auto;
    margin:            0 auto;
    font-size:         0.888em;
    color:             #777;
}
/* =Posts misc.
------------------------------------------------- */
.date-link,
.authorlinks {
   font-weight: 700;
    border-bottom: thin dotted #bbb;
}
.metadata p:first-child {
margin-top: 8px;
}
/* =Comments
------------------------------------------------- */
#comments {
    width: 88%;
    background: #fafafa;
    margin: 0 auto;
padding: 20px 0;
}
.comment-body ul {
    list-style: inside;
}
.comment-body ul li,
.comment-body ul li ul {
   margin-left: 0.612em;
}
#respond {
    width: 88%;
    display: block;
    margin: 3px auto;
}
.responses {
    float: right;
}
h3#reply-title {
    font-size:       small;
    color:           green;
    margin-left:     0;
}

#respond form textarea,
#respond form input[type='text'] {
    border:          thin solid #ddd;
    width:           68%;
}
#respond form textarea {
    height:          100px;
    margin-top:      1px;
}
#commentform p {
    margin:          1px 0;
    line-height:     1.3852;
    font-size:       93.8%;
}
.comment-notes,
#email-notes,
#commentform label {
    color:           #888;
}
#commentform label {
    min-width:       124px;
    width:           auto;
    max-width:       124px;
    border-bottom:   thin dotted #bbb;
    display:         inline-block;
    padding-left:    1px;
}
.required {
    color:           red;
}
form .form-allowed-tags code {
    display: block;
    position: relative;
    left: 0;
    max-width:         100%;
    font-size: .75em;
    margin-bottom: .75em;
    color:             #888;
}
p.form-allowed-tags {
    height:            auto;
    position: relative;
    left: 0;
    font-size:         0.75em;
    color:             #777;
}
.form-allowed-tags code:before {
    content: "";
    margin: .5em 0;
    display: block;
}
#form-allowed-tags {
    width: 97%;
    margin-left: 2px;
}
/*  =Widget Styles
------------------------------------------------- */
.widgettitle {
 	background: rgba(255, 255, 255, .7);
	padding: 3px 10px;
	border-radius: 10px 10px 0 0;
	margin: 25px auto 0 auto;
	box-shadow: 1px -1px 3px #888, -1px 0 2px #999;
}
/* ==========================================================================
   Print styles Inlined to avoid required HTTP connection
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  th, tr {border-bottom: 0px solid white; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}
/* =bbPress
-------------------------------------------------------------- */
#bbpress-forums .avatar {
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
/* =Media query for smaller width screens
-------------------------------------------------------------- */
@media screen and (max-width: 960px) {
body{font-size:90%}
.row{margin: 0;margin-bottom:0!important}
.c1,.c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9,.c10,.c11,.c12{
display:block;width:100%;margin-right:5px;margin-left:5px;margin-bottom:20px}
#access ul {width: auto;}
#access li, #access li a {width: 320px;}
#access ul ul {left: 10%; top: 90%;}
#access ul ul li:hover > ul {left: 10%; top: 90%;}
#respond form input[type="text"] {width: 62%;margin-right: 25%;}
}
/* =Media query for iPad and tablets
-------------------------------------------------------------- */
@media handheld, only screen and (max-width: 768px), only screen and (max-device-width: 768px) and (orientation:portrait){
body{font-size:90%}
.row{margin-bottom:0!important}
.c1,.c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9,.c10,.c11,.c12{width:100%;margin-right:0;margin-left:0;margin-bottom:20px}
#access ul {width: auto;}
#access li, #access li a {width: 320px;}
#access ul ul {left: 10%; top: 90%;}
#access ul ul li:hover > ul {left: 10%; top: 90%;}
#respond form input[type="text"] {width: 60%;margin-right: 22%;}
}
/* =Media query for iPhone and smaller handheld devices
-------------------------------------------------------------- */
@media handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px){
	
}
/* Smartphones (portrait and landscape) --  --  --  --  -- - */
@media only screen
and (min-device-width : 320px) 
and (max-device-width : 480px) { 
/* Styles */
.row{margin: 0;margin-bottom:0!important}
.c1,.c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9,.c10,.c11,.c12{
display:block;width:100%;margin-right:5px;margin-left:5px;margin-bottom:20px}
#access ul {width: auto;}
#access li, #access li a {width: 320px;}
#access ul ul {left: 10%; top: 90%;}
#access ul ul li:hover > ul {left: 10%; top: 90%;}
#respond form input[type="text"] {width: 62%;margin-right: 25%;}
 
}
/* Smartphones (landscape) --  --  --  --  -- - */
@media only screen
and (min-width : 321px) and (max-device-width : 540px) { 
/* Styles */
.row{margin: 0;margin-bottom:0!important}
.c1,.c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9,.c10,.c11,.c12{
display:block;width:100%;margin-right:5px;margin-left:5px;margin-bottom:20px}
#access ul {width: auto;}
#access li, #access li a {width: 320px;}
#access ul ul {left: 10%; top: 90%;}
#access ul ul li:hover > ul {left: 10%; top: 90%;}
#respond form input[type="text"] {width: 62%;margin-right: 25%;}
} 
 
/* Smartphones (portrait) --  --  --  --  -- - */
@media only screen
and (max-width : 321px) and (orientation:portrait) { 
/* Styles */
.row{margin: 0;padding: 0;}
.c1,.c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9,.c10,.c11,.c12 {clear: both;
display:block;width:100%;margin-right:5px;margin-left:5px;margin-bottom:20px}
#access ul {width: auto;}
#access li, #access li a {width: 310px;}
#access ul ul {left: 10%; top: 90%;}
#access ul ul li:hover > ul {left: 10%; top: 90%;}
#respond form input[type="text"] {width: 62%;margin-right: 25%;}
}