@charset "UTF-8";
/* CSS Document */

p, blockquote, form, label, ul, ol, dl, fieldset, address {
    margin-bottom: 15px;
}  
header h1, header h2, footer h1, footer h2, 
html, html * { 
    box-sizing: border-box; 
    padding: 0; margin: 0; 
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; 
    font-weight: normal; 
}
img, object, embed, video { max-width: 100%; }
/* IE 6 does not support max-width so default to width 100% */
.ie6 img { width:100%; }
h1, h2, h3, h4, .makeTimes { 
    margin:0; padding:0; 
    font-family: Times, "Times New Roman", "serif"; 
}
img, audio { width:100%; }
strong { font-weight: bold; }
ul {
  display: block;
  list-style-type: disc;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
  padding-left: 30px;
}

.clearB { clear:both; }

.txt9 { font-size:9px; }
.txt10 { font-size:10px; }
.txt11 { font-size:11px; }
.txt12 { font-size:12px; }
.txt14 { font-size:14px; }
.txt15 { font-size:15px; }
.txt16 { font-size:16px; }
.txt18 { font-size:18px; }
.txt20 { font-size:20px; }
.txt1em { font-size: 1em; }
.big { font-size: 1.15em; }
.big1 { font-size: 1.25em; }
.padTB10 { padding:10px 0; }
.padTB20 { padding:20px 0; }

.txtLeft, .textLeft { text-align:left; }
.txtRight { text-align:right; }
.txtCenter, .centerText { text-align:center; }
.caps { text-transform: capitalize; }
.allCAPs { text-transform: uppercase; }
.UpperCase { text-transform: uppercase; }
.letterSpacing-2 { letter-spacing: -2px; }
.letterSpacingX3 { letter-spacing: 3px; }
.fontWeightNormal, .normalH123456 { font-weight: normal; }

.hr80c { width:80%; margin:25px 10%; }
.item { margin-bottom: 15px; }
.brown { color: #664300; }
.red { color: red; } 
.green { color: #6c3; } 
.wht { color: #FFF; }
#GRAY, .gray { color:#222; } /* was #aaa */
#GRAY, p { margin-bottom: 15px; }
.gray50, .grey99, .gray70, #txtIMGgigs .gray70 { color: #999; }
.gray30 { color:#CCC; }

.brandColor01, .brandLink01, .brandLink01:visited { color: #6c3; text-decoration: none; }
.brandColor02, .brandLink02, .brandLink02:visited { color: #c1b580; text-decoration: none; }
.brandColor03, .brandLink03,  .brandLink03:visited { color: #664300; text-decoration: none; }
.brandColor04, .brandLink04,  .brandLink04:visited { color: #2350aa; text-decoration: none; }
.brandLink01:hover, .brandLink02:hover, .brandLink03:hover, .brandLink04:hover { color: #69F; }

a.noDeco, a.noDeco:visited { text-decoration:none; color: #2350aa; }
a.noDecoBlack, a.noDecoBlack:visited { text-decoration:none; color: #555; } 
a.noDecoWht, a.noDecoWht:visited { text-decoration:none; color: #FFF; }
a.noDeco:hover, a.noDecoBlack:hover { color: #c1b580; } 
a.noDecoWht:hover { color: #adf; }

img.turn2grayIMG {
  filter: none;
  cursor: grab;
  cursor: -webkit-grab;
  -webkit-filter: grayscale(0%);
}
img.turn2grayIMG:hover, img.makeIMGgray {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

#s, #s:visited { 
    background: none!important;
    border: none;
    padding: 0!important;
    color: #69F;
    text-decoration: none;
    cursor: pointer; 
    font-weight: normal;
}
#s:hover { color: #025; }

#social a, #social a:visited { color: #c1b580; text-decoration: none; } #social a:hover { color: #222; }

.branding1 { color: #6c3; font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"; font-weight: normal; text-decoration: none; }
.branding2, .branding2:visited { color: #c1b580; font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"; font-weight: normal; text-decoration: none; }
.branding3, .branding3:visited, input[type="text"] { color: #664300; font-weight: normal; text-decoration: none; }
.branding4, .branding4:visited { color: #2350aa; font-weight: normal; text-decoration: none; }
a.branding1, a.branding1:visited { color: #6c3; font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"; font-weight: normal; text-decoration: none; }  
a.branding1:hover, a.branding2:hover, a.branding3:hover, .branding4:hover, input[type="text"]:hover  { color: #222; }

.branding1BG { background-color: #0b0; }  
.branding2BG { background-color: #c1b580; }  
.branding3BG { background-color: #664300; }  
.branding4BG { background-color: #2350aa; }

/* iPhone Layout: 481px and below. */

body { font-size: 16pt; background-color: #777; color: #222; }

header { position: relative; width: 100%; z-index: 10; }
header, main, footer { position: relative; width: 100%; z-index: 10; }
main, footer { max-width: 924px; width: 100%; margin: 0 auto; }
main { padding: 0; }
.page25BG { background-color: #FFF; padding-bottom: 10px; width: 100%; }

main, footer { max-width: 904px; width: 100%; margin: 0 auto; z-index: 10; }
footer { background-color: #f2e; }


#ourPage { position: relative; width: 90%; margin: 0 auto; }
#ourPage .logo25 { position: absolute; top: 100pt; left: 0; max-width: 924px; width: 98%; display: block; z-index: 1; }
header .nameIDetc { float: left; width: 90%; text-align: left; display: block; }
header .nameIDetc img, footer .nameIDetc img { width: 18px; vertical-align: middle; }
header .nameIDetc h1 { font-size: 0.8em; text-transform: capitalize; color: #664300; margin: 8px 0 0 0; }
footer .nameIDetc h1 { font-size: 0.8em; text-transform: capitalize; color: #FFF; }
footer .boxbf1 h1 { font-size: 0.8em; text-transform: capitalize; color: #FFF; }
header .nameIDetc h2, footer .nameIDetc h2 { font-size: 0.5em; text-transform: capitalize; color: #c1b580; }
header .nameIDmenu { display: none; }
header .nameIDicon { float: right; width: 10%; text-align: right; font-size: 35pt; display: block; }
header .nameIDicon a, header .nameIDicon a:visited { color: #c1b580; padding: 0 10px; text-decoration: none; display: inline-block; }
header .nameIDicon a:hover { color: #fff; background-color: #664300; }



.buttonROCK, .buttonROCK:visited {
/* Start the shake animation and make the animation last for 0.5 seconds */
animation: shake1 0.5s;
background-color: #2350aa; /* brandBG01 */
}
.buttonROCK1, .buttonROCK1:visited {
/* Start the shake animation and make the animation last for 0.5 seconds */
animation: shake2 0.5s;
background-color: #2350aa; /* brandBG01 */
}
.buttonROCK2, .buttonROCK2:visited {
/* Start the shake animation and make the animation last for 0.5 seconds */
animation: shake2 0.5s;
background-color: #c87e2e; /* brandBG02 */
}
.buttonROCK3, .buttonROCK3:visited {
/* Start the shake animation and make the animation last for 0.5 seconds */
animation: shake1 0.5s;
background-color: #664300; /* brandBG03 */
}
.buttonROCK4, .buttonROCK4:visited {
/* Start the shake animation and make the animation last for 0.5 seconds */
animation: shake2 0.5s;
background-color: #c1b580; /* brandBG04 */
}
.buttonROCK, .buttonROCK:visited, .buttonROCK1, .buttonROCK1:visited, .buttonROCK2, .buttonROCK2:visited, .buttonROCK3, .buttonROCK3:visited, .buttonROCK4, .buttonROCK4:visited {
    padding: 30px 40px;
    font-size: 2em;
    color: #FFF;
    border: none;
    text-align: center;
    text-decoration: none;
    display: inline-block;

  /* When the animation is finished, start again */
  animation-iteration-count: infinite;
}
.buttonROCK:hover, .buttonROCK2:hover, .buttonROCK3:hover, .buttonROCK4:hover { color: #FFF; background-color: #999; text-decoration: none; }

@keyframes shake1 {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  35% { transform: translate(1px, -1px) rotate(-0.5deg); }
  70% { transform: translate(-1px, 1px) rotate(0deg); }
  100% { transform: translate(0px, -1px) rotate(0.5deg); }
}

@keyframes shake2 {
  0% { transform: translate(0px, -1px) rotate(0deg); }
  35% { transform: translate(-1px, 1px) rotate(-0.5deg); }
  70% { transform: translate(1px, -1px) rotate(0deg); }
  100% { transform: translate(0px, 0px) rotate(0.5deg); }
}

.rounded_corners5 { 
	-moz-border-radius: 5px 5px 5px 5px; 
	-webkit-border-radius: 5px 5px 5px 5px; 
	-khtml-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
}
.rounded_corners5_top { 
	-moz-border-radius: 5px 5px 0 0; 
	-webkit-border-radius: 5px 5px 0 0; 
	-khtml-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
}
.rounded_corners5_bottum { 
	-moz-border-radius: 0 0 5px 5px; 
	-webkit-border-radius: 0 0 5px 5px; 
	-khtml-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
}
.rounded_corners { 
	-moz-border-radius: 20px 20px 20px 20px; 
	-webkit-border-radius: 20px 20px 20px 20px; 
	-khtml-border-radius: 20px 20px 20px 20px;
	border-radius: 20px 20px 20px 20px;
}
.rounded_corners_top { 
	-moz-border-radius: 20px 20px 0px 0px; 
	-webkit-border-radius: 20px 20px 0px 0px; 
	-khtml-border-radius: 20px 20px 0px 0px;
	border-radius: 20px 20px 0px 0px;
}
.rounded_corners_bottum { 
	-moz-border-radius: 0px 0px 20px 20px; 
	-webkit-border-radius: 0px 0px 20px 20px; 
	-khtml-border-radius: 0px 0px 20px 20px;
	border-radius: 0px 0px 20px 20px;
}
.rounded_corners60 { 
	-moz-border-radius: 60px 60px 60px 60px; 
	-webkit-border-radius: 60px 60px 60px 60px; 
	-khtml-border-radius: 60px 60px 60px 60px;
	border-radius: 60px 60px 60px 60px;
}



/* Float Boxs web 3 pad 2 Phone 1 */
.box121, .box211, .box221, .box231, .box311, .box321, .box411, .box421, .box511, .box521, .box531, .box532, .box541, .boxf1, .boxf3 {
    margin:0 0 15px 1.5%;;
    vertical-align: text-top;
    display:inline-block;
}
.box121, .box211, .box221, .box231, .box311, .box321, .box411, .box421, .box511, .box521, .box531, .box541, .boxf1, .boxf2, .boxf3 { width:96.5%; }
.box532 { width:48.5%; }

.imgFloatRight { float: none; width: 90%; margin: 0 0 10px 5%; display: block; }

.show001, .show010, .show011, .boxf2 { display:none; }
.show100, .show101, .show110 { display:block; }

a.sideMENU, a.sideMENU:visited {
    font-size: 12px;
    text-decoration: none;
    text-align: center;
    color: #000;
    background-color: #FFF;
    padding: 4px 10px;
    border-top: 1px solid #CCC;
    border-right: 1px solid #CCC;
    border-left: 1px solid #AAA;
    border-bottom: 1px solid #AAA;
    display: block;
}
a.sideMENU:hover {
    color: #FFF;
    background-color: #555;
}

#mainWside .leftContent { 
	float:none;
	width:96%;
	padding:15px 0 0 0;
	margin:0 0 0 2%;
	display:block;
}
#mainWside .rightContent {
	float:none;
	width:96%;
	padding:15px 0 0 0;
	margin:0 0 0 2%;
	display:block;
}

/* iPad Layout: 481px and above. */
    @media only screen and (min-width: 481px) {
    
    body { font-size: 18pt; }
        
    #ourPage .logo25 { position: absolute; top: 200pt; left: 0; width: 98%; z-index: 1; }
    header .nameIDetc { float: left; width: 50%; text-align: left; display: block; }
    header .nameIDmenu { display: none; }
    

    /* Float Boxs web 3 pad 2 Phone 1 */
    .box121, .box221, .box321, .box421, .box521, .boxf1, .boxf3 { width:47.5%; } .boxf1 { text-align: left; } .boxf3 { text-align: right; }
    .box211, .box411 {
        width:98.5%;
        margin:0 0 15px 1.5%;
        vertical-align: text-top;
        display:inline-block;
    }
    .box231, .box531, .box532 { width:30.5%; }
    .box541 { width:22.5%; margin: 0 0.5% 0 0; }

    a.sideMENU, a.sideMENU:visited { display: inline-block; }

    .show001, .show100, .show101, .boxf2 { display:none; }
    .show010, .show011, .show110 { display:block; }


    }


/* webpage Layout: 769px and above. */
        @media only screen and (min-width: 769px) {
    
        body { font-size: 16pt; }
        
    
        #ourPage .logo25 { position: absolute; top: 10pt; left: 0; width: 70%; z-index: 1; }
        header .nameIDetc { float: left; width: 30%; }
        header .nameIDmenu { float: right; width: 60%; font-size: 10pt; text-align: right; display: block; }
        header .nameIDmenu .menuBOXS { float: none; text-align: center; padding: 10px 0; margin: 0 1px 0 0; display: inline-block; }
        header .nameIDmenu .menuBOXS a, header .nameIDmenu .menuBOXS a:visited { color: #664300; padding: 5px; text-decoration: none; display: inline-block; }
        header .nameIDmenu .menuBOXS a:hover { color: #fff; background-color: #664300; }
        header .nameIDicon { display: none; }

        /* Float Boxs web 3 pad 2 Phone 1 */
        .box211, .box221, .box231 { width:47%; }
        .box311, .box321, .boxf1, .boxf2, .boxf3 { width:30%; } .boxf2 { display: inline-block; text-align: center; }
        .box411, .box421 { width:22.5%; }
        .box511, .box521, .box532, .box541, .box531 { width:16.5%; }
        .box121 {
            width:97%;
            margin:0 0 15px 1.5%;;
            vertical-align: text-top;
            display:inline-block;
        }
        a.sideMENU { display: block; }
            
        .imgFloatRight { float: right; width: 45%; margin: 0 0 3px 15px; display: block; }
    
        #mainWside .leftContent {
            float: left; 
            width: 78%; 
            margin: 0; 
            padding: 0; 
            display: block;
        }
        #mainWside .rightContent {
            float: right; 
            width: 20%; 
            margin: 0;
            padding:0 0 15px 0;
            display:block;
}
            
        .show001, .show101, .show011 { display:block; }
        .show100, .show010, .show110 { display:none; }  
            
}