/*
Name: Laruspalas HTML5
Date: March 2012
Description: Laruspalas website + ipad compatible
Version: 1.0
Author: Ahmet Sali
Autor URI: ahmetsali@gmail.com
*/
/* Imports */
@import url("reset.css");
/* GLOBAL
----------------------------------------------------------*/
/* Body */
html { width:100%; height:100%; }
body { color: #1a1a1a; font-size: 12px; font-family: 'Open Sans', Arial, Helvetica, sans-serif; line-height: 1.429; margin: 0; padding: 0; text-align: left; background: #000 url(../images/bckg/body-bg.png) left top no-repeat; }
/* Headings */
h2 { font-size: 1.571em } /* 22px */
h3 { font-size: 1.429em } /* 20px */
h4 { font-size: 1.286em } /* 18px */
h5 { font-size: 1.143em } /* 16px */
h6 { font-size: 1em } /* 14px */
h2, h3, h4, h5, h6 { font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-weight: bold; line-height: 1.1; margin-bottom: .8em; }
/* Anchors */
a { outline: 0; }
a img { border: 0px; text-decoration: none; }
a:link, a:visited { color: #C74350; text-decoration: none; }
a:hover, a:active { color: #C74350; }
/* Paragraphs */
p { margin-bottom: 1.143em; }
* p:last-child { margin-bottom: 0; }
strong, b { font-weight: bold; }
em, i { font-style: italic; }
::-moz-selection { background: #C03; color: #fff; text-shadow:none; }
::selection { background: #C03; color: #fff; text-shadow:none; }
/* Lists */
ul { list-style: outside disc; margin: 1em 0 1.5em 1.5em; }
ol { list-style: outside decimal; margin: 1em 0 1.5em 1.5em; }
dl { margin: 0 0 1.5em 0; }
dt { font-weight: bold; }
dd { margin-left: 1.5em; }
/* Quotes */
blockquote { font-style: italic; }
cite { }
q { }
/* Tables */
table { margin: .5em auto 1.5em auto; width: 98%; }
/* Thead */
thead th { padding: .5em .4em; text-align: left; }
thead td { }
/* Tbody */
tbody td { padding: .5em .4em; }
tbody th { }
tbody .alt td { }
tbody .alt th { }
/* Tfoot */
tfoot th { }
tfoot td { }
/* HTML5 tags */
header, section, footer, aside, nav, article, figure, hgroup { display: block; }
/* Helpers */
.clear { clear:both; }
.center { text-align:center; margin:30px auto;}
img.center { margin: 10px 0 20px 100px !important; }
.left { float:left; }
.right { float:right; }
.alignleft { float:left; margin-right:20px; }
.alignright { float:right; margin-left:20px; }
.aligncenter { text-align:center; }
.half { width:50%; }
.triple { width:33%; }
.no-display { display:none; }
.no-border { border:none !important; }
.no-bg { background:none !important ; }
.no-bg-img { background-position: 1000px 1000px !important; }
.text-justify { text-align:justify; }
.no-margin { margin:0 !important; }
.visible { display:block; }
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }
.loading { position:absolute; top:0; left:0; width:100%; height:100%; background:url(../images/bckg/loading.gif) center center no-repeat; z-index:0; }
.easing, .box, .wrapper { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
/* partial image load */
.image-wrap { position:relative; }
.image-wrap img { display:none; }
/* TIPSY TOOLTIP
----------------------------------------------------------*/
.tipsy { padding: 5px; font-size: 10px; font-weight:bold; position: absolute; z-index: 1000; }
.tipsy-inner { padding: 5px 8px; color: #fff; text-shadow: 0 1px 0 rgba(53, 40, 96, .9); max-width: 200px; text-align: center; background:url(../images/bckg/tip-body.png) 0 0 repeat-x; }
.tipsy-inner { border-radius: 4px; -moz-border-radius:4px; -webkit-border-radius:4px; }
.tipsy-arrow { position: absolute; background: url(../images/bckg/tipsy.gif) no-repeat top left; width: 9px; height: 5px; }
.tipsy-n .tipsy-arrow { top: 0; left: 50%; margin-left: -4px; }
.tipsy-nw .tipsy-arrow { top: 0; left: 10px; }
.tipsy-ne .tipsy-arrow { top: 0; right: 10px; }
.tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -4px; background-position: bottom left; }
.tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; background-position: bottom left; }
.tipsy-se .tipsy-arrow { bottom: 0; right: 10px; background-position: bottom left; }
.tipsy-e .tipsy-arrow { top: 50%; margin-top: -4px; right: 0; width: 5px; height: 9px; background-position: top right; }
.tipsy-w .tipsy-arrow { top: 50%; margin-top: -4px; left: 0; width: 5px; height: 9px; }
/* LAYOUT
----------------------------------------------------------*/
.wrapper { position:relative; width:960px; margin:0 auto; z-index:100; }
img.right, figure.right { float: right; margin: 0 0 2em 2em; }
img.left, figure.left { float: right; margin: 0 0 2em 2em; }
.boxes { width:100%; }
.boxes .box { position:relative; float:left; width:131px; margin: 0 4px 4px 0; height:120px; border:1px solid #ddd; overflow:hidden; background-color:#fff; }
.boxes .box.has-image { cursor:pointer; border-color:#777; }
.boxes .box.has-image img { display:none; }
.boxes .box.alt { display:none; }
.boxes .box a { display:block; width:100%; height:100%; }
.boxes .box.menu-item { background-position: center top; background-repeat:no-repeat; }
.boxes .box.menu-item:hover { border-color:#777777; background-color:#777777; background-position:0 -120px; }
.boxes .box.larus { background-image:url(../images/loft/menu-larusloft.png); }
.boxes .box.vizyon { background-image:url(../images/bckg/menu-vizyon.png); }
.boxes .box.satis { background-image:url(../images/bckg/menu-satis.png); }
.boxes .box.daire { background-image:url(../images/bckg/menu-daire.png); }
.boxes .box.galeri { background-image:url(../images/bckg/menu-galeri.png); }
.boxes .box.iletisim { background-image:url(../images/bckg/menu-iletisim.png); }
.boxes .box.insaat { background-image:url(../images/bckg/menu-insaat.png); }
.boxes .box.brosur { background-image:url(../images/bckg/menu-brosur.png); }
.boxes .box.tulin { background-image:url(../images/bckg/menu-tulinkiran.png); }
.boxes .box.hobi { background-image:url(../images/bckg/menu-hobi.png); }
.boxes .box.main { background-image:url(../images/bckg/menu-main.png); }
.boxes .box.girl1 { background-image:url(../images/loft/index_girl_01.jpg); }
.boxes .box.girl2 { background-image:url(../images/loft/index_girl_02.jpg); }
.boxes .box.girl3 { background-image:url(../images/loft/index_girl_03.jpg); }
.boxes .box.girl4 { background-image:url(../images/loft/index_girl_04.jpg); }
.boxes .box.ipekyol1 { background-image:url(../images/loft/index_ipekyol_01.jpg); }
.boxes .box.ipekyol2 { background-image:url(../images/loft/index_ipekyol_02.jpg); }
.boxes .box.ipekyol3 { background-image:url(../images/loft/index_ipekyol_03.jpg); }
.boxes .box.menu_forest { background-image:url(../images/loft/LarusLoft_Menu_Forest.png); }
.boxes .box.menu_plane { background-image:url(../images/loft/LarusLoft_Menu_Plane.png); }
.boxes .box.menu_mortgage { background-image:url(../images/loft/LarusLoft_Menu_Mortgage.png); }
.boxes .box.menu_shopping { background-image:url(../images/loft/LarusLoft_Menu_Shopping.png); }
.boxes .box.menu_HK { background-image:url(../images/loft/LarusLoft_Menu_HK.png); }
.boxes .box.menu_24_33 { background-image:url(../images/loft/LarusLoft_Menu_24_33.png); }
.boxes .box.menu_24ay { background-image:url(../images/loft/LarusLoft_Menu_24ay.png); }
.boxes .box.menu_LP { background-image:url(../images/loft/LarusLoft_Menu_LP.png); }
.boxes .box.logo { width:405px; background: #fff url(../images/bckg/logo.png) center center no-repeat; }
.boxes .box.has-image:hover { z-index:100; box-shadow:0 0 40px #444; }
.boxes .box img { position:absolute; min-width:100%; min-height:100%; }
/* HEADER
----------------------------------------------------------*/
#header { position:relative; height:142px; }
/* LOGO */
#logo { display:block; position:absolute; bottom:-32px; left:0; width:123px; height:104px; text-indent:-999em; background:url(../images/bckg/logo.png) center center no-repeat; z-index:200; }
/* NAV MENU */
.nav { position:absolute; right:0; bottom:0; width:836px; height:44px; background:url(../images/bckg/nav.png) right top no-repeat; }
#menu { position:absolute; top:1px; left:20px; margin:0; }
#menu li { display:block; float:left; margin:0; }
#menu > li:last-child a { background-image:none; }
#menu li a { position:relative; display:block; padding:15px 23px 14px 24px; font-size:13px; line-height:100%; color:#ececec; text-shadow:0 1px 0px rgba(0,0,0,.9); font-weight:bold; z-index:300; background-image:url(../images/bckg/nav-link.png); background-position:right center; background-repeat:no-repeat; }
#menu li a:hover, #menu li a.selected:hover, #menu li a.current { color:#ddd; background-color:#555; box-shadow:0 0 20px #000 inset; -webkit-box-shadow:0 0 20px #000 inset; }
#menu li a.selected, #menu li a.current-sub { color:#ed0435; }
/* COPY TEXT */
.copy { font-size:10px; text-align:right; margin-right:10px; }
.copy, .copy a { color:#ddd; }
.copy a:hover { color:#888; }
/* MEDIA QUERIES
----------------------------------------------------------*/
@media (min-width: 1200px) {
.wrapper { width:1160px; }
.boxes .box { width:159px; }
.boxes .box.logo { width:489px; }
}
@media (min-width: 768px) and (max-width: 980px) {
}
/* @media (max-width: 980px) {
.wrapper { width:700px; }
.boxes .box { width:134px; }
.boxes .box.logo { width:414px; }
.boxes .box.alt { display:block; }
.boxes .box.last { display:none; }
}
@media (max-width: 728px) {
.wrapper { width:420px; }
.boxes .box.last { display:block; }
}
@media (max-width: 480px) {
}
*/
/* GALLERY
----------------------------------------------------------*/
.gallery { display:none; position:absolute; top:0; left:0; width:100%; height:100%; z-index:500; }
.gallery.active { display:block; }
#title { background: #000; background: rgba(0, 0, 0, 0.7); padding: 0; position: absolute; top: 0px; left: 0px; text-align: center; width: 100%; }
#title h1 { font: 24px Arial, serif; margin: 0 20px; padding: 20px 20px 0 20px; color:#fff; text-shadow:0px 0px 0 #000, 0px 0px 0 #666, 0px 0px 0 #000, 0px 0px 0 #000, 0px 0px 0 #000, 0px 0px 0 #555; }
#title p { max-width:800px; padding:16px 20px 20px 20px; margin:0 auto; font-size:13px; font-family: 'Open Sans', sans-serif; line-height:150%; color:#ccc; text-shadow:0px 0px 0 #000; }
#thumbnails { background: #000; background: rgba(0, 0, 0, 0.8); height: 118px; left: 0; overflow: hidden; position: absolute; bottom: 0; width: 100%; }
#thumbnails ul {}
#thumbnails li { float: left; display:block; width:162px; height:108px; list-style: none; margin: 5px; padding: 0; overflow:hidden; }
#thumbnails a { outline: none; }
#thumbnails img { width: 162px; }
#thumbnails p { display:none; }
#pointer { border: 2px solid #777; outline: 2px solid #777; cursor: pointer; width: 162px; height: 108px; left: -200px; margin: 3px; position: absolute; }
#flash { background: #FFF; display: none; height: 100%; position: fixed; width: 100%; }
#pause, #show, #exit { font: 60px 'Ultra', arial, serif; height: 100%; position: absolute; text-align: center; text-shadow: 0 0 5px #000; width: 100%; }
#pause { display: none; }
#pause a, #show a, #exit a { color: #FFF; height: 100px; left: 50%; margin: -50px 0 0 -250px; position: absolute; top: 50%; width: 500px; opacity: 0.1; }
#show a { display:block; width:100%; height:100%; margin:0; position:absolute; top:0; left:0; }
#exit { width:auto; height:auto; bottom:180px; font-size:36px; }
#exit a { width:50px; height:50px; margin:0 0 0 20px; top:0; left:0; opacity:0.7; background:url(../images/bckg/gallery-exit.png) 0 0 no-repeat; }
#pause a:hover, #show a:hover { opacity: 0.8; }
#exit a:hover { opacity: 1; }
#volume { right: 20px; opacity: 0.7; position: absolute; bottom: 140px; z-index:2000; }
#volume:hover { opacity:0.9; }
#volume a { background: transparent url(../images/bckg/icons.png) no-repeat; display: block; height: 30px; text-indent: -9999px; width: 30px; }
#volume.all a { background-position: 0 0; }
#volume.none a { background-position: -60px 0; }
.vegas-loading { top: auto; bottom: 40px; left: 40px; }
.vegas-overlay { background-image: url(../js/vegas/overlays/02.png); }
/* Thumbnail scroller jQuery plugin scrollers styling */
.jThumbnailScroller{ position:relative; overflow:hidden; }
.jThumbnailScroller .jTscrollerContainer{position:absolute;}
.jThumbnailScroller .jTscroller{position:relative; height:100%; margin:0; left:0; top:0; display:inline-block; *display:inline;}
/* KAT PLAN - FIXED GALLERY */
#vegas-fix { position:absolute; top:0; left:0; width:100%; z-index:-2; background:#000; }
#vegas-fix img { display:block; width:auto; height:100%; margin:0 auto; }
/* SCROLLBAR CONTENT
----------------------------------------------------------*/
.mask { display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:1000; background:#000; }
.mask .close { display:block; width:50px; height:50px; position:absolute; top:10px; left:79%; opacity:.6; background:url(../images/bckg/gallery-exit.png) 0 0 no-repeat; }
.mask .close:hover { opacity:1; }
div.scroller { width: 892px;
height: 574px; margin:40px auto; z-index:1200; }
div.scroller.no-scrollbar { background-position:left 0; }
div.scroller .customScrollBox { position: relative; height: 100%; overflow: hidden; }
div.scroller .customScrollBox .container { position: relative; width: 100%; top: 0; float: left; }
div.scroller .customScrollBox div.content { clear: both; padding:0; width:885px; height:100%; cursor:pointer; background-color:#000; }
div.scroller .dragger{ position:absolute; top:0px; right:0; width:8px; height:100px; overflow:hidden; cursor:pointer; background-color:#fff; }
div.scroller .dragger_pressed{ background-color:#ccc; }
/* CONTENT
----------------------------------------------------------*/
.content { padding:50px 0; min-height:300px; color:#fff; font-size:12px; font-weight:normal; text-shadow:0 0px 0 rgba(0,0,0,.6); }
.content h2 { margin-bottom:.9em; text-align:center; color:#fff; font-size:35px; }
h2.caption { margin-bottom:10px; padding:10px 0; color:#fff; font-size:32px; text-shadow:0px 0px 0 #000,0px 0px 0 #555,0px 0px 0 #000; text-align:center; font-family:'Open Sans';}
.content h3 { font-size:19px; color:#fff; padding:12px 0 10px 0; margin-bottom:0; }
.content h3.center { width:462px; margin:0 auto; padding:40px 0 6px 0; color:#fff; text-align:left; }
.content h4 { font-size:12px; color:#fff; margin:20px 0 10px 0; line-height:160%; font-family:Arial, Helvetica, sans-serif; }
.content a { color:#09c; text-decoration:underline; }
.content a:hover { color:#09f; }
/* content typography styles */
.content p { line-height:150%; font-size:13px; text-align:justify; }
.content p.quote { width:70%; text-align:center; margin:0 auto; }
.content p.tr { margin-bottom:10px; text-indent:30px; }
.content .hr { clear:both; display:block; width:100%; height:2px; margin:40px 0 20px 0; }
.content .hr.grey { height:1px; background:#d4d5cc; }
.content .hr.alt { margin-top:4px; }
.content ul { padding: 4px 20px 20px 16px; list-style:square; }
.content ul ul { padding: 2px 20px 4px 34px; list-style:square; }
.content ol { padding:10px 4px 20px 50px; list-style:decimal; list-style-position:inside; font-weight:bold; }
.content ol li span { font-weight:normal; }
.content ul li, .content ol li { line-height:156%; padding:3px 0; }
.content ul li li, .content ol li li { line-height:150%; padding:2px 0; }
.content .content-image { padding:5px 0 25px 0; }
.content .content-image.center { margin-bottom:0; }
.content img.styled { border:2px solid #ffffff; margin:15px 0; }
.content .content-image img.styled { margin:0; }
.content .content-image.alignleft, .content .content-image.alignright { padding-top:0; }
.content img.alignleft { margin:10px 20px 100px 0; }
.content img.alignright { margin:10px 0 100px 20px; }
/* Tables */
table.styled { width:100%; margin:10px 0 30px 0; color:#eee; border-collapse:separate; font-weight:bold; border-bottom: 1px solid #fff; }
table.styled th { font-size: 14px; padding:14px; color:#fff; text-align:left; }
table.styled td { padding:10px 14px; border-bottom:1px solid #000; border-top: 1px solid #000;}
table.styled tr.alt { color:#eee; background:#333; background:rgba(0,0,0,.4); }
/* CONTACT
----------------------------------------------------------*/
.contact { margin-top:34px; }
.map { width:865px; height:300px; margin:0 0 30px 0; overflow:hidden; border:1px solid #000; }
.contact-info { width:410px; }
.contact .info { margin-top:10px; }
.contact .info h3 { padding-bottom:3px; }
.styled-form { }
.contact label.error { display:none !important; }
.contact input.text, .contact textarea.text, .contact select { width:201px; padding: 10px 14px; display:block; float:left; margin:0 18px 10px 0; color:#909090; font-weight:bold; font-family:Arial, Helvetica, sans-serif; font-size:11px; text-shadow:0 1px 0 #fff; border:1px solid #887ab5; outline:0; background-color:#ffffff;
-moz-box-shadow: 0px 1px 3px #bbb inset;
-webkit-box-shadow: 0px 1px 3px #bbb inset;
box-shadow: 0px 1px 3px #bbb inset;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}
.contact input.text.alt, .contact textarea.text.alt,.contact select.alt { margin-right:0; }
.contact select { width:230px; padding: 9px 14px; color:#7c7c7c; background-color:#d7d7d7; }
.contact textarea.text { width:450px; height:70px; margin-bottom:0; }
.contact .send { float:right; text-align:center; cursor:pointer; margin: 0px 0 0 0; border:0; outline:0; clear:both; padding: 6px 16px; color:#f9f9f9; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; background:url(../images/bckg/button.png) center center no-repeat;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px; }
.contact .send:hover { -moz-opacity:.90; filter:alpha(opacity=90); opacity:.90; }
.contact .send:active { -moz-opacity:.70; filter:alpha(opacity=70); opacity:.70; }
.contact input:focus, .contact textarea:focus, .contact select:focus { border-color:#aaa; background-color:#fbf8e8; }
.contact input.error, .contact textarea.error, .contact select.error { border-color:#eca3a3; }
.zoom {
-webkit-animation: myanim 0.4s; /* Saf5, Chrome */
-moz-animation: myanim 0.4s; /* FF5+ */
}
@-webkit-keyframes myanim {
0% {
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0); }
100% {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
}
@-moz-keyframes myanim {
0% {
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0); }
100% {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
}