/* Please note: Twitter Bootrap files located under the framework folder of website. There are other CSS files found under that folder attached via the template */
/* For more information/documentation please visit: http://twitter.github.io/bootstrap/ */

/* Insert Main Styles Here */
    body {font-family: 'Open Sans', sans-serif;}
  #bodyArea{
                padding-top: 60px;
                padding-bottom: 40px;
            }
            
    
            
    .topjumbotron {background: url(http://www.osflo.co.nz/images/template/banner.jpg); background-size:cover; margin-bottom:0; height:580px; repeat:none;}
        /*IE 8 FIX*/
    /* .lt-ie9 .topjumbotron {height:580px;} */
    .bottomjumbotron {background: url(http://www.osflo.co.nz/images/template/bg.png); padding-top:30px; margin-bottom:0px;}
    .grey {padding:0; margin:0;}

    h1, h2, h3, a {color:#198e4a;}
    h1 {font-weight: 700;}
    .quote {background:#198E4A; padding:10px 0; font-weight: 700; }
    .quote h2 {color:#fff;}
    a:hover {color:#ccc;}
    hr {border:#fff;}
    
    .navbar-toggle {background:#000;}
    .home-button{margin-bottom:10px;} 
    .social{ background:url(http://www.osflo.co.nz/images/template/social.png) top left no-repeat; }
    ul.social-list li{  list-style:none; margin:2px; font-size:20px; color:#198E4A; margin-right:20px;}
    ul.social-list {margin:5px 0 0 0; }
    ul.social-list li{ margin:0 0 27px 0;}
    ul.social-list h2{font-size:38px; text-align: right;}
    .facebook{ width:34px; height:33px; background-position:-10px -96px; }
    .navbar-nav > li {font-size:17px;}
    .navbar-inverse {border-bottom:1px solid #ddd;}
    .navbar-inverse .navbar-nav > li > a:hover { background:#198e4d; color:#ffffff;}
    .navbar-collapse {max-height:1000px;}
/* contact form */    
.form-control {width:60%;}

.btn-default {
    border-radius: 0px;
    background: none repeat scroll 0 0 #238E4D;
    color: #FFFFFF;
    text-transform: uppercase;
    height: 40px;
    width: 200px;
    }
    
.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default {
    background-color: #EBEBEB;
    border-color: #ADADAD;
    color: #333333;
}

.row-grey {background:#505050;}
.row-green {background:#238E4D;}
.row-light {display:flex;}
.blockone {background:#505050; padding:10px 50px;}
.blocktwo {background:#238E4D; padding:10px 50px;}
.blockthree {background:#888888; padding:10px 50px;}
.blockfive {background:#238E4D; padding:10px 50px;}

.blockone h2{font-weight: 700; color:#D4D5D2; text-transform:uppercase;}
.blocktwo h2{font-weight: 700; color:#fff; text-transform:uppercase; }
.blockthree h2{font-weight: 700; color:#fff; text-transform:uppercase; }
.blockfive h2{font-weight: 700; color:#fff; text-transform:uppercase; }
.blocktwo-img h2{font-weight: 700;text-transform:uppercase;}
.blockfive-img h2{font-weight: 700;text-transform:uppercase; }
.blockone p {color:#D4D5D2; }
.blocktwo p{ color:#fff;}
.blocktwo-img {background: #fff url(http://www.osflo.co.nz/uploads/images/diagram.jpg) left bottom no-repeat; height:633px; }
.blockthree p { color:#fff;}
.blockone-img {background: #fff url(http://www.osflo.co.nz/uploads/images/leafs.jpg) right center no-repeat; height:633px; }
.blockthree-img  {background: #fff url(http://www.osflo.co.nz/uploads/images/diagram2.jpg) right center no-repeat; height:985px; background-size:contain;}
.blockfive p{  color:#fff;}
.blockfive-img p {}

.separador {
    background: none repeat scroll 0 0 #D4D5D2;
    display: block;
    height: 1px;
    line-height: 0;
    margin: 25px auto;
    width: 50px;
}


/* Icons and search */

.search-input {
    font-style: italic;
    height: 40px;
    line-height: 27px;
    margin-top: 0;
    padding: 10px;
    float: left;
    border:1px solid #4C4849;
    color:#4C4849;
    font-size:18px;
}

.icon-search {
    background: url(http://www.osflo.co.nz/images/template/search.jpg) repeat scroll transparent!important;
    display: block;
    height: 40px;
    width: 40px!important;
    border: none;
    float: left;
    font-size: 0;
    padding:0!important;
}
.cms_form {
    padding-bottom:20px;
}

input{height:50px;}
input, button, select, textarea {     -webkit-appearance: none;
  -webkit-border-radius: 0;}
/*footer*/
footer {background:#2D2F35; color:#fff; padding:20px; margin-top:20px;}
.cropping-tips footer {margin-top:0;}
.footercertimg {text-align: right;}

.img-inline {display:inline; margin:10px;  vertical-align: bottom;}

.crop-table

.crop-table table, .crop-table td, .crop-table th
{
border:1px solid #fff;
border-collapse:collapse;
padding:10px;
}

.search-outer {
    position: relative;
    width: 100%;
    height: 50px;
}

.search-outer .fa {
    vertical-align: top;
    padding-top: 10px;
}

.search-outer .search-button,
.search-outer .search-icon {
    position: absolute;
    top: 0;
    right: 0;
    height: 40px;
    width: 40px;
    border: none;
}

.search-outer .search-button {
    z-index: 20;
    font-size: 0;
    background: rgba(255,255,255, 0.3);
    border: 1px solid #000000;
}

.search-outer .search-icon {
    z-index: 30;
    text-align: center;
    background: #000000;
    color: #ffffff;
}

.search-outer.open .search-icon {
    z-index: 15;
}

.search-outer .search-text {
    position: absolute;
    top: 0;
    right: 0;
    height: 40px;
    z-index: 10;
    background: #ffffff;
    border: 1px solid #000000;
    width: 0;
    -webkit-transition: width 0.6s; /* Safari */
    transition: width 0.6s;
    padding-right: 0;
    padding-left: 0;
    font-style: italic;
    font-size: 16px;
}

.search-outer.open .search-text {
    width: 100%;
    padding-right: 45px;
    padding-left: 5px;
}
    
  @media only screen and (min-width: 1600px) {  .blockone,.blockthree{padding-right:350px;} .blocktwo {padding-left:350px;}  .blocktwo-img {padding:50px  300px 0 300px;}
  .margin-top{margin-top:25px;}
  }
    @media only screen and (min-width: 991px) {.margin-top{margin-top:25px;}}
  
    /* Between  768px and 991px */
@media(min-width:768px) and (max-width:991px){ .topjumbotron {height:400px;}}
    
    	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {.topjumbotron {height:400px;} .navbar-nav > li {font-size:12px;}}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {.topjumbotron {height:300px;}  .navbar-nav > li {font-size:12px;}}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
	    .jumbotron.grey {
	        text-align: center;
	    }
	    .navbar-nav > li {
	        font-size:12px;
        }
        
        .jumbo-logo {
            margin: 0 auto;
            max-height: 100px;
        }
	
	    ul.social-list h2 {
	        margin: 0 auto;
	        text-align: center;
	    }
	
	    ul.social-list li {
	        margin-bottom: 10px;
	    }
    }

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) { .topjumbotron {height:300px;}}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) { .form-control {width:100%;} .footercertimg {text-align: left;}
	ul.social-list {padding:0;}

	
	}
	
	.tel-style:hover{color:#198e4a;text-decoration:none;border:none;}
	.icon-bar{margin:0 auto;}
    .image-products{display:block;margin-left:auto;margin-right:auto;}
	
	
	
	
/* Stylesheet: TwitterBootsrap Modified On 2016-10-20 15:18:58 */
.form-horizontal .control-label {text-align: left;}
/* Stylesheet: Form Modified On 2014-03-24 14:02:06 */
