@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, details, summary, abbr, acronym, address, big, cite, code, del, dfn, em, font, figure, figcaption, img, ins, kbd, q, s, samp, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, input, select, textarea, legend, table, caption, tbody, tfoot, thead, tr, th, td, header, nav, footer {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
	font-family: calibri, sans-serif;
	font-weight: normal;
    vertical-align: top;
    word-wrap: break-word;
}
*, *:after, *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
	font-size: 14px;
	background-color: #FBFBFB;
}
.content {
	width: 1000px;
	margin: 0 auto;
}
a {
	color: #eec102;
}

.half {display:inline-block;width:50%;}
.third {display:inline-block;width:33.33%;}
.fourth {display:inline-block;width:25%;}

header {
	width: 100%;
	background-color: #FFF;
	border-top: 4px solid #eec102;
}
header .logo {
	display: inline-block;
	width: 200px;
	//height: 65px;
	height: 70px;
	background-image: url(../img/static/logo/default.png);
	background-position: center left;
	background-size: auto 50px;
	background-repeat: no-repeat;
}
header nav {
	display: inline-block;
	width: 800px;
	text-align: right;
}
header nav a {
	display: inline-block;
	padding: 25px 15px;
	color: #333;
	font-weight: bold;
	font-size: 14px;
	text-transform: uppercase;
	text-decoration: none;
}
header nav a:last-child {
	padding-right: 0;
}
header nav a:hover, header nav a.selected {
	color: #eec102;
}
header nav .products {
	position: relative;
}
header nav .products ul {
	position: absolute;
	display: none;
	width: 100px;
	/*top:40px;*/
        top:64px;
	left:5px;
	background-color: #fff;
	padding:0;
	padding-top:5px;
	margin:0;
	text-align: left;
}
@-moz-document url-prefix() {
    header nav .products ul {
		top:20px;
    }
}
header nav .products ul li{
	display:block;
}
header nav .products ul li a{
	padding: 5px 10px;
}
header nav .products:hover ul{
	display: block;
}
header nav .products:hover > a{
	color: #CCC;
}


header .menu_select {
	display:none;
	float: right;
	width: 30px;
    height: 65px;
    font-size: 18px;
    -webkit-appearance: none;
    -moz-appearance: none;
    background:none;
    background-image:url(../img/static/more/menu.png);
    background-position: center;
	color: #FFF;
}
header .menu_select option:first-child {
	display: none;
}
header .menu_select option {
	color: #333;
}

.upload {
	direction: rtl;
	display: block;
    position: fixed;
    bottom: 20px;
    right: 20px;
	width: 50px;
	height: 50px;
    padding: 17px 10px;
    color: #FFF;
    font-weight: bold;
    text-transform: uppercase;
    background: #eec102;
    text-decoration: none;
    border-radius: 25px;
    overflow:hidden;
    z-index: 10;
}
.upload span {
	font-family: arial;
	display: inline-block;
	width: 48px;
	height: 65px;
    background: rgba(0,0,0,0.1);
    margin: -17px -8.5px;
    margin-left: 10px;
    padding: 7px 3px;
    font-size: 32px;
    text-align: center;
}
.upload:hover {
	width: 200px;
}

.banner {
	width: 100%;
	height: 350px;
	background-color: #EEE;
	background-position:center;
	background-repeat: no-repeat;
	background-size: cover;
}
.banner h1{
	padding: 150px 0;
	font-size: 32px;
	color: #fff;
	text-shadow: 0 0 5px rgba(0,0,0,0.5);
	text-transform: uppercase;
	letter-spacing: 1px;
}
.home .banner h1{
	display: inline-block;
	margin-top: 45px;
	letter-spacing: 0;
	font-size: 32px;
	padding: 5px 10px;
	width: auto;
	background-color: rgba(0,0,0,0.6);
	color:#eec102;
}
.home .banner h1 strong{
	color:#fff;
}
.home .banner h1 span{
	color:#fff;
}
.title {
	text-align: center;
	text-transform: uppercase;
	font-weight: normal;
	letter-spacing: 5px;
	font-size: 26px;
	color: #eec102;
	padding: 70px 30px 30px;
}
.title:first-child {
	padding: 30px;
}

.columns.two {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}
.columns.three {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
}
.columns.four {
    -webkit-column-count: 4;
    -moz-column-count: 4;
    column-count: 4;
}

.gallery {
	text-align: center;
}
.gallery li {
	list-style: none;
	display: inline-block;
	width: 220px;
	height: 220px;
	padding: 10px;
}
.gallery li a {
	display: block;
	width: 100%;
	height: 100%;
	background-color: #eee;
	background-position:center;
	background-repeat: no-repeat;
	background-size: cover;
}

.home .banner {
	height: 500px;
}

.home .scroll {
	display:block;
	width: 50px;
	height: 50px;
	padding: 6px 17px;
	margin: 0 auto;
	margin-bottom: 30px;
	color: #fff;
	background-color: #CCC;
	border-radius: 50%;
	text-align: center;
	text-decoration: none;
	font-size: 24px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	-ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}
.home .scroll:hover {
	background-color: #EEE;
}

.home .info li {
	list-style: none;
	display: block;
	min-height: 350px;
	padding: 30px 0;
}
.home .info li .image {
	display: inline-block;
	width: 400px;
	height: 300px;
	background-position:center;
	background-repeat: no-repeat;
	background-size: cover;
}
.home .info li .text{
	display: inline-block;
	width: 600px;
        
	padding: 50px;
	text-align: left;
	font-size: 16px;
}
.home .info li .text h2{
	color: #666;
	margin-bottom: 10px;
	text-transform: capitalize;
}
.home .info li .text p{
	color: #999;
	line-height: 22px;
}
#ffb {
    position: relative;
    top: 2px;
    background-image: url(http://emirrortv.com/fb.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    text-decoration: none;
    display: inline-block;
    width: 20px;
    height: 22px;
    cursor: pointer;
}

#fins{
    position: relative;
    top: 2px;
    background-image: url(http://emirrortv.com/inst.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    text-decoration: none;
    display: inline-block;
    width: 20px;
    height: 22px;
    cursor: pointer;
}
.home li:nth-child(odd) .image {
	float: right;
}

.products .info{
	direction: rtl;
}
.products .info .text {
	direction: ltr;
	display: inline-block;
	/*width: 395px;*/
        width: 100%;
	padding-right: 20px;
    overflow:hidden;
}
.products .text b{
	font-size: 20px;
    font-weight: normal;
	padding: 10px 0;
	text-transform: capitalize;
}
.products .text b:first-child{
	padding-top: 0;
}
.products .text p{
	/*padding: 5px 0;*/
        padding-bottom: 5px;
}
.products .info .image{
	direction: ltr;
	position:relative;
	display: inline-block;
	width: 600px;
	height: 400px;
	background-color: #fff;
	background-position:center;
	background-repeat: no-repeat;
	background-size: cover;
}
.products .info .image .arrow{
	position: absolute;
	top: 0;
	width: 50px;
	height: 400px;
	padding: 12px 0;
	color: #fff;
	font-size: 30px;
	text-align: center;
	text-decoration: none;
    background-position: center;
    background-repeat: no-repeat;
	opacity:0.5;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
    z-index: 10;
}
.products .info .image .arrow:hover{
	opacity:1;
}
.products .info .image .arrow.next{
	right: 0;
    background-image: url(../img/static/arrow/right.png);
}
.products .info .image .arrow.prev{
	left: 0;
    background-image: url(../img/static/arrow/left.png);
}
.products .types {
	text-align:center;
}
.products .types li {
	display:inline-block;
	width: 490px;
    margin: 5px;
	text-align:left;
}
.products .types li strong{
	display:block;
	width: 100%;
    height: 35px;
	padding: 7px 5px;
    color: #ccc;
    font-size: 16px;
    background: rgba(0,0,0,0.7);
    font-weight: normal;
	text-transform: uppercase;
    text-align:center;
}
.products .types li .image{
	width: 100%;
	height: 220px;
    padding-top: 185px;
    margin: 0 0 5px;
	background-color: #fff;
	background-position:center;
	background-repeat: no-repeat;
	background-size: cover;
}
.products .types li .text{
    margin-top: 5px;
}
.products .columns li {
	margin-left: 20px;
}
.products .tabs .menu {
	display:inline-block;
	width: 100%;
	margin:0;
	margin-bottom: 20px;
	padding:0;
	text-align: center;
	background-color: #666;
}
.products .tabs .menu li {
	display:inline-block;
	margin:0;
	margin-left:1px;
	padding:0;
	overflow: hidden;
}
.products .tabs .menu li a {
	display:inline-block;
	width: 120px;
	padding:10px;
	color: #DDD;
	font-weight:bold;
	background-color: #666;
	text-decoration: none;
	text-transform: uppercase;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.products .tabs .menu li:hover a {
	color: #fff;
}
.products .tabs .menu li a.selected {
	text-decoration: none;
	color: #fff;
	background-color: #eec102;
}
.products .tabs .text {
	display: inline-block;
	width: 400px;
	padding: 10px 50px 10px 0;
    
}
.products .tabs .gallery {
	display: inline-block;
	width: 600px;
	text-align: right;
}
.products .tabs .gallery li {
	width: 200px;
	height: 200px;
}

.projects section {
	padding: 20px 0;
    border-bottom: 1px solid #EEE;
}
.projects section .title {
	text-align:left;
	padding: 30px 0;
}
.projects section .text {
	display: inline-block;
	width: 400px;
	padding: 10px 0;
}
.projects section .gallery {
	display: inline-block;
}
.projects section .gallery li {
	position: relative;
	width: 330px;
	height: 330px;
}
.projects section .gallery li a span{
	position: absolute;
	display:block;
    top:280px;
    width: 310px;
    height: 40px;
    color: #FFF;
    background: rgba(0, 0, 0, 0.7);
    padding: 10px 20px;
    text-align: center;
    font-size: 18px;
}
.projects section .gallery li a:hover span{
    background: #eec102;
}
.pp_description .features {
    font-weight:bold;
}
.pp_description .features:after {
	display:inline-block;
    margin: 0 10px;
    content:"\00b7";
    color: #CCC;
}
.pp_description .features:last-child:after {
	display:none;
}
.pp_description .features.color {
    font-weight:bold;
    color: #eec102;
}


.showroom .list > li {
	width: 100%;
	/*height: 260px;*/
        height: 175px;
    padding: 20px 0;
    list-style:none;
    /*border-bottom: 1px solid #EEE;*/
}
.showroom .list li div{
	padding: 10px;
}
.showroom .list .image{
	display:inline-block;
    margin: 10px 0;
	width: 150px;
	height: 60px;
	background-color: #fff;
	background-repeat: no-repeat;
	background-size: contain;
}
.showroom .list .title{
    height:auto;
    padding: 0;
	font-size: 17px;
    letter-spacing: 2px;
    text-align: left;
}
.showroom .list li .contact{
	height: 100px;
}
.showroom .list.freeheight > li{
	height: auto;
	min-height: 100px;
}
.showroom .list.freeheight li .contact{
	height: auto;
	min-height: 100px;
}
.showroom .list li iframe{
	width: 300px;
	height: 220px;
	float: right;
}
.showroom .list.freeheight li .contact iframe{
	float: none;
}
.showroom .list .contact li{
    list-style:none;
    /*margin-bottom: 10px;*/
}
.showroom .list .contact li.address{
	/*height: 100px;*/
}
.showroom .list .contact li span{
	display: inline-block;
	font-size: 12px;
    color: #999;
    text-transform: uppercase;
    width: 80px;
}

.blog {
}
.blog .gallery{
    text-align: left;
}
.blog li {
	display:inline-block;
	width: 320px;
    height: 350px;
    margin: 5px;
    padding: 10px;
    background: #fff;
    text-align: left;
}
.blog li:hover {
    background: #EEE;
}
.blog li strong{
	display:block;
    color: #eec102;
	font-size: 18px;
    text-transform: capitalize;
    margin-bottom: 5px;
}
.blog li .date{
	display:block;
    margin-bottom: 5px;
    font-size: 10px;
    color: #666;
    text-transform: uppercase;
}
.blog li .image{
	display:block;
    width: 100%;
    height: 150px;
    margin-bottom: 10px;
	background-position:center;
	background-repeat: no-repeat;
	background-size: cover;
}
.blog li .text{
	display:block;
    margin-bottom: 5px;
    font-size: 12px;
    color: #333;
}

.about section {
	padding: 20px 0;
    border-bottom: 1px solid #EEE;
    direction: rtl;
}
.about section .text {
    direction: ltr;
	display: inline-block;
	width: 600px;
	padding: 10px 0;
	padding-right: 20px;
}
.about section .image {
    direction: ltr;
	display: inline-block;
	width: 400px;
    height: 300px;
	background-color: #fff;
	background-position:center;
	background-repeat: no-repeat;
	background-size: cover;
}

.contact iframe {
	margin-bottom: 20px;
}
.contact_list {
	margin-bottom: 10px;
    list-style:none;
}
.contact_list li strong{
	text-transform:uppercase;
    letter-spacing: 2px;
	font-weight:bold;
    color: #eec102;
}
.contact_list > li > ul {
	margin-top: 5px;
    list-style:none;
}

.design .text { display: inline-block; width: 66%; padding-right: 200px; padding-left: 15px;}
.design .form { display: inline-block; width: 33%; margin-left: 10px;}
.design .form input { padding: 5px;min-height: 25px;margin-bottom: 10px; width: 315px; }

input[type="text"], input[type="email"], textarea {
	display:block;
    width:100%;
    background: #fcfcfc;
    min-height: 43px;
    margin: 0;
    margin-top: 5px;
    margin-bottom: 20px;
    padding: 12px;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
    box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
    resize: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #898989;
}
textarea {
    height: 100px;
}
input[type="submit"], input[type="reset"] {
    background: #CCC;
    color: #666;
    height: 40px;
    margin: 5px 10px;
    padding: 10px;
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    font-family: 'Ubuntu', sans-serif;
    font-size: 14px;
    font-weight: 400;
    text-shadow: none;
}
input[type="submit"]:hover, input[type="reset"]:hover {
	color: #FFF;
	background-color: #eec102;
}

hr {
	border: 1px solid #EEE;
}
#droparea {
	display: inline-block;
	position: relative;
	width: 310px;
	height: 310px;
	padding: 0;
	margin: 10px;
	overflow: hidden;
}
#droparea #image{
	position: absolute;
	width: 100%;
	height: 100%;
	opacity:0;
	background-color: #333;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
#droparea input[type=file] {
	position: absolute;
    left:0;
	width: 100%;
	height: 100%;
	padding: 0;
	color: #EEE;
	background-color: #EEE;
	background-image: url(../img/static/more/upload.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 60px;
	text-align: center;
	-webkit-transition: all 0.15s ease;
	-moz-transition: all 0.15s ease;
	transition: all 0.15s ease;
}
#droparea.hover input[type=file] {
	background-image: url(../img/static/more/dropped.png);
	background-color: #CCC;
}
#droparea.dropped input[type=file] {
	background-color: #eec102;
}
#droparea.dropped #image {
	opacity:1;
	z-index: 1;
}
#droparea input[type="file"]::-webkit-file-upload-button {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 100px;
	height: 25px;
	margin-left: -50px;
	margin-top: 30px;
}
#droparea input[type="file"]::-moz-file-upload-button {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 100px;
	height: 25px;
	margin-left: -50px;
	margin-top: 30px;
}

footer {
	font-size: 11px;
	color: #666;
	background-color: #222;
	border-top: 2px solid #eec102;
	margin-top: 90px;
}
footer .links {
	padding: 20px 0;
}
footer .links .button {
	display: inline-block;
	padding: 6px;
	color: #CCC;
	border: 1px solid #444;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	margin-top: 7px;
	margin-right: 5px;
}
footer .links .button:hover {
	color: #eee;
	background-color: #eec102;
	border-color: #eec102;
}
footer .links .phone {
	float: right;
	color: #999;
	font-size: 26px;
	/*text-align: right;*/
        text-align: left;
	width: 300px;
}
footer .links .phone .call{
	display: inline-block;
	height: 36px;
	padding: 12px 10px;
	color: #999;
	background-color: #333;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 5px;
	text-transform: uppercase;
}
footer .links .phone .number{
	display: inline-block;
	height: 36px;
	padding: 5px;
	font-size: 20px;
	color: #333;
	background-color: #eec102;
}
footer .copy {
	border-top: 1px solid #333;
	padding: 10px 0;
}
footer .copy a {
	color: #999;
	margin-left: 10px;
	text-decoration: none;
}
footer .copy a:hover {
	text-decoration: underline;
}
.close{
    position: absolute;
    top: 2px;
    right: 2px;
    z-index: 100;
    background-color: #FFF;
    padding: 5px 2px 2px;
    color: #000;
    font-weight: bold;
    cursor: pointer;
    opacity: 0;
    text-align: center;
    font-size: 22px;
    line-height: 10px;
    border-radius: 50%;
}

.dropped .close{
    opacity: .3;
}
.dropped:hover .close{
    opacity: 1;
}

@media screen and (max-width: 1000px) {
    .half, .third {display:block;width:100%;}
    .fourth {display:inline-block;width:50%;}
	.columns.two, .columns.three {-webkit-column-count: 1;-moz-column-count: 1;column-count: 1;}
	.columns.four {-webkit-column-count: 2;-moz-column-count: 2;column-count: 2;}
    .content {max-width: 600px;width: 100%;padding: 0 20px;}
	header nav { display:none; }
	header .menu_select {display:block;}
    .home .banner h1 { margin-left: auto; margin-right: auto; font-size: 20px;}
    .banner h1 { padding: 75px 20px; font-size: 20px;}
    .title { font-size: 18px; }
    .home .info li .text { width: 100%; padding: 20px;}
    .home .info li .image { width: 100%; }
    footer {text-align: center;}
    footer .links {padding: 20px; text-align: left;}
    footer .links .phone { float:none; display:block;margin: 0 auto; margin-bottom: 10px;text-align: left; margin-left: 0;}
    .about section .text,.about section .image { width: 100%; background-size: contain;}
    .products .info .text { width:100%;}
    .products .info .image{ width:100%; height: 300px; margin-bottom: 20px;}
    .products .types li { width: 100%; }
    .showroom .map { display: none; }
    .showroom .list > li, .showroom .list li .contact, .showroom .list .contact li.address { height:auto; }
    .showroom .list .contact li { display: block; }
    .showroom .list .image { float: right; width: 80px; height: 150px; margin:0; /*background-color: #FBFBFB;*/ background-position: center; }
    .design .text { display: block; width: 100%; padding-right: 0;}
    .design .form { display: block;width: 320px;  margin: 0 auto; margin-top: 20px;}
    .design .form input { width: 320px; }
    #droparea {
        width: 95px;
        height: 95px;
        margin: 5px;
        text-align: left;
    }
    .products .tabs .text {display: block;width: 100%;padding: 0 10px 0 10px;}
    .products .tabs .gallery {display: block;width: 100%;text-align: center;overflow: hidden;}
    .products .tabs .menu li{width: 49%;}
    .products .tabs .menu li a.selected { width:100%;}
    
    .showroom ul.list li div {float:none !important ; width:100% !important ; }
    .showroom .list li div {padding: 10px 0px 0px 0px !important ;}
    .showroom div.half ul.freeheight li div ul.contact li {margin-top: 0px !important;}
    
    #showroomMainDiv {width:initial !important;}
    #showroomMainDiv > ul > li > div:first-child {height: 183px !important;}
    
    .banner {height: 120px; }
    .home .banner {height: 340px; }
    
    #fsdiv{
        position: initial !important ;
        float: initial !important;
        width: 125px;
        padding: 0px 6px !important;
    }
    #hformc{
        padding: 0px 0 10px !important;
        display: block !important;
    }
    #hmessage{
        margin-top: 0px !important;
        text-align: left !important;
    }
    #pmessage{
        text-align: left !important;
    }
}

@media screen and (max-width: 600px) {
	.gallery li {width: 150px;height: 150px;}
}
