@import "partials/toast";

@extra-large: ~"only screen and (min-width: 1200px)";
@large: ~"only screen and (min-width: 992px) and (max-width:1200px)";
@medium: ~"only screen and (min-width: 768px) and (max-width:991px)";
@small: ~"only screen and (min-width: 577px) and (max-width:767px)";
@mobile-only:~"only screen and (max-width:576px)";
@fixed-accent-color:#FF1116;

body{
	background-color: #ddd;
}
.main-container{
	overflow: hidden;
}
img {
    max-width: 100%;
    height: auto;
    border: 0;
}

i, cite, em, var, address, dfn {
    font-style: italic;
}
strong, b {
    font-weight: bold;
}
button{
	border-radius: 2px !important;
	text-transform: uppercase;
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25);
	border:none;
	padding:10px 20px !important;
	font-size: 12px !important;
	background-color: #eee;
	color: #333;
	&.close{
		box-shadow: none !important;
	}
	&.no-shadow{
		box-shadow: none;
	}
}
.accent-button{
	background-color:@fixed-accent-color;
	color: #fff;
	
}
nav{
	background-color:#fff;
}
a{
	&.disabled{
		pointer-events: none;
	}
}
#navbar-large{
	height: 80px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid #dadce0;
	box-shadow: none;
	&.top-nav-collapse{
		padding-top: 5px;
		padding-bottom: 5px;
		height: 70px;
	}
	@media @mobile-only{
		height: 60px;
	}
	@media @small{
		height: 60px;
	}
}
.mobile-slider{
	
	a{
		box-shadow:none !important;
		color: #333 !important;
	}
}
.navbar-brand{
	padding:0px;
	height:60px;
	max-width: 60%;
	@media @small{
		height:40px;
	}
	@media @mobile-only{
		height:40px;
	}
	img{
		height:100%;
		object-fit: contain;
	}
}
#main-content{
	min-width: 360px;
	margin-top:82px;
	padding:0px 0px 40px 0px;
	
	@media @mobile-only{
			margin-top: 62px;
		    background-color: #fff;
		}
	@media @small{
			margin-top: 62px;
		    background-color: #fff;
		}
		
	.container{
		@media @mobile-only{
			padding:0px;
		}
	}
}
#redirected-from-email{
	display: none;
}
#fuel-cycle-header{
	.nav-link{
		color:#5f6368 !important;
		height:40px;
	}
	nav .container{
		max-width:100%;
		width:100%;
		height: 100%;
	}
}

footer{
	box-shadow:0 0 5px 0 rgba(0,0,0,.16), 0 0 10px 0 rgba(0,0,0,.12);
}

.footer-first-bar{
	background-color:#ffffff;
	font-weight:400;
	.container{
		max-width:100%;
		width:100%;
		padding:0px 30px;
	}
}
.footer-second-bar{
	background-color:#fff;
	font-weight:400;
	.container{
		max-width:100%;
	}
}
.footer-logo-links-container{
	padding:15px 5px 0px 5px;
	@media @small {
		text-align: center;
	}
	@media @mobile-only {
		text-align: center;
	}
	.footer-logo{
		overflow:hidden;
		@media @small{
			padding-bottom: 15px;
		}
		img{
			height:40px;
			width:auto;
		}
	}
	.footer-links{
		word-break: break-word;
		    font-size: 12px;
			a{
				color:#000;
				font-size:12px;
			}
	}
	.footer-links-with-logo{
		font-size: 12px;
		display: block;
		text-align: right;
		@media @small{
			text-align: center;
		}
		@media @mobile-only{
			text-align: center;
		}
	}
}
.footer-bottom{
	font-size: 12px;
	margin: 0px;
    padding: 0px;

	.footer-text-container{
		padding:20px 15px 15px 15px;
		text-align: left;
		@media @small{
			width: 100%;
		}
		@media @mobile-only{
			width: 100%;
		}
	}
	.footer-powered-by-container{
		color:#6d6d6d;
		padding:15px;
		text-align: right;
		img{
			height:17px;
			position:relative;
			bottom:2px;
		}
		@media @small{
			text-align: center;
			width: 100%;
			padding-top: 0px;
		}
		@media @mobile-only{
			text-align: center;
			width: 100%;
			padding-top: 0px;
		}
	}
	
}
#internal-footer-page-modal{
	.modal-body{
		iframe{
			width:100%;
			overflow:hidden;
		}
	}
}
#processing-indicator{
	position: fixed;
    overflow-y: scroll;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #000;
    opacity: 0.8;
    z-index: 999999;
	display:none;
	img{
		width: 200px;
		height: auto;
		position: absolute;
		top: 50%;
		left: 50%;
		margin: -100px 0 0 -100px;
	}
}
.privacy-page-header{
	height: 100px;
	background-color:#f5f5f5;
	text-align: center;
	font-size: 32px;
	font-weight: 400;
	box-shadow:0 0 5px 0 rgba(0, 0, 0, 0.16), 0 0 10px 0 rgba(0, 0, 0, 0.12);
	padding-top: 25px;
	@media @small{
		height: 50px;
		padding-top: 10px;
		font-size: 20px;
	}
	@media @mobile-only{
		height: 50px;
		padding-top: 10px;
		font-size: 20px;
	}
}
.privacy-page-main-container{
	background-color: #fff;
	padding: 20px;
	height: calc(100% - 60px);
	@media @small{
		height: calc(100% - 10px);
	}
	@media @mobile-only{
		height: calc(100% - 10px);
	}
	.row{
		height: 100%;
	}
	.pills-container{
		padding:0px 50px 0px 100px;
		text-align: left;
		justify-content: flex-start;
		height: 100%;
		overflow: auto;
		@media @large{
			padding:0px 50px;
		}
		@media @medium{
			padding:0px 20px;
		}
		.md-pills{
			.nav-link{
				text-align: left;
				line-height: 2;
				&.active{
					background-color: transparent;
					color: #333;
					font-weight: 500;
					box-shadow: none;
				}
			}
		} 
	}
	.content-container{
		padding:20px 100px 0px 20px;
		height: 100%;
		overflow: auto;
		@media @small{
			padding:20px 50px 0px 20px;
		}
		@media @mobile-only{
			padding:20px 20px 0px 20px;
		}
		.tab-content {
			height: 100%;
			padding-bottom: 0px;
			.tab-pane{
				height: 100%;
				.privacy-tab-title{
					font-weight: 400;
					height: 35px;
					margin-bottom: 10px;
					border-bottom: 1px solid #ddd;
					text-transform: uppercase;
				}
				.privacy-tab-content{
					height: calc(100% - 45px);
					overflow: auto;
					#privacy-tab-content-data-default{
						.data-control{
							color:@fixed-accent-color;
							cursor: pointer;
							font-weight: 400;
						}
					}
					#privacy-tab-content-data-send-email{
						display: none;
						#send-email{
							margin:20px 0px;
							width: 400px;
							&.error{
								color: red;
							}
							&.error:focus{
								border-bottom: 1px solid red;
    							box-shadow: 0 1px 0 0 red;
							}
							&.success{
								color: green;
							}
							&.success:focus{
								border-bottom: 1px solid green;
    							box-shadow: 0 1px 0 0 green;
							}
						}
						#send-email-label{
							&.error{
								color: red;
							}
							&.success{
								color: green;
							}
						}
					}
					#privacy-tab-content-data-email-sent{
						display: none;
					}
					#privacy-tab-content-data-access-granted-deleted{
						display: none;
						#cancel-delete-data{
							display: block;
							margin:20px 0px 30px 0px;
						}
					}
					#privacy-tab-content-data-access-granted{
						display: none;
						#export-data{
							display: block;
							margin:20px 0px 10px 0px;
						}
						#delete-data{
							display: block;
							margin:20px 0px 0px 0px;
						}
						#correct-data{
							display: block;
							margin:20px 0px 10px 0px;
						}
						#notify-moderator{
							display: block;
							margin:20px 0px 0px 0px;
						}
						#notification-requested{
							color: @fixed-accent-color;
							font-style: italic;
						}
						#export-requested{
							display: none;
							margin:5px 0px;
						}
						#file-to-download{
							a{
								color: @fixed-accent-color;
								font-style: italic;
								margin-left: 5px;
							}
						}
						#privacy-tab-delete-your-data{
							margin-top: 30px;
						}

						#privacy-tab-correct-your-data{
							margin-top: 30px;
						}


					}
				}
			}
		}
		
	}
	
}
#delete-confirm-modal{
	.modal-footer{
		#cancel-confirm-delete-data{
			color: #333 !important;
		}
	}
}


#sidenav-overlay{
	z-index: 1031;
}
#mobile-slide-out{
	right: 0;
	z-index: 1032;
	left: auto;
    background-color: #fff;
	@media @extra-large{
		transform: translateX(100%) !important;
	}
	
	.md-pills{
			.nav-link{
				text-align: left;
				line-height: 40px;
				&.active{
					background-color: transparent;
					color: #333;
					font-weight: 500;
					box-shadow: none;
				}
			}
		} 
}
