/*  Alternate Tools V 15
(C) 2019 by Alternate Tools
2015-05-30 (V12.1 - added responsive)
2015-05-31 (V12.2 - correction for contact input)
2018-03-17 (V12.3 - correction navi width)
-----------------------------------------------------

File:         alternatetools.css
Description:  Main page CSS stylesheet

*/

/*  Custom fonts
-----------------------------------------------------*/
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 400;
  src: local('Asap'), local('Asap'), url(../fonts/Asap.woff) format('woff');
}
@font-face {
  font-family: 'Sintony';
  font-style: normal;
  font-weight: 400;
  src: local('Sintony'), local('Sintony'), url(../fonts/Sintony.woff) format('woff');
}

/* Body format
-------------------------------------------------------------------------------
*/
body
{
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-family: Sintony,Arial,Tahoma,sans-serif;
  color: #0C0C0C;
  font-size: 16px;
  background-color: #363D47;
}

/* Div container formats
-------------------------------------------------------------------------------
*/
.div_upper
{
  width: 100%;
  height: 100px;
  background-color: #3A4E6B;
}
.div_upper_container
{
  width: 1000px;
  background-color: #001940;
  height: 100px;
}
.div_upper_title
{
//  width: 720px;
  padding-top: 50px;
  padding-left: 240px;
  text-align: left;
  font-family: Tahoma,Verdana,sans-serif;
  font-size: 28px;
  font-weight: bold;
  float: left;
  color: #FCFCFC;
  text-shadow: 1px  1px 2px black, 1px -1px 2px black, -1px  1px 2px black, -1px -1px 2px black;
}
.div_upper_logo
{
  padding-top: 2px;
  padding-bottom: 2px;
  text-align: right;
  float: right;
}
.div_upper_space
{
  height: 8px;
  width: 100%;
  background-color: #2A3E5B;
  font-size: 4px;
}

.div_middle
{
  width: 100%;
  min-height: 400px;
// height: 400px;
  background-color: #FBF9FD;
}
.div_middle_container
{
  width: 1000px;
  background-color: #FFFFFF;
  text-align: left;
}
.div_middle_navi
{
  margin-top: 10px;
  margin-left: 10px;
  margin-bottom: 10px;
  float: right;
  width: 210px;
}
.div_middle_content
{
  margin-top: 10px;
  margin-left: 30px;
  margin-bottom: 10px;
  float: right;
  width: 730px;
}

.div_footer_space
{
  height: 5px;
  width: 100%;
  background-color: #505A69;
  font-size: 4px;
}

.div_footer
{
  width: 1000px;
  height: 100px;
  text-align: left;
}

.div_footer_navi
{
  width: 680px;
  margin-top: 10px;
  margin-left: 20px;
  color: #FCFCFC;
  font-family: Sintony,Arial,Tahoma,sans-serif;
  font-size: 16px;
}
.div_footer_copyright
{
  width: 370px;
  margin-top: 30px;
  margin-left: 530px;
  text-align: right;
  float: left;
  font-family: Sintony,Arial,Tahoma,sans-serif;
  font-size: 13px;
  color: #ECECEC;
}
.div_footer_image
{
  width: 50px;
  margin-left: 10px;
  margin-top: 20px;
  float: left;
  text-align: right;
  opacity: 0.4;
}

/* Navigation formats
-------------------------------------------------------------------------------
*/
.div_navi_side_title
{
  color: #FCFCFC;
  font-family: Asap,Arial,Tahoma,sans-serif;
  background-color: #001940;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  float: left;
  display: block;
  margin-top: 2px;
  margin-left: 2px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 2px;
  padding-bottom: 2px;
  height: 24px;
  float:bottom;
  width: 196px;
//  width: 198px;
}
a.navi_side:link, a.navi_side:visited
{
  color: #FCFCFC;
  font-family: Asap,Arial,Tahoma,sans-serif;
  background-color: #969DA7;
  font-size: 16px;
  text-decoration: none;
  float: left;
  display: block;
  margin-top: 1px;
  margin-left: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 2px;
  padding-bottom: 2px;
  height: 24px;
  float:bottom;
  width: 188px;
//  width: 190px;
}
a.navi_side:hover, a.navi_side:active
{
  color: #FCFCFC;
  font-family: Asap,Arial,Tahoma,sans-serif;
  font-size: 16px;
  text-decoration: underline;
  float: left;
  display: block;
  background-color: #666D77;
  margin-top: 1px;
  margin-left: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 2px;
  padding-bottom: 2px;
  height: 24px;
  float:bottom;
  width: 188px;
//  width: 190px;
}

a.navi_bottom:link, a.navi_bottom:visited
{
  color: #FCFCFC;
  font-family: Sintony,Arial,Tahoma,sans-serif;
  font-size: 16px;
  text-align:center;
  text-decoration: none;
  float: left;
  display: block;
  margin-left: 10px;
  margin-right: 10px;
  padding-left: 10px;
  padding-right: 10px;
  margin-top: 2px;
  height: 23px;
}
a.navi_bottom:hover, a.navi_bottom:active
{
  color: #FCFCFC;
  font-family: Sintony,Arial,Tahoma,sans-serif;
  font-size: 16px;
  text-align:center;
  text-decoration: underline;
  text-align:center;
  float: left;
  display: block;
  background-color: #666D77;
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 2px;
  padding-left: 10px;
  padding-right: 10px;
  height: 23px;
}
.span_navi_bottom_space
{
  float: left;
}
a:link, a:visited
{
  color: #363D47;
}
a:hover, a:active
{
  color: #565D67;
}

.btn_download
{
  hover:expression(this.onmouseover=new Function("this.style.background='#001940';"),
                   this.onmouseout=new Function("this.style.background='#3A4E6B';"));
  white-space: normal;
  width: 200px;
  height: 60px;
  border-radius: 8px;
  background-color: #3A4E6B;
  color: #FCFCFC;
  font-weight: bold;
  font-size: 14px;
  border: 0px;
  cursor: pointer;
}
.btn_download:hover
{
  background-color: #001940;
  color: #FFFFFF;
}

/*  General formats

-----------------------------------------------------*/
img
{
  border: 0;
}

/* General format for other html elements
-------------------------------------------------------------------------------
*/
p,ul,ol,li,div,td,th,address,blockquote,nobr,b,i,input
{
  font-family: Sintony,Arial,Tahoma,sans-serif;
  color: #0C0C0C;
  font-size: 16px;
}

/* Size on small devices... (responsive)
-------------------------------------------------------------------------------
*/
@media only screen and (min-width: 150px) and (max-width: 600px)
{

  body
  {
    margin: 0 auto;
  }
  .div_upper
  {
    width: 100%;
    height: 189px;
  }
  .div_upper_container
  {
    width: 100%;
    text-align: center;
    height: 200px;
  }
  .div_upper_title
  {
    width: 100%;
    padding: 12px 0px 2px 0;
    text-align: center;
  }
  .div_upper_logo
  {
    width: 100%;
    padding: 2px 0px 2px 0;
    text-align: center;
  }
  .div_middle_container
  {
    width: 100%;
    text-align: left;
  }
  .div_middle_content
  {
    width: 96%;
    padding-left: 20px;
    margin: 5px 2% 5px 2%;
  }
  .img_preview
  {
    width: 100%;
  }
  iframe
  {
    width: 95%;
  }
  .btn_download
  {
    width: 100%;
  }
  .cont_input, .cont_input_multi
  {
    width: 85%;
  }
  .cont_input_small
  {
    width: 65%;
  }
  .div_middle_navi
  {
    width: 100%;
    margin: 5px 0px 5px 0px;
  }
  .div_navi_side_title
  {
    width: 100%;
    margin: 1px 0px 1px 0px;
    text-align: center;
    padding: 2px 0px 2px 0px;
  }
  a.navi_side:link, a.navi_side:visited, a.navi_side:hover, a.navi_side:active
  {
    width: 100%;
    margin: 1px 0px 1px 0px;
    text-align: center;
    padding: 2px 0px 2px 0px;
  }
  .div_footer
  {
    width: 100%;
  }
  .div_footer_navi
  {
    width: 100%;
//  height: 100px;
    text-align: center;
    margin: 0px 0px 0px 0px;
  }

  a.navi_bottom:link, a.navi_bottom:visited, a.navi_bottom:hover, a.navi_bottom:active
  {
    width: 100%;
    text-align: center;
    margin: 1px 0px 1px 0px;
    padding: 2px 0px 2px 0px;
  }
  .span_navi_bottom_space
  {
    visibility: hidden;
    height: 0px;
  }
  .div_footer_copyright
  {
    width: 100%;
    text-align: center;
    margin-top: 15px;
    margin-left: 0px;
  }
  .div_footer_image
  {
    visibility: hidden;
    height: 0px;
  }
  .dld_tbl
  {
    width: 100%;
  }
  .dld_tbltd1
  {
    width: 35%;
  }
  .dld_tbltd2
  {
    width: 65%;
  }
  .dld_tbltd2b
  {
    width: 65%;
    word-break: break-all;
    white-space: pre-wrap;
  }
}