﻿@import url('https://fonts.googleapis.com/css2?family=Ropa+Sans&display=swap');
html            { }
body { direction: rtl; margin: 0px; color: #333; font-size: 18px; background-color: #FFFFFF; font-family: 'fbspoiler','Ropa Sans'; overflow-x: hidden; }
table			{ padding: 0px; margin: 0px; }
td				{ vertical-align: top; padding: 0px; }
p				{ direction: rtl; margin-top: 0px; margin-bottom: 0px; }
a               { }

input[type="text"], input[type="password"] { outline: none; }
textarea        { outline: none; }


#SiteContainer {
    position: relative;
    overflow: hidden;
}
#SiteHeaderContainer    { border-bottom:10px #F0F0F0 solid; margin-bottom:30px; }
#SiteGridContainer      { }
#SiteFooterContainer    { }


#SiteHeader             { background-color:Black; }
#SiteGrid               { }
#SiteFooter             { }



#GridRight              { float:right; width:200px; margin-left:50px; }
#GridPage               { float:right; width:870px; margin-left:50px; }
#GridLeft               { float:right; width:270px; }
#GridTop                { }
#GridContent            { }
#GridFooter             { }
 
#PageLeft               { }
#PageMenu               { margin-top: 18px; }
#PageHeader             { }
#PageContent            { }
#PageKdm                { }
#PageFooter             { }


@media (max-width:485px)  {
    body {
        font-size: 16px;
    }    
}

@media (max-width:400px)  {
    body {
        font-size: 14.5px;
    }    
}

h1#site-title {
    margin: 0px;
}

@media (max-width:767px) {
.families-mobile-bottom-icons { display: block !important; }
.families-icons { display:none; }
.families-right-menu-icons { width:40% !important; padding:15px; float:right; margin:0 !important; }
    .families-mobile-bottom-icons > a:last-child { display: inline-block; width: 100%; text-align: center; }
}

/***********************************Header********************************************************/

a#SiteLogo      { display:block; margin-left:auto; margin-right:auto; width:200px; height:80px; margin-bottom:20px; }


#SiteChannels               { }

#MainNav                    { }
#MainNav a                  { color:#ffffff; }

#MainNav .menuButton        { display:block; float:left; position:relative; padding-left:0px; padding-right:0px; z-index:700; float:right; margin: 0px 10px;}
#MainNav .menuButtonH       { display:block; float:left; position:relative;  padding-left:0px; padding-right:0px;  z-index:700;}

#MainNav .menuButton a      { display:block; text-decoration:none; font-size:15pt; margin-left:35px; font-weight:normal; color:white;  margin-left:0px;}
#MainNav .menuButtonH a     { display:block; text-decoration:none; font-size:15pt; margin-left:35px; font-weight:normal; color:#25221C;}

#MainNav .ddMenu                    { position:absolute; left:20px; top:20px; padding:10px 0px 0px 0px; width:164px;  }
#MainNav .menuButton .ddMenu        { visibility:hidden; }
#MainNav .menuButtonH .ddMenu       { visibility:visible;}


#MainNav .ddMenuBox                 { width:164px; padding:21px 0px 0px 0px; }
#MainNav .ddMenuBox  .ddMenuContent { width:139px; padding:0px 10px 0px 15px; }
#MainNav .ddMenuBox  .ddMenuBottom  { width:164px; height:11px; background:url('../images/bottom.png') no-repeat top;}
#MainNav .ddMenuSubject             { margin-top:10px; height:auto; } 
#MainNav .ddMenuSubject a           { text-decoration:none; height:auto; font-weight:normal; font-size:14px; margin-bottom:0px; margin-left:0px;}
#MainNav .ddMenuSubject a:visited   { text-decoration:none; }
#MainNav .ddMenuSubject a:hover     { text-decoration:none; }


#PageBreadCrumps            { padding-right:0px;  background-repeat:no-repeat; background-position:right; direction:rtl; }
#PageBreadCrumps a:link     { background-image:url('../images/breadcrumbs-arrow.png'); color:#5A5B5E; text-decoration:none !important; font-size:14px; display:inline-block; padding-right:25px;  background-repeat:no-repeat; background-position:85% center; }
#PageBreadCrumps a:first-child {background-image: none;padding-right: 0;background: url('../../../000Frames/site/images/home-breadcrumbs.png');background-repeat: no-repeat;background-position: right 0 top 0px;padding-right: 16px;background-size: auto 100%; padding-top: 4px;}
#PageBreadCrumps a:visited  { color:#5A5B5E; text-decoration:none !important;}
#PageBreadCrumps a:hover    { color:#5A5B5E; text-decoration:underline;  }


/************************************SiteMenu*********************************************************/

#menuHead a     { font-size: 29px;color: #313131; }

#rightMenu .menuLink:hover    {  }
#rightMenu  div         { border-bottom: 1px solid #9C9C9C;padding-bottom: 8px;padding-top: 8px; }
.menuLink a             { font-size: 18px;color: #333; background-image: url('../../../000Frames/site/images/arrow-sidebar.png'); background-repeat: no-repeat; background-position: right;   padding-right: 14px; text-decoration:none; text-align: right; }
.menuLink a:hover       { background-image: url('../../../000Frames/site/images/arrow-sidebar-selected.png'); background-repeat: no-repeat; background-position: right;  text-decoration:none; text-align: right; }
.menuLink a.selected    { background-image: url('../../../000Frames/site/images/arrow-sidebar-selected.png'); background-repeat: no-repeat; background-position: right;  text-decoration:none; text-align: right; }
.menuHead a             { font-size: 30px;color: #313131 !important;background: none !important; text-decoration:none; }

#nextPageButton a       {display: inline-block;background-color: #C5C5C5;padding: 10px 15px 10px 15px;text-decoration: none !important;color: black;border-radius: 5px;border: 1px solid #A4A4A4;font-size: 19px;}

.activities-right-menu-icons { width:100%; }
 #right-menu-h3-supported { font-size: 32px; border-bottom: 5px solid; margin-top: 15px; margin-bottom: 25px; #313131 !important; }
#BFAMI-LOGO { height:20px; }
.richkid-logo{text-align:center;margin:0 auto; }
/***********************************************************************************************************/

#anchor                 { margin-bottom:15px; margin-top:-5px; font-size:12px; }
#headline h1            { font-size: 60px; margin:0 auto; }
#headline               {}
#subheadline h2         { margin: 0;padding: 0; font-size: 1.333em; }
#writer                 { margin-bottom:5px; font-weight:normal; }
#body                   { margin-top: 20px; margin-bottom:20px;line-height:21px;}
h3                      { color: inherit; font: inherit ; text-shadow: inherit;margin: inherit; font-size: 1.11em;}
h4                      {  }
#remarks                { font-size:12px; }
#video                  { margin-bottom:20px; }
#video video            { width:100%; height:auto; }
#body strong            { }
#body b                 { }
.picD                   {width: 100%; height: auto; margin-bottom:15px;margin-top:15px;}

.directoryMode #headline h1 { font-size: 1.278em;color: #59595B; line-height:normal; padding-bottom:0px; border-bottom:0px; }

#DirectoryHeadline h2   { font-size: 3.222em;margin-bottom: 26px;color: #409FCD;line-height: 46px;font-weight: 500;padding-bottom: 9px;}
#InnerNav               { border-top: 3px solid #3FA1C6; border-bottom: 3px solid #3FA1C6; padding-top: 8px; padding-bottom: 2px; }
#InnerNav a             { margin-bottom: 6px;text-align: center;color: #A4A4A4;text-decoration: none;background: url('../../../000Frames/site/images/arrow-sidebar.png');background-repeat: no-repeat;background-position: right;padding-right: 14px;display: inline-block;margin-left: 6px;  }
#InnerNav a.selected    { color: #3FA1C6;background: url('../../../000Frames/site/images/arrow-sidebar-selected.png');background-repeat: no-repeat;background-position: right;}
/********************************************************************************************/

.headingCap     { color:#001542; padding:2px 0px 2px 0px; font-size:0.889em; font-weight:normal; border-top:2px solid #55c2e3; border-bottom:1px solid #8cd7ec; margin-bottom:5px; }
.heading4       { font-size: 1.444em; font-weight:normal;color:#26231E; }
.heading5       { font-weight:normal; font-size: 1em; color:#26231E;  margin-bottom:5px; text-decoration:none; }
.heading5 a     { text-decoration:none; }
.normal         { font-size: 0.722em; color:black; }


.header         { font-size: 1.222em;  padding-bottom:15px; }
.head           { background:  url('../../../000Frames/site/images/quotes.png') no-repeat ; background-position:50% 28px; padding-top: 61px; text-align: center; margin-top: 10px;margin-bottom: 10px;padding-bottom: 15px;}

.small          { font-size: 0.611em; color:#696969;}
.small2         { font-size: 0.667em; color:#696969;}

.ErrorMessage   { color:Red; display:none;}

/*********************************************************************************************/

.ArticleBox                     { width:246px; position:relative; overflow:hidden; border:1px solid #E0E0E0; }
.ArticleBox img                 { margin:13px; width:220px; height:180px; border:0px; }
.ArticleBox .AticleBoxCover     { background-color:#F7F7F7; padding:13px; border-top:1px solid #E0E0E0; }
.ArticleBox .ArticleBoxTitle    { color:#203D75; margin-bottom:5px; }
.ArticleBox .ArticleBoxHeadline { font-size: 0.667em; }

.ArticleBoxWide                     { width:512px; position:relative; border:1px solid #E0E0E0; }
.ArticleBoxWide img                 { width:486px; margin:13px; border:0px; }
.ArticleBoxWide .AticleBoxCover     { background-color:#F7F7F7; padding:13px; border-top:1px solid #E0E0E0; }
.ArticleBoxWide .ArticleBoxTitle    { color:#203D75; font-size: 1.222em; font-weight:normal; }
.ArticleBoxWide .ArticleBoxHeadline { font-size: 0.667em; margin-bottom:15px; margin-top:15px; }
.ArticleBoxWide .ArticleBoxText     { font-size: 0.667em; } 


.ArticleBoxNarrow                   { width:356px; height:173px; position:relative; background-position:center top; background-repeat:no-repeat; overflow:hidden; background-color:#8FA9DC; }
.ArticleBoxNarrow a                 { display:block; height:173px; width:100%; text-decoration:none !important; padding-top:1px; }
.ArticleBoxNarrow .ArticleBoxTitle  { width:100%; height:30px; position:absolute; bottom:0px; /*background-image:url('../images/bg-black-content.png');*/  } 
.ArticleBoxNarrow .ArticleBoxTitle .ArticleBoxTitle-label       { color:#FFFFFF; padding:0px 15px 5px 15px; font-size: 1.389em; height:30px; }
.ArticleBoxNarrow .ArticleBoxTitle .ArticleBoxTitle-headline    { color:#FFFFFF; padding:10px 15px 0px 15px; font-size: 0.667em; height:50px; background-color:#203E74; }


.VideoBox { width:179px; border:0px;  }
a.VideoBoxImg   { width:177px; height:177px; display:block; }
a.VideoBoxImg .VideoBoxHover        { display:none; width:100%; height:100%; position:relative; opacity:0.4; background-color:Black; }
a.VideoBoxImg .VideoBoxHover img    { position:absolute; top:50%; margin-top:-16px; right:50%; margin-right:-25px; }
a.VideoBoxImg:hover .VideoBoxHover  { display:block; }
.VideoBoxTitle      { text-align:center; font-size: 1em; margin-top:3px; border-radius:3px; }
.VideoBoxTitle a    { color:Black; text-decoration:none !important; }
.VideoBoxHeadline   { text-align:center; color:#58595B; }


.StoryBox                       { margin-bottom:30px; }
.StoryBox .StoryBoxTitle        { margin-bottom:3px; }
.StoryBox .StoryBoxTitle a      { color:#58595B;  text-decoration:none; }
.StoryBox .StoryBoxHeadline     { margin-bottom:3px; }
.StoryBox a.ReadMore            { display:inline-block; border:2px solid #58595B; color:#58595B; text-decoration:none; padding:8px 45px 8px 25px; background-image:url('../images/addon-icon01-black.png'); background-repeat:no-repeat; background-position:right 10px top 7px; border-radius:5px; margin-top:5px; }
.StoryBox a.ReadMore:hover      { border:2px solid #ed3023; color:#ed3023; text-decoration:none; background-image:url('../images/addon-icon01.png'); }


.item2cols                  { overflow:auto; margin-bottom:30px; }
.item2cols .colRight        { width:210px; height:140px; overflow:hidden; float:right; margin-left:10px; }
.item2cols .colRight img    { width:210px; height:140px; border:1px solid #C0C0C0; }

.item2cols .colLeft         { float:right; position:relative; padding-top:1px; width:330px; }
.item2cols .colLeft .item2colsTitle     { margin-bottom:3px; }
.item2cols .colLeft .item2colsTitle a   { text-decoration:none !important; color:#58595B; }
.item2cols .colLeft .item2colsHeadline  { margin-bottom:5px; }
.item2cols .colLeft .item2colsHeadline a  { text-decoration:none; color:#58595B; }
.item2cols .colLeft .item2colsWriter    { color:#58595B; display:inline-block; padding:3px 25px 3px 0px; font-size: 0.778em; background-image:url('../images/icon_writer.png'); background-repeat:no-repeat; background-position: right; margin-left:20px; }
.item2cols .colLeft .item2colsDate      { color:#58595B; display:inline-block; padding:3px 25px 3px 0px; font-size: 0.778em; background-image:url('../images/icon_date.png'); background-repeat:no-repeat; background-position: right; }


.kdmObjectWrapper   { margin-bottom:15px; }



.kdmObject                      { border:1px solid silver; padding:8px; }
.kdmObject .kdmObjectTitle      { font-size: 0.889em; font-weight:normal; margin-bottom:8px; }
.kdmObject .kdmObjectTitle a    { text-decoration:none; }
.kdmObject .kdmObjectContent a  { text-decoration:none; display:block; margin-bottom:5px; }
.kdmObject .kdmObjectContent a.selected { padding-right:12px; color:Black; background-image:url('../images/bullet-meshulash.jpg'); background-position:100% 5px;  background-repeat:no-repeat; }


#ArticlesList .item2cols                  { height:150px; margin-top:10px; border-bottom:1px solid #C0C0C0; padding-bottom:10px; }
#ArticlesList .item2cols .colRight        { width:150px; height:150px; overflow:hidden; float:left;border:1px solid #C0C0C0; }
#ArticlesList .item2cols .colRight img    { height:150px; border:0px; }

.tripadvisor { text-align:center; margin-top:-40px; }
/*************************************************** general CSS **************************************************************************/

.no-pad {
    padding:0px;
}

.col-centered {
     float: none;
     margin: 0 auto; 
}

.f-h {
    height: 100%;
}

.p-vert {
    display: table;
}

.c-vert {
    display: table-cell;
    vertical-align: middle;
}

.pull-right-lg     { float:none !important;}

.carousel-caption {
    width: 100%;
    right: 0px;
    left: 0px;
    bottom: 0px;
    padding: 0px;
    position: absolute;
}

.carousel-caption.box-odd > * {
    color: #000 !important;
    text-decoration: none !important;
}

.carousel-caption.box-even > * {
    color: #fff !important;
    text-decoration: none !important;
}

ol.carousel-indicators.no-pad {
    width: auto;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: 0px;
    position: relative;
    float:left;
}

.carousel-indicators li {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #000 \9;
    background-color: rgba(0,0,0,0.5);
    border: none;
    border-radius: 10px;
    
}

.carousel-indicators .active {
    background-color: rgba(0,0,0,0.8);
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #000 \9;
    border: none;
    border-radius: 10px;
} 

.vert-parent  {
    display: table;
}

.vert-child {
    display: table-cell;
    vertical-align: middle;
}

#carousel-example-generic .carousel-control.right, #carousel-example-generic .carousel-control.left {
    background: none;
}

#carousel-example-generic .carousel-control.right  {
    right: 0px;
}

#carousel-example-generic .carousel-control.left  {
    left: 0px;
}

.modal-backdrop.in {
    filter: alpha(opacity=80);
    opacity: 0.8;
}

.modal-body {
    padding: 0px;    
}

.close  {
    text-shadow: 0px;
}

#nextPageButton  {
    display: none;
}

.carousel-inner>.item>img { 
    margin: 0 auto;
    max-height: 100%;                            
}

#left-images .carousel-inner  {
    height: 177px;
}

#left-images .carousel-inner .item {
    height: 100%;
}



@media (max-width:768px) {
    #supported-icons-div { display:none; }
}

@media (min-width:767px){
    
    /* This should be around line 4713 in your bootstrap.css */
    .navbar-collapse.collapse {
        text-align: center; /* Set this */
    }

    
    /* This should be around line 4866 in your bootstrap.css */    
    .navbar-nav {
        display: inline-block;
        float: none;
        margin: 0 auto;
    }
    
    .navbar { border: none;}
    
    .pull-right-lg  { float:right !important;}
    
     
}

@media(max-width:1200px) {
    #GridLeft {
       display: none; 
    }
    
    #GridPage {
       margin-left: 0px; 
    }
    
}

@media(max-width:990px) {
    #GridPage {
       width: 500px;
    }
    
}

@media(max-width:768px)  {
    
    .pull-right-lg {
        text-align: center; 
    }   
    
    #GridRight {
        float: none;
        width: auto;
        margin-left: 0px;
    }
    
     #GridPage {
       width: 100%;
    }

}

/************************************************* end general CSS ************************************************************************/

/************************************************* header *********************************************************************************/

.navbar-default {
    background: #000;
    border-color: #000;
    font-size: 18px;   
}

.navbar-nav .pull-right-lg a {
    font-size: 1.111em;
    color: #fff;
    border-bottom: 4px solid transparent;
}

.navbar-nav .pull-right-lg a:hover {
    font-size: 1.111em;
    color: #fff;
    border-bottom: 4px solid #fff;
}

#face {
    margin-top: 12px;
    margin-right: 30px;
}

.pull-right-lg.hidden-xs a  {
    height: 54px;
}

.navbar-toggle .icon-bar {
    height: 2px;
    -webkit-transition-duration: 1s;
    transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    
}

.navbar-default .navbar-toggle .icon-bar  {
    background: #fff;
    opacity: 1;
}

.navbar-toggle .icon-bar+.icon-bar.active {
    margin:0px; 
    position: absolute;
}

.navbar-toggle.active  {
    padding-bottom:14px; 
}

span.icon-bar.down.active  {
    position: relative;
    margin: 0px !important;
    top: 14.5px;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
}

span.icon-bar.down.active.no-show,span.icon-bar.up.active.no-show {
    opacity: 0; 
}

span.icon-bar.up.active.no-show  {
    top: 15px;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus  {
    background: transparent;
}

span.icon-bar.up.active   {
    position: relative;
    margin: 0px !important;
    top: 6.2px;
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
}

.navbar-default .navbar-toggle {
    border: 0px;
}

.menu-address {
    color: #fff;
}

@media (max-width:1200px)  {
    
    .navbar-default  {
        font-size: 16px;
    }
    
}

@media (max-width:995px)  {
    .nav>li>a  {
        padding: 15px 7px;
    }
}

@media (max-width:820px)  {
    
    .navbar-default  {
        font-size: 14.5px;
    }
    
}

@media (max-width:768px)  {
    .nav>li>a {
        padding: 5px 5px;
    }    
}

/************************************************ end header ******************************************************************************/


/************************************************ rightNav *******************************************************************************/

#rightMenu .menuHead { padding:0px; border-bottom: 4px solid #000; margin-bottom: 20px; }

.menuHead a          { font-size: 1.667em; color:#333; }

.arrow-menu {
    width: 0; 
	height: 0; 
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent; 
	border-right: 5px solid #000;
	display: inline-block; 
	margin-right:10px;
}

.menuLink.active {
     background:#000;
     color:#fff; 
}

.menuLink.active span {
    border-right: 5px solid #fff;
}

.menuLink .selected {
    color: #fff;
}

@media(max-width: 768px) {
    .arrow-menu {
        border-top: 3px solid transparent;
	    border-bottom: 3px solid transparent; 
	    border-right: 3px solid #fff;
    }
    
    #bs-example-navbar-collapse-2 {
        background: #000;
    }
    
    #bs-example-navbar-collapse-2 .navbar-nav li a {
        display: inline-block;
        color: #fff;
    }
    
    #sub-menu .navbar-header .arrow-menu {
        display: none;
    }
    
    #rightMenu div {
        padding: 0px;
        border: 0px;
    }
    
    #sub-menu .navbar-header {
        text-align: left;
        width: 145px;
        display: inline-block;
    }
    
    #sub-menu-header {
        float: right;
        color: #000;
        font-size: 18px;
        margin-top: 10px;
        text-decoration: none;
        margin-right:30px;
    }


    #sub-menu .navbar-nav  {
        margin: 0px;
    }
    
    #sub-menu {
        background: #fff;
        border-color: #fff;
    }
    
    #sub-menu .navbar-toggle .icon-bar {
        background: #000;
        opacity: 1;
        -webkit-transition-duration: 1s;
        transition-duration: 1s;
        -moz-transition-duration: 1s;
        -o-transition-duration: 1s;
    }
    
    #sub-menu .navbar-header {
        text-align: left;
        display: inline-block;
        width: auto;
    }
    
    #sub-menu .navbar-toggle {
        margin-left: 24px;
    }
    
    #sub-menu li.active {
        background: #090909;
    }
    
    #sub-menu .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {
        background:none;
                
    }

    #sub-menu .navbar-toggle .icon-bar+.icon-bar.active {
        margin:0px; 
        position: absolute;
    }

    #sub-menu .navbar-toggle.active  {
        padding-bottom:14px; 
    }

    #sub-menu span.icon-bar.active {
        display: none;
    }
    
    
    #sub-menu span.icon-bar.down.active  {
        position: relative;
        margin: 0px !important;
        top: 14.5px;
        opacity: 1;
        display: block;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg); /* IE 9 */
        -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    }

    #sub-menu span.icon-bar.down.active.no-show,#sub-menu span.icon-bar.up.active.no-show {
        opacity: 0; 
    }

    #sub-menu span.icon-bar.up.active.no-show  {
        top: 15px;
    }

    #sub-menu .navbar-toggle:hover, .navbar-default .navbar-toggle:focus  {
        background: transparent;
    }

    #sub-menu span.icon-bar.up.active   {
        position: relative;
        margin: 0px !important;
        top: 6.2px;
        display:block;
        opacity: 1;
        transform: rotate(-45deg);
        -ms-transform: rotate(-45deg); /* IE 9 */
        -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
    }
}


/************************************************ end rightNav ***************************************************************************/


/*********************************************** LeftNav ***********************************************************/

#left-images { margin-top: 11px;}

#left-images div h3 {
    font-size: 2.000em;
    color: #333;    
}


/********************************************** end LeftNav *******************************************************/


/************************************************** RichText *****************************************************************************/

#body img  {
    display: block;
    max-width: 100%;
    height: auto;
    border-top: 3px solid #000;
    border-bottom: 3px solid #000;
    margin: 25px 0px
}

#body h3 
{
    font-weight: bold;
    margin: 0px auto 15px auto;
}



/************************************************** end RichText *************************************************************************/


/***************************************************** Home ******************************************************************************/

.boxes {
    margin-bottom: 80px;
}

.before-main > div {
    background: url('../../../000Frames/site/images/vert-text02.png');
    background-repeat: no-repeat;
    background-position: right bottom;
}

.after-main > div  {
    background: url('../../../000Frames/site/images/vert-text01.png');
    background-repeat: no-repeat;
    background-position: left top;
}

.before-main > div,.after-main > div  { 
    position:relative;
    padding-bottom: 418%;
    overflow: hidden;
} 

.outer-box {
    padding: 2px;
}

.box {
    position: relative;
    padding-bottom: 64%;
    background-size: cover;
    overflow: hidden;
}

.box-text-contain {
    position: absolute;
    bottom: 0px;
    width: 100%;
}

.box-even {
    background: rgba(0,0,0,0.5);
}

.box-odd {
    background: rgba(255,255,255,0.5);
}

.outer-address {
    margin-bottom: 40px;    
}

.outer-arrow {
    margin-bottom: 45px;
    -webkit-animation: upanddown 1s infinite; /* Chrome, Safari, Opera */
    animation: upanddown 1s infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    position: relative;
    cursor: pointer;
}

.most-outer-arrow > div.fixed {
    position: fixed;
    right: 10px;
    bottom: 10px;
    width: 120px;
}

.most-outer-arrow.fixed {
    position: absolute;
}

.most-outer-arrow {
    position: relative;
    right: 0px;
    left: 0px;
}


/* Chrome, Safari, Opera */
@-webkit-keyframes upanddown {
    from {
        top: 0px;
    }
    50% {
        top: 15px;
    }
    to {
        top: 0px;
    }
}

@keyframes upanddown {
    from {
        top: 0px;
    }
    50% {
        top: 15px;
    }
    to {
        top: 0px;
    }
}

.bottom-home {
    background: #F0F0F0;    
}

.home-link .text-right .name  {
    margin-right: 20px;
    font-size: 1.333em;
}

.homepage-footer {
    margin-bottom: 25px;
}

.homepage-footer h3 {
    font-size: 1.333em;
    margin-top: 40px;
    position: relative;
    margin-bottom: 20px !important;  
}

.homepage-footer h3:before {
    border-bottom: 2px solid #333;
    width: 176px;
    position: absolute;
    content: " ";
    bottom: -3px;
    right: 0px;
}

.homepage-footer .contain {
    word-break: break-word;
}

.contain p {
    line-height: normal;
    font-size: 1em;
}

.contain a  {
    direction: rtl;
    display: inline-block;
    color: #333;
    font-weight:bold;
    border-bottom: 1px solid #333;
    text-decoration: none;
}

.outer-form  {
    margin-top: 10px;
}

#f-first {
    padding-right: 0px;
}

.homepage-form .form-control  {
    border: 1px solid #333;
    border-radius: 0px;
    direction: rtl;
    font-size: 0.889em;
}

.home-link  {
    position: absolute;
    width: 100%;
    height: 100%;        
}

@media (max-width: 768px)  {
    .homepage-footer {
        text-align: center;
    }
    
    .homepage-footer h3:before  {
        width: 150px;
        right: 50%; 
        margin-right: -75px;
    }
}


@media (max-width:500px) {
    .home-link .text-right .name {
        text-align: center;
        margin: 0px;
    }    
}

/***************************************************** End Home **************************************************************************/

/***************************************************** location **************************************************************************/


#location {
    position: absolute;
    left: -320px;
    z-index: 10;
    -webkit-transition-duration: 1s;
    transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
}

#location.active  {
    left: 0px;
}

#outer-location {
    position: relative;
}

#tip-location  {
    position: absolute;
    right: -50px;
    top: 0px;
    height: 100px;
    width: 50px;
    background: #000;
    z-index: 10;
    cursor: pointer;
    color: #fff;
    text-align: center;
}

#inner-location {
    width: 320px;
    height : 680px;
    background: #000;
}

#location {
    color: #fff;
    line-height: 1;
}

#location h3 {
    font-size: 1.8333em;
    margin: 13px 0px;
}

#location {
    text-align: right;
    font-size: 21px;
}

#location h4 {
    font-size: 1.2em;
}

#location iframe  {
    margin: 15px 0px;
}

#larger-map  {
    color: #B2A571;
    text-decoration: underline;
}

@media (max-width:768px)  {
    #location {
        top: -733px;
        left:0px;
    }  
   
    #location.active  {
        left: 0px;
        top: 52px;
    }
   
    #tip-location  {
        left: 0px;
        bottom: 0px;
        right: auto;
        top: auto; 
        height: 52px;
        width: 100px;   
    }
    
    #inner-location  {
        width: auto;
    }
    
    .top-menu-location.pull-left.visible-xs  {
        margin-left: 10px;
        cursor: pointer;
    }
   
    .top-menu-location.pull-left.visible-xs .vert-parent  {
        height: 52px;
    }
    
    .top-menu-location.pull-left.visible-xs p  {
        color: #fff;
        display: inline-block;
    }
    
    .top-menu-location.pull-left.visible-xs img {
        margin-right: 10px;
    }
}



/***************************************************** End location **********************************************************************/

/***************************************************** Art *******************************************************************************/

.artBox {
    position: relative;
    padding-bottom: 100%; 
    background-size: cover; 
    overflow: hidden; 
}

.artBox > div   {
    display: block;
    position: absolute;
    top:0px;
    right:0px;
    left:0px;
    padding-bottom:67%;
    color:White;
    width:100%;
    height:100%;
    
}

.artBox:hover > div , .artBox:focus > div {
    top:0px; 
    right:0px; 
    left:0px; 
    bottom:0px;
    background-color:rgba(255,255,255,0.4);
    cursor:pointer;
}

a.art-link .box-odd, .box .box-odd {
    color: #000;
}

a.art-link .box-even, .box .box-even {
    color: #fff;
}

.artBox > div .art-box-outer .box-even h3, .artBox > div .art-box-outer .box-odd h3 {
    font-size: 1.333em;
}

.artBox:hover a.art-link {
    position: absolute;
    width: 100%;
    height: 100%;
}

.artBox:hover a.art-link .text-center {
    text-align: center;
    display: table;
    width: 100%;
    height: 100%;
}

.artBox:hover a.art-link .text-center .art-box-outer {
    display: table-cell;
    vertical-align: middle;
}

.artBox:hover a.art-link .text-center .art-box-outer .box-text-contain {
    position: static;
    display: inline-block;
    padding: 24px;
    width: auto;
}

.artBox:hover a.art-link .text-center .art-box-outer .box-text-contain.box-odd,.artBox:hover a.art-link .text-center .art-box-outer .box-text-contain.box-even  {
    background: rgba(0,0,0,0.8);
    color:#fff;   
}

.art-boxes {
    margin-bottom: 30px;
}


#galleryview {
    margin-bottom:100px;
    margin-right:10px; 
    margin-left:10px; 
}

#gallery-lightbox {
    max-width:980px;
}

.gallery-lightbox-element {
    position:relative; 
    padding-bottom:100%; 
    background-size:cover; 
    background-position:top center; 
    background-color:transparent; 
    margin-bottom:30px; 
    cursor:pointer;
}

.artBox > div .art-box-outer .box-odd {
    color: #000;
}

.artBox > div .art-box-outer .box-even {
    color: #fff;
}

.artBox.gallery-lightbox-element:hover > div {
    background: none;    
}

.vertical-alignment-helper {
    display:table;
    height: 100%;
    width: 100%;
    pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
    table-layout: fixed;
}

.vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events:none;
}

.modal-content {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width:inherit;
    height:inherit;
    /* To center horizontally */
    margin: 0 auto;
    pointer-events: all;
    background: none;
    box-shadow: 0px 0px 0px;
    border: none;
}


.modal-body button  {
    z-index: 100;
    top: -20px;
    right: 50%;
    color: #fff !important;
    opacity: 1;
    font-size: 1.556em;
    width: 36px;
    height: 36px;
}

.close {
    display: block;
    float: none;
    margin: 0 auto;
    opacity: 1;
}

.close span {
    color: #fff;
}


.flexslider {
    background: transparent;
    border: none;
    box-shadow: 0px 0px 0px;
}

.flex-caption.desc.text-center {
    background: transparent;
    direction: rtl;

}

.flex-direction-nav .flex-prev,
.flexslider:hover .flex-prev {
    left: 10px;
}

.flex-direction-nav .flex-next,
.flexslider:hover .flex-next {
    right: 10px;
}

.flex-direction-nav a {
    color: rgba(255,255,255,0.8) !important;
}

@media (max-width: 768px) {
    #myModal {
        padding-right: 0px !important;
    }
}


/**************************************************** End Art ****************************************************************************/

/*************************************************** Visit ******************************************************************************/

.outer-visitBox {
    margin: 10px 0px;
}

.visitBox {
    position:relative;
    padding-bottom: 75.88%; 
    background-size:cover; 
    overflow:hidden; 
    background: #F0F0F0;
}

.visitBox > div   {
    display:block;
    position:absolute;
    top:0px;
    right:0px;
    left:0px;
    padding-bottom:67%;
    color:White;
    width:100%;
    height:100%;
}

.visitBox .box-text-contain {
    position: static;
    width: 82%;
    margin: 0 auto;
}

.visitBox .box-text-contain h3, .row.map h3, .row.how-to h3 {
    color: #000;
    font-size: 1.556em;
    border-bottom: 1px solid #ccc;
    padding: 7px 0px;
    margin-bottom: 20px !important;
}

.visitBox .box-text-contain  {
    color: #000;
}

.row.how-to, .row.map {
    margin-bottom: 45px;    
}


.row.how-to .content  {
    color: #000;
}

.row.map .content iframe {
    width: 100% !important;    
}

.visitBox .box-text-contain p.strip1  {
    position: relative;
    padding: 5px 0px;
    font-size: 1.222em;
    margin: 10px 0px;
}

.visitBox .box-text-contain a {
    color: #000;
    text-decoration: underline;
}

.visitBox .box-text-contain p.strip1:before {
    border-top: 1px solid #000;
    content: "";
    position: absolute;
    width: 120px;
    top: 0px;
    right: 50%;
    margin-right: -60px;
}

.visitBox .box-text-contain p.strip1:after {
    border-bottom: 1px solid #000;
    content: "";
    position: absolute;
    width: 120px;
    bottom: 0px;
    right: 50%;
    margin-right: -60px;
}

/**************************************************** End Visit **************************************************************************/


/**************************************************** Bio ********************************************************************************/

.image-content {
    position: relative;
    padding-bottom: 47.6%;
    background-size: cover;
    overflow: hidden;
    background: #F0F0F0;
    width: 67%;
    margin: 20px auto 0px auto;
}

.image-content > .imageBox   {
    display:block;
    position:absolute;
    top:0px;
    right:0px;
    left:0px;
    color:White;
    width:100%;
    height:100%;
    background-size: cover;
}

.close-desc  {
    display: inline-block;
    margin-top: 5px;
}

.text-header {
    font-size: 2.056em;
    color: #fff;
    text-align: center;
    padding: 0px;
    margin: 0px;
    line-height: 100%;
}

.inner-desc hr  {
    margin-top: 10px;
}

.inner-desc {
    margin: 0 auto;
}

.inner-desc > p  {
    word-break: break-word;
}

#hasam  {
    margin-bottom:100px; 
    overflow:hidden; 
    max-height:540px; 
    height: 540px /*70vh*/;
    min-height: 350px;
}

.PortfolioImage {
    display:block; 
    margin-left:8px; 
    float: right; 
    max-height:540px; 
    background-color:Silver;
    width: 100%;
    position:relative;
    cursor: pointer;
    height: 540px /*60vh*/; 
    z-index:1000;
}

.PortfolioImage .upper  {
    height: 77.777777778%;
    position:relative;
}

.PortfolioImage .bottom  {
    height: 13%;
    position:relative;
}

.box-fade {
    background:rgba(255,255,255,0.4);
    position:absolute;
    height:100%;
    width:100%;
}

.PortfolioImage:last-child {
    margin-left:0px;
}

.right-side  {
    width: 0px;
    -webkit-transition: width 1s;
    transition: width 1s;
    overflow:hidden;
    float:right;
    margin-left:0px;        
    background-color:#191919;
    height: 540px;
}
    
.right-side.active  {
    width: 474px;          
    margin-left:8px;
}
    
.left-side {
    width: 100%;
    height: 120px;
    background: #F1F1F1;
    display: table;
}

.left-side .box-label  {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-size: 1.889em;
    color: #191919;
}
    
.desc {
    text-align: center;
    color: #fff;
}
    
.inner {
    width: 95%;
    margin: 0 auto;
}

.PortfolioImage:hover .box-fade, .PortfolioImage.active .box-fade {
    background: none;
}

.PortfolioImage:hover .bottom .left-side, .PortfolioImage.active .bottom .left-side {
    background:#191919;
}

.PortfolioImage:hover .bottom .left-side .box-label, .PortfolioImage.active .bottom .left-side .box-label {
    background:#191919;
    color:#fff;
}

.gallery-title {
    color: #fff;
}

@media (max-width: 768px){

    .PortfolioImage {
        height: 400px;
    }
}


/************************************************************** End Bio ********************************************************************************************/

/************************************************************** Shop **********************************************************************************************/

.itemBox {
    position:relative;
    padding-bottom:71.4%; 
    background-size:cover; 
    overflow:hidden; 
}

.itemBox > div   {
    display:block;
    position:absolute;
    top:0px;
    right:0px;
    left:0px;
    color:White;
    width:100%;
    height:100%;
}

.itemBox:hover > div , .itemBox:focus > div {
    top:0px; 
    right:0px; 
    left:0px; 
    bottom:0px;
    background-color:rgba(255,255,255,0.4);
    cursor:pointer;
}

.itemBox a {
    position: absolute;
    width: 100%;
    height: 100%;
}

.categorey .upper-cat  {
    position: relative;
}

.categorey .lower-cat .item , .items-per-cat .item {
    margin-bottom: 20px;
}

/*
.categorey .lower-cat .item+.item ,.items-per-cat .item+.item  {
   margin-right: 47px;
}
*/

.categorey .upper-cat .all-items {
    position: absolute;
    bottom: 3px;
    left: 0px;
    font-size: 0.944em;
    text-decoration: none;
    color: #333;    
}

.categorey .upper-cat h3  {
    font-size: 2.167em; 
    color: #333; 
}

.categorey hr  {
    margin: 0px;
    border-top: 3px solid #333;
    margin-bottom: 36px;
}

.itemBox .box-text-contain.box-odd h4 {
    color: #000 !important;
}
.itemBox .box-text-contain.box-even h4 {
    color: #fff !important;
}

.itemBox .box-text-contain h4  {
    margin: 5px 15px 5px 0px;
    font-size: 20px;
    text-align:right;
} 

.item.rows  {
    margin-top: 36px; 
}

.items-per-cat .item.rows {
    margin-right: 0px;
}

.lower-cat.row {
    margin-bottom: 20px;
}


/************************************************************** End Shop ******************************************************************************************/

/************************************************************** forms ********************************************************************************************/


.form-control {
    border: 0px;
    box-shadow: none;
    -webkit-box-shadow: none;
    padding: 0px 11px 0px 0px;
    font-size: 1em;
    color: #000;
    border-radius: 0px;
    height: 48px;
}
    
.form-control:focus  {
    border-color: transparent;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}
    
.contact-border-bt {
    border: 0px;
    border-radius: 0px;
}
    
input::-webkit-input-placeholder {
    color: #000;
}

input:-moz-placeholder { /* Firefox 18- */
    color: #000;  
}

input::-moz-placeholder {  /* Firefox 19+ */
    color: #000;  
}

input:-ms-input-placeholder {  
    color: #000;  
}
    
    
.textarea {
    margin-top: 14px;
}
    
.validator {
    position: absolute;
    top: 15px;
    left: 0;
    color: rgb(0, 0, 0);
    font-size: 0.778em;
}
    
#send {
    color: #fff;
    background: #000;
    border: 0px;
    border-radius: 0px;
    font-size: 1.333em;
}
    
.col-xs-12.text-center.contact-title {
    margin-bottom: 20px;
    font-family: fbspoilerbold;
}
    
#intreset {
    padding: 0px 11px 0px 0px;
    resize: none;
    margin-top: 10px;
} 


.form-messages {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color: rgba(255,255,255,0.8);
}

.form-messages,
.form-messages .loading,
.form-messages .success,
.form-messages .error {
    display: none;
}

.control-label {
    font-weight: normal;
}

label.error {
    position: absolute;
    top: 20px;
    left: 5px;
}

/************************************************************** End forms ****************************************************************************************/

/************************************************************** Activity *****************************************************************************************/

.activity-box {
    background: #f1f1f1;
    min-height: 122px;
}

.activity-box h3 {
    font-size: 24px;
    color: #333;
}

.activity-box p {
    font-size: 18px;
    color: #333;
}

.outer-activity-box {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}

.activity-box .vert-parent  {
    width: 100%;
    height: 100%;
}

.activity-box #prices span {
    font-size: 24px;
    color: #333;
}

.activity-box #prices {
    font-size: 18px;
    direction: rtl;
    color: #333;
}

.activity-boxes > .col-xs-12 > .col-xs-12 {
    margin-top: 10px;
}


.families-mobile-bottom-icons { display:none; }


/************************************************************** End Activity ************************************************************************************/

/************************************************************* Left Items *****************************************************************/

.left-item-desc {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    padding: 0px 10px;
}

.left-item-desc.box-odd > * {
   color: #000 !important;
   text-decoration: none !important;
}

.left-item-desc.box-even > * {
   color: #fff !important;
   text-decoration: none !important;
}

.left-item h3 {
    font-size: 1.82em;
}



/************************************************************* End Items *******************************************************************/









/***************************************************** Footer ****************************************************************************/

.carousel-control .footer-arrow {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;
}


.left.carousel-control .footer-arrow {
    left: 36px;
}

.right.carousel-control .footer-arrow {
    right: 36px;
}

/***************************************************** End Footer ************************************************************************/

/*

    Ajax form style

*/

.form-messages > .p-vert > .c-vert h3:before {
    content: "";
    display: none;
}



/************************************************ init font *******************************************************************************/

@font-face { font-family: 'fbspoilerLight'; src: url('../../../000Frames/site/fonts/fbspoiler-light.eot'); src: url('../../../000Frames/site/fonts/fbspoiler-light.eot?#iefix') format('embedded-opentype'), url('../../../000Frames/site/fonts/fbspoiler-light.woff2') format('woff2'), url('../../../000Frames/site/fonts/fbspoiler-light.woff') format('woff'), url('../../../000Frames/site/fonts/fbspoiler-light.ttf') format('truetype'), url('../../../000Frames/site/fonts/fbspoiler-light.svg#fbspoilerlight') format('svg'); font-weight: normal; font-style: normal; unicode-range: U+590-5ff,U+000-03F; }




@font-face { font-family: 'fbspoiler'; src: url('../../../000Frames/site/fonts/fbspoiler-regular.eot'); src: url('../../../000Frames/site/fonts/fbspoiler-regular.eot?#iefix') format('embedded-opentype'), url('../../../000Frames/site/fonts/fbspoiler-regular.woff2') format('woff2'), url('../../../000Frames/site/fonts/fbspoiler-regular.woff') format('woff'), url('../../../000Frames/site/fonts/fbspoiler-regular.ttf') format('truetype'), url('../../../000Frames/site/fonts/fbspoiler-regular.svg#fbspoiler_regularregular') format('svg'); font-weight: normal; font-style: normal; unicode-range: U+590-5ff,U+000-03F; }




@font-face { font-family: 'fbspoilerBlac'; src: url('../../../000Frames/site/fonts/fbspoiler-black.eot'); src: url('../../../000Frames/site/fonts/fbspoiler-black.eot?#iefix') format('embedded-opentype'), url('../../../000Frames/site/fonts/fbspoiler-black.woff2') format('woff2'), url('../../../000Frames/site/fonts/fbspoiler-black.woff') format('woff'), url('../../../000Frames/site/fonts/fbspoiler-black.ttf') format('truetype'), url('../../../000Frames/site/fonts/fbspoiler-black.svg#fbspoilerblack') format('svg'); font-weight: normal; font-style: normal; unicode-range: U+590-5ff,U+000-03F; }




@font-face { font-family: 'fbspoilerBold'; src: url('../../../000Frames/site/fonts/fbspoiler-bold.eot'); src: url('../../../000Frames/site/fonts/fbspoiler-bold.eot?#iefix') format('embedded-opentype'), url('../../../000Frames/site/fonts/fbspoiler-bold.woff2') format('woff2'), url('../../../000Frames/site/fonts/fbspoiler-bold.woff') format('woff'), url('../../../000Frames/site/fonts/fbspoiler-bold.ttf') format('truetype'), url('../../../000Frames/site/fonts/fbspoiler-bold.svg#fbspoiler_boldbold') format('svg'); font-weight: normal; font-style: normal; unicode-range: U+590-5ff,U+000-03F; }


/************************************************ end init font *******************************************************************************/


/**protfolio**/
#hasam  {overflow:hidden; margin-right:auto; margin-left:auto;}

.en-lag {
    border-radius: 100%;
    width: 28px;
    height: 28px;
    padding: 4px 0px !important;
    text-align: center;
    margin-top: 13px;
    font-size: 1.7rem !important;
    background: #fff !important;
    color: #000 !important;
}

.noborder {
    border: none !important;
}

.donationWrapper { margin-top: 50px; }
#donationForm { background: #F0F0F0; padding: 25px; }
    #donationForm .contact-border-bt { margin-bottom: 20px; }
    #donationForm h2 { color: #000 !important; font-size: 28px !important; border-bottom: 1px solid #ccc; padding: 7px 0px; margin-bottom: 20px !important; text-align: center; margin-top: 0; padding-top: 0; }