﻿/******************************************************************
1280up.css
-------------------------------------------------------------------
Stylesheet: Large Screen Stylesheet
-------------------------------------------------------------------

You can add some advanced styles here if you like. This kicks in
on larger screens.

******************************************************************/

/* These styles are applied for viewports 1280px and higher */
@media only screen and (min-width: 1280px) {

	#body-wrapper {
	padding-left: 6%;
	}

	/*#page-wrap .content-row {
	margin-right: 8%;
	}

	header#page-header .row {
	margin-right: 8%;
	}
	*/

	/*------------------------------------------------------------------
	--> Charm Bar
	------------------------------------------------------------------*/

	#charm-toggle {
	display: none;
	width: 100px;
	}

	#charm-bar {
	display: inline-block;
	position: absolute;
	text-align: center;
	right: 0;
	padding: 6px;
	width: 100px;
	height: 100%;
	background: transparent;
    background: rgba(2,21,70, 0.8);
	}

	#charm-bar .mm-button-wrap {
	margin: 5px 0;
	width: auto;
	}

	/* --> Charms ----------------------------------------------------*/

	#close-charms { display: none; }

	#static-charms {
	padding-bottom: 10px;
	}

	/* Link wrapper */
	#dynamic-charms .mm-button-link,
	#static-charms .mm-button-link,
	#dynamic-charms .portal-myIcon-wrap,
	#portal-charms .portal-myIcon-wrap {
	width: 70px;
	height: 70px;
	color: white;
	background-color: #0f3da8;
	border-radius: 50%;
	vertical-align: middle;
	display: inline-block;
	margin: auto 3px;
	line-height: 5.5em;
	text-align: center;

	transition: background-color .6s ease-in-out;
	-o-transition: background-color .6s ease-in-out;
	-moz-transition: background-color .6s ease-in-out;
	-webkit-transition: background-color .6s ease-in-out;
	}

	#dynamic-charms .mm-button-img, 
	#static-charms .mm-button-img, 
	#dynamic-charms .portal-myIcon-img, 
	#portal-charms .portal-myIcon-img{
	vertical-align: middle;
	height: 35px;
	width: 35px;
	display: inline-block;
	top: -6px;
	position: relative;
	}

} 