/* Large Devices, Wide Screens */
@media only screen and (max-width : 1430px) {
	.container {
		width: 1150px;
	}
    .mainTop {
        height: 660px;
    }
    p.ph {
        font-size: 35px;
    }
    p {
        font-size: 17px;
        line-height: 24px;
    }
    .hP {
        margin-top: -100px;
    }
    ul.menu li a {
        padding: 12px 12px 13px 12px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    .container {
        width: 960px;
    }
    a.booknow {
        margin-left: 8px;
    }
    ul.menu li a {
            padding: 12px 7px 13px 7px;
        font-size: 16px;
    }
    h1, h3 {
        font-size: 35px;
        line-height: 48px;
    }
    .cHolder h2 {
        font-weight: 500;
        font-size: 29px;
    }
    .mainTop {
        height: 470px;
    }
    .overTwo {
        grid-template-columns: 50% auto;
    }
    .cHolder img {
        margin-left: -50px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1100px) {
    
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
	.container, .smContainer {
		width: 730px;
    }
    
    .ferryHolder .two {
        grid-template-columns: 1fr;
        text-align: center;

    }
    
    .topHeader h2 {
        font-size: 30px;
        padding-bottom: 20px;
        padding-top: 19px;
    }
    ul.menu li {
        display: none;
    }
    ul.menu li.bookli, .hamb {
        display: inline-block;
        margin-top: 8px;
    }
    ul.menu li.bookli {
        margin-right: 18px;
    }
    ul.menu li.hamb {
        width: auto;
        cursor: pointer;
        display: inline-block;
        vertical-align: top;
        margin-top: 0px;
    }
    .hambBTN {
        width: 31px;
        margin-top: 8px;
        float: right;
    }
     .hamb span {
        display: block;
        width: 100%;
        height: 2px;
        background-color: #000000;
        margin-bottom: 8px;
    }
    .bigmen {
        display: none;
    }
    .contactGrid {
        grid-template-columns: 50fr 50fr;
    }
    .cHolder img {
        margin-left: -68px;
        width: 142%;
    }
}

@media only screen and (max-width : 850px) {
    .contactGrid {
        grid-template-columns: 1fr;
    }
    .whitebg {
        padding-top: 20px;
    }
    .cc {
        margin-bottom: 50px;
    }
}
    
/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
    .mainTop {
        height: 550px;
        position: relative;
    }
    
    .topHeader h2 {
        display: none;
    }
    
    .floatingFoot {
        
    }
    
    ul.menu li a {
        padding: 9px 13px 9px 13px;
    }
    
    .contactform {
        grid-template-columns: 1fr;
    }
    
    .mainP {
        font-size: 15px;
    }
    
    .topL {
        padding-top: 25px;
        padding-left: 29px;
        padding-right: 15px;
        max-width: 260px;
    }
    
    .topHeader h2 {
        font-size: 23px;
        padding-bottom: 14px;
        padding-top: 11px;
    }
    
    .container {
		width: 450px;
	}
    .section.cTypes .two, .slbtn {
        grid-template-columns: 1fr;
    }
    
    h1, h3 {
        font-size: 28px;
        line-height: 32px;
        margin-bottom: 20px;
    }
    
    .hP {
        margin-top: 0px;
    }
    
    .whiteslide {
        padding-right: 15px;
        padding-left: 15px;
        box-sizing: border-box;
    }
    
    .gal {
        grid-template-columns: 50fr 50fr;
        column-gap: 14px;
    }
    
    .gal img {
        margin-bottom: 10px;
    }
    
    .fl {
        display: block;
        width: 150px;
        margin: auto;
        margin-top: 58px;
    }
    .fGridLogo, .overTwo {
        grid-template-columns: 1fr;
    }
    .subP {
        font-size: 30px;
        margin-top: -3px;
        line-height: 38px;
    }
    
    .borderbox {
        top: 20px;
        bottom: 20px;
        left: 20px;
        right: 20px;
    }
    
    .locationbg {
        background-image: url(../img/charterlocationspoole.jpg);
        background-position: top right;
    }
    
    .whatson {
        background-image: url(../img/facilitiesmobile.jpg);
        background-position: bottom;
        height: 570px;
    }
    
    .picnic {
        background-image: url(../img/picnicboatmobile.jpg);
        background-position: bottom;
        height: 570px;
    }
    
    .homepage {
        background-image: url(../img/charterspoole.jpg);
        background-position: bottom;
        height: 570px;
    }
    
    .daycharterspoole {
        background-position: -240px;
    }
    
    .picnic {
        background-position: -1px;
    }
    .eveningcharters {
        background-position: -240px, 0px;
    }
    
    .miniBoat {
        display: none;
    }
    
    .koolauwhite {
        display: block;
        position: absolute;
        bottom: -2px;
        right: 0px;
        left: 0px;
        text-align: center;
    }
    .koolauwhite img {
        width: 130px;
    }
    
    .koolauwhite.dd {
        
    }
    
    .koolauwhite.dd img {
        width: 20px;
    }
}


@media only screen and (max-width : 600px) {
    .container {
        width: 410px;
    }
    .fGrid {
        display: block;
        padding: 0px 15px;
        box-sizing: border-box;
    }
    .blueLine {
        display: none;
    }
    .fGrid p {
        font-size: 13px;
    }
    .logo img {
        width: 113px;
        display: block;
    }
    a.booknow {
        font-size: 15px;
    }
    .hGrid {
        display: grid;
        grid-template-columns: 120px auto;
    }
    .daycharterspoole {
        background-position: -390px;
    }
    .eveningcharters {
        background-position: -420px, 0px;
    }
}

@media only screen and (max-width : 520px) {

}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
	.container, .sideEvents .pad, .smContainer {
		width: 100%;
        padding: 0px 15px;
        box-sizing: border-box;
	}
}