*{padding:0; margin:0;}
html, body, div, span, h1, h2, h3, h4, h5, h6, p, ol, ul, li,
blockquote, pre, form, label, legend, table, caption, tbody, tfoot, thead,
tr, th, td, article, aside, canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, section, summary, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
body {
color: #fff;
font-size: 12px;
margin: 0;
padding: 0;
text-align: left;
font-family: Helvetica, Arial, sans-serif;
background-color: #000;
animation: fadein 2s;
-moz-animation: fadein 2s; /* Firefox */
-webkit-animation: fadein 2s; /* Safari and Chrome */
-o-animation: fadein 2s; /* Opera */
}
@keyframes fadein {
from {
opacity:0;
}
to {
opacity:1;
}
}
@-moz-keyframes fadein { /* Firefox */
from {
opacity:0;
}
to {
opacity:1;
}
}
@-webkit-keyframes fadein { /* Safari and Chrome */
from {
opacity:0;
}
to {
opacity:1;
}
}
@-o-keyframes fadein { /* Opera */
from {
opacity:0;
}
to {
opacity: 1;
}
}
#landingwrap {
position: absolute;
top:50%;
left:50%;
margin-top:-150px;
margin-left:-250px;
color:#fff;
}
/*.fadeInLoad {
border: 1px solid #48484A;
font-size: 40px;
*/
#logo {
width:130px;
height:130px;
background:url(img/naslogo2.png);
margin:0 auto;
animation: fadeInLoad 5s;
-webkit-animation: fadeInLoad 5s;
}
@keyframes fadeInLoad {
from {
opacity:0;
}
to {
opacity:1;
}
}
@-webkit-keyframes fadeInLoad {
from {
opacity:0;
}
to {
opacity:1;
}
}
#slogan h1 {
font-family: 'edwardian_script_itcregular';
font-size: 60px;
padding:20px;
margin-top:30px;
cursor: default;
animation: fadeInLoad 10s;
-webkit-animation: fadeInLoad 10s;
}
@keyframes fadeInLoad {
from {
opacity:0;
}
to {
opacity:1;
}
}
@-webkit-keyframes fadeInLoad {
from {
opacity:0;
}
to {
opacity:1;
}
}
#lang {
margin:0 auto;
margin-top:80px;
width:250px;
animation: fadeInLoad 15s;
-webkit-animation: fadeInLoad 15s;
}
@keyframes fadeInLoad {
from {
opacity:0;
}
to {
opacity:1;
}
}
@-webkit-keyframes fadeInLoad {
from {
opacity:0;
}
to {
opacity:1;
}
}
#lang a {
font-size: 12px;
padding:20px;
color:gray;
letter-spacing: 5px;
-webkit-transition-duration:1s;
-moz-transition-duration:1s;
-o-transition-duration:1s;
-ms-transition-duration:1s;
}
#lang a:hover {
color:white;
}
/*========================mainpage backgrounds========================== */
.background {
z-index: -1;
}
.cb-slideshow,
.cb-slideshow:after {
position: fixed;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
z-index: 0;
}
.cb-slideshow li span {
width: 100%;
height: 100%;
position: absolute;
top: 0px;
left: 0px;
color: transparent;
background-size: cover;
background-position: 50% 50%;
background-repeat: none;
opacity: 0;
z-index: 0;
-webkit-backface-visibility: hidden;
-webkit-animation: imageAnimation 36s linear infinite 0s;
-moz-animation: imageAnimation 36s linear infinite 0s;
-o-animation: imageAnimation 36s linear infinite 0s;
-ms-animation: imageAnimation 36s linear infinite 0s;
animation: imageAnimation 36s linear infinite 0s;
}
.cb-slideshow li div {
z-index: 999;
position: absolute;
bottom: 0px;
right: 0px;
width: 100%;
text-align: center;
opacity: 0;
color: #fff;
-webkit-animation: titleAnimation 36s linear infinite 0s;
-moz-animation: titleAnimation 36s linear infinite 0s;
-o-animation: titleAnimation 36s linear infinite 0s;
-ms-animation: titleAnimation 36s linear infinite 0s;
animation: titleAnimation 36s linear infinite 0s;
}
.cb-slideshow li div h3 {
font-size: 140px;
padding: 0;
color:#fff;
font-family: Arial, Helvetica, sans-serif;
font-weight:normal;
text-transform: uppercase;
}
.cb-slideshow li div h4 {
font-size: 100px;
padding: 0;
color:#fff;
font-family: Arial, Helvetica, sans-serif;
font-weight:normal;
text-transform: uppercase;
}
.cb-slideshow li:nth-child(1) span {
background-image:url(img/home/1a.jpg)
}
.cb-slideshow li:nth-child(2) span {
background-image:url(img/home/2a.jpg);
-webkit-animation-delay: 6s;
-moz-animation-delay: 6s;
-o-animation-delay: 6s;
-ms-animation-delay: 6s;
animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) span {
background-image:url(img/home/3a.jpg);
-webkit-animation-delay: 12s;
-moz-animation-delay: 12s;
-o-animation-delay: 12s;
-ms-animation-delay: 12s;
animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) span {
background-image:url(img/home/1a.jpg);
-webkit-animation-delay: 18s;
-moz-animation-delay: 18s;
-o-animation-delay: 18s;
-ms-animation-delay: 18s;
animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) span {
background-image:url(img/home/2a.jpg);
-webkit-animation-delay: 24s;
-moz-animation-delay: 24s;
-o-animation-delay: 24s;
-ms-animation-delay: 24s;
animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) span {
background-image:url(img/home/3a.jpg);
-webkit-animation-delay: 30s;
-moz-animation-delay: 30s;
-o-animation-delay: 30s;
-ms-animation-delay: 30s;
animation-delay: 30s;
}
/*.cb-slideshow li:nth-child(2) div {
-webkit-animation-delay: 6s;
-moz-animation-delay: 6s;
-o-animation-delay: 6s;
-ms-animation-delay: 6s;
animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) div {
-webkit-animation-delay: 12s;
-moz-animation-delay: 12s;
-o-animation-delay: 12s;
-ms-animation-delay: 12s;
animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) div {
-webkit-animation-delay: 18s;
-moz-animation-delay: 18s;
-o-animation-delay: 18s;
-ms-animation-delay: 18s;
animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) div {
-webkit-animation-delay: 24s;
-moz-animation-delay: 24s;
-o-animation-delay: 24s;
-ms-animation-delay: 24s;
animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) div {
-webkit-animation-delay: 30s;
-moz-animation-delay: 30s;
-o-animation-delay: 30s;
-ms-animation-delay: 30s;
animation-delay: 30s;
}*/
/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation {
0% { opacity: 0;
-webkit-animation-timing-function: ease-in; }
8% { opacity: 1;
-webkit-animation-timing-function: ease-out; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}
@-moz-keyframes imageAnimation {
0% { opacity: 0;
-moz-animation-timing-function: ease-in; }
8% { opacity: 1;
-moz-animation-timing-function: ease-out; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}
@-o-keyframes imageAnimation {
0% { opacity: 0;
-o-animation-timing-function: ease-in; }
8% { opacity: 1;
-o-animation-timing-function: ease-out; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}
@-ms-keyframes imageAnimation {
0% { opacity: 0;
-ms-animation-timing-function: ease-in; }
8% { opacity: 1;
-ms-animation-timing-function: ease-out; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}
@keyframes imageAnimation {
0% { opacity: 0;
animation-timing-function: ease-in; }
8% { opacity: 1;
animation-timing-function: ease-out; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation {
0% { opacity: 0 }
8% { opacity: 1 }
17% { opacity: 1 }
19% { opacity: 0 }
100% { opacity: 0 }
}
@-moz-keyframes titleAnimation {
0% { opacity: 0 }
8% { opacity: 1 }
17% { opacity: 1 }
19% { opacity: 0 }
100% { opacity: 0 }
}
@-o-keyframes titleAnimation {
0% { opacity: 0 }
8% { opacity: 1 }
17% { opacity: 1 }
19% { opacity: 0 }
100% { opacity: 0 }
}
@-ms-keyframes titleAnimation {
0% { opacity: 0 }
8% { opacity: 1 }
17% { opacity: 1 }
19% { opacity: 0 }
100% { opacity: 0 }
}
@keyframes titleAnimation {
0% { opacity: 0 }
8% { opacity: 1 }
17% { opacity: 1 }
19% { opacity: 0 }
100% { opacity: 0 }
}
/*LINKS*/
a {
outline: 0;
color: #fff;
}
ul {
list-style: none;
}
ol {
list-style: outside decimal;
margin: 20px 0 20px 20px;
}
a img {border: 0px; text-decoration: none;}
a:link, a:visited {
text-decoration: none;
}
a:hover, a:active {
text-decoration: none;
color: #878686;
}
/*LOGO*/
.logo a {
display: block;
width: 126px;
height: 95px;
background: url("../img/logo2-gallery.jpg") left top no-repeat;
}
/*MUSIC PLAYER*/
div.bgplayerui{ /* Audio player UI DIV */
position: absolute;
right: 0.5%;
padding-top:1%;
padding-right:40px;
width: 75px;
color: white;
float:right;
z-index: 50;
}
div.bgplayerui .play, div.bgplayerui .rewind{ /* Audio player UI buttons style */
cursor: pointer;
}
/*MENU NAVIGATION*/
.menu {
position: absolute;
width: 126px;
padding-left: 5px;
padding-right: 5px;
margin-top:40px;
margin-left:40px;
float:left;
background-color: #000;
z-index: 9999;
text-transform: uppercase;
}
.menu .accordion, .menu .accordion li {margin: 0; padding: 0; border: none;}
.menu .accordion a {
padding: 10px 10px 5px 5px;
text-decoration: none;
display: block;
color: #c7c7c7;
border-bottom: 1px solid #c7c7c7;
background-color: #000;
}
.menu .accordion ul a {padding: 10px 10px 10px 25px;}
.menu .accordion a:hover {background: #000;color:#fff;}
.hide {display:none;}
.menu .accordion li:last-child a {
padding-bottom:10px;
}
.borderoni {
border-bottom: none !important;
}
.child {
position: absolute;
margin-left:130px;
margin-top:-50px;
border-left: 1px solid #c7c7c7;
}
.child li a {
line-height: 0.2em;
height:2px;
border-bottom: 1px solid #c7c7c7;
}
.child li a span {
margin-left:-10px;
}
.child li:last-child a {
border:none !important;
}
/*BLOG*/
.singlepost, .blog-wrap {
width: 665px;
margin: 0 auto;
padding-top: 40px;
padding-left: 70px;
}
.news-back-link {
float: right;
}
.blog a, .blogpost a {
color: #fff;
}
.post, a.post-link {
color: #fff;
height: 200px;
position: relative;
}
.post {
padding: 20px 10px 20px 0;
}
.post h4 {
text-transform: uppercase;
}
.post-img img {
float: left;
width: 250px;
height: 200px;
text-align: center;
overflow: hidden;
margin-right: 20px;
}
.post-preview img, .post-preview iframe {
display: none;
}
.post-preview p {
color: #fff !important;
}
.post .line {
opacity: 0;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.post:hover .line {
opacity: 1;
}
.line {
width: 100%;
height: 1px;
background-color: #fff;
}
#post-title {
font-size: 1.7em;
}
.singlepost, .blog-wrap {
width: 665px;
margin: 0 auto;
padding-top: 40px;
padding-left: 70px;
font-family: Helvetica, Arial, sans-serif;
}
.singlepost {
line-height: 18px;
}
.singlepost ul {
list-style: square;
margin-left: 30px;
}
.singlepost a>img {
pointer-events: none;
}
.singlepost img {
max-width: 665px;
height: auto;
text-align: center;
overflow: hidden;
margin-bottom: 20px;
}
.singlepost p {
margin-bottom: 10px;
color: #fff !important;
}
.spacemaker {
height: 100px;
}
/*SLIDERS*/
#metaslider_108 {
display: block;
position: fixed;
left: 0;
top: 0;
overflow: hidden;
z-index: -999;
height: 100%;
width: 100%;
}
#metaslider_108 img {
margin-top: -45px;
}
#metaslider_108 .caption-wrap {
position: absolute;
padding: 10px;
bottom: 4%;
left: auto;
right: 5% !important;
background: black;
opacity: 1;
color: white;
margin: 0;
display: block;
width: 500px;
height: 120px;
line-height: 1.4em;
box-shadow: -1px -1px 5px #000;
display: none;
}
.metaslider {
max-width: 73% !important;
}
#metaslider_137, #metaslider_157, #metaslider_181, #metaslider_105, #metaslider_221, #metaslider_235 {
overflow: hidden;
}
#metaslider_137 .caption-wrap, #metaslider_157 .caption-wrap, #metaslider_181 .caption-wrap, #metaslider_105 .caption-wrap, #metaslider_221 .caption-wrap, #metaslider_235 .caption-wrap {
position: absolute;
padding: 10px;
bottom: -4%;
left: auto;
right: 1% !important;
background: black;
opacity: 1;
color: white;
margin: 0;
display: block;
width: 500px;
height: 120px;
line-height: 1.4em;
box-shadow: -1px -1px 5px #000;
overflow: hidden;
display: none;
}
#metaslider_108 .flex-direction-nav a {
top: 62%;
}
#info-click {
position: absolute;
right: 3%;
margin-right: 235px;
bottom: 0;
margin-bottom:100px;
z-index: 999;
cursor: pointer;
}
.page-id-32 #info-click {
right: 8.5%;
}
.metaslider-flex {
margin-top: 15px !important;
margin-left: 260px !important;
}
/*CONTACT PAGE*/
.contactbody img {width: 100%; height: 100%; position: absolute; overflow-y: hidden; }
.contact {
position:absolute;
top:40px;
left:50%;
width:600px;
margin-left:-300px;
text-align: center;
color:#fff;
font-size: 20px;
text-shadow:1px 1px #000;
}
.contact a {
color:#fff;
text-decoration: underline;
}
#socmedia {
margin-top:40px;
}
.social ul li {
margin-top: 20px;
margin-right: 20px;
display:inline-block;
}
.facebook {
width:30px;
height:30px;
background:url(../img/facebook.png);
}
.twitter {
width:30px;
height:30px;
background:url(../img/twitter.png);
}
.linkedin {
width:30px;
height:30px;
background:url(../img/linkedin.png);
}
.footer {
color:#fff;
position: absolute;
left:50%;
margin-left:-350px;
bottom:3%;
text-align: center;
width:700px;
text-shadow:1px 1px #000;
}
/*-----------------dealers--------------------------*/
.dealer {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #fdfdfd;
width: 664px;
padding-top: 40px;
margin:0 auto;
z-index: 9999;
position: absolute;
left: 33%;
}
.gmap {
width:600px;
height:450px;
margin:0 auto;
border:5px solid #fff;
}
.dealer ul {
margin-top:40px;
text-align: center;
line-height: 2em;
}
.dealer ul li span {
font-weight: bold;
}
.dealer ul li a {
color:#fff;
text-decoration: underline;
}
.dealer ul li:first-child {
text-transform: uppercase;
}
/*story*/
.story-wrapper {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #fdfdfd;
width: 664px;
padding-left: 70px;
padding-top: 40px;
text-align: justify;
line-height:1.3;
width: 665px;
margin: 0 auto;
}
.story-text {padding-top:30px;}
.story-text p {padding-bottom:10px;}
.signature {padding-top:20px;}
.nemanja-signature {
background-image: url(http://www.abbadesign.rs/wp-content/themes/ABBA%20Rebuild/img/story/nemanja-signature.png);
background-repeat: no-repeat;
background-position: left 30px;
height: 160px;
width: 183px;
text-align: left;
float: left;
}
.jovana-signature {
background-image: url(http://www.abbadesign.rs/wp-content/themes/ABBA%20Rebuild/img/story/jovana-signature.png);
background-repeat: no-repeat;
background-position: left top;
height: 160px;
width: 170px;
text-align: right;
float: right;
}
/*ERROR 404*/
.errmsg {
width: 60%;
margin: 0 auto;
text-align: center;
margin-top: 50px;
}
.errmsg h2 {
font-size: 20px;
margin-bottom: 20px;
}
.errmsg h3 {
font-size: 15px;
margin-bottom: 20px;
}
/*MOVIES*/
video#bgvid1 {
position: fixed; right: 0; bottom: 0;
min-width: 100%; min-height: 100%;
width: auto; height: auto; z-index: -100;
background-size: cover;
}
video#bgvid2 {
position: fixed; right: 0; bottom: 0;
min-width: 100%; min-height: 100%;
width: auto; height: auto; z-index: -100;
background-size: cover;
}
video#bgvid3 {
position: fixed; right: 0; bottom: 0;
min-width: 100%; min-height: 100%;
width: auto; height: auto; z-index: -100;
background-size: cover;
}
@media only screen and (max-width: 1600px) {
#metaslider_137 img, #metaslider_157 img, #metaslider_181 img, #metaslider_105 img, #metaslider_221 img, #metaslider_235 img {
max-height: 740px;
}
#info-click {
position: absolute;
right: 0;
bottom: 0;
margin-bottom:100px;
z-index: 999;
cursor: pointer;
}
}
@media only screen and (max-width: 1280px) {
#info-click {
position: absolute;
right: 0;
bottom: 0;
margin-bottom:60px;
z-index: 999;
cursor: pointer;
}
}
/*FONTS*/
@font-face {
font-family: 'before_the_rainregular';
src: url('fonts/beforetherain/beforetherain_personal_use_demo-webfont.eot');
src: url('fonts/beforetherain/beforetherain_personal_use_demo-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/beforetherain/beforetherain_personal_use_demo-webfont.woff') format('woff'),
url('fonts/beforetherain/beforetherain_personal_use_demo-webfont.ttf') format('truetype'),
url('fonts/beforetherain/beforetherain_personal_use_demo-webfont.svg#before_the_rainregular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'edwardian_script_itcregular';
src: url('fonts/edscript/itcedscr-webfont.eot');
src: url('fonts/edscript/itcedscr-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/edscript/itcedscr-webfont.woff') format('woff'),
url('fonts/edscript/itcedscr-webfont.ttf') format('truetype'),
url('fonts/edscript/itcedscr-webfont.svg#edwardian_script_itcregular') format('svg');
font-weight: normal;
font-style: normal;
}