﻿﻿* {box-sizing: border-box;}
html {font-size: 16px;}

body {
margin: 0;
font-family: fr-clm, Times New Roman, Times, serif;
max-width: 800px;
overflow-y: hidden;
margin: auto;
background: #002650;
background-image: url("../inframes/images/bg-bird.gif"); background-repeat: no-repeat; background-position: center top; background-size: 100% 35px;
-webkit-user-select: none; /*Safari */
-ms-user-select: none; /* IE*/
user-select: none; /*Standard*/
}
.topnav {height: 3.5rem; overflow: hidden; background-color: #559316;}
.topnav a {
background-color: #8a1558; border-bottom-right-radius: 15px;
float: left;
color: #f2f2f2;
text-align: center;
padding: 0.5rem 0.2rem;
margin-left: 0.3rem;
text-decoration: none;
font-size: 1.8rem;
}
/* Create a right-aligned (split) link */
.topnav a.mm {pointer-event: none;    font-size: 1.5rem; letter-spacing:0.04rem;
margin-right:0.6rem;
float: right;
background-color: #559316;
color: white;
text-shadow: 0 0 0.4rem #002650;
/* margin-top: 0.2rem; margin-bottom: 0.2rem;  מיקום ממ ורווח תחתון */
margin-to: -0.5rem; margin-bottom: 0; line-height: 3.5rem; /* תואם בדיוק לגובה של ה-topnav */
  height: 3.5rem; padding:0; margin-left: 0;
}


/*  RESIZE  IFRAME  TARGET MAMA  */
.container {
background-color: #ffffff;
position: fixed; margin:auto; max-width:800px;
width: 100%;
overflow: hidden;
padding-top: 100vh; /*10:12 5:6  קובע גובה העמוד ביחס לרוחב Aspect Ratio */
}
.responsive-iframe {
 position: absolute;
 top: 0;
 left: 0;
 bottom: 0;
 right: 0;
 width: 100%;
 height: 100vh;
 border: none;
}


/*        עבור ההודעה במסך אנכי       */

#orient-warning {
  display: none;
  position: fixed;
  top: 0; 
  left: 0; 
  width: 100vw; 
  height: 100vh;
  background-color: #fdfbf7;
  color: #002650;
  z-index: 999999;
  text-align: center;
  justify-content: center;
  align-items: center;
  flex-direction: column; /* מסדר את האייקון מעל הטקסט */
  font-family: fr-clm, Times New Roman, Times, serif;
  font-size: 1.6rem;
  font-weigh: bold;
  padding: 20px;
  box-sizing: border-box;
}

/* הנפשת סיבוב קלה לאייקון הטלפון */
.phone-icon {
  width: 50px;
  height: 50px;
  margin-bottom: 15px;
  animation: rotatePhone 2.5s infinite ease-in-out;
}

@keyframes rotatePhone {
  0%, 10% { transform: rotate(-90deg); }
  50%, 60% { transform: rotate(0deg); }
  100% { transform: rotate(-90deg); }
}

@media screen and (orientation: landscape) and (max-height: 550px) {
  html, body { overflow: hidden !important; }
  #orient-warning { display: flex !important; }
}

/*        סוף - עבור ההודעה במסך אנכי - סוף      */



/*  ON RESIZE  SCREEN */
@media only screen and (max-width: 800px) {
body {background-color:#ffffff;}
}

@media only screen and (max-width: 520px) {
html {font-size: 14px;}
.topnav a {font-size: 1.6rem}
/*.topnav a.mm {font-size: 1.4rem}*/
}

/*
@media only screen and (max-device-width: 510px) {
.topnav a {font-size:1.54rem; margin-botto: 0.4rem;}
.topnav a.mm {margin-to: -0.5rem;}
}
@media only screen and (max-device-width: 480px) {
.topnav a {font-size:1.54rem;}
}
@media only screen and (max-device-width: 435px) {
.topnav a{font-size: 1.4rem; padding: 0.6rem 0.2rem;}
.topnav a.mm {margin-right: 0.3rem;}
}
@media only screen and (max-device-width: 400px) {
.topnav a{font-size: 1.38rem;}
.topnav a {padding: 0.6rem 0.2rem;}
.topnav a.mm {margin-right: 0.5rem;}
}
@media only screen and (max-device-width: 375px) {
.topnav a {font-size: 1.34rem;}
.topnav a.mm {margin-righ: -0.1rem;}
}
@media only screen and (max-device-width: 350px) {
.topnav a {font-size: 1.3rem;}
}

@media only screen and (max-device-width: 340px) {
.topnav a {font-size: 1.2rem; padding: 0.7rem 0.2rem;}
.topnav a.mm {margin-right:0.3rem; margin-left:0; word-spacin: -0.1rem; letter-spacin: -0.04rem;}
}
*/
