﻿	/* -----------------------------------------------------
	 SITE-NAME
  AVR-MARINE
----------------------------------------------------- */

/* ===== GENERAL STYLES  ====== */
body { font-size:14px; color:#000; font-family: 'Open Sans', sans-serif; overflow-x: hidden;}
body.overflow-y{ overflow-y:hidden; }
a,
.btn,
a:hover,
.btn:hover {-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; cursor: pointer;}
a:hover,
a:focus { text-decoration:none;}
img { max-width:100%;}
figure img{width:100%;}
ul{	padding-left:0; }
ul li{ list-style:none;}

/* ===== TYPEOGRAPHY ====== */
h1, h2, h3, h4, h5, h6{ margin:0 0 15px; font-weight: 700; text-transform: uppercase; font-family: 'Quicksand', sans-serif;}
h2, h3, h4, h5, h6{color:#16335a;}
h1{ font-size:33px; color:#fff; }
h2,h3{ font-size:32px;}
h4{ font-size:22px;}
h5{ font-size:18px;}
h6{ font-size:16px; color:#0e2c43;}
p{ font-weight:300; color:#868686; margin-bottom:15px; font-size: 16px; line-height: 28px; }

.sub-heading{margin-bottom: 20px;}

/* ===== GLOBAL STYLES  ====== */
.section{padding: 65px 0;}
.btn{background-color: #16335a; padding: 14px 20px; font-size: 14px; color:#fff;}
.btn:hover,
.btn:focus{color:#fff; }


/*=======LIST-ITEMS====================*/
.arrow li{position: relative; padding-left: 15px;}
.arrow li a:before{position: absolute; content: "\f105"; left:0; top:0px; font-size: 17px; font-family: FontAwesome; color:#868686; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; color:#eeeeee;}
.arrow li a:hover::before{padding-left: 5px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; color:#ffd700;}
/* ===== FORM STYLES  ====== */
.form-group label{text-transform: uppercase; color: #16335a; font-weight: 600; font-size: 16px;}
.form-control{height: 40px;}
input[type="file"] {margin:10px 0; display: none;}
form .btn:hover{background-color:#16335a;}
.box label{width:100%;}

.js .inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    max-width: 100%;
    font-size: 1.25rem;
    /* 20px */
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    padding: 0.625rem 1.25rem;
    /* 10px 20px */
}

.inputfile-6 + label {
    color: #727b7d;
}

.inputfile-6 + label {
    border: 1px solid #ccc;
    background-color: #fff;
    padding: 0;
     -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease;
}

.inputfile-6:focus + label,
.inputfile-6.has-focus + label,
.inputfile-6 + label:hover {
    border-color: #722040;
}

.inputfile-6 + label span,
.inputfile-6 + label strong {
   height: 40px;
     -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease;
}

.inputfile-6 + label span {
    width:293px;
    min-height: 2em;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top;
    border-radius: 5px;  
    padding: 10px 190px 10px 5px;
}

.inputfile-6 + label strong {
    height:40px;
    color: #f1e5e6;
    background-color: #16335a;
    display: inline-block;
    padding: 10px;
     -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease;
    position: absolute;
    right: 15px;
    border:1px solid #16335a;
}


.inputfile-6:focus + label strong,
.inputfile-6.has-focus + label strong,
.inputfile-6 + label:hover strong {
    background-color: #16335a;
    border:1px solid #16335a;
     -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease;

}
form .content{margin-top: 25px;}

/*@media screen and (max-width: 50em) {
  .inputfile-6 + label strong {
    display: block;
  }
}*/

/* ===== HEADER ====== */
header{ position: absolute; z-index: 2; width: 100%;}
header .header-bg{background-color: rgba(255, 255, 255, 0.8); padding: 15px 50px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s;}
header .logo{float: left; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s;}
header .navbar-nav{float: right; padding: 30px 0; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s;}
header .navbar-nav li{padding-right: 25px;}
header .navbar-nav li:last-child{padding-right: 0;}
header .navbar-nav li a{color:#16335a; font-weight: 700;  text-transform: uppercase; position: relative; padding: 0px; font-family: 'Quicksand', sans-serif; padding: 10px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; display: inline-block;}
header .navbar-nav li a:hover,
header .navbar-nav li a.active{background-color: #16335a; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; color:#fff;}

header .header-bg.affix{padding: 5px 50px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s; background-color: #fff; width: 100%; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);}
header .header-bg.affix .logo{max-width: 220px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s; }
header .header-bg.affix .navbar-nav{padding: 20px 0 ; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s;}

header .navbar-nav > li > .dropdown-menu{margin-top: 30px; border: none;}
header .navbar-nav .caret{margin-left: 6px;}
header .navbar-nav li:hover .dropdown-menu{display: block;}
header .navbar-nav li .dropdown-menu li{padding-right: 0;}
header .navbar-nav > li > .dropdown-menu{padding: 0; margin-top: 0px;}
header .navbar-nav li .dropdown-menu li a{width: 100%;}
/* ===== BANNER ====== */

.banner .item{background-position: center center; background-size: cover; background-repeat: no-repeat; min-height: 100vh; position: relative; z-index: 0;}
.banner .owl-nav .owl-prev,
.banner .owl-nav .owl-next{font-size: 0;}
.banner .banner-content{text-align: center; position: absolute; top:55%; transform: translateY(-55%); -webkit-transform: translateY(-55%); -ms-transform: translateY(-55%); -moz-transform: translateY(-55%); left:0; right: 0;padding: 0 15px; }
.banner .banner-content h1{ letter-spacing: 6px; font-weight:700; line-height: 45px;}

/*.banner{
  -webkit-animation: zoonIn 20s infinite; 
  -moz-animation:    zoonIn 20s infinite; 
  -o-animation:      zoonIn 20s infinite; 
  animation:         zoonIn 20s infinite; 
}

@-webkit-keyframes zoonIn {
   0%   { transform: scale(1); }
  100%   { transform: scale(1.2);}
}
@-moz-keyframes zoonIn {
   0%   { transform: scale(1); }
  100%   { transform: scale(1.2);}
 
}
@-o-keyframes zoonIn {
   0%   { transform: scale(1); }
  100%   { transform: scale(1.2);}
 
}
@keyframes zoonIn {
   0%   { transform: scale(1); }
  100%   { transform: scale(1.2);}
 
}*/

/* ===== WELCOME ====== */
.welcome-block{text-align: center;}
.welcome-block h2{margin-bottom: 50px; position: relative;}
.welcome-block h2:after{position: absolute; content: ""; bottom:-15px; left:0; right:0; width: 100px; height: 3px; background-color: #16335a; margin: 0 auto;}
.welcome-block p{font-size: 16px; line-height: 24px;  max-width: 800px; margin:0 auto 30px;}
.welcome-block .company-blog{margin: 30px 0; display: inline-block; width: 100%;}
.welcome-block .company-blog li{float: left; width: 33.33%; position: relative;  height: 100%; }
.welcome-block .company-blog li a{display: block;}
.welcome-block .company-blog li img{width: 100%;}
.welcome-block .company-blog li .company-names{position: absolute;  left:0; right:0; color:#fff; margin: 0;  top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); z-index: 1; padding: 0 15px; }
.welcome-block .company-blog li h6{color:#ffd700;  font-size: 24px; margin-bottom: 0; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8);}
.welcome-block .company-blog li:hover h6{color:#fff;}
.welcome-block .company-blog li .company-link:before{position: absolute; content:""; top:0; left:0; right: 0; background-color: rgba(0, 0, 0, 0.5); height: 100%;  margin: 0 auto; width: 100%; transform:scale(0); -webkit-transform:scale(0); -ms-transform:scale(0); -moz-transform:scale(0); -webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -ms-transition: all 0.7s ease; transition: all 0.7s ease;}
.welcome-block .company-blog li .company-link:hover:before{transform:scale(1); -webkit-transform:scale(1); -ms-transform:scale(1); -moz-transform:scale(1);-webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -ms-transition: all 0.7s ease; transition: all 0.7s ease; z-index: 1; position: absolute;}
.welcome-block .company-link{position: relative; display: inline-block;}


/* ===== PRODUCT-BLOCK ====== */
.product-block{background-color: #f2f2f2;}
.product-block
.product-content{text-align: center;}
.product-content p{max-width: 800px; margin: 0 auto 20px;}
.product-block .product-types{ margin:20px 0 40px;}
.product-block .product-types p{font-size: 20px; margin-bottom: 0; padding: 10px; color:#fff; background-color:rgba(22, 51, 90, 0.8); text-transform: uppercase; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; position: absolute; bottom: 0; width: 100%; } 
.product-block .product-name{position: relative;}
.product-block .product-name:hover p{padding: 15px; background-color:rgba(22, 51, 90, 1); }


/* ===== OUR-BRANDS-BLOCK ====== */
.brands-block{text-align: center; }
.brands-block p{max-width: 700px; margin: 0 auto;}
.brands-block img{border:7px solid #ebebeb; margin-right: 30px;}
.brands-block img:last-child{margin-right: 0;}
.brands-block .brand-images{margin: 50px 0 20px;}

/* ===== TESTMONIALS-BLOCK ====== */

.testmonials{background-color: #f2f2f2; text-align: center;}
.testmonials .owl-nav{max-width: 200px; position: relative; left:0; right: 0; max-width: 100px; margin: 0 auto;}
.testmonials .owl-nav .owl-prev,
.testmonials .owl-nav .owl-next{font-size: 0; display: inline-block;}
.testmonials .owl-nav .owl-prev:before,
.testmonials .owl-nav .owl-next:after{position: absolute; font-family: FontAwesome; font-size: 60px; bottom:-60px;   content: ""; color:#16335a; cursor: pointer;}
.testmonials .owl-nav .owl-prev:before{content: "\f105"; right:0; }
.testmonials .owl-nav .owl-next:after{content: "\f104"; left:0; }
.testmonials #testmonials{margin: 50px 0 30px;}


/* ===== FOOTER ====== */

footer{background-color: #2c2727;}
footer img{ margin: 30px 0; padding: 10px;}
footer p{padding-right: 20px; color:#eeeeee;}
footer h4{color:#fff;}
footer .arrow{margin-top: 30px;}
footer .links-block{padding-left: 80px;}
footer .arrow li{margin-bottom: 15px; }
footer .contact{margin-top: 35px;}
footer .arrow li a{color:#eeeeee; font-size: 16px;}
footer .arrow li a:hover{color:#ffd700;}
footer .arrow li:hover::before {}
footer .contact li{ color:#eeeeee; margin-bottom: 15px;}
footer .contact li .adress{display: block;}
footer .contact li a{color:#eeeeee;}
footer .contact li a:hover{color:#ffd700;}
footer .footer-info{margin: 30px auto 10px; text-align: center; }
footer .footer-info li{display: inline-block; margin: 0 5px; }
footer .footer-info li a{border-radius: 50px; color: #ffffff; display: inline-block; font-size: 20px; height: 42px; line-height: 27px; padding: 5px; text-align: center; width: 42px; border:2px solid #fff; }
footer .footer-info li a:hover{background-color: #ffd700; color:#16335a; border:2px solid #ffd700;}

footer .copy-rights{text-align: center; padding-top: 50px;}
footer .copy-rights p{margin-bottom: 0;}

/*=========INNER-PAGES=========*/
.inner-banner{position: relative;min-height: 400px; background-repeat: no-repeat; background-size: cover; background-position: center;}
.inner-banner .inner-content{position: absolute; top:70%; transform: translateY(-70%); -webkit-transform: translateY(-70%); -moz-transform: translateY(-70%); -ms-transform: translateY(-70%); background-repeat: no-repeat; background-size: cover; background-position: center center; z-index: 1;}
.inner-banner:after{position: absolute; content: ""; top:0; left:0; right: 0; height:100%; width: 100%; background-color: rgba(0, 0, 0, 0.5);} 


/*=========ABOUT-US=========*/
.inner-page h2{text-align: center;}

.about-block .sub-heading{text-align: center;}
.about-block .about-company{ padding-top: 60px;}
.about-block h4 a{color:#16335a;}
.about-block img{border: 1px solid #cccccc; padding: 8px;}
.about-block .about-company figure img{max-width: 300px; margin-top: 40px;}

/*=========PRODUCT-PAGE=========*/
.product-names h5{text-transform: inherit; }
.product-names img{border:1px solid #cccccc; padding: 8px;}

.product-page ul li{ float: left; width: 32%; margin-right: 1%; margin-bottom: 1%; }
.product-page ul li img{ box-shadow: 0 0 10px rgba(0,0,0,0.2); }
.product-page h2{ text-align: left; margin-bottom: 30px; }
.product-page{ margin-bottom: 20px; }

.product-page.invitation ul li{width: 49%; margin-right: 1%; margin-bottom: 1%; }

/*=========GALLERY-PAGE=========*/
.popup-gallery li {float: left; width:25%;}
.filtr-list{text-align: center; margin: 40px 0 ;}
.filtr-list li{display: inline-block; padding:5px 15px; margin: 0 5px; cursor: pointer; background-color: #16335a; color:#fff; font-size: 18px;}
/*.filtr-list li.active{background-color: #ffd700; color:#16335a;}*/
.popup-gallery li a{display: inline-block; position: relative;}
.popup-gallery li a::after {background-color: rgba(0, 0, 0, 0.5);content: "";height: 100%;left: 0;position: absolute;
    right: 0;top: 0;width: 100%;  -webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -ms-transition: all 0.7s ease; transition: all 0.7s ease; opacity: 0;}
.popup-gallery li a:hover::after{ -webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -ms-transition: all 0.7s ease; transition: all 0.7s ease; opacity: 1;}
.popup-gallery li a:before{position: absolute; content: ""; background-image: url(images/zoom-icon.png); background-size: cover; background-repeat: no-repeat; background-position: center center; height: 72px; width: 70px; color:#fff; top:50%; left:0; right:0; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); z-index: 5; opacity: 0;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; margin:0 auto; text-align: center;}
.popup-gallery li a:hover:before{opacity: 1;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease;}

/*=========CONTACT-PAGE=========*/
.contact-page h2{margin-bottom: 40px;}
.contact-page .address-block a{color:#16335a;}
.contact-form iframe{width: 100%; min-height: 350px; border:0;}
.contact-form{padding-top: 60px;}
.contact-form form label{color:#16335a;}
.contact-form .btn{padding: 10px 20px;}
.contact-page  p span{display: block;}
.contact-page .mail{display: block; margin-top: 10px;}
.contact .phone span{ display: block; margin-top: 5px; font-size: 16px; }

/*=========CAREERS-PAGE=========*/
.careers-page .side-bar{background: #f7f7f7; border: 1px solid #16335a; padding: 20px; margin-bottom: 30px;}
.careers-page .side-bar h5{font-size: 16px; margin-bottom: 10px;}
.careers-page .side-bar p{font-weight: 600; margin-bottom: 10px;}
.careers-page .side-bar a{color:#16335a;}
.careers-page .contact-us{background-color:#16335a;  padding: 30px 20px; }
.careers-page .contact-us .text:hover{color: #fff;}
.careers-page .contact-us p,
.careers-page .contact-us h4{color:#fff;}
.careers-page .contact-us h4{margin-bottom: 10px;}
.careers-page .contact-us p,
.careers-page .contact-us a{color:#fff; margin-bottom: 10px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }
.careers-page .contact-us p i{padding-right:5px;}
.careers-page .contact-us p:hover a,
.careers-page .contact-us p:hover{color: #ffd700; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }
.careers-page .career-content{margin: 30px 0 50px;}

.imports header .header-bg { background-color: #ffffff; padding-top: 5px; padding-bottom: 5px;  box-shadow: 0 0 7px rgba(0, 0, 0, 0.25);}
.imports header .logo{opacity: 0;}

.imports .inner-banner::after{ content: none; }
.imports .inner-banner{ background-position: center bottom; background-size: 100%;}
.imports footer .contact li{ font-size: 16px; line-height: 26px; }