/*MARMI MARANGONI
DESIGN BY LINOOLMOSTUDIO.IT*/
@font-face {
    font-family: 'proxima_nova_ltregular';
    src: url('proxima/proximanova-light-webfont.eot');
    src: url('proxima/proximanova-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('proxima/proximanova-light-webfont.woff') format('woff'),
         url('proxima/proximanova-light-webfont.ttf') format('truetype'),
         url('proxima/proximanova-light-webfont.svg#proxima_nova_ltregular') format('svg');
    font-weight: normal;
    font-style: normal;
}



@font-face {
    font-family: 'proxima_nova_rgbold';
    src: url('proxima_bold/proximanova-bold-webfont.eot');
    src: url('proxima_bold/proximanova-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('proxima_bold/proximanova-bold-webfont.woff') format('woff'),
         url('proxima_bold/proximanova-bold-webfont.ttf') format('truetype'),
         url('proxima_bold/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;
}



body{ padding:0px; margin:0px; overflow-y: hidden;}
.none{ display:none;}
.clr{ clear:both;}
.none{ display:none;}


body::-webkit-scrollbar {
width: 5px;
background-color:#fff;
}

body::-webkit-scrollbar-thumb {
background-color: #efa900;
}



.content_i::-webkit-scrollbar {
width: 5px;
background-color:#fff;
}

.content_i::-webkit-scrollbar-thumb {
background-color: #efa900;
}


body{ overflow-x:hidden;}
.dropdown-menu{ display:none !important;}




/*TIPOGRAFY*/
h1, h2, h3, h4, p{ margin:0px;}
i{font-size: 14px;}

h1{
font-family: 'proxima_nova_ltregular';
font-size:50px;
line-height:50px;
margin-bottom:20px;
color:#111;
font-weight:100;
text-transform:uppercase;
}	

h1 strong{ font-weight:400; color:#efa900;}
p strong{ color:#111; font-weight:400; font-family: 'proxima_nova_rgbold';}


p{font-family: 'proxima_nova_ltregular'; color:#111; font-size:17px; line-height:25px;}



#slider{ width:100%; position:absolute; top:0px; left:0px; overflow:hidden; box-shadow: 1px 1px 10px #111;}
/*#retina{ width:100%; position:absolute; top:0px; left:0px; background-image:url(../images/dot.png); background-size:40%; z-index:1; background-size: 0.3%; z-index: 1; opacity: 0.3;}*/


iframe#video{ width:100%; height:400px;}



.page-header{ display:none;}



#menu{ margin-top:5px; padding:10px; background-color:#efa900;}
#menu ul{ margin:0px; padding:0px;}
#menu ul li{ display:inline; list-style-type:none; padding:0px; margin:0px; padding:10px;}
#menu ul li a{ text-decoration:none; color: #fff; text-transform:uppercase; font-family: 'proxima_nova_ltregular';  font-size:18px; font-weight:400;}
#menu ul li.active a{ color:#111;}
#menu ul li a:hover{ color:#111;}


#prevideo{ width:100%; height:400px; position:absolute; top:0px; left:0px; z-index:2; background-image:url(../images/prevideo_hover.jpg); background-repeat:no-repeat; background-size: cover; background-position:center; transition-property:background-image; transition-duration:0.5s;}
#prevideo:hover{ cursor:pointer; background-image:url(../images/prevideo.jpg);}



#arrow{ width:50px; height:50px; position: relative; background-image:url(../images/arrow.png); background-repeat:no-repeat; background-size: contain; background-position:center; margin:0 auto;}
#arrow:hover{ cursor:pointer; opacity:0.9;}

#wrapper_video{ width:100%; height:400px;}

/*#wrapper_video{ border-top:5px solid #efa900; position:relative;}
.content_indoor_i_after{ border-bottom:5px solid #efa900; }*/

.content_indoor_i{ padding: 22px 50px 50px 50px}



#wrapper_focus{ margin-top:50px;}


.box{ width:100%; clear:both;}
.box1 .box_left{ background-color:#efa900; background-image:url(../images/box_azienda.png); background-repeat:no-repeat; background-size: 90%; background-position:center;}
.box1 .box_right{ background-color:#bb8400;}
.box2 .box_left{ background-color:#fff; background-image:url(../images/box1.png); background-repeat:no-repeat; background-size: contain; background-position:center;}
.box2 .box_right{ background-color:#c7c7c7;}
.box3 .box_left{ background-color:#efa900; background-image:url(../images/box2.png); background-repeat:no-repeat; background-size: 80%; background-position:center;}
.box3 .box_right{ background-color:#bb8400;}
.box4 .box_left{ background-color:#fff; background-image:url(../images/box3.png); background-repeat:no-repeat; background-size: 80%; background-position:center;}
.box4 .box_right{ background-color:#c7c7c7;}


.box_left{ width:30%; position:relative; float:left;}
.box_right{ width:70%; position:relative; float:left;display:table;}
.box_right_i{ display:table-cell; vertical-align:middle; padding:0px 20px;}


.box h2{
font-family: 'proxima_nova_ltregular';
font-size:30px;
line-height:30px;
margin-bottom:10px;
color:#fff;
font-weight:100;
text-transform:uppercase;
}	

.box p{font-family: 'proxima_nova_ltregular'; color:rgba(250,250,250,0.8); font-size:15px; line-height:17px;}

p.scopri{ margin-top:20px;}
p.scopri span{ border:2px solid #fff; padding:5px; text-transform:uppercase; letter-spacing:3px;}
p.scopri span:hover{ background-color:#fff; color:#696969; cursor:pointer;}


#footer{ width:100%; background-color:#444; position:relative; height:auto; overflow:hidden;}
.footer_left{ width:50%; position:relative; float:left; height:200px;}
.footer_center{ width:50%; position:relative; float:left; height:200px;}
.footer_right{ width:100%; position:relative; float:none; clear:both; height:250px; overflow: hidden;}

.footer_i{ padding:20px;}
.footer_left{ background-color:#efa900;}

.footer_center a{ color:inherit; text-decoration:none;}
.footer_center a:hover{ cursor:pointer; text-decoration:underline;}

#logo{ position: fixed; top:50px; left:0px; z-index:2; opacity:1; background-color: #efa900; width:350px; height:50px; padding:0px 10px;}
#logo img{ width:100%; height:auto; padding-top:15px;}


.table{ display:table !important;}
.table_menu{ width:100%; display:table;}

#open_menu{ width:470px; background-color:#efa900; position:fixed; top:100px; left:0px; z-index:1; height:0px; overflow:hidden;}
#open_menu_i{ display:table-cell; vertical-align:middle;}
#open_menu ul{ margin:0px; padding:0px;}
#open_menu ul li{ margin:0px; padding:0px; text-align:center; font-family: 'proxima_nova_ltregular'; font-size:30px; line-height:57px; color:#fff; text-transform:uppercase; font-weight:100; list-style-type:none;}
#open_menu ul li span{font-family: 'proxima_nova_ltregular'; font-size:20px; line-height:10px; color:#fff; text-transform:uppercase; font-weight:100; padding:14px;}
#open_menu ul li span{transition-property:background-color; transition-duration:0.5s;}
#open_menu ul li:hover span{ background-color:#fff; color:#efa900; cursor:pointer;}
.mouse{ width:80px; height:80px; position: absolute; top:0px; right:0px; background-image:url(../images/mouse.png); background-repeat:no-repeat; background-position:center; background-size:70%; opacity:0.5;}
#open_menu a{ color:inherit; text-decoration: none;}


.wrapper_arrow{ text-align:center;}


iframe#map{ width:100%; height:250px; border:none;}

#footer h3{
font-family: 'proxima_nova_ltregular';
font-size: 25px;
line-height: 25px;
margin-bottom: 20px;
color: #fff;
font-weight: 100;
text-transform: uppercase;
margin-bottom:10px;
}

#footer p{ color:rgba(250,250,250,1); font-size:13px; line-height:17px;}
#footer p strong{ color:rgba(250,250,250,1); font-size:23px;}
.footer_center h3 strong{ color:#efa900;}

#marble{ width:600px; height:400px; background-image:url(../images/marble.png); background-repeat:no-repeat; background-position:left bottom; background-size: 70%; position:absolute; left:0px; bottom:0px;}

.foto{ width:100%; height:400px; clear:both; position:relative; background-image:url(../images/marangoni.jpg); background-repeat:no-repeat; background-position:center bottom; background-size: cover;}
.foto_azienda{ background-image:url(../images/marangoni.jpg); background-repeat:no-repeat; background-position:center bottom; background-size: cover;}
.foto_referenze {background-image:url(../images/referenze.jpg); background-repeat:no-repeat; background-position:center bottom; background-size: cover;}
.foto_marmi {background-image:url(../images/marmi.jpg); background-repeat:no-repeat; background-position:center bottom; background-size: cover;}
.foto_contatti {background-image:url(../images/azienda.jpg); background-repeat:no-repeat; background-position:center top; background-size: cover;}


#icon_menu{ width:100px; height:50px; position: absolute; top:0px; right:-100px; background-color:#fff; background-image:url(../images/menu.png); background-repeat:no-repeat; background-position:center; background-size: 80%; z-index:999999999;}
#icon_menu:hover{ cursor:pointer; opacity:0.9;eurom}


#footer a{ color:inherit; text-decoration:none;}
#footer a:hover{ cursor:pointer; text-decoration:underline;}

#content{ width:50%; position: absolute; z-index:2; right:0px; background-color:rgba(250,250,250,0.92); box-shadow: 1px 1px 10px #111; position: fixed;}
.content_i{ position:relative; overflow-x: hidden;}
/*#button{ width:80px; height:80px; background-color:rgba(239,169,0,1); position:fixed; left:-80px; z-index:999; background-image:url(../images/apri_gallery.png); background-repeat:no-repeat; background-position:center; background-size: 70%; z-index:999999;}*/
#button{ width:80px; height:80px; background-color:rgba(239,169,0,1); position:absolute; right:100%; z-index:999; background-image:url(../images/apri_gallery.png); background-repeat:no-repeat; background-position:center; background-size: 70%; z-index:999999;}
#button:hover{ cursor:pointer; opacity:0.8;}

.content_indoor_i a{ color:inherit; text-decoration:none; color:#efa900;}
.content_indoor_i a:hover{ text-decoration: underline;}

.wrapper_marmi{ margin-top: 30px;}


#slider_animation{ width:50%; position: absolute; top:0px; left:0px; /*background-color:red;*/ z-index:2;}

.camera_commands{ display:none !important;}

.camera_next, .camera_next > span{ width:80px !important; height:80px !important;}
.camera_prev, .camera_prev > span{width:80px !important; height:80px !important;}
.camera_next, .camera_prev{ background-color:rgba(239,169,0,0.6) !important; z-index:9999 !important; top:100px !important;}
.camera_next:hover, .camera_prev:hover{ background-color:rgba(239,169,0,0.9) !important;}
.camera_next > span{ background:none !important; background-image:url(../images/arrow_next.png) !important; background-repeat:no-repeat !important; background-position:center !important; background-size: 30% !important;}
.camera_prev > span{ background:none !important; background-image:url(../images/arrow_prev.png) !important; background-repeat:no-repeat !important; background-position:center !important; background-size: 30% !important;}

.camera_prev, .camera_next{ display:none;}
.camera_prev{ right:inherit !important; left:inherit !important; right:82px !important; top:501px !important;}
.camera_next{ right:inherit !important; left:inherit !important; right:0px !important; top:501px !important;}

#mega_wrapper{ width:100%; position:relative; height:200px;}

.sp_image{ width:25%; position:relative; float:left; background-repeat:no; background-size:cover; background-position:center;}
.sp_image:hover{ cursor:pointer; opacity:0.8;}

.marmo{ width:50%; height:250px; position:relative; margin-bottom:2px; float:left;}
.marmo1{ background-image:url(../images/marmi/fiorito.jpg); background-repeat:no-repeat; background-position:center; background-size: cover;}
.marmo2{ background-image:url(../images/marmi/fiorito_light.jpg); background-repeat:no-repeat; background-position:center; background-size: cover;}
.marmo3{ background-image:url(../images/marmi/extra_light.jpg); background-repeat:no-repeat; background-position:center; background-size: cover;}
.marmo4{ background-image:url(../images/marmi/semiclassico.jpg); background-repeat:no-repeat; background-position:center; background-size: cover;}




.on_marmi{ position:absolute; bottom:0px; left:0px; display:table;}
.on_marmi p{ display:table-cell; vertical-align:middle; color:#fff; font-family: 'proxima_nova_ltregular'; text-transform:uppercase; letter-spacing:2px; font-size:20px; line-height:20px; padding:20px; text-shadow: 1px 1px 5px #111;}


#wrapper_focus a{ color:inherit; text-decoration:none;}

.only_mobile{ display:none;}


#menu_mobile{ display:none;}



content_indoor_i_after{ padding-bottom:200px;}



.arrow_top{ width:50px; height:50px; background-image:url(../images/arrow_top.png); background-repeat:no-repeat; background-size: contain; background-position:center; margin:0 auto;}
.arrow_top:hover{ cursor:pointer; opacity:0.8;}

.footer_right{ display:none;}



















/*RESPONSIVE*/
/*NORMAL*/
@media (max-width: 1200px) {
h1{ font-size:40px; line-height:40px;}
#footer h3{ font-size:20px; line-height:20px;}
#open_menu ul li span{ font-size:20px; line-height:50px;}

}

/*TABLET PICCOLO*/
@media (max-width: 980px) {
h1{ font-size:30px; line-height:30px;}
#open_menu ul li span{ font-size:20px; line-height:58px;}
#logo{ width:210px;}
#logo img{ width:200px; padding-top:20px;}

.box_right_i{ padding:10px;}
.box h2{ font-size:20px; line-height:20px;}
.box p{ font-size:12px; line-height:13px;}
p.scopri span {border: 1px solid #fff; padding: 2px;}
.content_indoor_i{ padding:30px !important;}

#open_menu{ width:330px;}
}






/*MOBILE*/
@media (max-width: 767px) {
#logo{ top:0px;}
#content {width: 100%; margin-top:50px;}
.footer_normal{ display:none;}
.only_mobile{ display:block;}
#footer{ position:relative; margin:0px; padding:0px; bottom: inherit; height:auto;}
.footer_left, .footer_center, .footer_right{ width:100%; clear:both; float:none; position:relative;}
.box_right_i{ padding:10px;}
.box h2{ font-size:20px; line-height:20px;}
.box p{ font-size:12px; line-height:13px;}
p.scopri span {border: 1px solid #fff; padding: 2px;}
.marmo{ width:100%;}

/*#slider, #marble, #camera_wrap_94, #camera_wrap_109, #camera_wrap_108, #camera_wrap_110, #camera_wrap_106, #camera_wrap_107{ display:none;}*/

.content_indoor_i{ padding:20px !important;}

#button{ display: none;}
#logo{ width:100%;}
#logo img{ width:250px;}
#icon_menu{ right:20px;}

#menu_mobile{ width:100%; height:0px; background-color:#444; position:relative; top:50px; left:0px; z-index:99999999999; display:block; overflow:hidden;}
#menu_mobile ul{ margin:0px; padding:0px; padding-left:10px; padding-top:10px;}
#menu_mobile ul li{ list-style-type:none; color:#fff; text-transform:uppercase; font-size:20px; line-height:30px;  font-family: 'proxima_nova_ltregular';}
#menu_mobile a{ color:inherit; text-decoration:none;}



}



/*MOBILE PORT*/
@media (max-width: 480px) {

}




