/* hiding DIVs on small screens */

@media (max-width: 1025px) {
    .hidden-mobile {
        display: none;
    }
}

/* hiding DIVs on large screens */

@media (min-width: 1025px) {
    .hidden-desktop {
        display: none;
    }
}

/* end */




/* global settings

html, body {
    background-color: #313131;
    color: #aaaaaa;
}
@media (max-width: 1025px) {
    html, body {
        background-color: #111111;
        color: #aaaaaa;
    }
}

.unselectable {
    -webkit-user-select: none;
    -webkit-touch-callout: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

strong {
    font-family: 'Kristi', cursive;
    color:#cf812b;
    font-size: 24pt;
    line-height: 32pt;
    font-weight: normal;
    text-decoration: none;
    font-style: normal;}

strong2 {
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    color:#cf812b;
    font-size: 15px;
    line-height: 22px;
    font-weight: normal;
    text-decoration: none;
    font-style: normal;
}
@media (max-width: 1025px) {
    strong2 {
        font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
        color: #cf812b;
        font-size: 19px;
        line-height: 27px;
        font-weight: bold;
        text-decoration: none;
        font-style: normal;
    }
}


strong3 {
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    font-size: 15px;
    line-height: 22px;
    font-weight: normal;
    color: #bbbbbb;
    text-decoration: none;
    font-style: normal;
}
@media (max-width: 1025px) {
    strong3 {
        font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
        color: #bbbbbb;
        font-size: 19px;
        line-height: 27px;
        font-weight: bold;
        text-decoration: none;
        font-style: normal;
    }
}

font.dbody 	{
    color:#888888;
    font-size: 15px;
    line-height: 22px;
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    font-weight: normal;
    font-variant: normal;
    font-style: normal;
    text-align: left;
}
@media (max-width: 1025px) {
    font.dbody 	{
        color:#111111;
        font-size: 15px;
        line-height: 22px;
        font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
        font-weight: normal;
        font-variant: normal;
        font-style: normal;
        text-align: left;
    }
}


img {
    max-width: 100%;
}

.rotate img{
    transition: 1s ease;
}

.rotate img:hover{
    -webkit-transform: rotateZ(-10deg);
    -ms-transform: rotateZ(-10deg);
    transform: rotateZ(-10deg);
    transition: 1s ease;
}

.grow img{
    transition: 1s ease;
}

.grow img:hover{
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
    transition: 1s ease;
}


font.hbody 	{
    color:#888;
    font-size: 12pt;
    line-height: 18pt;
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    font-weight: normal;
    font-variant: normal;
    font-style: normal;
}



font.wtitle 	{
    color:#bbbbbb;
    font-size: 13pt;
    line-height: 20pt;
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    font-weight: normal;
    font-variant: normal;
    font-style: normal;
}

/* navigation link settings

a,
a:visited {
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    color: #cf812b;
    font-size: 19px;  /* used to be 20
    text-decoration: none;
    outline: none;
}
@media (max-width: 1025px) {
    a,
    a:visited {
        font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
        font-size: 19px;
        line-height: 22px;
        font-weight: bold;
        color: #cf812b;
    }
}

a:hover,
a:active {
    color: #ffffff;
    text-decoration: none;
    outline: none;
}


a.nav,
a.nav:visited {
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    color: #2aa3f7;
    font-size: 16px;  /* used to be 20
    text-decoration: none;
    outline: none;
}
@media (max-width: 1025px) {
    a.nav,
    a.nav:visited {
        font-weight: bold;
    }
}

a.nav:hover,
a.nav:active {
    color: #ffffff;
    text-decoration: none;
    outline: none;
}

a.nav1 		{
    text-decoration: none; border-bottom:2px dotted #666666;
    outline:none;
    font-size: 11pt;
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    font-weight: normal;
    font-variant: normal;
    font-style: normal;
    color:#bbbbbb;
}
@media (max-width: 1025px) {
    a.nav1 		{
        text-decoration: none; border-bottom:2px dotted #666666;
        font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
        font-variant: normal;
        font-style: normal;
        font-size: 19px;
        line-height: 27px;
        font-weight: bold;
        color: #ffffff;
        outline:none;
        }
}

a.nav1:hover 	{
    color: #cf812b;
    text-decoration: none; border-bottom: none;
}


a.nav3 		{
    text-decoration: none;
    outline:none;
    font-size: 11pt;
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    font-weight: normal;
    font-variant: normal;
    font-style: normal;
    color:#666666;
}
@media (max-width: 1025px) {
    a.nav3 		{
        text-decoration: none;
        outline:none;
        font-size: 11pt;
        font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
        font-weight: normal;
        font-variant: normal;
        font-style: normal;
        color:#111111;
    }
}

a.nav3:hover 	{
    color: #ffffff;
    text-decoration: none;
}
@media (max-width: 1025px) {
    a.nav3:hover 	{
        color: #111111;
        text-decoration: none;
    }
}

a.nav5,
a.nav5:visited {
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    color: #bbbbbb;   /* #2aa3f7;
    font-size: 14px;  /* used to be 20
    text-decoration: none;
    font-weight: normal;
    outline: none;
}

a.nav5:hover,
a.nav5:active {
    color: #ffffff;
    text-decoration: none;
    outline: none;
}


a.nav8,
a.nav8:visited {
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    color: #cf812b;   /* #2aa3f7;
    font-size: 15px;  /* used to be 20
    text-decoration: underline;
    font-weight: normal;
    outline: none;
}

a.nav8:hover,
a.nav8:active {
    color: #ffffff;
    text-decoration: none;
    outline: none;
}

/* end

/* main top background image for mobile pages

#headerTitleImage {
    width: 100%;
    height: 590px;
    background: url("../img/common/gma1_title_mobile_1.jpg") no-repeat center center;
}
@media (max-width: 1025px) {
    #headerTitleImage {
        width: 100%;
        /* height: 280px;
        background: url("../img/common/gma1_title_mobile_1.jpg") no-repeat center center;
    }
}


/* main top background image title for mobile pages

#ALHeadlineMenu {
    color: transparent;
    text-indent: 99em;
    overflow: hidden;
    width: 420px;
    height: 199px;
    margin-top: 125px;
    background: url("../img/common/gma1_title_mobile_1.jpg") no-repeat;
}
@media (max-width: 1025px) {
    #ALHeadlineMenu {
        color: transparent;
        text-indent: 99em;
        overflow: hidden;
        width: 360px;
        height: 171px;
        margin-top: 80px;
        background: url("../img/common/gma1_title_mobile_1.jpg") no-repeat;
    }
}


/* sub-title text on top background of each mobile page

#ALSubtext {
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    color: #f2f2f2;
    font-size: 22px;
    text-transform: uppercase;
    margin-top: 1.0em;
}

#ALSubtextDark {
    font-family: "Roboto", tahoma, arial, helvetica, avenir, sans-serif;
    color: #2a466b;
    font-size: 22px;
    text-transform: uppercase;
    margin-top: 1.0em;
    font-weight: bold;
}

/* end

/* general layout settings

main {
    /*
    margin-bottom: 100%;


}

#pickUpTools {
    margin-bottom: 24px;
    text-align: left;
}



.sectionTitle {
    margin-top: 18px;
}
.sectionDescription {
    width: auto;
    margin-bottom: 50px;
    padding-left: 0px;
    padding-right: 0px;
    font-size: 22px;
    clear: both;
}

/* end


/* floating menu settings

.floating-menu {
    padding: 5px;
    width: 80px;
    z-index: 100;
    position: fixed;
    right: 10px;
    bottom: 39%;
    text-align: center;
}

@media (max-width: 2193px) and (min-width: 2048px) {
    .floating-menu {
        bottom: 36%;
    }
}

@media (max-width: 2047px) and (min-width: 1902px) {
    .floating-menu {
        bottom: 33%;
    }
}

@media (max-width: 1901px) and (min-width: 1756px) {
    .floating-menu {
        bottom: 30%;
    }
}

@media (max-width: 1755px) and (min-width: 1610px) {
    .floating-menu {
        bottom: 27%;
    }
}

@media (max-width: 1609px) and (min-width: 1464px) {
    .floating-menu {
        bottom: 24%;
    }
}

@media (max-width: 1463px) and (min-width: 1318px) {
    .floating-menu {
        bottom: 21%;
    }
}

@media (max-width: 1317px) and (min-width: 1172px) {
    .floating-menu {
        bottom: 18%;
    }
}

@media (max-width: 1171px) and (min-width: 1026px) {
    .floating-menu {
        bottom: 15%;
    }
}

.mobile-menu {
    padding: 5px;
    width: 80px;
    z-index: 100;
    position: fixed;
    right: 10px;
    bottom: 53%;
}

@media (min-width: 1025px) {
    .mobile-menu {
        display: none;
    }
}

/* end


/* Video PopUp settings

#toolsVideoShield {
    display: none;
    position: fixed;
    background: rgba(0, 0, 0, 0.7);
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 99999;
}
#toolsVideo {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 800px;
    height: 450px;
    margin-left: -400px;
    margin-top:  -225px;
}


/* end


/* settings for title section

.feature4TitleA {
    min-height: 175px;
    width: 15.6%;
    margin-right: 2.0%;
    margin-left: 0.0%;
    float: left;
    padding-bottom: 41px;
    background-color: #313131;
}
@media (max-width: 1025px) {
    .featureTitleA {
        min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
    }
}

.feature4TitleB {
    min-height: 175px;
    width: 59.8%;
    margin-right: 0.0%;
    margin-left: 0.0%;
    float: left;
    padding-bottom: 42px;
    background-color: #222222;
}
@media (max-width: 1025px) {
    .featureTitleB {
        min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
    }
}

.feature4TitleC {
    min-height: 175px;
    width: 15.6%;
    margin-right: 0.0%;
    margin-left: 2.0%;
    float: left;
    padding-bottom: 41px;
    background-color: #313131;
}
@media (max-width: 1025px) {
    .featureTitleC {
        min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
        padding-bottom: 41px;
    }
}

.feature4TitleD {
    min-height: 175px;
    width: 5.0%;
    margin-right: 0.0%;
    margin-left: 0.0%;
    float: left;
    padding-bottom: 41px;
    background-color: #313131;
}
@media (max-width: 1025px) {
    .featureTitleD {
        min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
    }
}


/* settings for 4 main columns

.feature4ColumnsA {
    min-height: 70px;
    width: 15.0%;
    margin-right: 2.0%;
    margin-left: 0.0%;
    float: left;
    background-color: #313131;
}
@media (max-width: 1025px) {
    .feature4ColumnsA {
        min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
    }
}

.feature4ColumnsB {
    min-height: 70px;
    width: 61.0%;
    margin-right: 0.0%;
    margin-left: 0.0%;
    float: left;
    background-color: #222222;
}
@media (max-width: 1025px) {
    .feature4ColumnsB {
        min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
        background-color: #111111;
    }
}

.feature4ColumnsC {
    min-height: 70px;
    width: 15.0%;
    margin-right: 0.0%;
    margin-left: 2.0%;
    float: left;
    background-color: #313131;
}
@media (max-width: 1025px) {
    .feature4ColumnsC {
        min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
    }
}

.feature4ColumnsD {
    min-height: 70px;
    width: 5.0%;
    margin-right: 0.0%;
    margin-left: 0.0%;
    float: left;
    background-color: #313131;
}
@media (max-width: 1025px) {
    .feature4ColumnsC {
        min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
    }
}


/* settings for 3 columns of guitars in gallery or workshop

.featureGallery3 {
    min-height: 100px;
    width: 32.0%;
    margin-top: 5px;
    margin-right: 0.7%;
    margin-left: 0.5%;
    padding-top: 25px;
    padding-bottom: 25px;
    text-align: center;
    float: left;
}
@media (max-width: 1025px) {
    .featureGallery3 {
        /* min-height: 100px;
        width: 100.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        margin-bottom: 10px;
        float: left;
    }
}

/* settings for text column in WOODS

.featureGallery4 {
    min-height: 100px;
    width: 32.0%;
    margin-top: 5px;
    margin-right: 0.7%;
    margin-left: 0.5%;
    padding-top: 25px;
    padding-bottom: 25px;
    text-align: center;
    float: left;
}
@media (max-width: 1025px) {
    .featureGallery4 {
        /* min-height: 100px;
        width: 86.0%;
        margin-right: 7.0%;
        margin-left: 7.0%;
        margin-bottom: 10px;
        text-align: left;
        float: left;
    }
}

/* settings for center column for ABOUT, CONTACT

.featureAbout1 {
    min-height: 100px;
    width: 32.0%;
    margin-top: 5px;
    margin-right: 0.7%;
    margin-left: 0.5%;
    padding-top: 25px;
    padding-bottom: 25px;
    text-align: left;
    float: left;
}
@media (max-width: 1025px) {
    .featureAbout1 {
        min-height: 100px;
        width: 86.0%;
        margin-right: 7.0%;
        margin-left: 7.0%;
        float: left;
    }
}

/* settings for Video DEMO

.featureVideo1 {
    min-height: 100px;
    width: 51.0%;
    margin-top: 5px;
    margin-right: 2.0%;
    margin-left: 11.0%;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: left;
    float: left;
}
@media (max-width: 1025px) {
    .featureVideo1 {
        min-height: 100px;
        width: 86.0%;
        margin-right: 7.0%;
        margin-left: 7.0%;
        float: left;
    }
}

/* settings for Video DEMO

.featureVideo2 {
    min-height: 100px;
    width: 27.0%;
    margin-top: 0px;
    margin-right: 6.0%;
    margin-left: 2.0%;
    padding-top: 0px;
    padding-bottom: 5px;
    text-align: left;
    float: left;
}
@media (max-width: 1025px) {
    .featureVideo2 {
        min-height: 100px;
        width: 86.0%;
        margin-right: 7.0%;
        margin-left: 7.0%;
        float: left;
    }
}


/* settings for center column for LEGACY LINKS

.featureAbout2 {
    min-height: 100px;
    width: 32.0%;
    margin-top: 5px;
    margin-right: 0.7%;
    margin-left: 0.5%;
    padding-top: 25px;
    padding-bottom: 25px;
    text-align: center;
    float: left;
}
@media (max-width: 1025px) {
    .featureAbout2 {
        min-height: 100px;
        width: 30.0%;
        margin-right: 1.5%;
        margin-left: 1.5%;
        float: left;
    }
}

/* settings for specifications on FORSALE page

.featureForSale1 {
/*    min-height: 100px;
    width: 50.0%;
/*    margin-top: 5px;
    margin-right: 0.0%;
    margin-left: 0.0%;
/*    padding-top: 25px;
/*    padding-bottom: 25px;
    text-align: left;
    float: left;
}
@media (max-width: 1025px) {
    .featureForSale1 {
        /* min-height: 100px;
        width: 50.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
    }
}

.featureForSale2 {
/*    min-height: 100px;
    width: 50.0%;
    /*    margin-top: 5px;
    margin-right: 0.0%;
    margin-left: 0.0%;
    /*    padding-top: 25px;
    /*    padding-bottom: 25px;
    text-align: left;
    float: left;
}
@media (max-width: 1025px) {
    .featureForSale2 {
        /* min-height: 100px;
        width: 50.0%;
        margin-right: 0.0%;
        margin-left: 0.0%;
        float: left;
    }
}

/* end

/* aligning menu items for mobile menu file

.mobilemenu_fix {
    float: left;
    vertical-align: middle;
}