/*! custom style for Jardin Flowers
typed by Veronica Stevany */


html {
		overflow: scroll;
       overflow-y: scroll;
	   overflow-x: hidden;
}

a:hover{
	text-decoration:none;
	
	}
@font-face {
	font-family: 'GillSans';
	font-weight: normal;
	font-style: normal;
	src: url(font/gill-roman/eot);
src: url(../font/gill-roman/eot) format('embedded-opentype') ,url(../font/gill-roman/woff) format('woff'), url(../font/gill-roman/ttf) format('truetype');} 

@font-face {
	font-family: 'Gill Sans Bold';
	font-weight: normal;
	font-style: normal;
	src: url(font/gill-bold/eot);
src: url(../font/gill-bold/eot) format('embedded-opentype') ,url(../font/gill-bold/woff) format('woff'), url(../font/gill-bold/ttf) format('truetype');}



@font-face {
	font-family: 'Gill Sans Light';
	font-weight: normal;
	font-style: normal;
	src: url(font/gill-light/eot);
src: url(../font/gill-light/eot) format('embedded-opentype') ,url(../font/gill-light/woff) format('woff'), url(../font/gill-light/ttf) format('truetype');}

@font-face {
	font-family: 'Gill Sans Italic';
	font-weight: normal;
	font-style: normal;
	src: url(font/gill-booki/eot);
src: url(../font/gill-booki/eot) format('embedded-opentype') ,url(../font/gill-booki/woff) format('woff'), url(../font/gill-booki/ttf) format('truetype');}

.sizeimg{
	height: auto;
	width: 65%;
	}
	
.sizeimg2{
	height: auto;
	width: 65%;
	}
	

.imgpara{
	width: 100%;
	height: auto;
	display: block;
	
	}
	


@media (min-width:1401px){

.prod{
	border-radius: 0px;
	color: #FFF;
	border: 2px solid #FFF;
	padding: 15px;
	padding-top:17px;
	width: 400px;
	
	}
	
.prod2{
	border-radius: 0px;
	color: #FFF;
	border: 2px solid #FFF;
	padding: 15px;
	padding-top:17px;
	width: 450px;
	
	}
	
.grs{
	
	height: 1px; width:40px; background-color:black; margin-top: 60px; margin-bottom:50px;
	}
.headerspc{
	
	color: #262626; margin-right:50px;}
.au{
	margin-top:120px;
	
	}
.storih{
	padding-top: 0px;
	padding-left: 300px;
	padding-right: 40px;
	
}

.storih2{
	padding-top: 0px;
	padding-right: 300px;
	padding-left: 40px;
	
}
	
	
.garis1{
	width:200px;
	height:1px;
	background-color: black;
	float: left;
	margin-left: -140px;
	margin-top: 20px;
}

.garis2{
	width:200px;
	height:1px;
	background-color: black;
	float: right;
	margin-right:-110px;
	margin-top: 20px;
}



.p1{
	font-family: 'GillSans';
	font-size:18px; 
	letter-spacing:0.2em;
	color: #262626;
}


p2{
	font-family: 'GillSans';
	font-size:35px; 
	letter-spacing:0.3em;
	color: #262626;
}

p3{
	font-family: 'Gill Sans Light';
	font-size:20px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}


p4{
	font-family: 'Gill Sans Italic';
	font-size:35px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}

p5{
	font-family: 'Gill Sans Light';
	font-size:20px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}

p6{
	font-family: 'GillSans';
	font-size:40px; 
	letter-spacing:0.2em;
	color: white;
	line-height: 50pt;
}

p7{
	font-family: 'GillSans';
	font-size:25px; 
	letter-spacing:0.1em;
	color: #000;
	line-height: 30pt;
	
}

.garish {
	background-color: #757575;
	width : 1400px;
	height: 1px;
	opacity: 0.8;
	
	}


}


@media (max-width: 1400px) {
.garish {
	background-color: #757575;
	width : 1000px;
	height: 1px;
	opacity: 0.8;
	
	}

.prod{
	border-radius: 0px;
	color: #FFF;
	border: 2px solid #FFF;
	padding: 15px;
	padding-top:17px;
	width: 50%;
	
	}
	
.prod2{
	border-radius: 0px;
	color: #FFF;
	border: 2px solid #FFF;
	padding: 15px;
	padding-top:17px;
	width: 60%;
	
	}
	


.grs{
	
	height: 1px; width:40px; background-color:black; margin-top: 60px; margin-bottom:50px;
	}
.headerspc{
	
	color: #262626; margin-right:50px;}
.au{
	margin-top:120px;
	
	}
.storih{
	padding-top: 0px;
	padding-left: 300px;
	padding-right: 40px;
	
}

.storih2{
	padding-top: 0px;
	padding-right: 300px;
	padding-left: 40px;
	
}
	
	
.garis1{
	width:200px;
	height:1px;
	background-color: black;
	float: left;
	margin-left: -140px;
	margin-top: 20px;
}

.garis2{
	width:200px;
	height:1px;
	background-color: black;
	float: right;
	margin-right:-110px;
	margin-top: 20px;
}




.p1{
	font-family: 'GillSans';
	font-size:12px; 
	letter-spacing:0.2em; 
	font-weight:500; 
	color: #262626;
}


p2{
	font-family: 'GillSans';
	font-size:30px; 
	letter-spacing:0.3em;
	color: #262626;
}

p3{
	font-family: 'Gill Sans Light';
	font-size:15px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}


p4{
	font-family: 'Gill Sans Italic';
	font-size:30px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}

p5{
	font-family: 'Gill Sans Light';
	font-size:15px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}


p6{
	font-family: 'GillSans';
	font-size:20px; 
	letter-spacing:0.2em;
	color: white;
	line-height: 30pt;
	
}
p7{
	font-family: 'GillSans';
	font-size:20px; 
	letter-spacing:0.1em;
	color: #000;
	line-height: 30pt;
	
}
	
	.storih{
	padding-top: 70px;
	padding-right: 0px;
	
}
	
	.garis1{
	width:100px;
	height:1px;
	background-color: black;
	float: left;
	margin-left: -140px;
	margin-top: 20px;
}

.garis2{
	width:100px;
	height:1px;
	background-color: black;
	float: right;
	margin-right:-110px;
	margin-top: 20px;
}

.storih{
	padding-top: 0px;
	padding-left: 0px;
	padding-right: 20px;
	
}

.storih2{
	padding-top: 0px;
	padding-right:0px;
	padding-left: 20px;
	
}

.sizeimg{
	height: auto;
	width: 100%;
	}
	
.sizeimg2{
	height: auto;
	width: 100%;
	}
	
	.au{
	padding-top:50px;
	
	}
}

@media (max-width: 860px) {
	
	
	
	.marginphone{
		margin-bottom: -200px;
		
		}
		.garis1{
	width:80px;
	height:1px;
	background-color: black;
	float: left;
	margin-left: -160px;
	margin-top: 20px;
}

.garis2{
	width:80px;
	height:1px;
	background-color: black;
	float: right;
	margin-right:-160px;
	margin-top: 20px;
}

	p2{
	font-family: 'GillSans';
	font-size:25px; 
	letter-spacing:0.2em;
	color: #262626;
}

p3{
	font-family: 'Gill Sans Light';
	font-size:15px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}


p4{
	font-family: 'Gill Sans Italic';
	font-size:25px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}

p5{
	font-family: 'Gill Sans Light';
	font-size:15px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 30pt;
}


p6{
	font-family: 'GillSans';
	font-size:17px; 
	letter-spacing:0.2em;
	color: white;
	line-height: 30pt;
	
}
p7{
	font-family: 'GillSans';
	font-size:17px; 
	letter-spacing:0.1em;
	color: #000;
	line-height: 30pt;
	
}

.headerspc{
	color: #262626; margin-right:30px;
	}
	
	}



@media (max-width: 767px) {


	
#portfolio .portfolio-item {
    right: 0;
    margin: 0 0 15px;
}

#portfolio .portfolio-item .portfolio-link {
    display: block;
    position: relative;
    margin: 0 auto;
    max-width: 960px;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(254,209,54,.9);
    -webkit-transition: all ease .5s;
    -moz-transition: all ease .5s;
    transition: all ease .5s;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover:hover {
    opacity: 1;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 20px;
    margin-top: -12px;
    text-align: center;
    font-size: 20px;
    color: #fff;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i {
    margin-top: -12px;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 {
    margin: 0;
}

#portfolio .portfolio-item .portfolio-caption {
    margin: 0 auto;
    padding: 25px;
    max-width: 400px;
    text-align: center;
    background-color: #fff;
}

#portfolio .portfolio-item .portfolio-caption h4 {
    margin: 0;
    text-transform: none;
}

#portfolio .portfolio-item .portfolio-caption p {
    margin: 0;
    font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-style: italic;
}

#portfolio * {
    z-index: 2;
}


.portfolio-modal .modal-content {
    padding: -150px;
    min-height: 100%;
    border: 0;
    border-radius: 0;
    text-align: center;
    background-clip: border-box;
    -webkit-box-shadow: none;
    box-shadow: none;
	z-index:100;
}

.portfolio-modal .modal-content h2 {
    margin-bottom: 15px;
    font-size: 3em;
}

.portfolio-modal .modal-content p {
    margin-bottom: 30px;
}

.portfolio-modal .modal-content p.item-intro {
    margin: 20px 0 30px;
    font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-style: italic;
}

.portfolio-modal .modal-content ul.list-inline {
    margin-top: 0;
    margin-bottom: 30px;
}

.portfolio-modal .modal-content img {
    margin-bottom: 30px;
}

.portfolio-modal .close-modal {
    position: absolute;
    top: 25px;
    right: 25px;
    width: 55px;
    height: 55px;
    background-color: white;
    cursor: pointer;
}

.portfolio-modal .close-modal:hover {
    opacity: .3;
}

.portfolio-modal .close-modal .lr {
    z-index: 1051;
    width: 1px;
    height: 55px;
    margin-left: 35px;
    background-color: #222;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.portfolio-modal .close-modal .lr .rl {
    z-index: 1052;
    width: 1px;
    height: 55px;
    background-color: #222;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

::-moz-selection {
    text-shadow: none;
    background: #fed136;
}

::selection {
    text-shadow: none;
    background: #454545;
	color: white;
}

img::selection {
    background: 0 0;
}

img::-moz-selection {
    background: 0 0;
}


ul.img-list {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
 
ul.img-list li {
}

span.text-content {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
 
span.text-content span {
  display: block;
  text-align: center;
  vertical-align: middle;
  
}

span.text-content {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  opacity: 0;
}
 
ul.img-list li:hover span.text-content {
  opacity: 1;
}

span.text-content {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  padding-top: 42%;
  width: 100%;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}

	.garish {
	background-color: #757575;
	width : 250px;
	height: 1px;
	opacity: 0.8;
	
	}
	.prod{
	border-radius: 0px;
	color: #FFF;
	border: 2px solid #FFF;
	padding: 15px;
	padding-top:17px;
	width: 200px;
	
	}
	
.prod2{
	border-radius: 0px;
	color: #FFF;
	border: 2px solid #FFF;
	padding: 15px;
	padding-top:17px;
	width: 240px;
	
	}
	
p6{
	font-family: 'GillSans';
	font-size:20px; 
	letter-spacing:0.2em;
	color: white;
	line-height: 20pt;
}

	.grs{
	
	height: 1px; width:40px; background-color:black; margin-top: 30px; margin-bottom:30px;
	}
	
	.abtgaris{
		height: 1px; width:40px; background-color:black; margin-top: 30px; margin-bottom:10px;
		padding:0; margin-left:0;
		
		}
		
	.au{
	margin-top:0px;
	
	}
.p1{
	font-family: 'GillSans';
	font-size:12px; 
	letter-spacing:0.2em; 
	font-weight:500; 
	color: #262626;
	line-height:25pt;
	text-align:center;
	padding:0;
	margin:0;
}

.kanan{
	margin-right:60px;
	}

p2{
	font-family: 'GillSans';
	font-size:25px; 
	letter-spacing:0.3em;
	color: #262626;
}

p3{
	font-family: 'Gill Sans Light';
	font-size:12px; 
	letter-spacing:0.15em;
	color: #262626;
	line-height: 25pt;
}

p4{
	font-family: 'Gill Sans Italic';
	font-size:25px; 
	letter-spacing:0.1em;
	color: #262626;
	line-height: 20pt;
}

p5{
	font-family: 'Gill Sans Light';
	font-size:12px; 
	letter-spacing:0.1em;
	color: #262626;
	line-height: 15pt;
}


p7{
	font-family: 'GillSans';
	font-size:14px; 
	letter-spacing:0.1em;
	color: #000;
	line-height: 30pt;
	
}
.garis1{
	width:50px;
	height:1px;
	background-color: black;
	float: left;
	margin-left: -140px;
	margin-top: 20px;
}

.garis2{
	width:50px;
	height:1px;
	background-color: black;
	float: right;
	margin-right:-110px;
	margin-top: 20px;
}

#aboutus2{
		background: white 50% 0% fixed no-repeat;
		width:100%;
		height: auto;
		min-height:300px;
		
		padding-top:100px;
	}
	
.sizeimg{
	margin:0;
	width:100%;
	height:auto;
	display: block;
	
	}
	
	.sizeimg2{
	margin:0;
	width:100%;
	height:auto;
	display: block;
	
	}
.storih{
}

.storih2{
	
}

.headerspc{
	
	color: #262626; margin-right:0;}
}


/*!
 * Start Bootstrap - Agency Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */




#portfolio .portfolio-item {
    right: 0;
    margin: 0 0 15px;
}

#portfolio .portfolio-item .portfolio-link {
    display: block;
    position: relative;
    margin: 0 auto;
    max-width: 960px;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(254,209,54,.9);
    -webkit-transition: all ease .5s;
    -moz-transition: all ease .5s;
    transition: all ease .5s;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover:hover {
    opacity: 1;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 20px;
    margin-top: -12px;
    text-align: center;
    font-size: 20px;
    color: #fff;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i {
    margin-top: -12px;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 {
    margin: 0;
}

#portfolio .portfolio-item .portfolio-caption {
    margin: 0 auto;
    padding: 25px;
    max-width: 400px;
    text-align: center;
    background-color: #fff;
}

#portfolio .portfolio-item .portfolio-caption h4 {
    margin: 0;
    text-transform: none;
}

#portfolio .portfolio-item .portfolio-caption p {
    margin: 0;
    font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-style: italic;
}

#portfolio * {
    z-index: 2;
}


.portfolio-modal .modal-content {
    padding: 100px 0;
    min-height: 100%;
    border: 0;
    border-radius: 0;
    text-align: center;
    background-clip: border-box;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.portfolio-modal .modal-content h2 {
    margin-bottom: 15px;
    font-size: 3em;
}

.portfolio-modal .modal-content p {
    margin-bottom: 30px;
}

.portfolio-modal .modal-content p.item-intro {
    margin: 20px 0 30px;
    font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-style: italic;
}

.portfolio-modal .modal-content ul.list-inline {
    margin-top: 0;
    margin-bottom: 30px;
}

.portfolio-modal .modal-content img {
    margin-bottom: 30px;
}

.portfolio-modal .close-modal {
    position: absolute;
    top: 25px;
    right: 25px;
    width: 55px;
    height: 55px;
    background-color: white;
    cursor: pointer;
}

.portfolio-modal .close-modal:hover {
    opacity: .3;
}

.portfolio-modal .close-modal .lr {
    z-index: 1051;
    width: 1px;
    height: 55px;
    margin-left: 35px;
    background-color: #222;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.portfolio-modal .close-modal .lr .rl {
    z-index: 1052;
    width: 1px;
    height: 55px;
    background-color: #222;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

::-moz-selection {
    text-shadow: none;
    background: #fed136;
}

::selection {
    text-shadow: none;
    background: #454545;
	color: white;
}

img::selection {
    background: 0 0;
}

img::-moz-selection {
    background: 0 0;
}


ul.img-list {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: center;
}
 
ul.img-list li {
}

span.text-content {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
 
span.text-content span {
  display: block;
  text-align: center;
  vertical-align: middle;
  
}

span.text-content {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  opacity: 0;
}
 
ul.img-list li:hover span.text-content {
  opacity: 1;
}

span.text-content {
  background: rgba(0,0,0,0.5);
  color: white;
  cursor: pointer;
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  padding-top: 42%;
  width: 100%;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}