/* @override https://test-shsh.gfm.co.uk/cms/wp-content/themes/club950-2018/mobile.css?ver=1.0.3 */

/* @override 
	https://test-shsh.gfm.co.uk/cms/wp-content/themes/club950-2018/mobile.css?ver=1.0.3 */

/* * * * * * * * * *
*
* Mobile styles
*
* * * * * * * * * * */

@media screen and (max-width:1023px) {
    body {
        background-size:100% auto;
        overflow-x: hidden;
    }
    .span-1,
    .span-2,
    .span-3,
    .span-4,
    .span-5,
    .span-6,
    .span-7,
    .span-8,
    .span-8-advert-row,
    .span-9,
    .span-10,
    .span-12 {
        width:100%;
        margin-right:0;
    }

div.span-6.float-column:first-of-type {
    margin-bottom: 20px;
}

div.howitworkscontainer div.text-col {
  width: 100%;
  float: left;
  margin-left: 0;
}

label {
    display: block;
    width: 100%;
}

h2.filterTitle {
    margin-bottom: 10px;
}

div.step-copy h2 {
    text-align: center;
    margin-top: 10px;
}

.container {
        padding:20px;
    }
    .sun-top-bar {
        padding-right:20px;
        padding-left:20px;
        height:77px;
        text-align:right;
    }
    .sun-top-bar img {
        width:20% !important;
    }
    header {
        display:block;
        background-color:#fff;
    }
    .header-nav {
        background-color:#fff;
        padding:0;
        margin-top:0;
    }
    .right-copy-box {
      width:100%;
      margin:20px 0px;
    }
    .content-block.discover img {
        width:300px;
    }
    .login-buttons {
        position:absolute;
        top:-45px;
        right:0;
        width:100%;
        text-align:center;
        background-color:#fff;
        display:none;
    }
    .desktop-nav-hidden,
    #menu-item-886,
    #menu-item-887 {
        display:inherit;
    }
    .login-buttons a.btn.btn-red.small {
        height:30px;
        line-height:30px;
        margin-top:5px;
        margin-bottom:10px;
    }
    .header-nav img {
        width:40%;
        margin-bottom:10px;
        margin-left:10px;
        max-width:180px;
    }


    span#sun-logos {
        width:50%;
        max-width:240px;
        float:left;
        height:68px;
    }
    
    span#sun-logos img:nth-child(2) {
        margin-right:auto;
        margin-left:auto;
        display:block;
        margin-top:5px;
        width: 75% !important; max-width: 150px;
    }


.mobile-nav {
    display:inline-block;
    font-size:34px;
    text-align:right;
     width:50%;
    max-width:200px;
    height:75px;
}
.mobile-nav a {
	color:  #3a3e45 !important;
	text-decoration: none;
	font: normal 20px/75px "FuturaStd-CondensedBold",sans-serif !important;
}
.mobile-nav a i {
    font:normal 32px/60px sans-serif; vertical-align: middle;
    /* If using SVG use below props, else delete them for unicode */
    background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%27%20version%3D%271.1%27%20x%3D%270px%27%20y%3D%270px%27%20width%3D%2732px%27%20height%3D%2732px%27%20viewBox%3D%270%200%2032%2032%27%20enable-background%3D%27new%200%200%2032%2032%27%20xml%3Aspace%3D%27preserve%27%3E%3Crect%20y%3D%273%27%20width%3D%2732%27%20height%3D%274%27%20fill%3D%27%233a3e45%27%20rx%3D%272%27%20ry%3D%272%27%20%2F%3E%3Crect%20y%3D%2712%27%20width%3D%2732%27%20height%3D%274%27%20fill%3D%27%233a3e45%27%20rx%3D%272%27%20ry%3D%272%27%20%2F%3E%3Crect%20y%3D%2721%27%20width%3D%2732%27%20height%3D%274%27%20fill%3D%27%233a3e45%27%20rx%3D%272%27%20ry%3D%272%27%20%2F%3E%3C%2Fsvg%3E");
    display: inline-block;
    height:32px;
    width:32px;
    margin:10px;
}
.mobile-nav a:before {
    content:"MENU ";
    text-decoration:none;
}
.mobile-hide--inline {display: inline;}
.menu-title {
    color: #fff;
    background: #ee1a24;
    text-align: center;
}
.menu-title span {font: bold 20px/60px "FuturaStd-CondensedBold",sans-serif !important;}
.menu-title i {display: inline-block; position:absolute; left:15px; top:15px; font:normal 20px/30px sans-serif; cursor: pointer;}
nav {
    /*
    height:0px !important;
    margin:68px 0 0 !important;
    padding:0 !important;
    width:100% !important;
    */
    display: block;
	width:100%;
	border-radius: 0;
	margin-top: 0;
	position: fixed;
	top:0; right:0;
	z-index:9999;
    transform: translate3d(100%,0,0);
    -webkit-transform: translate3d(100%,0,0);
}
nav.animate {
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    transition:transform 0.3s;
}
    
    /*
    nav div ul li {
      width:100%;
      padding:10px;
    }
    nav div ul li a {
      border:none;
        text-align:left;
        color: white;
    }
    nav ul {
        display:none;
        background-color: #393d45;
        position:absolute;
        width:100%;
        z-index:999;
        left: 10px;
        color: white;
    }
    */

nav li {
    width:100% !important;
	height: 60px;
	border-bottom:1px solid rgba(255,255,255,0.1);
}
nav li a, nav li span {
    line-height: 60px;
    height:60px;
}
.accordion-item {background:#ed1a24;}
.accordion-title {
    line-height:23px;
    min-height:50px;
    text-indent: 0;
    padding:15px 30px;
    font-size:16px;
}
.accordion-title::before {line-height:20px;}


    #menu-item-101,
    #menu-item-102,
    #menu-item-147,
    #menu-item-148 {
        display:block;
    }
    .btn.small {
        width:100%;
        margin-top:0;
        margin-right:auto;
        margin-left:auto;
        float:none;
        display:block;
    }
    .booking-box {
        max-width:500px;
        margin:15px auto 0;
    }
    .booking-box h2 {
        font-size:30px;
    }
    .booking-box .span-4 {
        padding:5px 0;
    }
    .booking-box .span-4 a {
        font-size:.8em;
    }
    .suitcase {
        width:100%;
        background-size:100% auto;
        padding-bottom:10px;
        margin-bottom:0;
    }
    .suitcase iframe,
    .suitcase object,
    .suitcase embed {
        position:absolute;
        top:16%;
        left:10%;
        width:80%;
        height:80%;
    }
    div.step-outer.row .span-2 {
        float:left;
        width:150px;
        display:block;
    }
    div.step-outer.row .span-10 {
        float:left;
        display:block;
        width:300px;
    }
    .step-outer .step-tab {
        position:relative;
        float:left;
    }
    .extra-padding {
        padding:20px !important;
    }
    p.title {
        padding-right:10px;
        padding-left:10px;
    }
    .alt .content-block__copy {
        width:100%;
        margin:0 0 10px;
    }
    .content-block__inner.alt img {
        display:block;
        clear:both;
        width:98%;
    }
    .content-block__inner.alt:nth-child(odd) img {
        float:none;
    }
    .forumtopics-home {max-height: none;}
    .forumtopics-home ul.topics {height:auto;}
    .content-block__inner ul.topics {
        margin:0 0 30px;
    }
    .content-block__inner ul.topics li {
        width:100%;
        margin-right:0;
        margin-bottom:0;
    }
    .content-block__inner ul.topics .topics-inner p.small {
        position:relative;
    }
    .content-block__inner ul.topics .topics-inner {
        width:62%;
    }
    ul.topics img {
        display:inline-block;
        float:none;
    }
    .slider-container {
        width:100%;
        height:auto;
    }
    .slider__inner {
        width:70%;
    }
    .slider-container .slider__inner img {
        display:none;
    }
    #js-park-grid ul {
        padding:10px;
    }
    #js-park-grid li {
        width:100%;
        float:none;
        background:#fff;
        height:auto;
        margin:0 0 10px;
        display:block;
        max-height:inherit;
    }
	.list_container .content-block__inner {
		padding:20px 0 0;
		border:none;
	}
	
    #js-park-grid li a img {
        width:100%;
        height:auto;
    }

    .park-info{
			margin-top:-361px !important;
    }

    .park-info--header__inner{
    	padding:10px;
    }

    div.park-info--header {
        /*margin-top:27%;*/
        /*margin-bottom:0;*/
        margin:0 5%;
        text-align:center;
    }
    .park-info--header {
        min-width:90%;
        height:auto;
    }
    .park-info--header .widget_add_review {
        display:block;
        text-align:center;
        width:100%;
        position:relative;
        top:0;
    }
    .park-info--header .widget_add_review__outer {
        position:relative;
        top:-6px;
        right:auto;
        width:100%;
    }

    #review_widget{
    	margin-top:40px;
    }

    .row .span-5{
    	width:100%;
    }
    a.widget_add_review {
       display:block;
       margin-top:10px;
    }
    .review_widget .review-info {
        position:relative;
        bottom:auto;
    }
    div#parkLocations.park-locations {
        margin-top:0;
        margin-right:auto;
        width:100%;
        margin-left:auto;
        float:none;
        display:block;
    }
    div.large-4.columns.map_locations {
        padding:20px 20px 0;
    }
    .sidebar-adverts .join-community a {
        display:none;
    }
    footer {
        width:100%;
    }
    footer .large-12.columns {
        width:96%;
    }

    .park-gallery-main {
        width:100%;
        display:block;
    }
    #park-gallery-thumbnail-container {
        display:block;
        width:95%;
        margin:2.5%;
        text-align:center;
    }
    #mpu {
      display:block;
      margin:20px auto;
      width:100%;
      max-width:320px;
      text-align:center;
    }
	/*
	nav ul { top:90px; max-width:96%; }
	nav div ul li { height:auto; max-width:100%; float:none; width:auto; padding:0; }
	nav li a { color:#333; padding:10px 20px 10px; max-width:100%; width:auto; height:auto; }
*/
	.short_nav_park_details {
        width:100%;
        border-radius: 0;
        margin-top: 10px !important;
	}
	.short_nav_park_details li {
		width:100% !important;
	}
	.short_nav_park_details li a {
        font: normal 14px/40px 'FuturaStd-CondensedBold';
        border-bottom: 1px solid rgba(255,255,255,0.1)
	}
    .rating label {
		width: 39px;
		margin: 0px -2px;
	}
}

@media only screen and (min-width:1181px) {
  .booking-button{
    width:32.5%;
  }
}

@media screen and (max-width:1180px) and (min-width:1024px){
	.park-locations{
		margin-top:10px;
	}

  /*.booking-image {
    height:340px;
  }*/

	.booking-button{
		width:35%;
		/*margin:5px 20px;*/
	}

	.booking-button span{
		padding-left:17px;
		padding-right:17px;
	}

	.right-copy-box {
	  width:35%;
	}

}

@media only screen and (max-width:830px) {
    footer .siteContent li {
        border: none;
        border-bottom: 1px solid rgba(255,255,255,0.1);
        border-right: 0 !important;
        width: 100% !important;
        height: auto !important;
        padding: 10px 0 !important;
    }
}

@media only screen and (max-width:540px) {
  .add-reviews .content-block__header a p.title {
    font-size:20px;
  }
    div.howitworkscontainer div.img-col {
        width: 100%;
        margin-bottom: 20px;
    }
}

@media only screen and (max-width:803px) {
  .booking-image {
    margin:0 auto;
    background-image:none !important;
    background-size:auto 100%;
    background-position:center;
    text-align:center;
    height:330px;
  }
  .booking-image .booking-button {
    margin:0 auto;
    display:inline-block;
    background-color:rgba(0,0,0,0);
    float:none;
  }
}