/*less / css for cms pages*/


.cms-page-view {
	
	.column.main > div > h1 {
		color: #FFF;
        margin-bottom: 1rem;		
	}
	
	.cms-image-header {
		box-sizing: border-box;
		padding: 0;
		box-shadow: 0px 7px 14px hsl(0deg 0% 0% / 25%);
		background-color: var(--ram-drkblue);
		line-height: 2.2rem;
		color: #FFF;
		padding-right: 50%;
		background-repeat: no-repeat;
		background-position: right;
		background-size: contain;

		div {
			background-color: var(--ram-drkblue);
			color: #FFF;
			padding: 3rem;

			ul {
				margin: 1rem 0;
			}

			li {
				margin: 0;
			}

		}

		img {
				display: none;
		}


	}
}
.cms-page-view:not(.cms-moldmakers) .column.main, .contact-index-index .column.main {
	background-color: var(--theme-color-background);
	padding: 4rem 2rem;
}

/* account */

.login-container, .block-dashboard-info, .block-dashboard-addresses, .block-addresses-default, .block-addresses-list, .account .columns form {
	background: var(--theme-color-background);
    padding: 2rem;
}

.sidebar-main {
	margin-top: 2rem;
	
	.block-collapsible-nav .item.current a, .block-collapsible-nav .item.current > strong {
    	border-color: var(--ram-blue);
	}
}

.account-section__title-label {
	color: #FFF;
    margin-top: 12px;
    margin-bottom: 24px;
}

.account .box-actions a {
	color: #FFF;
    font-size: 105%;
    font-weight: 400;
    background: var(--ram-blue);
    padding: .25rem 1rem;
    display: inline-block;
    margin: 1rem;
    border: solid 1px var(--ram-blue);
	transition: all 250ms linear;
}
.account .box-actions a:hover {
	color: var(--ram-blue);
	background: #FFF;
}

/*about page*/

/*cms page Terms & Policies*/

/*locations page*/

.category-locations, .cms-location {
	
	.category-view {
		display: none;
	}

	.category-cms > div > h1 {
		color: #FFF;
		margin-bottom: 1rem;
	}
}

.cms-image-header {
	box-sizing: border-box;
    padding: 0;
    box-shadow: 0px 7px 14px hsl(0deg 0% 0% / 25%);
    background-color: var(--ram-drkblue);
	line-height: 2.2rem;
    color: #FFF;
    padding-right: 50%;
    background-image: url(../images/locations_map.jpg);
	background-repeat: no-repeat;
	background-position: right;
    background-size: contain;
	
	div {
		background-color: var(--ram-drkblue);
	    color: #FFF;
    	padding: 3rem;
		
		ul {
			margin: 1rem 0;
		}
		
		li {
			margin: 0;
		}
		
		.holiday {
			font-style: italic;
		}
		.holiday::before {
			content: '';
			display: inline-block;
			position: relative;
			width: 36px;
			height: 24px;
			background-image: url(../images/icon_calendar.svg);
			background-repeat: no-repeat;
			top: 3px;
		}
	}
		
	img {
			display: none;
	}


}

.category-locations, .cms-location {
	
	.location {
		background-color: var(--theme-color-background);
		display: block;
		position: relative;
		margin-top: 2rem;
		border-top: solid 4px var(--ram-drkblue);
		z-index: 0;
		
		h2 {
			font-family: "Roboto Slab";
			font-weight: 200;
			font-size: 2.6rem;
			line-height: 2.0rem;
			display: block;
			background-color: var(--ram-drkblue);
			color: #fff;
			padding: 0.75em;
			margin: 0;
			width: fit-content;
			box-sizing: border-box;
			margin-right: 50px;
			padding-right: 56px;
			margin-bottom: 10px;
		}
		h2:after {
			content: '';
			display: inline-block;
			height: 0;
			position: absolute;
			top: 0;
			width: 0;
			z-index: 1;
			border-top: 59px solid transparent;
			border-right: 56px solid var(--theme-color-background);
		}
		
		.notice {
			display: none;
			
			p {
				font-size: 2rem;
				line-height: 2.5rem;
                font-weight: 500;
                padding: 1rem 2rem;
			}
			
			p::before {
				content: '';
				display: inline-block;
				position: relative;
				width: 32px;
				height: 32px;
				background: url(../images/icon_red_alert.svg) no-repeat;
				top: 8px;
				left: -8px;
			}
		}
		
		.location-info {
			display: flex;
			position: relative;
			flex-direction: row;
			flex-wrap: nowrap;
			align-items: stretch;
			justify-content: space-between;
			
			article {
				box-shadow: 12px 12px 12px #bfbfbf;
    			padding: 0;
			}
			article:first-child {
				padding: 2rem;
				width: 25%;
				box-sizing: border-box;
				background: #FFF;
				
				address {
					margin-bottom: 1rem;
				}
				
				a.linecard::before {
					content: '';
					display: inline-block;
					position: relative;
					width: 28px;
					height: 28px;
					background: url(../images/icon_docs.svg) no-repeat;
					top: 8px;
					left: 0;
				}
			}
			article:nth-child(2) {
				width: 40%;
			}
			article.location-video {
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				background: var(--ram-drkblue);
				color: #FFF;
				text-align: center;
				width: 32%;
				
				img {
					width: 100%;
				}
				
				iframe {
					display: block;
					width: 100%;
    				aspect-ratio: 16 / 9;;
					
				}
				
				p {
					padding: 1rem;
				}
			}
		}
	}
}

/* search results page */

.catalogsearch-result-index, .cms-holiday {
	
	.message.notice {
		background: #FFF;
		color: var(--ram-drkblue);
		font-size: 1.6rem;
		line-height: 2rem;
		padding: 3rem 4rem;
	}
	
	.message.notice > *:first-child:before {
		color: var(--ram-blue);
		top: 4rem;
		font-size: 4rem;
	}

	.page-title:before {
		display: inline-block;
        content: '\e615';
        font-family: 'icons-blank-theme';
        position: relative;
        font-size: 6rem;
        top: 15px;
        color: var(--theme-color-border-dark);
	}

	.mst-search__result-index {
		background: var(--theme-color-background);
		padding: 0;
	}

	.mst-search__result-index-title, .holiday div {
		padding: 0!important;
		border-top: solid 4px var(--ram-drkblue);
		border-radius: 0;
	}
	.mst-search__result-index-title h2, .holiday div h2{
        font-family: "Roboto Slab";
        font-weight: 200;
        font-size: 2.6rem;
        line-height: 2.0rem;
        background-color: var(--ram-drkblue);
        color: #fff;
        padding-left: .75em;
        margin: 0;
        width: fit-content;
		height: 6rem;
        box-sizing: border-box;
        margin-right: 50px;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
	}

	.mst-search__result-index-title h2:after, .holiday div h2:after {
		content: '';
        display: inline-block;
        height: 0;
        position: relative;
        top: 0;
        width: 0;
        z-index: 1;
        border-top: 60px solid transparent;
        border-right: 56px solid var(--theme-color-background);
	}

	.mst-search__list {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding-bottom: 3em;
		margin: 0 auto;
		width: 96%;

		li {
			margin: 2rem 0;
			width: 48%;
			margin: 1px;
			box-sizing: border-box;
			padding: 0 2rem;

			h3 {
				display: block;
				position: relative;
				box-sizing: border-box;
				line-height: 200%;
				width: calc(100% + 4rem);
				color: var(--ram-drkblue);
				transition: all 150ms ease-in;
				margin: 0;
				font-size: 2rem;
				font-weight: 500;
				margin-left: -2rem;
				padding: 0 3rem;

				a {
					display: inline-block;
					width: 100%;
				}
				a:before {
					content: "\203A";
					position: absolute;
					left: 10px;
					top: 5px;
					font-size: 200%;
					font-weight: 600;
					line-height: 50%;
				}
			}
			h3:hover {
				background: var(--ram-drkblue);
				color: #FFF;
			}

			h3:hover a:before {
				color: var(--ram-blue);
			}

			p {
				width: 96%;
				margin: 1em auto;
				margin-top: 0;
			}
		}
	}
	
	.product-items {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-content: flex-start;
		justify-content: flex-start;
		align-items: stretch;
		
		li {
			display: flex;
			min-width: 280px;
			box-shadow: 0px 7px 14px hsl(0deg 0% 0% / 25%);
			position: relative;
			background-repeat: no-repeat;
			background-position: right;
			background-size: cover;
			background-color: #FFF;
			margin-bottom: 3em;
			margin-left: 2rem!important;
			flex-direction: column;
			flex-wrap: nowrap;
			align-items: stretch;
			justify-content: flex-end;
			
			.seminar-location {
				position: absolute;
				top: 0;
				background: var(--ram-red);
				color: #FFF;
				padding: 1rem;
				width: fit-content;
				margin: -.5rem;
				margin-bottom: -4rem;
				z-index: 10;
			}
			
			.product-item-info {
				width: 100%;
				padding: 0 2rem;
				box-sizing: border-box;
				
				.product-item-name {
					font-size: 2rem;
					text-align: center;
				}
				
				.product-item-inner * {
					margin: 0;
				}
				
				.product-info {
					
					button {
						background-color: var(--ram-blue) !important;
						color: var(--theme-color-white) !important;
						border-radius: 0;
						border: none !important;
						width: calc(100% + 4rem);
						padding: 1rem !important;
						margin: 0 auto;
						display: block;
						margin-left: -2rem;
						font-size: 2rem !important;
						line-height: 2.2rem;
						transition: all .2s ease-in;
					}
					button:hover {
						background-color: #FFF !important;
                        color: var(--ram-blue) !important;
					}
				}
			}
		}
	}
	
	.mst-search__list .mst-search__index-title > a:before {
		content: "\203A";
		position: relative;
		top: 2px;
		font-size: 200%;
		font-weight: 600;
		line-height: 50%;
	}
}


/* moldmakers */


.cms-page-view {
	
	.cms-image-header {
		background-image: url(../images/moldmakers_top.jpg);
	}
	
	.moldmakerlist {
		
		div {
			background-color: var(--theme-color-background);
			display: block;
			position: relative;
			margin-top: 2rem;
			border-top: solid 4px var(--ram-drkblue);
			z-index: 0;
			
			h2 {
				font-family: "Roboto Slab";
				font-weight: 200;
				font-size: 2.6rem;
				line-height: 2.0rem;
				display: block;
				background-color: var(--ram-drkblue);
				color: #fff;
				padding: 0.75em;
				margin: 0;
				width: fit-content;
				box-sizing: border-box;
				margin-right: 50px;
				padding-right: 56px;
				margin-bottom: 10px;
			}
			h2:after {
				content: '';
				display: inline-block;
				height: 0;
				position: absolute;
				top: 0;
				width: 0;
				z-index: 1;
				border-top: 59px solid transparent;
				border-right: 56px solid var(--theme-color-background);
			}
			
			ul {
				list-style: none;
				display: flex;
				flex-wrap: wrap;
				flex-direction: row;
				justify-content: flex-start;
				align-items: stretch;
				align-content: flex-start;
				padding: 0;
				width: 98%;
				margin: 0 auto;
				
				li {
					width: 33%;
					margin: 6px 0;
					box-sizing: border-box;
					padding: 2rem;
					padding-bottom: 0;
					background: linear-gradient(90deg, #EEE, var(--theme-color-background));
				}
			}
		}
	}
}

/* seminars page */

.categorypath-seminars .cms-image-header {
	background-image: url(../images/seminar_hero.jpg);
}
/*tech support page*/

/*tech support form*/

/*newsletter signup page*/

/*catalogue*/

/*catalogue form*/

/*contact us form*/

/* holidays */

.cms-holiday {
	
	.holiday {
		h1 {color: var(--ram-drkblue); text-align: center; padding-bottom: 0; margin-bottom: 0;}

		ul {list-style: none; display: flex; padding: 0; flex-direction: column; font-size: 1.8rem;

			li {width: 100%; display: flex; justify-content: center;

				span{margin: 0 .5rem; width: 50%;}

				span:first-child{text-align: right;}
				span:first-child:after{content: ' -';}
			}
		}
	}
}

/*How-tos

Magento_Cms/layout/cms_page_view_id_knowledge

CMS page Knowledde
*/

.kb__search-box button:before {
	display: block;
    content: '\e623';
    font-family: 'icons-blank-theme';
    position: relative;
    font-size: 2em;
    width: 0;
    left: -2.2rem;
    color: var(--theme-color-border-dark);
}

.kb__category-description {
	background: var(--theme-color-background);
    padding: 2rem 3rem;
}

.kb-category__grid {
	background: var(--theme-color-background);
    padding: 2rem 3rem;
    border-top: solid 4px var(--ram-drkblue);
	
	section {
		width: 100%;
	}
}

.kb__category, .kbase-category-view {
	
	ol {
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		align-items: stretch;
		
		li {
			padding: 1rem;
			margin: 0;
			font-size: 1.5rem;
			
			a {
				padding: 1rem;
				padding-left: 2rem;
    			transition: all 150ms ease-in;
			}
			a:hover {
				background: var(--ram-drkblue);
				color: #FFF;
			}
			a:before {
				content: "\203A";
                position: relative;
                left: -3px;
                top: 1px;
                font-size: 200%;
                font-weight: 600;
                line-height: 50%;
			}
		}
		
		li:after {
			content: none;
		}
	}
}

.kbase.page-layout-2columns-right {
	
	.column.main {
		width: 76%!important;
		
		.kb__search-result, .kb-articles__list, .toolbar, .kb-article__body {
			background: var(--theme-color-background);
			padding: 3rem;
			margin: 0;
		}
		
	}
	
	.sidebar.sidebar-main {
		width: 24%;
		margin: 0;
		
		.kb__search-box {
			input {
				border-radius: 0;
    			height: 6rem;
			}
			
			button {
				border-radius: 0;
				height: 6rem;
				width: 6rem;
			}
			button:before {
				font-size: 3em;
			    left: -.7rem;
			}
		}
	}
}



/*videos style for how-tos*/

/* seminars page 
Magento_Cms/layout/cms_page_view_id_seminar-dates.xml

*/

/*documments page*/

/*404 page*/

.cms-noroute {
	
	#maincontent {
		max-width: 1440px;

		h1 {
		color: #FFF;
		margin-bottom: 1rem;
		}
	}
	.no-route {
		box-sizing: border-box;
		padding: 0;
		box-shadow: 0px 7px 14px hsl(0deg 0% 0% / 25%);
		background-color: var(--ram-drkblue);
		line-height: 2.2rem;
		color: #FFF;
		padding-right: 50%;
		background-image: url(../images/404_top.jpg);
		background-repeat: no-repeat;
		background-position: right;
    	background-size: contain;
		
		div {
			background-color: var(--ram-drkblue);
        	color: #FFF;
       		 padding: 3rem;
			
			h2 {
				font-size: 5rem;
				font-weight: 200;
				text-align: center;
				margin: 0;
				margin-bottom: 1rem;
			}
		}
	}
}

/*form response pages*/

/* responsive */

@media screen and (max-width:1440px) {
	
}


@media screen and (max-width: 1024px) {
	
	*, .cms-page-view {
		.cms-image-header {
			padding-right: 25%;
			background-size: cover;
		}
	}
	
	.category-locations, .cms-location {
		.location {
			.location-info {
				flex-wrap: wrap;
				
				article:first-child {
				    width: 100%;
					margin-bottom: 2rem;
					display: flex;
					flex-wrap: wrap;
					justify-content: space-between;	
					
					address, p {
						padding: 0 1rem;
					}
				}
				
				article:nth-child(2) {
					width: 66%;
				}
			}
		}
	}
}

@media screen and (max-width: 768px) {
	
	*, .cms-page-view {

		.cms-image-header {
			padding-right: 0;

			img {
				display: block;
			}
		}
		
		.moldmakerlist {
			li {
				width: 50%!important;
			}
		}
	}
	
	.category-locations, .cms-location {
		.location {
			.location-info {
				
				article:first-child {
					margin-bottom: 0;
				}
				
				article:nth-child(2) {
					width: 100%;
				}
				
				article.location-video {
					flex-direction: row;
                    align-items: center;
                    background: var(--theme-color-border-light);
                    color: var(--ram-drkblue);
                    width: 100%;
					
					img {
						max-width: 300px;
					}
					
					iframe {
						
					}

				}
			}
		}
	}
	
	.title.block-collapsible-nav-title {
	    background: var(--theme-color-background);
		padding-left: 108px;
		text-align: right;
	}
	
	.catalogsearch-result-index, .cms-holiday {
		
			.mst-search__result-index-title h2, .holiday div h2{
			width: 100%;	
		}

		.mst-search__result-index-title h2:after, .holiday div h2:after {
			display: none
		}

		.mst-search__list {

			li {
				width: 100%;
			}
		}
	}
	
	.cms-holiday {
	
		.holiday {

			ul {

				li {flex-direction: column-reverse;

					span{width: 100%; text-align: center!important;}

					span:first-child:after{content: none;}
				}
			}
		}
	}

}

@media screen and (max-width: 425px) {
	
	.cms-page-view {

		.moldmakerlist {
			
			div {
				h2 {
					width: 100%;
				}
				h2:after {
					display: none;
				}
			}
			li {
				width: 100%!important;
			}
		}
	}
	
	.category-locations, .cms-location {
		
		.location {
			
			h2 {
				font-size: 2rem;
				width: 100%;
			}
			
			h2:after {
				display: none;
			}
			
			.location-info {
				
				article:first-child {
					flex-direction: column;
				}
				
				article.location-video {
					flex-direction: column;
				}
				
			}
		}
	}
	
}