/*//////////////////////////////////////////////

DOCUMENT INFO
Document: Custom CSS File
Ticket Info:

---- Ticket 3870-8392659: Add delay to our menu ----

Author: Jacob John
Client: Seoul Foreign School

//////////////////////////////////////////////*/

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

New Meganav Setup

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

/*

Making the overflow of topbanner visible
for meganav dropdown

*/

#topbanner>div>.bannermodcontent {

  overflow: visible;

}

/* Inner Meganav styles for left image */

#nav li div[id*='dhtmlmenu_'] .dropDiv {

padding-left: 0px !important;
box-sizing: border-box;
background-size: cover;
background-position: top center;
height: 190px !important;
display: inline-block;

}

/*

------Main Meganav Styles------
This is what controls when the meganav will hide or show on hover

*/

#nav div[id*='dhtmlmenu_'] {

  z-index:2;
  position:absolute;
  display:initial !important;
  padding: 23px 0px;
  border:0px solid;
  width: 100% !important;
  background: url('../images2/dropbg.jpg') center top repeat;
  left: 0%;
  position: absolute;
  visibility: hidden;
  opacity: 0;
  width: 100%;
  max-height: 0px;
  padding: 23px 0px;
  border: 0px solid;
  box-sizing: border-box;
  text-align: left;
  -webkit-transition: max-height .3s ease 0.2s, visibility 0.3s ease 0.2s;
  transition: max-height .3s ease 0.2s, visibility 0.3s ease 0.2s;
  -webkit-transition-delay: 0.5s; /* Safari */
    transition-delay: 0.5s;
    pointer-events: none;

}

/* The hover controls */

#nav li:hover > div[id*='dhtmlmenu_'] {

    max-height: none;
    opacity: 1 !important;
  visibility: visible !important;
  z-index: 2 !important;
  pointer-events: all;


}

#nav li:hover a {

  color: #fff;

}

/* Meganav inner link styles */

#nav div[id*='dhtmlmenu_'] a {

display: block;
border-bottom: 0px solid;
text-decoration: none;
font-family: ubuntu, sans-serif;
font-weight: 500;
font-size: 14px;
color: #b72a09;
height: auto;
padding: 0.5em 0.0em;

}


#nav div[id*='dhtmlmenu_'] a:hover {

color: #292929;

}

#nav div[id*='dhtmlmenu_'] li {

  display: block;
  padding: 0;

}

/* Adding padding to inner description */

.twoCol .bannermodcontent {

padding: 0 25px 0 35px !important;

}

/* Just adding a cursor */

#nav li:hover {

cursor: pointer;

}

@media (max-width: 568px) {

.headerPhoto .bannermodcontent {

  margin-bottom: 120px;

}

.division-img {

  float: right;
  width: 100%;

}

  .sub-nav {

    display: inline-block;

  }

  #leftbanner {

    background: #d9d9d9;

  }

  #leftbanner ul.mobileHide {

    display: block !important;

  }

  #leftbanner .navmod {

    display: block;

  }

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

  Targetting headerphoto content div and setting styles to show
  sub menu text

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

  .headerPhoto div[id^='content'] {

    position: relative;
    z-index: 0 !important;

  }

  .headerPhoto div[id^='content']:before {

    font: normal normal normal 14px/1 FontAwesome;
    content: "\f0c9  Tap to view sub-menu";
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    text-align: left;
    background: rgba(0,0,0,0.8);
    padding: 10px;
    box-sizing: border-box;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    color: white;

  }


}


/**
*
* Ticket 3870-8410605: Twitter Feed broken on homepage
* Author: Jacob John;
* Twitter Feed Adjustments
*
*/

  /* Adjusting height of tweet to allow correct floating */

  ul.tweets li {

    height: 160px;

  }


/*
*
*        Ticket 3870-8415374: Header & Footer Rebrand
*        James Brettschneider
*        Client has new logo, plus change in header and footer background image colors.
*
*/
        body { background: url('../images2/bottombg-inv.jpg') center top repeat; }
        #topbanner {
                margin:0; padding:0; width:100%;background: url('../images2/topbg-inv.jpg') center top no-repeat;
    background-size: auto 22%;
        }
        .top {
            background: rgba(0,0,0,0.9) url('../images2/faded.png') center top repeat;
            height: 44px;
        }
       .main-nav {
            background: url('../images2/navbg-bluegray.jpg') center top repeat;
            height: 60px;
        }
        #nav a {
             color: #ffffff;
        }
        #nav a:hover {
             color: #dc1014 !important;
        }
        #bottomcontainer { background: url('../images2/bottombgfade-inv.jpg') center top no-repeat; padding-top: 2px; }

        #subnav a {
          color: #4E4E59;
        }

        #footerTag {
                color: #4E4E59;
        }


/* End Section */

/**
*
* Ticket 3870-8420738
* Author: Kosha Burnett
* Description: Update logo for mobile views
*
*/

@media (max-width: 600px) {
    .logo a {
    background: url('../images2/sfs_sq_logo.png') no-repeat top center;
    display: block;
    width: 150px;
    height:146px;
    margin: 10px auto;
    background-size: contain;
}

    .logo img, .sub-nav {display: none;}
}

/* End Section */

/**
*
* Ticket 3870-8419980
* Author: Kosha Burnett
* Description: restore mobile nav on pages with single banner image
*/

.singlePhoto {
    background: #fff;
    text-align: right;
    width: 73%;
    float: right;
    margin-bottom: 35px !important;
}

.singlePhoto img {
  width: 100%;
  border-radius: 13px;
}

@media (max-width: 600px) {
  .singlePhoto {
      width: 100%;
      float: none;
  }

  .singlePhoto img {
    display: block;
  }
}

@media (max-width: 568px) {
.singlePhoto div[id^='content']:before {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f0c9 Tap to view sub-menu";
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    text-align: left;
    background: rgba(0,0,0,0.8);
    padding: 10px;
    box-sizing: border-box;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    color: white;
}
}

/* End Section */

/**
 *
 *  Ticket 8419980
 *  Jacob John
 *  Update Headers Look
 *
 */

    @media (min-width: 600px) {

      .headerPhoto.hidedesktop {

        display: none;

      }

    }

    @media (max-width: 600px) {

      .hidemobile {

        display: none;

      }

    }

    .fullwidth .bannermodcontent {

      width: 100% !important;
      padding: 0 !important;
      max-width: none !important;

    }

/*
.overlay-textbox {
     position: absolute;
     top: 23%;
     left: 2%;
     border: 1px solid #000;
     padding: 10px;
     color: #fff;
     font: 28px Trajan-Pro, serif;
     background-color: rgba(55,55,55,0.7);
}
*/

/* End Block */

/**
 * 8435817
 * 2/15/16
 * Chris Batt
 * controlling the size of the twitter emoji
 */

#twitter-feed .tweets p img {
  width: 24px
}

/* End Section */

/**
*
* Ticket 3870-8437507
* Author: Kosha Burnett
* Description: Thinner Border on Homepage Slider
*/

.page_1 #topbanner .photoHolder .contentElementDiv.active,
.page_3790 #topbanner .photoHolder .contentElementDiv.active,
.page_3811 #topbanner .photoHolder .contentElementDiv.active,
.page_3831 #topbanner .photoHolder .contentElementDiv.active{
  border: 3px solid #000;
}

.cc-wrapper .cc-controls .cc-pages {
  padding-right: 35px;
}

#closeBtn {
  right: 10px;
}

/* End Section */

/**
 *
 *  Ticket 8410605 - Twitter Feed Broken on homepage
 *  Jacob John
 *
 */

ul.tweets > li.timeline-tweetlist-tweet > div.timeline-tweet > div:not(.timeline-tweet-text),
ul.tweets > li.timeline-TweetList-tweet > div.timeline-Tweet > div:not(.timeline-Tweet-text) {
    display: none;
}
ul.timeline-tweet-actions,
ul.timeline-Tweet-actions {
    display: none;
}

/* End Block */

/**
*
*	Date: 04/27/2016
*	Ticket 3870-8442677
*	Author: Kosha Burnett
*	Description: banner logo wouldn't center
*/

#content1063 {
	text-align: center;
}

#bannermod1063.logo img {
	float: none;
	max-width: 371px;
}

.page_305 #poweredby {
	position: absolute;
	bottom: 0;
	right: 0;
}

/* End Section */

/**
 *
 *  August 11th 2016
 *  Ticket 8453561 - Mobile Homepage in serious need of attention
 *  Jacob Sauerhoefer
 *
 */

  .mobilePhoto { display: none; }

   @media (max-width: 1136px) {

      .mobilePhoto {

        display: block;
        width: 100%;

      }

   }

 /* End Block */

/**
 * This file should be used by support to add CSS post launch.
 * custom.css should be called from all layouts.  It should also be the
 * last stylesheet called so it will override all previous styles.  This is
 * a useful way to keep track of styles added after launch.  You are
 * encouraged document edits with comments so others understand the reason
 * behind these changes.
 */