/*--------------------------------------------------
BODY
--------------------------------------------------*/
*{
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
   box-sizing: border-box;         /* Opera/IE 8+ */
 }
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {display:block; }
audio, canvas, video {display:inline-block; *display:inline; *zoom:1; }
audio:not([controls]) {display:none; }
[hidden] {display:none; }
html {font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; height: 100% }
html, button, input, select, textarea {  font-family:'FbMetropoliSans'; color:#3a3a3c; }


body {margin:0; padding:0; background:#fff; font-size:16px; line-height:1;height: 100%; font-weight: 400; }
::-moz-selection {background:#72a9bd; color:inherit; text-shadow:none;}
::selection {background:#72a9bd; color:inherit; text-shadow:none; }
img::selection {background:transparent;}
img::-moz-selection {background:transparent;}
a{outline: none; }
a{ color: #fff;; text-decoration: none; font-weight: 700; }
a:hover{ color:#CCCCCC; }
img {border: none;}
.f-left{float: left;}
.f-right{float: right;}
.left{text-align: left;}
.right{text-align: right;}
.center{text-align: center;}
.clear{ clear: both;}
.ib{display: inline-block;}
.rtl{direction:rtl;}
body{
	-webkit-font-smoothing: subpixel-antialiased !important;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility:    hidden;
    -ms-backface-visibility:     hidden;
		 background-color: #3a3a3c; background-image: url(pics/pattern.png);
}

input, select{ font-size: 100%; }

/*--------------------------------------------------
Non-Semantic Helper Classes
--------------------------------------------------*/
.ir {display:block; border:0; text-indent:-999em; overflow:hidden; background-color:transparent; background-repeat:no-repeat; text-align:left; direction:ltr; *line-height:0;}
.ir br {display:none;}
.hidden {display:none !important; visibility:hidden;}
.visuallyhidden {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;}
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto;}
.invisible {visibility:hidden;}
.clearfix:before, .clearfix:after, .cf:before, .cf:after  {content:""; display:table;}
.clearfix:after, .cf:after {clear:both;}
.clearfix, .cf {*zoom:1;}
::-webkit-input-placeholder {   color: #3a3a3c;}
:-moz-placeholder { /* Firefox 18- */   color: #3a3a3c;}
::-moz-placeholder {  /* Firefox 19+ */    color: #3a3a3c;}
:-ms-input-placeholder {   color: #3a3a3c;}



:focus::-webkit-input-placeholder {color: transparent}
:focus::-moz-placeholder          {color: transparent}
:focus:-moz-placeholder           {color: transparent}
:focus:-ms-input-placeholder      {color: transparent}

/*--------------------------------------------------
Typography
--------------------------------------------------*/
h1{	margin: 0;	padding:0; font-size: 3em; font-weight: 300; direction: rtl; color: #beaf87;}
h2{font-size:2em;   font-style:normal;  font-weight: 700;  margin: 0; direction: rtl; color: #beaf87}
h3{	margin: 0;	padding: 0; font-size: 1.75em;font-weight: 300;direction: rtl; color: #fff; }
h4{	font-size: 2.5rem;font-weight:  700;  margin: 0; direction: rtl; color: #fff; }
h5{	font-size: 1.2em; font-weight: 700;  margin: 0; direction: rtl; color: #DB0209;padding:0 }
.red{ color: #C7050D; }

h1 span{  font-weight: 700; }
h2 span{ color: #fff; }

/*--------------------------------------------------
Basic
--------------------------------------------------*/
#wrapper{
    width: 100%;
    margin:0 auto;
    position: relative;
	height: 100vh;

}
.width-wrapper{ width: 90%; margin:0 auto;     position: relative; padding-top: 1.5%; }
.top_image{ position: relative; }
 #logo{ position: absolute; left:5%; top:30px; width: 15%; }
 #logo img{  width: 100%; }


  .video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#holder{direction: rtl;}
.cont_form{ width: 25%; display: inline-block; vertical-align: top; margin-left:-4px;}
.video{ width: 42%; display: inline-block; vertical-align: top; margin-left:-4px; padding: 0 3% 0 5%; padding-top:.5%;}
.title{ width: 33%; display: inline-block; vertical-align: top; margin-left:-4px;}
.title h2{ color: #fff; font-size: 2.66em; padding:2px 0 12px 0;  font-weight: 300;}
.title h2 span{ font-weight: 500; }
.title h3 span{ font-size: 150%; color: #BEAF87; font-weight: 700; }
.title h4{ font-size: 1.66em; font-weight: 300; }
.cont_form h1.tnx{ padding-bottom:50% }
.cont_form input[type="text"]{
  width: 100%;
 background-color: #fff;
  border:none;
  padding:10px;
  text-align:right ;
  outline: 0;
  font-size: 1.33em;
    margin-top:20px;
	border-radius: 3px;

}

.cont_form input[type="submit"]{
 width: 100%;

   background-color: #beaf87;
  border: none;
  padding:10px;
  cursor: pointer;
  margin-top:15px;
  font-size: 1.33em;
  color:#fff;
  	border-radius: 3px;
  text-align: center;
  -moz-transition: all .3s linear;
-o-transition: all .3s linear;
-webkit-transition: all .3s linear;
transition: all .3s linear;
}

.cont_form input[type="submit"]:hover{  }

 #mob_pic{ display: none; }

 .nomob{ display: block; }
 .mob{ display: none; }
  .first{ position: fixed; top:105px; width: 45px; }
  .first img{ width: 100%; }
 .first button{ padding:0 ;margin:0; border:none; background-color: transparent; }
#phone{ position: absolute; bottom:100px;right:0; }
#phone a{ display: block; width: 50px; height: 50px; margin-bottom:7px; background-color:#3A3A3C; padding:12px; }
/*#phone a:first-child{ background-color:#2573d3}*/
#phone img{ width: 100%; }
.top_image img{ width:100%; }
.tnx{ width: 100%; text-align: center; padding-top:7%; }
.backtosite{ text-align: center; display: block;  }
.backtosite a{ background-color: #BEAF87; color: #3A3A3C; padding:12px 25px; border-radius: 3px; margin-top:2.5%; display: inline-block; }

/*--------------------------------------------------
media query
--------------------------------------------------*/

@media screen and (min-width:100px) and (max-width:959px) {
.nomob{ display: none; }
.mob{ display: block; }
#wrapper{ width: 100%; }
#logo{ top:15px; width: 50%; }
#phone{ bottom:0; right:0; left: auto; }
.title,.video{ width: 100%; }
.video{ padding:5% 0; }
body{ font-size: 14px; }
h2{ font-size: 1.66em; }
.title h2{ font-size: 2.66em; }
  h3{  font-size: 1.66em;}
  .title h3 span{ font-size: 145%; }
  h1{ font-size: 3.66em; }
 .tnx{ padding-top:20% }
 .cont_form{ width: 100%; padding-bottom:4%; }

 }


@media screen and (min-width:560px) and (max-width:959px) {

}


@media screen and (min-width:960px) and (max-width:1024px) {
  body{ font-size: 12px; }
.cont_form input[type="text"],.cont_form input[type="submit"]{ padding:7px; }

}
@media screen and (min-width:1025px) and (max-width:1200px) {
 body{ font-size: 12px; }
.cont_form input[type="text"],.cont_form input[type="submit"]{ padding:7px; font-size: 1em; }

}
@media screen and (min-width:1200px) and (max-width:1400px) {
 body{ font-size: 14px; }
.cont_form input[type="text"],.cont_form input[type="submit"]{ padding:7px; }
}
@media screen and (min-width:1401px)  and (max-width:1599px){


 }
@media screen and (min-width:1600px)  and (max-width:1699px){

}