
h3 {
	margin: 0 0 1em 0;
}

@font-face { 
  font-family: "JTOlifer";
  font-style: normal;
  font-weight: 900;
  src: url("../fontFolder/JTOlifer/JTOlifer-Bold.otf") format("opentype");
  
  
    
}

@font-face { 
  font-family: "JTOlifer Condensed";
  font-style: normal;
  font-weight: 600;
  src: url("../fontFolder/JTOlifer/JTOlifer-CondensedSemiBold.otf") format("opentype");
  
  
    
}

/*PRESET

nav ul {
list-style: none;
margin: 0 10px;
padding: 0;
}

nav li {
	display: inline-block;
	
	}
	
nav a {
	font-weight: 800;
	padding: 15px 10px;
	}*/
	
	
	
/**************
FROM OLD SITE
***************/
.Nav {
	margin:61px 0px 0px 40px;
	float:left;
	clear:right;
	font-family: "muli", "Montserrat", sans-serif;
	/*font-style:italic;*/
	font-weight: 700;
	font-size:12pt;
	color:#666666;
	max-width: 580px;
}


.Nav a { color:#666666; text-decoration:none; underline:none; outline:none; }
.Nav a:visited {color:#666666; text-decoration:none; underline:none; outline:none; }
.Nav a:active {color:#666666; text-decoration: underline:none; outline:none;}
.Nav a:hover {
	color:#cccccc;
	text-decoration:none;
	underline:none;
	outline:none;
}


.logo{
float:left;
margin:-10px 0 0 -10px;
}


.style1 {color: #666666;}

.style2 {
color: #00C0F3;  
font-family: "muli", "Montserrat", sans-serif;
font-style: Normal;
font-weight: 400;
}


/**************

***************/
	
	
footer{
}

.social-icon {
width:20px;
height:20px;
margin: 0 5px;
}

/**********************************
PAGE PORTFOLIO
***********************************/



#gallery {
	margin-left: auto; 
	margin-right: auto;
	width: 70%;
	padding: 0;
	list-style: none;
	text-decoration: none;
	width: 100%;
	
	/*border-radius: 20%;
	max-width: 100px;
	max-height: 100px;*/
}

#gallery li {
	float: left;
	/*clear:both;*/
	border-radius: 20px;
    /*width: 45%;*/
    max-width: 275px;
    height: 320px;
	margin-top: 6.0%;
	margin-left: 2.5%;
	margin-right: 2.5%;
	background-color: #fff;
	/*color: #bdc3c7;*/
	
	    
/**************
SHADOW
**************/
    -webkit-box-shadow: 7px 7px 0px 0px rgba(235, 235, 235, 0.75);
-moz-box-shadow:    7px 7px 0px 0px rgba(235, 235, 235, 0.75);
box-shadow:         7px 7px 0px 0px rgba(235, 235, 235, 0.75);
}


#gallery li a p {
	margin: 0;
	/*padding: 5%;*/
	/*font-size: 0.75em;
	font-family: "muli", "Montserrat", sans-serif;
	font-weight: 700;
	text-decoration: none;*/
	/*color: #2e3132;*/
	max-width: 275px;
    max-height: 190px;
    margin: 2%;
    border-radius: 20%;

}

#gallery li a img {
	margin: 0;
	/*padding: 5%;*/
	border-radius: 20px 20px 0px 0px;
	/*border-color: #f5f5f5;*/
	text-decoration: none;
	width: 100%;
    max-height: 190px;
    
}

.title{
width:100%;
font-size: 1.5em;
font-family: "JTOlifer Condensed", "muli", "Montserrat", sans-serif;
font-weight:600;
line-height:120%;
color: #002e41;
padding-left:20px;
padding-top: 7px;
/*padding-top:170px;*/
border:none;
outline:none;
text-decoration: none;
}

.title { color:#002e41; text-decoration:none; underline:none; outline:none; }
.title:visited {color:#002e41; text-decoration:none; underline:none; outline:none; }
.title:active {color:#002e41; text-decoration:none; underline:none; outline:0;}
.title:hover {color:#00C0F3; text-decoration:none; underline:none; outline:none;}

.description{
width: 80%;
font-family: "muli", "Montserrat", Alegreya;
/*font-style:italic;*/
font-size:10pt;
line-height:120%;
color: #ccc;
padding-left: 20px;
padding-top: 7px;
padding-bottom: 11px;
border: none;
outline: none;
text-decoration:none;
underline: none;
}

.description { color:#ccc; text-decoration:none; underline:none; outline:none; }
.description:visited {color:#ccc; text-decoration:none; underline:none; outline:none; }
.description:active {color:#ccc; text-decoration: underline:none; outline:0;}
.description:hover {color:#666; text-decoration:none; underline:none; outline:none;
}





/*******************************
PAGE: CONTACT
********************************/

.contact-info{
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: 0.9em;
}

.contact-info a{
	display:block;
	min-height: 20px;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	padding:  0 0 0 30px;
	margin: 0 0 10px;
	text-decoration:none;
	}

.contact-info li.phone a{
	background-image: url('../img/phone.png');
	text-decoration:none;
	}
	
.contact-info li.mail a{
	background-image: url('../img/mail.png');
	text-decoration:none;
	}
	
	
.contact-info li.twitter a{
	background-image: url('../img/twitter.png');
	text-decoration:none;
	}



/**********************************
COLORS
***********************************/

/* site body */
body {
  background-color: #fff;
  color: #999;
  text-decoration:none;
}

/* green header */
header {
  /* background: #09b6c5;*/
background: #ffffff;
  border-color: #599a68;
  clear: both;
  overflow: auto;
}


/* nav background on mobile */
nav {
  background: #09b6c5;
}

/* logo text */
h1, h2 {
  color: #09b6c5;
}

/* links 
a {
  color: #cccccc;
}*/

/* nav link 
nav a, nav a:visited {
  color: #fff;
}*/

/* selected nav link 
nav a.selected, nav a:hover {
  color: #333333;
}*/

a{
	text-decoration:none;
}

footer {
  clear: both;
  font-size: 8pt;
  text-align: center;
  font-weight:700; 
  font-family: JTOlifer, muli, sans-serif;
  margin-top: 80px; 
}

/**********************************
LIGHTBOX OVERLAY - INVISIBLE
***********************************/


.Invisible{
	display:none;
	}


/*******************************
PAGE: ABOUT
********************************/

.wavy-line {
  --s: 40px; /* size of the wave */
  --b: 2px; /* thickness of the line */
  --m: 3; /* curvature of the wave [0 2] */
  
  background: #999999;
  --R: calc(var(--s)*sqrt(var(--m)*var(--m) + 1) + var(--b)/2);
  height: calc(2*var(--R));
  width: 100%;
  --_g: #0000 calc(99% - var(--b)), #000 calc(101% - var(--b)) 99%, #0000 101%;
  mask:
    radial-gradient(var(--R) at left 50% bottom calc(-1*var(--m)*var(--s)), var(--_g)) 
     calc(50% - 2*var(--s)) calc(50% - var(--s)/2 - var(--b)/2)/calc(4*var(--s)) calc(var(--s) + var(--b)) repeat-x,
    radial-gradient(var(--R) at left 50% top calc(-1*var(--m)*var(--s)),var(--_g)) 
     50% calc(50% + var(--s)/2 + var(--b)/2)/calc(4*var(--s)) calc(var(--s) + var(--b)) repeat-x;
     
     float: left;
     margin-top: 0.75%;
}

.profile-photo {
display: block;
max-width: 250px;
float: left;
margin-top: 0.75%;
margin-left: 2.5%;
margin-right: 2.5%;
border: 2px solid;
border-color: #fff;
border-radius: 100%;
}

#lalala {
width: 80%;
font-family: "muli", "Montserrat", sans-serif;
/*font-style: italic;*/
   float: left;
font-size: 12pt;
line-height: 160%;
max-width: 750px;
color: #666;
margin-top: 0.75%;
margin-left: 2.5%;
}

.ContactForm {
   float: left;
}

.reslink a { color:#00BFF2; text-decoration:none; outline:none; outline: 0 !important;
  outline-style:none;}
.reslink a:visited {color:#00BFF2; text-decoration:none; outline:none; outline: 0 !important;
  outline-style:none;}
.reslink a:active {color:#00BFF2; text-decoration:none; outline:0; outline: 0 !important;
  outline-style:none;}
.reslink a:hover {color:#333; text-decoration:none; outline:none; outline: 0 !important;
  outline-style:none;
}

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap');

    .formcarry-container {
      box-sizing: border-box;
      float: left;
      margin: 60px 5% auto 10%;
      padding: 0;
      font-family: "muli", "Montserrat", sans-serif;
      font-size: 14px;
      font-weight: 700;
      line-height: 24px;
      letter-spacing: -0.01em;

      width: 400px;

      /* NORMAL */
      --fc-border-color: #ECEFF9;
      --fc-normal-text-color: #0E0B3D;
      --fc-normal-placeholder-color: #B3B8D0;

      /* PRIMARY COLOR | HSL FORMAT*/
      --fc-primary-color-hue: 18;
      --fc-error-color-hue: 356;
      --fc-primary-hsl: var(--fc-primary-color-hue), 100%, 60%;
      --fc-error-hsl: var(--fc-error-color-hue), 100%, 54%;

      /* HOVER */
      --fc-field-hover-bg-color: #F7F9FC;
      --fc-border-hover-color: #DDE0EE;
      --fc-field-hover-text-color: #B3B8D0;

      --fc-border-active-color: #ff5903;
    }

    .formcarry-container * {
      box-sizing: border-box;
    }

    .formcarry-container label {
      display: block;
      cursor: pointer;
    }

    .formcarry-container .formcarry-block:not(:first-child) {
      margin-top: 16px;
    }

    /*=============================================
    =            Fields           =
    =============================================*/
    
    .formcarry-container input,
    .formcarry-container textarea,
    .formcarry-container select {
      margin-top: 4px;
      width: 100%;
      height: 42px;
      border: 1px solid var(--fc-border-color);
      color: var(--fc-normal-text-color);
      border-radius: 6px;
      padding: 8px 12px;
      
      font-family: "Inter", sans-serif;
      font-size:14px;
      transition: 125ms background, 125ms color, 125ms box-shadow;
    }

    .formcarry-container textarea{
      min-height: 188px;
      max-width: 100%;
      padding-top: 12px;
    }

    .formcarry-container input::placeholder,
    .formcarry-container textarea::placeholder,
    .formcarry-container select::placeholder {
      color: var(--fc-normal-placeholder-color);
    }

    .formcarry-container input:hover,
    .formcarry-container textarea:hover,
    .formcarry-container select:hover {
      border-color: var(--fc-border-hover-color);
      background-color: var(--fc-field-hover-bg-color);
    }

    .formcarry-container input:hover::placeholder,
    .formcarry-container textarea:hover::placeholder,
    .formcarry-container select:hover::placeholder {
      color: var(--fc-field-hover-text-color);
    }

    .formcarry-container input:focus,
    .formcarry-container textarea:focus,
    .formcarry-container select:focus {
      background-color: #fff;
      border-color: hsl(var(--fc-primary-hsl));
      box-shadow: hsla(var(--fc-primary-hsl), 8%) 0px 0px 0px 3px;
      outline: none;
    }

    .formcarry-container select {
      background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.9997 14.5001L8.46387 10.9642L9.64303 9.78589L11.9997 12.1434L14.3564 9.78589L15.5355 10.9642L11.9997 14.5001Z' fill='%236C6F93'/%3E%3C/svg%3E%0A");
      /* background-position: calc(100% - 20px) calc(1em + 4px), calc(100% - 15px) calc(1em + 4px); */
      background-size: 24px 24px;
      background-position: 98%;
      background-repeat: no-repeat;
      appearance: none;
      -webkit-appearance: none;
    }

    .formcarry-container button {
      font-family: "Inter", sans-serif;
      font-weight: 500;
      font-size: 14px;
      letter-spacing: -0.02em;
      height: 42px;
      line-height: 40px;
      width: 100%;
      border-radius: 6px;
      box-sizing: border-box;
      border: 1px solid hsla(var(--fc-primary-hsl));
      background-color: hsla(var(--fc-primary-hsl));
      color: #fff;
      cursor: pointer;
    }

    .formcarry-container button {
      font-family: "Inter", sans-serif;
      font-weight: 500;
      font-size: 14px;
      letter-spacing: -0.02em;
      height: 40px;
      line-height: 24px;
      width: 100%;
      border: 0;
      border-radius: 6px;
      box-sizing: border-box;
      background-color: hsla(var(--fc-primary-hsl));
      color: #fff;
      cursor: pointer;
      box-shadow: 0 0 0 0 transparent;
      
      transition: 125ms all;
    }
    
    .formcarry-container button:hover {
      background: linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), hsla(var(--fc-primary-hsl));
    }
    
    .formcarry-container button:focus {
      background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), hsla(var(--fc-primary-hsl));
      border-inline: 1px solid inline rgba(255, 255, 255, 0.6);
      box-shadow: 0px 0px 0px 3px rgba(var(--fc-primary-hsl), 12%);
    }

    .formcarry-container button:active {
      background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), hsla(var(--fc-primary-hsl));
    }

    .formcarry-container button:disabled {
      background-color: hsla(var(--fc-primary-hsl), 40%);
      cursor: not-allowed;
    }

    .formcarry-container input:focus:required:invalid,
    .formcarry-container input:focus:invalid, 
    .formcarry-container select:focus:required:invalid,
    .formcarry-container select:focus:invalid
    {
      color: hsl(var(--fc-error-hsl)); 
      border-color: hsl(var(--fc-error-hsl));
      box-shadow: 0px 0px 0px 3px hsla(var(--fc-error-hsl), 12%);
    }

    /*=====  End of Contact Form Fields  ======*/





	