/******************************************************************
481up.css
-------------------------------------------------------------------
Stylesheet: Larger Mobile Device
-------------------------------------------------------------------

This stylesheet is loaded for larger devices. It's set to 
481px because at 480px it would load on a landscaped iPhone.
This isn't ideal because then you would be loading all those
extra styles on that same mobile connection. 

A word of warning. This size COULD be a larger mobile device,
so you still want to keep it pretty light and simply expand
upon your base.scss styles.

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

/* These styles are applied for viewports 460px and higher */
@media only screen and (min-width: 460px) {

    /* --> Header Links ----------------------------------------------*/

    a.head-link {
    margin-right: 30px;
   	}

    .head-links .fontsize {
    margin-right: 30px;
    }   

    #hp-content-row .bx-wrapper .bx-caption {
    top: 83px;
    right: 23px;
    width: 301px;
    }

		
	#feature-side-btns .mm-button-txt-wrap {
    width: 81%;
    }
	
    /* DIRECTION CONTROLS (NEXT / PREV) */
    #hp-content-row .bx-controls-direction{
    top: 280px;
    }

    #charm-toggle {
    top: 14px;
    position: fixed;
    }

/*------------------------------------------------------------------
--> Background Iamge
------------------------------------------------------------------*/

    #big-bg-image {
    display: block;
    height: 100%;
    left: 0;
    overflow: hidden;
    position: fixed;
    width: 100%;
    top: -35px;
    z-index: -1;
    }

    div#dynamic-bg {
    display: none;
    height: auto !important;
    min-height: 100%;
    position: absolute;
    width: 100%;
    }

    div#dynamic-bg .picture {
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    height: auto !important;
    left: 0;
    min-height: 100%;
    position: fixed;
    width: 100%;
    }

/*
------------------------------------------------------------------
--> Page Body Section
------------------------------------------------------------------*/

    #page-body {
    margin: 38% 0 0 0;
    }


/* --> Home Page Top Media Buttons ----------------------------------------*/

    /* Button link wrapper */
    #dynamic-home-btns a.mm-button-link {
    margin:-18px auto 20px auto;
    }

    /* Wrapper for individual media buttons */
    #dynamic-home-btns .mm-button-wrap {
    margin-top: 0;
    margin-bottom: 20px;
    }

}