h1{
}

.row{
	padding: 30px 0px;
}
.navbar {
    margin-bottom: 0;
    background-color: #f8f8f8;
    z-index: 9999;
    border: 0;
    font-size: 12px !important;
    line-height: 1.42857143 !important;
    letter-spacing: 4px;
    border-radius: 0;
    
}

.navbar li a, .navbar .navbar-brand {
    color: #1abc9c !important;
}

.navbar-brand img{
    max-width: 100px;
    margin-top:-13px;}

.navbar-nav li a:hover{
    color: #333 !important;
}

.navbar-nav li.active a {
	border-bottom: 5px solid #1abc9c;
}

.navbar-inverse .navbar-toggle {
    border-color: transparent;
    color: #fff !important;
}
	
	.header{
	 background:rgba(10,74,61,0.5); 
	 position: relative; 
	 z-index:20;
   padding:200px 0px !important; }

	.header h1, .header p{
	 color: #fff; }

	 .header p{
	 	font-family: AlegrayaSans;
	 	font-size: 50px;
	 }

	 .header h1{
	 	font-size: 50px;
	 }

ul .breadcrumb{
	padding: 8px 16px;
	list-style: none;
	background-color: #eee;
}

ul .breadcrumb li{
	display: inline;
}

ul .breadcrumb li +li:before{
	padding: 8px;
	color: #000;
	content: "/\00a0";
}

ul .breadcrumb li a{
	color: green;
}
	 
	.container-fluid{
		padding-top:70px;
		padding-bottom:70px;}

	.info{
		background:rgba(20,20,20,0.5); 
		position: relative; 
		z-index:1;
	}

	 .info h1{
	 	font-size: 55px;
	 }

	 .info p{
	 	font-family: AlegrayaSans;
	 	font-size: 50px;
	 }

.modal-dialog{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

.modal-header, .modal-footer, .close{
	background-color: #1abc9c;
	color: #fff !important;
	font-size: 40px !important;
}
.modal-content{
	height: auto;
	min-height: 100%;
  display: flex;
  flex-direction: column;
	border-radius: 0;
	background-color: rgb(214, 255, 247) !important;
}

.modal-content span{
	font-size: 50px;
}

#accordion span{
	font-size: 30px;
}

#accordion h4{
	font-size: 18px;
	cursor: pointer;
}

@media (max-width:400px){
    .info h1{
    font-size: 35px;}

	.info p{
	font-size: 30px !important;}
}


	 .thumbnail{
	 	padding: 5px !important;
	 }
	 
	.bg-1, .bg-12{
	 background:rgb(255,255,255); 
	 z-index:1; 
	 position:relative;}
	 
	.bg-11{
		color: #fff;
		z-index:1; 
		position:relative;}
	 
	.bg-2{
	 background:#f5f5f5;
	 z-index:1; 
	 position:relative;}
	 
	.bg-3{
	 background:rgba(0,0,0,0.5);
	 color:#fff;
	 z-index:1; 
	 position:relative;}
	 
	.bg-4{
	 background:#111;
	 color:#999;
	 z-index:1; 
	 position:relative;}
	 
	 dt{
	  padding-top:15px;}
	 
	 dd{
	  padding-left:15px;}
	  
	 #work img{
	  width:100%;}  

#contacts p{
    font-family: AlegrayaSans;
    font-size: 50px;}
	
#contacts span{
    font-size: 30px;}
	  
.line{
    border-bottom:2px solid #1abc9c ;
    width:100px;}
    
	#photos {
   /* Prevent vertical gaps */
   line-height: 0;

   -webkit-column-count: 5;
   -webkit-column-gap:   0px;
   -moz-column-count:    5;
   -moz-column-gap:      0px;
   column-count:         5;
   column-gap:           0px;

}
#photos img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
  padding:5px;
}
#photos img:hover {
  
    -ms-transform: rotate(7deg); /* IE 9 */
    -webkit-transform: rotate(7deg); /* Chrome, Safari, Opera */
    transform: rotate(7deg);
}

@media (max-width: 1200px) {
  #photos {
  -moz-column-count:    4;
  -webkit-column-count: 4;
  column-count:         4;
  }
}
@media (max-width: 1000px) {
  #photos {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
}
@media (max-width: 800px) {
  #photos {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
}
@media (max-width: 400px) {
  #photos {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
}

/********** Pricing Table ************/
* {
    box-sizing: border-box;
}

/* Create three columns of equal width */
.columns {
    float: left;
    width: 33.3%;
    padding: 1px;
}

/* Style the list */
.price {
    list-style-type: none;
    border: 1px solid #eee;
    margin: 0;
    padding: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

/* Add shadows on hover */
.price:hover {
    box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2)
}

/* Pricing header */
.price .priceHeader {
    background-color: #111;
    color: white;
    font-size: 25px;
}

/* List items */
.price li {
    border-bottom: 1px solid #eee;
    padding: 10px;
    text-align: center;
}

/* Grey list item */
.price .grey {
    background-color: #eee;
    font-size: 20px;
}


/* Change the width of the three columns to 100% 
(to stack horizontally on small screens) */
@media only screen and (max-width: 600px) {
    .columns {
        width: 100%;
    }
}
/********** /Pricing Table ************/