/*prevents the apparition of a border around the input field when clicked*/
body {margin: 0; width: 100%;  direction: rtl; background: }
input:focus, select:focus {outline: none} 
a.inner {color: blue}



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


@media only screen and (min-width: 310px)

{
div.sep {margin-bottom: 5%}
div.sepSmaller {padding-bottom: 3%}

div.searchRow {padding-top: 2%; margin-right: 2%}

input.inputBox {font: 1.4vw Arimo}

div.copyrightLine {font: 1.6vw Arimo; text-align: center;}



div.siteNameContainer {width: 100%; padding-top: 2%; }
div.siteName {font: 9vw Cinzel; text-align: center;}
a.siteName {text-decoration: none; color: black}
div.siteDesc {font: 4.5vw Arimo; text-align: center}

/*Top categories ribbon. Font size appears in anchor*/
div.categoryList {text-align: center; background: #a8001c; margin-bottom: 4%; padding-top: 0.5%; 
	padding-bottom: 0.5%; } 
a.categoryList {font: 5vw Arimo; text-decoration: none; color: white}

/*centered heading like [קטגוריות]*/
div.incomingType {font: 5.5vw Arimo;  text-align: center;  margin-bottom: 3%; padding-top: 4%}

/*below the thumbnails*/
a.typeNames {font: bold 4vw Arimo; color: #909090; text-decoration: none; color: black; text-align: center; margin-bottom: 4%}

div.container {display: grid; grid-template-columns: repeat(1, 1fr); grid-row-gap: 0.5%; width: 90%; margin-left: auto; margin-right: auto;}

div.aboutHeading {font: bold 5.5vw Arimo; color: green; margin-top: 5%; }
div.aboutText {font: 4.5vw Arimo;}


/*recipe template*/
	
div.recipePage {width: 85%; margin-left: auto; margin-right: auto; text-align: right; margin-top: 2%}
div.recipeName {width: 100%; font: bold 4.5vw Arimo; text-align: center; margin-bottom: 1%}
div.shortDesc {width: 100%; font: 4vw Arimo; padding-bottom: 2%;  text-align: center; letter-spacing: 0.1px;}
div.bigPict {text-align: center}
div.photoBy {font: 3vw Arimo; width: ; text-align: left; color: #818181}
div.params {font: 3vw Arimo; margin-top: 4%; background: #eae8df; text-align: center}

div.theRest {width: 95%; margin-left: auto; margin-right: auto;}
div.longDesc {font: 4vw Arimo;  padding-bottom: 3%; padding-top: 3%;}


div.subTitle {font: bold 4.3vw Arimo; color: #95761a; margin-bottom: 2%; border-bottom: 1pt solid silver; padding-top: 0.8%;}
div.remarksText {font: 4vw Arimo; margin-bottom: 2%; padding-bottom: 2%;}

div.ingredients {font: 4vw Arimo;}

div.instructionText {font: 4.3vw Arimo; padding-bottom: 3%}



/*TIPS*/

/*MAIN PAGE*/

/*Below thumbnails*/
img.thumbNailSize {max-width: 100%; height: auto;}
a.tipName {font: bold 4vw Arimo; text-align: center; margin-bottom: 4%; color: black; text-decoration: none}
div.tipPhotoBy {font: 1.1vw Arimo; width: ; text-align: left; color: #818181}

/*DETAILS PAGE*/

div.tipHeading {font: 6vw Arimo; text-align: center; margin-bottom: 2%; }
div.largePict {text-align: center;}
img.largePict {max-width: 100%; height: auto; }


div.tipBody {font: 4vw Arimo; width: 85%; margin-top: 2%; margin-left: auto; margin-right:auto; text-align: right; direction: rtl}

span.subTitle {font-weight: bold; color: #009300}
div.subTitleAbout {font: 2vw Arimo; color: #009300}

div.tipImage {margin-top: 3%; margin-bottom: 3%; text-align: center}
img.tipImage {max-width: 100%; height: auto;}


a.tipLink {text-decoration: none; color: blue;}

}



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

@media only screen and (min-width: 390px)


{
/*checking whether the value is taken from here - changed from 3.5 to 4*/
input.inputBox {font: 4.5vw Arimo; border: none; background: #dddddd}

}

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


@media only screen and (min-width: 750px)

{

div.sep {margin-bottom: 5%}
div.sepSmaller {padding-bottom: 3%}
/*input.inputBox {font: 3.5vw Arimo}*/

div.copyrightLine {font: 3vw Arimo; text-align: center;}

div.searchRow {padding-top: 2%; margin-right: 2%}
input.inputBox {font: 2.5vw Arimo; border: none; background: #dddddd}
/*div.inputButton {float: right;  font-size: 25px; border: none; cursor: pointer; background: #d5d5d5}*/
div.contactLine {font: 3vw Arimo; text-align: right;}

div.notFoundMsg {font: 1.2vw Arimo; text-align: center; direction: rtl}


div.siteNameContainer {width: 100%; margin-top: 1%; margin-bottom: 1%; }
div.siteName {font: 7vw Cinzel;}
a.siteName {text-decoration: none; color: black}
div.siteDesc {font: 3.5vw Arimo; text-align: center}

/*Top categories ribbon. Font size appears in anchor*/
div.categoryList {text-align: right; padding-right: 1%; margin-bottom: 4%; padding-top: 0.5%; 
	padding-bottom: 0.5%; border-top: 1pt solid grey; border-bottom: 1pt solid #bbbbbb; } 
a.categoryList {font: 3.3vw Arimo; text-decoration: none; color: white}

/*centered heading like [קטגוריות]*/
div.incomingType {font: 5vw Arimo;  text-align: center;  margin-bottom: 3%; margin-top: 3%}

/*below the thumbnails*/
a.typeNames {font: 3vw Arimo; text-decoration: none; color: black; text-align: center;}

div.container {display: grid; grid-template-columns: repeat(3, 1fr); grid-column-gap: 0.1%; grid-row-gap: 2%; width: 100%; margin-left: auto; margin-right: auto; margin-bottom: 5%}

div.aboutHeading {font: bold 4vw Arimo; color: green; margin-top: 2%}
div.aboutText {font: 3.5vw Arimo; }
img.aboutPict {width: 50%; float: left; margin: 2%}

/*recipe template*/
	
	div.recipePage {width: 85%; margin-left: auto; margin-right: auto; text-align: right; margin-top: 2%}
	div.recipeName {width: 100%; font: bold 3.4vw Arimo; text-align: center; margin-bottom: 1%}
	div.shortDesc {width: 100%; font: 3vw Arimo; padding-bottom: 2%;  text-align: center; letter-spacing: 0.1px;}
	div.bigPict {text-align: center}
	div.photoBy {font: 2.4vw Arimo; width: ; text-align: left; color: #818181}
	div.params {font: 3vw Arimo; color: black;}
	
	div.theRest {width: 95%; margin-left: auto; margin-right: auto;}
	div.longDesc {font: 3vw Arimo;  padding-bottom: 3%; padding-top: 3%; color: black}

	/*הערות*/
	div.subTitle {font: bold 3.6vw Arimo; color: #95761a; margin-bottom: 2%; border-bottom: 1pt solid silver; padding-top: 0.8%;}
	div.remarksText {font: 3vw Arimo; margin-bottom: 2%; padding-bottom: 2%;}

	div.ingredients {font: 3vw Arimo;}
	
	div.instructionText {font: 3vw Arimo; padding-bottom: 3%}


/*TIPS*/

/*MAIN PAGE*/

/*Below thumbnails*/
img.thumbNailSize {max-width: 90%; height: auto;}
a.tipName {font: bold 2.5vw Arimo; text-align: center; margin-bottom: 4%; color: black; text-decoration: none}

/*DETAILS PAGE*/

div.tipHeading {font: 5vw Arimo; text-align: center; margin-bottom: 2%; }
div.largePict {text-align: center}
img.largePict {max-width: 100%; height: auto; }
div.tipPhotoBy {font: 2.5vw Arimo}

div.tipBody {font: 3vw Arimo; width: 85%; margin-top: 2%; margin-left: auto; margin-right:auto; text-align: right; direction: rtl}

span.subTitle {font-weight: bold; color: #009300}
div.subTitleAbout {font: 2vw Arimo; color: #009300}

div.tipImage {margin-top: 3%; margin-bottom: 3%; text-align: center}
img.tipImage {max-width: 100%; height: auto;}


a.tipLink {text-decoration: none; color: blue;}


}


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

@media only screen and (min-width: 820px)
{
div.copyrightLine {font: 2.1vw Arimo; text-align: center;}
div.aboutHeading {font: bold 3.5vw Arimo; color: green; margin-top: 2%}
div.aboutText {font: 2.5vw Arimo; }
}


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



@media only screen and (min-width: 1090px)

{

div.sep {margin-bottom: 2%}
div.sepSmaller {margin-bottom: 0.1%}

/*input.inputBox {font: 1.2vw Arimo}*/

div.notFoundMsg {font: 1.2vw Arimo; text-align: center; direction: rtl}

div.searchRow {padding-top: 1%; margin-right: 2%}
div.inputBox {font: 1.5vw Arimo; border: none; background: #dddddd}
/*div.inputButton {float: right;  font-size: 25px; border: none; cursor: pointer; background: #d5d5d5}*/
div.contactLine {font: 1.1vw Arimo; text-align: right; padding-right: 1%; padding-bottom: 1%;  border-top: 1pt solid silver}


div.siteNameContainer {width: 100%; margin-bottom: 1%; }
div.siteName {font: 3.5vw Cinzel; text-align: center; margin-left: }
a.siteName {text-decoration: none; color: black}
div.siteDesc {font: 1.5vw Arimo; text-align: center}

/*Top categories ribbon. Font size appears in anchor*/
div.categoryList {padding-right: 1%; padding-top: 0.5%; 
	padding-bottom: 0.5%; border-top: 1pt solid #bbbbbb; border-bottom: 1pt solid #bbbbbb; } /*FONT SIZE APPEARS IN ANCHOR*/
a.categoryList {font: 1.6vw Arimo; text-decoration: none; color: white}

/*centered heading like [קטגוריות]*/
div.incomingType {font: 2.3vw Arimo;  text-align: center;  margin-bottom: 2%; margin-top: -4%}

/*below the thumbnails*/
a.typeNames {font: bold 1.2vw Arimo; text-decoration: none; color: black; text-align: center;}

div.container {display: grid; grid-template-columns: repeat(4, 1fr); grid-column-gap: 1%; grid-row-gap: 1.5%; width: 90%; margin-left: auto; margin-right: auto; margin-bottom: 5%}

div.aboutHeading {font: bold 1.7vw Arimo; color: green; margin-top: 2%}
div.aboutText {font: 1.3vw Arimo; }
img.aboutPict {width: 40%; float: left; margin: 2%}



/*recipe template*/
	
	div.recipePage {width: 75%; margin-left: auto; margin-right: auto; text-align: right; margin-top: 2%}
	div.recipeName {width: 100%; font: bold 2vw Arimo; text-align: center; margin-bottom: 1%;}
	div.shortDesc {width: 100%; font: 1.6vw Arimo; padding-bottom: 2%;  text-align: center; letter-spacing: 0.1px;}
	div.bigPict {text-align: center}
	div.photoBy {font: 1.3vw Arimo; width: ; text-align: left; color: #818181}
	div.params {font: 1.3vw Arimo; margin-top: 2%; text-align: center; color: #5e5e5e; background: #f2f2f2}
	
	div.theRest {width: 75%; margin-left: auto; margin-right: auto;}
	div.longDesc {font: 1.5vw Arimo;  padding-bottom: 3%; padding-top: 3%;}

	
	div.subTitle {font: bold 1.5vw Arimo; color: #95761a; margin-bottom: 2%; border-bottom: 1pt solid silver; padding-top: 0.8%;}
	div.remarksText {font: 1.5vw Arimo; margin-bottom: 2%; padding-bottom: 2%;}
	
	div.ingredients {font: 1.5vw Arimo;}

	div.instructionText {font: 1.5vw Arimo; padding-bottom: 3%}
	


/*TIPS*/

/*MAIN PAGE*/

/*Below thumbnails*/
a.tipName {font: bold 1.1vw Arimo; text-align: center; margin-bottom: 2%; color: black; text-decoration: none}
img.thumbNailSize {max-width: 100%; height: auto;}


/*DETAILS PAGE*/

div.tipHeading {font: 2.5vw Arimo; text-align: center; margin-bottom: 2%; }
div.largePict {text-align: center}
img.largePict {max-width: 70%; height: auto; }
div.tipPhotoBy {font: 1.3vw Arimo; width: 85%; text-align: left; color: #959595}

div.tipBody {font: 1.3vw Arimo; width: 60%; margin-top: 2%; margin-left: auto; margin-right:auto; text-align: right; direction: rtl}

span.subTitle {font-weight: bold; color: #009300}
div.subTitleAbout {font: 2vw Arimo; color: #009300}

div.tipImage {margin-top: 3%; margin-bottom: 3%; text-align: center}
img.tipImage {max-width: 90%; height: auto;}


a.tipLink {font: 1.3vw Arimo; text-decoration: none; color: blue;}


}


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





@media only screen and (min-width: 1200px)

{


div.copyrightLine {font: 1.6vw Arimo; text-align: center;}
div.siteDesc {font: 2.5vw Arimo; text-align: center;}
input.inputBox {font: 2vw Arimo}

div.photoBy {font: 1vw Arimo; width: ; text-align: left; color: #818181}
div.siteDesc {font: 1.7vw Arimo; text-align: center;}

div.aboutHeading {font: bold 2.5vw Arimo; color: green; margin-top: 2%}
div.aboutText {font: 1.7vw Arimo; }
img.aboutPict {width: 50%; float: left; margin: 2%}

}



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




@media only screen and (min-width: 1500px) /*Rose desktop*/

{

div.siteDesc {font: 1.5vw Arimo; text-align: center;}

/*Top categories ribbon. Font size appears in anchor*/
a.categoryList {font: 1.4vw Arial; text-decoration: none; color: white}

/*centered heading like [קטגוריות]*/
div.incomingType {font: 1.3vw Arial;  text-align: center;  margin-bottom: 2%; margin-top: -4%}

a.typeNames {font: bold 1vw Arial; text-decoration: none; color: black; text-align: center;}

/*centered heading like [קטגוריות]*/
div.incomingType {font: 2.3vw Arimo;  text-align: center;  margin-bottom: 2%; margin-top: -4%}


div.container {display: grid; grid-template-columns: repeat(5, 1fr); grid-column-gap: 0.1%; grid-row-gap: 2%; width: 90%; margin-left: auto; margin-right: auto; margin-bottom: 5%}

}