* { margin: 0; padding: 0; outline: 0; } body, html { height:100%; background:transparent; } body {font-size:16px; font-family: 'Quicksand', sans-serif; font-weight:300; color:#c7c7c7; line-height:1.4em; width:100%; overflow-x:hidden; background:#121212; } .wrapper { width:100%; overflow-x:hidden; } .shell { width:100%; margin:0 auto; overflow:hidden; } .header { padding-bottom:0px; position:fixed; background:url(../img/headerbg.png) top center; background-repeat:repeat-x; width:100%; height:96px; z-index:1000; -moz-transition:all 0.4s ease-out; -ms-transition: all 0.4s ease-out; -o-transition:all 0.4s ease-out; transition:all 0.4s ease-out; } .header .shell { width:100%;} .header-top { height:125px; } a { text-decoration:none; -webkit-transition:color 0.25s ease-out; -moz-transition:color 0.45s ease-out; -ms-transition:color 0.45s ease-out; -o-transition:color 0.45s ease-out; transition: color 0.45s ease-out; color:#c7c7c7; } a:hover { text-decoration:none; -webkit-transition:color 0.25s ease-out; -moz-transition:color 0.45s ease-out; -ms-transition:color 0.45s ease-out; -o-transition:color 0.45s ease-out; transition: color 0.45s ease-out; color:#990b5f; } /* PreLoader */ .spinner-wrapper { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #ffffff; z-index: 999999; } .spinner { width: 50px; height: 50px; background-color: #990b5f; -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out; animation: sk-rotateplane 1.2s infinite ease-in-out; position: absolute; top: 48%; left: 48%; } @-webkit-keyframes sk-rotateplane { 0% { -webkit-transform: perspective(120px) } 50% { -webkit-transform: perspective(120px) rotateY(180deg) } 100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg) } } @keyframes sk-rotateplane { 0% { transform: perspective(120px) rotateX(0deg) rotateY(0deg); -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg) } 50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) } 100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } } /* Header Scroll Movement */ .headeractive { !important; transition:background linear; height:55px; transform:translateY(0px); -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -ms-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out; -webkit-transition: all 0.4s ease-in; -moz-transition:all 0.4s ease-in; -ms-transition:all 0.4s ease-in; -o-transition:all 0.4s ease-in; transition:all 0.4s ease-in; -webkit-transform: translateY(0px); } /* Menu Scroll Movement */ .menuactive { !important; transition:background linear; height:35px; transform:translateY(-57px); -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -ms-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out; -webkit-transition: all 0.4s ease-in; -moz-transition:all 0.4s ease-in; -ms-transition:all 0.4s ease-in; -o-transition:all 0.4s ease-in; transition:all 0.4s ease-in; -webkit-transform: translateY(-57px); } /* Logo Scroll Movement */ .logoactive { !important; transition:background linear; height:35px; -webkit-transition: all 0.7s ease-out; -webkit-transform: scale(0.3) rotate(0.01deg) translateY(-1300px) translateX(0px); transform: scale(0.3) rotate(0.01deg) translateY(-1300px) translateX(0px); -moz-transition: all 0.7s ease-out; -ms-transition: all 0.7s ease-out; -o-transition: all 0.7s ease-out; transition: all 0.7s ease-out; -webkit-transition: all 0.4s ease-in; -moz-transition:all 0.4s ease-in; -ms-transition:all 0.4s ease-in; -o-transition:all 0.4s ease-in; transition:all 0.4s ease-in; } /* Hubright Scroll Movement */ .hubrightactive { !important; transition:background linear; height:35px; transform:translateY(-57px); -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -ms-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out; -webkit-transition: all 0.4s ease-in; -moz-transition:all 0.4s ease-in; -ms-transition:all 0.4s ease-in; -o-transition:all 0.4s ease-in; transition:all 0.4s ease-in; -webkit-transform: translateY(-57px); } /* Hubleft Scroll Movement */ .hubleftactive { !important; transition:background linear; height:35px; transform:translateY(-57px); -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -ms-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out; -webkit-transition: all 0.4s ease-in; -moz-transition:all 0.4s ease-in; -ms-transition:all 0.4s ease-in; -o-transition:all 0.4s ease-in; transition:all 0.4s ease-in; -webkit-transform: translateY(-57px); } article, aside, details, footer, header, menu, nav, section { display: block; } input, textarea, select { font-size: 12px; font-family: arial, sans-serif; } textarea { overflow: auto; } .cl { display: block; height: 0; font-size: 0; line-height: 0; text-indent: -4000px; clear: both; } .notext { font-size: 0; line-height: 0; text-indent: -4000px; } .left, .alignleft { float: left; display: inline; } .right, .alignright { float: right; display: inline; } .lists { margin-left:40px; } .listitem { padding-bottom:10px; } /* ----- Text (COMPUTER) ----- */ h1 { font-size:16px; font-family:'Quicksand', sans-serif; font-weight:400; color:#c7c7c7; line-height:1.4em; } h1 a { font-size:16px; font-family: 'Quicksand', sans-serif; font-weight:400; color:#c7c7c7; } h1 a:hover { font-size:16px; font-family: 'Quicksand', sans-serif; font-weight:400; color:#990b5f } h2 { font-size:50px; font-family:'Quicksand', sans-serif; font-weight:400; color:#ffffff; line-height:1.0em; } h2 a { font-size:50px; font-family: 'Quicksand', sans-serif; font-weight:400; color:#ffffff; } h2 a:hover { font-size:50px; font-family: 'Quicksand', sans-serif; font-weight:400; color:#990b5f; } h3 { font-size:18px; font-family:'Overpass', sans-serif; font-weight:400; color:#ffffff; line-height:1.4em; } h3 a { font-size:18px; font-family: 'Overpass', sans-serif; font-weight:400; color:#ffffff; } h3 a:hover { font-size:18px; font-family: 'Overpass', sans-serif; font-weight:400; color:#990b5f; } h4 { font-size:31px; font-family:'Oxygen', sans-serif; font-weight:300; color:#ffffff; line-height:1.0em; } h4 a { font-size:31px; font-family: 'Oxygen', sans-serif; font-weight:300; color:#ffffff; } h4 a:hover { font-size:31px; font-family: 'Oxygen', sans-serif; font-weight:300; color:#990b5f; } h5 { font-size:16px; font-family:'Maven Pro', sans-serif; font-weight:700; color:#231f20; line-height:0.8em; } h5 a { font-size:16px; font-family: 'Maven Pro', sans-serif; font-weight:700; color:#231f20; } h5 a:hover { font-size:16px; font-family: 'Maven Pro', sans-serif; font-weight:470000; color:#990b5f; } h6 { font-size:12px; font-family:'Quicksand', sans-serif; font-weight:400; color:#4f4f4f; line-height:1.4em; } h6 a { font-size:12px; font-family: 'Quicksand', sans-serif; font-weight:400; color:#4f4f4f; } h6 a:hover { font-size:12px; font-family: 'Quicksand', sans-serif; font-weight:400; color:#990b5f; } /* ----- Graphics (COMPUTER) ----- */ .entry {clear:both; padding:0px;} .entry img {max-width: 100%; display:block; margin-left:auto; margin-right:auto; padding-top:5px; padding-top:5px; padding-right:0px; padding-left:0px;} #logo {width:981px; height:auto; z-index:1000; margin-top:150px; left:50%; margin-left:-490px; position:absolute; -webkit-transition: all 0.7s ease-out; -moz-transition:all 0.4s ease-out; -ms-transition:all 0.4s ease-out; -o-transition:all 0.4s ease-out; transition:all 0.4s ease-out;} #signature { float:right; padding-bottom:50px; } #postidol { margin-bottom:-8px; } /* ----- Layout (COMPUTER) ----- */ #menu { position:absolute; width:960px; left:50%; margin-top:98px; margin-left:-410px; position:absolute; z-index:1000; -webkit-transition: all 0.7s ease-out; -moz-transition:all 0.4s ease-out; -ms-transition:all 0.4s ease-out; -o-transition:all 0.4s ease-out; transition: all 0.4s ease-out; } #contactbutton { display:none; visibility:hidden; } #hubleft { width:370px; float:left; margin-top:4px; margin-left:50px; -webkit-transition: all 0.7s ease-out; -moz-transition:all 0.4s ease-out; -ms-transition:all 0.4s ease-out; -o-transition:all 0.4s ease-out; transition: all 0.4s ease-out; } #hubright { width:220px; float:right; margin-top:4px; margin-right:50px; -webkit-transition: all 0.7s ease-out; -moz-transition:all 0.4s ease-out; -ms-transition:all 0.4s ease-out; -o-transition:all 0.4s ease-out; transition: all 0.4s ease-out; } .rslides { width:100%; height:970px; position:absolute; background-attachment:scroll; margin-top:0px; z-index:0; } #home1 { width:100%; height:900px; padding-bottom:40px; } #featuredbox { width:420px; height:auto; position:relative; margin-left:15%; margin-top:18%; } #subbox1 { width:100%; min-height:400px; height:auto; background:#121212; margin-top:0px; padding-top:50px; padding-bottom:0px; position:relative; z-index:0; } #boxtop1 { background-image:url(../img/boxtop1.png); background-repeat:repeat-x; background-position:top center; width:100%; height:550px; margin-top:-210px; position:absolute; z-index:1; } #content1 { width:80%; margin-top:80px; left:50%; margin-left:-40%; position:relative; z-index:100; display:block; } #subbox2 { width:100%; min-height:300px; height:auto; margin-top:0px; padding-bottom:0px; padding-top:0px; position:relative; z-index:0; background:transparent; display:block; } #boxtop2 { background-image:url(../img/boxtop2.png); background-repeat:repeat-x; background-position:top center; width:100%; height:105px; margin-top:-50px; position:absolute; z-index:1; } #home2 { width:100%; height:300px; padding-bottom:40px; } #featuredbox2 { width:100%; height:auto; position:relative; left:50%; margin-left:-50%; margin-top:2%; } #contactboxleft {float:left; width:75%; height:auto; min-height:800px; } #contactboxright{float:right; width:25%; margin-top:30px; } .main { padding: 2px 0 2px 0; overflow:hidden;} .main .content { padding-left: 0px; padding-right: 10px; overflow:hidden;} .main .content span { text-decoration: underline; overflow:hidden; } .main .cols { margin-top:-50px; padding-left:0px; padding-right:0px; width:100%; padding-bottom:40px; position:relative; z-index:150; } .main .cols .col { width:10%; display:inline-block; vertical-align:text-top; padding:15px; } .main .cols .col + .col { margin-left:5%; } .main .cols .col img { width:auto; } .main .cols2 { margin-top:0px; padding-left:0px; padding-right:0px; width:100%; padding-bottom:40px; text-align:center; position:relative; z-index:150; } .main .cols .col2 { width:73%; display:inline-block; vertical-align:text-top; padding:15px; } .main .cols .col + .col2 { margin-left:3%; } .main .cols2 .col2 img { width:auto; } /* ----- Footer ------ */ #footer { min-height:200px; height:auto; padding-top:30px; margin-top:0px; width:100%; left:50%; margin-left:-50%; position:relative; overflow-x:hidden; background:#141414; z-index:0; } #footer .shell { padding: 10px; } #footer .cols { width:90%; left:50%; margin-left:-45%; position:relative; } #footer .cols .col1 { width:240px; float:left; display:inline-bock; position:relative; } #footer .cols .col2 { width:auto; float:left; display:inline-bock; position:relative; margin-left:7%; } #footer .cols .col3 { width:auto; float:left; display:inline-bock; position:relative; margin-left:7%; } #footer .cols .col4 { width:auto; float:left; display:inline-bock; position:relative; margin-left:7%; } #footer .cols .col5 { width:auto; float:right; display:inline-bock; position:relative; } #footerlogo { width:251px; height:auto; } #line { width:100%; height:1px; border-bottom:dotted 1px #b1b1b1; margin-bottom:10px; } #footer .cols .col1 p { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.6em; } #footer .cols .col1 p a { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.6em; } #footer .cols .col1 p a:hover { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#990b5f; line-height:1.6em; } #footer .cols .col2 p { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.6em; } #footer .cols .col2 p a { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.6em; } #footer .cols .col2 p a:hover { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#990b5f; line-height:1.6em; } #footer .cols .col3 p { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.6em; } #footer .cols .col3 p a { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.6em; } #footer .cols .col3 p a:hover { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#990b5f; line-height:1.6em; } #footer .cols .col4 p { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.6em; } #footer .cols .col4 p a { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.6em; } #footer .cols .col4 p a:hover { font-size:15px; font-family: 'Overpass', sans-serif; font-weight:300; color:#990b5f; line-height:1.6em; } #footer .cols .col5 p { font-size:13px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.4em; } #footer .cols .col5 p a { font-size:13px; font-family: 'Overpass', sans-serif; font-weight:300; color:#b1b1b1; line-height:1.4em; } #footer .cols .col5 p a:hover { font-size:13px; font-family: 'Overpass', sans-serif; font-weight:300; color:#990b5f; line-height:1.4em; } /* ================================================== #Media Queries ================================================== */ /* 1680 display */ @media only screen and ( min-width: 1380px) and ( max-width: 1690px ) { #hubleft { width:370px; float:left; margin-top:4px; margin-left:10px; } #hubright { width:220px; float:right; margin-top:4px; margin-right:-10px; } } /* 1366 display */ @media only screen and ( min-width: 1285px) and ( max-width: 1379px ) { #hubleft { width:370px; float:left; margin-top:4px; margin-left:10px; } #hubright { width:220px; float:right; margin-top:4px; margin-right:-10px; } } /* 1280 display */ @media only screen and ( min-width: 1025px) and ( max-width: 1284px ) { #hubleft { width:370px; float:left; margin-top:4px; margin-left:10px; } #hubright { width:220px; float:right; margin-top:4px; margin-right:-10px; } } /* tablet landscape */ @media only screen and ( min-width: 981px) and ( max-width: 1024px ) { #hubleft { width:370px; float:left; margin-top:4px; margin-left:10px; } #hubright { width:220px; float:right; margin-top:4px; margin-right:-10px; } #footer .cols .col4 { width:auto; float:left; display:inline-bock; position:relative; margin-top:-70px; margin-left:5%; } } /* tablet portrait */ @media only screen and ( min-width: 645px) and ( max-width: 980px ) { #menu { position:absolute; width:100%; left:50%; margin-top:98px; margin-left:-50%; position:absolute; z-index:1000; -webkit-transition: all 0.7s ease-out; -moz-transition:all 0.4s ease-out; -ms-transition:all 0.4s ease-out; -o-transition:all 0.4s ease-out; transition: all 0.4s ease-out; } #contactbutton { display:block; visibility:visible; } #hubleft { width:370px; float:left; margin-top:4px; margin-left:10px; } #hubright { width:220px; float:right; margin-top:4px; margin-right:-10px; } #subbox1 { width:100%; min-height:400px; height:auto; background:#121212; margin-top:0px; padding-top:0px; padding-bottom:0px; position:relative; z-index:0; } #content1 { width:98%; margin-top:80px; left:50%; margin-left:-49%; position:relative; z-index:100; display:block; } #footer .cols .col1 { width:240px; float:left; display:inline-bock; position:relative; } #footer .cols .col2 { width:auto; float:left; display:inline-bock; position:relative; margin-left:7%; } #footer .cols .col3 { width:auto; float:left; display:inline-bock; position:relative; margin-top:50px; margin-left:7%; } #footer .cols .col4 { width:auto; float:left; display:inline-bock; position:relative; margin-top:-50px; margin-left:0%; } #footer .cols .col5 { width:auto; float:right; display:inline-bock; position:relative; } } /* Phone*/ @media only screen and ( min-width: 410px) and ( max-width: 644px ) { /* Logo Scroll Movement */ .logoactive { !important; transition:background linear; height:35px; -webkit-transition: all 0.7s ease-out; -webkit-transform: scale(0.6) rotate(0.01deg) translateY(-300px) translateX(0px); transform: scale(0.6) rotate(0.01deg) translateY(-300px) translateX(0px); -moz-transition: all 0.7s ease-out; -ms-transition: all 0.7s ease-out; -o-transition: all 0.7s ease-out; transition: all 0.7s ease-out; -webkit-transition: all 0.4s ease-in; -moz-transition:all 0.4s ease-in; -ms-transition:all 0.4s ease-in; -o-transition:all 0.4s ease-in; transition:all 0.4s ease-in; } #logo {width:98%; height:auto; z-index:1000; margin-top:110px; left:50%; margin-left:-49%; position:absolute; -webkit-transition: all 0.7s ease-out; -moz-transition:all 0.4s ease-out; -ms-transition:all 0.4s ease-out; -o-transition:all 0.4s ease-out; transition:all 0.4s ease-out;} #menu { position:absolute; width:100%; margin-top:98px; margin-left:-91.5%; left:50%; position:absolute; z-index:1000; } #contactbutton { display:block; visibility:visible; } #hubleft { display:none; visibility:hidden; } #hubright { display:none; visibility:hidden; } .rslides { width:100%; height:570px; position:absolute; background-attachment:scroll; margin-top:0px; z-index:0; } #home1 { width:100%; height:500px; padding-bottom:40px; } #featuredbox { width:420px; height:auto; position:relative; margin-left:15%; margin-top:18%; } #subbox1 { width:100%; min-height:400px; height:auto; background:#121212; margin-top:0px; padding-top:0px; padding-bottom:0px; position:relative; z-index:0; } #content1 { width:98%; margin-top:80px; left:50%; margin-left:-48%; position:relative; z-index:100; display:block; } #footerlogo { display:none; visibility:hidden; } #footer .cols .col1 { width:98%; float:left; display:inline-bock; position:relative; } #footer .cols .col2 { width:98%; float:left; display:inline-bock; position:relative; margin-top:50px; margin-left:0%; } #footer .cols .col3 { width:98%; float:left; display:inline-bock; position:relative; margin-top:50px; margin-left:0%; } #footer .cols .col4 { width:98%; float:left; display:inline-bock; position:relative; margin-top:50px; margin-left:0%; } #footer .cols .col5 { width:98%; float:left; display:inline-bock; position:relative; margin-top:50px; text-align:left; } } /* Phone*/ @media only screen and ( min-width: 320px) and ( max-width: 409px ) { /* Logo Scroll Movement */ .logoactive { !important; transition:background linear; height:35px; -webkit-transition: all 0.7s ease-out; -webkit-transform: scale(0.6) rotate(0.01deg) translateY(-300px) translateX(0px); transform: scale(0.6) rotate(0.01deg) translateY(-300px) translateX(0px); -moz-transition: all 0.7s ease-out; -ms-transition: all 0.7s ease-out; -o-transition: all 0.7s ease-out; transition: all 0.7s ease-out; -webkit-transition: all 0.4s ease-in; -moz-transition:all 0.4s ease-in; -ms-transition:all 0.4s ease-in; -o-transition:all 0.4s ease-in; transition:all 0.4s ease-in; } #logo {width:98%; height:auto; z-index:1000; margin-top:110px; left:50%; margin-left:-49%; position:absolute; -webkit-transition: all 0.7s ease-out; -moz-transition:all 0.4s ease-out; -ms-transition:all 0.4s ease-out; -o-transition:all 0.4s ease-out; transition:all 0.4s ease-out;} #menu { position:absolute; width:100%; margin-top:98px; margin-left:-91.5%; left:50%; position:absolute; z-index:1000; } #contactbutton { display:block; visibility:visible; } #hubleft { display:none; visibility:hidden; } #hubright { display:none; visibility:hidden; } .rslides { width:100%; height:570px; position:absolute; background-attachment:scroll; margin-top:0px; z-index:0; } #home1 { width:100%; height:500px; padding-bottom:40px; } #featuredbox { width:420px; height:auto; position:relative; margin-left:15%; margin-top:18%; } #subbox1 { width:100%; min-height:400px; height:auto; background:#121212; margin-top:0px; padding-top:0px; padding-bottom:0px; position:relative; z-index:0; } #content1 { width:98%; margin-top:80px; left:50%; margin-left:-48%; position:relative; z-index:100; display:block; } #footerlogo { display:none; visibility:hidden; } #footer .cols .col1 { width:98%; float:left; display:inline-bock; position:relative; } #footer .cols .col2 { width:98%; float:left; display:inline-bock; position:relative; margin-top:50px; margin-left:0%; } #footer .cols .col3 { width:98%; float:left; display:inline-bock; position:relative; margin-top:50px; margin-left:0%; } #footer .cols .col4 { width:98%; float:left; display:inline-bock; position:relative; margin-top:50px; margin-left:0%; } #footer .cols .col5 { width:98%; float:left; display:inline-bock; position:relative; margin-top:50px; text-align:left; } }