/*
    main menu css

    hack to stop body movement when menu showing
    Structure
    top icon bar
    Fonts
    links
    hamburger
    Responsive breakpoints
        Tablet
        Mobile
*/

/* --- hack to stop body movement when menu showing ---- */
.noscroll
{
     overflow: hidden;
}

/* ---- Structure ---- */
.navbar .navbar-header
{
    width:100%;
    text-align: center;
    z-index: 100001;
    height:68px;
    margin-top:-5px;
    position:relative;
}


.navbar .navbar-header a.main-logo
{
        margin-left: -65px;
}

.nav-up {
    top: -48px;
}

.z-up {
    z-index:1500;
}
.mainMenuContainer
{
    width: 100%;
    background: #101933;
    height: 100vh;
    position: fixed;
    z-index: 10000;
    color: #fff;
    font-family: 'lato';
    margin-top: 50px;
    padding-bottom: 50px;
    overflow-x: scroll;
    top: 0;
    padding-top: 50px;
    opacity:0;
    display:none;
}

.mainMenuContainer.open
{
    display:block;
    -webkit-animation: fadein 0.5s;
    -moz-animation: fadein 0.5s;
    -ms-animation: fadein 0.5s;
    -o-animation: fadein 0.5s;
    animation: fadein 0.5s;
    opacity: 1;
    display:block;
 }

 @keyframes fadein {
     from { opacity: 0; }
     to   { opacity: 1; }
 }

 /* Firefox < 16 */
 @-moz-keyframes fadein {
     from { opacity: 0; }
     to   { opacity: 1; }
 }

 /* Safari, Chrome and Opera > 12.1 */
 @-webkit-keyframes fadein {
     from { opacity: 0; }
     to   { opacity: 1; }
 }

 /* Internet Explorer */
 @-ms-keyframes fadein {
     from { opacity: 0; }
     to   { opacity: 1; }
 }

 /* Opera < 12.1 */
 @-o-keyframes fadein {
     from { opacity: 0; }
     to   { opacity: 1; }
 }


.mainMenuContainer > .menu
{
    width:70%;
    margin:0 auto;
}

.mainMenuContainer > .menu > .menu-sports
{
    width: 45%;
    float: left;
    margin:80px 0px 0px 0px;
}

.mainMenuContainer > .menu > .menu-types
{
    width:45%;
    float:right;
}

.mainMenuContainer > .menu > .side-slide
{
    height: 560px;
    background: #fff;
    width: 2px;
    float: left;
    margin-left: 4.5%;
    margin-top: 35px;
    margin-bottom: 35px;
}

.mainMenuContainer > .menu > .side-slide > .id-circle
{
    height: 26px;
    width: 26px;
    border-radius: 40px;
    background: #3160ae;
    border: 6px solid #101933;
    margin-left: -12px;
    margin-top: 60px;
    position: relative;
}

.mainMenuContainer > .menu > .menu-types > .main-types
{
    border-bottom:1px solid #cdced2;
    margin:80px 0px 25px 0px;
    padding-bottom:25px;
    width:70%;
}


/* ---- top icon bar ---- */

.mainMenuContainer > .topIcons
{
    width:60%;
    display:block;
    margin:0 auto;
    height:100px;
}

.mainMenuContainer > .topIcons > a > .section
{
    width:19.5%;
    display:inline-block;
    border-right:1px solid #fff;
    font-size:0.8em;
    text-align:center;
}

.mainMenuContainer > .topIcons > a > .section:last-of-type
{
    border:none;
}

.mainMenuContainer > .topIcons > a > .section > .icon_items
{
    width:60px;
    height:60px;
    margin:0 auto;
    display:block;
    fill:#cdced2;
}

.mainMenuContainer > .topIcons > a > .section > .icon_items.all
{
    fill:none;
    stroke:#cdced2;
}

.mainMenuContainer > .topIcons > a > .section:hover > .icon_items
{
    fill:#fff;
}

.mainMenuContainer > .topIcons > a > .section:hover > .icon_items.all
{
    fill:none;
    stroke:#fff;
}

/* ---- Fonts ---- */

.mainMenuContainer > span.heading
{
    font-size:7em;
    text-align:center;
    width:100%;
    display:block;
    font-weight:bold;
    margin-top: 20px;
}

.mainMenuContainer > span.tagline
{
    margin-top: -45px;
    font-family: 'bloomsburyscript';
    text-align: center;
    color: #3462ac;
    font-size: 3em;
    width:100%;
    display:block;
}

.mainMenuContainer > .menu > .menu-sports > .main-sports
{
    font-size:3.438em;
    display:block;
    margin-bottom:15px;

}

.mainMenuContainer > .menu > .menu-sports > .mini-menu
{
    display:block;
}

.mainMenuContainer > .menu > .menu-sports > .mini-menu > a.book_now_head ,
.navbar-header > .book_now_head
{
    color: #fff;
    background-color: #111832;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: 'Lato', sans-serif;
    font-size: 11px;
    border: 1px solid #585e71;
    padding: 15px 25px;
    width:135px;
    height:45px;
    margin:30px 0px;
    float: right;
}

.navbar-header > .book_now_head
{
    float:left;
    margin: 10px 0px;
    background-color:transparent;
    border:1px solid #fff;
}

.mainMenuContainer > .menu > .menu-sports > .mini-menu > a.book_now_head:hover ,
.navbar-header > .book_now_head:hover
{
    background-color: #233E6F;
}

.mainMenuContainer > .menu > .social-menu
{
    width: 249px;
    background:#192741;
    border-radius:40px;
    height:80px;
    clear: both;
    margin: 0 auto;
    padding: 20px 40px;
}
.nav.navbar-nav.navbar-left, .small_marg {
    margin-top: 8px;
}

/* ---- links ---- */

.main-menu-mobile-left ,
.main-menu-mobile-right
{
    font-size:1em;
    float:left;
    display:none !important;
}


.main-menu-mobile-right
{
    float:right;
}

.mainMenuContainer a
{
    color:#cdced2;
}

.mainMenuContainer a:hover
{
    color:#fff;
}

.mainMenuContainer > .menu > .menu-sports > .mini-menu a ,
.mainMenuContainer > .menu > .menu-sports > .main-sports a ,
.mainMenuContainer > .menu > .menu-types > .main-types a ,
.mainMenuContainer > .menu > .menu-types > .menu-destinations a
{
    width:100%;
    display:block;
    text-align: right;
    white-space: nowrap;
}

.mainMenuContainer > .menu > .menu-sports > .mini-menu a
{
    font-size:1.5em;
}

.mainMenuContainer > .menu > .menu-sports > .main-sports a
{
    line-height: 1.25em;
    font-weight:bold;
}

.mainMenuContainer > .menu > .menu-types > .main-types a ,
.mainMenuContainer > .menu > .menu-types > .menu-destinations a
{
    text-align:left;
    font-size:1.5em;
    font-weight:bold;
}

.mainMenuContainer > .menu > .menu-types > .main-types a span
{
    font-size:0.7em;
    font-weight:300;
}


.mainMenuContainer > .menu > .menu-types > .menu-destinations a
{
    font-weight:300;
}

.mainMenuContainer > .menu > .social-menu > a > .facebook ,
.mainMenuContainer > .menu > .social-menu > a > .twitter ,
.mainMenuContainer > .menu > .social-menu > a > .instagram
{
    height: 40px;
    width: 40px;
    border: 2px solid #fff;
    border-radius: 80px;
    padding: 7px 12px;
    display: inline-block;
    font-size: 1.2em;
}

/* ---- hamburger ---- */

 #nav-icon3{
     width: 30px;
     height: 40px;
     position: relative;
     margin: 20px 50px;
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
      -webkit-transition: .5s ease-in-out;
      -moz-transition: .5s ease-in-out;
      -o-transition: .5s ease-in-out;
      transition: .5s ease-in-out;
      cursor: pointer;
      float:left;
}

 #nav-icon3 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #fff;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}


#nav-icon3 span:nth-child(1) {
  top: 0px;
}

#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) {
  top: 11px;
}

#nav-icon3 span:nth-child(4) {
  top: 21px;
}

#nav-icon3.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}

#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon3.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}



/* ---- Responsive breakpoints --- */


/* ---- Normal Tablet ---- */

@media only screen and (max-width: 991px)
{
    .navbar-header > a.book_now_head
    {
        display:none;
    }

    #mobile-call
    {
        padding:20px;
    }

    #nav-free-brochure
    {
        display:none;
    }

    .mainMenuContainer > span.heading
    {
        font-size:5em;
    }

    .mainMenuContainer > span.tagline
    {
        font-size:2em;
    }

    .mainMenuContainer > .menu > .menu-sports
    {
        width:100%;
    }

    .mainMenuContainer > .menu > .menu-sports > .main-sports > a
    {
        display:inline;
        text-align:center;
    }

    .mainMenuContainer > .menu > .side-slide
    {
        display:none;
    }

    .mainMenuContainer > .menu > .menu-types,
    .mainMenuContainer > .menu > .menu-types > .main-types
    {
            width: 100%;
            text-align:center;
    }

    .mainMenuContainer > .menu > .menu-sports > .main-sports a
    {
        font-size:0.6em;
    }

    .mainMenuContainer > .menu > .menu-sports > .mini-menu > a.book_now_head
    {
        margin: 0 auto;
        display: block;
        float: none;
    }
    .mainMenuContainer > .menu > .menu-types > .main-types a, .mainMenuContainer > .menu > .menu-types > .menu-destinations a
    {
        text-align:center;
        white-space:normal;
    }

    .mainMenuContainer > .menu > .menu-sports > .main-sports > a:not(:nth-child(2))
    {
        display:none;
    }

    .mainMenuContainer > .menu > .menu-sports > .main-sports
    {
        text-align:center;
    }

    .mainMenuContainer > .menu > .menu-sports > .main-sports > a
    {
        width:100%;
        text-align:center;
        display: inline;
    }

    .mainMenuContainer > .menu > .menu-sports ,
    .mainMenuContainer > .menu > .menu-types > .main-types ,
    .mainMenuContainer > .menu > .social-menu
    {
        margin:20px auto 0 auto;
        display:block;
    }


    .navbar .navbar-header a.main-logo
    {
        margin-left: -125px;
    }

    .main-menu-mobile-left ,
    .main-menu-mobile-right ,
    .main-menu-mobile-left:hover ,
    .main-menu-mobile-right:hover
    {
        display:inline-block !important;
        margin-top:21px;
        cursor:pointer;
    }


}

@media only screen and (max-width: 760px)
{
    .navbar .navbar-header a.main-logo
    {
        margin-left: -6px;
    }

    #nav-icon3
    {
        margin: 20px 20px;
    }

    .mainMenuContainer > span.tagline
    {
        margin-top:-23px;
    }
}


/* ---- Mobile ---- */
@media only screen and (max-width: 480px)
{



}
