

body { background:#fff; padding:0px; margin:0px; font-family: 'PT Sans', sans-serif; }

#header {width:100%; height:420px; top:0px; position:absolute; 
background: linear-gradient(0deg,  rgba(255,255,255,1) 0% , rgba(0,112,192) 100% );;
bbackground: linear-gradient(45deg, #fff1eb, #ace0f9);
z-index:0;
}




#menuProducts .logobox { 
 font-size:100%; padding-top:20px;text-align:left; border-radius:10px;   
background:rgba(255,255,255,0.8	);  border:2px solid transparent;
vertical-align:middle;
  grid-column: 1 / 2;
  grid-row: 1;
text-align:center;
}



.logobox img {}
.firmname {font-size:180%; color:#000   ; rgba(0,112,192); font-weight:bold; padding-bottom:10px;display:inline-block; padding-top:0px;}

#menuProducts .sitelogo {
 border-radius:10px;
background:rgba(255,255,255,0.8);  border:2px solid transparent;

  grid-column: 2 / 4;
  grid-row: 1;

   text-align:center;
}






#menuProducts #header_contacts {
    font-size:160%; 
    text-align:center; 
    border-radius:10px;    
    background:#369; /*369;*/ 
    color:#fff; 
    border:2px solid #369;
  grid-column: 4 / 5;
  grid-row: 1;
  padding-top:40px;
}
 

#header_contacts a.phone {color:#fff; text-decoration:none; color:#fff; font-size:120%;}



span[c="red"] {color:#f00;}








* {
  box-sizing: border-box;
}
#menuProducts {
  max-width: 1260px;
  margin: 0 auto;
  width:1280px;
position:relative;
 z-index:1;
}
#menuProducts > a {
  border: 2px solid rgb(233 171 88);
  border-radius: 10px;
  background-color: rgb(233 171 88 / 50%);
  padding: 1em 0.6em;
  cursor: pointer;
  color:#000;
  text-decoration:none;
}

#menuProducts > a  > h2 {font-size:110%; text-decoration:none; color:#000; underline;}


#menuProducts > a:hover  h2 {color:#000; text-decoration:underline;d: rgba(var(--bs-link-color-rgb)); }
#menuProducts > a:hover {box-shadow:0px 0px 18px inset rgba(0,0,0,0.4);}
#menuProducts > a hr { border-top-width:1px;  border-bottom-width:0px;}

#menuProducts {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(100px, auto);
}




#menuProducts > div {
  border: 2px solid #fff; a:rgb(233 171 88);
  border-radius: 10px;
  background-color: #fff; a: rgb(233 171 88 / 50%);
  padding: 1em;
  background:#fff;
}



#menuProducts > .content {
  grid-column: 2 / 5; 
}

#menuProducts > .leftmenu {
  grid-column: 1 / 2;
}











.container       { width:1280px; margin:0px auto; padding:20px 0px 20px 0px; }

.png-shadow-369 {-webkit-filter: drop-shadow(5px 5px 5px #036 );  filter: drop-shadow(5px 5px 5px #036);}
.png-shadow-000 {-webkit-filter: drop-shadow(5px 5px 5px #000 );  filter: drop-shadow(5px 5px 5px #000);}
.png-shadow-fff {-webkit-filter: drop-shadow(5px 5px 5px #fff );  filter: drop-shadow(5px 5px 5px #fff);}

#menu {width:380px;   max-width:380px;   min-width:380px;   vertical-align:top; border-right:2px solid rgba(0,112,192);  padding:0px; line-height:100% ;}
#content {width:870px;max-width:870px; min-width:870px; overflow-x:visible; vertical-align:top;padding:0px;  padding-left:20px ; }



.mt-10 {margin-top:10px;}
.mb-10 {margin-bottom:10px;}

#menu a         { color:#007bff;; display:block; ffont-weight:bold; font-size:100%; text-decoration:none; margin-top:5px;  }
#menu a:hover   { color:#f00;text-decoration:underline; cursor:pointer;
    
    
}







#menu a.currentUri:after {  
    content: "  ";
    display:block;
    
    color:transparent;
    height:32px;
    width:32px;
    background-image:url(favicon-32x32.png)   ;/*arr-right.png*/
    
    position:absolute;
    left:96% ;
    top:-10px;
    background-repeat: no-repeat;
    z-index:10000;
background-position: 0px 0px;
     background-size: 32px 32px;
  }    
  

#menu a.currentUri  { color:#f00;  dddbackground: linear-gradient(90deg, rgba(2,0,36,0) 38%, rgba(255,0,0,0.4) 100%);  

position:relative;
    
}

#menu h3 { bborder-bottom:2px solid #333;  background:#369; color:#fff; padding:5px 20px; margin-left:-20px; margin-top:10px;}
#menu h4 {padding:0px; margin-bottom:0px; border-bottom:2px solid #369; margin-top:20px;}
#menu h5 {bborder-bottom:2px solid #333; padding:0px;margin:0px; margin-top:10px;}

#menu small {color:#999; font-style:italic; fon-size:60%; }

#menu .button {border-radius:12px; background:#9cf ;background:#369; display:inline-block; padding:17px 30px 18px 30px; color:#fff; box-shadow: inset 0 0 18px rgba(0,0,0,1); font-weight:bold; 
border: 1px solid #fff; color:#369;color:#fff;	margin:20px; font-size:120%; text-shadow: 1px 1px 2px rgba(0,0,0,1);}
#menu .button:hover {border: 1px solid #f00;  }






#menu .dimara_background {background-color:#f76723;}
#menu .dimara_color {color:#f76723;}





#menu .metaaramid_background {background-color:#f72367;}
#menu .metaaramid_color {color:#f72367;}


#menu .uhmwpe_background {background-color:#33aa66;}
#menu .uhmwpe_color {color:#f72367;}


.underconstruction { background:#fc9; padding:5px 10px;   display:inline-block;}

#content h1 {    font-size: 2.0rem;}
#content h2 {    font-size: 1.75rem;}
#content h3 {    font-size: 1.5rem;}
#content h4 {    font-size: 1.25rem;}
#content h5 {    font-size: 1.0rem;}

 h1, h2, h3, h4, h5, h6 {
     
    margin-bottom: .5rem;
    font-family: inherit;
    font-weight: 900;
    line-height: 1.1;
    color: inherit; 
    margin-top: 0;
    margin-bottom: .5rem;
}  

#content * {line-height:120%;}

/*==========================*/

.d-inline-block {display:inline-block;}
.w-49           {width:49%;}
.w-100           {width:100%;}


.pr-2 {padding-right:4px;}
.pb-2 {padding-bottom:4px;}





.card-columns {
width:100%;     
display: block;
-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    column-gap: 10px;
    word-wrap: inherite;
}

.card-columns .card {
    display: inline-block;
    width: 100%;
    
    margin-bottom: 10px;

    position: relative;
    display: -ms-flexbox;
    display: flex;
    display: inline-block;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    
    word-wrap: break-word;
    
    border: none
    border-radius: 20px;
}

.card-columns .card img {
    width: 100%;
    border-radius:  10px;
}

.card-columns .card.vertical img {
    width: calc(50% - 5px);
    display: inline-block;
}

.card-columns .card.vertical img:first-child {
    margin-right:10px;
}




    #book       {width:800px;position: relative;  margin-top:10px; }
    #book #page_img {box-shadow:4px 4px 14px #333; width:100%;  z-index:1000; border-radius:8px;}
    #book #page_indexer { border-radius:8px;  height:40px; width:100%; text-align:center; font-weight:bold; font-size:20px;}
    #book #prev_page ,
    #book #next_page {position: absolute; right:0px; top:0px; background:transparent; border-radius:8px; z-index:100; cursor:pointer; height:100%; width:120px;
        vertical-align:middle; text-align:center; text-decoration:none; font-weight:bold; font-size:20px; box-sizing:border-box;      }
    #book #prev_page {left:0px;}
    #book #next_page {right:0px;}
    #book #prev_page:hover { background: linear-gradient(90deg, rgba(51,102,153,1) 0%, rgba(255,255,255,0) 100%);    }      
    #book #next_page:hover { background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(51,102,153,1) 100%);    }
    #book #hidden_links {  display:none;}
