/* Top div */
#Container
{     
width:auto;
max-width:980px;
margin-left:auto;
margin-right:auto;
padding:3px;
border:1px solid black;
}
#Top_Div
{
color:black;
text-align:center;
width:100%;
background-color:white;
overflow:auto;
}
.Top_Div a, .Top_Div a:hover {text-decoration:none;color:#15244F;}
.Top_Div img {max-width:95%;height:auto;margin-top:20px;}
.Top_Div h1, .Top_Div h2 {border:none;text-align:center;color:#15244F;font-size:45px;margin:10px;}
@media only screen and (max-width:400px)
{
    .Top_Div h1, .Top_Div h2 {font-size:30px;} 
}


/* Menu */
div.Menu {background-color:#15244F;overflow:auto;}
div.Menu ul {list-style-type:none;margin: auto;}
div.Menu li {float:right;margin:4px;color:white;padding:5px;cursor:pointer;font-weight:bold;}
div.Menu li:hover {background-color:white;color:black;}
div.Menu a {color:white;text-decoration:none;padding:5px;}
div.Menu a:hover {background-color:white;color:black;}

div.Menu_Links {display:none;border:1px solid #333;padding:3px;margin:15px;}
div.Menu_Links ul {overflow:auto;}
div.Menu_Links li {float:right;margin:10px;}
div.Menu_Links a {color:blue;text-decoration:underline;padding:5px;margin:10px;border:#6CABC9 solid 1px;}
div.Menu_Links a:hover {color:black;background-color:#6CABC9;}


/* Main page structure divs. */
#Body_Div
{
width:auto;
padding-top:110px;
padding:20px;
}
#Body_Text
{
margin:auto;/*Center the div*/
width:auto;
background-color:white;

min-height:200px;
}



/* Bottom menu - the click optionat the end of the main section and before the bottom telephone. */
#Bottom_Menu{text-align:left;}
#Bottom_Menu a {color:blue;text-decoration:underline;}
#Bottom_Menu a:hover {font-weight:bold;}


/* Bottom DIVs - Telephone and Botoom! */
#Bottom_Telephone
{
font-size:20px;
text-align:center;
background-color:#333333;
margin:auto;/*Center the div*/
text-decoration:none;
color:black;
}
.Bottom_Telephone a
{
text-decoration:none;
color:white;
}
.Bottom_Telephone h3
{
font-size:25px;
color:white;
padding:5px;
margin:0px;
}

#Bottom_Div
{
min-height:150px;
font-size:13px;
padding:5px;
margin-bottom:20px;
color:black;
margin:auto;/*Center the div*/
padding-right: 10px;
padding-left: 10px;

}
#Bottom_Div p
{
font-size:13px;
}
.Bottom_Div_Links a
{
color:#1a0dab;
text-decoration:underline;
}
.Bottom_Div_Links a:hover
{
font-weight:bold;
}

.Bottom_Links a, .Bottom_Links a:hover
{
font-size:8px;
text-decoration:none;
color:white;
}



/* Mobile button for telephone and whatsapp! */
#Whatsapp_Button {border-radius:15px;text-align:center;position:fixed;left:0;bottom:0px;padding:10px;background-color:#CDCDCD;border-top-right-radius:15px;border-bottom-right-radius:15px;border:1px solid black;}
#Telephone_Button {border-radius:15px;text-align:center;position:fixed;left:0;bottom:55px;padding:10px;background-color:#CDCDCD;border-top-right-radius:15px;border-bottom-right-radius:15px;border:1px solid black;}
.Mobile_Only {display:none;}
@media only screen and (max-width:600px)
{
    .Mobile_Only {display:block;}
}







/******************************************************************************************
******************************* Global Elemetns style *************************************
*******************************************************************************************/

/* Global Elements style */

body
{
direction:rtl;
background-color:white;
margin:0px;
font-family:Arial,Helvetica,sans-serif;
}

h2 { text-align:right;color:#161C23;font-weight:bold;padding-right:15px;padding-left:15px;border-bottom: 1px #161C23 solid; } 

p { font-size:16px;padding-right:10px;padding-left:10px; }

img { border:0px; }

span.No_Wrap {white-space:nowrap;}

/* Images float and divs */
.Img_Float_Left{float:left;margin:20px;}
.Img_Float_Right{float:right;margin:20px;}
img.Img_Center{display:block;margin-right:auto;margin-left:auto;}
div.Img_Center{text-align:center;margin:10px;}
div.Img_Center img{margin:10px auto 10px auto;}

@media only screen and (max-width: 500px)
{
    .Img_Float_Right, .Img_Float_Left {float:unset;max-width:100%;height:auto;display:block;margin-right:auto;margin-left:auto;}
    div.Img_Float_Left {text-align:center;}
    div.Img_Float_Right {text-align:center;}
    .Img_Center img, img.Img_Center, img.Img_Float_Left, img.Img_Float_Right {float:unset;max-width:100%;height:auto;display:block;margin-right:auto;margin-left:auto;}
}

/* Images sizes */
.Max_Image_Size_120 { width:120px;height:auto; }
.Max_Image_Size_140 { width:140px;height:auto; }
.Max_Image_Size_150 { width:150px;height:auto; }
.Max_Image_Size_180 { width:180px;height:auto; }
.Max_Image_Size_200 { width:200px;height:auto; }
.Max_Image_Size_240 { width:240px;height:auto; }

.Max_Image_Height_160 { height:160px;width:auto; }
.Max_Image_Height_180 { height:180px;width:auto; }
.Max_Image_Height_200 { height:200px;width:auto; }
.Max_Image_Height_240 { height:240px;width:auto; }
.Max_Image_Height_280 { height:280px;width:auto; }
.Max_Image_Height_300 { height:300px;width:auto; }
.Max_Image_Height_360 { height:360px;width:auto; }
.Max_Image_Height_500 { height:500px;width:auto; }






/******************************************************************************************
************************* UNIQUE DESIGNS FOR THIS WEB *************************************
******************************************************************************************/



/************************************
******* for index.html **************
******* UNIQUE FOR THIS SITE ********
*************************************/
#Index_Menu
{
    overflow:auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
div.Index_Menu_Box 
{
    border:white solid 1px;
    margin:10px 10px 20px 10px;
    display:block;
    overflow:auto;
    width:120px;
}

div.Index_Menu_Box img {max-width:100%;height:auto;overflow:auto;}
div.Index_Menu_Box_Pic {min-height:125px;}
div.Index_Menu_Box_Title
{
    text-align:center;
    font-size:18px;
    text-decoration:none;
    color:white;
    background-color:#15244F;
    min-height:50px;
}
div.Index_Menu_Box a {text-decoration:none;color:white;}
@media only screen and (max-width:400px)
{
    div.Index_Menu_Box  {width:110px;}
    div.Index_Menu_Box_Pic {height:110px;overflow:hidden;}
}

/* Text pages links in the index.html page! */
div.index_main_content
{
display:flex;
flex-wrap:wrap;
justify-content:space-around;
overflow:auto;
min-height:200px;
}
.index_main_content div {
    border:black solid 1px;
    width:30%;
    min-width:180px;
    padding:3px;
    margin:10px;

}
.index_main_content h3{text-align:center;}
.index_main_content a{color:#2f669c;line-height:25px;}
.index_main_content a:hover{font-weight:bold;}
@media only screen and (max-width:400px)
{
    .index_main_content div {width:100%;}
}






/****************** style for pages! ***************/
/****************** Update march 2020 ! *************/




/*****************************************************************
***** Menu with images at the pages - unique for this website! ***
*****************************************************************/
#Brands_Gallery {
    margin:auto;
    overflow:auto;
    padding-bottom:30px;

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.Brand_Box
{
width:130px;
height:181px;
padding:1px;
margin:10px;
border: 1px solid #ccc;

/*Inside text and links style*/
text-decoration:none;
color:black;
}
@media only screen and (max-width:500px)
{
    .Brand_Box {width:80px;height:auto;}
}

.Brand_Box:hover 
{
border: 1px solid #777;
    -ms-transform: scale(1.1,1.1); /* IE 9 */
    -webkit-transform: scale(1.1,1.1); /* Safari */
    transform: scale(1.1,1.1); /* Standard syntax */
}
.Brand_Box a {text-decoration:none;color:black;}

div.Col_Pic { text-align:center; }
div.Col_Pic img { width:100%;height:auto; }
.Brand_Box h3 { text-align:center;text-decoration:none;color:black;margin:2px;padding:0px; }
div.Col_Title { height:50px;}



/********************************************************************************
**** Design for the 4 images at the bottom of page - unique for this website ****
********************************************************************************/
div.Bottom_Menu
{
    display:flex;
    flex-wrap: wrap;
    justify-content: space-around;}
div.Bottom_Menu_Item 
{
    position:relative;
    width:350px;
    height:220px;
    margin: 10px auto 10px auto;
}
div.Bottom_Menu_Item img {width:100%;height:100%;}
div.Bottom_Menu_Item div {
    position:absolute;
    left:0;
    top:80%;
    display:block;
    width:100%;
    text-align:center;
    background-color:black;
    opacity:0.5;
    color:white;
    text-decoration:none;
}
div.Bottom_Menu_Item a {color:white;font-size:22px;text-decoration:none;}
@media only screen and (max-width:450px)
{
    div.Bottom_Menu_Item {width:260px;height:180px;}
}







/******************************************************************************************
******************************* Design for pages ******************************************
******************************************************************************************/


/*********************************
******* for red-block.html ******
*********************************/
.red-power-block-container {min-height:320px;overflow:auto;margin:auto;}
.red-power-block-container h4 {text-align:center;text-decoration:underline;overflow:auto;}
.red-power-block-box {width:230px;height:300px;float:right;border: 1px solid black;padding:3px;margin:5px;}
.red-power-block-box img {max-width:160px;height:auto;margin-right:auto;margin-left:auto;display:block;}

div.red_power_block_gallery {
    overflow:auto;
    text-align:center;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
}
.red_power_block_gallery div {max-width:300px;min-width:180px;width:30%;height:auto;border:1px solid black;margin:10px;padding:10px;}
.red_power_block_gallery img {width:100%;height:auto;cursor:zoom-in;}


/*********************************
******* for mevukaim.html ********
*********************************/
div.Mevukaim_Gallery {max-width:450px;background-color:#49B5B2;text-align:center;overflow:auto;padding:5px;margin:5px auto 5px auto;}
div.Mevukaim_Gallery img {max-height:150px;height:auto;width:auto;}

#BlockBoxMevukaimLine
{
    overflow:auto;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
}
.BlockBoxMevukaim 
{
    padding: 5px;
    border: 1px solid black; 
    width: 150px;
    min-height: 240px;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-right: 8px;
    margin-left: 8px;
    color:black;
    overflow:auto;
}
.BlockBoxMevukaim h3
{
    color:red;
    font-size:16px;
    font-weight:bold;   
}
.Blcok_Box_Mevukaim_Title{ height:35px;text-align:center;}
.Block_Box_Mevukaim_Img{ height:130px;}
.Block_Box_Mevukaim_Content { font-size:16px;}



/*************************************************************************************
******* for karmit.html, termokir.html, sika.html, plaster.html, tit.html ************
**************************************************************************************/
/* Karmit.php and termokir.php and sika.php */
div.karmit_box_info, div.termokir_box_info
{
overflow:auto;
margin-bottom:20px;
}
.karmit_box_info div , .termokir_box_info div
{
width:45%;
float:right;
text-align:right;
padding:5px;
border:1px black solid;
margin:5px;
overflow:auto;
}
@media only screen and (max-width: 500px)
{
    .karmit_box_info div, .termokir_box_info div {float:unset;width:unset;margin-right:auto;margin-left:auto;}
}
/* Products tables */
table.karmit_products_table, table.termokir_products_table, table.sika_products_table, table.plaster_products_table
{
    border:1px solid black;
    max-width:800px;
    padding:3px;
    border-collapse:collapse;
}
.karmit_products_table td, .termokir_products_table td, .sika_products_table td, .plaster_products_table td
{
vertical-align:top;
border:1px solid black;
padding:3px;
margin:3px;
}
.karmit_products_table tr:hover , .termokir_products_table tr:hover, .sika_products_table tr:hover, .plaster_products_table tr:hover
{
    background-color:#f5f5f5;
}
.karmit_products_table img, .termokir_products_table img, .sika_products_table img, .plaster_products_table img
{
    max-width:200px;
    width:auto;
    height:auto;
    margin:3px;
    cursor:zoom-in;
}
.karmit_products_table h4, .termokir_products_table h4, .sika_products_table h4, .plaster_products_table h4
{
    color:#EA4335;
}
@media only screen and (max-width:500px)
{
    .karmit_products_table img, .termokir_products_table img, .sika_products_table img, .plaster_products_table img 
    {
        max-width:80px;
    }
}
@media only screen and (max-width:400px)
{
    .karmit_products_table img, .termokir_products_table img, .sika_products_table img, .plaster_products_table img 
    {
        max-width:60px;
    }
}
span.Karmit_White {color:white;}

/* Images gallery - which directs to the items full details in the table */
div.Sika_Gallery, div.Karmit_Gallery, div.Termokir_Gallery, div.Plaster_Gallery
{
    overflow:auto;
    display:flex;
    flex-wrap: wrap;
    justify-content: center;
}
div.Sika_Gallery div, div.Karmit_Gallery div, div.Termokir_Gallery div, div.Plaster_Gallery div
{
    width:145px;
    border:1px solid black;
    padding:3px;
    margin:3px;
}
div.Sika_Gallery div:hover, div.Karmit_Gallery div:hover, div.Termokir_Gallery div:hover, div.Plaster_Gallery div:hover {background-color:#f5f5f5;}
div.Sika_Gallery img, div.Karmit_Gallery img, div.Termokir_Gallery img, div.Plaster_Gallery img {max-height:100px;max-width:100%;width:auto;height:auto;display:block;margin:auto;}
div.Sika_Gallery a, div.Karmit_Gallery a, div.Termokir_Gallery a, div.Plaster_Gallery a {text-decoration:none;color:black;}
div.Sika_Gallery h4, div.Karmit_Gallery h4, div.Termokir_Gallery h4, div.Plaster_Gallery h4 {text-align:center;font-size:16px;height:40px;margin:2px auto 3px auto;}
table.sika_products_table span.Telephone_products_table, table.karmit_products_table span.Telephone_products_table, table.termokir_products_table span.Telephone_products_table, table.plaster_products_table span.Telephone_products_table {background-color:#CC0000;color:white;float:left;margin:5px;padding:3px;}
/* tit.html - Search box for the gallery ******************
*********This page is based on the above pages! ***********/
#Tit_Gallery_Search {border:1px grey solid;display:block;width:230px;padding:3px;margin:5px auto 5px 10px;}
#Tit_Gallery_Search input {width:120px;}
#Tit_Gallery_Search span {display:none;text-align:left;color:blue;cursor:pointer;}



/********************************
******* for sn8.html ********
*********************************/
/* For the page sn8.html - the table below */
table.sn8_table {direction:ltr;margin-right:auto;margin-left:auto;}
.sn8_table tr,.sn8_table th,.sn8_table td {direction:rtl;text-align: center;padding:6px;border:1px black solid;}
.sn8_table th {background-color:#6CABC9;}
th.sn8_table_row_th {background-color:#AAE4FF;}
@media only screen and (max-width:550px) 
{
    .sn8_table tr,.sn8_table th,.sn8_table td {padding:1px;font-size:16px;}
}
@media only screen and (max-width:440px) 
{
    .sn8_table tr,.sn8_table th,.sn8_table td {padding:0px;font-size:14px;}
}


/********************************
******* for ytong.html ********
*********************************/
div.Ytong_Product_Boxes {
    overflow:auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
div.Ytong_Product_Boxes_Box {padding:4px;margin:10px;border:1px solid grey;width:210px;min-height:300px;}
div.Ytong_Product_Boxes h4 {text-align:center;text-decoration:underline;}
div.Ytong_Product_Boxes_Image {width:100%;height:150px;text-align:center;}
div.Ytong_Product_Boxes_Image img {width:auto;max-width:100%;max-height:100%;}
/* Ytong midot boxes */
div.Ytong_Midot_Boxes 
{
    overflow:auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
div.Ytong_Midot_Boxes div {border:1px black solid; min-width:160px;height:auto;padding:15px;margin:10px;}




/********************************
******* for caveret.html ********
*********************************/
/* Gallery products at bottom of the page. */
div.Caveret_Gallery {overflow:auto;display:flex;flex-wrap:wrap;justify-content:center;}
div.Caveret_Gallery div.Caveret_Gallery_Box{width:250px;border:1px solid black;padding:3px;margin:4px;}
div.Caveret_Gallery div.Cavert_Gallery_Pic_Div{min-height:150px;}
div.Caveret_Gallery h4 {text-align:center;}
div.Caveret_Gallery img {max-width:120px;height:auto;border-radius:10px;display:block;margin:auto;}


/********************************
******* for mamad.html ********
********************************/
div.mamad_info_box 
{
overflow:auto;
margin-bottom:20px;
}
.mamad_info_box div 
{
width:45%;
float:right;
text-align:right;
padding:5px;
border:1px grey solid;
margin:5px;
overflow:auto;
}
@media only screen and (max-width: 600px)
{
    .mamad_info_box div{float:unset;width:unset;margin-right:auto;margin-left:auto;}
}

table.mamad_products_table
{
    border:1px solid black;
    margin:3px;
    padding:3px;
    border-collapse:collapse;/*Mehaber gvulot kfulim shel table+td*/
}
.mamad_products_table td
{
vertical-align:top;
border:1px solid black;
padding:3px;
margin:3px;
}
.mamad_products_table tr:hover 
{
    background-color:#f5f5f5;
}
.mamad_products_table img
{
    max-width:100%;
    width:160px;
    height:auto;
    margin:3px;
    cursor:zoom-in;
}

div.Oref_Box {border:1px solid grey;max-width:450px;vertical-align:middle;overflow:auto;padding:5px;margin:3px auto 3px auto;}
div.Oref_Box img{float:left;}



/********************************
******* for mosdi.html ********
********************************/
/* Table with the models of all mosdi pumps */
table.Mosdi_Pump_Table
{
    border:1px solid black;
    margin-right:auto;
    margin-left:auto;
    padding:3px;
    border-collapse:collapse;/*Mehaber gvulot kfulim shel table+td*/
}
.Mosdi_Pump_Table td, .Mosdi_Pump_Table th
{
vertical-align:top;
border:1px solid black;
padding:3px;
margin:3px;
}
.Mosdi_Pump_Table tr:hover 
{
    background-color:#f5f5f5;
}
.Mosdi_Pump_Table img
{
    margin:3px;
    cursor:zoom-in;
}



/********************************
******* for pumis.html ********
********************************/
/* Style for item boxes */
div.Product_Boxes {
    overflow:auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
div.Product_Boxes_Box {padding:4px;margin:10px;border:1px solid grey;width:210px;min-height:300px;}
div.Product_Boxes h4 {text-align:center;text-decoration:underline;}
div.Product_Boxes_Image {width:100%;height:150px;text-align:center;}
div.Product_Boxes_Image img {width:auto;max-width:100%;max-height:100%;}



/**************************************************
******* for gallery at bottom of the pages ********
***************************************************/
/* Gallery javascript!!! Important based on pumice mamad! */
#gallery_modal_box{
    display:none;
    position:fixed;
    overflow:auto;
    left:0;
    top:0;
    width:100%;
    height:100%;
    max-height:100%;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.8);
    z-index:2;
}
#gallery_modal_box_white {
    background-color:#F3F3F3;
    text-align:center;
    margin-top:50px;
    margin-left:auto;
    margin-right:auto;
    padding:20px;
    border: 1px solid #888;
    width:80%;
    display:block;
    overflow:auto;
}

#gallery_modal_box_img {max-width:90%;max-height:90%;height:auto;margin:auto;}
#gallery_modal_box_close_button{color:#aaaaaa;float:left;font-size:48px;font-weight:bold;padding-left:20px;}
#gallery_modal_box_close_button:hover, #site_menu_close_button:focus{color:#000;text-decoration:none;cursor:pointer;}
img.Enlarge_Image {cursor:zoom-in;}




/**************************
******* for ydf.html ******
***************************/
/* For the english part */
div.Ydf_English {direction:ltr;text-align:left;}



/**************************
******* for sale box ******
******* in many pages *****
***************************/
div.Sale_Box {max-width:900px;border:1px solid black;box-shadow:5px 10px 18px #888888;overflow:auto;padding:10px;margin:10px auto 30px auto;}
div.Sale_Box img {float:left;margin:10px;}
p.Sale_Box_Red {color:red;}
p.Sale_Box_Black {color:black;}
@media only screen and (max-width:500px)
{
    div.Sale_Box img {margin:3px;}
}
@media only screen and (max-width:400px)
{
    div.Sale_Box img {float:unset;margin:auto;}
}



/********************************
******* for smuya.html ********
********************************/
/* Table with the models of all smuya pumps */
#Smuya_Pump_Table_Div {padding:5px;}
table.Smuya_Pump_Table
{
    border:1px solid black;
    margin-right:auto;
    margin-left:auto;
    padding:3px;
    border-collapse:collapse;/*Mehaber gvulot kfulim shel table+td*/
}
.Smuya_Pump_Table td, .Smuya_Pump_Table th
{
vertical-align:top;
border:1px solid black;
padding:3px;
margin:3px;
}
.Smuya_Pump_Table tr:hover 
{
    background-color:#f5f5f5;
}
.Smuya_Pump_Table img
{
    width:120px;
    height:auto;
    margin:3px;
    cursor:zoom-in;
}



/********************************
******* for geves.html ********
********************************/
/* Style for item boxes */
div.Geves_Product_Boxes {
    overflow:auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
div.Geves_Product_Boxes div.Geves_Boxes_Box {
    padding:4px;
    margin:10px;
    border:1px solid grey;
    width:300px;
    min-height:300px;
}
@media only screen and (max-width:630px)
{
    div.Geves_Product_Boxes div.Geves_Boxes_Box {width:230px;}
}
@media only screen and (max-width:580px)
{
    div.Geves_Product_Boxes div.Geves_Boxes_Box {width:100%;}
}
div.Geves_Product_Boxes h3 {
    background-color:unset;
}
div.Geves_Product_Boxes p, div.Geves_Product_Boxes ul, div.Geves_Product_Boxes li {
    font-size:16px;
}
div.Geves_Boxes_Box div /*Phone number buttons in every div*/
{
    background-color:#006B95;
    color:white;
    text-align:center;
    border-radius:10px;
    font-size:18px;
    font-weight:bold;
    padding:3px;
    text-decoration:none;
}



/********************************
******* for calcar.html *********
*********************************/
div.Calcar_Boxes 
{
    overflow:auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
div.Calcar_Boxes div {border:1px black solid; min-width:160px;height:auto;padding:15px;margin:10px;}
div.Calcar_Boxes div#Calcar_Argaz ul {float:right;font-weight:bold;}
