@font-face {
	font-family: Cooper Hewitt;
	src: url('../font/CooperHewitt-Medium.eot');
	src: url('../font/CooperHewitt-Medium.ttf') format('truetype');
}

html { 
  font-family: Cooper Hewitt; 
  color: #F9FBB9;
}

body {
  background-color: #000000;
  background-image: url('../images/background1.jpg');
}

td {
  vertical-align: top;
}

a {
  color: #000000;
  text-decoration:underline;  
}

#wrapper {
  width: 1190px; 
  background-color: #61201f;
  margin-right: auto; 
  margin-left: auto; 
  text-align: center;
}

#header {
  width: 1170px; 
  margin-top: 0px; 
  margin-right: 10px; 
  margin-left: 10px; 
}

h1 {
  margin: 0.17em 0 0 0;
  font-family: Georgia; 
  font-size: 3em;
  font-weight: normal;
  color: #07e1e6;
}

#navigation { 
  width: 1170px;
  margin-top: 0px; 
  margin-bottom: 0px; 
  margin-left: -20px;
  padding-right: 10px;
  padding-bottom: 0px; 
  padding-left: 10px;
}

#navigation ul {
  margin-top: 0px; 
  margin-bottom: 0px; 
} 

#navigation ul li { 
  display: inline-block; 
} 

#navigationTouch { 
  display: none; 
}

#wideTopSidebar {
  width: 300px; 
  height: 524px;
  float: left;
  background-color: #c0e4e9;
  margin-left: 50px;
  text-align: left;
  font-size: .85em;
  color: #000000;
}

#mainImage {
  width: 770px;
  float: right;
  margin-right: 50px; 
  margin-left: 10px;
}

.frostwater01-19770320 {
  width: 770px;
  height: auto;
}

#mainCaption {
  width: 770px; 
  height: 30px;
  float: right;
  background-color:#000000; 
  margin-right: 50px; 
  margin-left: 10px;
  font-size:.75em; 
} 

#wideContent {
  width: 1090px;
  float: left; 
  margin-top: 20px;
  margin-right: 50px; 
  margin-left: 50px;
  vertical-align: top;
  text-align: center;
  font-size: .85em;
  color: 000000;
}

.wideContentTable {
  background-color: #000000;
}

.wideContentTableRight {
  width: 300px;
  background-color: #c0e4e9;
  text-align: center;
  font-size: .85em;
  color: #000000;
} 

#mediumContent {
  display: none;
}

#tabletContent {
  display: none;
} 

#smallContent {
  display: none;
} 

#social {
  width: 1170px; 
  margin-top: 0px;
  margin-left: -12px;
  clear: both;
}

#social ul { 
  margin-top: 20px; 
  margin-bottom: 0px; 
} 

#social ul li { 
  display: inline-block;
}

#socialTouch { 
  display: none; 
}

#copyright {
  margin-top: 20px;
  margin-right: 10px;
  margin-left: 10px;
  width: 1170px; 
}

/* medium */
@media screen and (max-width: 1250px) {
  #wrapper {
    width: 870px; 
    background-color: #61201f;
    margin-right: auto; 
    margin-left: auto; 
    text-align: center;
  }

  #header {
    width: 850px; 
    margin-top: 0px; /* */
    margin-right: 10px; 
    margin-left: 10px; 
  }

  h1 {
    margin: 0.17em 0 0 0;
    font-family: Georgia; 
    font-size: 3em;
    font-weight:normal;
    color:#07e1e6;
  }

  #navigation { 
    width: 850px;
  }

  #wideTopSidebar {
    display: none;
  }

  #mainImage {
    width: 770px;
    float: none;
    margin-right: auto; 
    margin-left: auto;
  }

  .frostwater01-19770320 {
    width: 770px;
    height: auto;
  }

  #mainCaption {
    float: none;
    width: 770px; 
    background-color: #000000; 
    height: 30px;
    margin-right: auto; 
    margin-left: auto;
    font-size: .75em; 
  } 

  #wideContent {
    display: none;
  }

  #mediumContent {
    display:block;
    margin-right: 50px; 
    margin-left: 50px;
  } 

  .mediumContentTable {
    width: 770px;
    background-color: #ffffff;
    text-align: left;
    font-size: .85em;
    color: #000000;
  } 

  .mediumContentLeft {
    width: 300px;
    background-color: #c0e4e9;
  } 

  .mediumContentTableRight {
    width: 470px;
    background-color: #ffffff;
  } 

  #social {
    width: 850px; 
    margin-top: 0px;
    margin-left: -12px;
    clear: both;
  }

  #social ul {  /* */
    margin-top: 20px; 
    margin-bottom: 0px; 

 } 

  #social ul li { 
    display: inline-block;
  }

  #copyright {
    width: 850px; 
    margin-top: 20px;
    margin-right: 10px;
    margin-left: 10px;
 }
}

/* tablet */
@media screen and (max-width: 870px) {
  #wrapper {
    width: 100%; /* Holding outermost DIV (870 ÷ 870)  */
    background-color: #61201f;
    margin-right: auto; 
    margin-left: auto; 
    text-align: center;
  }

  #header {
    width: 97.770114943%; /* 850 ÷ 870 */
    margin-top:0px; 
    margin-right: 10px; 
    margin-left: 10px; 
  }

  h1 {
    margin: 0.17em 0 0 0;
    font-family: Georgia; 
    font-size: 3em;
    font-weight:normal;
    color:#07e1e6;
  }

  #navigation { 
    width: 97.770114943%; /* 850 ÷ 870 */
    margin-top: 0px; 
    margin-bottom: 0px; 
    margin-left: -20px;
    padding-right: 10px;
    padding-bottom: 0px; 
    padding-left: 10px;
  }

  #navigation ul {  /* */
    margin-top: 0px; 
    margin-bottom: 0px; 
  } 

  #navigation ul li { 
    display: inline-block; 
  } 

  #wideTopSidebar {
    display: none;
  }

  #mainImage {
    width: 97.770114943%; /* 850 ÷ 870 */
    float: none;
    margin-right: auto; 
    margin-left: auto;
  }

  .frostwater01-19770320 {
    width: 90.58823529%; /* 770 ÷ 850 */
    height:auto;
  }

  #mainCaption {
    width: 88.50574713%; /* 770 ÷ 870 */
    height: 30px;
    float: none;
    margin-right: auto; 
    margin-left: auto;
    font-size:.75em; 
  } 

  #wideContent {
    display: none;
  } 

  #mediumContent {
    display: none;
  }

  #tabletContent {
    width: 88.50574713%; /* 770 ÷ 870 */
    background-color: #ffffff;
    display: block;
    margin-right: auto; 
    margin-left: auto;
  } 

  .tabletContentTable {
    width: 100%;
    font-size: .85em;
    color: 000000;
    vertical-align: top;
  }

  .tabletContentLeft {
    width: 300px;
    background-color: #c0e4e9;
    vertical-align: top;
    text-align: left;
    color: #000000;
  } 

  #social {
    width: 97.770114943%; /* 850 ÷ 870 */
    clear: both;
    margin-top: 20px;
    margin-left: -12px;
  }

 #social ul li { 
    display: inline-block;
  }

  #copyright {
    width: 97.770114943%; /* 850 ÷ 870 */
    margin-top: 20px;
    margin-right: 10px;
    margin-left: 10px;
  }
}

/* small */
@media screen and (max-width: 700px) {
  #wrapper {
    width: 100%; 
    background-color: #61201f;
    margin-right: auto; 
    margin-left: auto; 
    text-align: center;
  }

  #navigation { 
    display: none; 
  }

  #navigationTouch { 
    width: 100%; 
    display: block; 
    margin-top: 0px; 
    margin-bottom: 0px; 
    margin-left: -20px;
    padding-right: 0px;
    padding-bottom: 0px; 
    padding-left: 0px;
  }

  #navigationTouch ul {
    margin-top: 0px; 
    margin-right: 0px;
    margin-bottom: 0px; 
    margin-left: 0px;
  } 

  #navigationTouch ul li { 
    display: inline-block; 
  }   

  .touchButton {
    width: auto;
    height: 44px; 
  }

  #mainCaption {
    height: 3.44827586%; /* 30 ÷ 870 */
    font-size: .69em; 
  } 

  #wideContent {
    display: none;
  } 

  #mediumContent {
    display: none;
  } 

  #tabletContent {
    display: none;
  } 

  #smallContent {
    width: 88.50574713%; /* 770 ÷ 870 */
    background-color: ffffff;
    display: block;
    margin-right: auto; 
    margin-left: auto;
  } 

  .smallContentTable {
    width: 100%;
    font-size: .75em;
    color: 000000;
 }

 .smallContentLeft {
    width: 50%;
    background-color: #c0e4e9;
    color: 000000;
  }

  #social {
    display: none; 
  }

  #socialTouch {
    width: 100%; 
    display: block; 
    clear: both;
    margin-top: 0px;
    margin-left: -12px;
  }

  #socialTouch ul { 
    margin-top: 20px; 
    margin-bottom: 0px; 
  } 

  #socialTouch ul li { 
    display: inline-block;
  }

  .touchSocial {
    width: auto;
    height: 41px; 
  }
}

@media screen and (max-width: 500px) {
  .touchButton {
    width: auto;
    height: 41px; 
  }

  #mainCaption {
    height: 3.44827586%; /* 30 ÷ 870 */
    font-size: .61em; 
  } 

  .smallContentTable {
    font-size: .65em;
  }

  .touchSocial {
    width: auto;
    height: 38px; 
  }
}


@media screen and (max-width: 400px) {
  .touchButton {
    width: auto;
    height: 35px; 
  }

  #mainCaption {
    height: 3.44827586%; /* 30 ÷ 870 */
    font-size: .55em; 
  } 

  .smallContentTable {
    font-size: .55em;
  }

  .touchSocial {
    width: auto;
    height: 32px; 
  }
}


@media screen and (max-width: 350px) {
  .touchButton {
    width: auto;
    height: 29px; 
  }

  #mainCaption {
    height: 3.44827586%; /* 30 ÷ 870 */
    font-size: .49em; 
  } 

  .touchSocial {
    width: auto;
    height: 26px; 
  }
}

A.link:link    {color:#FF6600; text-decoration:none; font-weight:bold}
A.link:visited {color:#FF6600; text-decoration:none; font-weight:bold}
A.link:active  {color:#FF6600; text-decoration:underline; font-weight:bold}
A.link:hover   {color:#FF6600; text-decoration:underline; font-weight:bold}

A.navLink:link    {color:#FF6600; text-decoration:none; font-weight:normal}
A.navLink:visited {color:#FF6600; text-decoration:none; font-weight:normal}
A.navLink:active  {color:#FF6600; text-decoration:underline; font-weight:bold}
A.navLink:hover   {color:#FF6600; text-decoration:underline; font-weight:bold}

A.mp3Link:link    {color:#FF6600; text-decoration:none; font-weight:normal}
A.mp3Link:visited {color:#FF6600; text-decoration:none; font-weight:normal}
A.mp3Link:active  {color:#FF6600; text-decoration:underline; font-weight:bold}
A.mp3Link:hover   {color:#FF6600; text-decoration:underline; font-weight:bold}

A.HOLD:link    {color:#FFFFFF; text-decoration:none; font-weight:bold}
A.HOLD:visited {color:#FFFFFF; text-decoration:none; font-weight:bold}
A.HOLD:active  {color:#FFFFFF; text-decoration:underline; font-weight:bold}
A.HOLD:hover   {color:#FFFFFF; text-decoration:underline; font-weight:bold}