/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/


/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.gridcontainer {
  position: relative;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box; }
.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box; }

/* For devices larger than 400px */
@media (min-width: 400px) {
  .gridcontainer {
    width: 100%;
    margin-top:20px;
    padding: 0; }
}

/* For devices larger than 550px */
@media (min-width: 550px) {
  /*.gridcontainer {
  }*/
  .column,
  .columns {
    margin-left: 1%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0;
  overflow: hidden;}

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%;            }
  .four.columns                   { width: 30.6666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }

  .one-third.column               { width: 30.6666666667%; }
  .two-thirds.column              { width: 65.3333333333%; }

  .one-half.column                { width: 48%; }

  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }

}
/* Self Clearing Goodness */
.gridcontainer:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }
.column h3 {margin-top:0}
.column img {
  overflow:hidden;
  border: 1px #d3d3d3 solid;
box-shadow: 0 4px 2px -3px rgba(102, 102, 102, 0.35),0 4px 6px -2px rgba(0,0,0,.05);
border-radius: 4px;
}
.row {

padding-bottom: 5px;
  padding-top: 5px;
  border-bottom: 1px solid #dbdbdb;
}

@media (prefers-color-scheme: dark) {
  .row {
    border-bottom: 1px solid #1d2a2f;
  }
}

/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}

/* SKELETON FINISHED */
/* CUSTOMIZATION */
/* Header */

header {
	position: relative;
/*	background: linear-gradient(115deg, #282828, #1d1d1d); */
  background: #0d1315;
	color: #191919;
/*	line-height: 1.5em; */
  height: 50px;
	padding: 0 20px;
}

header .wrapper {
	padding: 8px 0 4px 0;
}

header a {
	display: inline-block;
}

header p a {
letter-spacing: 0.15em;
border: 1px solid #9a865f; /* #4367a8; */ /* for izkizcam */
padding-left: 8px;
border-radius: 6px;
padding-right: 8px;
padding-top: 3px;
width: 330px;
font-size: 14px;
  margin-top: 10px;
  color:#ebcb8b;
}
header p {
letter-spacing: 0.15rem;  
}

header .logo {
	width: 150px;
	/*max-width: 80%;*/
}
/*
header nav {
	display: inline-block;
	background-color: #ebcb8b;
	border-radius: 10px;
	margin-top: 18px;
	overflow: hidden;
}
*/
header nav li {
	display: inline-block;
}

header nav a {
	display: block;
	color: #222;
	padding: 0 10px;
	line-height: 30px;
}

header nav a:hover,
header nav li.selected a {
	color: #444;
	background-color: #f0d49c;
}

header nav .search a {
	background-image: url(search.svg);
	background-repeat: no-repeat;
	background-size: 65% 65%;
	background-position: center center;
	width: 34px;
	color: transparent !important;
	user-select: none;
}

header nav .search a:hover,
header nav .search.selected a,
.search .search-box input[type="submit"] {
	background-image: url('data:image/svg+xml,%3Csvg width="38" height="38" viewBox="0 0 38 38" xmlns="http://www.w3.org/2000/svg"%3E%3Cg fill="none" fill-rule="evenodd"%3E%3Crect fill="%23FFF" transform="rotate(-45 9 29.5)" x="-1" y="27" width="20" height="5" rx="2.5"/%3E%3Ccircle stroke="%23FFF" stroke-width="5" cx="23" cy="15" r="12"/%3E%3C/g%3E%3C/svg%3E');
}

.rainbow-text {
  background-image:  linear-gradient(to right, violet, #ecc238, #f88757, #c736ad, #6c73e1, #70eaef, #4bbfa6);   
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-align: center;
}
.instagram {

  -webkit-background-clip: text;
/*  width: 250px;
  height: 250px;*/
  text-align: center;
  background-clip: text;
  color: #fff;
  color: #b9a98378;
  background-image: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
}


/* High-level */

.wrapper {
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
	padding: 30px 40px 0 40px;
	text-align: center;
}

.image-compare {
 margin-bottom: 10px;
 border: 1px solid #d9d7d7;
  -webkit-box-shadow: 0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);
  box-shadow: 0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);
  border-radius: 4px;
}


.bgcover {
  background: #030201;
  height: 500px;
  background-image: url(https://www.deluxefx.co.uk/images/Petra_header.jpg);
  background-position: 50% 0;
  min-height: 500px;
  background-size: cover;
  max-width: 960px;
  margin: 0 auto;
}
.absolute {position: absolute;}
.splash {
position: relative;
width: 100%;
/*background: #030201;*/
border-radius: 0px;
/*padding: 20px; */
margin-top: 0px;
margin-left: auto;
margin-right: auto;
background-image: url(https://www.deluxefx.co.uk/images/bgcover.png);
height: 500px;
background-repeat: repeat;
  border-top: 1px transparent solid;

}

@media (min-width: 980px) {
  .sidebar-toggle {display: none !important; }
  #navi {display: block !important;}
}

@media (min-width: 980px) {
.wrapper {
    text-align: left;
}
  }



.container a {
color: #0e63ac;  
}
.container p{
margin-bottom:10px;  
}
.splash h1, .splash h2, .splash h3 {
  text-align: center
}
.splash h1 {
font-size: 1.0rem;
text-align: center;
 color:#fff
}
.splash h2 {
font-size: 1.9rem;
text-align: center;
color: #fadc96;
font-family: "Helvetica Neue", Arial, sans-serif;
font-weight: 100;
}
.splash h3 {
font-size: 1.25rem;
text-align: left;
  color: #ddd;
}
.mainbody {
margin-left: auto;
  margin-right: auto;
 /* padding:5px;*/
   padding-left:5px; 
  padding-right:5px;
  margin-bottom: 10px;
}

.linear-wipe {
  text-align: center;
 /* background: -webkit-gradient(linear, left top, right top, color-stop(20%,  #fad680), color-stop(40%, #fad680), color-stop(60%, #968256), color-stop(80%, #F8D47F));*/
  /*background: linear-gradient(to right, #E6E6E6 20%, #fffafa 40%, #B5B5B5 60%, #FFF 80%);*/
  background: linear-gradient(135deg, #fca75b 20%, #fbd293 40%, #a64e28 60%, #fca75b 80%);
  background-size: 200% auto;
  color: #000;
  padding:20px;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
/*  -webkit-animation: shine 6s linear infinite; */
     /*     animation: shine 6s linear infinite; */
}
/*@-webkit-keyframes shine {
  to {
    background-position: 200% center;
  }
}
@keyframes shine {
  to {
    background-position: 200% center;
  }
}*/

/* fix */
@font-face{
    font-family:'FontAwesome';
    font-display: swap;
    src: local('Miriam Libre Bold'), local('MiriamLibre-Bold'), url(https://fonts.gstatic.com/s/miriamlibre/v5/DdT-798HsHwubBAqfkcBTL_X3LbrQsq_.ttf) format('truetype');
}

footer {
    background: #030201;
    color: #bdbdbd;
font-family: "Helvetica Neue", Arial, sans-serif;
font-weight: 250;
}

footer p {
    padding: 40px 0;
    text-align: center;
}

h1 a {color:#0e63ac}


/* Contact form */
.contact__container {
		display: block;
		border: 10px solid #E1E1E1;
		border-radius: 10px;
		margin: 0 auto;
		padding: 0 0 10px 10px;
    background-color: #E1E1E1;
    min-height: 50rem;
}

.contact__title {
		display: inline-block;
}


.contact__form {
		padding: 10px 10px 0 0;
}



input,
textarea {
		width: 100%;
		border: 5px solid #FFFFFF;
		border-radius: 5px;
		resize: none;
		padding: 0 5px;
		box-sizing: border-box;
		font-family: 'Open Sans' sans-serif;
		font-size: 18px;
		color: #25606f;
}

input[type="text"] {
		padding: 0;
		height: 40px;
		width: 100%;
}

input:focus,
textarea:focus {
		outline: none;
}

.contact__form-input {
		margin: 5px 0 10px 0;
}

.contact__form-textarea {
		margin: 5px 0;
		width: 100%;
		height: 100px;
}

input[type="submit"] {
		width: 100%;
		height: 50px;
		background-color: #ebcb8b;
		border: 0;
		color: #666;
		border: 5px solid #ebcb8b;
		border-radius: 5px;
		margin: 10px 0 0 0;
		font-family: 'Open Sans' sans-serif;
		font-size: 22px;
}

input[type="button"]:hover {
		background-color: #368da2;
		border: #368da2;
}
input.kitty {display: none}
input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
/* contact form ends */