/*** Global Styles ***/ /*** Preload ***/ /*** Scroll ***/ /*** MENU ***/ /*** SLIDER ***/ /*** HOME ***/ /*** Animation monitor ***/ /*** Percentage ***/ /*** TEAM ***/ /*** PAGE ABOUT ***/ /*** PRICING TABLE ***/ /*** second price table ***/ /*** third price table ***/ /*** PAGE SERVICES ***/ /*** PAGE FAQ ***/ /*** PAGE BLOG ***/ /*** PAGE CONTACT ***/ /*** PAGE HOME 2 ***/ /*** PAGE HOME 3 ***/ /*** PAGE HOME 4 ***/ /*** PAGE HOME 5 ***/ /*** PAGE ABOUT 2 ***/ /*** PAGE MEET TEAM ***/ /*** PAGE SHOPPING GENERAL OBJECT ***/ /*** PAGE SHOPPING DRESSES ***/ /*** PAGE SINGLE PRODUCT ***/ /*** PAGE SINGLE PRODUCT DRESSES ***/ /*** PAGE CART PRODUCT ***/ /*** Footer Styles ***/ /*** Footer-2 ***/ /*** Footer-3 ***/ /*** Footer-4 ***/ /*** PAGE 404 NOT FOUND ***/ /* Global Styles */ html, body { height: 100%; } html * { outline: 0 !important; } body { padding-top: 0px; padding-bottom: 20px; font-family: 'Open sans',sans-serif; font-weight: 400; font-size: 13px; line-height:22px; color: #232323; letter-spacing: 0.04em; } h1 { font-family: 'Open sans', sans-serif; font-weight: 300; font-size: 24px; line-height:20px; text-transform: uppercase; margin-bottom: 15px; } h2 { font-family: 'Open sans', sans-serif; font-weight: 400; margin-bottom: 20px; font-size: 20px; text-transform: uppercase; border-bottom: 5px solid #ddd; padding-bottom: 12px; } h2 span{ padding: 3px 0px; color: #333; } img { max-width: 100%; } h3 { font-family: 'Open sans', sans-serif; font-weight: 400; } h3, .h3 { font-size: 20px; } h4 { font-family: 'Open sans', sans-serif; font-weight: 700; } .btn { border-radius:1px; } .wrapper { position: relative; width: 100%; height: auto; } .reveal-animation { top: 0; left: 0; } .tlt { display: inline-block; vertical-align: middle; text-align: center; /*visibility: hidden;*/ } .clear { clear:both; display:block; overflow:hidden; visibility:hidden; height:0px;} /*Preload*/ #loader-wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; background: #fff; z-index: 9999; } #loader { display: block; position: relative; left: 50%; top: 50%; width: 150px; height: 150px; margin: -75px 0 0 -75px; border-radius: 50%; border: 1px solid transparent; border-top-color: #24c4ca; -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */ animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */ } #loader:before { content: ""; position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border-radius: 50%; border: 1px solid transparent; border-top-color: #07ccd4; -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */ animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */ } #loader:after { content: ""; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; border-radius: 50%; border: 1px solid transparent; border-top-color: #6bf2f7; -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */ animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */ } @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(0deg); /* IE 9 */ transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */ } 100% { -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(360deg); /* IE 9 */ transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */ } } @keyframes spin { 0% { -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(0deg); /* IE 9 */ transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */ } 100% { -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(360deg); /* IE 9 */ transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */ } } /*Scroll*/ .dropdown-prod-cart-scroll { max-height: 500px; overflow: hidden; overflow-y: auto; } ul.scroll-menu { position: relative; display: inherit !important; overflow-x: auto; -webkit-overflow-scrolling: touch; -moz-overflow-scrolling: touch; -ms-overflow-scrolling: touch; -o-overflow-scrolling: touch; overflow-scrolling: touch; top: 0 !important; left: 0 !important; width: 100%; height: auto; max-height: 500px; margin: 0; border-left: none; border-right: none; -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; -ms-border-radius: 0 !important; -o-border-radius: 0 !important; border-radius: 0 !important; -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } ::-webkit-scrollbar { width: 12px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; } ::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); } /********/ /* General button style (reset) */ .btn { border: none; font-family: inherit; font-size: inherit; color: inherit; cursor: pointer; display: inline-block; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; letter-spacing: 0.04em; } .btn:after { content: ''; position: absolute; z-index: -1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } /* Button 1e */ .btn-primary { overflow: hidden; z-index: 999; } .btn-primary:after { width: 100%; height: 48%; top: 50%; left: 50%; background:#6487c3; /*#16a7a7;*/ opacity: 0; -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg); } .btn-primary:hover { background: #6487c3; border: 1px solid #3d67af; } .btn-primary:hover:after { height: 400%; opacity: 1; } /********/ .sub-title { margin-bottom: 55px; font-size: 14px; } .section-title span{ font-weight: 700; color:#D9E25A; } .section-title-cat { font-family: 'Open sans', sans-serif; font-weight: 300; font-size: 26px; line-height: 20px; text-transform: uppercase; margin-bottom: 10px; padding-top: 20px; text-align: center; } a { color:#3d67af; } a:hover, a:focus { color: #3d67af; text-decoration: underline; } .section-title a:hover{ color:#D9E25A; } p { color:#616161; } p.personal-phrase { margin-left: 20px; font-style: italic; color: #7e7e7e; } p.personal-phrase i.fa-quote-right{ margin-left: 10px; color: #3d67af; } p.personal-phrase i.fa-quote-left{ color: #3d67af; margin-right: 5px; } .dropdown { cursor:pointer; } ul.dropdown-menu li ul { background-color: white; display: none; left: 100%; padding: 13px 0 0; position: absolute; list-style-type: none; width: auto; transition: all 0.7s ease-in 0s; margin-top: -2em; margin-left: -2em; padding: 0 15px; border-radius: 0px; box-shadow: 0 6px 12px rgba(0,0,0,.175); } ul.dropdown-menu li:hover ul { display:block; transition: all 0.7s ease-in 0s; } ul.dropdown-menu li { border-bottom: 1px solid #ddd; padding: 3px 0; } ul.dropdown-menu li ul li a { display: block; padding: 3px 20px; clear: both; font-weight: 400; line-height: 1.42857143; color: #333; white-space: nowrap; } ul.dropdown-menu li ul li a:hover { color: #333; } ul.dropdown-menu li ul li a:hover{ } .btn-primary { background: #3d67af; border: 1px solid #375d9d; color: #fff!important; -webkit-box-shadow: inset 0 1px 0 #4c76be; -moz-box-shadow: inset 0 1px 0 #4c76be; box-shadow: inset 0 1px 0 #4c76be; text-shadow: 0 1px 0 rgba(0,0,0,.1); } /*.btn-primary:hover { background: #16a7a7; border: 1px solid #09b1b9; }*/ .btn-lg, .btn-group-lg>.btn { border-radius: 0px; } /**************** MENU ************/ .navbar-brand { font-weight: 700; padding: 1px 15px; } .navbar-inverse { background-image:none; background-color: #fff; height: 80px; border-bottom: 0px solid #3d67af; box-shadow: 0 1px 15px rgba(0,0,0,.2); float: left; z-index: 8888; width:100%; } .navbar { margin-bottom:0; } .nav>li>a{padding: 10px 20px;} .navbar-inverse .navbar-nav>li>a { color: #212121; text-shadow:0 0 0 #333; text-transform: uppercase; letter-spacing: 1px; font-weight: 400; } .navbar-inverse .navbar-nav>li>a:hover,.navbar-inverse .navbar-nav>li>a:focus { color: #3d67af; } .navbar-header { margin-top: 21px; } .navbar-collapse { position: relative; margin-top: 20px; } ul.menu-items li.menu-item { display: inline-block; border-right: 0px solid #ccc; padding: 0px 20px 35px 20px; } ul.menu-items li.menu-item:last-child { border-right: 0px solid #ccc; margin-top: 30px; } .navbar-nav>li>.dropdown-menu { padding: 0 15px; margin-top: 19px; border-radius: 0px; } .navbar-nav>li>.megamenu.dropdown-menu{margin-top: -4px;padding-top:25px;} .dropdown-menu{ border: 0px solid rgba(0,0,0,.15);} .dropdown-menu li a { font-size : 13px; } .navbar-nav .vertical-li { right: -40px; } .mega-sub-menu li:hover a { color: #eeab37; } .vertical-li li { border-bottom: 1px solid #ddd; padding: 5px 0; } .vertical-li.dropdown-prod-cart li:hover{background-color:transparent;} .vertical-li li:hover a{ color: #eeab37; } .vertical-li li:last-child { border-bottom: 0px solid #ddd; } .dropdown-menu>li>a{padding: 3px 0px;} .dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus { background-image: none; background-color: #fff; } .megamenu { width: 100%; left: 0; right: 0; padding-bottom: 0px; } .mega-sub-menu { padding-left: 0px; } .mega-sub-menu li { list-style-type: none; font-size: 13px; padding: 13px 0px; border-bottom: 1px solid #ddd; } .mega-sub-menu li a{ color:#333; text-decoration: none; } /*.angula-megamenu-title { margin-bottom: 20px; text-transform: uppercase; margin-top: 30px; font-size: 16px; font-weight: 700; }*/ .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:hover, .navbar-inverse .navbar-nav>.open>a:focus { color: #3d67af; background-color: #fff; } .mega-sub-menu li i{ color: #3d67af; margin-right: 8px; } .menu-large { position: static !important; } .menu-adwertising .discount{ position: absolute; z-index: 9999; } .menu-adwertising { cursor: default; } .menu-text-monitor { position: relative; } .menu-text-monitor i { font-size: 16px; margin-right: 5px; color: #3d67af; } .menu-text-monitor p:first-child { font-size: 16px; font-weight: 700; margin-top: -2px; margin-bottom: 20px; text-transform: uppercase; color: #111; } .menu-text-monitor p { font-size: 13px; font-weight: 400; } .hero-image { width:100%; height:100%; position:absolute; z-index:1; top:0; left:0; pointer-events:none; opacity:0; } .hero-image { width:100%; height:100%; position:absolute; z-index:1; top:0; left:0; pointer-events:none; opacity:0; } .hero-image p{font-size:20px;font-weight:800;color:#232323; margin-bottom:0; text-transform:uppercase;} .hero-image p.hero-second-txt{font-weight:400;} .hero-image p.hero-disc{font-size:30px;} .hero-image p span{font-size:30px;font-weight:800;color:#194f90} .hero-imacretina-3 p{text-align:right} .hero-imacretina-1 { background-repeat:no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-image:url("../images/monitor1.jpg"); -webkit-animation: hero-imacretina-1-anim 15s 0s ease-in-out forwards infinite; animation: hero-imacretina-1-anim 15s 0s ease-in-out forwards infinite; opacity: 1; width: 100%; height: 230px; padding: 30px; margin-top: -20px; } .hero-imacretina-2 { background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-image: url("../images/monitor2.jpg"); -webkit-animation: hero-imacretina-2-anim 15s 0s ease-in-out forwards infinite; animation: hero-imacretina-2-anim 15s 0s ease-in-out forwards infinite; width: 100%; height: 230px; padding: 30px; margin-top: -20px; } .hero-imacretina-3 { background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-image: url("../images/monitor3.jpg"); -webkit-animation: hero-imacretina-3-anim 15s 0s ease-in-out forwards infinite; animation: hero-imacretina-3-anim 15s 0s ease-in-out forwards infinite; width: 100%; height: 230px; padding: 30px; margin-top: -20px; } @-webkit-keyframes hero-imacretina-1-anim { 0%, 30%, 96%, 100% { opacity:1; } 34%, 92% { opacity:0; } }@keyframes hero-imacretina-1-anim { 0%, 30%, 96%, 100% { opacity:1; } 34%, 92% { opacity:0; } }@-webkit-keyframes hero-imacretina-2-anim { 0%, 28%, 64%, 100% { opacity:0; } 32%, 62% { opacity:1; } }@keyframes hero-imacretina-2-anim { 0%, 28%, 64%, 100% { opacity:0; } 32%, 62% { opacity:1; } }@-webkit-keyframes hero-imacretina-3-anim { 0%, 60%, 98%, 100% { opacity:0; } 64%, 94% { opacity:1; } }@keyframes hero-imacretina-3-anim { 0%, 60%, 98%, 100% { opacity:0; } 64%, 94% { opacity:1; } } /**************** MENU 2 ************/ #menu2.navbar-inverse { background-image:none; background-color: #fff; height: 80px; border-bottom: 0px solid #11c1c1; box-shadow: 0 1px 15px rgba(0,0,0,.2); float: left; z-index: 8888; width:100%; } #menu2 .navbar-nav>li>.dropdown-menu { padding: 0 15px; margin-top: 20px; border-radius: 0px; background: #1d2026; } #menu2 .navbar-nav>li>.megamenu.dropdown-menu{margin-top: -4px;padding-top:25px;} #menu2 .vertical-li li { border-bottom: 1px solid #262c33; padding: 13px 0; } #menu2 .vertical-li li:hover { } #menu2 .vertical-li li:hover a{ color: #eeab37; } #menu2 .dropdown-menu>li>a { color: #b7bdc2; } #menu2 ul.menu-items li.menu-item { border-right: 0px solid #262a30; } #menu2 .vertical-li.dropdown-prod-cart li:hover{background-color:transparent;} #menu2 .dropdown-menu li a:hover { background-color:transparent; } #menu2 .mega-sub-menu li a { color: #b7bdc2; } #menu2 .vertical-li.dropdown-prod-cart li:hover{background-color:transparent;} #menu2 .angula-megamenu-title { color: #fff; } #menu2 .mega-sub-menu { padding-left:0px; } #menu2 .mega-sub-menu li { margin-bottom: 0px; padding: 13px 0px; border-bottom: 1px solid #262c33; } #menu2 .mega-sub-menu li:hover { } #menu2 .menu-text-monitor p:first-child { color: #fff; } #menu2 .menu-text-monitor p { color: #fff; } #menu2 .mega-sub-menu li:hover a{ color: #eeab37; } /*Cart*/ .content-count-cart-header { float: right; position: relative; z-index: 99999; } .content-count-cart-header span { color: #222; padding: 5px; font-size: 16px; border-radius: 100px; margin: 24px 12px 0 20px; } .content-count-cart-header a { color: #000; font-size: 14px; padding: 12px 12px 12px 0; position: relative; } .number-prod-cart { margin-top: -25px; margin-left: 60px; background: #fff; border-radius: 100%; padding: 2px 9px; color: #111; font-size: 13px; } /** Header Cart **/ .dropdown-menu.dropdown-prod-cart { border-radius:1px; padding: 7px 15px 12px 15px; width: 280px; left: -100px; margin-top: -3px; border: 1px solid rgba(0,0,0,0.2); } .dropdown-prod-cart ul { padding: 0; font-size: 12px; } .dropdown-prod-cart li { list-style-type: none; border-bottom: 0px solid #ddd; cursor: default; } .dropdown-prod-cart.content.s-size { height: 500px; } .dropdown-prod-cart li p { margin: 10px 0 0 0; color: #333; } .minitotal-prod { border-bottom: 1px solid rgba(0,0,0,0.3); padding: 10px 0; } .dropdown-prod-cart li:last-child .minitotal-prod { border-bottom: 0px solid rgba(0,0,0,0); } .vertical-li li .minitotal-prod a:hover{background:#fff;} .minitotal-prod a img.cls-remove{ float: right; width: 5%; } .mc-name { font-weight: 600; text-transform: uppercase; border-bottom: 1px solid #cdcdcd; } .minicart-img { padding: 0; } .minicart-data { padding-left: auto; padding-right: 0; } .separator { clear: both; width: 100%; border-top: 5px solid #ececec; margin: 10px 0; height: 1px; overflow: hidden; } #cartInfo { clear: both; width: 100%; text-align: center; font-size: 1.1em; margin-bottom: 10px; } .minucart-price { font-size: 13px; font-weight: 700; color: #333; } #goToCheckOut :hover { background-color: #999999; } #goToCheckOut { background-color: #666666; color: #ffffff; clear: both; display: block; width: 100%; padding: 7px 0; font-size: 11px; text-align: center; letter-spacing: 0.12em; } /*********** TOOLBAR ***************/ .toolbar { background: #222; width: 100%; z-index: 9998; padding: 8px 0; position: relative; height: 45px; text-transform: uppercase; border-bottom: 1px solid #e5e5e5; } .toolbar i { padding: 0 10px; color:#fff; font-size:14px; } .toolbar i.fa-envelope { padding: 0 10px 0 30px; } .top-contact { float: left; padding: 3px 16px 0 0; font-weight: 600; } .top-contact i{font-size:14px;} .top-contact i{color:#fff;} .top-contact span{color:#fff;} .top-login { float: right; padding: 3px 0 0; font-weight: 600; color:#fff; } .top-login .reg-top { margin-right: 30px; } .top-login .frm-clk { margin-right: 30px; } .top-login a, .top-login a:hover { color: #fff; text-decoration:none; } .header-lang { float: right; position: relative; } .header-lang a { display: block; padding: 0 13px; height: 27px; margin-top: -1px; } .langs-drop { display: none; position: absolute; left: 0; top: 23px; border-top: 0 solid #fff; padding: 10px 10px 3px 15px; background: #fcf8f5; width: 150px; z-index: 99999; } .langs-drop div{padding:6px 0} .header-lang a.langs-item:hover {color:#ff7200; } .header-lang a.langs-item.en { background: url(../images/flags/en.gif) left top no-repeat; } .header-lang a.langs-item.fr { background: url(../images/flags/fr.gif) left top no-repeat; } .header-lang a.langs-item.de { background: url(../images/flags/de.gif) left top no-repeat; } .header-lang a.langs-item.it { background: url(../images/flags/it.gif) left top no-repeat; } .header-lang a.langs-item { display: inline-block; font-size: 13px; color: #697374; margin: 0 0 11px; height: auto; padding: 0 0 0 24px; font-family: 'Open sans'; font-weight: 300; text-transform: uppercase; text-decoration: none; border: 0; line-height: 11px; } .navbar-fixed-top, .navbar-fixed-bottom { position: relative; } .push-top { position: fixed; } /**************** NOSLIDER ************/ @-webkit-keyframes move-bg { from { width: 0% } to { width: 100% } } @-moz-keyframes move-bg { from { width: 0% } to { width: 100% } } @keyframes move-bg { from { width: 0% } to { width: 100% } } .container-noslide { position: relative; height: 770px; } .cover-1-img{ height:100%; position:absolute; background:rgba(0,0,0,0.5); width:0%; } .cover-2-img{ height:0%; position:absolute; background:rgba(0,0,0,0.4); width:100%; } .container-noslide .cover-1-img.active{ -webkit-transition: width 1s ease-in-out; -moz-transition: width 1s ease-in-out; -o-transition: width 1s ease-in-out; transition: width 1s ease-in-out; width:100%; } .container-noslide .cover-2-img.active{ -webkit-transition: height 2s ease-in-out; -moz-transition: height 2s ease-in-out; -o-transition: height 2s ease-in-out; transition: height 2s ease-in-out; height:100%; } .container-noslide .container{ position:absolute; top: 0; left: 0; right: 0; } .txt-noslide-responsive h2{ font-size:40px; font-weight:300; color:#fff; text-transform:uppercase; text-align:left; margin:120px 0 0 0; padding:0; border:0; visibility:hidden; } .txt-noslide-responsive h2 span{color:#fff;} #text span { -webkit-font-smoothing: antialiased; -moz-font-smoothing:antialiased; position:relative; display:inline-block; color:#FFF; } .txt-noslide-responsive h3{ font-size: 16px; margin: 0 0 0 4px; font-weight: 300; color: #fff; visibility:hidden; font-family: 'Dosis', Sans-Serif; text-transform: uppercase; letter-spacing: 0.65em; } .txt-noslide-version{margin-top:50px;} @-webkit-keyframes spin1 { 0% { -webkit-transform: rotateY(0deg);} 100% { -webkit-transform: rotateY(360deg);} } @-moz-keyframes spin1 { 0% { -moz-transform: rotateY(0deg); } 100% { -moz-transform: rotateY(360deg);} } @-o-keyframes spin1 { 0% { -o-transform: rotateY(0deg);} 100% { -o-transform: rotateY(360deg);} } @-ms-keyframes spin1 { 0% { -ms-transform: rotateY(0deg);} 100% { -ms-transform: rotateY(360deg);} } @-keyframes spin1 { 0% { transform: rotateY(0deg); } 100% { transform: rotateY(360deg);} } .txt-noslide-version h2{ border:0; visibility:hidden; opacity: 0.3; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; -webkit-transform: scale(0.3); -moz-transform: scale(0.3); transform: scale(0.3); } .txt-noslide-version h2.rotate-circolar{ border:0; visibility:visible; opacity: 1; -webkit-transform-origin: 0% 0%; -moz-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transition-duration: 2s; /* Safari */ transition-duration: 2s; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); -webkit-animation: spin1 2s linear; -moz-animation: spin1 2s linear; -o-animation: spin1 2s linear; -ms-animation: spin1 2s linear; animation: spin1 2s linear; } .txt-noslide-version h2 span.version-txt{ text-transform:uppercase; font-size:30px; font-weight:300; border:0; color:#fff; background: #426ca9; padding: 2px 10px; border-radius: 2px; position: absolute; margin: 210px 0 0 -140px; } .txt-noslide-version h2 span.noslider-number{ font-size:320px; font-weight:300; color:#fff; } .txt-noslide-frm{margin-top:100px;width:35%;} .txt-noslide-frm h2{ color:rgba(0,0,0,0.8); background: #fff; text-transform:uppercase; padding: 2px 10px; border-radius: 2px; border:0; font-size: 24px; font-weight: 300; padding:3px 6px; margin-bottom:10px; visibility:hidden; } .txt-noslide-frm h3{ font-size: 16px; visibility:hidden; font-family: 'Dosis', Sans-Serif; text-transform: uppercase; letter-spacing: 0.65em; padding:0px 6px; color:#fff; } /**************** PORFOLIO ************/ .img-home-portfolio, .img-customer, .portfolio-item { margin-bottom: 30px; } .overlay { display: block; position: absolute; z-index: 20; background: rgba(61,103,175,0.8); overflow: hidden; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .img-customer { margin: 0; padding: 20px 0; } .img-prt .img { position: relative; width: 100%; } .effect-5 .img img { display: block; max-width: 100%; height: auto; } a.close-overlay { display: block; position: absolute; top: 0; right: 0; z-index: 100; width: 45px; height: 45px; font-size: 20px; font-weight: 700; color: #fff; line-height: 45px; text-align: center; background-color: #000; cursor: pointer; } a.close-overlay.hidden { display: none; } .effect-5 a.expand { display: block; position: absolute; z-index: 100; width: 60px; height: 60px; border: solid 2px #fff; text-align: center; text-decoration: none; color: #fff; line-height: 55px; font-weight: 700; font-size: 20px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; border-radius: 30px; } .effect-5 .overlay { top: 0; bottom: 0; left: 0; right: 0; opacity: 0; margin:10px; } .effect-5 .overlay a.expand { top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 100%; height: 100%; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .effect-5 .img-prt:hover .overlay { opacity: 1; } .effect-5 .img-prt:hover .overlay a.expand { width: 60px; height: 60px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; border-radius: 30px; } .tab-pane { margin-top: 15px; } /**** SLIDER ******/ @font-face { font-weight: normal; font-style: normal; font-family: 'codropsicons'; src:url('fonts/codropsicons/codropsicons.eot'); src:url('fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'), url('fonts/codropsicons/codropsicons.woff') format('woff'), url('fonts/codropsicons/codropsicons.ttf') format('truetype'), url('fonts/codropsicons/codropsicons.svg#codropsicons') format('svg'); } /* Header */ .codrops-header { z-index: 1000; position: absolute; top: 50%; left: 50%; text-align: center; max-width: 600px; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .md-button.md-default-theme { border-radius: 100%; } .codrops-header h1 { margin: 0; font-weight: 200; font-size: 40px; line-height: 1; } .codrops-header h1 span { display: block; padding: 20px 0; font-size: 18px; line-height: 22px; opacity: 1; font-weight: 400; } /* To Navigation Style */ .codrops-top { width: 100%; text-transform: uppercase; font-weight: 400; font-size: 0.69em; line-height: 2.2; position: relative; z-index: 2000; } .codrops-top a { display: inline-block; padding: 0.3em 0.7em; text-decoration: none; letter-spacing: 1px; margin: 5px; width: 165px; color: #212121; } .codrops-top span.right { float: right; } .codrops-top span.right a { display: block; float: left; } .codrops-icon:before { margin: 0 4px; text-transform: none; font-weight: normal; font-style: normal; font-variant: normal; font-family: 'codropsicons'; line-height: 1; speak: none; -webkit-font-smoothing: antialiased; } .codrops-icon-drop:before { content: "\e001"; } .codrops-icon-prev:before { content: "\e004"; } /* Demo Buttons Style */ .codrops-demos { padding-top: 2em; font-size: 0.8em; } .codrops-demos.home3 { padding-bottom: 5px; } .codrops-demos a { display: inline-block; margin: 0.8em; padding: 51px 28px; outline: none; border: 1px solid #ccc; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; color: #212121; background: rgba(255,255,255,0.8); font-size: 13px; border-radius: 100%; box-shadow: inset 0 0 0 7px rgba(255,255,255,0.3); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; transition: all 0.4s ease; } .codrops-demos a:nth-child(2) { padding: 51px 33px; } .codrops-demos a:nth-child(3) { padding: 51px 45px; } .codrops-demos a:hover, .codrops-demos a.current-demo, .codrops-demos a.current-demo:hover { color: #212121; border-color: rgba(12,199,199,0.3); box-shadow: inset 0 0 0 7px rgba(12,199,199,0.3); } .buttondemoBasicUsage { /** From vulcanized demo **/ } .buttondemoBasicUsage section { background: #f7f7f7; border-radius: 3px; text-align: center; margin: 1em; position: relative !important; padding-bottom: 10px; } .buttondemoBasicUsage md-content {margin-right: 7px; } .buttondemoBasicUsage section .md-button:not(.md-fab) {min-width: 10em; } .buttondemoBasicUsage section .md-button { display: block; margin: 1em; line-height: 25px; } @media screen and (max-width: 25em) { .codrops-icon span { display: none; } } #slides_control { position:absolute; left:50%; top:20px; margin-left:-200px; } .slide-txt { font-family: 'Open sans',sans-serif; font-weight: 700; font-size: 130px; color: #ccc; } .second-tt { margin-top: 120px; } .carousel-caption { text-shadow: 0 1px 2px rgba(0,0,0,.4); top: 30%; } .carousel-caption.caption-cc-0 p.slide-txt, .carousel-caption.caption-cc-2 p.slide-txt{ color:#ccc; } .carousel-caption.caption-cc-2{ top: 15%; } .arrow { position: absolute; z-index: 1002; display: block; top: 50%; margin-top: -35px; width: 36px; height: 71px; outline: none; cursor: pointer; background: url(../assets/blank.gif) no-repeat; } .arrow.prev { opacity: 0.2; left: 20px; background-image: url(../assets/paddle_prev_999.png); transition: 0.2s linear all; } .arrow.next { opacity: 0.2; right: 20px; background-image: url(../assets/paddle_next_999.png); transition: 0.2s linear all; } .arrow.prev:hover { opacity: 1; background-image: url(../assets/paddle_prev_fff.png); } .arrow.next:hover { opacity: 1; background-image: url(../assets/paddle_next_fff.png); } .boxgallery-fix { background-image:url(../images/slider/boat/1.jpg); background-repeat:no-repeat !important; background-position:0 0 !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width:100%; z-index: 9; height: 770px; } .slide-tp-box { background: rgba(255,255,255,0); padding: 0px 20px 30px 30px; border-right: 3px solid #6886b8; text-align: center; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; transition: all 0.4s ease; } .slide-inner-txt { width: 100%; position: absolute; z-index: 9; margin-top: 11%; background: rgba(0,0,0,0.6); padding: 60px 0 40px 0; } .slide-inner-txt h3 { font-size: 86px; z-index: 99999; text-align: right; font-weight: 700; text-transform: uppercase; margin: -15px 0 0 0; color: #fff; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; transition: all 0.4s ease; } .slide-inner-txt p { color: #fff; text-align: left; padding-left: 10px; } .slide-tp-box p { text-align: right; } .slide-col { position: relative!important; } .slide-sucont { float: right; } .slide-rx-txt { margin-top: 70px; margin-left: 10px; } .slide-rx-txt p { margin-bottom: 40px; } .get-starter a { margin: 0 auto; text-align: center; font-size: 14px; border-radius: 0px; padding: 12px 35px; text-transform: uppercase; background-color: transparent; border: 2px solid #fff; text-decoration: none; color: #fff; margin-left: 10px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; transition: all 0.4s ease; } .get-starter a:hover { color: #222; background: #fff; } /************************* Image Top Move *******************/ #hero { background: #f2f2f2; text-align: center; overflow: hidden; display: block; width: 100%; } .scene { position: relative; overflow: hidden; } .scene, .layer { display: block; height: 100%; width: 100%; padding: 0; margin: 0; } .background { background: #000 url(../img/slide2.jpg) no-repeat center left; bottom: -20px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: absolute; width: 110%; left: -5%; top: -5%; } #container-top { min-width: 100%; min-height: 100%; } .container-color { position: absolute; width: 100%; top:70px; } .slider-content-txt { margin-top:340px; } h2.logo { font-family: 'Open sans', Sans-Serif; font-weight: 700; color: #fff; font-size: 160px; text-align: right; margin: 10px 0 0 0; text-transform: uppercase; text-shadow: 0 1px 1px rgba(0,0,0,0.3); border:0; } .box-desc-txt-logo { width: 100%; margin: 20px auto; } .box-desc-txt-logo p{ color: #fff; font-family: 'Dosis', Sans-Serif; font-size: 13px; text-transform: uppercase; text-align: center; font-weight: 300; line-height: 30px; text-shadow: 0 1px 1px rgba(0,0,0,0.3); } /************************* HOME *******************/ .home { background-image: url(../images/sos.png); background-repeat: repeat !important; width: 100%; } .home-info-desc { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.3); margin: 5px 0 0 5px; width: 32.8%; padding: 20px 15px 25px 15px; } .banner-info .icn-con{ margin-top: 20px; width: 14%; font-size: 30px; color: #6886b8; } h2.home-middle-parallax { border-bottom: 0px; } .banner-info h3{ font-size: 20px; font-weight: 400; } /* Page Sections */ .section, .section-colored { padding: 110px 0; } .section-colored hr { width: 100px; height: 1px; background-color: #6886b8; border-color: #6886b8; } .section-ground { background-image: url(../images/hexagon.png); background-repeat: repeat; position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .section-colored { background-color: #21252b; position: relative; color: #fff; /* change this to change the background color of a colored section */ } .section-colored p{ font-weight: 400; color:#ccc; } .sidebar { margin-top: 40px; } .sidebar ul { border-radius: 5px; padding: 5px; border: 1px solid #cccccc; } ul.list-desc { list-style-type: none; padding-left: 0px; } ul.list-desc li{ line-height: 20px; padding: 5px 0; background: #f9f9f9; border: 1px solid #eee; margin-bottom: 2px; } ul.list-desc li i{ color: #6487c3; margin-left: 10px; margin-right: 10px; } #soundcloud_widget { margin-top: 20px; border: 0px; width:100%; height:120px; } /***** CLIENTS *****/ ul.clients { list-style-type: none; display: inline-block; margin-top: 0; } ul.clients li{ margin-right: 10px; display: inline-block; width: 18%; } ul.clients li img{ width: 100%; } .tooltip-inner { max-width: 200px; padding: 10px 14px; color: #eee; text-align: center; text-decoration: none; background-color: #212121; border-radius: 3px; font-family: 'Open sans', sans-serif; font-weight: 300; font-size: 14px; } .tooltip.top .tooltip-arrow { border-top-color: #212121; } .img-shadow img{ -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.1); -moz-box-shadow: 0 1px 2px rgba(0,0,0,.1); box-shadow: 0 1px 2px rgba(0,0,0,.1); border-radius: 2px; } .parallax .container { position: relative; height: 100%; } .parallax{ background-image:url(../images/parallax/parallax.jpg); background-repeat:no-repeat !important; background-position: 50% 134px; background-position:0 0 !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width:100%; height:auto; text-align:center; position: relative; padding: 110px 0; } .black-shadow { background: rgba(30, 35, 41, 0.7); position: absolute; top: 0; left: 0; bottom: 0; right: 0; } #clients .black-shadow { background: rgba(255, 255, 255, 0.2); position: absolute; top: 0; left: 0; bottom: 0; right: 0; } #clients .section-title{ color: #333; margin-top: 0px; } #clients .sub-title{ color: #333; } /***Percentage***/ .skillbar.first-child { margin-top: 50px; } .skillbar { position:relative; display:block; margin-bottom:15px; width:100%; background:#fff; height:35px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; -webkit-transition:0.4s linear; -moz-transition:0.4s linear; -ms-transition:0.4s linear; -o-transition:0.4s linear; transition:0.4s linear; -webkit-transition-property:width, background-color; -moz-transition-property:width, background-color; -ms-transition-property:width, background-color; -o-transition-property:width, background-color; transition-property:width, background-color; } .skillbar-title { position:absolute; top: -20px; left:0; width:110px; font-weight:bold; font-size:13px; color:#333; background:#3d67af; -webkit-border-top-left-radius:3px; -webkit-border-bottom-left-radius:4px; -moz-border-radius-topleft:3px; -moz-border-radius-bottomleft:3px; border-top-left-radius:3px; border-bottom-left-radius:3px; } .skillbar-title span { display:block; padding:0 20px; font-weight: 600; height:0px; line-height:0px; -webkit-border-top-left-radius:3px; -webkit-border-bottom-left-radius:3px; -moz-border-radius-topleft:3px; -moz-border-radius-bottomleft:3px; border-top-left-radius:3px; border-bottom-left-radius:3px; } .skillbar-bar { height:5px; width:0px; background:#3d67af; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; } .skill-bar-percent { position:absolute; right:10px; top:-20px; font-size:11px; height:35px; line-height:0px; color:#ffffff; color:rgba(0, 0, 0, 0.4); } .digital-photo { width: 80%; } .fill { width: 100%; height: 700px; background-position: top center; background-size: cover; } /******INFO COMPANY ****/ #infoCompany.section { padding: 80px 0 0 0; } /***** TEAM *****/ .team-img { width: 100%; float: left; } .team-img img { box-shadow: 0 1px 2px rgba(0,0,0,0.4); } .team p{ font-weight: 700; margin-top: 20px; font-size: 14px; text-transform: uppercase; color: #212121; float: left; } /*-----------------*/ /***** Hera *****/ /*-----------------*/ figure.effect-hera { background:#000; position:relative; } figure.effect-hera:hover img{ opacity:0.3; } figure.effect-hera h2 { font-size: 158.75%; } figure.effect-hera p.name-team { position: absolute; top: 29%; left: 20%; color:#fff; letter-spacing:0.09em; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-30%,-30%,0) rotate3d(0,0,1,-90deg); transform: translate3d(-30%,-30%,0) rotate3d(0,0,1,-90deg); -webkit-transform-origin: 50%; transform-origin: 50%; } figure.effect-hera:hover p.name-team { opacity: 1; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,-90deg); transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,-90deg); } figure.effect-hera h2, figure.effect-hera p { position: absolute; top: 34%; left: 50%; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-50%,-50%,0); transform: translate3d(-50%,-50%,0); -webkit-transform-origin: 50%; transform-origin: 50%; } figure.effect-hera figcaption::before { position: absolute; top: 35%; left: 35%; width: 40%; height: 40%; border: 1px solid rgba(255,255,255,0.3); content: ''; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(0,0,1); transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(0,0,1); -webkit-transform-origin: 50%; transform-origin: 50%; } figure.effect-hera figcaption::after { position: absolute; top: 65%; left: 65%; width: 40%; height: 40%; border: 1px solid rgba(255,255,255,0.3); content: ''; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(0,0,1); transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(0,0,1); -webkit-transform-origin: 50%; transform-origin: 50%; } figure.effect-hera p { width: 100px; text-transform: none; font-size: 121%; line-height: 2; } figure.effect-hera p a { color: #fff; margin-right: 5px; float: left; } figure.effect-hera p a:last-child { margin-right: 0px; } figure.effect-hera p a:hover, figure.effect-hera p a:focus { opacity: 0.6; } figure.effect-hera p a i { opacity: 0; border-radius: 100%; padding: 6px 7px; background: rgba(255,255,255,0.7); color: #333; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; } figure.effect-hera p a i.fa-facebook, figure.effect-hera p a i.fa-google { padding: 6px 9px; } figure.effect-hera p a:first-child i { -webkit-transform: translate3d(-60px,-60px,0); transform: translate3d(-60px,-60px,0); } figure.effect-hera p a:nth-child(2) i { -webkit-transform: translate3d(60px,-60px,0); transform: translate3d(60px,-60px,0); } figure.effect-hera p a:nth-child(3) i { -webkit-transform: translate3d(-60px,60px,0); transform: translate3d(-60px,60px,0); } figure.effect-hera p a:nth-child(4) i { -webkit-transform: translate3d(60px,60px,0); transform: translate3d(60px,60px,0); } figure.effect-hera:hover figcaption::before { opacity: 1; -webkit-transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(1,1,1); transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(1,1,1); } figure.effect-hera:hover figcaption::after { opacity: 1; -webkit-transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(1,1,1); transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(1,1,1); } figure.effect-hera:hover h2 { opacity: 0; -webkit-transform: translate3d(-50%,-50%,0) scale3d(0.8,0.8,1); transform: translate3d(-50%,-50%,0) scale3d(0.8,0.8,1); } figure.effect-hera:hover p i:empty { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); /* just because it's stronger than nth-child */ opacity: 1; } /* Social Icons Material Design */ .md-fab i{ color:#fff; padding:0px; text-align:center; } .md-button.md-default-theme.md-raised, .md-button.md-default-theme.md-fab { background-color: #3d67af; } .md-button.md-fab{ width: 36px; height: 36px; } .md-button.md-default-theme.md-fab:not([disabled]):hover { background-color: #3d67af; } md-tooltip{ font-size: 13px; font-family: 'Open sans', sans-serif; font-weight: 300; letter-spacing:1px; border-radius: 2px; left: -17px !important; } .twitter-link md-tooltip { left: -8px !important; } md-content{ width:40px; height:90px; padding:3px 0 0 0; text-align:center; border:0px solid #333; z-index: 90; position: static; margin:0 auto; } .md-button.md-fab, .md-button.md-raised:not([disabled]), .md-shadow-bottom-z-1 { box-shadow: 0 1px 2px 0 rgba(0,0,0,.26); } md-tooltip.md-show { transition: all 0.4s cubic-bezier(0.25, 1, 0.25, 1); pointer-events: auto; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Social Icons Styles */ .about2-team .list-inline>li.tooltip-social { position: relative; padding-right: 0; padding-left: 6px; } .list-social-icons { margin-bottom: 45px; margin-top: 20px; } .tooltip-social a { text-decoration: none; border-radius: 2px; color: #fff; padding: 5px 0; } .tooltip-social a i{ background: #3d67af; padding: 8px 9px; } .tooltip-social a i.fa-facebook { padding: 8px 11px; } .facebook-link a i.fa-facebook:hover { background: #3b5998; } .linkedin-link a i.fa-linkedin:hover { background: #007fb1; } .twitter-link a i.fa-twitter:hover { background: #39a9e0; } .google-plus-link a i.fa-google-plus:hover { background: #d14836; } /* Service Page Styles */ .service-icon { font-size: 50px; } /* 404 Page Styles */ .error-404 { font-size: 8em; } /* Pricing Page Styles */ .price { font-size: 4em; } .price-cents { vertical-align: super; font-size: 50%; } .price-month { font-size: 35%; font-style: italic; } .top-well { background-image:url(../images/pw_maze_black.png); background-repeat:repeat !important; width: 100%; margin-bottom: 0px; padding: 50px 0px 50px 0px; margin-bottom: 0px; color: #fff; } .well { margin-bottom: 0px; padding: 100px 0px 90px 0px; margin-bottom: 0px; background: rgba(0,0,0,0.7); color: #fff; border: 0px; border-bottom: 0px solid #333; border-radius:1px; } .effect-cover { width: 100%; height: 100%; position: absolute; opacity:0.3; } .left-color-box-txt{ width: 100%; height: 100%; background-color: #3d67af; padding: 80px; box-shadow: 20px 20px 0 #fff; } .left-color-box-txt h2{ border: 0; font-size: 80px; font-weight: 800; line-height: 58px; } .city-bg { background-image:url(http://placehold.it/1920x800); background-repeat:no-repeat !important; width: 100%; position: relative; background-repeat:no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .city-bg .well{ padding: 140px 20px 130px 20px;} .city-bg p{color: rgba(255,255,255,0.9);} .city-bg h4{margin-top: 0px;} /******************************************************************************************** PAGE ABOUT *********************************************************************************************/ .about-top-img { background:#426ca9; width: 100%; height: 450px; position: relative; background-position: bottom; overflow: hidden; } .abt-iphone{margin-top:120px;position:absolute;right:15%;} .abt-iphone img{ -webkit-animation: rotate 3.5s linear; animation: rotate 3.5s linear; } .animated.abt-iphone { -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes rotate { 0% { -webkit-transform: rotateY(0deg) rotate(-15deg)} 50% { -webkit-transform: rotateY(15deg) rotate(-3deg)} 80% { -webkit-transform: rotateY(25deg) rotate(-1deg)} 100% { -webkit-transform: rotateY(0deg) rotate(0deg)} } @keyframes rotate { 0% { transform: rotateY(0deg) rotate(-15deg)} 50% { transform: rotateY(15deg) rotate(-3deg)} 80% { transform: rotateY(25deg) rotate(-1deg)} 100% { transform: rotateY(0deg) rotate(0deg)} } .about-sl-txt {margin-top: 120px;} .color-txt {color: #3d67af;} .about-top-title { text-align: left; font-family: 'Open sans',sans-serif; font-weight: 700; font-size: 100px; text-transform: uppercase; color: #fff; margin-top: 140px; margin-bottom: 75px; } .about-top-title.small-li{font-weight:300;} .about-second-title { text-align: left; font-family: 'Open sans',sans-serif; font-weight: 700; font-size: 100px; text-transform: uppercase; color: #fff; } .about-top-img .effect-over { background: rgba(0,0,0,0.2); } .effect-over { background: rgba(0,0,0,0.5); position: absolute; top: 0; left: 0; bottom: 0; right: 0; } h2.t-title-office { margin-top: 0px; } h2.t-title-office.office2 { margin-top: 5px; } .breadcrumb-color { background-color: #f5f5f5; padding: 17px 0px; margin-bottom: 110px; border-bottom: 1px solid #e6eaea; } .breadcrumb-color.bb-no-margin{margin-bottom: 0px;} .breadcrumb { border-radius: 2px; padding: 0; margin-bottom: 0; text-align: left; } .breadcrumb ol { margin-bottom: 0; } .breadcrumb>li { font-size: 13px; font-weight: 600; } .about-generic h3 { text-transform: uppercase; font-size: 14px; font-weight: 700; } .about-desc-people { position: relative; } .about-generic.horizontal { margin-bottom: 50px; } .about-my-office { margin-bottom: 30px; } .about-generic .job-title { margin: 10px; position: absolute; float: right; bottom: 50px; color: #fff; left: 96.1%; } .about-generic .job-title span { z-index: 10; color: #FFF; position: absolute; left: -60px; bottom: -60px; font-size: 11px; text-transform: uppercase; } .about-generic .job-title:after { content: ''; position: absolute; border-bottom: 60px solid rgba(61,103,175,0.7); border-right: 0; border-left: 100px solid transparent; right: 0; z-index: 2; } .about-generic .job-desc { border-bottom: 1px dotted #ccc; padding-bottom: 20px; } .about-generic.horizontal h3{ margin-top: 0px; } /******************************************************************************************** PRICING TABLE *********************************************************************************************/ .pricing-top-img { background-image:url(../images/pricing.jpg); background-repeat:no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 450px; position: relative; background-position: bottom; } .panel-body { background: #262c32!important; border-color: #32383f!important; color: #fff; padding: 25px 25px 25px 25px; } .panel-default>.panel-heading { background: #32383f; color: #fff; border-bottom: 0px; } .panel.panel-default{box-shadow: 0 1px 2px rgba(0,0,0,.2);} .panel.panel-default.panel-selected { box-shadow: 0 2px 6px rgba(0,0,0,0.4); } .panel-title{font-weight:400;} .pi-italic { font-style: italic; color: #ccc; padding: 15px 5px 0 5px; } .list-group-item { padding: 15px 15px; } .panel-select { background: #3d67af!important; } .panel-heading-select { background: #6886b8!important; } .panel-select p { color: #fff; } .panel-selected { box-shadow: 0 2px 6px rgba(0,0,0,0.6); } /*** second price table ***/ .second-price { margin-top: 100px; } .second-price .panel-default > .panel-heading { border-radius: 1px; padding: 16px 15px; } .second-price .panel>.list-group .list-group-item { background: #32383f; color: #fff; border: 1px solid rgba(255,255,255,0.1); font-weight: 300; } .panel-violet .panel-default>.panel-heading { background: #7185b5; } .panel-violet .panel-body { background: #3e5694!important; border-color: #33508d!important; } .second-price.panel-violet .panel>.list-group .list-group-item { background: #7185b5; color: #fff; border: 1px solid rgba(255,255,255,0.1); font-weight: 300; } /*** third price table ***/ .third-price .panel { border: 1px solid rgba(0,0,0,0.2); } .third-price { margin-top: 100px; } .third-price .panel-default > .panel-heading { border-radius: 1px; padding: 16px 15px; background: #fff; color: #32383f; font-size: 26px; font-weight: 400; text-transform: uppercase; } .third-price .panel>.list-group .list-group-item { background: #fff; color: #32383f; border-top: 1px solid rgba(0,0,0,0.2); border-bottom: 1px solid rgba(0,0,0,0.2); font-weight: 400; } .third-price .panel-body { background: #fff !important; color: #3d67af; } .third-price .pi-italic { color: #333; } .third-price .panel-body p { font-size: 13px; } .third-price .panel-title { border-radius: 100%; border: 3px solid #3d67af; padding: 32px 0; width: 45%; text-align: center; margin: 0 auto; } .third-price .panel-title { font-size: 32px; } /******************************************************************************************** PAGE SERVICES *********************************************************************************************/ .services-top-img { background-image: url(../images/paper-9.jpg); background-repeat: no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 450px; position: relative; } .services-top-img .effect-over { background: rgba(0,0,0,0); } .last-inf-dt { margin-bottom: 110px; } .info-tabs { padding:60px 40px; } .tab-content>.tab-pane { margin: 0; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; } .services-tabs { margin-top: 110px; margin-bottom: 0px; } .page-header-title { margin: 110px 0 30px; } .about2-my-office .page-header-title { margin: 20px 0 30px; } .tabs-nm { font-size: 16px; } .nav-tabs.nav-justified>.active>a, .nav-tabs.nav-justified>.active>a:hover, .nav-tabs.nav-justified>.active>a:focus { border-top: 3px solid #3d67af; color: #212121; } .nav-tabs.nav-justified>li>a { color: #636363; } .servtabs-img{ float: left; margin-right: 20px; position: relative; } .servtabs-txt h3 { margin-top: 0; font-weight: 600; text-transform: uppercase; font-size: 16px; } .clearfix:after { content: ""; clear: both; display: table; } .img-people-s { margin: 0 auto 0px auto; } /*top box*/ .services-box { margin-top: 110px; margin-bottom: 0px; } .services-box .img { width: 44.6%; padding: 0; margin: 0px; float: left; } .services-box .text { position: relative; width: 55%; padding: 40px; margin: 0 0 0 0; float: left; background-color: #262c32; z-index: 15; min-height: 250px; transition: all 0.3s ease-out 0s; } .services-box h4.white { color: #fff; text-transform: uppercase; } .services-box p { color: #fff; } .services-box .text .line { width: 100%; height: 1px; padding: 0; margin: 0 0 20px 0; float: left; background-color: #fff; } .services-box.active .text { background-color: #3d67af; } .services-box:hover .text .line, .services-box.active .text .line { background-color: #fff; } .services-box-black { background: #262c32; color: #fff; float: left; padding: 20px; } .services-box-black p { color: #f6f6f6; margin-bottom: 30px; } .services-box-black h3 { text-transform: uppercase; font-weight: 600; letter-spacing: 1px; font-size: 15px; } /******************************************************************************************** PAGE FAQ *********************************************************************************************/ .faq-top-img { background-color: #94a8cc; width: 100%; height: 450px; position: relative; } .effect-over-hand { background-image: url(../images/texture/swirl_pattern.png); background-repeat: repeat !important; width: 100%; height: 100%; position: absolute; opacity: 0.3; } .faq-top-img h1 { font-size: 66px; text-align: center; margin-top: 16%; color: #fff; } .faq-title { margin-bottom: 40px; font-weight: 300; text-transform: none; line-height: 45px; font-size: 28px; } .faq-accordion .panel-default>.panel-heading { background: #fff; color: #fff; padding: 25px 15px; border-radius: 0px; border-bottom: 1px solid #ddd; } .faq-accordion .panel{ -webkit-box-shadow: 0 0px 0px rgba(0,0,0,.0); box-shadow: 0 0px 0px rgba(0,0,0,.0); border: 0px solid transparent; } .faq-accordion .panel-body { background: #fff!important; color: #32383f; border-color: #fff!important; } .panel-heading a i.pull-right { background: #3d67af; border:1px solid #6886b8; text-shadow: 0 0px 0 rgba(0,0,0,0); color: #fff; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; padding: 7px 7px 5px 7px; margin-right: 15px; margin-top: -4px; font-size: 11px; float: left !important; } .faq-accordion h4 { font-size: 16px; font-weight: 400; text-decoration: none; color: #232323; } .faq-accordion h4:hover a{color:#94a8cc} .faq-accordion h4 a:focus{color:#94a8cc} .faq-accordion h4 a { text-decoration: none; border: 0px; text-transform: uppercase; font-size: 13px; } /******************************************************************************************** PAGE BLOG *********************************************************************************************/ .blog-top-img { background-image:url(../images/product/blog-top.jpg); background-repeat:no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 450px; position: relative; } .blog-date { font-size: 11px; color: #222; } .blog-ico{padding:0} .blog-ico span{ font-size:30px; margin-top:0px; } .blog-row-prod { padding: 110px 0; } .blog-info-prod { padding: 30px 20px; } .blog-info-prod h3 { margin-top:0; padding: 0 0 0px 0; margin-bottom: 3px; } .blog-info-prod h3 a { color:#222; text-transform: uppercase; text-decoration:none; font-weight: 600; font-size: 18px; } .blog-desc-prod { padding: 10px 0; } .blog-author { font-style:italic; opacity: 0.6; } .blog-info-prod:hover .blog-author { opacity: 1; } /******************************************************************************************** PAGE BLOG RIGHT *********************************************************************************************/ .blog-top-img { background-image:url(../images/product/blog-top.jpg); background-repeat:no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 450px; position: relative; background-position: top center; } .widget_search { position: relative; padding-bottom: 2px; } .sidepanel { margin-bottom: 30px; } .widget_search input[type="text"] { display: block; width: 100%; background: #fff; text-shadow: none; font-size: 14px; line-height: 20px; color: #666666; font-weight: 300; padding: 6px 15px 7px 15px; border: 1px #bfbfbf solid; border-radius: 17px; -webkit-border-radius: 17px; margin: 110px 0 20px 0; -webkit-appearance: none !important; outline: none; } .widget_search input[type="submit"] { cursor: pointer; background-color: transparent !important; margin: 0 !important; padding: 0 !important; height: 17px !important; width: 17px !important; border: none !important; box-shadow: none !important; line-height: 17px !important; text-decoration: none; display: block; text-indent: -9999px; position: absolute; top: 9px; right: 13px; z-index: 10; background-color: transparent; background-image: url(../images/sprite.png); background-repeat: no-repeat; background-position: -83px 0; } .blog-left-col{padding-right:25px;} .blog-right-col{padding-left:25px;} .blog-ico-left { position: absolute; z-index: 999; background: #6886b8; padding: 7px; margin: 20px 30px; text-align:center; } .last-inf-dt.right-blg{float:right;} .content-bl-info{ padding: 20px; border:1px dashed rgba(255,255,255,0.4); } .blog-ico-left span{ font-size:30px; } .blog-ico-left p{ color:#fff; } .category { list-style-type: none; padding: 0; margin-bottom: 50px; } .category li i { margin-right:10px; margin-bottom: 10px; } .category li:hover { color:#3d67af; cursor: pointer; } .post-lateral { list-style-type: none; padding: 0; margin-bottom: 60px; } .post-lateral li{ margin-bottom: 20px; } .post-lateral li img{ margin-right: 10px; float: left; } .post-data { font-size: 11px; color:#c3c3c3; } .tags { list-style-type: none; padding: 0; } .tags li { padding:5px 15px; display: inline-block; border-radius:30px; border:1px solid #c3c3c3; margin-bottom: 10px; margin-right: 3px; } .tags li:hover { color:#3d67af; cursor: pointer; border:1px solid #3d67af; } .blog-info-prod .blog-r-title { margin-top: 10px; } .blog-info-prod .blog-r-title a { color:#333; } .blog-info-prod #owl-demo .item img { display: block; width: 100%; height: auto; float: left; border-radius: 0; } .blog-info-prod .owl-carousel .owl-item { float: left; padding: 0 0px; border-bottom: 0px solid #ccc; border-top: 0px solid #ccc; } .js-video iframe { vertical-align: top; width: 100%; height: 400px; display: block; padding: 0; margin: 0; border: 0; } .blog-row-prod .blog-left-col { float:right; } .bg-image:before{ content: ''; position: absolute; z-index:999; top: 0; bottom: 0; right: 0; left: 0; -webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -ms-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out; } .bg-image:after{ content: ''; position: absolute; z-index:999; top: 0; bottom: 0; right: 0; left: 0; -webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -ms-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; transition: all .6s ease-in-out; } .eft-flash:hover .bg-image:before{ right: 50%; left: 50%; background: rgba(255,255,255,0.2); z-index:999; } .eft-flash:hover .bg-image:after{ top: 50%; bottom: 50%; background: rgba(255,255,255,0.2); z-index:999; } .content-text-desc-blog{ position: absolute; bottom: 50px; left: 30px; } .content-text-desc-blog h3{ color: #fff; background: #222; padding: 10px 20px; text-transform: uppercase; } .content-text-desc-blog h4{ font-size: 30px; color: #fff; background: #222; padding: 10px 20px; text-transform: uppercase; } /******************************************************************************************** PAGE BLOG POST *********************************************************************************************/ .blog-post-right-col .well { background-image: none; margin-bottom: 40px; border-radius: 2px; } .blog-post-right-col .well h4{ text-transform: uppercase; } /******************************************************************************************** PAGE CONTACT *********************************************************************************************/ .breadcrumb-contact { margin-top: -6px; } .form-control { background: #f2f2f2; border-color: #dde1e1; padding: 8px 11px 9px; height: 44px; color: #333; font-size: 13px; -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.055); box-shadow: inset 0 1px 3px rgba(0,0,0,.055); } #contact-form { margin-top: 40px; } #contact-form label { margin-bottom: 5px; font-weight: 600; color: #333; } #contact-form input::-webkit-input-placeholder { color: #7e7e7e; } #contact-form input:-moz-placeholder { color: #7e7e7e; } #contact-form input::-moz-placeholder { color: #7e7e7e; } #contact-form input:-ms-input-placeholder { color: #7e7e7e; } .contact-sub-txt { font-size: 18px; font-weight: 300; font-style: italic; line-height: 24px; } .form-group { margin-bottom: 30px; } .form-control { border-radius: 1px; } .contact-title { text-transform: uppercase; margin-bottom: 20px; } .contact-details p { margin-bottom: 20px; } .bt-contact-submit { padding: 10px 25px } #contact-form .success{display:none;} #contact-form .error{display:none;} /******************************************************************************************** PAGE HOME 2 *********************************************************************************************/ .services-top-home2 { background-image: url(../images/paper-9.jpg); background-repeat: no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 700px; position: relative; } .section-images h2 { margin-top: 0px; } .services-top-home2 .effect-over { background: rgba(52,94,158,0.5); } .services-top-home2 h1{visibility:hidden;} .page-header-title.home2-title { margin: 0px 0 20px; } #clients-home2 .section-title { color: #232323; margin-top: 0px; } .btn-see-more{margin-top:20px;} #clients-home2 .sub-title { color: #fff; } #clients-home2 .team-img { width: 100%; float: left; border: 15px solid rgba(255,255,255,0.2); margin-top: 20px; } .view-second .content { padding-top: 60px; } #clients-home2 .team p { font-weight: 700; margin-top: 20px; font-size: 14px; text-transform: uppercase; color: #616161; width: 100%; } #clients-home2 .team .content p{color:#fff;} #clients-home2 .team p.sub-title { margin-top: 0px; font-weight: 400; text-transform: none; } .banner-info-home2 .number{ font-size: 112px; float: left; margin-top: 60px; color: #f3a316; font-weight: 800; margin-left: 40px; line-height:22px; text-shadow: 5px 5px 0 #333; } .home2-sub-txt { color: #ccc; } .city-bg .iphone-desc ul { margin-top: 10px; } #infoCompany-home2 .flexslider{ -webkit-box-shadow: 0 0px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0 0px 0px rgba(0,0,0,0.4); -o-box-shadow: 0 0px 0px rgba(0,0,0,0.4); box-shadow: 0 0px 0px rgba(0,0,0,0.4); } /*Effect Hover Clients*/ .view { float: left; overflow: hidden; position: relative; text-align: center; cursor: default; } .view .mask,.view .content { position: absolute; overflow: hidden; top: 0; left: 0; z-index: 99; } .view img { display: block; position: relative; } .view h2 { text-transform: uppercase; color: #fff; text-align: center; position: relative; font-size: 17px; padding: 10px; background: rgba(0, 0, 0, 0.8); margin: 20px 0 0 0; } .view p { font-size: 13px; position: relative; color: #fff; padding: 20px 20px 20px; text-align: center; font-weight: 400; } .view a.info { display: inline-block; text-decoration: none; padding: 7px 14px; background: #000; color: #fff; text-transform: uppercase; -webkit-box-shadow: 0 0 1px #000; -moz-box-shadow: 0 0 1px #000; box-shadow: 0 0 1px #000; } .view a.info: hover { -webkit-box-shadow: 0 0 5px #000; -moz-box-shadow: 0 0 5px #000; box-shadow: 0 0 5px #000; } .view-second img { -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; transition: all 0.2s ease-in; } .view .tooltip-social a i.fa-facebook { padding: 8px 11px; } .view-second .mask { width: 100%; height: 100%; position: absolute; z-index: 9; bottom: 0; background: rgba(0,0,0,0.2); -webkit-transition: all 0.3s 0.3s ease-in-out; -moz-transition: all 0.3s 0.3s ease-in-out; -o-transition: all 0.3s 0.3s ease-in-out; -ms-transition: all 0.3s 0.3s ease-in-out; transition: all 0.3s 0.3s ease-in-out; } .view-second h2 { border-bottom: 1px solid rgba(0, 0, 0, 0.3); background: transparent; margin: 20px 40px 0px 40px; -webkit-transform: translate(200px, -200px); -moz-transform: translate(200px, -200px); -o-transform: translate(200px, -200px); -ms-transform: translate(200px, -200px); transform: translate(200px, -200px); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .view-second ul { -webkit-transform: translate(200px, -200px); -moz-transform: translate(200px, -200px); -o-transform: translate(200px, -200px); -ms-transform: translate(200px, -200px); transform: translate(200px, -200px); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .view-second ul li i{ border-radius:100%; } .view-second p { -webkit-transform: translate(-200px, 200px); -moz-transform: translate(-200px, 200px); -o-transform: translate(-200px, 200px); -ms-transform: translate(-200px, 200px); transform: translate(-200px, 200px); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .view-second a.info { -webkit-transform: translate(0px, 100px); -moz-transform: translate(0px, 100px); -o-transform: translate(0px, 100px); -ms-transform: translate(0px, 100px); transform: translate(0px, 100px); -webkit-transition: all 0.2s 0.1s ease-in-out; -moz-transition: all 0.2s 0.1s ease-in-out; -o-transition: all 0.2s 0.1s ease-in-out; -ms-transition: all 0.2s 0.1s ease-in-out; transition: all 0.2s 0.1s ease-in-out; } .view-second:hover .mask { background: rgba(0,0,0,0.4); } .view-second:hover ul { -webkit-transform: translate(0px,0px); -moz-transform: translate(0px,0px); -o-transform: translate(0px,0px); -ms-transform: translate(0px,0px); transform: translate(0px,0px); -webkit-transition-delay: 0.3s; -moz-transition-delay: 0.3s; -o-transition-delay: 0.3s; -ms-transition-delay: 0.3s; transition-delay: 0.3s; } .view-second:hover p { -webkit-transform: translate(0px,0px); -moz-transform: translate(0px,0px); -o-transform: translate(0px,0px); -ms-transform: translate(0px,0px); transform: translate(0px,0px); -webkit-transition-delay: 0.4s; -moz-transition-delay: 0.4s; -o-transition-delay: 0.4s; -ms-transition-delay: 0.4s; transition-delay: 0.4s; } .view-second:hover a.info { -webkit-transform: translate(0px,0px); -moz-transform: translate(0px,0px); -o-transform: translate(0px,0px); -ms-transform: translate(0px,0px); transform: translate(0px,0px); -webkit-transition-delay: 0.5s; -moz-transition-delay: 0.5s; -o-transition-delay: 0.5s; -ms-transition-delay: 0.5s; transition-delay: 0.5s; } /*End */ .home-percentage { text-align: center; margin-top: 60px; margin-bottom: 60px; } .home-percentage .fact-icon { padding: 40px 3px 40px 3px; width: 61%; margin: 0 auto; color: #616161; } .home-percentage .fact-icon span { font-size:70px; } .wave { background-image: url(../images/wave.png); background-repeat: repeat !important; width: 100%; } .home2-city-bg { background-image:url(../images/bg-happy2.jpg); background-repeat:no-repeat !important; width: 100%; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .row-box { padding: 25px 15px 20px 15px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; } .home2-city-bg .well{ background: rgba(0,0,0,0.6); } .home2-city-bg p{ color: rgba(255,255,255,1); } .home2-city-bg h4{ margin-top: 0px; } .flexslider-attachments .flex-control-nav { position: relative; margin-top: 10px; } .flexslider .flex-control-thumbs { position: relative; } .flex-control-nav li, .flex-control-thumbs li { float: none; display: inline-block; } .flexslider .flex-control-nav{ bottom: 0; width: 100%; text-align: center; } .flex-direction-nav a i { margin-top: 12px; } .flex-control-thumbs li { width: 12%; margin: 0 10px 0 0; } #infoCompany-home2 { padding: 110px 0 110px 0; } .info-comp-desc h2 { border-bottom: 5px solid #e0dede; margin-top: 5px; } .content-bt-buy { width: 100%; text-align: left; margin-top: 30px; } .info-comp-desc ul { padding: 10px 0 30px 0px; border-bottom: 1px solid #e0dede; } .info-comp-desc ul li{ list-style-type:none; line-height: 31px; } .info-comp-desc ul li i{ margin-right: 8px; color: #f3a316; } .angula-li-ic.fa { text-decoration: inherit; } .txt-inf-tp { color: #3d67af; } /* People say */ .people-say .owl-carousel{padding-bottom:110px;} .people-say .owl-carousel .owl-item{padding:10px 0; border:0px;} .people-say .testimon-desc{ padding: 20px 0 0 0px;} .people-say .section-title, .people-say .sub-title{text-align:center;} .people-say .title-large a { font-size: 22px; display: block; margin: 30px 0; text-transform: uppercase; text-decoration:none; color:#222; line-height:30px; } .people-say .author { margin: 20px 0; } .people-say .author a{ text-decoration:none; color:#222; font-weight:600; } .people-say .post-side { border-top: 5px solid #e0dede; } .pb20 { padding-bottom: 20px; margin-top:40px; } .pb20 a{color:#555;border:1px solid #555; text-decoration:none;padding:10px 20px;} .people-say .post-date { font-size: 16px; margin: 30px 0; text-align: center; } .people-say .post-date .day { font-size: 40px; font-weight: 300; line-height: normal; margin-right: 7px; padding-right: 7px; border-right: 1px solid; } .people-say .post-date .month { position: absolute; text-transform: uppercase; } .people-say .post-side .post-info { text-align: center; } .people-say .post-info a { font-size: 10px; position: relative; display: inline-block; padding-right: 10px; letter-spacing: 1px; text-transform: uppercase; color: #afafaf; } .people-say #owl-demo .item img { display: block; width: 100%; height: auto; float: left; border-radius: 0; } .post-date .face-team img{margin-bottom:20px;} /******************************************************************************************** PAGE HOME 3 *********************************************************************************************/ .home3-percentage { text-align: center; margin-top: 60px; margin-bottom: 30px; } .top-content-bnr{ position: relative; float: left; width: 100%; margin-bottom: 110px; } .top-banner{padding:80px 70px;} .top-banner h3{color:#fff;margin-top:0} .top-banner .fact-icon{ position: absolute; font-size: 200px; color: rgba(255,255,255,0.1); right: 15px; bottom: 15px; } .top-banner p{color:#fff;} .top-banner a{ color:#fff; margin-top:20px; font-weight:800; text-transform: uppercase; text-decoration:none; display: inline-block; } .top-banner a:after { width: 100%; height: 1px; background: #fff; content: ''; display: block; margin: 5px 0 0; -webkit-transition: all 300ms ease-in-out 0s; transition: all 300ms ease-in-out 0s; } .top-banner:hover a:after { width: 0; } .top-banner-dsc{ margin-bottom:30px; } .top-title-sml{ font-weight:300; font-size:11px; font-size: 13px; text-transform: uppercase; margin-bottom:0; } .home3-banner-1{background:#6886b8;} .home3-banner-2{background:#426ca9;} .home3-banner-3{background:#3d67af;} .home3-percentage .fact-icon { background: #3d67af; border-radius: 2px; padding: 40px 3px 40px 3px; width: 61%; border: 1px solid #00b1c1; box-shadow: 0 1px 1px rgba(0,0,0,.2); margin: 0 auto; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .page-header-title3 { margin: 0px 0 20px; } .home3-percentage .fact-icon:hover { -webkit-background-clip: 10px; -moz-background-clip: 10px; border-radius: 10px; } .home3-percentage .fact-icon span { font-size:70px; color: #fff; } .home3-percentage .fact-icon.fact-icon-color2 { background:#00a5b6; border: 1px solid #00a5b6; } .banner-info .home3-percentage h3 { font-size: 16px; } .home3-percentage .fact-icon.fact-icon-color3 { background:#0299a9; border: 1px solid #00759b; } .home3-percentage .fact-icon.fact-icon-color4 { background:#00759b; border: 1px solid #005c84; } .home3-city-bg { background-color:#3d67af; width: 100%; position: relative; } .home3-city-bg p{ color: rgba(255,255,255,1); } .home3-city-bg h4{ margin-top: 0px; } .home3-effect-cover { background-image:url(../images/paper-9.jpg); background-repeat:repeat !important; width: 100%; height: 100%; position: absolute; opacity:0.3; } .home3-well { margin-bottom: 0px; padding: 0; margin-bottom: 0px; background: rgba(0,0,0,0.2); color: #fff; border: 0px; border-bottom: 0px solid #333; } .bt-serv { width: 100%; float: left; } .home3-city-bg .txt-circle-content.first-ic { margin: 60px 0 0px 0; } .home3-city-bg .txt-circle-content { margin: 60px 0 0px 0; float:left; } .home3-city-bg .txt-circle-content h3 { margin-top: 10px; text-shadow: 0px 1px 1px rgba(0,0,0,0.2); } .home3-city-bg .fact-icon { background: #fff; border-radius: 100%; padding: 27px 3px 27px 3px; margin-right: 20px; width: 29%; box-shadow: 0 1px 1px rgba(0,0,0,.2); color: #333; text-align: center; float: left; } .imp-phrase{padding:15px;margin:0} .imp-phrase.imp-color{ background: rgba(61,103,175,0.5); color: #fff; } .home3-bt-footer-bg { background-image:url(../images/bg-happy2.jpg); background-repeat:no-repeat !important; width: 100%; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; margin: 110px 0 0 0; } .home3-bt-footer-bg .well { background: rgba(61,103,175,0.8); } .home3-bt-footer-bg #owl-demo .item img { border-radius:0; } .home3-bt-footer-bg .owl-carousel .owl-item { border: 0px; } .home3-bt-footer-bg .section-title { font-size: 40px; } .home3-bt-footer-bg .sub-title { color: #fff; } .home3-bt-footer-bg .testimon-desc p { font-size: 22px; color: #fff; } .home3-bt-footer-bg .testimon-desc p.nm-name { font-size: 16px; font-weight: 400; } .testimonial-title-right { text-align:right; padding-right: 40px; padding-left: 0; border-right: 1px solid #ccc; } .home3-city-bg .fact-icon span { font-size: 45px; } .circle-content { float:left; position:relative; } #clients-home3 .team-img { width: 100%; float: left; margin-top: 20px; border: 0px solid #eee; box-shadow: 20px 20px 0 rgba(61, 103, 175, 0.4); } #clients-home3.parallax-texture { padding: 110px 0 110px 0; height: auto; background-attachment: fixed; width: 100%; text-align: center; position: relative; margin-bottom:0; } #clients-home3.parallax-texture:hover .section-title{letter-spacing:5px;} #clients-home3 .black-shadow { background: rgba(61, 103, 175, 0.5); } #clients-home3 .section-title { color: rgba(61, 103, 175, 0.4); margin-top: 0px; font-size:100px; font-weight:800; -webkit-transform:rotate(-90deg) translateX(-280px) translateY(-40px); -moz-transform:rotate(-90deg) translateX(-280px) translateY(-40px); transform:rotate(-90deg) translateX(-280px) translateY(-40px); -moz-transition: all 1s linear; -webkit-transition: all 1s linear; -ms-transition: all 1s linear; transition: all 1s linear; } #clients-home3 .sub-title { color: #fff; } #clients-home3 .team p { font-weight: 700; margin-top: 20px; font-size: 14px; text-transform: uppercase; color: #fff; width: 100%; } #clients-home3 .team p.sub-title { margin-top: 0px; font-weight: 400; text-transform: none; } #clients-home3 .view{ background: #000; } #clients-home3 .view:hover img{ opacity: 0.3; } .second-boxfriends { margin-top: 110px; } /* Time Line */ .group-wrapper .col-sm-2{width:20%} .fun-fact .box-item { cursor: pointer; } .fun-fact .box-item .box-icon { font-size: 1.786em; width: 11px; height: 11px; border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; transform: rotate(45deg); margin: 0px auto 20px; border-width: 1px; border-style: solid; border-color: rgb(69, 69, 83); transition: 0.3s; } .box-item .box-icon { color: rgb(255, 255, 255); font-size: 1.786em; margin-bottom: 20px; } .fun-fact .box-item .box-info { position: relative; color: rgb(234, 234, 243); transition: 0.3s; } .box-item .box-info { color: rgb(30, 30, 37); } .box-item { text-align: center; } .box-item .box-info .number { font-family: Montserrat, sans-serif; font-size: 1.786em; font-weight: bold; margin-bottom: 5px; } .fun-fact .box-item .box-info .title { color: rgb(181, 181, 193); transition: 0.3s; } .box-item .box-info .title { font-size: 1em; } .fun-fact .col-sm-2:first-child .box-item .box-info::before, .fun-fact .col-sm-2:first-child .box-item .box-info::after { left: 0; right: 0; height: 0px; } .fun-fact .col-sm-2 .box-item .box-info::before, .fun-fact .col-sm-2 .box-item .box-info::after { content: ""; position: absolute; top: -26px; left: -62%; right: 50%; margin-right: 7px; height: 1px; background-color: #ccc; } .fun-fact .col-sm-2 .box-item:hover .box-info:after { transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); } .fun-fact .col-sm-2 .box-item .box-info::after { transform: scale(0, 1); transform-origin: left center 0px; background-color: #333; transition: transform 0.3s; } .fun-fact .box-item .box-icon { font-size: 1.786em; margin: 0 auto 20px; width: 11px; height: 11px; border: 1px solid #ccc; transform: rotate(45deg); transition: 0.3s; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; } .fun-fact .box-item .box-info { position: relative; color: #eaeaf3; transition: 0.3s; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; } .fun-fact .box-item .box-info .number{ text-transform:uppercase; font-size: 16px; font-weight: 400; color:#212121; } .fun-fact .box-item .box-info .title { color: #b5b5c1; transition: 0.3s; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; } .fun-fact .box-item:hover .box-icon { background-color: #ccc; border-color: #333; } @-webkit-keyframes play{0%{background-position:0 0} 100%{background-position:-960px 0}} @-moz-keyframes play{0%{background-position:0 0} 100%{background-position:-960px 0}} @keyframes play{0%{background-position:0 0} 100%{background-position:-960px 0}} .img-show-line{ background:url("../images/style_pic.png") 0 0; width: 240px; height: 393px; margin-top: 70px; -webkit-animation: play 3s steps(4) infinite; animation: play 3s steps(4) infinite; } .fun-fact .box-item.bitm1:hover .img-show-line-1{ background:url("../images/style_pic.png") 0 0; width: 240px; height: 393px; margin-top: 70px; } .fun-fact .box-item.bitm2:hover .img-show-line-2{ background:url("../images/style_pic.png") -240px 0; width: 240px; height: 393px; margin-top: 70px; } .fun-fact .box-item.bitm3:hover .img-show-line-3{ background:url("../images/style_pic.png") -480px 0; width: 240px; height: 393px; margin-top: 70px; } .fun-fact .box-item.bitm4:hover .img-show-line-4{ background:url("../images/style_pic.png") -720px 0; width: 240px; height: 393px; margin-top: 70px; } /*Portfolio*/ /* Filter */ .filter{margin:0 auto 60px auto;color: #777; text-align:center;padding:0;} .filter li { display: inline-block; list-style: none; margin-right:5px;} .filter li:last-child:after { content: ""; } .filter li { padding: 5px 10px; margin: 5px; border-radius: 0.5em; color: #8e8e8e; text-decoration: none; border: 1px solid #ccc; -webkit-transition: all .3s ease-in-out; transition: all .2s ease-in-out; } .filter li:hover, .current li { background: #fff; color: #c4c2e0; border-top: 1px solid #c4c2e0; border-bottom: 1px solid #c4c2e0; } .filter li:hover { cursor:pointer; } .filter .active { border-top: 1px solid #c4c2e0; border-bottom: 1px solid #c4c2e0; background: #fff; color: #c4c2e0; } #product .title { color: #333; font-size: 14px; text-decoration: none; text-transform: uppercase; font-weight: 600; margin-top:6px; } .nav-pills>li>a.btn-lg { border-radius: 1px; padding: 8px 16px; } .my-gallery-animation-home3.ng-enter, .my-gallery-animation-home3.ng-leave { -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -moz-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -ms-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -o-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; position: relative; display: block; } .my-gallery-animation-home3.ng-leave.ng-leave-active, .my-gallery-animation-home3.ng-enter { -webkit-transform: scaleY(0); -moz-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); opacity: 0; } .my-gallery-animation-home3.ng-enter.ng-enter-active, .my-gallery-animation-home3.ng-leave { -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); opacity: 1; } .section-images { padding-top: 110px; } .section-images.dd-design{padding-top: 0px;} .section-images.nobackgr{ background-image: none; } .second-boxfriends { margin-top: 110px; } .testimonial-title-right { text-align: right; padding-right: 40px; padding-left: 0; border-right: 1px solid #ccc; } .home3-bt-footer-bg .section-title { font-size: 40px; } .home3-bt-footer-bg .sub-title { color: #fff; } .home3-bt-footer-bg .owl-carousel .owl-item { border: 0px; } .home3-bt-footer-bg .testimon-desc p { font-size: 22px; color: #fff; } /******************************************************************************************** PAGE HOME 4 *********************************************************************************************/ .slide-banner { background-color: rgba(61,103,175,0.85); width: 100%; bottom: 0px; padding: 50px 20px 50px 20px; bottom: 0px; color: #fff; bottom: 0px; position: absolute; z-index: 999; } .slide-banner .btn-primary { margin-top: 20px; background: #fff; border: 1px solid #ccc; padding: 20px 36px; color: #212121!important; text-transform: uppercase; -webkit-box-shadow: inset 0 0 0 #0fc8c8; -moz-box-shadow: inset 0 0 0 #0fc8c8; box-shadow: inset 0 0 0 #0fc8c8; } .slide-banner .btn-primary:hover { color: #fff!important; border: 1px solid #0fc8c8; } .slide-banner .btn-primary .fa-power-off { margin-right: 10px; } .slide-banner h3 { font-size: 30px; font-weight: 300; text-shadow: 0 1px 1px rgba(0,0,0,0.2); } .home4-percentage { text-align: center; margin-top: 60px; margin-bottom: 60px; } .home4-percentage h3 { font-size: 16px; font-weight: 700; } .home4-percentage i{ text-align:center; color:#3d67af; font-size:21px; line-height: normal; } .section.home4-portfolio{padding-top:0;} .home4-percentage h3{font-size:16px; font-weight:700;} .organizer{ border: 1px solid #e2e2e2; padding: 40px 50px 60px; background:#fff; } .square-nopad{padding:0;} .top-border-line{border-top:5px solid #3d67af;width:100%;} .organizer h2{ font-weight: 700; margin-top: 20px; font-size: 18px; text-transform: uppercase; color: #212121; border:0; } /*---------------*/ /***** Sadie *****/ /*---------------*/ .grid figure { position: relative; float: left; overflow: hidden; margin: 0; min-width: 320px; max-width: 480px; max-height: 100%; width: 48%; height:100%; background: #3085a3; text-align: center; cursor: pointer; } .grid figure img { position: relative; display: block; min-height: 100%; max-width: 100%; opacity: 0.8; width:100%; } .grid figure figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .grid figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; } .grid figure figcaption::before, .grid figure figcaption::after { pointer-events: none; } .grid figure figcaption, .grid figure figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } figure.effect-sadie figcaption::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index:999; background: -webkit-linear-gradient(top, rgba(72,76,97,0) 0%, rgba(72,76,97,0.8) 75%); background: linear-gradient(to bottom, rgba(72,76,97,0) 0%, rgba(72,76,97,0.8) 75%); content: ''; opacity: 0; -webkit-transform: translate3d(0,50%,0); transform: translate3d(0,50%,0); } figure.effect-sadie h2 { position: absolute; top: 50%; left: 0; z-index:999; width: 100%; color: #484c61; -webkit-transition: -webkit-transform 0.35s, color 0.35s; transition: transform 0.35s, color 0.35s; -webkit-transform: translate3d(0,-50%,0); transform: translate3d(0,-50%,0); } figure.effect-sadie figcaption::before, figure.effect-sadie p { -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; } figure.effect-sadie p { position: absolute; bottom: 0; left: 0; z-index:999; padding: 2em; width: 100%; opacity: 0; -webkit-transform: translate3d(0,10px,0); transform: translate3d(0,10px,0); } figure.effect-sadie:hover h2 { color: #fff; -webkit-transform: translate3d(0,-50%,0) translate3d(0,-40px,0); transform: translate3d(0,-50%,0) translate3d(0,-40px,0); } figure.effect-sadie:hover figcaption::before , figure.effect-sadie:hover p { opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } /*Portfolio*/ .home4-portfolio .activegrid ul li { padding: 0px; border-right: 0px solid #ccc; width: 33.3333%; position: relative; overflow: hidden; background: #fff; padding: 30px; } .section.home4-portfolio { padding-top: 0; } .home4-portfolio .activegrid ul li { padding: 25px; margin: 0px 0 0; display: inline-block; min-height: 350px; vertical-align: top; border-right:0px solid #ccc; } .home4-portfolio .activegrid ul { padding: 0; } .home4-portfolio .activegrid ul li img { position: relative; display: inline-block; width: 100%; z-index: 1; margin: 0; } .home4-portfolio .img_holder { position: relative; width: 100%; float: left; padding: 0; margin: 0px; } .home4-portfolio .img_holder .overlay { position: absolute; width: 100%; height: 100%; float: left; padding: 0; text-align: center; margin: 0px; z-index: 10; opacity: 0; transition: all 0.3s ease-out 0s; background: url(../images/transparent_bg.png) 0 0 repeat; } .home4-portfolio ul li:hover .overlay { opacity:1; } .home4-portfolio .img_holder .overlay a.icon { width: 60px; height: 60px; padding: 15px 18px; text-align: center; margin: 0 auto; color: #fff; font-size: 20px; border-radius: 100%; background-color: #07ccd4; } .home4-portfolio .img_holder .overlay a.icon:hover { color: #272727; background-color: #fff; } .home4-portfolio .img_holder .overlay a i { text-align: center; margin-top: 3px; } .c-loc { width: 100%; margin-top: 150px; margin-bottom: 50px; } .home4-portfolio .img_holder .title { padding:7px 12px; color:#111; background:#fff; } .lents-images-zoom { position: absolute; z-index: 999; margin-top: -40%; width: 100%; text-align: center; opacity: 0; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .lents-images-zoom i{ padding: 20px; border-radius:100%; background: #0bb7b7; border: 1px solid #0299a9; color: #fff; font-size: 20px; margin-bottom: 20px; } .lents-images-zoom i:hover{ background: #0299a9; border: 1px solid #0bb7b7; } #product .lents-images-zoom .title { color: #fff; text-transform: uppercase; font-size: 20px; } /**Team**/ #clients-home4 .team-img { width: 100%; float: left; margin-top: 20px; border: 10px solid #fff; border-radius:0; } #clients-home4 .team-img .content { margin-top: 30px; } #clients-home4 .team-img .content p:first-child{ color:#212121; } #clients-home4.parallax-texture { height: auto; background-image: url(../images/parallax_bg2.jpg); background-repeat: repeat !important; background-attachment: fixed; width: 100%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; text-align: center; position: relative; padding: 110px 0 110px 0; } #clients-home4 .black-shadow { background: rgba(30, 35, 41, 0.5); } #clients-home4 .section-title { color: #fff; margin-top: 0px; } #clients-home4 .sub-title { color: #fff; } #clients-home4 .team p { font-weight: 400; margin-top: 20px; font-size: 14px; text-transform: uppercase; color: #fff; width: 100%; } #clients-home4 .team p.sub-title { margin-top: 0px; font-weight: 400; text-transform: none; font-size: 13px; } #clients-home4 .view{ background: #ccc; } #clients-home4 .view:hover img{ opacity: 0.3; } .home4-city-bg{position:relative;} .home4-city-bg .well { padding: 80px 20px 90px 20px; } .home4-city-bg .row-box { background-color: rgba(255,255,255,0); padding: 0; border-top: 0px solid #0bb7b7; border-left: 0px solid #fff; border-right: 0px solid #fff; border-bottom: 0px solid #fff; } .home4-city-bg .well{ background: rgba(0,0,0,0.5); } .home4-city-bg p{ color: rgba(255,255,255,1); text-transform: uppercase; } .home4-city-bg h4{ margin-top: 0px; } #screen-macbook { padding: 0; } .section-opt{height:820px;} .section-opt .desc-left{padding:100px 200px} .btx-background{ background-image: url(../images/room2.jpg); background-repeat: no-repeat !important; width: 100%; height:820px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } /*Portfolio Animation*/ .my-gallery-animation.ng-enter, .my-gallery-animation.ng-leave { -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -moz-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -ms-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -o-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; position: relative; display: block; } .my-gallery-animation.ng-leave.ng-leave-active, .my-gallery-animation.ng-enter { -webkit-transform: rotateX(-180deg) translatez(30px); -moz-transform: rotateX(-180deg) translatez(30px); -ms-transform: rotateX(-180deg) translatez(30px); -o-transform: rotateX(-180deg) translatez(30px); transform: rotateX(-180deg) translatez(30px); opacity: 0; height: 0px; } .my-gallery-animation.ng-enter.ng-enter-active, .my-gallery-animation.ng-leave { -webkit-transform: rotateX(0deg) translatez(30px); -moz-transform: rotateX(0deg) translatez(30px); -ms-transform: rotateX(0deg) translatez(30px); -o-transform: rotateX(0deg) translatez(30px); transform: rotateX(0deg) translatez(30px); opacity: 1; height: 30px; } /*Testimonial*/ #infoCompany-home4 { padding: 80px 0 80px 0; } #infoCompany-home4 .owl-carousel .owl-item { padding: 0px 20px; border: 0px solid #ccc; } #infoCompany-home4 .owl-carousel .owl-item .item{ padding: 40px 20px; border: 0px solid #ccc; float: left; } #infoCompany-home4 .testimon-desc p { font-size: 18px; color: #fff; } #infoCompany-home4 .testimon-desc p.nm-name { font-size: 14px; color: #fff; } #infoCompany-home4 .testimon-desc p span { color: #07ccd4; } #infoCompany-home4 .testimon-desc { padding: 10px 0 10px 40px } #infoCompany-home4 .owl-theme .owl-controls .owl-page span { border-radius: 0; width: 20px; height: 5px; } #infoCompany-home4 #owl-demo .item img { border-radius:0; } .arrow_box { position: relative; background: #262c32; border: 0px solid #ccc; } .arrow_box:after, .arrow_box:before { right: 100%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .arrow_box:after { border-color: rgba(255, 255, 255, 0); border-right-color: #262c32; border-width: 30px; margin-top: -30px; } .arrow_box:before { border-color: rgba(204, 204, 204, 0); border-right-color: #333; border-width: 31px; margin-top: -31px; } /******************************************************************************************** PAGE HOME 5 *********************************************************************************************/ .home5-percentage { text-align: center; margin-top: 60px; margin-bottom: 60px; } .home5-percentage .fact-icon { width: 80px; height: 80px; border: 1px #E6E6E6 solid; background-color: #F0F0F0; box-shadow: inset 0 0 0 3px #fff; color: #B3B3B3; margin: -75px auto 0 auto; text-align: center; line-height: 90px; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; -webkit-transition: all 300ms linear; transition: all 300ms linear; -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform:rotate(-45deg); } .home5-percentage .fact-icon span { font-size:30px; color: #B3B3B3; text-align: center; position: relative; margin-left: 1px; -moz-transition: rotate(45deg); -o-transition: rotate(45deg); -webkit-transition: rotate(45deg); transform:rotate(45deg); } .home5-percentage .angula-box-5 { position: relative; border-top: 1px #ECECEC solid; text-align: center; padding: 35px 15px 35px; border: 1px #E6E6E6 solid; width: 100%; } .home5-percentage .angula-box-5:hover .fact-icon{ background: #3d67af; color: #fff; } .home5-percentage .angula-box-5:hover .fact-icon span{ color: #fff; } .home5-percentage .angula-box-5 p{ overflow: hidden; border-bottom: 1px #eee solid; padding-bottom: 25px !important; } .home5-percentage .angula-box-5 a.btn{ margin: 15px auto 0; } .box-home5-man{text-align:center;margin-top: -80px;} /*Portfolio*/ .home5-portfolio .activegrid ul li { padding: 0px; border-right: 0px solid #ccc; width: 24.98%; position: relative; overflow: hidden; background: #000; margin-left: 0; display: inline-block; vertical-align: top; } .home5-portfolio .activegrid ul { padding: 0; } .home5-portfolio .activegrid ul li img { position: relative; display: inline-block; width: 100%; z-index: 1; margin: 0; border: 0px solid #fff; } .home5-portfolio .activegrid ul li:hover img{ opacity: 0.3; } .home5-portfolio .activegrid ul li:hover .lents-images-zoom { opacity: 1; } .home5-portfolio .folio-desc { position: absolute; top: 20px; z-index: 2; opacity: 1; } .home5-portfolio .folio-desc p span { font-size: 14px; text-transform: uppercase; color: #111; background: #fff; padding: 7px 14px; margin-bottom: 2px; font-weight: 400; margin-left: 15px; } .home5-portfolio .folio-desc{ width:0; overflow:hidden; white-space:nowrap; padding: 14px; -webkit-transition: width 1s ease-in-out; -moz-transition: width 1s ease-in-out; -o-transition: width 1s ease-in-out; transition: width 1s ease-in-out; } .home5-portfolio .activegrid ul li:hover .folio-desc{ width:90%; } .home5-portfolio .folio-desc p { line-height: 30px; } /*Parallax 88*/ .home5-city-bg { width: 100%; position: relative; background-attachment: fixed; } .home5-city-bg img { position: absolute; width: 25%; z-index: 0; opacity: 0.24; } .home5-city-bg p{ color: rgba(255,255,255,1); } .home5-city-bg h4{ margin-top: 0px; } .home5-well { margin-bottom: 0px; padding: 100px 0px 90px 0px; background: rgba(61,103,175,0.7); margin-bottom: 0px; color: #fff; border: 0px; border-bottom: 0px solid #333; } .home5-advert p{ font-size: 46px; font-weight: 700; color: #fff; line-height: 70px; text-shadow: 0px 1px 2px rgba(0,0,0,0.2); text-transform: uppercase; font-family: "Montserrat", sans-serif; margin-top: 25px; position:relative; } .home5-advert p .square-dot { width: 10px; height: 10px; border: 1px solid #ffffff; background-color: transparent; transform: rotate(45deg) translate(100%, 100%); transform-origin: 100% 100%; display: inline-block; margin-right: 30px; margin-bottom: 25px; font-size: 1em; } .home5-advert p.line-sqr-1{margin-left:150px;} .home5-advert p.line-sqr-2{margin-left:75px;} .home5-advert p.line-sqr-3{margin-left:0px;} .home5-advert p.line-sqr-1:before { content: ""; width: 1px; height: 0px; background-color: #ffffff; position: absolute; bottom: 42px; left: 9px; webkit-transition: height 1.4s; -moz-transition: height 1.4s; transition: height 1.4s; } .home5-advert p.line-sqr-2:before { content: ""; width: 1px; height: 0px; background-color: #ffffff; position: absolute; bottom: 42px; left: 9px; webkit-transition: height 1.9s; -moz-transition: height 1.9s; transition: height 1.9s; } .home5-advert p.line-sqr-3:before { content: ""; width: 1px; height: 0px; background-color: #ffffff; position: absolute; bottom: 42px; left: 9px; webkit-transition: height 2.4s; -moz-transition: height 2.4s; transition: height 2.4s; } .home5-advert p.line-sqr-1.active-height:before{height: 170px;} .home5-advert p.line-sqr-2.active-height:before{height: 270px;} .home5-advert p.line-sqr-3.active-height:before{height: 370px;} .home5-city-bg .txt-circle-content.first-ic { margin: 60px 0 0px 0; } .home5-city-bg .txt-circle-content { margin: 35px 0 0px 0; float:left; } .home5-city-bg .txt-circle-content h3 { margin-top: 10px; text-shadow: 0px 1px 2px rgba(0,0,0,0.2); } .home5-city-bg .fact-icon { background: #fff; border-radius: 100%; padding: 27px 3px 27px 3px; margin-right: 20px; width: 29%; box-shadow: 0 1px 1px rgba(0,0,0,.2); color: #333; text-align: center; float: left; } .home5-city-bg .fact-icon span { font-size: 45px; } .effectopacity { position: absolute; bottom: 0; width: 100%; height: 100%; background-image: url(../img/arrow-bg-1.png); background-repeat: repeat-y; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-animation: animate-effectopacity 4s forwards linear; -moz-animation: animate-effectopacity 4s forwards linear; -o-animation: animate-effectopacity 4s forwards linear; -ms-animation: animate-effectopacity 4s forwards linear; animation: animate-effectopacity 4s forwards linear; } @-webkit-keyframes animate-effectopacity { from { background-position: 0 400px, 0 100px; } to { background-position: 0 1850px, 0 600px; } }@-moz-keyframes animate-effectopacity { from { background-position: 0 -400px, 0 100px; } to { background-position: 0 1850px, 0 600px; } }@-ms-keyframes animate-effectopacity { from { background-position: 0 -400px, 0 100px; } to { background-position: 0 1850px, 0 600px; } }@-o-keyframes animate-effectopacity { from { background-position: 0 -400px, 0 100px; } to { background-position: 0 1850px, 0 600px; } }@keyframes animate-effectopacity { from { background-position: 0 -400px, 0 100px; } to { background-position: 0 1850px, 0 600px; } } .lents-images-zoom { position: absolute; z-index: 999; margin-top: -40%; width: 100%; text-align: center; opacity: 0; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .lents-images-zoom i{ padding: 20px; border-radius:0%; background: #3d67af; border: 1px solid #3d67af; color: #fff; font-size: 20px; margin-bottom: 20px; text-decoration:none; } .lents-images-zoom i:hover{ background: #c4c2e0; border: 1px solid #c4c2e0; color: #3d67af; } .lents-images-zoom a{text-decoration:none} #product .lents-images-zoom .title { color: #fff; text-transform: uppercase; font-size: 20px; } /**Percentage**/ .home5-percentage-count .fact-icon { padding: 40px 3px 40px 3px; margin: 0 auto; font-size: 60px; color: #fff; border-top: 1px solid #fff; border-bottom: 1px solid #fff; } .banner-info .number { font-size: 62px; } .home5-percentage-count .fact-number h3 { background: #fff; padding: 20px 20px; } .home5-percentage-count .fact-number .number { padding: 20px 20px; margin-top: 0; color: #fff; font-weight: 700; } #iphone-home5.parallax-texture { padding: 100px 0 120px 0; background-image: url(../images/parallax_bg2.jpg); background-repeat: repeat !important; background-attachment: fixed; width: 100%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; text-align: center; position: relative; } .iphone-desc ul li { border-bottom:1px solid rgba(255,255,255,0.4); background: rgba(255,255,255,0); padding: 30px; font-size: 20px; font-weight: 300; text-transform: uppercase; margin-top: 0px; list-style-type: none; } .iphone-desc ul li:hover { cursor: pointer; background: rgba(255,255,255,0.1); } .iphone-desc ul li p { color:#fff; text-align: left; } .iphone-desc ul li p span { font-size: 30px; margin-right: 15px; } #percentage-home5.parallax-texture { padding: 150px 0 200px 0; background-image: url(../images/parallax_bg2.jpg); background-repeat: repeat !important; background-attachment: fixed; width: 100%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; text-align: center; position: relative; } .content-contact-phone { margin: 0 auto; width: 20%; text-align: center; } .content-contact-phone span{ font-size: 30px; margin-bottom: 20px; text-shadow:0 1px 1px rgba(0,0,0,0.2); } .content-contact-phone h4{ font-size: 42px; font-weight: 700; text-shadow:0 1px 1px rgba(0,0,0,0.2); } .content-contact-phone p{ font-size: 18px; font-weight: 300; margin-top: 20px; color: #b2b2b2; font-family: 'Dosis', Sans-Serif; } .home5-city-bg-bottom { width: 100%; } .home5-city-bg-bottom .row-box { background-color: rgba(255,255,255,0); padding: 0; border-top: 0px solid #0bb7b7; border-left: 0px solid #fff; border-right: 0px solid #fff; border-bottom: 0px solid #fff; } .home5-city-bg-bottom .well{ padding: 30px 0px 40px 0px; } .home5-city-bg-bottom i { font-size: 45px; border: 2px solid #fff; padding: 25px 30px; border-radius: 100%; margin-bottom: 30px; } .home5-city-bg-bottom p{ color: rgba(255,255,255,1); text-transform: uppercase; } .home5-city-bg-bottom h4{ margin-top: 0px; } .content-contact-phone { margin: 0 auto; text-align: center; position: absolute; top: 0; z-index: 999; background: rgba(0,0,0,0.5); padding: 190px 0; transform-origin: right bottom; -webkit-transform: skewX(-20deg); -moz-transform: skewX(-20deg); -ms-transform: skewX(-20deg); -o-transform: skewX(-20deg); transform: skewX(-20deg); height: 100%; right:20%; } .content-contact-phone span{ font-size: 38px; margin-bottom: 20px; color: #212121; } .content-contact-phone h4{ font-size: 42px; font-weight: 300; color: #ddd; font-family: 'Dosis', Sans-Serif; right: 300px; } .content-contact-phone h4, .content-contact-phone p{ -webkit-transform: skewX(20deg); -moz-transform: skewX(20deg); -ms-transform: skewX(20deg); -o-transform: skewX(20deg); transform: skewX(20deg); } .content-contact-phone p a{color: #b2b2b2;} /*monitor Animation*/ .hero-index-1 { background-repeat:no-repeat; background-size: 100% 100%; background-image:url("../images/monitor1.jpg"); -webkit-animation: hero-imacretina-1-anim 15s 0s ease-in-out forwards infinite; animation: hero-imacretina-1-anim 15s 0s ease-in-out forwards infinite; opacity: 1; width: 450px; height: 319px; margin-left: 30px; margin-top: 30px; } .hero-index-2 { background-repeat: no-repeat; background-size: 100% 100%; background-image: url("../images/monitor2.jpg"); -webkit-animation: hero-imacretina-2-anim 15s 0s ease-in-out forwards infinite; animation: hero-imacretina-2-anim 15s 0s ease-in-out forwards infinite; width: 450px; height: 319px; margin-left: 30px; margin-top: 30px; } .hero-index-3 { background-repeat: no-repeat; background-size: 100% 100%; background-image: url("../images/monitor3.jpg"); -webkit-animation: hero-imacretina-3-anim 15s 0s ease-in-out forwards infinite; animation: hero-imacretina-3-anim 15s 0s ease-in-out forwards infinite; width: 450px; height: 319px; margin-left: 30px; margin-top: 30px; } .page-header-title5 { margin: 0px 0 30px; } /*Portfolio Animation*/ .my-gallery-animation-home5.ng-enter, .my-gallery-animation-home5.ng-leave { -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -moz-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -ms-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -o-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; position: relative; display: block; } .my-gallery-animation-home5.ng-leave.ng-leave-active, .my-gallery-animation-home5.ng-enter { -webkit-transform: rotateX(-180deg) translatez(30px); -moz-transform: rotateX(-180deg) translatez(30px); -ms-transform: rotateX(-180deg) translatez(30px); -o-transform: rotateX(-180deg) translatez(30px); transform: rotateX(-180deg) translatez(30px); opacity: 0; } .my-gallery-animation-home5.ng-enter.ng-enter-active, .my-gallery-animation-home5.ng-leave { -webkit-transform: rotateX(0deg) translatez(30px); -moz-transform: rotateX(0deg) translatez(30px); -ms-transform: rotateX(0deg) translatez(30px); -o-transform: rotateX(0deg) translatez(30px); transform: rotateX(0deg) translatez(30px); opacity: 1; } /*Latest Blog*/ .second-row{margin-top:30px;} #latest-blog-index { padding: 110px 0 110px 0; } .latest-blog-content { border: 1px solid #e4e4e4; width: 100%; float: left; padding: 0; margin: 0px; } #latest-blog-index .blog-l-txt { padding: 46px 30px; position: relative; float: left; } #latest-blog-index .blog-l-txt h3 { text-transform: uppercase; font-weight: 600; font-size: 16px; margin-bottom: 20px; } .latest-blog-content .img_holder { position: relative; width: 100%; float: left; padding: 0; margin: 0px; } .latest-blog-content .img_holder .overlay a.icon { width: 60px; height: 60px; padding: 15px; margin: 72px 0 0 150px; color: #fff; float: left; font-size: 20px; border-radius: 100%; background-color: #3d67af; } .latest-blog-content .img_holder .overlay a.icon:hover { color: #272727; background-color: #c4c2e0; } .latest-blog-content .img_holder .overlay a i { text-align: center; margin-top: 3px; } .latest-blog-content a.btn-blq { background-color: #f3a316; width: 60px; height: 60px; line-height: 57px; display: inline-block; text-align: center; position: relative; right: 0; bottom: 0; color: #fff; font-size: 24px; margin-top:30px; float:right; } .blog-l-txt .entry-meta .post-by{ float:left; color:#666; margin-right:10px; } .blog-l-txt .entry-meta a{ color:#666; text-transform:uppercase; text-decoration:none; } .home5-city-bg-bottom .well{ background: #282d33; } .home5-city-bg-bottom .well { padding: 30px 0px 40px 0px; } .home5-city-bg-bottom ul.clients{ width: 100%; padding: 0; } .home5-city-bg-bottom ul.clients li{ width: 18%; } /******************************************************************************************** PAGE ABOUT 2 *********************************************************************************************/ .about2-top-title .color-txt{ color: #0bb7b7; text-align: center; font-family: 'Open sans',sans-serif; font-weight: 700; font-size: 38px; text-transform: uppercase; } .about2-top-title{ color: #fff; font-size: 78px; font-weight: 700; text-align: center; margin-top: 180px; text-shadow: 0 1px 1px rgba(0,0,0,0.3); letter-spacing: 3px; } .about2-team h3 { font-weight: 600; font-size: 14px; text-transform: uppercase; } .about2-top-img { background-image:url(../images/slider/boat/4.jpg); background-repeat:no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 450px; position: relative; } .big-slier{margin-bottom:110px;} .effect-about2-over { background: rgba(0,0,0,0.5); position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .about-pg-2 .flex-direction-nav a { top: 42%; } .about2-percentage .skillbar-title, .about2-percentage .skillbar-bar { background-image: -webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent)); background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent); background-image: -moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent); background-image: -o-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent); } .row-padding{padding-bottom:110px;} /******************************************************************************************** PAGE ABOUT 3 *********************************************************************************************/ .about3-top-img { background-image:url(../images/about3-top.jpg); background-repeat:no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 450px; position: relative; background-position: bottom center; } .about3-top-title { text-align: center; font-family: 'Open sans',sans-serif; font-weight: 300; font-size: 38px; text-transform: uppercase; color: #fff; margin-top: 180px; color: #0bb7b7; text-shadow: 0 1px 1px rgba(0,0,0,0.3); letter-spacing: 3px; } .about3-top-title .color-txt { font-weight: 700; font-size: 78px; color: #fff; } .about3-team-desc h3 { padding-top: 20px; text-transform: uppercase; font-weight: 600; font-size: 14px; } .about3-team-desc { padding: 0px 20px; border-left:1px solid #ddd; border-right:1px solid #ddd; } .about3-team .list-social-icons{ border-bottom:1px solid #ddd; margin-bottom: 0px; padding-bottom: 30px; } .about3-skill md-progress-linear.md-default-theme.md-warn .md-bar{ background-color: #345e9e; } .about3-skill md-progress-linear.md-default-theme[md-mode=buffer].md-warn .md-bar1{ background-color: #6886b8; } .about3-skill md-progress-linear.md-default-theme[md-mode=buffer].md-warn .md-dashed:before { background: radial-gradient(#6886b8 0%, #6886b8 16%, transparent 42%); } .about3-skill p { margin: 20px 0 0 0; font-weight:600; } .material-percentage { text-align: right; float: right; } .about4-top-img .effect-over { background: rgba(0,0,0,0.3); } .about4-top-title .color-txt { color: #2be2e2; } .about4-top-title.about4-top-second { margin-top: 80px; } .buy-angula a { margin: 0 auto; text-align: center; font-size: 14px; border-radius: 30px; padding: 12px 35px; text-transform: uppercase; } .buy-angula { width: 100%; text-align: center; margin-top: 50px; } .about4-top-title { text-align: center; font-family: 'Open sans',sans-serif; font-weight: 800; font-size: 90px; text-transform: none; color: #fff; margin-top: 90px; text-shadow: 0 1px 1px rgba(0,0,0,0.3); line-height: 24px; text-transform: uppercase; } .about4-top-title span { color: #fff; } .about4-top-title span:last-child { margin-right: 0px; } .about4-top-subtitle { text-align: center; font-family: 'Open sans',sans-serif; font-weight: 700; font-size: 78px; text-transform: uppercase; color: #fff; margin-top: 120px; color: #ffff; text-shadow: 0 1px 1px rgba(0,0,0,0.5); letter-spacing: 10px; } .about-pg-4 { margin-bottom: 80px; } .about-pg-4 ul li i{ color:#fff; padding: 2px 6px; background:#0bb7b7; border-radius:100%; margin-right: 10px; } .about-pg-4 ul { padding: 0; } .about-pg-4 ul li{ list-style-type: none; padding: 10px 0; border-bottom: 1px solid #eee; } .about-pg-4 ul li:first-child{ list-style-type: none; padding: 0px 0 10px 0; } .about-pg-4 ul li:last-child{ border-bottom: 0px solid #eee; } /******************************************************************************************** PAGE MEET TEAM *********************************************************************************************/ .about-top-imgmeet { background-image: url(../images/paper-9.jpg); background-repeat: no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 450px; position: relative; } .about-top-title.meet { text-align: right; } .breadcrumb-color.meet-team { margin-bottom: 0px; } .meet-team { text-align: center; } .meet-team p{ text-transform: uppercase; } .meet-team h3{ margin-bottom: 0; font-size: 14px; font-weight: 700; text-transform: uppercase; } .box-purchase { border-left: 3px solid #3d67af; padding: 28px 28px 27px 31px; background-color: #f6f6f6; border-right: 1px solid #eee; border-top: 1px solid #eee; border-bottom: 1px solid #eee; float: left; width: 100%; margin-top: 110px; } .box-purchase .big-txt-purchase { font-size: 24px; font-weight: 300; } .box-purchase .btn-lg { padding: 10px 24px; } /******************************************************************************************** PAGE SHOPPING GENERAL OBJECT *********************************************************************************************/ canvas { margin: 0; padding: 0; z-index: 999; width: 100%; position: absolute; top: 0; left: 0; } .search-query { padding: 4px 8px; margin-bottom: 10px; border-radius: 10px; border-width: 1px; border-style: solid; border-color: rgba(0,0,0,0.2); } .effect-over-shop{ background: rgba(0,0,0,0.3); position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .shop-slide-img_sound { background-image: url(../images/store/product/robot.jpg); background-repeat: no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 600px; position: relative; background-position: top center; } .store-brand { margin-top: 80px; } .shopping-top-title { text-align: center; font-family: 'Open sans',sans-serif; font-weight: 700; font-size: 100px; text-transform: uppercase; color: #fff; margin-top: 55px; } .shopping-top-title.obj-prod{ transform: rotate(-90deg) translateY(-450px) translateX(-10px); } .shopping-topsub-title.obj-prod2{font-size:40px;} .shopping-topsub-title.obj-prod3{text-align: center;color: #fff;margin-top: -30px;font-size:70px;} .shopping-top-title.drs-pg{font-size:120px;text-align: right;color: #232323;} .shopping-topsub-title.drs-pg{text-align: right;color: #232323;} .shopping-topsub-title.drs-pg2{text-align: right;color: #232323;margin-top:100px;font-size:70px;} .shopping-topsub-title { text-align: center; font-family: 'Open sans',sans-serif; font-weight: 300; font-size: 30px; text-transform: uppercase; color: #fff; margin-top: 150px; } /*.shop-prod-filter .filter li,*/.shop-prod-filter .filter li:hover,.shop-prod-filter .current li { border: 0px; } .shop-prod-filter .filter li:hover { border: 1px solid #777; color: #777; } .shop-title-store { margin-top: 80px; } .shop-top-img { padding: 0; margin-top: 0px; } .shop-top-img .grid{padding:0;} .shop-top-img .col-md-6 { padding-bottom: 30px; } .shop-top-img.bt-footer{margin-top:110px;} .shop-top-img.bt-footer .col-md-6{height: 523px;padding-bottom:0;} .shop-top-img.bt-footer figure.effect-layla { background: #3d67af; } /*icon number single-product in the cart*/ .number-prodsingle-cart { position: absolute; z-index: 1000; left: 27px; background-color: #6886b8; padding: 2px 10px; color: #fff; border-radius: 2px; } .number-prodsingle-cart.bt-num{bottom: 150px;} /*icon sale triangle*/ .onsale { position: absolute; z-index: 1000; top: 36px; right: 27px; text-transform: uppercase; -webkit-backface-visibility: hidden; } .onsale span { z-index: 10; color: #FFF; position: absolute; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); font-size: 1.36rem; line-height: 0.875rem; right: 2px; top: 14px; letter-spacing: 1px; } .onsale:after { content: ''; position: absolute; border-top: 60px solid #E74C3C; border-right: 0; border-left: 60px solid transparent; right: 0; z-index: 2; } /*end icon sale*/ .shop-prod .shop-img{ margin: 0 auto 10px auto; width: 100%; text-align: center; border:1px solid rgba(0,0,0,0.1); padding: 70px 20px; background: #fff; position: relative; } .shop-prod ul.nav-pills li { padding: 25px 15px; margin: 0px 0 0; display: inline-block; min-height: 350px; vertical-align: top; border-right: 0px solid #ccc; } .shop-prod .shop-img.show-up img{ box-shadow: 0 20px 22px rgba(0,0,0,0.08); } .shop-prod ul.nav-pills li:hover img { box-shadow: 0 20px 22px rgba(0,0,0,0.12); } .shop-prod ul.nav-pills li.show-up { box-shadow: 0 20px 22px rgba(0,0,0,0.08); } .shop-prod ul.nav-pills li img { margin-bottom: 0px; -webkit-transition: all 0.6s ease-out; /* Chrome 1-25, Safari 3.2+ */ -moz-transition: all 0.6s ease-out; /* Firefox 4-15 */ -o-transition: all 0.6s ease-out; /* Opera 10.50–12.00 */ transition: all 0.6s ease-out; /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */ } .onsale-prod { position: absolute; z-index: 1000; top: 41px; right: 15px; text-transform: uppercase; -webkit-backface-visibility: hidden; } .onsale-prod span { z-index: 10; color: #FFF; font-size: 1.36rem; line-height: 0.875rem; letter-spacing: 1px; background: #f3a316; padding: 16px 10px; -webkit-border-radius: 100px; -webkit-border-top-right-radius: 0; -moz-border-radius: 100px; -moz-border-radius-topright: 0; border-radius: 100px; border-top-right-radius: 0; } .shop-img .fade { position: absolute; left: 0; right: 0; margin: 0 auto; opacity: 0; filter: alpha(opacity=0); } .shop-img .fade:hover { filter: alpha(opacity=100); opacity: 1; } .bt-content-shop { padding: 0; } .bt-content-shop i { margin-right: 10px; background: #3d67af; padding: 8px; color: #fff; border-radius: 2px; } .bt-content-shop i.fa-trash-o{padding:8px 10px;} .bt-content-shop i.fa-angle-double-left{padding:8px 11px;} .bt-content-shop a{ font-weight: 700; letter-spacing: 0; text-transform: uppercase; } .bt-content-shop a:first-child{padding-left:0;} .bt-content-shop .btn-primary{ background-color: transparent; border: 0px; box-shadow: 0 0 0 #000; color: #222!important; } .bt-content-shop .btn-primary:hover{background: #fff;background-image:none;} .shop-prod ul.nav-pills li { margin-bottom: 40px; border-right: 0px solid #ccc; } #product { padding: 0; } .shop-price { margin-top: 0px; font-size: 18px; margin-bottom: 1px; text-align: right; color: #3d67af; } .bt12-detail-shop { margin-bottom: 20px; padding: 0; } .bt-detail-shop { border-bottom: 1px solid #ccc; padding: 0; width: 100%; float: left; } .bt-detail-shop a.title { float: left; } .store-cart-footer { width: 100%; float: left; margin-top: 40px; } .store-down-bottom { text-align: right; } .store-down-bottom ul li { display: inline-block; } .store-down-bottom ul { margin-bottom: 0; padding: 0 10px 0 0; } /*Filter Shop*/ .content-store .filter { margin: 0; color: #777; text-align: left; padding: 0; float: left; } /*End*/ .content-count-cart { margin-bottom: 10px; } .content-store { width: 100%; float: left; /*border-bottom: 1px dotted #ccc;*/ text-align: right; padding-bottom: 0px; } .content-store i{ background: #21252b; color: #fff; padding: 12px 12px 13px 12px; font-size: 18px; border-radius: 1px; margin-right: 10px; } /*.content-store a { color: #fff; font-size: 14px; padding: 12px 12px 12px 0; background: #3d67af; }*/ .btn-primary:disabled, .btn-primary[disabled] { letter-spacing: 0.04em; } .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary { background: #6487c3; border: 1px solid #6487c3; } .number-page { padding: 0 10px; } .my-shop-animation.ng-enter, .my-shop-animation.ng-leave { -webkit-transition: 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -moz-transition: 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -ms-transition: 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; -o-transition: 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; transition: 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; position: relative; display: block; } .my-shop-animation.ng-leave.ng-leave-active, .my-shop-animation.ng-enter { -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); opacity: 0; } .my-shop-animation.ng-enter.ng-enter-active, .my-shop-animation.ng-leave { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; } /*.shop-img p { position:absolute; padding: 10px; background-color: #21252b; color: #fff; top: 0; } .shop-img p i { margin-right: 5px; }*/ /*-----------------------------------------*/ /***** Effect hover images Layla *****/ /*----------------------------------------*/ .grid figure { position: relative; float: left; overflow: hidden; min-width: 100%; max-width: 100%; width: 100%; text-align: center; cursor: pointer; } .grid figure img { position: relative; display: block; min-height: 100%; max-width: 100%; opacity: 1; } .grid figure figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .grid figure figcaption::before, .grid figure figcaption::after { pointer-events: none; } .grid figure figcaption, .grid figure figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* Anchor will cover the whole item by default */ /* For some effects it will show as a button */ .grid figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; } .grid figure h2 { word-spacing: -0.15em; font-weight: 300; font-size: 25px; } .grid figure h2 span { font-weight: 800; background-color: transparent; color: #fff; } .grid figure h2 { border-bottom: 0px; } .grid figure h2, .grid figure p { margin: 0; color: #fff; } .grid figure p { letter-spacing: 1px; font-size: 68.5%; } figure.effect-layla { background:#fff; } figure.effect-layla figcaption::before, figure.effect-layla figcaption::after { position: absolute; content: ''; opacity: 0; } /*figure.effect-layla figcaption::before { top: 50px; right: 30px; bottom: 50px; left: 30px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: scale(0,1); transform: scale(0,1); -webkit-transform-origin: 0 0; transform-origin: 0 0; }*/ figure.effect-layla figcaption::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index:0; background: -webkit-linear-gradient(top, rgba(72,76,97,0.6) 0%, rgba(72,76,97,0) 75%); background: linear-gradient(from bottom, rgba(72,76,97,0.6) 0%, rgba(72,76,97,0) 75%); content: ''; opacity: 0; -webkit-transform: translate3d(0,-50%,0); transform: translate3d(0,-50%,0); } figure.effect-layla figcaption::after { top: 30px; right: 50px; bottom: 30px; left: 50px; border-right: 0px solid rgba(255,255,255,0.3); border-left: 0px solid #fff; -webkit-transform: scale(1,0); transform: scale(1,0); -webkit-transform-origin: 100% 0; transform-origin: 100% 0; } figure.effect-layla h2 { padding-top: 20%; -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; z-index:99; font-size: 40px; } figure.effect-layla h2.txt-top-img{color: #222;} figure.effect-layla h2.sgl-fnt{font-size:90px} figure.effect-layla h3{ font-size: 30px; margin-top: -20px; } figure.effect-layla p { padding: 0.5em 2em; text-transform: none; opacity: 0; -webkit-transform: translate3d(0,-10px,0); transform: translate3d(0,-10px,0); z-index:99; } figure.effect-layla h2 { -webkit-transform: translate3d(0,-30px,0); transform: translate3d(0,-30px,0); } figure.effect-layla figcaption::before, figure.effect-layla figcaption::after, figure.effect-layla p { -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; } figure.effect-layla:hover img { opacity: 0.7; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } figure.effect-layla:hover figcaption::before, figure.effect-layla:hover figcaption::after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } figure.effect-layla:hover h2, figure.effect-layla:hover p { opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } figure.effect-layla:hover figcaption::after, figure.effect-layla:hover h2, figure.effect-layla:hover p, figure.effect-layla:hover img { -webkit-transition-delay: 0.15s; transition-delay: 0.15s; } /******************************************************************************************** PAGE SHOPPING DRESSES *********************************************************************************************/ .shop-slide-img { background-image: url(../images/store/product/slide.jpg); background-repeat: no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 600px; position: relative; } .shop-dresses #product .title { color: #333; font-size: 14px; text-decoration: none; font-weight: 700; text-transform: uppercase; width: 100%; } .shop-dresses #product .subtitle { color:#6e6e6e; width: 100%; } #product .dress-cart{ position: absolute; font-size: 20px; left: 13px; bottom: 10px; padding: 0px 0px; color: #6e6e6e; } #product .dress-cart:hover{color:#222;} .shop-dresses #single-prod-top .number-prodsingle-cart{ bottom: 30px; left: 30px; } .shop-dresses .itemPreview:hover { background-position: -30px center; } .shop-prod.activegrid ul li img{ text-align:center; float:none; box-shadow: 0 0px 0px rgba(0,0,0,0); margin-bottom:20px; -webkit-transition: all 0.5s ease-out; /* Chrome 1-25, Safari 3.2+ */ -moz-transition: all 0.5s ease-out; /* Firefox 4-15 */ -o-transition: all 0.5s ease-out; /* Opera 10.50–12.00 */ transition: all 0.5s ease-out; /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */ } .shop-dresses .itemPreview { position: absolute; width: 30px; height: 16px; overflow: hidden; right: 10px; bottom: 10px; padding: 10px 0; text-indent: -1000px; background-image: url("../images/store/eye_off_on.png"); background-repeat: no-repeat; background-position: 0 center; cursor: pointer; } .shop-dresses .shop-price { margin-top: 0px; font-size: 14px; margin-bottom: 1px; text-align: left; color: #fff; background: #2a2a2a; font-weight: 600; transform: rotate(-90deg); width: 150px; position: absolute; top: -250px; left: -49px; padding: 13px; color:#e9951c; letter-spacing: 0.02em; text-align:center; } .shop-dresses .shop-price.falseClass{color:#fff;} .shop-dresses .shop-price span{ text-decoration: line-through; color:#fff;margin-left: 4px;} .shop-dresses .bt-detail-shop { border-bottom: 0px solid #ccc; letter-spacing: 0.1em } .shop-prod.shop-dresses .shop-img { background: #fff; margin: 0 auto 40px auto; width: 100%; text-align: center; border:1px solid rgba(0,0,0,0.1); padding: 70px 0; position: relative; } .shop-dresses .number-prodsingle-cart { background-color: #fff; color:#111; bottom: 132px; left: 66px; padding: 5px; font-weight: 600; } .shop-dresses .onsale:after { border-top: 60px solid #2a2a2a; } .shop-prod.shop-dresses .shop-img { margin: 0 auto 10px auto; } .filter-dresses{margin:0 auto 60px auto;color: #777; text-align:center;padding:0;} .filter-dresses li { display: inline-block; list-style: none; margin-right:5px;} .filter-dresses li:last-child:after { content: ""; } .filter-dresses li { padding: 5px 15px; color: #8e8e8e; text-decoration: none; border-bottom:1px solid #dedede; } .filter-dresses li:hover, .current li { color: #111; border-bottom:1px solid #111;cursor:pointer;} .filter li:hover { cursor:pointer; } .filter-dresses .active { color: #111; border-bottom:1px solid #111; } .content-store.shop-dresses { border: 0px; margin-top: 30px; } .shop-dress-size span{ color: #6e6e6e; margin-right: 5px; } /******************************************************************************************** PAGE SHOPPING DRESSES RIGHT COLUMN *********************************************************************************************/ #shop-dresses-rc .shop-prod ul.albumContainer li { padding: 25px 5px; } #shop-dresses-rc .onsale { right: 15px; } #shop-dresses-rc .shop-prod.shop-dresses .shop-img { padding: 70px 0 60px 0; } #shop-dresses-rc .store-cart-content { padding-right: 0; } #shop-dresses-rc .content-store { text-align: left; } #shop-dresses-rc .content-store h2 { margin-top: 0; } #shop-dresses-rc .filter-dresses li { display: block; width: 100%; text-transform: uppercase; text-align: left; padding: 10px 15px; } .rc-size ul { padding: 0; } .rc-size ul li { display: inline-block; padding: 5px 10px; width: 59px; border: 3px solid #B5B5B5; color: #a7a7a7; text-transform: uppercase; list-style-type: none; margin-top: 5px; text-align: center; } .rc-title { margin-top: 40px; float: left; width: 100%; } .rc-size ul li:hover { border: 3px solid #111; color: #111; cursor: pointer; } .rc-colours ul { padding: 0; } .rc-colours ul li { display: inline-block; border-bottom: 3px solid #B5B5B5; padding-bottom: 2px; list-style-type: none; } .rc-colours ul li:hover { border-bottom: 3px solid #111; } .rc-colours li a { width: 26px; height: 26px; display: block; padding: 0; } .rc-colours li a.brown{background:#4b3515} .rc-colours li a.blu{background:#9a91f1} .rc-colours li a.green{background:#087426} .rc-colours li a.red{background:#c6071d} .rc-colours li a.yellow{background:#e9e105} .rc-colours li a.black{background:#000} .rc-colours li a.grey{background:#5a5a5a} .rc-new ul { padding: 0; } .rc-new ul li{ list-style-type: none; padding: 10px 5px; float: left; border-bottom: 1px solid #ccc; cursor: pointer; } .rc-new ul li p { margin-bottom: 0px; margin-top: 5px; } .rc-new .new-name { margin-top: 20px; } .ss-rc { padding-left: 0px; padding-right: 0px; } /******************************************************************************************** PAGE SHOPPING DRESSES LEFT COLUMN *********************************************************************************************/ .dresses-left-column { float: right; } /******************************************************************************************** PAGE SINGLE PRODUCT *********************************************************************************************/ .shop-banner-details { position: relative; padding: 0 0 0px 0; background: #7185b5; } .shop-banner-details.bd-space{ padding: 0 0 80px 0; } .shop-banner-details .adv-dress .product-topsub-title, .shop-banner-details .adv-dress .product-top-title{ text-align: center; } .shop-banner-details .adv-dress .product-top-title{ font-size: 168px; margin-top:100px; } .product-topsub-title.pt-bottom{font-size :20px;} .shop-banner-details.bd-space .col-lg-12{padding:0;} .shop-banner-back { background-image: url('../images/store/product/beauty.jpg'); background-repeat:no-repeat; height:250px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .shop-banner-back.sgl-product{ background-image: url(../images/product-page-banner.jpg); background-size: cover; background-position: center; } .effect-over-dresses { background: rgba(0,0,0,0.2); position: absolute; top: 0; left: 0; bottom: 0; right: 0; } #single-prod-top { margin-top: 110px; margin-bottom:110px; } #single-prod-top .onsale{right: 36px;} .product-top-title { text-align: left; font-family: 'Open sans',sans-serif; font-weight: 700; font-size: 68px; text-transform: uppercase; color: #fff; margin-top: 40px; } .product-top-title .color-txt { color: #455e9a; } .product-topsub-title { text-align: left; font-family: 'Open sans',sans-serif; font-weight: 300; font-size: 30px; text-transform: uppercase; color: #fff; margin-top: 70px; } #single-prod-top .pp-cont-det { padding: 25px; margin: 0px 0 0; margin-left: -25px; } .details-single-img { margin: 0 0 0px 0; text-align: center; border:1px solid rgba(0,0,0,0.1); padding: 70px 20px; background: #fff; } #single-prod-top .onsale-prod{right: 25px;} .details-single-img.dresses-single-b { background: #fff; border: 1px solid rgba(0,0,0,0.1); } .details-single-img img { box-shadow: 0 0px 0px #888; } .det-info-prod { padding-top: 25px; } #product_sound .single-prod-info { height: 35px; } #product_sound .details-single-img .number-prodsingle-cart{ margin-top: 30px; margin-left: 15px; } #product_sound .det-sound a { color: #6e6e6e; text-decoration: none; } .single-prod-info { border-bottom: 1px solid rgba(0,0,0,0.2); padding-bottom: 0px; margin-bottom: 20px; } #product_sound .det-sound { float: left; margin-top: 0px; } .single-prod-info .shop-price { margin-top: 0px; font-size: 18px; margin-bottom: 0px; text-align: right; float: right; color: #111; font-weight: 600; } .single-prod-info .product-name-title { font-size: 18px; margin-top: 0; margin-bottom: 0; text-transform: uppercase; color: #111; font-weight: 600; } .details-material { margin-top: 20px; } .details-material ul{ padding: 0; } .details-material li { list-style-type: none; margin-bottom: 10px; } .details-material li i{ margin-right: 10px; color: #aaa; } .single-prod-button { margin-top:30px; } .color-prod a{ padding: 2px 14px; margin-right: 10px; border:1px solid #f6f6f6; } /******************************************************************************************** PAGE SINGLE PRODUCT DRESSES *********************************************************************************************/ #product_dresses .single-prod-info .product-name-title { font-size: 18px; margin-top: 0; margin-bottom: 0; text-transform: uppercase; color: #111; font-weight: 600; } #product_dresses .det-dres { float: left; } #product_dresses .det-dres a{ color: #6e6e6e; text-decoration: none; } #product_dresses .shop-price { margin-top: 0px; margin-bottom: 0px; text-align: center; float: right; font-weight: 600; top: 38%; left: -25px; } .btn-primary.bt-back { background: #313131; border: 1px solid #333; -webkit-box-shadow: inset 0 0px 0 #0fc8c8; -moz-box-shadow: inset 0 0px 0 #0fc8c8; box-shadow: inset 0 0px 0 #0fc8c8; } .btn-primary.bt-back:after { background: #313131; border: 1px solid #333; } #product_dresses .single-prod-info { height: 40px; } .details-material_dresses { margin-top: 20px; } .details-material_dresses ul{ padding: 0; } .details-material_dresses li { list-style-type: none; margin-bottom: 10px; } .details-material_dresses li i{ margin-right: 10px; color: #aaa; } .details-material_dresses .size-prod, .details-material_dresses .color-prod { width: 100%; float: left; } .details-material_dresses .size-prod { border-bottom: 1px solid rgba(0,0,0,0.2); padding-bottom: 20px; } .details-material_dresses ul { margin-bottom: 20px; float: left; width: 100%; } #product_dresses md-radio-button.md-default-theme.md-checked .md-off{ border-color: #111; } #product_dresses md-radio-button.md-default-theme .md-on { background-color: #111; } #product_dresses .md-switch-thumb, .radio-size md-radio-button { margin: 0px; float: left; } #product_dresses .md-switch-thumb, .radio-color md-radio-button { margin: 0px; float: left; } #product_dresses md-radio-group { border: 0px dotted transparent; } .size-prod p, .color-prod p { text-transform: uppercase; } .content-chose-dress { margin-bottom: 110px; } .content-chose-dress h3 { text-transform: uppercase; text-align: center; font-weight: 600; font-size: 28px; margin-bottom: 35px; } .content-chose-dress #owl-demo .item img { width: 100%; height: 100%; } .content-chose-dress p { margin: 0; text-transform: uppercase; color: #2e2e2e; } .content-chose-dress .subtitle { color:#6e6e6e; text-decoration: none; } /******************************************************************************************** PAGE SHOPPING JENAS *********************************************************************************************/ /*.shop-jeans-slide.shop-slide-img { background-image: url(../images/store/product/jeans/1.jpg); background-repeat: no-repeat !important; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; width: 100%; height: 600px; position: relative; }*/ #hero.shop-jeans-slide{height:500px!important;} .txt-top-jeans .shopping-top-title.drs-pg{color:#fff;} .txt-top-jeans .shopping-topsub-title.drs-pg, .txt-top-jeans .shopping-topsub-title.drs-pg2{color:#fff;} .shop-jeans-slide .layer.t-jeans img { left: 180px!important; position: absolute; top:80px; } .shop-jeans-slide .layer.t-shirt img { right: 180px!important; position: absolute; } .txt-top-jeans .slider-content-txt{margin-top:90px;} .shop-jeans-slide .background{ background: url('../images/store/product/jeans/square.jpg') no-repeat bottom left; bottom: -20px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: absolute; width: 110%; left: -5%; top: -5%; } .slider-content-txt .color-txt{color:#df9911;} .shop-jeans .filter-dresses { margin: 0 auto 60px auto; color: #777; text-align: left; padding: 0; border-top: 1px solid #dedede; } .content-adv{width:100%;float:left;margin-bottom:110px;} .jeans-adv figure.effect-layla.layla-1 h2.sgl-fnt{color:#111;} .jeans-adv .grid figure.layla-1 h2.sgl-fnt span{color:#fff;} .jeans-adv.shop-top-img.bt-footer figure.effect-layla{background:#fff;} .jeans-adv figure.effect-layla h2.sgl-fnt{color:#333;} .jeans-adv .grid figure h2.sgl-fnt span{color:#000;} .jeans-adv figure.effect-layla:hover img { opacity: 1; } .jeans-adv figure.effect-layla figcaption::before{background-image:none;} .jeans-adv figure.effect-layla.layla-2 p{color:#111} .jeans-adv figure.ng-hide-add, .jeans-adv figure.ng-hide-remove { /* this is required as of 1.3x to properly apply all styling in a show/hide animation */ transition: 0s linear all!important; } .jeans-adv figure.ng-hide-add-active, .jeans-adv figure.ng-hide-remove-active { /* the transition is defined in the active class */ transition: 0s linear all!important; webkit-animation:0; animation:0; } .jeans-button ul li{display:inline-block;cursor:pointer;} .jeans-button ul li.active p{color:#df9911;} .jeans-button ul li{margin-right:20px;} .jeans-button ul li img{ -webkit-border-radius: 100px; -webkit-border-top-right-radius: 0; -moz-border-radius: 100px; -moz-border-radius-topright: 0; border-radius: 100px; border-top-right-radius: 0; } .jeans-button{text-align:center;margin-bottom:90px;} .jeans-button ul li p{ margin-top:20px; font-weight: 800; color: #222; text-transform: uppercase; } .jeans-button ul li a{text-decoration:none;} .jeans-button ul li a:hover p{color:#df9911;} .img-separator { background-image: url(../images/store/product/jeans/item-image-separator.gif); background-position: bottom left; background-repeat: repeat-x; height: 3px; width: 100%; } #newproduct .dress-cart{ position: absolute; font-size: 20px; left: 13px; bottom: 10px; padding: 0px 0px; color: #6e6e6e; } #newproduct .dress-cart:hover{color:#222;} #newproduct { padding: 0; } #newproduct .title { color: #333; font-size: 14px; text-decoration: none; font-weight: 700; text-transform: uppercase; width: 100%; margin-top:6px; } #newproduct .subtitle { color: #6e6e6e; width: 100%; } /*btn discount*/ #cbp-vm .onsale span { z-index: 10; color: #FFF; position: absolute; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); font-size: 14px; right: 3px; top: 3px; letter-spacing: 1px; text-align: center; font-weight: 600; padding: 22px 10px; border-radius: 100%; border: 1px dashed #777; } #cbp-vm.shop-dresses .onsale:after { border-top: 0px solid #2a2a2a; } #cbp-vm .onsale:after { content: ''; position: absolute; border:0px; right: 0; z-index: 2; background: #111; padding: 30px; border-radius: 100%; } /*btn discount new product*/ #newproduct .onsale span { z-index: 10; color: #FFF; position: absolute; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); font-size: 14px; right: 3px; top: 3px; letter-spacing: 1px; text-align: center; font-weight: 600; padding: 22px 10px; border-radius: 100%; border: 1px dashed #777; } #newproduct.shop-dresses .onsale:after { border-top: 0px solid #2a2a2a; } #newproduct .onsale:after { content: ''; position: absolute; border:0px; right: 0; z-index: 2; background: #111; padding: 30px; border-radius: 100%; } #newproduct.shop-dresses .shop-price{ transform: rotate(0deg); top: 350px; left: -49px; } #newproduct.shop-prod.shop-dresses .shop-img{ border:0px; border-bottom: 1px solid rgba(0,0,0,0.1); } /*#newproduct.shop-prod.activegrid ul li img{ transform: rotate(15deg); -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; }*/ #newproduct.shop-prod.activegrid ul li:hover img{transform: rotate(0deg);} #newproduct.shop-prod .shop-img.show-up img { box-shadow: 7px 10px 22px rgba(0,0,0,0.07); } #newproduct.shop-prod ul.nav-pills li:hover img { box-shadow: 7px 10px 22px rgba(0,0,0,0.10); } #newproduct .onsale{ top: 90px; right: 37px;box-shadow: 4px 4px 8px rgba(0,0,0,0.3);} .floating{ -webkit-animation-name: Floatingx; -webkit-animation-duration: 5s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: ease-in-out; -moz-animation-name: Floating; -moz-animation-duration: 5s; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: ease-in-out; margin-left: 30px; margin-top: 5px; } @-webkit-keyframes Floatingx{ from {-webkit-transform:translate(0, 0px) rotate(7deg);} 65% {-webkit-transform:translate(0, 10px) rotate(7deg);} to {-webkit-transform: translate(0, -0px) rotate(7deg); } } @-moz-keyframes Floating{ from {-moz-transform:translate(0, 0px) rotate(7deg);} 65% {-moz-transform:translate(0, 10px) rotate(7deg);} to {-moz-transform: translate(0, -0px) rotate(7deg);} } /******************************************************************************************** MODEL FORM SEND EMAIL PRODUCT *********************************************************************************************/ .animate-show, .animate-hide { -webkit-transition:all linear 1s; -moz-transition:all linear 1s; -ms-transition:all linear 1s; -o-transition:all linear 1s; transition:all linear 1s; } .animate-show.ng-hide-remove, .animate-hide.ng-hide-add.ng-hide-add-active { opacity: 0; display: block !important; } .animate-hide.ng-hide-add, .animate-show.ng-hide-remove.ng-hide-remove-active { opacity: 1; display: block !important; } textarea:hover, input:hover, textarea:active, input:active, textarea:focus, input:focus, select:focus, select:active, button:focus, button:active, button:hover{ outline:0px !important; -webkit-appearance:none; box-shadow: none!important; -moz-box-shadow: none; -webkit-box-shadow: none; } .content-backcolor { background: rgba(255,255,255,1); padding-bottom: 30px; } .content-backcolor .panel-body { background: #fff!important; border-color: #fff!important; } .content-backcolor h2 { text-transform: uppercase; font-weight: 300; font-size: 20px; } .form-control { display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #333; background-color: #fff; background-image: none; border: 0px solid #ccc; border-radius: 0px; -webkit-box-shadow: inset 0 0px 0px rgba(0,0,0,.0); box-shadow: inset 0 0px 0px rgba(0,0,0,.0); -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; border-bottom: 1px solid #ccc; outline-width: 0; } .form-control-select { display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; background-color: #fff; background-image: none; border: 0px solid #ccc; border-radius: 0px; -webkit-box-shadow: inset 0 0px 0px rgba(0,0,0,.0); box-shadow: inset 0 0px 0px rgba(0,0,0,.0); -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; border-bottom: 1px solid #ccc; outline-width: 0; } .select-opt { width: 100%; height: 35px; margin-top: 0px; color: #acacac; } .form-control-select .frt-options { color: #ccc!important; } .form-control-select .other-opt { color: #333; } /******************************************************************************************** PAGE CART PRODUCT *********************************************************************************************/ .shoppingpack img { padding-top: 40px; } .content-table-cart { border: 1px solid #ddd; padding: 20px; margin-bottom: 80px; } .cart-prod-img { width: 30%; text-align: center; } .cart-prod-img p{ text-transform: uppercase; } .tab-top-txt p { text-transform: uppercase; margin: 0; font-weight: 600; } .table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td { padding: 15px 0px 15px 0; line-height: 1.42857143; vertical-align: middle; border-top: 1px solid #ddd; } .ic-remove i{ color: #111; } .cart-quantity input { height: 31px; } .cart-total p { color: #111; font-size: 16px; font-weight: 600; text-transform: uppercase; } .cart-txt-shop { margin-bottom: 30px; } .text-info { color:#6e6e6e; } .btn-primary.bt-plus-prod { height: 31px; width: 26px; } .btn.bt-minus-prod { height: 31px; background: #313131; border: 1px solid #6e6e6e; color: #fff; width: 26px; } .quantity-prod { width: 60px; border: 1px solid #ddd; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.1); } .input-append input{ float: left; border: 0; margin: 0; padding: 0; height: 31px; text-align: center; vertical-align: middle; } .total-items { color: #333; font-size: 16px; float: left; } .t-table { color: #333; font-size: 16px; } #cart .title-cart-table td{ border-top: 0px solid #ddd; padding: 0; } .bt-tourn-back { float: right; margin-top: 3px; } .bt-tourn-back a { color: #333; font-size: 13px; text-transform: uppercase; text-decoration: none; } .bt-tourn-back i { font-size: 16px; margin-right: 5px; color: #000; } .btn-payment { float: right; } .btn-payment .checkout { margin-top: -6px; margin-right: 10px; } .btn-primary.cart-clear-all { background: #313131; border: 1px solid #313131; -webkit-box-shadow: inset 0 0px 0 #0fc8c8; -moz-box-shadow: inset 0 0px 0 #0fc8c8; box-shadow: inset 0 0px 0 #0fc8c8; } .btn-primary.cart-clear-all:after { background: #313131; border: 1px solid #333; } .btn-primary.cart-clear-all:hover { background: #313131; border: 1px solid #333; } .table .btn-checkout-prod { padding: 40px 0px 15px 0; } /******************************************************************************************** Google Maps *********************************************************************************************/ .google-maps { height: 600px; } .google-maps-footer3{height: 250px;} #map_canvas, #map_container { height: 100%; position: relative; width: 100%; } .angular-google-map-container { position: absolute; top: 0; bottom: 0; right: 0; left: 0; } #map_canvas { top: 0; z-index: 1; } #map_canvas, #map_container { height: 100%; position: relative; width: 100%; } .cover-map { width: 100%; height: 100%; position: absolute; background: rgba(0,0,0,.5); top: 0; left: 0; z-index: 998; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } /******************************************************************************************** Footer Styles *********************************************************************************************/ .row-footer { margin-right: 0; margin-left:0; } .fact-number h3 { font-size: 16px; font-weight: 700; webkit-transform: rotate(-90deg) translateX(-148px) translateY(58px); -moz-transform: rotate(-90deg) translateX(-148px) translateY(58px); -ms-transform: rotate(-90deg) translateX(-148px) translateY(58px); -o-transform: rotate(-90deg) translateX(-148px) translateY(58px); transform: rotate(-90deg) translateX(-148px) translateY(58px); } .uppercase {text-transform: uppercase;} footer { background-color: #21252b; border-top: 1px solid #2e343a; margin-top: 0px; position: relative; } .section-footer{padding-bottom:60px;border-bottom:1px solid rgba(120,120,120,0.2);} .info-support.section-footer1{padding:0 0 60px 0;border-bottom:1px solid rgba(120,120,120,0.2);margin-bottom:60px;} .info-support.section-footer1 p{color:#fff;} footer .top-footer-in {padding: 80px 0;} ul.footer-menu li {list-style-type: none;} footer h4{ color: #fff; text-transform: uppercase; font-size: 14px; margin-bottom:25px; } .info-footer { background: #282d33; padding: 20px 0; color: rgba(255,255,255,0.5); font-weight: 300; font-size: 14px; text-align: center; } .info-footer .ic-fo{ margin-right: 10px; font-size: 18px; } ul.footer-menu {padding: 0;} ul.footer-menu li{padding: 5px 0;} ul.footer-menu li a{ color: #ccc; font-size: 13px; text-decoration: none; } .footer-menu a:before { display: inline-block; margin-right: 7px; color: #6487c3; content: "\f105"; font-family: FontAwesome; } /******* footer tags *******/ footer .tags a { display: block; float: left; margin: 3px; padding: 8px 6px; background: #2a3037; color: #C4C4C4; font-size: 11px; text-decoration: none; } footer .tags a:hover { background: #6487c3; color: #fff; } .info-support{padding:60px 0 0 0;} .info-support span{font-size:46px;color:#fff;} .info-support .spt-top-info{font-size:22px;font-weight:600;} .info-support .spt-second-info{font-size:16px;color: #707070;} /******************************************************************************************** Footer-2 *********************************************************************************************/ .footer-title-step { margin-top: 110px; } footer#footer_sponsor .top-footer-in{ padding: 20px 0 80px 0; } .footer_2 { position: relative; float: left; width: 100%; background-color: #21252b; } .footer_2 .logofooter img{margin-bottom:10px;} .ftr-txt-desc{padding:70px 0 30px 15px;} .ftr-txt-tags{padding:30px 0 0px 15px;} #footer_clients { margin-bottom: 30px; } .footer_2 .map-2{padding:0;} #footer_sponsor ul.clients { margin-top: 20px; } #footer_sponsor ul.clients li{ opacity: 0.2; -webkit-transition: opacity 0.6s ease-in-out; -moz-transition: opacity 0.6s ease-in-out; -o-transition: opacity 0.6s ease-in-out; transition: opacity 0.6s ease-in-out; } #footer_sponsor ul.clients li:hover{ opacity: 1; } .info-footer .list-social-icons { margin: 0; float: right; } .copyright-text{ margin: 0; text-align: left; font-size: 11px; color: #ccc; } .info-footer .copyright { float: left; font-size:11px; } .info-footer .tooltip-social a i { background: #21252b; } .info-footer .f-spons { padding-left: 0; padding-right: 0; } .info-footer #moveTop i{ background: #323e48; padding: 10px 13px; color: #fff; cursor:pointer; } .info-footer.second-ftr{float:left; width:100%} .info-footer #moveTop{margin-bottom:0;} /******************************************************************************************** Footer-3 Two Color *********************************************************************************************/ .twocolor .logofooter img { margin-top: -10px; } .twocolor p { color: #eee; font-weight: 300; } .twocolor p i { background:#282d33; color:#3d67af; padding: 7px; font-size: 16px; border-radius:2px; margin-right: 10px; } .twocolor p i.fa-phone { padding: 7px 9px; } /*** Footer 3 Box***/ .arrow_box_page { position: relative; background: #fff; border: 1px solid #ccc; padding: 30px; } .arrow_box_page:after, .arrow_box_page:before { right: 100%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .arrow_box_page:after { border-color: rgba(255, 255, 255, 0); border-right-color: #fff; border-width: 30px; margin-top: -30px; } .arrow_box_page:before { border-color: rgba(204, 204, 204, 0); border-right-color: #ccc; border-width: 31px; margin-top: -31px; } .footer3-box { padding: 80px 0 110px 0; } .footer3-box .img2, .footer3-box .img1{display:none;} .footer3-box .img2.animated{display:block;} .footer3-box .img1.animated{display:block;} .box-content-2 { margin-top: 20px; } .box-content-1 .arrow_box_page{ background: #6886b8; color:#fff; -webkit-transition: all 0.6s ease-out; /* Chrome 1-25, Safari 3.2+ */ -moz-transition: all 0.6s ease-out; /* Firefox 4-15 */ -o-transition: all 0.6s ease-out; /* Opera 10.50–12.00 */ transition: all 0.6s ease-out; /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */ } .box-content-1 .arrow_box_page p, .box-content-2 .arrow_box_page p { color: #fff; } .box-content-2 .arrow_box_page{ background: #282d33; color:#fff; -webkit-transition: all 0.6s ease-out; /* Chrome 1-25, Safari 3.2+ */ -moz-transition: all 0.6s ease-out; /* Firefox 4-15 */ -o-transition: all 0.6s ease-out; /* Opera 10.50–12.00 */ transition: all 0.6s ease-out; /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */ } .box-content-1 .arrow_box_page:after { border-right-color: #6886b8; -webkit-transition: all 0.6s ease-out; /* Chrome 1-25, Safari 3.2+ */ -moz-transition: all 0.6s ease-out; /* Firefox 4-15 */ -o-transition: all 0.6s ease-out; /* Opera 10.50–12.00 */ transition: all 0.6s ease-out; /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */ } .box-content-2 .arrow_box_page:after { border-right-color: #282d33; -webkit-transition: all 0.6s ease-out; /* Chrome 1-25, Safari 3.2+ */ -moz-transition: all 0.6s ease-out; /* Firefox 4-15 */ -o-transition: all 0.6s ease-out; /* Opera 10.50–12.00 */ transition: all 0.6s ease-out; /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */ } .bf-content h1 { margin: 0 0 15px 0; font-weight: 700; font-size: 20px; } .bf-content h1 span { padding-right: 10px; } .bf-content:hover .arrow_box_page:after { border-right-color: #fff; } .bf-content:hover .arrow_box_page { background: #fff; } .bf-content:hover .arrow_box_page p, .bf-content:hover .arrow_box_page h1 { color: #282d33; } /******************************************************************************************** Footer-4 Two Color *********************************************************************************************/ .footer-bacground { background-image: url(../images/texture/kindajean.png); background-repeat: repeat !important; width: 100%; height: 100%; position: absolute; opacity: 0.1; } .map-back { background: url(../images/map.png) no-repeat 0 50px; width: 100%; height: 100%; position: absolute; margin-top: 20px; opacity: 0.5; } footer .tags-img a { display: block; float: left; margin: 3px 3px 3px 0; border:3px solid #000; background: #2a3037; text-decoration: none; } footer .tags-img a:hover { border:3px solid #0bb7b7; } /******************************************************************************************** Footer-4 *********************************************************************************************/ .twocolor4 p { color: #eee; font-weight: 300; } .twocolor4 .logofooter4 img{ margin-top: 0px; margin-bottom: 20px; margin-left: -2px; } .twocolor4 p i { background:#3d67af; color:#fff; padding: 7px; font-size: 16px; border-radius:2px; margin-right: 10px; } .twocolor4 p i.fa-phone { padding: 7px 9px; } footer .tags4 a { display: block; float: left; margin: 5px 5px 5px 0; padding: 4px 10px; border:1px solid #2a3037; color: #C4C4C4; font-size: 11px; text-decoration: none; border-radius:1px; } footer .tags4 a:hover { background: #3d67af; color: #fff; } /******************************************************************************************** PAGE 404 NOT FOUND *********************************************************************************************/ h1.page-header{margin: 110px 0 20px;} h1.page-header small{color:#426ca9} p.lead{margin-bottom:110px;} .page-nofound .error-404 { font-size: 220px; text-align: center; font-weight: 700; font-family: Open sans; -webkit-background-clip: text; -moz-background-clip: text; background-clip: text; color: #f4f4f4; margin-bottom: 60px; text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15); } @font-face { font-family: 'et-line'; src:url('fonts/et-line.eot'); src:url('fonts/et-line.eot?#iefix') format('embedded-opentype'), url('fonts/et-line.woff') format('woff'), url('fonts/et-line.ttf') format('truetype'), url('fonts/et-line.svg#et-line') format('svg'); font-weight: normal; font-style: normal; } /* Use the following CSS code if you want to use data attributes for inserting your icons */ [data-icon]:before { font-family: 'et-line'; content: attr(data-icon); speak: none; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display:inline-block; } /* Use the following CSS code if you want to have a class per icon */ /* Instead of a list of all class selectors, you can use the generic selector below, but it's slower: [class*="icon-"] { */ .icon-mobile, .icon-laptop, .icon-desktop, .icon-tablet, .icon-phone, .icon-document, .icon-documents, .icon-search, .icon-clipboard, .icon-newspaper, .icon-notebook, .icon-book-open, .icon-browser, .icon-calendar, .icon-presentation, .icon-picture, .icon-pictures, .icon-video, .icon-camera, .icon-printer, .icon-toolbox, .icon-briefcase, .icon-wallet, .icon-gift, .icon-bargraph, .icon-grid, .icon-expand, .icon-focus, .icon-edit, .icon-adjustments, .icon-ribbon, .icon-hourglass, .icon-lock, .icon-megaphone, .icon-shield, .icon-trophy, .icon-flag, .icon-map, .icon-puzzle, .icon-basket, .icon-envelope, .icon-streetsign, .icon-telescope, .icon-gears, .icon-key, .icon-paperclip, .icon-attachment, .icon-pricetags, .icon-lightbulb, .icon-layers, .icon-pencil, .icon-tools, .icon-tools-2, .icon-scissors, .icon-paintbrush, .icon-magnifying-glass, .icon-circle-compass, .icon-linegraph, .icon-mic, .icon-strategy, .icon-beaker, .icon-caution, .icon-recycle, .icon-anchor, .icon-profile-male, .icon-profile-female, .icon-bike, .icon-wine, .icon-hotairballoon, .icon-globe, .icon-genius, .icon-map-pin, .icon-dial, .icon-chat, .icon-heart, .icon-cloud, .icon-upload, .icon-download, .icon-target, .icon-hazardous, .icon-piechart, .icon-speedometer, .icon-global, .icon-compass, .icon-lifesaver, .icon-clock, .icon-aperture, .icon-quote, .icon-scope, .icon-alarmclock, .icon-refresh, .icon-happy, .icon-sad, .icon-facebook, .icon-twitter, .icon-googleplus, .icon-rss, .icon-tumblr, .icon-linkedin, .icon-dribbble { font-family: 'et-line'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display:inline-block; } .icon-mobile:before { content: "\e000"; } .icon-laptop:before { content: "\e001"; } .icon-desktop:before { content: "\e002"; } .icon-tablet:before { content: "\e003"; } .icon-phone:before { content: "\e004"; } .icon-document:before { content: "\e005"; } .icon-documents:before { content: "\e006"; } .icon-search:before { content: "\e007"; } .icon-clipboard:before { content: "\e008"; } .icon-newspaper:before { content: "\e009"; } .icon-notebook:before { content: "\e00a"; } .icon-book-open:before { content: "\e00b"; } .icon-browser:before { content: "\e00c"; } .icon-calendar:before { content: "\e00d"; } .icon-presentation:before { content: "\e00e"; } .icon-picture:before { content: "\e00f"; } .icon-pictures:before { content: "\e010"; } .icon-video:before { content: "\e011"; } .icon-camera:before { content: "\e012"; } .icon-printer:before { content: "\e013"; } .icon-toolbox:before { content: "\e014"; } .icon-briefcase:before { content: "\e015"; } .icon-wallet:before { content: "\e016"; } .icon-gift:before { content: "\e017"; } .icon-bargraph:before { content: "\e018"; } .icon-grid:before { content: "\e019"; } .icon-expand:before { content: "\e01a"; } .icon-focus:before { content: "\e01b"; } .icon-edit:before { content: "\e01c"; } .icon-adjustments:before { content: "\e01d"; } .icon-ribbon:before { content: "\e01e"; } .icon-hourglass:before { content: "\e01f"; } .icon-lock:before { content: "\e020"; } .icon-megaphone:before { content: "\e021"; } .icon-shield:before { content: "\e022"; } .icon-trophy:before { content: "\e023"; } .icon-flag:before { content: "\e024"; } .icon-map:before { content: "\e025"; } .icon-puzzle:before { content: "\e026"; } .icon-basket:before { content: "\e027"; } .icon-envelope:before { content: "\e028"; } .icon-streetsign:before { content: "\e029"; } .icon-telescope:before { content: "\e02a"; } .icon-gears:before { content: "\e02b"; } .icon-key:before { content: "\e02c"; } .icon-paperclip:before { content: "\e02d"; } .icon-attachment:before { content: "\e02e"; } .icon-pricetags:before { content: "\e02f"; } .icon-lightbulb:before { content: "\e030"; } .icon-layers:before { content: "\e031"; } .icon-pencil:before { content: "\e032"; } .icon-tools:before { content: "\e033"; } .icon-tools-2:before { content: "\e034"; } .icon-scissors:before { content: "\e035"; } .icon-paintbrush:before { content: "\e036"; } .icon-magnifying-glass:before { content: "\e037"; } .icon-circle-compass:before { content: "\e038"; } .icon-linegraph:before { content: "\e039"; } .icon-mic:before { content: "\e03a"; } .icon-strategy:before { content: "\e03b"; } .icon-beaker:before { content: "\e03c"; } .icon-caution:before { content: "\e03d"; } .icon-recycle:before { content: "\e03e"; } .icon-anchor:before { content: "\e03f"; } .icon-profile-male:before { content: "\e040"; } .icon-profile-female:before { content: "\e041"; } .icon-bike:before { content: "\e042"; } .icon-wine:before { content: "\e043"; } .icon-hotairballoon:before { content: "\e044"; } .icon-globe:before { content: "\e045"; } .icon-genius:before { content: "\e046"; } .icon-map-pin:before { content: "\e047"; } .icon-dial:before { content: "\e048"; } .icon-chat:before { content: "\e049"; } .icon-heart:before { content: "\e04a"; } .icon-cloud:before { content: "\e04b"; } .icon-upload:before { content: "\e04c"; } .icon-download:before { content: "\e04d"; } .icon-target:before { content: "\e04e"; } .icon-hazardous:before { content: "\e04f"; } .icon-piechart:before { content: "\e050"; } .icon-speedometer:before { content: "\e051"; } .icon-global:before { content: "\e052"; } .icon-compass:before { content: "\e053"; } .icon-lifesaver:before { content: "\e054"; } .icon-clock:before { content: "\e055"; } .icon-aperture:before { content: "\e056"; } .icon-quote:before { content: "\e057"; } .icon-scope:before { content: "\e058"; } .icon-alarmclock:before { content: "\e059"; } .icon-refresh:before { content: "\e05a"; } .icon-happy:before { content: "\e05b"; } .icon-sad:before { content: "\e05c"; } .icon-facebook:before { content: "\e05d"; } .icon-twitter:before { content: "\e05e"; } .icon-googleplus:before { content: "\e05f"; } .icon-rss:before { content: "\e060"; } .icon-tumblr:before { content: "\e061"; } .icon-linkedin:before { content: "\e062"; } .icon-dribbble:before { content: "\e063"; } /*Pannel Preview*/ .content-lateral-box { } .box-lateral { width: 200px; height:300px; position:fixed; float: left; background:#262c32; z-index:9999; display: none; margin-top:60px; } .box-lateral h3 { color: #fff; font-size: 13px; text-transform: uppercase; margin-left: 30px; margin-top:30px; } .box-lateral select { margin-left: 30px; color: #333; background: #f4f4f4; border-radius: 3px; padding: 3px 2px; } #btnlateral{ position: fixed; z-index:99999; margin-left:0px; border:1px solid #262c32; padding: 8px 20px; color: #fff; cursor: pointer; text-decoration: none; background: #262c32; margin-top: 300px; } .box-lateral select > option { border-bottom: 1px solid #ccc; padding: 5px 0; }