@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800&subset=latin-ext);
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,600,700,800&subset=latin-ext);

*{ margin: 0; ma\rgin: 0; }
/* ----- */
HTML, BODY {
  margin: 0px;
  width: 100%; 
  /*height: 100%; /* HIDE 20190726 */
  /*overscroll-behavior-y: none; /* HIDE 20190726 */
}
HTML {
  background: #FFF; /* 114F6D */
  /*overflow-x: hidden; /* hide X-scroll in Firefox Mobile */
}
@media all and (min-width: 800px) 
{
BODY { 
  /*overflow: hidden; /*ADD 20190723 HIDE 20190726*/
}
}

TABLE, TR, TD, P, DIV, SPAN, BUTTON { 
/*
  margin: 0; 
  font-family: Arial,  Tahoma, Verdana; 
  font-size: 14px; 
  color: #444; 
  line-height: 140%; 
*/
}


HR { border: 0; color: rgba(0,0,0,0.15); background-color: rgba(0,0,0,0.15); height: 1px; }
UL { margin-left: 30px; padding: 0px; }

IFRAME { padding: 3px; border: 1px solid #DDD; }

/*DIV, P, SPAN, TABLE, TR, TD, BUTTON { margin: 0; font-size: 14px; color: #444; }*/
DIV, P, SPAN, TABLE, TR, TD, BUTTON { margin: 0; }

#SiteBox, #BodyAction, #BodyLoad, #BodyInfo {  
  font-family: 'Open Sans', sans-serif; 
  font-weight: 400; 
  font-style: normal; 
  font-size: 18px;
  line-height: 150%; 
  color: #444;
}
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (min-width: 1500px) and (min-height: 800px) 
{
/* TABLE, TR, TD, P, DIV, SPAN, BUTTON { font-size: 20px; } */

#SiteBox, #BodyAction, #BodyLoad, #BodyInfo { font-size: 20px; }
}



/* ALL */
/* ======================================================================================================================== */
A { text-decoration: none; color: #33ABB6; }
A:hover { text-decoration: underline; color: #33ABB6; }
/* ----- */
A.a_no { text-decoration: none; color: #444; }
A.a_no:hover { text-decoration: underline; color: #444; }
/* ----- */
A.a_no_col { text-decoration: none; color: #444; }
A.a_no_col:hover { text-decoration: underline; color: #33ABB6; }
/* ----- */
A.a_er { text-decoration: none; color: #000; }
A.a_er:hover { text-decoration: underline; color: #000; }
/* ------------------------------------------------------------------------------------------------------------------------ */
.woj { fill:#cccccc; cursor:pointer; }
.woj:hover { fill:#888888; cursor:pointer; }
.woj_on { fill:#888888; cursor:pointer; }
.woj_on:hover { fill:#888888; cursor:pointer; }
/* ------------------------------------------------------------------------------------------------------------------------ */
IMG.img_ns { float: left; padding: 2px; background: #FFF; border: 1px solid #DDD; margin: 2px 10px 5px 0px; 
             -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
/* ----- */
IMG.img_mix { padding: 3px; background: #FFF; border: 1px solid #DDD; margin: 5px 0px; 
              -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
/* ----- */
IMG.img_gal { float: left; padding: 2px; background: #F1F1F1; border: 2px solid #CCC; margin: 0px 15px 15px 0px; 
              -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
IMG.img_gal:hover { padding: 1px; background: #F1F1F1; border: 3px solid #BBB; }
/* ----- */
IMG.img_gal_full { float: left; padding: 2px; background: #F1F1F1; border: 2px solid #CCC; margin: 0px 25px 25px 0px; 
                   -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
IMG.img_gal_full:hover { padding: 1px; background: #F1F1F1; border: 3px solid #BBB; }
/* ------------------------------------------------------------------------------------------------------------------------ */
IMG.ico_mailing { float: left; padding: 2px; margin: -5px 5px 5px 0px; border: 0px none; }
/* ------------------------------------------------------------------------------------------------------------------------ */
OBJECT.obj_code { margin: 5px 0px; }
/* ------------------------------------------------------------------------------------------------------------------------ */
.d_both { clear: both; height: 0px; font-size: 0px; }
.both { clear: both; height: 0px; font-size: 0px; }
.none { display: none; }

#SiteStart { clear: both; height: 0px; font-size: 0px; }
/* ------------------------------------------------------------------------------------------------------------------------ */
.red { color: #FF0000; }
.redb { color: #FF0000; font-weight: bold; }
.green { color: #46A24B; }
.greenb { color: #46A24B; font-weight: bold; }
.statiker { color: #666; }
/* ------------------------------------------------------------------------------------------------------------------------ */
.d_er { padding: 10px 10px 10px 50px; margin: 10px 0px 15px; color: #311C00; background: #FFE3E3 url(pre_files/img/ico_er.gif) no-repeat left top; 
        border: 1px solid #FB5F5F; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.d_ok { padding: 10px 10px 10px 50px; margin: 10px 0px 15px; color: #311C00; background: #EBF9D1 url(pre_files/img/ico_ok.gif) no-repeat left top; 
        border: 1px solid #84B937; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
/* ------------------------------------------------------------------------------------------------------------------------ */
.d_ie6 { margin: auto; width: 960px; padding: 10px 10px 10px 50px; margin: 10px 0px; color: #311C00; 
         background: #FFE3E3 url(pre_files/img/ico_er.gif) no-repeat left top; border: 1px solid #FB5F5F; 
         -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
/* ------------------------------------------------------------------------------------------------------------------------ */
.d_ramka { padding: 10px; background: #FFF6EC; border: 1px solid #FBCB8E; }
.d_ico { padding: 25px 5px 10px; border-bottom: 1px solid #CCC; text-align: right; }
.d_pad { padding: 10px; }
/* ------------------------------------------------------------------------------------------------------------------------ */



#BodyLoad { width: 100%; height: 100%; position: fixed; top: 0; left: 0; overflow: auto; z-index: 99; background: rgba(255,255,255,1); } 
.Loader-Text { color: #2597A2; font-size: 16px; }
.Loader-SVG { height: 60px; border: 0px none; }
.Loader-Logo { width: 250px; border: 0px none; }

#BodyAction { width: 100%; height: 100%; position: fixed; top: 0; left: 0; overflow: auto; z-index: 99; background: rgba(0,0,0,0.5); } 
.BoxAction {
  display: inline-block; vertical-align: top;
  margin: 20px;
  width: 400px;
}
.BodyActionClose { float: right; margin-bottom: -5px; width: 40px; height: 40px; cursor: pointer; background: rgba(178,2,2,1); }
.BodyActionClose IMG { height: 40px; }
.BoxActionInfo {
  clear: both;
  padding: 15px;
  text-align: center;
  background: rgba(255,255,255,1);
  border: 5px solid rgba(178,2,2,1); 
}
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 600px) 
{
.BoxAction { width: auto; }
}



/* SUBMIT */
/* ------------------------------------------------------------------------------------------------------------------------ */
INPUT.submit 
{ 
  padding: 5px 20px; 

  font-family: 'Open Sans', sans-serif; 
  font-weight: 400; 
  font-style: normal; 
  font-size: 18px;
  line-height: 150%; 
  color: #FFF;

  background: #67D320; 

  border: 0px none;
  border-bottom: 2px solid #4CC423;

  cursor: pointer;

}
INPUT.submit:hover
{ 
  background: #4CC423; 
  background: -moz-linear-gradient(top, #4CC423 0%, #67D320 100%);
  background: -webkit-linear-gradient(top, #4CC423 0%,#67D320 100%);
  background: linear-gradient(to bottom, #4CC423 0%,#67D320 100%);

  border: 0px none;
  border-bottom: 2px solid #4CC423;
}
INPUT.submit:active, INPUT.submit:focus { -moz-outline: none; outline: none; }
/* ------------------------------------------------------------------------------------------------------------------------ */



/* HEAD / SHOWMORE */
/* ------------------------------------------------------------------------------------------------------------------------ */
.Head { 
  padding: 40px 30px 30px; text-align: center; 
  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 24px; line-height: 150%; /*color: #2597A2;*/

  background-repeat: no-repeat;
	background-size: 65px auto;
  background-image: url(cms.svg/Head-Down.svg);
  background-position: center bottom;
}

/* ----- */
.ShowMore { display: block; padding: 30px; text-align: center; }

.ShowMoreBut {
  padding: 12px 45px 12px 20px; 
  font-family: 'Open Sans', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 16px; line-height: 100%; color: #444; text-align: center;

  background-color: #FFF;
  background-repeat: no-repeat;
  background-size: auto 30px;
  background-image: url(cms.svg/ShowMore-But.svg);
  background-position: right 15px center;
  
  border: 2px solid rgba(0,0,0,0.10);

  -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;

  -webkit-transition: background 0.5s ease-out, border 0.5s ease-out;
  -moz-transition: background 0.5s ease-out, border 0.5s ease-out;
  -ms-transition: background 0.5s ease-out, border 0.5s ease-out;
  -o-transition: background 0.5s ease-out, border 0.5s ease-out;
  transition: background 0.5s ease-out, border 0.5s ease-out;

  cursor: pointer;
}

.ShowMoreBut:hover { background-color: #FFF; background-position: right 8px center; border: 2px solid rgba(0,0,0,0.15); }
.ShowMoreBut:active, .ShowMoreBut:focus { -moz-outline: none; outline: none; border: 2px solid rgba(0,0,0,0.15); }
/* ------------------------------------------------------------------------------------------------------------------------ */



/* FULL BOX */
/* ------------------------------------------------------------------------------------------------------------------------ */
.FullBox { 
	position: relative;

  display: block; /* table */
  width: 100%;
  height: 100vh;
  /*
  height: -moz-(100vh - 102px); 
  height: -webkit-calc(100vh - 102px); 
  height: calc(100vh - 102px);
  */
  /*min-height: 100%; height: 100% !important;*/
	
  background-repeat: no-repeat;
	background-size: cover;
  background-image: url(cms.files/slider/slider_index.jpg);
  background-position: center center;
  /*background-attachment: fixed;*/
  
  overflow: hidden; 
}
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 600px) { .FullBox { /*background-size: auto 100%; background-position: left -200px center;*/ } }
/* ------------------------------------------------------------------------------------------------------------------------ */

.FullLeftLine { 
  position: absolute; top: 0; left: 0; width: 2px; height: 100%; font-size: 0px; 
  background: rgba(255,255,255,0.25); 
}
/* ------------------------------ */
.FullTop { 
  position: relative; top: 0; left: 0; height: 20%;
  padding: 0px 50px; background-color: rgba(0,0,0,0.40); 
}


.FullLogo { position: absolute; top: 0; left: 30px; height: 100%; }
.FullLogo IMG { 
  height: 100%; opacity: 0.9; 

  -webkit-transition: opacity 0.5s ease-out;
  -moz-transition: opacity 0.5s ease-out;
  -ms-transition: opacity 0.5s ease-out;
  -o-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
}
.FullLogo IMG:hover { opacity: 1; }


.FullSlo { 
  position: absolute; bottom: 20px; right: 30px;

  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: italic; 
  font-size: 22px; /* line-height: 60px; */ color: #FFF; text-align: right;
  text-shadow: 1px 1px rgba(0,0,0,0.40); 

  opacity: 1;
  animation-name: aniIndSlo;
  animation-duration: 2s;
  animation-timing-function: ease;
  animation-delay: 2s;
}
@keyframes aniIndSlo {
  from { opacity: 0; right: -500px; }
  to { opacity: 1; right: 30px; }
}

/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (min-width: 1000px) and (min-height: 800px) { .FullTop { height: 18%; } }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-height: 400px) { .FullTop { height: 25%; } }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 1300px) 
{
.FullSlo { font-size: 20px; } 
}
@media all and (max-width: 1200px) 
{
.FullSlo { width: 280px; } 
}
@media all and (max-width: 1000px) 
{
.FullSlo { width: 250px; font-size: 18px; } 
}
@media all and (max-width: 800px), (max-height: 750px) 
{
.FullSlo { font-size: 18px; } 
}
@media all and (max-width: 600px) 
{
.FullLogo { left: 20px; }
.FullSlo { display : none; } 
}



/* FULL NEWS */
/* ------------------------------------------------------------------------------------------------------------------------ */
.FullNews {
  position: absolute; bottom: 60px; left: 0px; text-decoration: none;
  padding-left: 20px;
  padding-right: 50px;

  width: -moz-calc(100% - 70px); 
  width: -webkit-calc(100% - 70px); 
  width: calc(100% - 70px);
  
  background-color: rgba(0,0,0,0.4);
  background-repeat: no-repeat;
  background-size: auto 50px;
  background-image: url(cms.svg/FullNews-Go.svg);
  background-position: right 20px center;

  -webkit-transition: background 0.5s ease-out;
  -moz-transition: background 0.5s ease-out;
  -ms-transition: background 0.5s ease-out;
  -o-transition: background 0.5s ease-out;
  transition: background 0.5s ease-out;
}
.FullNews:hover { 
  text-decoration: none; 
  background-position: right 10px center;
}


.FullNewsIn { 
  padding: 15px 30px 15px; 

  width: -moz-calc(100% - 60px); 
  width: -webkit-calc(100% - 60px); 
  width: calc(100% - 60px);

  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 18px; line-height: 150%; color: #FFF; text-shadow: 1px 1px rgba(0,0,0,0.40);

  opacity: 1; 
  
  animation-name: aniIndNewsIn;
  animation-duration: 4s;
  animation-timing-function: ease;
  /*animation-delay: 2s;*/
}
@keyframes aniIndNewsIn {
  from { opacity: 0; margin-left: -500px; /*left: -500px;*/ }
  to { opacity: 1; margin-left: 0px; /*left: 0px;*/ }
}


.FullNewsIn SPAN { 
  font-family: 'Roboto', sans-serif; font-weight: 300; font-style: normal; 
  font-size: 14px; line-height: 150%; color: #FFF; text-shadow: 1px 1px rgba(0,0,0,0.40);
}



.FullNewsImg { 
  margin: -35px 20px 5px 0px;
  float: left; padding: 5px; width: 100px; height: 100px; text-align: center;
  border: 3px dashed rgba(255,255,255,0.75);
  -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;
}
.FullNewsImg IMG {
  width: 100px; height: 100px;
  -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;
}
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (min-width: 1000px) and (min-height: 800px) { .FullNewsIn { font-size: 20px; } .FullNewsIn SPAN { font-size: 16px; } }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-height: 400px) { .FullNews { display: none; } }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 800px) 
{
.FullNews { 
  bottom: 80px; 
  padding-left: 0px;
  padding-right: 40px;

  width: -moz-calc(100% - 40px); 
  width: -webkit-calc(100% - 40px); 
  width: calc(100% - 40px);

  background-position: right 10px center;
}
.FullNews:hover { 
  background-position: right center;
}

.FullNewsIn { 
  padding: 15px 20px 15px; 

  width: -moz-calc(100% - 40px); 
  width: -webkit-calc(100% - 40px); 
  width: calc(100% - 40px);

  font-size: 16px;
}
}
@media all and (max-width: 450px) 
{
.FullNewsIn SPAN { display: none; }

.FullNewsImg { width: 80px; height: 80px; }
.FullNewsImg IMG { width: 80px; height: 80px; }
}

/* ------------------------------------------------------------------------------------------------------------------------ */





/* FULL BOT */
/* ------------------------------------------------------------------------------------------------------------------------ */
.FullBot { position: absolute; bottom: 0; width: 100%; height: 40px; text-align: center; }
/* ----- */
.FullBotIn { text-align: center; font-size: 0px; }
.FullBot-Left, .FullBot-Right { 
  display: inline-block; vertical-align: top;
  width: -moz-calc((100% - 120px) / 2); 
  width: -webkit-calc((100% - 120px) / 2); 
  width: calc((100% - 120px) / 2); 
  height: 35px;
  border-bottom: 5px solid rgba(0,0,0,0.3); 
}

.FullBot-Down { 
  display: inline-block; vertical-align: top;

  padding-left: 36px; width: 80px; height: 40px; 

  text-align: center;
  font-family: 'Open Sans', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 15px; line-height: 40px; color: #FFF; text-shadow: 1px 1px rgba(0,0,0,0.40);
  
  background-color: rgba(0,0,0,0.6); 
  background-repeat: no-repeat;
  background-size: auto 30px;
  background-image: url(cms.svg/FullBot-Down.svg);
  background-position: left 10px top 4px;

  cursor: pointer;

  -webkit-border-top-left-radius: 3px; -moz-border-top-left-radius: 3px; border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px;

  -webkit-transition: background 0.5s ease-out;
  -moz-transition: background 0.5s ease-out;
  -ms-transition: background 0.5s ease-out;
  -o-transition: background 0.5s ease-out;
  transition: background 0.5s ease-out;
}

.FullBot-Down:hover { background-position: left 10px top 10px; }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 800px) 
{
.FullBot { height: 5px; background: rgba(0,0,0,0.3); }

.FullBotIn { display: none; }
}



/* CAT */
/* ------------------------------------------------------------------------------------------------------------------------ */
.CatBoxes { font-size: 0px; width: 100%; }
.CatBox { display: inline-block; vertical-align: top; /*width: 33.33%;*/ width: 25%; }

.CatBoxImg {
  display: block;
  position: relative;	height: 50vh; overflow: hidden; cursor: pointer;

  background-repeat: no-repeat;
  background-position: center center; 
  background-size: cover;
}
.CatBoxIn { 
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  
  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 24px; line-height: 160%; color: #FFF;

  -webkit-transition: background 0.5s ease-out, top 0.5s ease-out;
  -moz-transition: background 0.5s ease-out, top 0.5s ease-out;
  -ms-transition: background 0.5s ease-out, top 0.5s ease-out;
  -o-transition: background 0.5s ease-out, top 0.5s ease-out;
  transition: background 0.5s ease-out, top 0.5s ease-out;
}
/*
.CB1, .CB3, .CB5 { background-color: rgba(29,93,99,0.85); }
.CB2, .CB4, .CB6 { background-color: rgba(38,51,52,0.85); }
*/

.CB1, .CB3, .CB6, .CB8 { background-color: rgba(29,93,99,0.85); }
.CB2, .CB4, .CB5, .CB7 { background-color: rgba(38,51,52,0.85); }



.CatBoxGo {
  position: absolute; top: -100%; left: 0; width: 100%; height: 100%;

  -webkit-transition: top 0.5s ease-out;
  -moz-transition: top 0.5s ease-out;
  -ms-transition: top 0.5s ease-out;
  -o-transition: top 0.5s ease-out;
  transition: top 0.5s ease-out;
}


.CatBoxImg:hover .CatBoxIn { top: 100%; background-color: rgba(0,0,0,0.05); }
.CatBoxImg:hover .CatBoxGo { top: 0%; }


.CatBoxInV { 
  position: absolute;
  top: 50%; width: 100%; text-align: center;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  
  /*
  display: flex;
  justify-content: center;
  align-items: center;
  */
}
.CatBoxInV IMG { width: 40%; margin-bottom: 20px; }


.CatBoxBut {
  padding: 12px 45px 12px 20px; 
  font-family: 'Open Sans', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 16px; line-height: 100%; color: #FFF; text-align: center;
  
  border: 0px none;

  background-color: #2597A2;
  background-repeat: no-repeat;
  background-size: auto 30px;
  background-image: url(cms.svg/CatBox-But.svg);
  background-position: right 15px center;

  -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;

  -webkit-box-shadow: 0px 0px 10px 5px rgba(255,255,255,1);
  -moz-box-shadow: 0px 0px 10px 5px rgba(255,255,255,1);
  box-shadow: 0px 0px 10px 5px rgba(255,255,255,1);

  -webkit-transition: background 0.5s ease-out;
  -moz-transition: background 0.5s ease-out;
  -ms-transition: background 0.5s ease-out;
  -o-transition: background 0.5s ease-out;
  transition: background 0.5s ease-out;

  cursor: pointer;
}

.CatBoxBut:hover { background-color: #16767F; background-position: right 8px center; }
.CatBoxBut:active, .CatBoxBut:focus { -moz-outline: none; outline: none; border: 0px none; }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
/*
@media all and (max-width: 1000px) 
{ 
.CatBox { width: 50%; }
.CB1, .CB4, .CB5 { background-color: rgba(29,93,99,0.85); }
.CB2, .CB3, .CB6 { background-color: rgba(38,51,52,0.85); }
}
@media all and (max-width: 500px) 
{ 
.CatBox { width: 100%; }
.CB1, .CB3, .CB5 { background-color: rgba(29,93,99,0.85); }
.CB2, .CB4, .CB6 { background-color: rgba(38,51,52,0.85); }
}
*/


@media all and (max-width: 1400px) 
{
.CatBox { width: 50%; }
.CB1, .CB4, .CB5, .CB8 { background-color: rgba(29,93,99,0.85); }
.CB2, .CB3, .CB6, .CB7 { background-color: rgba(38,51,52,0.85); }
.CatBoxInV IMG { width: 25%; }
}
@media all and (max-width: 1200px) { .CatBoxInV IMG { width: 30%; } }
@media all and (max-width: 1000px) { .CatBoxInV IMG { width: 35%; } }
@media all and (max-width: 800px) { .CatBoxInV IMG { width: 40%; } }
@media all and (max-width: 550px) 
{ 
.CatBox { width: 100%; }
.CB1, .CB3, .CB5, .CB7 { background-color: rgba(29,93,99,0.85); }
.CB2, .CB4, .CB6, .CB8 { background-color: rgba(38,51,52,0.85); }
}
/* ------------------------------------------------------------------------------------------------------------------------ */



/* DIAG */
/* ------------------------------------------------------------------------------------------------------------------------ */
.DiagBox { display: block; position: relative; padding-bottom: 40%; /* 16:9 */ height: 0; overflow: hidden; }
.DiagBoxIn { position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*background: black;*/ }

.DiagImg0 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.DiagImg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 100%; }


.DiagInfo { position: absolute; top: 50px; left: 0; width: 100%; }

.DiagLogo { 
  width: 300px; max-width: 75%;
  margin-bottom: 20px; padding: 10px 20px; 
  background: #FFF;
  -webkit-border-top-right-radius: 3px; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px; -moz-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
}
.DiagLogo IMG { width: 100%; }

.DiagOpen { 
  display: inline-block; margin-bottom: 10px; padding: 10px 20px 8px 30px; 
  
  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 14px; line-height: 100%; color: #444; 
  
  background: rgba(255,255,255,0.75);
  -webkit-border-top-right-radius: 3px; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px; -moz-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
}
.DiagOpen SPAN { font-family: 'Roboto', sans-serif; font-weight: 600; font-style: normal; font-size: 16px; line-height: 100%; color: #444; }


.DiagGo { position: absolute; top: 0; right: 0; 
  width: 70px; height: 100%; 
  background-repeat: no-repeat;
  background-size: auto 75px;
  background-image: url(cms.svg/Diag-Go.svg);
  background-position: left center;
}

.DiagTop { position: absolute; top: 0; left: 0; width: 100%; height: 10px; background: rgba(255,255,255,0.25); }
.DiagBot { position: absolute; bottom: 0; left: 0; width: 100%; height: 10px; background: rgba(255,255,255,0.25); }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (min-width: 1500px) { .DiagBox { padding-bottom: 35%; } }
@media all and (min-width: 1800px) { .DiagBox { padding-bottom: 30%; } }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 1000px) { .DiagBox { padding-bottom: 60%; } }
@media all and (max-width: 800px) { .DiagBox { padding-bottom: 66%; } }
@media all and (max-width: 600px) { .DiagBox { padding-bottom: 75%; } }
@media all and (max-width: 450px) 
{
.DiagBox {
  padding-bottom: 0px;
  width: 100%;
  height: 100vh;
}
}
/* ------------------------------------------------------------------------------------------------------------------------ */




/* SLI */
/* ------------------------------------------------------------------------------------------------------------------------ */
.SliBox { position: relative;	padding-bottom: 30%; /* 16:9 */ height: 0; overflow: hidden; }
.SliBoxIn { position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*background: black;*/ }

.SliImg0 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.SliImg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 100%; }


.SliInfo { position: relative; top: 20px; left: 0px; /*width: 100%; height: 70px;*/ font-size: 0px; background: rgba(0,0,0,0.3); }

.SliLogo { 
  display: inline-block; vertical-align: top; 
  height: 60px; padding: 5px 20px;

  background: #FFF;
}
.SliLogo IMG { height: 100%; }

.SliIco { 
  display: inline-block; vertical-align: top;
  height: 50px; padding: 10px;
}
.SliIco IMG { height: 100%; }

.SliName { 
  display: inline-block; vertical-align: top;
  height: 70px;
  font-size: 24px; line-height: 70px; color: #FFF; }


.SliBot { position: absolute; bottom: 0; left: 0; width: 100%; height: 10px; background: rgba(0,0,0,0.20); }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (min-width: 1500px) { .SliBox { padding-bottom: 28%; } }
@media all and (min-width: 1800px) { .SliBox { padding-bottom: 25%; } }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 1200px) { 
.SliInfo { background: none; }
.SliLogo { 
  display: block; margin-bottom: 20px;
  width: 300px; max-width: 75%;
  height: auto;
  -webkit-border-top-right-radius: 3px; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px; -moz-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
}
.SliLogo IMG { width: 100%; height: auto; }

.SliIco { height: 40px; padding-left: 20px; background: rgba(0,0,0,0.4); }
.SliName { padding-right: 40px; height: 60px; line-height: 60px; font-size: 22px; background: rgba(0,0,0,0.4); 
  -webkit-border-top-right-radius: 3px; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px; -moz-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
}
}

@media all and (max-width: 1000px) { .SliBox { padding-bottom: 60%; } }
@media all and (max-width: 800px) { .SliBox { padding-bottom: 66%; } }
@media all and (max-width: 600px) { .SliBox { padding-bottom: 75%; } }
@media all and (max-width: 450px) 
{
.SliBox {
  padding-bottom: 0px;
  width: 100%;
  height: 50vh; min-height: 250px;
}
}
/* ------------------------------------------------------------------------------------------------------------------------ */



/* DIAG SITE */
/* ------------------------------------------------------------------------------------------------------------------------ */
.DiagSite {
  margin: 0px auto;
  max-width: 1600px;
}
/* ------------------------------ */
.DiagSiteLogo {
  padding: 10px 20px 20px; 
  text-align: center;
}
.DiagSiteLogo IMG { width: 400px; max-width: 100%; }

/* ------------------------------ */
.DiagCat, .DiagCatShow {
  display: block;
  margin-bottom: 5px;
  padding: 12px 20px 12px 56px; 

  text-decoration: none;
  color: #FFF; 
  line-height: 130%;
  font-size: 20px;

  background-color: #71C2CA; /*16767F 006D68*/
  background-repeat: no-repeat;
  background-size: auto 40px;
  background-image: url(cms.svg/DiagCat-Hide.svg);
  background-position: left 10px center;

  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;

  cursor: pointer;

  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
.DiagCatShow {
  background-color: #ED6708;
  background-image: url(cms.svg/DiagCat-Show.svg);
}

.DiagCat:hover { 
  text-decoration: none;
  color: #FFF;

  background-color: #16767F;
}
.DiagCatShow:hover { 
  text-decoration: none;
  color: #FFF;

  background-color: #D35903;
}
/* ------------------------------ */
.DiagCat-Cont { padding-bottom: 40px; }

.DiagLine { padding: 10px; 
  border-bottom: 1px solid #DDD; 
  -webkit-border-top-left-radius: 3px; -moz-border-top-left-radius: 3px; border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px;
}

.DiagCode { 
  float: left;
  width: 50px; padding-right: 30px;
  text-align: right;
}
.DiagName { 
  float: left;
  width: -moz-calc(100% - 280px); 
  width: -webkit-calc(100% - 280px); 
  width: calc(100% - 280px);
}
.DiagName SPAN { display: none; }
.DiagPrice { 
  float: left;
  width: 120px;
  text-align: right;
}
.DiagPrice P { display: none; }
.DiagDays { 
  float: left;
  width: 80px;
  text-align: right;
}

.DiagPrice SPAN, .DiagDays SPAN { font-size: 12px; line-height: 200%; }


.DiagLeg {
  padding: 5px 10px;
  color: #999; 
  font-family: Arial, Verdana; 
  font-size: 14px; 
}
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 550px) {
.DiagCode { display: none; }
.DiagName { 
  width: -moz-calc(100% - 120px); 
  width: -webkit-calc(100% - 120px); 
  width: calc(100% - 120px);
}
.DiagName SPAN { display: inline; }
.DiagPrice P { display: block; color: #888; font-family: Arial, Verdana; font-size: 14px; }
.DiagDays { display: none; }
}
/* ------------------------------------------------------------------------------------------------------------------------ */




/* PRICE SITE */
/* ------------------------------------------------------------------------------------------------------------------------ */
.PriceSite {
  margin: 0px auto;
  max-width: 1500px;
  padding-top: 30px;
}
/* ------------------------------ */
.PriceCat {
  display: block;
  margin-bottom: 5px;
  padding: 12px 20px 12px 56px; 

  text-decoration: none;
  color: #FFF; 
  line-height: 130%;
  font-size: 20px;

  background-color: #71C2CA; /*16767F 006D68*/
  background-repeat: no-repeat;
  background-size: auto 40px;
  background-image: url(cms.svg/DiagCat-Show.svg);
  background-position: left 10px center;

  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;

  cursor: pointer;

  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

.PriceCat:hover { 
  text-decoration: none;
  color: #FFF;

  background-color: #16767F;
}
/* ------------------------------ */
.PriceCat-Desc { padding: 10px 10px 15px; font-size: 16px; line-height: 140%; color: #777; border-bottom: 1px solid #DDD; }
/* ------------------------------ */
.PriceCat-Cont { padding-bottom: 40px; }

.PriceLine { 
  padding: 10px; 
  border-bottom: 1px solid #DDD; 
  -webkit-border-top-left-radius: 3px; -moz-border-top-left-radius: 3px; border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px;
}

.PriceHead { font-weight: 700; }

.PriceName { 
  float: left;
  width: -moz-calc(100% - 120px); 
  width: -webkit-calc(100% - 120px); 
  width: calc(100% - 120px);
}
.PriceName SPAN { display: none; }

.PriceVal { 
  float: left;
  width: 120px; text-align: right; 
}
.PriceVal SPAN { color: #1C858F; }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 400px) { .PriceName, .PriceVal, .PriceVal SPAN { font-size: 17px; } }
@media all and (max-width: 350px) { .PriceName, .PriceVal, .PriceVal SPAN { font-size: 16px; } }
/* ------------------------------------------------------------------------------------------------------------------------ */




/* REGISTRATION */
/* ------------------------------------------------------------------------------------------------------------------------ */
.RegBox { 
  margin: auto; padding: 25px 0px; 
  border-top: 2px solid rgba(255,255,255,0.20); 

  background: #2597A2;
  background: -moz-linear-gradient(left, #16767F 0%, #2597A2 50%, #16767F 100%);
  background: -webkit-linear-gradient(left, #16767F 0%,#2597A2 50%,#16767F 100%);
  background: linear-gradient(to right, #16767F 0%,#2597A2 50%,#16767F 100%);
}
/* ----- */
.RegBoxIn { padding: 0px 10px; text-align: center; 

        font-family: 'Roboto', sans-serif; font-weight: 300; font-style: normal; 
        font-size: 18px; line-height: 160%; color: #FFF; }

.RegBoxIn SPAN { font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
        font-size: 24px; line-height: 160%; color: #FFF; }

.RegBoxIn A { text-decoration: none; color: #FFF; }
.RegBoxIn A:hover { text-decoration: underline; color: #FFF; }
/* ------------------------------------------------------------------------------------------------------------------------ */




/* NEWS */
/* ------------------------------------------------------------------------------------------------------------------------ */
.NewsBox { margin: auto; max-width: 1600px; }
.NewsBoxIn { padding: 40px 50px 0px; text-align: center; font-size: 0; }
/* ----- */
.NewsImg { 
  display: inline-block; vertical-align: middle; 
  position: relative; z-index: 10;
  margin-right: -70px; padding: 5px; width: 140px; height: 140px; text-align: center;
  border: 3px dashed rgba(37,151,162,0.6); /*#2597A2;*/

  -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;
}
.NewsImg SPAN { 
  display: inline-block; width: 140px; height: 140px; 
  -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;
}


.NewsText, .NewsTextImg { 
  display: inline-block; vertical-align: middle; width: 100%; 
  background: #EEE; 
  -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;
}
.NewsText:hover, .NewsTextImg:hover { 
  color: #444; text-decoration: none;
}

.NewsTextImg { 
  padding-left: 90px;
  width: -moz-calc(100% - 180px); 
  width: -webkit-calc(100% - 180px); 
  width: calc(100% - 180px);
}
/* ----- */
.NewsTitle { padding: 20px 20px 0px;
              font-family: 'open Sans', sans-serif; font-weight: 600; font-style: normal; 
              font-size: 22px; line-height: 120%; color: #444; text-align: left; }
.NewsTitle SPAN { font-size: 16px; font-weight: 400; line-height: 150%; color: #999; }

.NewsShort { padding: 7px 20px 20px;
              font-family: 'open Sans', sans-serif; font-weight: 400; font-style: normal; 
              font-size: 18px; line-height: 150%; color: #444; text-align: left; }
/* ----- */


.NewsB { padding: 15px 0px; border-bottom: 1px solid #E6E6E6; }
/* ----- */
.NewsBTitle { padding-bottom: 5px; color: #333; font-size: 20px; line-height: 120%; }
.NewsBTitle A { text-decoration: none; color: #333; }
.NewsBTitle A:hover { text-decoration: none; color: #333; }
.NewsBTitle SPAN { color: #999; font-family: Arial, Tahoma; font-size: 12px; line-height: 14px; }
/* ------------------------------------------------------------------------------------------------------------------------ */
@media all and (max-width: 800px) 
{
.NewsBoxIn { padding: 40px 30px 0px; }

.NewsImg { display: inline-block; margin-right: 0px; margin-bottom: -70px; border: 3px dashed rgba(0,0,0,0.4); background: #FFF; }
.NewsTextImg { 
  padding-top: 70px;
  padding-left: 0px;
  width: 100%;
}
}

@media all and (max-width: 600px) 
{
.NewsBoxIn { padding: 40px 20px 0px; }
}
/* ------------------------------------------------------------------------------------------------------------------------ */





/* FAQ */
/* ------------------------------------------------------------------------------------------------------------------------ */
.faqBox { margin: auto; max-width: 1600px; }
.faqBoxIn { 
  display: block;
  margin: 20px 50px 0px; 
  padding: 20px 20px 20px 80px;
  
  font-family: 'open Sans', sans-serif; font-weight: 600; font-style: normal; 
  font-size: 22px; line-height: 120%; color: #444; text-align: left;

  background-color: #EEE;
  background-repeat: no-repeat;
  background-size: auto 42px;
  background-image: url(cms.svg/Ind-FAQ.svg);
  background-position: left 10px center;

  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;

  -webkit-transition: background 0.5s ease-out;
  -moz-transition: background 0.5s ease-out;
  -ms-transition: background 0.5s ease-out;
  -o-transition: background 0.5s ease-out;
  transition: background 0.5s ease-out;
}

.faqBoxIn:hover {
  color: #333; text-decoration: none;
  background-color: #DDD; 
}
/* ------------------------------------------------------------------------------------------------------------------------ */
@media all and (max-width: 800px) 
{
.faqBoxIn { margin: 20px 30px 0px; }

}
@media all and (max-width: 600px) 
{
.faqBoxIn { 
  margin: 20px 20px 0px;
  padding: 20px 20px 20px 76px;
  background-position: left 10px center;
}
}
/* ------------------------------------------------------------------------------------------------------------------------ */








/* SITE */
/* ------------------------------------------------------------------------------------------------------------------------ */
.SiteTop { padding: 10px 0px; text-align: center; }
.SiteTop IMG { height: 60px; opacity: 1; }
/* ----- */
.SiteTitle { 
  display: block;
  padding: 25px 20px; 
  text-align: center; 

  text-decoration: none;
  color: #FFF; 
  line-height: 40px;
  font-size: 30px;

  background: #2597A2;
  background: -moz-linear-gradient(left, #16767F 0%, #2597A2 50%, #16767F 100%);
  background: -webkit-linear-gradient(left, #16767F 0%,#2597A2 50%,#16767F 100%);
  background: linear-gradient(to right, #16767F 0%,#2597A2 50%,#16767F 100%);

  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
.SiteTitle:hover { 
  text-decoration: none;
  color: #FFF; 
  line-height: 40px;
  font-size: 36px;

  background: #16767F;
  background: -moz-linear-gradient(left, #2597A2 0%, #16767F 50%, #2597A2 100%);
  background: -webkit-linear-gradient(left, #2597A2 0%,#16767F 50%,#2597A2 100%);
  background: linear-gradient(to right, #2597A2 0%,#16767F 50%,#2597A2 100%);
}
/* ----- */
.SiteH1 {
  display: block;
  padding: 20px 20px;
  text-align: center;

  text-decoration: none;
  color: #FFF;
  line-height: 120%;
  font-size: 30px;
  font-weight: 400;
  font-style: normal;

  border-top: 2px solid rgba(255,255,255,0.20);

  background: #2597A2;
  background: -moz-linear-gradient(left, #16767F 0%, #2597A2 50%, #16767F 100%);
  background: -webkit-linear-gradient(left, #16767F 0%,#2597A2 50%,#16767F 100%);
  background: linear-gradient(to right, #16767F 0%,#2597A2 50%,#16767F 100%);
}
.SiteH1 SPAN {
  display: block;
  margin-top: -2px;
  margin-bottom: -5px;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  opacity: 0.8;
}
/* ----- */
.SiteBack { 
  display: block;
  padding: 15px 20px 15px 45px; 

  font-family: 'Open Sans', sans-serif; font-weight: 400; font-style: normal; font-size: 18px; line-height: 20px; color: #333; 
  text-decoration: none;

  background-color: #FFF;
  background-repeat: no-repeat;
  background-size: auto 30px;
  background-image: url(cms.svg/ico_back_grey.svg);
  background-position: 15px center;

  border-bottom: 1px solid #DDD;

  -webkit-transition: background 0.5s ease-out;
  -moz-transition: background 0.5s ease-out;
  -ms-transition: background 0.5s ease-out;
  -o-transition: background 0.5s ease-out;
  transition: background 0.5s ease-out;
}
.SiteBack:hover { background-color: #FFF; background-position: 8px center; color: #333; text-decoration: none; }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 800px) { .SiteH1 { font-size: 28px; } }
@media all and (max-width: 600px) { .SiteH1 { font-size: 26px; } }
@media all and (max-width: 400px) { .SiteH1 { font-size: 24px; } }
/* ------------------------------------------------------------------------------------------------------------------------ */




.SiteCont {
  padding: 40px 40px 50px; /* padding: 10px 20px 50px; */
  min-height: 500px; height: auto !important; height: 500px; 
}
.SiteCont IMG { max-width: 100%; height: auto; }


.SiteContTel { padding: 20px 20px 0px; text-align: center; }

.SiteContTel A {
  display: inline-block; vertical-align: middle;
  padding-left: 15px;
  padding-right: 45px;
  height: 40px; 

  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal;
  line-height: 40px; font-size: 20px; color: #FFF;
  text-shadow: 1px 1px rgba(102,79,16,0.3);  /* ADD */
  text-decoration: none; 

  background-color: #16767F; 
  background-image: url(cms.svg/SiteTel.svg), -moz-linear-gradient(135deg, #16767F 0%, #2597A2 100%);
  background-image: url(cms.svg/SiteTel.svg), -webkit-linear-gradient(135deg, #16767F 0%, #2597A2 100%);
  background-image: url(cms.svg/SiteTel.svg), linear-gradient(135deg, #16767F 0%, #2597A2 100%);
  background-repeat: no-repeat, no-repeat;
  background-position: right 6px center, center center;
  background-size: 38px auto, 100% 100%;

  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
}
.SiteContTel A:hover { text-decoration: none; color: #FFF; }





.SiteContGrad { 
  border-top: 3px solid #FFF;

  background-repeat: no-repeat;
  background-size: 100% 40px;
  background-position: center top; 
  background-image: -moz-linear-gradient(top, rgba(0,0,0,0.07) 0%, rgba(0,0,0,0) 100%);
  background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.07) 0%, rgba(0,0,0,0) 100%);
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.07) 0%, rgba(0,0,0,0) 100%);
}
/* ----- */
.GalBoxes {
  margin: 40px -40px 0px;
  padding: 30px 40px; background: #E9E9E9; /* padding: 20px; */
  border-top: 3px solid #DDD;
  border-bottom: 3px solid #DDD;
  font-size: 0px;
}
.GalBox { display: inline-block; vertical-align: top; width: 16.66%; }
.GalBoxIn {
  margin: 1px; position: relative; 
  padding-bottom: -moz-calc(100% - 2px); 
  padding-bottom: -webkit-calc(100% - 2px); 
  padding-bottom: calc(100% - 2px);
  height: 0; overflow: hidden; 
}
.GalBoxImg {
  display: block;
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;

  background-repeat: no-repeat;
  background-position: center center; 
  background-size: cover;

  -webkit-transition: all 1.5s;
  -moz-transition: all 1.5s;
  -o-transition: all 1.5s;
  transition: all 0.2s;
}
.GalBoxImg:hover {
	margin-left: -10%;
  margin-top: -10%;
	width: 120%; 
  height: 120%;
}
.GalBoxImg SPAN {
  display: block;
  width: 100%; height: 100%;

  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 15% auto;

  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  -o-transition: background 0.5s;
  transition: background 0.5s;
}
.GalBoxImg:hover SPAN {
  background-color: rgba(0,0,0,0.4); 
  background-image: url(cms.svg/ico_zoom.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 25% auto;
}

.GalBoxImg1 {
  display: block;
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;

  background-color: #2597A2; 
  background-image: url(cms.svg/GalBox1.svg), -moz-linear-gradient(135deg, rgba(15,124,135,1) 0%, rgba(37,151,162,1) 100%);
  background-image: url(cms.svg/GalBox1.svg), -webkit-linear-gradient(135deg, rgba(15,124,135,1) 0%, rgba(37,151,162,1) 100%);
  background-image: url(cms.svg/GalBox1.svg), linear-gradient(135deg, rgba(15,124,135,1) 0%, rgba(37,151,162,1) 100%);
  background-repeat: no-repeat, no-repeat;
  background-position: center center, center center;
  background-size: 50% auto, 100% 100%;
  
}
/* ----- */
.RecTitle { padding: 10px 0px 5px; 
              font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
              font-size: 26px; line-height: 26px; color: #444; 
}
.RecTitle SPAN.RecDate { color: #AAA; font-family: Arial, Tahoma; font-size: 12px; line-height: 24px; }
/* ----- */
.RecShort {
  padding: 10px 0px 20px; 
  font-weight: 700; 
}
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (min-width: 1500px) { .GalBox { width: 14.28%; } }
@media all and (min-width: 1800px) { .GalBox { width: 12.5%; } }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 1200px) { .GalBox { width: 20%; } } 
@media all and (max-width: 800px) 
{
.SiteBack { margin: 0px 15px; }
.SiteCont { padding: 25px 20px 50px; /* padding: 10px 15px 50px; */}

.GalBoxes { margin: 30px -15px 0px; padding: 25px 30px; /* padding: 20px 15px; */ }
.GalBox { width: 25%; }
}

@media all and (max-width: 600px) { .GalBox { width: 33.33%; } }
@media all and (max-width: 400px) { .GalBox { width: 50%; } }
/* ------------------------------------------------------------------------------------------------------------------------ */



/* Site-Sort */
/* ======================================================================================================================== */
.Site-Sort { margin-top: 20px; text-align: center; 

  font-family: 'Open Sans', sans-serif; 
  font-weight: 400; 
  font-style: normal; 
  font-size: 18px;
}
.Site-Sort SPAN, .Site-Sort A {
  display: inline-block;
  margin-right: 5px;
  margin-bottom: 5px;
  padding: 2px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  color: #FFF;
  text-align: center;
  text-decoration: none;
  background: #AAA;
  -webkit-border-radius: 20px; 
  -moz-border-radius: 20px; 
  border-radius: 20px;
}
.Site-Sort A:hover {
  text-decoration: none;
  background: #16767F;
}
.Site-Sort SPAN { 
  background: #2597A2;
}
/* ------------------------------------------------------------------------------------------------------------------------ */







/* SPAW */
/* ======================================================================================================================== */
TABLE.table_b { border-left: 1px solid #DDD; border-top: 1px solid #DDD; }
TABLE.table_b TD { border-right: 1px solid #DDD; border-bottom: 1px solid #DDD; }
/* ----- */
TABLE.table_font {  }
TABLE.table_font TD { font-size: 11px; line-height: normal; }
TABLE.table_font DIV { font-size: 11px; line-height: normal; }
/* ----- */
TABLE.table_b_font { border-left: 1px solid #DDD; border-top: 1px solid #DDD; }
TABLE.table_b_font TD { border-right: 1px solid #DDD; border-bottom: 1px solid #DDD; font-size: 12px; line-height: normal; }
TABLE.table_b_font DIV { font-size: 11px; line-height: normal; }
/* ----- */
TABLE.table_bb_font { border-top: 1px solid #DDD; }
TABLE.table_bb_font TD { border-bottom: 1px solid #DDD; font-size: 12px; line-height: normal; }
TABLE.table_bb_font DIV { font-size: 11px; line-height: normal; }
/* ----- */
IMG.img_b { padding: 2px; background: #FFF; border: 1px solid #DDD; 
            -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
IMG.img_b_mar_r  { margin: 0px 15px 10px 0px; padding: 2px; background: #FFF; border: 1px solid #DDD; 
                   -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
IMG.img_b_mar_l  { margin: 0px 0px 10px 15px; padding: 2px; background: #FFF; border: 1px solid #DDD; 
                   -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
IMG.img_b_mar_f { margin: 15px; padding: 2px; background: #FFF; border: 1px solid #DDD; 
                  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
/* ----- */
.font_small { font-size: 11px; line-height: normal; }
.font_big { font-size: 14px; line-height: normal; font-weight: bold; font-family: Arial, Tahoma, Verdana; }
/* ------------------------------------------------------------------------------------------------------------------------ */


/* WEB */
/* ======================================================================================================================== */
.web_site_title { padding: 10px; border-bottom: 1px solid #DDD;
                  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
                  font-size: 26px; line-height: 26px; color: #444; text-align: center; }
/* ----- */
.web_sites { padding: 10px; text-align: center; background: #EEE; 
              border-left: 1px solid #DDD; border-right: 1px solid #DDD; border-bottom: 1px solid #DDD; }
.web_sites IMG { display: inline-block; vertical-align: middle; }
.web_sites SPAN { color: #BBB; }
.web_sites A { text-decoration: none; color: #333; }
.web_sites A:hover { text-decoration: underline; color: #333; }
/* ----- */
.web_offer_pdf { padding: 10px; text-align: center; border-bottom: 1px solid #DDD; }
.web_offer_pdf IMG { display: inline-block; vertical-align: middle; }
.web_offer_pdf A { text-decoration: none; color: #333; }
.web_offer_pdf A:hover { text-decoration: underline; color: #333; }
/* ----- */
.web_map { margin: 0 auto; width: 400px; padding: 20px 0px; text-align: center; }
/* ----- */
.web_site_back { padding: 10px; color: #666; font-size: 14px; border-bottom: 1px solid #DDD; }
.web_site_back A { text-decoration: none; color: #333; }
.web_site_back A:hover { text-decoration: underline; color: #333; }
/* ----- */
.web_site_cont { padding: 20px 0px; }
.web_site_cont IMG { max-width: 100%; height: auto; }
/* ======================================================================================================================== */
.web_list_box { padding: 15px 0px; border-bottom: 1px solid #E6E6E6; }
/* ----- */
.web_list_box_title { padding-bottom: 5px; color: #333; font-family: Arial, Tahoma; font-size: 15px; line-height: 18px; }
.web_list_box_title A { text-decoration: none; color: #333; }
.web_list_box_title A:hover { text-decoration: none; color: #333; }
.web_list_box_title SPAN.list_data { color: #AAA; font-family: Arial, Tahoma; font-size: 12px; line-height: 14px; }
.web_list_box_title SPAN.list_rank { color: #444; font-family: Arial, Tahoma; font-size: 12px; line-height: 14px; }
/* ----- */
.web_list_sort { padding: 10px 15px; font-size: 12px; text-align: center; }
.web_list_sort A { text-decoration: none; color: #333; }
.web_list_sort A:hover { text-decoration: none; color: #333; }
/* ======================================================================================================================== */
/*
.web_rec_back { margin-bottom: 10px; padding: 5px 0px 7px; color: #666; font-size: 14px; border-bottom: 1px solid #E6E6E6; }
.web_rec_back A { text-decoration: none; color: #333; font-size: 12px; }
.web_rec_back A:hover { text-decoration: underline; color: #333; }
*/
/* ----- */
.web_rec_title { padding: 10px 0px 5px; 
                  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
                  font-size: 26px; line-height: 26px; color: #444; 
}
.web_rec_title SPAN.list_data { color: #AAA; font-family: Arial, Tahoma; font-size: 12px; line-height: 24px; }
.web_rec_title SPAN.list_rank { color: #444; font-family: Arial, Tahoma; font-size: 12px; line-height: 140%; }
/* ----- */
.web_rec_cont { padding: 10px 0px 20px; }
.web_rec_cont IMG { max-width: 100%; height: auto; }
/* ----- */
.web_rec_com { padding: 0px 10px 10px; font-family: Arial, Tahoma, Verdana; font-size: 24px; line-height: 20px; color: #E2DDCE; 
               font-weight: bold; text-align: right; border-bottom: 1px solid #EDE9DE; }
/* ======================================================================================================================== */
.web_list_rec { margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid #EEE; }
.web_list_rec SPAN { color: #BBB; line-height: 200%; }
/* ----- */
.web_list_all { margin-top: -13px; text-align: right; }
/* ----- */
.web_list_sort { padding: 10px 30px; text-align: center; font-size: 14px; background: #EEE; }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 620px) 
{
.web_map { width: 90%; }
}
/* ------------------------------------------------------------------------------------------------------------------------ */


/* MEDIA BOX */
/* ======================================================================================================================== */
.media_title { padding: 10px 0px; font-family: Arial, Tahoma; font-size: 15px; line-height: 30px; color: #000; font-weight: bold; text-align: center; }
.media_img { padding-bottom: 20px; text-align: center; }
.media_img IMG { border: 0px none; }
/* ======================================================================================================================== */




/* GOOGLE MAP */
/* ------------------------------------------------------------------------------------------------------------------------ */
.GMap { margin-top: 15px; width: 100%; height: 502px; border-top: 1px solid #DDD; background: #EEE; }
/* ------------------------------------------------------------------------------------------------------------------------ */



/* NAVI */
/* ------------------------------------------------------------------------------------------------------------------------ */
.NaviSha {
  display: none; z-index: 98;
  position: fixed; left: 0; bottom: 0;
  width: 100%; height: 60px;
  background-color: rgba(0,0,0,0.15);
}


.Navi {
  display: none; z-index: 99;
  position: fixed; left: 0; bottom: 0;
  width: 100%; height: 50px;

  background-color: #2597A2;
  border-top: 2px solid #51ACB5;

  text-align: center; font-size: 0px;
}

.NaviIn {
  position: relative;

  width: 100%;
  height: 100%;
}

.NaviMenu {
  position: absolute; 
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  bottom: -18px;
  display: block; width: 80px; height: 80px;

  text-align: center;
  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 14px; line-height: 14x; color: #FFF; 

  /*/MenuShow.svg*/

  background: #33ABB6;
  background: -moz-linear-gradient(top, #2597A2 0%, #33ABB6 100%);
  background: -webkit-linear-gradient(top, #2597A2 0%,#33ABB6 100%);
  background: linear-gradient(to bottom, #2597A2 0%,#33ABB6 100%);

  /*border: 2px solid #51ACB5;*/
  border: 2px solid rgba(255,255,255,0.2);

  -webkit-border-radius: 150px; -moz-border-radius: 150px; border-radius: 150px; 

  cursor: pointer;
}

.NaviMenu IMG { 
  margin-top: 3px;
  height: 38px; -moz-outline: none; outline: none; border: 0px none; 
}


.NaviTel, .NaviMap { 
  display: inline-block; vertical-align: top;
  width: 50%; height: 50px;
  text-decoration: none;
}
.NaviTel { background-color: #2597A2; }
.NaviMap { background-color: #2597A2; }



.NaviIco, .NaviLab {
  display: inline-block; vertical-align: top;
  padding-top: 10px; height: 40px;
  text-decoration: none;
}
.NaviIco {
  width: 50px; /*margin: 0px 5px;*/

  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center center;
}
.NaviLab { 
  width: -moz-calc(100% - 50px); 
  width: -webkit-calc(100% - 50px); 
  width: calc(100% - 50px);

  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 16px; /*line-height: 20x;*/ color: #FFF; 

  line-height: 18px;
  text-align: left;
}
.NaviLab SPAN { 
  font-family: 'Roboto', sans-serif; font-weight: 400; font-style: normal; 
  font-size: 10px; line-height: 12px; color: rgba(255,255,255,0.75); 
}

.NaviTel .NaviIco { background-image: url(cms.svg/Navi-Tel.svg); }
.NaviMap .NaviIco { background-image: url(cms.svg/Navi-Map.svg); }

.NLR { text-align: right; }
/* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
@media all and (max-width: 800px) {
.Navi { display: block; }
.NaviSha { display: block; }
}
@media all and (max-width: 320px) {
.NaviIco { margin: 0px; }
.NaviLab { 
  width: -moz-calc(100% - 50px); 
  width: -webkit-calc(100% - 50px); 
  width: calc(100% - 50px);

  font-size: 16px;
}
}
/* ------------------------------------------------------------------------------------------------------------------------ */