.fl-lt {float:left;} .fl-rt {float:right;} .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } .clearfix:before, .clearfix:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } .clearfix:after { clear: both; } ul { list-style: circle; } .figure{ margin:0px;} img{ max-width:100%;} a, a:hover, a:active{ outline:0px !important} table, th, td { border: 1px solid black; padding: 10px 10px 10px 10px; } @font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.eot?v=4.1.0'); src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'LatoRegular'; src: url('../fonts/lato-regular.eot'); src: url('../fonts/lato-regular.eot') format('embedded-opentype'), url('../fonts/lato-regular.woff2') format('woff2'), url('../fonts/lato-regular.woff') format('woff'), url('../fonts/lato-regular.ttf') format('truetype'), url('../fonts/lato-regular.svg#LatoRegular') format('svg'); } @font-face { font-family: 'LatoBoldBold'; src: url('../fonts/lato-bold.eot'); src: url('../fonts/lato-bold.eot') format('embedded-opentype'), url('../fonts/lato-bold.woff2') format('woff2'), url('../fonts/lato-bold.woff') format('woff'), url('../fonts/lato-bold.ttf') format('truetype'), url('../fonts/lato-bold.svg#LatoBoldBold') format('svg'); } @font-face { font-family: 'DosisBold'; src: url('../fonts/dosis-bold.eot'); src: url('../fonts/dosis-bold.eot') format('embedded-opentype'), url('../fonts/dosis-bold.woff2') format('woff2'), url('../fonts/dosis-bold.woff') format('woff'), url('../fonts/dosis-bold.ttf') format('truetype'), url('../fonts/dosis-bold.svg#DosisBold') format('svg'); } body { background: #fffffff; font-family: 'Lato', sans-serif; font-size: 24px; font-weight: normal; color: #888888; margin: 0; } h2 { font-size: 48px; color: #222222; font-family: 'Dosis'; font-weight: 700; margin: 35px 0 25px 0; text-align: center; text-transform: uppercase; } h3 { font-family: 'Dosis', sans-serif; font-weight: 600; color: #222222; font-size: 32px; margin: 10px 0 50px 0; text-transform: uppercase; } h6 { font-size: 16px; color: #888888; font-family: 'Open Sans', sans-serif; font-weight: 400; text-align: center; margin: 0 0 60px 0; } p { line-height: 24px; margin: 0; } #header_outer{ background: #333333; padding: 30px 0px; } .header_section{ position:relative; } .logo { font-size: 48px; float:left; } .logo a { color: #ffff00; } .logo a:hover { color: #ffff00; font-weight: "underscore"; } .res-nav_click{ display: none; } .nav { float: right; } .nav ul{ list-style: none; padding: 0px; } .nav ul.toggle{ display: none; visibility: hidden; height: 0px; overflow: hidden; margin-bottom: 0; } .nav ul li{ display: inline-block; margin: 0 13px; } .nav ul li:first-child{ /*margin: 0px;*/ } .nav ul li:last-child { margin: 0 0 0 23px; } .nav ul li a { display: block; font-size: 24px; color: #dddd00; font-family: 'Dosis'; text-decoration: none; text-transform: uppercase; font-weight: 600; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; } .nav ul li a:hover { color:#49b5e7; } .top_cont_outer { background:#f9f9f9; position:relative; } .top_cont_inner { background:url(../img/white_pad.png) no-repeat right bottom; } .top_content { position:relative; padding-top: 50px; } .white_pad { position:relative; right:0px; bottom:0px; } .white_pad img { position: absolute; right:0px; bottom:0px; } .top_left_cont { padding:110px 0; } .top_left_cont h3 { font-size:16px; color:#f56eab; margin:0 0 20px 0; text-align:left; font-family:'Lato'; font-weight: 700; } .top_left_cont h2 { font-size: 40px; color:#111111; line-height: 52px; margin:0 0 26px 0; font-family:'Dosis'; text-align:left; font-weight:700; } .top_left_cont p { font-size:16px; color:#888888; margin:0 0 30px 0; line-height: 26px; font-family:'Lato'; } a.learn_more2{ font-family: 'Dosis'; display:block; font-size:16px; color:#ffffff; background:#49b5e7; width:178px; height:46px; line-height:46px; border-radius:3px; text-align:center; font-family:''Dosis''; text-transform:uppercase; font-weight: 600; transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out; } a.learn_more2:hover{ background:#222222; } .intro { text-align: center; font-size: 64px; } .intro .row { font-size: 32px; } .page table { border: 1px; } /* Services ---------------------------------*/ #service{ padding:83px 0px; } .service_area{ padding:40px 0 40px; } .service_section{ } .service_block{ text-align:center; padding-left: 15px; padding-right: 15px; } .service_icon{ border:2px solid #f56eab; border-radius:50%; width:90px; height:90px; margin:0px auto 25px; } .service_icon.icon2{ border:2px solid #7cc576; } .service_icon.icon3{ border:2px solid #49b5e7; } .service_icon span { background:#f56eab; border: 3px solid #fff; border-radius: 50%; display: block; height: 100%; width: 100%; } .service_icon.icon2 span { background:#7cc576; } .service_icon.icon3 span{ background:#49b5e7; } .service_icon i{ color: #fff; font-size: 40px; margin-top: 0; position: relative; top: 14px; z-index: 20; } .service_block h3{ font-family: 'Dosis'; font-weight: 600; font-size:18px; color:#111111; margin:35px 0 18px; } .service_block p{ font-size:16px; color:#888888; margin:0px; } /* Latest Work ---------------------------------*/ #work_outer{ background:#f9f9f9; padding:70px 0px; position:relative; } .top_cont_latest{ background:url(../img/dashboard_pic.png) no-repeat right bottom; } .work_pic{ position:absolute; right:0; top:25%; width:50%; } .work_section { padding:110px 0 20px; } .service-list{ padding:0 0 0 0; font-size:14px; margin-bottom:40px; } .service-list-col1{ float:left; width:60px; text-align:center; } .service-list-col1 i{ display:; color:#888; font-family: 'linecons'; font-size: 19px; font-style: normal; line-height: 20px; } .service-list-col2{ overflow:hidden; } .main-section.alabaster{ background:#fafafa; } .work_bottom{ padding:20px 0 0 60px; } .work_bottom span{ font-size:18px; color:#333333; display:block; margin:0 0 20px 0; } a.contact_btn{ background:#f56eab; text-transform:uppercase; display:block; width:176px; height:49px; text-align:center; line-height:49px; font-size:16px; color:#ffffff; border-radius:3px; font-family:'Dosis'; font-weight: 600; transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out; } a.contact_btn:hover{ background:#222222; } .validation { color: red; display:none; margin: 0 0 20px; font-weight:400; font-size:13px; } #sendmessage { color: green; border:1px solid green; display:none; text-align:center; padding:15px; font-weight:600; margin-bottom:15px; } #errormessage { color: red; display:none; border:1px solid red; text-align:center; padding:15px; font-weight:600; margin-bottom:15px; } #sendmessage.show, #errormessage.show, .show { display:block; } /* Portfolio ---------------------------------*/ #Portfolio{ padding:100px 0px;} .Portfolio-nav{ padding:0; margin:0 0 45px 0; list-style:none; text-align:center; } .Portfolio-nav li{ margin:0 10px; display:inline; } .Portfolio-nav li a{ display:inline-block; padding:10px 22px; font-size:12px; line-height:20px; color:#222222; border-radius:4px; text-transform:uppercase; font-family: 'LatoRegular', sans-serif; background:#f7f7f7; margin-bottom:5px; transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; } .Portfolio-nav li a:hover{ background:#7cc576; color:#fff; text-decoration:none; } .portfolioContainer{ margin:0 auto; padding-left:15px; width:auto !important; } .Portfolio-box{ text-align:center; width:350px; overflow:hidden; float:left; padding:12px 0px; } .Portfolio-box img{ transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; } .Portfolio-box img:hover { opacity: 0.6; } .Portfolio-nav li a.current{ background:#7cc576; color:#fff; text-decoration:none; } img { max-width:100%; } /* no transition on .isotope container */ .isotope .isotope-item { /* change duration value to whatever you like */ -webkit-transition-duration: 0.6s; -moz-transition-duration: 0.6s; transition-duration: 0.6s; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; transition-property: transform, opacity; } .main-section.padding { padding-bottom:60px; } /* Happy Clients ---------------------------------*/ #client_outer{ padding:0px 0px; } .client_area{ width:960px; margin:0px auto; } .client_section{ padding:35px 0 0 0; } .client_section.btm{ padding:20px 0 0 0; } .client_profile{ float:left; text-align:center; } .client_profile.flt{ float:right; } .client_profile_pic{ border-radius:50%; border:2px solid #f5f5f5; margin:0 0 15px 0; width:220px; height:220px; } .client_profile_pic img{ border-radius:50%; border:3px solid #f5f5f5; } .client_profile h3{ font-size:18px; color:#49b5e7; margin:0 0 0 0; } .client_profile span{ display:block; font-size:16px; color:#888888; } .quote_section{ width:648px; background:#f9f9f9; position:relative; padding:40px 30px; float:left; margin:35px 0 0 30px; } .quote_section.flt{ float:left; } .quote_section p{ font-family: 'Lato',sans-serif; font-style: italic; font-size:18px; font-weight: 300; color:#888888; text-align:center; position:relative; } .quote_section p b{ display: inline-block; font-size: 22px; left: -9px; position: relative; top: -8px; } .quote_section p small{ display: inline-block; right: -9px; position: relative; top:4px; } .quote_arrow{ position:absolute; background:url(../img/quote_arrow.png) no-repeat left top; width:23px; height:25px; left:-22px; top:50%; margin-top:-15.5px; } .quote_arrow2{ background:url(../img/quote_arrow2.png) no-repeat right top; position:absolute; width:23px; height:25px; right:-22px; top:50%; margin-top:-15.5px; } .c-logo-part { background: url(../img/poligan_bg.jpg) no-repeat left top; padding: 60px 0; margin-top: 60px; filter: alpha(opacity=60); } .c-logo-part ul { padding: 0; margin: 0; list-style: none; text-align: center; } .c-logo-part ul li { display: inline; margin: 0 25px; } .c-logo-part ul a { display: inline-block; margin: 0 20px; } .main-section.team { padding: 85px 0; } .main-section.team h6 { margin-bottom: 40px; } .team-leader-block{ max-width:993px; margin:0 auto; } .team-leader-box{ width:30.66%; margin-right: 3.82979%; height: 490px; overflow: hidden; text-align: center; float: left; } .team-leader-box span{ margin-bottom:24px; display:block; } .team-leader-box:nth-of-type(3n+0){ margin:0;} .team-leader{ width:auto; height:auto; position:relative; border-radius:50%; box-shadow:0px 0px 0px 7px rgba(241,241,241,0.80); margin:7px 7px 25px 7px; } .team-leader-shadow{ transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; border-radius:50%; position:absolute; width:100%; height:100%; z-index:10; border-radius:50%; } .team-leader-shadow a{ display:block; width:100%; height:100%; } .team-leader:hover .team-leader-shadow{ box-shadow:inset 0px 0px 0px 148px rgba(17,17,17,0.80); } .team-leader:hover ul{ display:block; opacity:1} .team-leader img{ display:block; border-radius:50%; } .team-leader ul{ display:block; opacity:0; padding:0; margin:0; list-style:none; position:absolute; left:0; top:50%; width:100%; text-align:center; margin-top:-14px; z-index:15; transition:all 0.6s ease-in-out; -moz-transition:all 0.6s ease-in-out; -webkit-transition:all 0.6s ease-in-out; } .team-leader ul li{ display:inline; margin:0 11px; } .team-leader ul li a{ font-family: 'FontAwesome'; display:inline-block; font-size:28px; color:#fff; transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; } .team-leader ul li a:hover, .team-leader ul li a:focus{ text-decoration:none; } .team-leader ul li a.fa-twitter:hover{ color:#55acee; } .team-leader ul li a.fa-facebook:hover{ color:#3b5998; } .team-leader ul li a.fa-pinterest:hover{ color:#cb2026; } .team-leader ul li a.fa-google-plus:hover{ color:#dd4b39; } /* Twitter Feed ---------------------------------*/ /* .business-talking{ background:#00b8ff; padding:40px 0; text-align:center; } .business-talking p{ font-size:16px; color:#ffffff; margin:0 0 15px 0; } .twitter_bird{ background:url(../img/twitter_bird.png) no-repeat left top; width:36px; margin:0px auto 15px; } .business-talking p small{ font-size:16px; color:#ffffff; display:inline-block; } .business-talking span{ display:block; font-size:14px; color:#ffffff; } */ .twitter-feed{ background:#00b8ff; padding:40px 0; text-align:center; transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; } .twitter-feed:hover { background: #f56eab; } .twitter-feed p{ font-size:16px; font-weight: 300; color:#ffffff; margin:0 0 15px 0; } .twitter_bird{ /*background:url(../img/twitter_bird.png) no-repeat left top;*/ width:36px; margin:0px auto 15px; } .twitter-feed p small{ font-size:16px; font-weight: 300; color:#ffffff; display:inline-block; } .twitter-feed span{ display:block; font-size:14px; font-style: italic; color:#ffffff; } .twitter-feed span i{ font-size: 38px; } .main-section.contact{ padding: 90px 0 100px; } .main-section.contact{ background:url(../img/bg-map.png) left 190px no-repeat; } .contact_section{ margin:0 0 60px 0; } .contact_section h2{ font-size:40px; color:#ffffff; margin:0 0 50px 0; text-transform:uppercase; } .contact_block{ text-align:center; } .contact_block_icon{ border-radius: 50%; height: 85px; width:85px; margin:0px auto 20px; } .contact_block_icon.icon2{ border-color:#7cc576; } .contact_block_icon.icon3{ border-color:#49b5e7; } .contact_block_icon span { background: none repeat scroll 0 0 #f56eab; border: 5px solid #fff; border-radius: 50%; display: block; height: 100%; width: 100%; } .contact_block_icon.icon2{ border-color:#7cc576; } .contact_block_icon.icon2 span{ background:#7cc576; } .contact_block_icon.icon3{ border-color:#49b5e7; } .contact_block_icon.icon3 span{ background:#49b5e7; } .contact_block_icon i { color: #fff; font-size: 36px; margin-top: 0; position: relative; top: 26px; z-index: 20; } .contact_block span{ display:block; font-size:16px; color:#ffffff; line-height:20px; } .contact_block span a{ display:block; font-size:16px; color:#ffffff; line-height:20px; } .contact-info-box{ font-size:15px; margin:0 0 14px 68px; padding-left:0; } .contact-info-box h3{ font-size: 24px; font-weight:600; margin:0 0 40px; color:#fff; } .contact-info-box p{ line-height:28px; display:block; font-size:16px; color:#ffffff; margin:0 0 40px; } .social-link{ padding:35px 0; margin:0 0 0 68px; display:block; overflow:hidden; list-style:none; } .social-link li{ float:left; margin-right:8px; } .social-link li a{ display:block; width:55px; height:55px; border:3px solid #fff; border-radius:50%; text-align:center; line-height:48px; font-size:25px; color:#fff; background:#222222; border-radius:50%; transition:all 0.3s ease-in-out; } .social-link li a:hover, .social-link li a:focus{ text-decoration:none; } .twitter a:hover { background: #55acee; } .facebook a:hover { background: #3b5998; } .pinterest a:hover { background: #cb2026; } .gplus a:hover { background: #dd4b39; } .dribbble a:hover { background: #ea4c89; } .form{ margin:0 66px 0 30px; } .input-text{ padding:15px 16px; border:1px solid #ccc; width:100%; height:50px; display:block; border-radius:4px; font-size:15px; color:#aaa; font-family: 'Lato', sans-serif; margin:0 0 15px 0; transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; } .input-text:focus { border: 1px solid #7cc576; outline:0; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(124, 197, 118, 0.3); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(124, 197, 118, 0.3); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(124, 197, 118, 0.3); } .input-text.text-area{ height:230px; resize:none; overflow:auto; font-family: 'Lato', sans-serif; } .input-btn{ font-family: 'Dosis', sans-serif; width:175px; height:50px; letter-spacing: 0px; background:#7cc576; border-radius:3px; color:#ffffff; font-size:16px; text-transform:uppercase; font-weight:600; border:0px; transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -webkit-transition:all 0.3s ease-in-out; } .input-btn:hover { background: #ffffff; color: #222222; } .footer_section { background: #666666; } .footer_bottom { border-top: 5px solid #ffff00; background: #666666; padding: 40px 0; text-align: center; } .footer_bottom span { display:i block; font-size: 14px; color: #ffffff; text-align: center; } .footer_bottom span a { display: inline-block; color: #ff8800; font-size: 16px; transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; } .footer_bottom span a:hover { color: #ffff00; } .footer_bottom .credits { color: #ffffff; } .footer_bottom .credits a { color: #ff8800; } /* Animation Timers ---------------------------------*/ .delay-02s { animation-delay: 0.2s; -webkit-animation-delay: 0.2s; } .delay-03s { animation-delay: 0.3s; -webkit-animation-delay: 0.3s; } .delay-04s { animation-delay: 0.4s; -webkit-animation-delay: 0.4s; } .delay-05s { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; } .delay-06s { animation-delay: 0.6s; -webkit-animation-delay: 0.6s; } .delay-07s { animation-delay: 0.7s; -webkit-animation-delay: 0.7s; } .delay-08s { animation-delay: 0.8s; -webkit-animation-delay: 0.8s; } .delay-09s { animation-delay: 0.9s; -webkit-animation-delay: 0.9s; } .delay-1s { animation-delay: 1s; -webkit-animation-delay: 1s; } .delay-12s { animation-delay: 1.2s; -webkit-animation-delay: 1.2s; } /*new_profolio*/ /* Portfolio */ .container.portfolio-title { padding-bottom:0px; } #portfolio { padding:60px 0 40px; } /* Portfolio Filters */ #filters { margin-top: 10px; margin-bottom: 40px; text-align: center; display: block; float: none; z-index: 2; position: relative; } #filters ul li { display: inline-block; margin:0 5px; } #filters ul li a { display: block; } #filters ul li a h5 { background: none repeat scroll 0 0 #f7f7f7; border-radius: 4px; color: #222222; display: inline-block; font-family: 'LatoRegular',sans-serif; font-size: 12px; line-height: 20px; margin-bottom: 5px; padding: 10px 22px; text-transform: uppercase; transition: all 0.3s ease-in-out 0s; } #filters ul li a:hover h5, #filters ul li a.active h5 { background: #7cc576; color: #fff; text-decoration: none; } .section-title h2 { color: #222222; font-family: DosisBold; font-size: 64px; font-weight: normal; letter-spacing: -1px; margin: 0 15px 15px; text-align: center; text-transform: uppercase; } .section-divider { display: block; width: 250px; height: 10px; background: #dddd00; margin: 0 auto; } .section-title span{ display:block; color: #888888; font-family: 'Open Sans',sans-serif; font-size: 16px; font-weight: 400; margin: 0 0 60px; text-align: center; } .section-page p { font-size: 32px; line-height: 42px; } .section-page h3 { color: #222222; font-size: 48px; font-weight: normal; letter-spacing: -1px; margin: 25px 15px 25px; text-transform: uppercase; } /* Portfolio Items */ #portfolio-wrap { position: relative; padding: 0; width: 100%; margin: 0 auto; display: block; } #portfolio-wrap .one-four { margin: 0!important; line-height:0; width: 25%; padding: 0; position:relative; } .portfolio-item { padding: 0; position: relative; overflow: hidden; } .portfolio-item .portfolio-image { overflow: hidden; display: block; position: relative; } .portfolio-item .portfolio-image img { width: 100%; height: auto; } .portfolio-item:hover .project-overlay { opacity:1; transition:all 0.4s ease 0s; -moz-transition:all 0.4s ease 0s; -webkit-transition:all 0.4s ease 0s; -ms-transition:all 0.4s ease 0s; -o-transition:all 0.4s ease 0s; } .project-overlay { width:100%; height:100%; position:absolute; top:0; left:0; opacity:0; transition:all 0.3s ease 0s; -moz-transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; -o-transition:all 0.3s ease 0s; cursor:pointer; } .open-project-link { width:100%; height:100%; position:absolute; z-index:100; } .project-overlay:hover { background:rgba(255, 255, 255, 0.8); } .project-info { position:absolute; height:100px; width:100%; top:50%; margin-top:-50px; text-align:center; } .project-name { color:#222222; text-transform:uppercase; margin-top:25px; font-family:DosisBold; opacity:0; font-size:18px; transition:all 0.2s ease 0s; -moz-transition:all 0.2s ease 0s; -webkit-transition:all 0.2s ease 0s; -ms-transition:all 0.2s ease 0s; -o-transition:all 0.2s ease 0s; position:relative; z-index:10; } .portfolio-item:hover .project-name { opacity:1; -webkit-transition: opacity .1s .2s; -moz-transition: opacity .1s .2s; -ms-transition: opacity .1s .2s; -o-transition: opacity .1s .2s; transition: opacity .1s .2s; } .project-categories { font-size:14px; color:#000; opacity:0; margin-top:0px; transition:all 0.2s ease 0s; -moz-transition:all 0.2s ease 0s; -webkit-transition:all 0.2s ease 0s; -ms-transition:all 0.2s ease 0s; -o-transition:all 0.2s ease 0s; } .portfolio-item:hover .project-categories { opacity:0.5; -webkit-transition: opacity .1s .2s; -moz-transition: opacity .1s .2s; -ms-transition: opacity .1s .2s; -o-transition: opacity .1s .2s; transition: opacity .1s .2s; } .zoom-icon { left: 50%; margin-left:-20px; position:inherit; width:40px; height:40px; margin-top:40px; opacity:0; background:url(images/zoom.png); background-size:40px 40px; transition:all 0.3s ease 0.1s; -moz-transition:all 0.3s ease 0.2s; -webkit-transition:all 0.3s ease 0.2s; -ms-transition:all 0.3s ease 0.2s; -o-transition:all 0.3s ease 0.2s; } .portfolio-item:hover .zoom-icon { opacity:1; margin-top:0px; -webkit-transition: opacity .3s .2s, margin-top .3s .2s; -moz-transition: opacity .3s .2s, margin-top .3s .2s; -ms-transition: opacity .3s .2s, margin-top .3s .2s; -o-transition: opacity .3s .2s, margin-top .3s .2s; transition: opacity .3s .2s, margin-top .3s .2s; } /* Portfolio Isotope Transitions */ .isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; } .isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; } .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } /* Portfolio Expander */ #project-page-holder { display: none; background-color:#FFF; } #project-page-button-fullscreen { height: auto; z-index:100; position: absolute; right:30px; top:30px; } #project-page-button-fullscreen li { display:inline-block; font-size:30px; } #project-page-button-fullscreen li a { background:url(images/close.png) no-repeat #fff; background-size:50px 50px; width:50px; height:50px; display:block; border-radius:50px; opacity:0.5; } #project-page-button-fullscreen li a:hover { opacity:1; } #project-page-button { text-align:center; margin-bottom:20px; height: auto; position: relative; z-index:100; } #project-page-button li { display:inline-block; margin:60px 10px 0px 10px; font-size:30px; } #project-page-data { margin-bottom: 0px; } .project-section-title { text-align:center; margin-bottom:40px; } .project-section-title h1 { margin-bottom:5px!important; letter-spacing:1px; } .project-page { background-color:#FFF; width:100%; height:auto; left:0; padding-bottom:40px; } /* Portfolio Normal Expander Project Slider */ .project-image-slider .bx-wrapper .bx-next { background: url("images/project_slider_right.png") no-repeat; background-size:35px 65px; opacity:0.3; right:-90px; } .project-image-slider .bx-wrapper .bx-prev { background: url("images/project_slider_left.png") no-repeat ; background-size:35px 65px; opacity:0.3; left:-90px; } .project-image-slider .bx-wrapper .bx-next:hover, .project-image-slider .bx-wrapper .bx-prev:hover { opacity:1; background-position:0 } .project-image-slider .bx-wrapper .bx-controls-direction a { height: 65px; margin-top: -33px; outline: 0 none; position: absolute; text-indent: -9999px; top: 50%; width: 35px; z-index: 100; } /* Portfolio Normal Expander */ .project-description { margin-top:40px; margin-bottom:20px; width:100%; height:auto; } .small-border { height:2px; width:50px; background-color:#ddd; margin-bottom:15px; } .visit-project { width:100%; text-align:center; border-top:1px solid #ddd; margin-top:20px; padding:55px 0 20px 0; } .project-description h5 { color:#222222; text-transform:uppercase; margin-bottom:5px; } /* Portfolio FullScreen Expander */ #cycle-loader { height:32px; left:50%; margin:-8px 0 0 -8px; position:absolute; top:50%; width:32px; z-index:999; } #arrow_left { top:50%; height:60px; position:absolute; left:30px; width:32px; z-index:1000; margin-top:-30px; } #arrow_right { top:50%; height:60px; position:absolute; right:30px; width:32px; z-index:1000; margin-top:-30px; } #arrow_left:hover, #arrow_right:hover { margin-top:-28px; } #arrow_left:active, #arrow_right:active { margin-top:-28px; } div.mc-image { -webkit-transition: opacity 1s ease-in-out; -moz-transition: opacity 1s ease-in-out; -o-transition: opacity 1s ease-in-out; transition: opacity 1s ease-in-out; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position:center center; background-repeat:no-repeat; height:100%; overflow:hidden; width:100%; } .in-slide-content div.info-slide { background:#FFF url(images/info.png) no-repeat left bottom; background-size:46px 46px; position:absolute; top:30px; left:30px; width: 46px; height: 46px; margin: 0; display: block; text-indent: 10px; -moz-border-radius: 23px; -webkit-border-radius: 23px; border-radius: 23px; cursor: pointer; z-index:1000; -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=0.5); opacity: 0.5; -webkit-transition: all 0.3s ; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .in-slide-content div.info-slide:hover { width:200px; background:#FFF; position:absolute; bottom:40px; padding:10px 20px; text-indent: 0px; moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; z-index:1000; -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=1); opacity: 1; } .in-slide-content h2, .in-slide-content p{ padding: 0; margin: 0; font-size: 12px; line-height:24px; } .in-slide-content h2{ font-size:14px; color:#444; text-shadow:none; font-weight:normal; text-transform:uppercase; z-index:1001; position:relative; white-space: nowrap; } .info-slide p{ color:#aaa; font-size:13px; text-shadow:none; z-index:1001; position:relative; margin:0; font-weight:normal; white-space: nowrap; } .in-slide-content div.info-slide h2 { display:none; padding:10px 10px 0 10px; } .in-slide-content div.info-slide p { display:none; padding:0px 10px 10px 10px; } .in-slide-content div.info-slide:hover h2, .in-slide-content div.info-slide:hover p { display:inherit; padding:0; }