/*
Theme Name: TresM
Author: Niklas Hultström
Description: -
Version: 1
*/

/* colors
#F2F3F4
#DCDDDF
#231F20

Vänsterpil:
Unicode 2190

Högerpil:
Unicode 2192

Pil upp:
Unicode 2191

Pil ner:
Unicode 2193

Ladda-ner-pil:
Unicode 21A7
*/

html, body {
	background-color: #F2F3F4;
	font-size: 14px;
	font-family: 'SuisseBPIntl';
	line-height: 1;
}

a, a:visited, a:active, a:hover {
	text-decoration: none;
	border-bottom: 1px solid black;
	color: black;
}

a.no-border {
	border: 0 !important;
}

ul, li {
	margin: 0;
	padding: 0;
	list-style: none;
}

p {
	line-height: 1.5;
	margin: 15px 0;
	margin: 12px 0; /* line-height-bugg, måste kompensera så här för att få rätt margins */
}

p.no-margin {
	margin: 0 !important;
}

h1 {
	font-size: 24px;
	text-transform: uppercase;
	margin: 0 0 40px 0;
	margin: 0px 0 31px 0; /* line-height-bugg, måste kompensera så här för att få rätt margins */
	font-weight: normal;
}

h4.section-header {
	margin: 0 0 20px 0;
	margin: 0 0 15px 0; /* line-height-bugg, måste kompensera så här för att få rätt margins */
	text-transform: uppercase;
}

h4.header {
	margin: 0 0 40px 0;
	margin: 0 0 32px 0; /* line-height-bugg, måste kompensera så här för att få rätt margins */
}

.section {
	margin: 0 auto;
	max-width: 950px;
	overflow: hidden;
}

.col-container {
	margin: 0 -15px;
}

.col-container .col {
	float: left;
}

.col-container .col-2 {
	width: 50%;
}

.col-container .col-3 {
	width: 33.3333%;
}

.col-container .col-4 {
	width: 25%;
}

.col-container .col-5 {
	width: 20%;
}

.col-container .col > .col-content {
	margin: 0 15px;
}

.col-content .row {
	margin: 0 0 55px 0;
}

/* acf wysiwyg fix */

div.page > div.section,
.col .col-content {
	overflow: visible;
	margin: 0;
	max-width: none;
}

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

	.col-container {
		margin: 0 -7.5px;
	}

	.col-container .col > .col-content {
		margin: 0 7.5px;
	}

	.col-container .col-2,
	.col-container .col-3 {
		width: 100%;
	}

	.col-container .col-4 {
		width: 50%;
	}

	.section {
		margin: 0 20px;
	}
}

/* header */

#header {
	background-color: white;
	background-color: #D46229;
	margin-bottom: 40px;
	border-top: 8px solid #D46229;
}

.logo {
	margin: 22px 0 30px 0;
	float: left;
}

.logo a {
	display: block;
	border: 0;
}

.logo img {
	display: block;
	height: 40px;
	background-color: transparent;
}

.logo img.black {
	display: none;
}

/*.home-header .logo img.black {
	display: none;
}

.home-header .logo img.white {
	display: block;
}*/

@media screen and (max-width: 950px) {
/*	.home-header .logo img.black {
		display: block;
	}

	.home-header .logo img.white {
		display: none;
	}*/
}

@media screen and (min-width: 950px) {

	#header.home-header {
		position: relative;
		z-index: 1000;
	}
}

/* main menu */

#main-menu {
	margin: 25px 0 0 0;
	float: right;
	font-size: 16px;
}

#main-menu ul {
	display: none;
	list-style: none;
	margin: 3px 0 0 0;
	padding: 0;
	position: absolute;
}

#main-menu.active ul {
	display: block;
}

#main-menu li {
	padding: 0;
}

#main-menu li a {
	display: block;
	padding: 3px 0;
}

#main-menu .contact-menu {
	float: right;
	margin-left: 120px;
}

#main-menu a {
	border: 0;
	text-transform: uppercase;
}

#main-menu-button:after {
	content: '\2193';
}

#main-menu.active #main-menu-button:after {
	content: '\2191';
}

@media screen and (min-width: 950px) {
	#main-menu.white a {
		color: white;
	}
}

/* mobile menu */

#mobile-menu-button {
	text-align: right;
	display: block;
	border: 0;
}

#mobile-menu-button img {
	height: 20px;
	display: block;
	padding: 0;
}

#mobile-menu {
	margin: 20px 0 0 0;
	display: none;
	float: right;
}

#mobile-menu > ul {
	width: 100%;
	display: none;
	position: absolute;
	left: 0;
	top: 83px;
	background-color: #F2F3F4;
	z-index: 100;
	min-height: 100%;
	padding-top: 10px;
}

#mobile-menu.active > ul {
	display: block;
}

#mobile-menu .sub-menu {
	display: none;
	margin: 10px 0;
}

#mobile-menu .sub-menu.active {
	display: block;
}

#mobile-menu .sub-menu li {
}

#mobile-menu li {
}

#mobile-menu a {
	text-transform: uppercase;
}

#mobile-menu li a {
	padding: 10px 20px;
	display: block;
	border: 0;
}

#mobile-menu li a span {
	border-bottom: 1px solid black;
}

#mobile-menu .menu-item-has-children > a {
	border: 0;
}

#mobile-menu .menu-item-has-children > a span {
	border: 0;
}

#mobile-menu .menu-item-has-children > a:after {
	content: '\2193';
	float: right;
}

#mobile-menu .menu-item-has-children > a.active:after {
	content: '\2191';
	float: right;
}

/* header mobile */

@media screen and (max-width: 950px) {
	#header {
		margin: 0 0 20px 0;
	}

	.logo {
		margin: 20px 0 15px 0;
	}

	.logo img {
		height: 20px;
	}

	#mobile-menu {
		display: block;
	}

	#main-menu {
		display: none;
	}
}


/* news */

#news {
	margin-bottom: 60px;
}

.carousel.news,
.carousel.news li {
	height: 215px;
	background: none;
}

#mobile-news {
	margin-bottom: 60px;
	display: none;
}

#mobile-news img {
	width: 100%;
	height: auto;
}

#mobile-news h4.header {
	margin: 12px 0;
}

#mobile-news .news-item {
	margin-bottom: 30px;
}

#mobile-news .news-item .content {
	display: none;
}

#mobile-news .news-item.active .content {
	display: block;
}

#mobile-news .news-item a.read-more-news:after {
	content: '\2193';
}

#mobile-news .news-item.active a.read-more-news:after  {
	content: '\2191';
}

@media screen and (max-width: 950px) {
	#news {
		display: none;
	}

	#mobile-news {
		display: block;
	}
}

/* instagram feed */

#instagram-feed {
	margin-bottom: 45px;
}

#instagram-feed .col-content {
	background-color: #DCDDDF;
	height: 215px;
}

#instagram-feed .col-content img {
	width: 100%;
	display: block;
}

#instagram-feed .social-media-icon {
	height: 10px;
}

#sbi_images {
	margin: 0 -7.5px !important;
	float: none !important;
	width: auto !important;
}

#sbi_load {
	display: none;
}

#instagram-feed .sbi_photo_wrap {
	margin: 0 7.5px;
	margin-bottom: 15px;
}

#instagram-feed .sbi_photo_wrap a.sbi_photo {
	border: 0;
	opacity: 1 !important;
}

@media screen and (max-width: 950px) {
	#instagram-feed {
		margin-bottom: 15px;
	}

	#instagram-feed .col-content {
		height: auto;
		margin-bottom: 15px;
	}

	#instagram-feed #sb_instagram #sbi_images .sbi_item {
		width: 50% !important;
	}

	#instagram-feed .sbi_photo_wrap a.sbi_photo {
		margin-bottom: 15px;
	}
}

/* collection */

#collection-header {
	margin: 0 0 60px 0;
	overflow: hidden;
}

#collection-overview {
	margin: 0 0 20px 0;
}

#collection-overview .col a.image.ratio-16-9 {
	padding-bottom: 56.25%;
}

#collection-overview .col a.image.ratio-4-3 {
	padding-bottom: 75%;
}

#collection-overview .col a.image.ratio-3-4 {
	padding-bottom: 133.33%;
}

#collection-overview .col a.image.ratio-9-16 {
	padding-bottom: 177.77777778%;
}

#collection-overview .col a.image.ratio-2-4 {
	padding-bottom: 200%;
}

#collection-overview .col a.image.ratio-4-2 {
	padding-bottom: 50%;
}

#collection-overview .col a.image {
	display: block;
	/* height: 260px; */
	background-color: black;
	background-size: 100% auto;
  background-position: center center;
  background-repeat: no-repeat;
  padding-bottom: 56.25%;
}

#collection-overview .col-3 a.image {
	/* height: 167px; */
}

#collection-overview .col img {
	background-color: black;
	/* height: 260px; */
	width: 100%;
	display: block;
}

#collection-overview .col-3 img {
	height: 167px;
}

#collection-overview .info {
	margin: 17px 0 40px 0;
}

#collection-details {
}

#collection-details .collection-item-detail {
	margin: 0 0 45px 0;
}

.collection-item-detail .info {
	margin: -40px 0 0 0;
}

.collection-item-detail.single .info {
	margin: -40px 0 15px 0;
}

#press-images-verification-cover {
	display: none;
	position: fixed;
	top: 0; left: 0; bottom: 0; right: 0;
	background: none;
	z-index: 2;
}

#press-images-verification-cover.active {
	display: block;
}

#press-images-verification {
	z-index: 2;
	position: fixed;
	width: 225px;
	top: 50%;
	left: 50%;
	margin-left: -122.5px;
	background-color: #F2F3F4;
	border: 1px solid black;
	padding: 0 10px 10px 10px;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#press-product {
	display: none;
	height: 0;
}

#press-images-download-link {
	display: none;
	height: 0;
}

#press-images-verification .wpcf7-mail-sent-ok {
	display: none !important;
}

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

	#collection-overview {
		display: none;
	}

	.collection-item-detail .download-link {
		display: none;
	}

	.collection-item-detail .col-4 {
		width: 100%;
	}
}

/* swiper */

.swiper {
	margin-bottom: 60px;
	position: relative;
}

.swiper-slide {
	overflow: hidden;
}

.swiper-slide img.swiper-bg-image {
	width: 100%;
	height: auto;
}

.swiper-slide img.mobile {
	display: none;
}

.swiper-header {
	z-index: 1;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	text-align: center;
}

.swiper-header.black h1 {
	color: black;
}

.swiper-header.black a.big-button {
	border: 1px solid black;
	color: black;
}

.swiper-header h1 {
	font-size: 44px;
	font-family: 'SuisseBPSerif-Medium';
	text-transform: capitalize;
	color: white;
	font-weight: normal;
}

.swiper-header .stamp {
	margin-bottom: 20px;
	width: 100px;
}

/*.carousel.square .carousel-header h1 {
	font-size: 24px;
}*/

.swiper:hover .swiper-prev,
.swiper:hover .swiper-next {
	display: block;
	border: 0;
}

.swiper-prev,
.swiper-next {
	display: none;
	width: 40px;
	height: 40px;
	background-color: white;
	position: absolute;
	top: 50%;
	margin-top: -20px;
	text-align: center;
	cursor: pointer;
	border: 0;
	z-index: 1;
}

.swiper-prev span,
.swiper-next span {
	position: relative;
	top: 13px;
}

.swiper-prev {
	left: 10px;
}

.swiper-next {
	right: 10px;
}

.swiper-pagination-custom {
	position: absolute;
	bottom: 25px;
	left: 25px;
	right: 25px;
	text-align: center;
	z-index: 1;
}

.swiper-pagination-bullet,
.swiper-pagination-bullet:hover {
	display: inline-block;
	-webkit-border-radius: 50%;
	-ms-border-radius: 50%;
	border-radius: 50%;
	margin-right: 6px;
	padding: 4px;
	height: 0;
	width: 0;
	border: 1px solid white;
	border-width: 1px;
	background: transparent;
	background-color: transparent;
	opacity: 1;
}

.swiper-pagination-custom a:last-child {
	margin-right: 0;
}

.swiper-pagination-bullet-active,
.swiper-pagination-bullet-active:hover {
	background-color: white;
	background: white;
}

.swiper-single {
    margin-bottom: 60px;
}

.swiper-single img {
	width: 100%;
	height: auto;
}

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

	.swiper.home {
		margin-bottom: 30px;
	}

	.swiper.home .swiper-header h1 {
		font-size: 24px;
	}

	.swiper-header .stamp {
		width: 50px;
	}


	.swiper-slide img.mobile {
		display: block;
	}

	.swiper-slide img.desktop {
		display: none;
	}

	.swiper-next,
	.swiper-prev {
		display: none !important;
	}
}

/* home  */

@media screen and (min-width: 950px) {
	.home-page {
		margin-top: -40px;
		max-width: none;
		position: relative;
		z-index: 1;
	}
}

/* contact */

#contact-page {

}

#mobile-copyright {
	display: none;
}

div.wpcf7-response-output {
	border: 0 !important;
	padding: 10px !important;
	margin: 0 !important;
	background: #dcdddf !important;
}

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

	#contact-page h1 {
		font-size: 14px;
	}

	#mobile-copyright {
		display: block;
	}

	#copyright,
	#newsletter {
		display: none;
	}
}

/* footer */

#footer {
	background-color: #DCDDDF;
	background-color: #D46229;
	padding: 10px 0 0px 0;
	font-size: 10px;
	color: white;
}

#footer .logo {
	float: right;
	height: 12px;
	margin-top: 15px;
}

#footer .social-media-icon {
	float: left;
	height: 22px;
	width: 22px;
	margin-top: 15px;
	margin-right: 15px;
}

#footer a,
#mobile-footer a {
	color: white !important;
	border-color: white !important;
}

#mobile-footer {
	background-color: #DCDDDF;
	background-color: #D46229;
	padding: 5px 0 15px 0;
	display: none;
	font-size: 10px;
	color: white;
}

#mobile-footer .logo {
	height: 12px;
	margin-top: 5px;
}

#mobile-footer .social-media-icon {
	height: 22px;
	width: 22px;
	margin-top: 5px;
	margin-right: 15px;
}

.social-media-icons a {
	border: 0;
}

@media screen and (max-width: 950px) {
	#footer {
		display: none;
	}

	#mobile-footer {
		display: block;
	}
}

/* buttons inputs */

a.big-button {
	display: inline-block;
	text-transform: uppercase;
	background: none;
	padding: 15px 0 11px 0;
	width: 215px;
	text-align: center;
	font-size: 14px;
	border: 1px solid white;
	color: white;
	letter-spacing: 1px;
	line-height: 1.5;
}

input[type=text],
input[type=email] {
	height: 26px;
	border: 1px solid black;
	background-color: white;
	display: block;
	width: calc(100% - 22px);
	padding: 1px 10px;
	margin: 5px 0 0 0;
}

input[type=submit] {
	height: 30px;
	padding: 0 10px;
	text-transform: uppercase;
	background-color: #D46229;
	border: 1px solid #D46229;
	color: white;
}

.select {
	position: relative;
}

.select select {
	margin: 5px 0 0 0;
	display: block;
	background-color: white;
	border: 1px solid black;
	width: 100%;
	height: 30px;
	padding: 0 10px;
	color: black;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 0;
	-webkit-border-radius: 0;
	-ms-border-radius: 0;
}

.select .darr {
	position: absolute;
	right: 10px;
	top: 10px;
	color: black;
}

textarea {
	display: block;
	border: 1px solid black;
	background-color: white;
	width: calc(100% - 22px);
	padding: 10px;
	resize: none;
	height: 136px;
	margin-top: 5px;
}

div.input {
	margin: 20px 0 0 0;
	margin: 15px 0;
	margin: 30px 0;
}

div.input p {
	background-color: red;
	line-height: 0;
	height: 0;
}

input,
textarea,
select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 0;
	-webkit-border-radius: 0;
}

span.wpcf7-not-valid-tip {
	margin-top: 5px;
}

.orange-button,
.orange-button:hover,
.orange-button:active,
.orange-button:visited {
	background-color: #D46229;
	display: inline-block;
	padding: 4px 20px;
	text-decoration: none;
	color: white;
	border: 0;
	font-weight: bold;
}

.orange-button.block {
	display: block;
	padding: 4px 0;
	text-align: center;
}

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

	div.input .col-2:nth-of-type(2) {
		margin-top: 15px;
		margin-top: 30px;
	}
}

/* exclusive for home page slider */

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

	.swiper-header h1 {
		margin-bottom: 10px;
		padding: 0 20px;
	}

	.swiper-header .stamp {
		margin-bottom: 10px;
	}

	a.big-button {
		padding: 8px 0 6px 0;
	}
}

/* misc */

.cb {
	clear: both;
}

.upcase {
	text-transform: uppercase;
}

.fw-normal {
	font-weight: normal;
}

/* fonts */

@font-face {
  font-family: 'SuisseBPIntl';
  src: url('font/SuisseBPIntl-RegularItalic.eot?#iefix') format('embedded-opentype'),  url('font/SuisseBPIntl-RegularItalic.otf')  format('opentype'),
	     url('font/SuisseBPIntl-RegularItalic.woff') format('woff'), url('font/SuisseBPIntl-RegularItalic.ttf')  format('truetype'), url('font/SuisseBPIntl-RegularItalic.svg#SuisseBPIntl-RegularItalic') format('svg');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'SuisseBPIntl';
  src: url('font/SuisseBPIntl-Regular.eot?#iefix') format('embedded-opentype'),  url('font/SuisseBPIntl-Regular.otf')  format('opentype'),
	     url('font/SuisseBPIntl-Regular.woff') format('woff'), url('font/SuisseBPIntl-Regular.ttf')  format('truetype'), url('font/SuisseBPIntl-Regular.svg#SuisseBPIntl-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'SuisseBPIntl';
  src: url('font/SuisseBPIntl-MediumItalic.eot?#iefix') format('embedded-opentype'),  url('font/SuisseBPIntl-MediumItalic.otf')  format('opentype'),
	     url('font/SuisseBPIntl-MediumItalic.woff') format('woff'), url('font/SuisseBPIntl-MediumItalic.ttf')  format('truetype'), url('font/SuisseBPIntl-MediumItalic.svg#SuisseBPIntl-MediumItalic') format('svg');
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: 'SuisseBPIntl';
  src: url('font/SuisseBPIntl-Medium.eot?#iefix') format('embedded-opentype'),  url('font/SuisseBPIntl-Medium.otf')  format('opentype'),
	     url('font/SuisseBPIntl-Medium.woff') format('woff'), url('font/SuisseBPIntl-Medium.ttf')  format('truetype'), url('font/SuisseBPIntl-Medium.svg#SuisseBPIntl-Medium') format('svg');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'SuisseBPSerif-Medium';
  src: url('font/SuisseBPSerif-Medium.eot?#iefix') format('embedded-opentype'),  url('font/SuisseBPSerif-Medium.otf')  format('opentype'),
	     url('font/SuisseBPSerif-Medium.woff') format('woff'), url('font/SuisseBPSerif-Medium.ttf')  format('truetype'), url('font/SuisseBPSerif-Medium.svg#SuisseBPSerif-Medium') format('svg');
  font-weight: normal;
  font-style: normal;
}