/* scss */

// SCSS for custompublish 2017
// EE & CB

////
/// #PROJECT SPECIFIC SETTINGS
////


// Override the default settings here.
// -- default settings found at: http://www.custompublish.com/cpclass/css/scss-imports/v6.4.3/scss/settings/_settings.scss


$header-styles: (
  small: (
    'h1': ('font-size': 24),
    'h2': ('font-size': 20),
    'h3': ('font-size': 19),
    'h4': ('font-size': 18),
    'h5': ('font-size': 17),
    'h6': ('font-size': 16),
  ),
  medium: (
    'h1': ('font-size': 24),
    'h2': ('font-size': 20),
    'h3': ('font-size': 19),
    'h4': ('font-size': 18),
    'h5': ('font-size': 17),
    'h6': ('font-size': 16),
  ),
);

$button-margin: 0.4rem 0 0.5rem;

$foundation-palette: (
  primary: #2F5191,
  secondary: #767676,
  success: #3adb76,
  warning: #ffae00,
  alert: #cc4b37,
);

$body-font-family: 'roboto', sans-serif;

////
/// #INCLUDES & IMPORTS
////

@import "/home/www/publish/cpclass/css/scss-imports/foundation/v6.6.0/scss/foundation";
@include foundation-everything;
$fi-path: "/cpclass/css/scss-imports/v6.4.3/scss/icon-fonts/foundation-icon-fonts";
@import "/home/www/publish/cpclass/css/scss-imports/v6.4.3/scss/icon-fonts/foundation-icon-fonts/foundation-icons";
@import "/home/www/publish/cpclass/css/scss-imports/v6.4.3/scss/cpsass/cpsass";



/// #CSS ANIMATIONS (animate.css)
// --	set variables i.e. $use-<animation name> to 'true' to
// --	load animation.css styles from _animate.scss
@import "/home/www/publish/cpclass/css/scss-imports/animate-sass/animate";



/// #CUSTOMPUBLISH SPECIFIC
@import "/home/www/publish/cpclass/css/scss-imports/cpplugins/cpplugins";
// @import "/home/www/publish/cpclass/run/cpshop4/css/shop4";





////
/// #BASICS
////

// handle old clearfixes
.clearfix,
.cpsoptionsclear,
.cpsclear {
	clear: both;
	font-size: 1px;
	height: 0;
}
// Adjust font size for jQuery-ui widgets
.ui-widget {
	font-size: $small-font-size !important;
}
// add nested submenu styles
.submenu {
	@include menu-nested;

}

.is-accordion-submenu{
	margin-right: 1rem;
    margin-left: 1rem;
    margin-bottom: 1rem;
}


#page {
	background-color: $white;
}

#content {
	#main {
		@include breakpoint(medium) {
			min-height: 500px;
		}
	}
}

#content {
	margin-bottom: 2rem;
}

table[class],
table[id] {

	tr:nth-child(even) {
		background-color: transparent;
	}

	tbody {
		border: 0;
		background-color: transparent;
	}
}

input[type="submit"] {
	@include button;
}

input[type="file"] {
	width: auto;
}

/// SITE HEADER
#header {

	margin-bottom:2rem;

	.top-bar {
		@include top-bar-unstack;
		background-image: url("/getfile.php/4730054.1046.pjiwwwpjbnzilk/headerbg.png");
		background-size: cover;
		background-position:center center;
		padding:1rem;

		ul {
			background-color: transparent;
		}
	}

	.logo {
		img {
max-height:52px;
		}
	}

	.main-navigation {
		@include breakpoint(medium) {
			display: inline-block;
		}
	}

	.accessibility {
		display: none;

		@include breakpoint(medium) {
			display: inline-block;
			padding-right: 1.5rem;
		}
	}

	.mobilemenubutton {
		margin-bottom: 0;
		margin-top: 0px;
		font-size: 16px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: transparent;
    	border-radius: 10px;
		padding: 10px;
		transition: all .2s ease;
		i{
			margin-left:10px;
		}

		&:hover{
			background: rgba(0, 0, 0, 30%);
		}
	}
}



/// PATH
#path {
	margin: 0 0 1rem 0;

	.pathinner {
		padding: 0.5rem 0;
	}

	a,
	.pathdelimiter {
		color: $secondary-color;
		font-size: 0.75rem;
	}

	.pathdelimiter {
		color: $secondary-color;
		margin: 0 0.75rem;
		display: inline-block;
		position: relative;
		top: 1px;
		opacity: 1;
	}

	a {
		text-decoration: none;

		&:last-of-type {
			color: $black;
			font-weight: $global-weight-bold;
		}

		&:hover {
			text-decoration: underline;
		}
	}
}

/// ARTICLE LIST
.articlelist {

	.articleblock {
		margin-bottom: $global-margin;
		box-shadow: 0 0 7px #cacaca;

		

	.zoom-box{
		overflow:hidden;
		background: #d1d1d1;
	
		.listingpicimg{
			transform: scale(1.0);
			transition: all 0.5s ease;
	
			&:hover{
				transform: scale(1.05);
			}
	
		}
	}


		header {
			display: inline-block;
			vertical-align: top;
			padding:1rem;

			time {
				font-size: $small-font-size;
				color: $dark-gray;
			}
		}

		&.nolistingpic {

			header {

				@include breakpoint(medium) {
					padding-left: 0;
					width: 100%;
				}
			}
		}
	}

	.pagebar,
	.virtualpaging {
		text-align: center;

		.activevirtualpagelink {
			color: $primary-color;
		}
	}

	&.grid {

		.articleblock {
			display: inline-block;
			margin-right: -4px;
			padding: 0 0.75rem;

			header {
				padding: 0.25rem 0 0 0;
			}

			@include breakpoint(medium) {
				width: 33%;
			}

			@include breakpoint(large) {
				width: 25%;
			}
		}
	}
}

/// ARTICLE VIEW
.article-image {
	position: relative;
	margin:0 auto;

	img {
		margin-bottom: $global-margin;
	}

	.image-description {
		font-style: italic;
		font-size: $small-font-size;
		position: absolute;
		bottom: 1.5rem;
		left: .5rem;
		padding: .3rem .5rem;
		background: #0000006b;
		color: white;
		border-radius: .3rem;
	}
}

.viewarea {

	.headlineview{
		font-weight: bold;

	}

	.author{
		color:#4B4B4B;
		font-size:.9em;
		a{
			color:#4B4B4B;
		}
		.published{
			margin-left:.5rem;
		}
	}

	.ingressview {
		font-size: 125%;
		line-height: 1.6;

		.cpeditlinks {

			a {

				&:hover {
					color: $primary-color;
				}
			}

			i {
				vertical-align: top;
			}
		}
	}

	@include breakpoint(medium) {
		padding: 0;
	}
}

.tools {
	margin-bottom: $global-margin;

	a {
		height: 17px;
		width: 17px;
		margin-right: 3px;
		display: inline-block;
	}
}

.paragraphpictable {
	width: 100%;
	height: auto;
	display: block;
	margin-bottom: $global-margin;

	.body {
		padding: 0;

		img {
			margin: 0;
		}
	}

	.paragraphpictext {
		font-size: 0.9em;
		color: #606060;
		padding: 0.5rem 0;
		font-style: italic;
	}

	@include breakpoint(medium) {
		width: auto;
		margin-bottom: 0;
		float: right;
		padding: 1rem 0 1rem 1rem;
	}
}

.articlebody {

	img {

		margin-bottom: $global-margin;

		&[align="left"],
		&[style*="float: left;"] {
			margin-right: $global-margin;
		}

		&[align="right"],
		&[style*="float: right;"] {
			margin-left: $global-margin;
		}
	}
}

.articlemeta {
	font-size: $small-font-size;
	margin: $global-margin 0;
	color: $dark-gray;
}


.articlemediaimages {
	@include xy-grid;

	.articleimage {
		@include xy-cell(6);

		img {
			@include thumbnail;
		}

		@include breakpoint(medium) {
			@include xy-cell(4);
		}

		@include breakpoint(large) {
			@include xy-cell(2);
		}
	}
}

.forumwrapper {

	.cpforumtoogleform {
		margin-bottom: $global-margin;
		display: inline-block;
	}

	form.cpsimpleform {
		margin: 0;
		padding: 0;
		background-color: transparent;
		border: 0;

		[type="submit"] {
			@include button;
		}
	}

	fieldset {
		margin: 0 0 $global-margin 0;

		.mandatory {
			line-height: 0;
		}

		.cpselementcontainer {
			margin-bottom: $global-margin;
		}

		.cpselementcontainercpfname {

			input[type="text"]:not([size]) {
				width: 98%;
			}
		}

		.cpselementcontainercpfreplyto {
			display: none;
		}
	}
}

.cpforum {

	.forumpost {
		padding: 0 !important;
		background-color: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;

		@include breakpoint(medium) {
			margin-top: 2rem;
		}
	}

	.subject {
		font-size: 1.2em;
	}

	.postingdate {
		color: #767676;
		font-style: italic;
		margin-bottom: 1rem;
	}

	.postinglevel0 {

		> li {
			margin: 0 0 2rem 0;
			padding: 1rem;
			background-color: #f9f9f9;
			border: 1px solid $light-gray;
			border-radius: $global-radius;

			.posting {
				border-left: 3px solid #e9e9e9;
				margin-top: 1rem;
			}

			@include breakpoint(medium) {
				padding: 0 3rem 1rem 3rem;
			}
		}
	}
}




.articleparagraphdynamic {
	background: #fefefe;
	border: 1px solid $light-gray;
	border-radius: 0;

	.paragraphheadline {
		display: block;
		padding: 1.25rem 1rem;
		line-height: 1;
		font-size: 1rem;
		color: $black;
		position: relative;
		border-bottom: 1px solid $light-gray;
		margin-bottom: 0;
		transition: all 0.2s ease-out;

		&:hover,
		&:focus {
			background-color: $light-gray;
			cursor: pointer;
		}

		&::before {
			content: '+';
			position: absolute;
			right: 1rem;
			top: 50%;
			margin-top: -0.5rem;
		}
	}

	.paragraphtext {
		padding: 1.25rem 1rem;
		display: none;
		border-bottom: 1px solid $light-gray;
	}

	&.is-active {
		background: $white;

		.paragraphheadline {

			&::before {
				content: '-';
			}
		}

		.paragraphtext {
			display: block
		}
	}

	&:not(:last-of-type),
	.paragraphtext {
		border-bottom: 0;
	}

	&:last-child {
		margin-bottom: 1rem;
	}
}

/// FOOTER
#footer {
	padding-top: 1rem;
	background-color: $primary-color;
	color:white;

	.footercontent{
		padding-bottom:1rem;
	}

	a{
		color:white;
	}


	address {
		font-style: normal;
	}

	.cpcredits {
		text-align:center;
		background-color: #1C315A;
		font-size: $small-font-size;
		text-decoration: none;
		padding:.5rem;
		a {
			color: #5E7196;

			&:hover {
				color: $white;
			}
		}
	}

	#copyright {
		font-size: $small-font-size;
	}

	.siteinfo {

		margin-top:1rem;

		@include breakpoint(medium) {
			margin-top:0rem;
			text-align: right;
		}
	}
}

/// MISC

.errmsg {
	padding: 0.5em;
	border: 1px solid $alert-color;
	font-weight: bold;
	color: $alert-color;
	background: #FFD9D9;
}

.monthlycalendartable {
	width: 100%;
}

.calendarcontainer {
	margin: 2rem 0;

	.dayheader {
		padding-top: 2rem;
		text-align: left;
		font-weight: $global-weight-normal;
		font-size: 1.1rem;
		border-bottom: 1px solid $light-gray;
	}

	.caltime {
		text-align: right;
		padding-right: 0.5rem;
	}

	.calcat {
		font-size: $small-font-size;
		color: $dark-gray;
	}

	.vevent {
		padding: 1rem;
		border: 1px solid $medium-gray;
		background-color: #f9f9f9;

		h2 {
			font-size: 1.1rem;
			font-weight: $global-weight-bold;
		}

		.dtstart {
			font-size: $small-font-size;
		}
	}
}




.articlecalendarwrapper {

	h5.caldayheader {
		margin: 0.5em 0;
		padding: 0.5em;
		font-weight: 300;
		border-top: 1px solid $medium-gray;
		background: #fafafa;
	}

	.calevent {
		padding: 0 0 0.5em 1em;

		.caleventtime,
		.caleventwhat,
		.caleventcat,
		.caleventicallink {
			display: inline-block;
			margin-right: -4px;
		}

		.caleventtime {
			width: 25%;
		}

		.caleventwhat {
			width: 50%;
		}

		.caleventcat {
			width: 15%;
		}

		.caleventicallink {
			width: 10%;
		}
	}
}



.calendarlistblockver3 {

	.caleventdisplay {
		margin: 0 0 1rem 0;
		padding: 0.5rem;
		border: 1px solid #ccc;
		border-radius: 4px;
		background-color: #fff;
	}

	.calendarwhenwrap,
	.calendarwhatwrap {
		display: inline-block;
		vertical-align: top;
		margin-right: -4px;
	}

	.calendarwhenwrap {
		width: 28%;
		text-align: center;
		padding-right: 1rem;

		@include breakpoint(medium) {
			width: 20%;
		}

		@include breakpoint(large) {
			width: 15%;
		}
	}

	.calendarwhatwrap {
		width: 72%;

		.caleventdescription {
			display: none;
			padding-left: 1rem;
			border-left: 1px solid #ccc;
		}

		@include breakpoint(medium) {
			width: 80%;
			margin-right: -4px;
		}
	}

	.calendardatedaynum {
		font-size: 2.8rem;
		line-height: 1;
		display: block;
	}

	.calendardatedaymonth {
		display: block;
	}

	.caleventsummary{
		font-size: 1.1875rem;

		a {
			text-decoration: none;

			&:hover {
				text-decoration: underline
			}
		}

		@include breakpoint(medium) {
			font-size: 1.6375rem;
		}
	}

	.caleventtmeta {

		> div,
		> time {
			padding-left: 1.5em;
			background-repeat: no-repeat;
			background-position: 0 50%;

			@include breakpoint(medium) {
				display: inline-block;
				min-width: 50%;
				margin-right: -4px;
				vertical-align: top;
			}
		}

		.caleventlocation {
			background-image: url(../images/location.png);
		}

		time {
			background-image: url(../images/clock.png);
		}

		.caleventcategory,
		.caleventorganization,
		.caleventemail,
		.caleventweekno {
			display: none
		}
	}
}

/// PAGE TYPE (page settings)
body {

	#content {
		@include xy-grid;

		.subpagemenu {
			@include xy-cell();
			@include breakpoint(medium) {
				@include xy-cell(3);
			}
		}

		.main {
			@include xy-cell();
			@include breakpoint(medium) {
				@include xy-cell(auto);
			}
		}

		#mainsidebar {
			@include xy-cell();
			@include breakpoint(medium) {
				@include xy-cell(3);
			}
		}
	}

	&.widemain,
	&.pluginworkspace,
	&.checkoutpage {

		#mainsidebar {
			display: none;
		}
	}

	&.widefull {

		#mainsidebar,
		.subpagemenu {
			display: none;
		}

	}
}


.nostyle {
	list-style: none;
	margin: 0;
	padding: 0;
}

.scaletext {

	.small  { font-size: $small-font-size; }
	.large  { font-size: $lead-font-size; }
}

#colorbox:focus {
	outline: 0;
}

#cboxOverlay {
	background: #000 !important;
}



#main {
	#mngogosearchform {

		table {
			display: block;
			width: 100%;
			text-align: left;
			padding: 0;

			tr {
				background-color: transparent;

				td {
					// display: block;
					// width: 100%;
					text-align: left;
					padding: 0 0.5rem 0 0;
				}

				&:nth-of-type(even) {
					background-color: transparent;

					&:hover {
						background-color: transparent;
					}
				}

				&:first-of-type {

					td {
						padding-bottom: 1rem;
					}
				}

				&:not(:first-of-type) {
					font-size: 0.813rem;

					td {
						padding-bottom: 0.5rem;
					}

					select {
						font-size: 0.813rem;
						margin: 0;
					}
				}
			}
		}
	}
}

.solrsearch {

	.ingress{
		padding-left: 0;

		@include breakpoint(medium) {
			padding-left: 1rem;
		}
	}
}





.articlearchive {

	.artarchiveweekhead {
		border-bottom: 1px solid #ccc;
		padding-bottom: 0.25em;
		margin-bottom: 0.25em;
		margin-top: 2em;
	}

	.artarchivedate {
		float: none;
		width: auto;
		display: inline-block;
		vertical-align: top;

		@include breakpoint(medium) {
			width: 25%;
			float: left;
			padding-right: 1em;
			text-align: right;
		}
	}

	.artarchiveupdated {
		display: none;

		@include breakpoint(medium) {
			font-size: 0.75em;
			display: block;
		}
	}

	.artarchivetitle{
		float: none;
		width: auto;
		display: inline-block;

		@include breakpoint(medium) {
			width: 75%;
			float: left;
		}
	}
}




.checkoutpage {

	#main {

		> h1 {
			text-align: center;
		}
	}
}



.shop4cartlink {
	text-align: center;
	display: inline-block;
	padding-bottom: 0.5rem;

	.carticon {
		position: relative;
		display: inline-block;
	}

	.fi-shopping-cart {
		font-size: 2rem;
		color: $black;
		display: block;
	}

	.numincart {
		position: absolute;
		bottom: 0;
		right: -0.5rem;
	}

	.cartamount {
		display: block;
		color: $black;
		font-size: $small-font-size;
	}
}

#checkouttablecontainer {
	max-width: 65em;
	margin: 1rem auto;

	.checkouttable {
		margin: 1rem 0 0 0;
		width: 100%;
		max-width: 100%;

		td,
		th {
			@include breakpoint(medium) {
				padding: 1rem;
			}
		}

		th {
			font-size: 0.8em;
			padding: 0.5rem 0.3rem;
			font-weight: 500;
			border-bottom: 2px solid #333;
			border-bottom: 2px solid rgba(0, 0, 0, 0.5);
			background-color: #FDE3A7;
			text-align: left;
		}

		th[align="right"]{
			text-align: right;

			@include breakpoint(medium) {
				width: 100px;
			}
		}

		td {
			padding: 1rem 0;
		}

		.cartrow {
			border-bottom: 1px solid #ccc;
			font-size: 0.813em;

			@include breakpoint(medium) {
				font-size: 1rem;
			}
		}

		input.productquantity {
			height: auto;
			padding: 0;
			text-align: center;
		}

		.checkoutcouponrow {
			font-size: $small-font-size;

			td {
				padding: 1rem 0;
			}

			input {

				&[type="submit"] {
					vertical-align: middle;
					margin: 0;
				}

				&[name="couponcode"]{
					display: inline-block;
					vertical-align: middle;
				}
			}
		}

		td.shopremovetd {
			min-width: 22px;
			max-width: 25px;

			@include breakpoint(medium) {
				width: auto;
				padding: 0 0 0 1rem;
			}
		}

		td.quantitytd {
			min-width: 40px;
			max-width: 40px;
		}

		.productnotd {
			font-size: $small-font-size;
		}

		.thcheckoutprice {
			min-width: 100px;
		}

		.thcheckoutproductno,
		.productnotd,
		.thcheckoutpriceex,
		.priceexvattd {
			display: none;

			@include breakpoint(medium) {
				display: table-cell;
			}
		}
	}

	.carttotaltable {
		margin: 0 0 1rem 0;

		.carttotalrow,
		.checkoutvatrow {

			td {
				padding: 0 1rem;
				background-color: #E4F1FE;
			}
		}

		.carttotalrow {
			padding-top: 1rem;
			font-weight: 600;
		}

		.checkoutvatrow{
			font-size: 0.813em;
		}

		.checkoutvatrow2 {

			td{
				padding-bottom: 1rem;
			}
		}
	}
}




#checkoutcustomerdetails {

	.cpselementcontainer {
		margin-bottom: 0;

		&.cpselementcontainerfirstname,
		&.cpselementcontainerlastname,
		&.cpselementcontaineraddress,
		&.cpselementcontaineraddress2,
		&.cpselementcontainerzipcode,
		&.cpselementcontainercity,
		&.cpselementcontaineremail,
		&.cpselementcontaineremail2 {
			float: left;
			width: 50%;
		}

		&.cpselementcontainerzipcode {
			width: 10%;
			min-width: 80px;
		}

		&.cpselementcontainercity {
			width: 32%;
		}

		&.cpselementcontainerzipcode input {
			max-width: 4em;
		}
	}
}


table.editmyinfo {
	td {
		padding: 0;
	}
}

ul.editmyinfomenu{
	list-style: none;
	margin: 0;

	> li {
		display: inline-block;
		margin-right: 1em;

		> a {
			@include button;
			display: block;
		}
	}
}



.howtoscaletext {
	background-color: #FFFFDD;
	border: 1px solid #999999;
	box-shadow: 0 0 10px #999999;
	color: #333333;
	display: none;
	font-size: 1.4em;
	margin-left: auto;
	margin-right: auto;
	padding: 10px 50px 10px 10px;
	position: absolute;
	top: 10px;
	min-width: 30em;
	max-width: 100%;
	z-index: 10000;

	.close {
		background-color: #FFF;
		background-image: none;
		border: 2px solid #333;
		border-radius: 5px;
		box-shadow: 0 0 3px #999999;
		color: #333;
		display: inline-block;
		font-weight: bold;
		line-height: 1.0em;
		margin: 0;
		padding: 3px;
		position: absolute;
		right: 5px;
		text-shadow: none;
		top: 7px;

		&:hover,
		&:focus {
			background-color: #DDDDDD;
			border-color: #000000;
			color: #000;
			cursor: pointer;
			margin: 0;
		}
	}
}

/// PRINT STYLE
@media print {

	#header, #topnav, #navigation, #subnavbar, #mainsidebar, #footer, #cp, #searchform, .corner, #taleweb, #talewebholder, #PAFTOOLBAR, #skiplink, .skiplink, .adminbar, .cpeditlinks {
		display: none !important;
	}

}


.off-canvas{
    background-color: #0c7ec2;
    width: 100%;
	max-width: 300px;
  
	
	.searchform{

		display: flex;
    	justify-content: center;
    	align-items: center;
    	margin: 1rem;

		.searchinput{
			width:100%;

		}
		.searchsubmit{
			margin:0px;
		}
	}

	nav{
		ul{
			li{
				a{
					color: white;
    				border-top: 1px solid rgba(255, 255, 255, 0.25);
    				padding: 1rem;
    				line-height: 1.3;
				}
			}

			.itemselected{
				background-color: #085278;
				ul{
					li{
						padding-left:2rem;
					}
				}
			}
		}
	}
}


/* width */
.off-canvas::-webkit-scrollbar {
	width: 10px;
}
	
	/* Track */
.off-canvas::-webkit-scrollbar-track {
	background: #0c7ec2;
}
	
	/* Handle */
.off-canvas::-webkit-scrollbar-thumb {
	background: #ffffff;
}
	
	/* Handle on hover */
.off-canvas::-webkit-scrollbar-thumb:hover {
	background: #f6f9ff;
}




.headlinelink{
	font-weight: 700;
	color:black;
	font-size:1.1em;
	line-height: 1.2;
}

.thicc{
	.headlinelink{
		font-size:1.3em !important;
	}
}

.horseshoecontainer{

	position: relative;
	padding:0px;

	.horseshoebanner{

	}

	.hsleft{
		display: flex;
    	flex-direction: column;
    	position: absolute;
    	top: 0px;
    	left: -300px;
    	width: 300px;
		align-items: flex-end;
		height: 100%;
	}
	.hsright{
		display: flex;
    	flex-direction: column;
    	position: absolute;
    	top: 0px;
    	right: -300px;
    	width: 300px;
    	align-items: flex-start;
    	height: 100%;
	}
	.hstop{
		display: flex;
  		flex-direction: column;
    	position: relative;
	}
}

.headlinebanner{
	background-image: url("/getfile.php/4730054.1046.pjiwwwpjbnzilk/headerbg.png");
	background-size: cover;
	background-position:center center;
	font-size:1.3em;
	color:white;
	font-weight: 600;
	padding:1rem;
	width:100%;
	font-style: italic;
}

.livesportscontent{
	padding:1rem;
}

.boxme{
	box-shadow: 0 0 7px #cacaca;
	flex: 0 0 auto;
    display: block;
    margin-bottom: 1rem;
}

.liveSports{
	transition: all .2s ease;
	opacity: 1;
	width:100%;
	&:hover{
		opacity: 75%;
	}
	
}

.padded{
	padding:1rem;
}
.flexcenter{
	display: flex;
	justify-items: center;
	align-items: center;
	flex-wrap: wrap;
	flex-direction: column;
}

.blockAds{
	a{
		padding:.8rem;
	}
}

.submenu{
	margin-left:0rem;
}

.mobilemenuviewwrapper{
	border:1px solid black;
	a{
		color:black;
	}
}

.pagebar{
	width:100%;
	margin:1rem 0rem;
	text-align:center;

	a{
		padding:.5rem;
		border:1px solid $primary-color;
		color:$primary-color;
		margin:.5rem;
		transition:all .2s ease;
		&:hover{
			padding:.5rem .7rem;
			background-color:#f1f1ff;
		}
	}

}