/* Both phone and tablet (Below 1020px)*/
@media only screen and (max-width: 1020px){
    
        
}

/* -----------------------TABLETS!------------------------ */

/* Tablet (768px to 1200px) */
@media only screen and (min-width: 768px) and (max-width: 1020px)  {

    html body {
        overflow-x:hidden;
    }
    body .wrapper {
        width:100%;
    }

	body #middle-bg {
		left:0;
	}

    #main .wrapper .yui3-u-1-3 {
        width:33.333%;
    }

    body #menu #menu-main-menu {
        text-align:center;
    }
    body #menu #menu-main-menu li a span {
        display:inline;
    }
    #estate-websites li.dalkeith-website #dalkeith-popup {
        left:-147px;   
    }
    #estate-websites li.dalkeith-website #dalkeith-popup span.arrow {
        left:169px;
		background-position:0 0;
    }
    #estate-websites li.drumlanrig-website #drumlanrig-popup {
        left:-216px;   
    }
    html #estate-websites li.drumlanrig-website #drumlanrig-popup span.arrow {
        left:255px;
		background-position:0 0;
    }

    /* HEADER */
    body #header #search-block {
        margin-right:20px;
    }
    body #header #header-right {
        width:422px;
    }
	body #menu #menu-main-menu li#how-to-find-us a span {
		display:block;
	}

    /* FOOTER */
    body #footer {
        padding:48px 60px 0;
    }
    body #footer h2 {
        font-size:1.25em;
    }
    body #footer #drumlanrig-address {
        width:37%;
    }
    body #footer #buccleuch-links {
        width:35%;
    }
    body #footer .wrapper {
        width:100%;
    }

    /* HOME PAGE */
    body.home #home-left {
        width:100%;
    }
    body.home #intro-block {
        border-bottom:1px solid #830065;
        margin:0 auto;
		width:745px;
        padding:30px 0;
        border-right:0px;
    }
    body.home #slideshow {
        width:745px;
        padding:0 9px;
        margin:0 auto;
    }
    body.home #slideshow .slide > div.slide-image {
        width:745px;
    }
    body.home #slideshow #prev {
        left:-9px;
    }
    body.home #slideshow #next {
        right:-13px;
    }
    body.home #main .wrapper #home-right {
        width:100%;
        padding-bottom:45px;
        margin-bottom:20px;
    }
    body.home #main .wrapper #home-right > div {
        margin:0 auto;
		width:745px;
        border-bottom:1px solid #830065;
    }
    body.home #event-highlight {
        background:transparent;
        width:356px;
        height:auto;
        display:inline-block;
        vertical-align:top;
        padding:32px 0;
        margin-right:40px;
    }
    body.home #latest-news {
        width:298px;
        display:inline-block;
        vertical-align:top;
        padding:32px 0;
    }
    body.home #main #promotional-blocks .promo-block:nth-child(2n+2) {
        margin-right:0px;
    }
    body.home #promotional-blocks .promo-block.end {
        margin-right:20px;
    }
    body.home #promotional-blocks .promo-block a {
        width:330px;
        height:215px;
    }
    body.home #promotional-blocks {
        padding:0 48px;
        width:745px;
        margin:0 auto;
    }

    /* BASIC PAGE */
    body.page #left-sidebar {
        width:260px;
    }
    body.page #right-content {
        width:506px;
    }
    body.page #right-content #content-header img {
        width:100%;
        height:auto;
    }

    /* SINGLE NEWS ARTICLE */
    body.single #left-sidebar {
        width:260px;
    }
    body.single #right-content {
        width:506px;
    }
    body.single #right-content #content-header img {
        width:100%;
        height:auto;
    }


    /* CALL TO ACTIONS */
    body #call-to-actions li a {
        width:239px;
    }

    /* NEWS LISTING AND ARCHIVES */

    body.archive #left-sidebar {
        width:260px;
    }
    body.archive #right-content {
        width:506px;
    }
    body.archive #right-content #content-header img {
        width:100%;
        height:auto;
    }
    .page-template-news-php #right-content #listing .entry .entry-left {
        width:130px;
        margin-right:15px;
    }
    .page-template-news-php #right-content #listing .entry .entry-left img {
        width:130px;
        height:130px;
    }
    .page-template-news-php #right-content #listing .entry .entry-right {
        width:304px;
    }

    /* EVENT LISTING */
    .post-type-archive-event #right-content #listing .entry .entry-left,
    .tax-events #right-content #listing .entry .entry-left {
        width:130px;
        margin-right:15px;
    }
    .post-type-archive-event #right-content #listing .entry .entry-left img,
    .tax-events #right-content #listing .entry .entry-left img {
        width:130px;
        height:130px;
    }
    .post-type-archive-event #right-content #listing .entry .entry-right,
    .tax-events #right-content #listing .entry .entry-right {
        width:304px;
    }

    /* GALLERY LISTING */
    body.post-type-archive-gallery .gallery-image img,
    body.tax-gallery_category .gallery-image img {
        width:140px;
        height:140px;
    }

}

/* -----------------------MOBILE PHONES!------------------------ */

/* 360 Wide (HTC One etc)
@media only screen and (min-device-width : 360px) and (max-device-width : 360px) {
    body.home #slideshow .slide > div.slide-image {
        width:360px;
        height:167px;
    }
    body.home #promotional-blocks .promo-block .promo-title {
        width:360px;
        background: url("../images/right-arrow.gif") no-repeat 320px 8px #830065;
    }
    body #call-to-actions li a {
        width:360px;
    }
    html, body {
        max-width:360px;
    }
}*/

/* 320 Wide (iPhone etc)
@media only screen and (min-device-width : 320px) and (max-device-width : 320px) {
    body.home #slideshow .slide > div.slide-image {
        width:320px;
        height:167px;
    }
    body.home #promotional-blocks .promo-block .promo-title {
        width:320px;
        background: url("../images/right-arrow.gif") no-repeat 280px 8px #830065;
    }
    body #call-to-actions li a {
        width:320px;
    }
    html, body {
        max-width:320px;
    }
}*/

/* Phone portrait (Below 480px) */


@media only screen and  (max-width: 767px) {

    html body {
        overflow-x:hidden;
    }

    #middle-bg {
        background:transparent url('../images/mobile-bg.jpg') no-repeat top center;
		left:0;
    }

    #header #logo {
        text-align:center;
    }
	body #header #logo img {
		width:30%;
		max-width:290px;
		height:auto;
	}
    body #header .wrapper {
        height: 110px;
        margin-bottom: 45px;
    }

    #header .yui3-u-3-4 {
        display:none;
    }
    #header .yui3-u-1-4 {
        width:100%;
    }
    #menu-toggle {
        background: url("../images/menu-toggle-button.png") no-repeat scroll 0 0 transparent;
        display: block;
        float: right;
        height: 43px;
        margin-top: -43px;
        width: 82px;
        text-indent:-999px;
    }
	#menu-toggle.closed {
		background: url("../images/menu-toggle-button-off.png") no-repeat scroll 0 0 transparent;
		display: block;
		float: right;
		height: 43px;
		margin-top: -43px;
		width: 82px;
		text-indent:-999px;
	}
	body #menu #menu-main-menu li#how-to-find-us a {
		height:30px;
	}
	body #menu #menu-main-menu li#how-to-find-us {
		border:0;
	}

    body .wrapper,
    body #footer .wrapper {
        width:100%;
    }

    #main .wrapper .yui3-u-1-3 {
        width:33.333%;
    }
    body #menu #menu-main-menu {
        text-align:left;
        padding:0;
        float: none;
        width: 100%;
        margin:0;
    }
    body #menu .wrapper {
        background: #D3230F;
    }
    body #menu #menu-main-menu li {
        display:block;
        border-bottom:1px solid white;
        background:#67675d;
    }
    body #menu #menu-main-menu li:hover a {
        
    }
    body #menu #menu-main-menu li:hover ul {
        display:none;
    }
    body #menu #menu-main-menu li ul {
        background:transparent;
        position:absolute;
        top:0;
        box-shadow:none;
        z-index:99;
        display:none;
        padding:0;
        margin:0;
        right: auto !important;
        left: 200%;
        position: absolute;
        width: 100%;
        -webkit-transition: left 300ms 0;
        -moz-transition: left 300ms 0;
        -o-transition: left 300ms 0;
        transition: left 300ms 0;
    }
    #menu #section {
        left: 0;
        position: relative;
        width: auto;
        -webkit-transition: left 300ms 0;
        -moz-transition: left 300ms 0;
        -o-transition: left 300ms 0;
        transition: left 300ms 0;
    }
    body #menu #menu-main-menu li ul li {
        border:0;
    }
    body div#menu ul#menu-main-menu li ul li a {
        background:none !important;
        border:0;
        color:white;
    }
    body #menu #menu-main-menu li a {
        background:transparent !important;
        padding:12px 10px 12px 15px;
        display:block;
        color:white;
        font-family:'Buenard', serif;
        font-size:1.25em;
    }
    body #menu #menu-main-menu > li.has-sub > a {
        background:transparent url('../images/mobile-menu-li.png') no-repeat top right !important;
    }
    body #menu #menu-main-menu li.back-to-menu a {
        background:transparent url('../images/mobile-menu-li-invert.png') no-repeat 0 2px !important;
        padding-left:40px;
        border-bottom:1px solid white;
        margin-bottom:10px;
    }
    body #menu #menu-main-menu li a span {
        display:inline;
    }
	body #menu #menu-main-menu li#how-to-find-us a .inner-navlink {
		background:none !important;
		padding-left:0px;
	}

	body h1 {
		font-size:2.25em;
		line-height:1.328em;
	}

    /* HOME  */
    body.home #slideshow {
        width:100%;
        height:167px;
        padding:0;
    }
	body.home #promotional-blocks .promo-block .promo-title {
		background-image:url('../images/right-arrow-mob.png');
	}
    body.home #slideshow .slide > div.slide-image {
        height:167px;
    }
    body.home #slideshow .slide h2 {
        font-size:1.25em;
    }
    body.home #slideshow .slide > div.slide-content > div {
        padding:15px 20px;
    }
    body.home #slideshow #prev,
    body.home #slideshow #next,
    body.home #slideshow #slideshow-controls {
        display:none;
    }
    body.home #home-left,
    body.home #home-right,
    body.home #event-highlight {
        width:100%;
    }
    body #main .wrapper .yui3-u-1-3 {
        width:100%;
    }
    body.home #home-right {
        display:none;
    }
    body.home #promotional-blocks .promo-block a {
        width:100%;
        display:block;
    }
    body.home #promotional-blocks .promo-block {
        margin:0;
        width:100%;
    }
    body.home #promotional-blocks .promo-block .promo-content {
        display:none;
    }
    body.home #promotional-blocks .promo-block a {
        background:none !important;
        height:auto;
    }
    body.home #promotional-blocks .promo-block .promo-title {
        padding:8px 0;
        margin:0;
        width:100%;
        display:block;
        border-bottom:1px solid white;
		text-indent:15px;
    }
    body #main .wrapper {
        padding-bottom:0;
    }

    /* CALL TO ACTIONS */
    body #call-to-actions li a {
        background:none !important;
        height:auto;
    }
    body #call-to-actions li a .cta-title {
        margin:0;
        width:100%;
    }

    /* BASIC PAGE */
    body.page #right-content {
        width:100%;
    }
    body.page #left-sidebar {
        width:100%;
    }
    body.page #right-content #content-header img {
        width:100%;
        height:auto;
    }
    body.page #right-content #content {
        padding:0 10px;
    }

    /* EVENTS / WHAT'S ON */
    body.archive #right-content {
        width:100%;
    }
    body.archive #left-sidebar {
        width:100%;
    }
    body.archive #right-content > div {
        padding-right:0px;
    }
    body.archive #right-content #content-header img {
        width:100%;
        height:auto;
    }
    body.archive #right-content #content {
        padding:0 10px;
        margin-bottom:20px;
    }
    body.archive #right-content #listing .entry {
        padding-bottom:30px;
        margin-bottom:34px;
    }
    body.archive #right-content .entry-left {
        display:none;
    }
    body.archive #right-content .entry-right {
        width:100%;
    }
    body.archive #right-content #listing {
        padding:0 10px;
    }
    body.archive #right-content #content p {
        display:none;
    }

    /* GALLERY */
    body.archive.post-type-archive-gallery #right-content #listing, .archive.tax-gallery_category #right-content #listing {
        padding:0 15px;
    }
    body.archive.post-type-archive-gallery .gallery-image,
    body.archive.tax-gallery_category .gallery-image {
        margin-bottom: 24px;
        margin-right: 24px;
    }
    body.archive.post-type-archive-gallery .gallery-image img,
    body.archive.tax-gallery_category .gallery-image img {
        height:140px;
        width:140px;
    }
    body.archive.post-type-archive-gallery .gallery-image:nth-child(2n+2),
    body.archive.tax-gallery_category .gallery-image:nth-child(2n+2) {
        margin-right:0;
    }

    /* NEWS */
    body.page #right-content .entry-left {
        display:none;
    }
    body.page #right-content .entry-right {
        width:100%;
    }
    body.page-template-news-php #right-content #listing {
        padding-left:10px;
    }
    body.page-template-news-php #right-content > div {
        padding-right:10px;
    }

    /* SINGLE PAGES SUCH AS EVENT SINGLE AND NEWS SINGLE */
    body.single #left-sidebar {
        width:100%;
    }
    body.single #right-content {
        width:100%;
    }
    body.single #right-content #content-header img {
        width:100%;
        height:auto;
    }
    body.single #right-content #content {
        padding:0 10px;
    }

    body #footer .wrapper > div,
    body #footer #buccleuch-links,
    body #footer #partner-hotels {
        width:100%;
        text-align:center;
        margin-bottom:20px;
    }
    body #footer #partners img {
        width:100%;
    }
    body #footer ul li {
        list-style-type:none;
    }
    body #footer #copyright {
        width:100%;
    }
    body #footer #copyright .yui3-u-1-2 {
        width:100%;
    }
        
}

@media only screen and  (max-width: 480px) {
body #header #logo img {
		width:45%;
		max-width:290px;
		height:auto;}
}

/* Phone landscape (480px-780px) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
        
    *{
        transition: width 1s;
        -moz-transition: width 1s; /* Firefox 4 */
        -webkit-transition: width 1s; /* Safari and Chrome */
        -o-transition: width 1s; /* Opera */
    }

    #header #header-image,
    #header .wrapper,
    #main .wrapper,
    #menu .wrapper,
    #footer .wrapper {
        width:100%;
    }
	body #middle-bg {
		background: url("../images/mobile-bg.jpg") no-repeat scroll center top transparent;
	}
    body #menu {
        height:auto;
    }
    body #menu .menu {
        padding:5px 0;
    }
    #menu .wrapper .menu ul li {
        width:100%;
        margin:0;
        padding:0;
        border-right:0;
        border-bottom:1px solid #585766;
        float:none;
    }
    #menu .wrapper .menu ul li a {
        display:block;
        padding:10px;
    }

    #main .wrapper .box {
        margin:0 10px 10px 0;
    }
    #main .wrapper .yui3-u-1-3,
    #main .wrapper .yui3-u-1-2 {
        width:50%;
    }   
    .page #main .wrapper #left-sidebar,
    .page #main .wrapper .yui3-u-1-4,
    .page #main .wrapper .yui3-u-3-4 {
        width:100%;
    }
    .page #main .wrapper .main-content {
        margin:0;
    }
    body #footer #copyright {
        width:100%;
    }
    body #footer #copyright .yui3-u-1-2 {
        width:100%;
    }
            
}
@media only screen and (min-width: 1000px){
	html body,
	#middle-bg{
		min-width:1161px;
	}
}
/* fix the layout of the nav on tablet and desktop sizes (This is broken by the javascript menu dropdown on smaller sizes) */
@media only screen and (min-width: 767px){

    #middle-bg {
        background:transparent url('../images/main-bg.jpg') no-repeat top center;
    }
    #menu #menu-main-menu li {
        position:relative;
    }
    #menu-toggle {
        display:none;
    }
    #menu #menu-main-menu {
        display:block !important;
        background:none;
        /*background: #991B0C;
         background: -moz-linear-gradient(left,  #991B0C 0%, #D3230F 50%, #981B0C 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%,#991B0C), color-stop(50%,#830065), color-stop(100%,#981B0C));
        background: -webkit-linear-gradient(left,  #991B0C 0%,#D3230F 50%,#981B0C 100%); 
        background: -o-linear-gradient(left,  #991B0C 0%,#D3230F 50%,#981B0C 100%);
        background: -ms-linear-gradient(left,  #991B0C 0%,#D3230F 50%,#981B0C 100%); 
        background: linear-gradient(to right,  #991B0C 0%,#D3230F 50%,#981B0C 100%); 
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#991B0C', endColorstr='#981B0C',GradientType=1 ); 
        */
        box-shadow:rgba(0,0,0,0.25) 0 6px 2px -2px;
        margin:0;
        padding:0 20px;
    }
    #menu-main-menu li {
        display:inline-block;
        vertical-align:top;
        z-index:1;
		margin-right:-4px;
    }
    #menu-main-menu li:hover {
        z-index:2;
    }
    #menu-main-menu li a {
        color:white;
        display:table-cell;
        text-align:center;
        height:53px;
        padding:0 20px 0px 10px;
        vertical-align:middle;
        font-size:0.875em;
        text-transform:uppercase;
        line-height: 1.25em;
        /*background:url('../images/main-menu-sep.png') no-repeat top right;*/
    }
	#menu-main-menu > li > a {
		padding:0;
	}
	#menu-main-menu > li:nth-child(2n+2) > a > div.inner-navlink {
		border-left:1px solid rgba(255,255,255,0.4)/* #024F2C */;
		border-right:1px solid rgba(255,255,255,0.4) /* #024F2C */;
	}
	#menu-main-menu > li:nth-child(2n+2):hover > a > div.inner-navlink {
		border-color:white;
	}
	#menu-main-menu > li > a > div.inner-navlink {
		padding:0 15px;
	}
    #menu-main-menu > li#menu-item-15 {
        background:transparent;
        padding:0;
        margin-right:4px;
    }
    #menu-main-menu > li#menu-item-15 > a {
        background:url('../images/home-nav-icon.png') no-repeat center center !important;
        text-indent:-9999px;
        padding:0 20px 0 20px !important;
    }
	#menu-main-menu li#menu-item-15:hover {
		background:white;
	}
	#menu-main-menu li#menu-item-15:hover a {
		background:url('../images/home-nav-icon-hov.png') no-repeat center center !important;
	}
    #menu-main-menu li a span {
        display:block;
    }
    #menu-main-menu li a:hover,
    #menu-main-menu li:hover a {
        text-decoration:none;
        background:white;
        color:#333;
    }
    #menu-main-menu li a {
        z-index:2;
        position:relative;
    }
    #menu-main-menu li ul {
        display:none !important;
        z-index:1;
        background:white;
        width:170px;
        position:absolute;
        top:50px;
        left:-15px !important;
        box-shadow:rgba(0,0,0,0.15) 0 2px 2px 2px;
    }
    #menu-main-menu li ul li {
        display:block;
    }
    #menu-main-menu li ul li a {
        color:#D3230F;
        line-height:1.15em;
        padding:11px 12px;
        height:auto;
        border-bottom:1px solid #e6e6e6;
        display:block;
        text-align:left;
    }
    #menu-main-menu li:hover ul {
        display:block !important;
    }
    #menu-main-menu li.current-menu-item a,
    #menu-main-menu li.current_page_ancestor a,
    #menu-main-menu li.current-page-ancestor a {
        color:#333;
        background:white !important;
    }
	#menu-main-menu li.current-menu-item a > .inner-navlink,
	#menu-main-menu li.current_page_ancestor a > .inner-navlink,
	#menu-main-menu li.current-page-ancestor a > .inner-navlink {
		border-color:white !important;
	}
    #menu-main-menu li.current-menu-item:last-child {
        background:white;
    }
    #menu-main-menu li:last-child.current-menu-item a {
        color:#333;
    }
    #menu-main-menu li.current-menu-item ul li a {
        color:#333;
    }
    

	#estate-websites li.drumlanrig-website #drumlanrig-popup span.arrow {
		left:157px;
		background-position:0 0;
	}

}
