Demo entry 6324444

sdfs

   

Submitted by anonymous on Nov 17, 2016 at 18:15
Language: CSS. Code size: 6.6 kB.

body{
	min-width:580px;
}

/*Remove 980px width*/
.mainContent,
.mainFooter,
.mainHeader,
.mainHeader nav.mainNav .navWrapper,
.outside .mainHeader .mainNav {
	max-width:980px !important;
    width: 100% !important;
}

/*mainHeader 100% width across all sizes*/
.mainHeader{
	min-width:100%;
}

/*Fix header and logo placement*/
.mainHeader .mainNav .logo img {
	margin-left:0 !important;
}
.home{
	padding-top:0;
}
.marketingTop{
	padding:2.5%;

}

/*Fix content running into side of viewport*/
.mainContent{
	padding-left:0px;
	padding-right:0px;
	box-sizing: border-box;
}


.mod {
    margin: 10px;
}

/*Remove bg-color from mobile dropdown*/
.mainHeader nav.mainNav .nav {
	background:none;
}

/*Login form margin*/
.homeLogin{
	top:0px !important;
}

/*Messaging*/
#messaging-page .main{
	width:980px;
}


/*Other*/
.mainHeader nav.secondaryNav .navWrapper {
	box-sizing: border-box;
    max-width:980px;
    padding-left:20px;
    width: auto;
}
.mainHeader nav.secondaryNav .navWrapper .primaryAction {
	width:auto;
}

.js nav.secondaryNav .navWrapper .primaryAction {
    //display:none;
}

/*Form Elements*/
.input-prepend .add-on{
	display:inline-block;
}
#filter-form {
    width: auto;
}

	
@media(max-width: 1024px){
	/*Hide Features and Join links on mobile.*/
	#outsideNav{
		display:none;
	}
	/*Login placement*/
	.size2of5.homeLogin{
		margin-right:10px;
		width:38%;
		top:140px !important;
	}


	/*Messaging*/
	#messaging-page .main{
		width:auto;
	}

	#messaging-page .mod_wrap{
		right:67%;
	}
	#messaging-page .mod_wrap .mod_content{
		width:63%;
		left:67%;
	}
	#messaging-page .mod_wrap nav{
		width:33%;
		right:-67%;
		left:initial;
	}
	#messaging-page .mailNav{
		margin-top:0 !important;
		padding:0;
	}

}

/*Strange break points*/
@media (max-width: 768px) and (min-width: 568px) and (orientation: portrait){
	.outside .size3of5 {
	    margin-top: initial;
	}
	.marketingTop{
		height:auto;
		padding:2.5% !important;

	}
	.marketingTop h1{
		margin-top:0 !important;

	}
	.outside .mainContent .line:nth-child(3) {
	    margin-top: 400px;
	}

}

/*Nav Transformation*/
@media(min-width: 951px){
	.mainHeader nav.mainNav .nav {
		display:block !important;
	}
}

@media(max-width: 950px){
	.mainNav{
		position:relative;
	}
	/*Transform header secondary nav into dropdown/flyout*/
	.mainHeader nav.mainNav .navHamburger {
		content: "";
		position: absolute;
		right: 25px;
		top: 50%;
		transform:translateY(-50%);
		-webkit-transform:translateY(-50%);
		-ms-transform:translateY(-50%);
		height:35px;
		width: 40px;
		background: linear-gradient(
			to bottom, 
			transparent, transparent 14%, 
			white 14%, white 28%, 
			transparent 28%, transparent 42%, 
			white 42%, white 56%, 
			transparent 56%, transparent 70%,
			white 70%, white 84%,
			transparent 84%, transparent 100%

		);
	}
	.mainHeader nav.mainNav .nav {
		background:#7593b6;
		border:1px solid #41536d;
		display:none;
	    left: inherit;
	    float: right;
	    list-style: none;
	    margin: -10px 0 0 0;
	    position:absolute;
	    right:25px;
	    top:100%;
	    z-index:999;
	}
	.mainHeader nav.mainNav .nav li{
	    float:none;
	    margin-bottom:5px;
	}
	.mainHeader nav.mainNav .nav li a{
	    text-align:left;
	}
	.mainHeader nav.mainNav .nav li a br:nth-child(2){
	    display: none;
	}
	.mainHeader nav.mainNav .nav li a .glyphicon{
	    margin-right:10px;
	    float:left;
	    top:5px;
	}

	.mainHeader nav.mainNav .nav li.vertical-divider {
	    height: 1px;
	    width: 100%;
	    margin: 7px 0px;
	    overflow: hidden;
	    background-color: #41536d;
	    border:none;
	}
	.mainHeader nav.mainNav .nav li.account a {
	    padding-top: 10px;
	    padding-bottom: 15px;
	}
}

@media(max-width: 693px){
	/*Make column classes responsive*/
	.size3of5, .size2of3, .line{
		width:100% !important;
	}

	/*Login page*/
	.homeLogin{
		top:140px !important;
	}
	.outside .mainContent{
		padding:0;
	}
	.outside .mainContent .line:nth-child(3) {
	    margin-top: 400px;
	}
	.marketingTop h1{
		margin-top:10px !important;

	}

	/*Secondary Nav*/
	.secondaryNav .navWrapper{
		padding-top:10px !important;
	}



	/*User Chooser*/
	.btn,
	button,
	.secondaryNav #medicaldropdown label,
	.secondaryNav #medicaldropdown select{
		float:none;
		display:block;
		margin-bottom:3px;
		width:50%;
	}
	.accordion-subheads{
		float:none !important;
		width:100%;
	}

	/*Main Mod header and actions*/
	.mod header{
		padding-bottom:15px !important;
	}
	.mod header .btn:nth-child(1) {
	    margin-top: 10px !important;
	}
	.mod .btn{
		float:none;
		display:block;
		margin-bottom:3px;
	}
	.messaging .btn{
		float:left;
	}


	/*Messaging*/
	#messaging-page .mod_wrap .mod_content{
		width:62%;
	}


	/*Fix Forgot Password Header issue*/
	.mainContent .mod header {
		clear:initial;
	}

	/*Form elemets*/
	form .left{
		float:none;
	}
	form .add-on{
		display:block;
	}
	.form-horizontal .control-label {
	    float: none;
	    width: auto;
	    text-align: left;
	}
	.accountSwitcher form .profileSelect select {
	    width: 25%;
	}
	.mainContent .mod header .btn-group.right {
	    float: right !important;
	}


	form input{
		display:block !important;
	}
	.mod header.header-blue form .btn {
	    margin-left: 0px;
	}

	/*Prevent cost report button from hiding*/
	.mainContent .mod header .btn-group .btn:last-child {
	    display: block;
	}

	/*Other*/
	.secondaryNav{
		height: auto !important;
		padding-bottom: 25px;
	}
	.margin-right-20{
		margin-right:0;
	}
	
	.line{
		box-sizing: border-box;
		//margin-top:25px !important;
		padding-left:25px;
		padding-right:25px;
	}
	.line:nth-child(2){
		margin-top:0;
	}
	.mainContent > .line{
		padding-left:0 !important;
		padding-right:0 !important;
	}
	.mainContent{
		//padding-left:0px;
	}

	.marketingTop{
		margin-top:0;
		margin-right:0;
		width:100% !important;
	}

}

/*Other fixes for smaller screens*/
@media only screen and (-webkit-min-device-pixel-ratio: 2) and (max-device-width: 480px){
	.outside .home .line .size3of5 {
	    margin-top: 0;
	}	
	.outside .home .size2of5 {
	    width: 75%;
	    margin: 0 auto;
	}
	.marketingTop {
	    height: auto !important;
	}
	.home .homeLogin{
		top:145px;
		right:initial;
		left:50% !important;
		transform:translateX(-50%);
	}

}

This snippet took 0.01 seconds to highlight.

Back to the Entry List or Home.

Delete this entry (admin only).