Team:Nevada/style.css

From 2014.igem.org

(Difference between revisions)
 
(2 intermediate revisions not shown)
Line 883: Line 883:
     text-align: left;
     text-align: left;
}
}
-
#home-section-wrapper img{
+
#home-section-wrapper img {
-
rotate: 0;
+
  position: absolute;
-
    position: relative;
+
  top: 61.5%;
-
  left: 50%;
+
  left: 49%;
-
  top: 50%;  
+
  transform: translate(-48.5%, -51%);
-
  margin-left: -25%;
+
-
  margin-top: -25%;
+
-
    z-index: 5;
+
-
height: 100%;
+
-
width: 100%;
+
}
}

Latest revision as of 20:15, 17 October 2014

/* Import Basic Files


*/

@import url(http://fonts.googleapis.com/css?family=Roboto+Slab:100,300,400,700); @import url(http://fonts.googleapis.com/css?family=Roboto:100,300,400,700); @import url(font-awesome.min.css); @import url(https://2014.igem.org/wiki/index.php?title=Team:Nevada/jquery.fancybox&action=raw&ctype=text/css); @import url(https://2014.igem.org/Team:Nevada/uikit.css?action=raw&ctype=text/css); @import url(https://2014.igem.org/Team:Nevada/jquery.sliderTabs.min.css?action=raw&ctype=text/css); @import url(https://2014.igem.org/Team:Nevada/owl.carousel.css?action=raw&ctype=text/css); @import url(https://2014.igem.org/Team:Nevada/owl.theme.css?action=raw&ctype=text/css); @import url(https://2014.igem.org/Team:Nevada/owl.transitions.css?action=raw&ctype=text/css); @import url(https://2014.igem.org/Team:Nevada/supersized/style.css?action=raw&ctype=text/css); @import url(http://fonts.googleapis.com/css?family=Nixie+One);

/* Template Name: APP ON Description: Responsive HTML5 / CSS3 Landing Page Template Version: 1.0 Author: Jthemes


Notes:

   Color-1:            #76889a
   Color-2:            #ff3131


1. General

   1.1 Main Styles
   1.2 Anchor
   1.3 Loader
   1.4 Section Title
   1.5 Section Description
   1.6 Short Section Title
   1.7 Short Section Description
   1.8 No Pad classes

2. Typography

   2.1 Headings

3. Sidebar Menu

   3.1 Wrapper
   3.2 Btn
   3.3 OverLayer
   3.4 Scroller
   3.5 Container
   3.6 List
   3.7 Items
   3.8 Anchors
   3.9 Info
   3.10 Logo

4. Home Section

   4.1 Wrapper
   4.2 Home Section Wrapper
   4.3 Slogan
   4.4 Description
   4.5 Buttons
   4.6 Home Feature Image
   4.7 Feature Box Style 1
       4.7.1 Main Typography
       4.7.2 Feature Box Style 1 ( Left )
           4.7.2.1 Wrapper
           4.7.2.2 Icon
           4.7.2.3 Title
           4.7.2.4 Description
       4.7.3 Feature Box Style 1 ( Right )
           4.7.3.1 Wrapper
           4.7.3.2 Icon
           4.7.3.3 Title
           4.7.3.4 Description

5. Feature Section

   5.1 Wrapper
   5.2 Feature Bix Style 2
       5.2.1 Wrapper
       5.2.2 Icon
       5.2.3 Title
       5.2.4 Description
   5.3 Lets See BTN

6. Arrows Section

   6.1 Wrapper
   6.2 Anchors
   6.3 Icons

7. How It Works Section

   7.1 Wrapper
   7.2 Tabs
       7.2.1 Tabs List Wrapper
       7.2.2 Tabs List
           7.2.2.1 Container
           7.2.2.2 Items
           7.2.2.3 Anchor
           7.2.2.4 Selected
   7.3 Content
   7.4 Arrows
       7.4.1 Right Arrow
       7.4.2 Left Arrow
   7.5 Feature Box
   7.6 Feature Image
   7.7 Feature Btns

8. Portfolio Section

   8.1 Wrapper
   8.2 OWL Slider
   8.3 Portfolio Item
       8.3.1 Wrapper
       8.3.2 Content
       8.3.3 Image
       8.3.4 Overlayer
       8.3.5 Anchor
       8.3.6 Hover

9. Portfolio Section

   9.1 Wrapper
   9.2 Magnify
       9.2.1 Wrapper
       9.2.2 Container
       9.2.3 Image

10. Ready Section

   10.1 Wrapper
   10.2 Mini Feature List
       10.2.1 Wrapper
       10.2.2 Items
       10.2.3 Icons
   10.3 Feature Btns
   10.4 Feature Image

11. Team Section

   11.1 Wrapper
   11.2 Slider
       11.2.1 Wrapper
       11.2.2 Member Thumbs
       11.2.3 Navigation
       11.2.4 Dots
       11.2.5 Selected
       11.2.6 Member Big Image
       11.2.7 Title Description
       11.2.8 Content Description
       11.2.9 Social Icons

13. Clients Section

   13.1 Wrapper
   13.2 Content
   13.3 Quote
   13.4 Name
   13.5 Image
   13.6 Arrows

14. Price Section

   14.1 Wrapper
   14.2 Price Table
       14.2.1 Wrapper
       14.2.2 Name
       14.2.3 Description
       14.2.4 Price
       14.2.5 Info
       14.2.6 Hover

15. Recent Posts Section

   15.1 Wrapper
   15.2 Mini Post
       15.2.1 Wrapper
       15.2.2 Image
       15.2.3 Title
       15.2.4 Date
       15.2.5 Content

16. Like Section

   16.1 Wrapper
   16.2 Buttons

17. Reach Section

   17.1 Wrapper
   17.2 Form
       17.2.1 Wrapper
       17.2.2 Textarea
       17.2.3 form-control
       17.2.4 Button
       17.2.5 error message
       17.2.6 Alert

18. Subscribe Section

   18.1 Wrapper
   18.2 Subscribe
       18.2.1 Wrapper
       18.2.2 Input
       18.2.3 Submit
       18.2.4 Success & Error

19. Footer Section

   19.1 Wrapper
   19.2 Social Icons
       19.2.1 List
       19.2.2 Iems

20. More APPS Section

   20.1 Wrapper

21. Blog

   21.1 Wrapper
   21.2 Home Section Wrapper
   21.3 Slogan
   21.4 Description
   21.5 Buttons

22. Posts RightSidebar

   22.1 Wrapper
   22.2 Post
       22.2.1 Wrapper
       22.2.2 Info
       22.2.3 Date
       22.2.4 Post Type
           22.2.4.1 Image
           22.2.4.2 Video
           22.2.4.3 Text
           22.2.4.4 Audio
       22.2.5 Data
           22.2.5.1 Wrapper
           22.2.5.2 Header
           22.2.5.3 Container
           22.2.5.4 Title
           22.2.5.5 Info

23. Sidbar

   23.1 Wrapper
   23.2 Widget
       23.2.1 Wrapper
       23.2.2 Widget Title
       23.2.3 Widget Content
       23.2.4 Search Widget
       23.2.5 Category Widget
       23.2.6 Popular Widget
       23.2.7 Flickr Widget
           23.2.7.1 Wrapper
           23.2.7.2 Flickr Feed
               23.2.7.2.1 Wrapper
               23.2.7.2.2 Items
               23.2.7.2.3 Image
               23.2.7.2.4 Anchor
       23.2.8 Tags Widget

24. Posts LeftSidebar 25. Single Post

   25.1 Post Comments
       25.1.1 Wrapper
       25.1.2 Title
       25.1.3 Comments
       25.1.4 Avatar
       25.1.5 Container
       25.1.6 Header
       25.1.7 Comment Title
       25.1.8 Date
       25.1.9 Content
       25.1.10 Replay
       25.1.11 Comment Form
           25.1.11.1 Wrapper
           25.1.11.2 Textarea
           25.1.11.3 form-control
           25.1.11.4 Button
   25.2 Related Posts
       25.2.1 Wrapper
       25.2.2 Title

26. Bootstrap 27. Responsive

  • /



/* ==========================================================================

  1. General

========================================================================== */ /* 1.1 Main Styles


*/

body {

   margin: 0;
   padding: 0;
   color: #9ea6a4;
   overflow-x: hidden;
   background-color: #ffffff;
   -webkit-text-size-adjust: 100%;
   font: 14px/24px 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/*

* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/

.browsehappy { margin: 0.2em 0; background-color: #cccccc; color: #000000; padding: 0.2em 0; } .container { overflow: hidden; }

/* 1.2 Anchor


*/

a { color: #76889a; } a, a > * {

   outline: none;
   cursor: pointer;
   text-decoration: none;

} a:focus, a:hover {

   outline: none;
   color: #ffffff;
   text-decoration: none;

}

/* 1.3 Loader


*/
  1. Loader {
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   height: 100%;
   position: fixed;
   z-index: 999999;
   background-color: #002147;

}

  1. circle {
   top: 50%;
   left: 50%;

width: 50px; height: 50px;

   opacity: 0.9;

margin-top: -25px;

   margin-left: -25px;
   position: absolute;
   background-color: rgba(0, 0, 0, 0);
   -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
        -o-border-radius: 50px;
           border-radius: 50px;
   -webkit-box-shadow: 0 0 35px #ffffff;
      -moz-box-shadow: 0 0 35px #ffffff;
        -o-box-shadow: 0 0 35px #ffffff;
           box-shadow: 0 0 35px #ffffff;
   -webkit-border: 5px solid #ffffff;
      -moz-border: 5px solid #ffffff;
        -o-border: 5px solid #ffffff;
           border: 5px solid #ffffff;
   -webkit-border-left: 5px solid rgba(0, 0, 0, 0);
      -moz-border-left: 5px solid rgba(0, 0, 0, 0);
        -o-border-left: 5px solid rgba(0, 0, 0, 0);
           border-left: 5px solid rgba(0, 0, 0, 0);

-webkit-border-right: 5px solid rgba(0, 0, 0, 0);

      -moz-border-right: 5px solid rgba(0, 0, 0, 0);
        -o-border-right: 5px solid rgba(0, 0, 0, 0);
           border-right: 5px solid rgba(0, 0, 0, 0);
   -webkit-animation: spinPulse 1s infinite ease-in-out;

-moz-animation: spinPulse 1s infinite ease-in-out;

       -ms-animation: spinPulse 1s infinite ease-in-out;
        -o-animation: spinPulse 1s infinite ease-in-out;
           animation: spinPulse 1s infinite ease-in-out;

}

  1. circle1 {
   top: 50%;
   left: 50%;

width: 30px; height: 30px;

   opacity: 0.9;

margin-top: -15px;

   margin-left: -15px;
   position: absolute;
   background-color: rgba(0, 0, 0, 0);
   -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
        -o-border-radius: 50px;
           border-radius: 50px;
   -webkit-border: 5px solid #ffffff;
      -moz-border: 5px solid #ffffff;
        -o-border: 5px solid #ffffff;
           border: 5px solid #ffffff;
   -webkit-border-left: 5px solid rgba(0, 0, 0, 0);
      -moz-border-left: 5px solid rgba(0, 0, 0, 0);
        -o-border-left: 5px solid rgba(0, 0, 0, 0);
           border-left: 5px solid rgba(0, 0, 0, 0);

-webkit-border-right: 5px solid rgba(0, 0, 0, 0);

      -moz-border-right: 5px solid rgba(0, 0, 0, 0);
        -o-border-right: 5px solid rgba(0, 0, 0, 0);
           border-right: 5px solid rgba(0, 0, 0, 0);
   -webkit-box-shadow: 0 0 15px #ffffff;
      -moz-box-shadow: 0 0 15px #ffffff;
        -o-box-shadow: 0 0 15px #ffffff;
           box-shadow: 0 0 15px #ffffff;

-webkit-animation: spinoffPulse 1s infinite linear;

      -moz-animation: spinoffPulse 1s infinite linear;
       -ms-animation: spinoffPulse 1s infinite linear;
        -o-animation: spinoffPulse 1s infinite linear;
           animation: spinoffPulse 1s infinite linear;

}

/* 1.4 Section Title


*/

.section-title {

   width: 100%;
   overflow: hidden;
   text-align: center;
   margin-bottom: 16px;

} .section-title h1 {

   font-size: 60px;
   line-height: 1.2;
   font-weight: 100;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

} .section-title_works_section h1 {

   font-size: 60px;

text-align: center;

   line-height: 1.2;
   font-weight: 100;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

z-index:5; }

/* 1.5 Section Description


*/

.section-desc {

   width: 85%;
   text-align: center;
   margin: 0 auto 65px;

} .section-desc p {

   color: #9ea6a4;
   font-size: 18px;
   margin-bottom: 0;
   font-weight: 300;

}

/* 1.6 Short Section Title


*/

.section-short-title {

   width: 100%;
   overflow: hidden;
   text-align: left;
   margin-bottom: 16px;

} .section-short-title h1 {

   font-weight: 100;
   line-height: 1.22;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 1.7 Short Section Description


*/

.section-short-desc {

   width: 100%;
   text-align: left;
   margin: 0 auto 30px;

} .section-short-desc p {

   font-size: 18px;
   font-weight: 300;
   margin-bottom: 0;

}

/* 1.8 No Pad classes


*/

.no-pad-left { padding-left: 0; } .no-pad-right { padding-right: 0; }



/* ==========================================================================

  2. Typography

========================================================================== */ /* 2.1 Headings


*/

h1, h2, h3, h4, h5, { margin: 0; padding: 0; color: #002147; line-height: 1.2; font-weight: normal; font-family:'Times New Roman' 'Georgia';

} h6 { margin: 0; padding: 0; color: #FFF; line-height: 1.2; font-weight: normal; font-family:'Times New Roman' 'Georgia'; }

h1 { font-size: 30px; } h2 { font-size: 24px; } h3 { font-size: 20px; } h4 { font-size: 18px; } h5 { font-size: 14px; } h6 { font-size: 12px; }


h1_1{ font: normal 200px/ 100px 'Nixie One', 'Helvetica', 'Arial'; color: #EEDDE0; text-shadow: 0 0 30px #EC637B, 0 0 10px rgba(230, 161, 173, 0.41), 0 0 100px #E6A1AD, 0 0 500px #F36780, 5px 9px 5px rgba(0, 0, 0, 0.5); } h1_1.off{ color: rgba(46, 46, 46, 0.61); text-shadow: 7px 7px 5px rgba(0, 0, 0, 0.5);}

h1_1 { font-size: 85px; } h2_1 { font-size: 24px; } h3_1 { font-size: 20px; } h4_1 { font-size: 18px; } h5_1 { font-size: 14px; } h6_1 { font-size: 12px; }

h1_2{ margin: 0; padding: 0; color: #002147; line-height: 1.2; font-weight: normal; font-family:'Times New Roman' 'Georgia';

}

h1_2{ font-size: 100px;}


p { margin: 0 0 10px; font-family:"Myriad Pro"; }

b, strong { font-weight: 700; }


/* ==========================================================================

  3. Sidebar Menu

========================================================================== */ /* 3.1 Wrapper


*/
  1. sidebar-wrapper {
   top: 0;
   height: 100%;
   left: -245px;
   width: 245px;
   z-index: 99999;
   position: fixed;
   background-color: #8a8d8f;
   -webkit-transition: all 0.8s ease 0s;
      -moz-transition: all 0.8s ease 0s;
       -ms-transition: all 0.8s ease 0s;
        -o-transition: all 0.8s ease 0s;
           transition: all 0.8s ease 0s;

}

  1. sidebar-wrapper-igem {
   top: 0;
   height: 100%;
   left: -245px;
   width: 245px;
   z-index: 99999;
   position: fixed;
   background-color: #8a8d8f;
   -webkit-transition: all 0.8s ease 0s;
      -moz-transition: all 0.8s ease 0s;
       -ms-transition: all 0.8s ease 0s;
        -o-transition: all 0.8s ease 0s;
           transition: all 0.8s ease 0s;

}

/* 3.2 Btn


*/

.sidebar-btn {

   top: 40px;
   width: 80px;
   height: 80px;
   right: -120px;
   color: #ffffff;
   z-index: 99999;
   font-size: 50px;
   line-height: 80px;
   text-align: center;
   position: absolute;
   background-color: #222222;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

} .sidebar-igem { right: 125px; top:15px;

   width: 40px;
   height: 40px;
   z-index: 99997;
   font-size: 20px;
   line-height: 40px;
   position: fixed;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

} .sidebar-btn:hover { background-color: #111111; }

  1. sidebar-wrapper.openclose { left: 0; }

/* 3.3 OverLayer


*/
  1. sidebar-overlayer {
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   opacity: 0.3;
   display: none;
   z-index: 99998;
   position: fixed;
   background-color: rgba(0, 0, 0, 0.5);

}

  1. sidebar-overlayer.openclose { display: block; }

/* 3.4 Scroller


*/
  1. sidebar-scroller {
   width: 245px;
   height: 100%;
   overflow-x: hidden;
   position: relative;

}

/* 3.5 Container


*/
  1. sidebar-container {

height: 100%; width: 400px; position: absolute; overflow-y: scroll; overflow-x: hidden; left: 2px; }

/* 3.6 List


*/
  1. sidebar-container ul {
   width: 245px;
   margin: 0 0 35px;
   list-style: none;
   padding: 0 0 20px;
   position: relative;
   -webkit-overflow-scrolling: touch;

}

  1. sidebar-container ul:after {
   left: 0;
   bottom: 0;
   width: 60%;
   z-index: 1;
   height: 1px;
   content: ;
   margin-left: 30px;
   position: absolute;
   background-color: #ffffff;

}

/* 3.7 Items


*/
  1. sidebar-container ul li {
   width: 100%;
   height: 60px;
   display: block;
   text-align: left;
   line-height: 60px;

}

/* 3.8 Anchors


*/
  1. sidebar-container ul li a {
   display: block;
   color: #ffffff;
   font-size: 18px;
   font-weight: 400;
   line-height: 20px;
   padding: 0 0 0 30px;
   letter-spacing: 1px;
   text-transform: uppercase;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

  1. sidebar-container ul li.active a,
  2. sidebar-container ul li a:focus,
  3. sidebar-container ul li a:hover {
   background-color: rgba(0, 0, 0, 0.5);

}

/* 3.9 Info


*/
  1. sidebar-container .info {
   width: 245px;
   display: block;
   overflow: hidden;

}

  1. sidebar-container .info p {
   margin: 0;
   color: #ffffff;
   padding-left: 30px;

}

  1. sidebar-container .info p:last-child { margin-bottom: 35px; }

/* 3.10 Logo


*/

.logo {

   width: 245px;
   margin: 50px 0 20px;

} .logo img { width: 100%; }



/* ==========================================================================

  4. Home Section

========================================================================== */ /* 4.1 Wrapper


*/
  1. home-section {
   margin: 0;
   padding: 0;
   width: 100%;
   overflow: hidden;

}

/* 4.2 Home Section Wrapper


*/
  1. home-section-wrapper {
   z-index: 1;
   width: 100%;
   position: relative;
   padding: 120px 0 0 0;
   background-color: #222222;

}

  1. home-section-wrapper:after {
   top: 0;
   left: 0;
   z-index: -1;
   content: ;
   width: 100%;
   height: 100%;
   opacity: 0.4;
   position: absolute;
   background-color: #222222;

}

/* 4.3 Slogan


*/
  1. home-section-wrapper .slogan {
   width: 100%;
   overflow: hidden;
   text-align: center;
   margin-bottom: 0px;

}

  1. home-section-wrapper .slogan h1 {
   color: #ffffff;
   font-size: 48px;
   font-weight: 100;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/*4.31 home section with neon lights*/

  1. home-section-wrapper .container_neon_box {
 position: relative;
 width: 800px;
 margin: 2.5% auto;
 text-align: center;

}

  1. home-section-wrapper .border_neon_sign {
 width: 910px;
 height: 150px;
 background-color: #222222;
 border: 3px solid #0cd808;
 position: absolute;
 top: 28px;
 border-radius: 10px;
 left: 50%;
 margin-left: -448px;
 box-shadow: 0 0 1px #b3ff51, 0 0 2px #b3ff51, 0 0 6px #b3ff51, 0 0 12px #b3ff51, inset 0 0 1px #b3ff51, inset 0 0 2px #b3ff51, inset 0 0 6px #b3ff51, inset 0 0 12px #b3ff51;
 z-index: -9990;

}

  1. home-section-wrapper .blocker-1_neon_sign {
 width: 438px;
 height: 20px;
 position: absolute;
 top: 20px;
 left: 184px;
 background-color: #222222;
 z-index: -9990;
 box-shadow: 0 0 10px #222222, 0 0 5px #222222, 0 0 2px #222222, 0 0 1px #222222;

}

  1. home-section-wrapper .blocker-2_neon_sign {
 width: 744px;
 height: 85px;
 position: absolute;
 bottom: 2px;
 left: 33px;
 background-color: #222222;
 z-index: -9990;
 box-shadow: 0 0 10px #222222, 0 0 5px #222222, 0 0 2px #222222, 0 0 1px #222222;

}

  1. home-section-wrapper .team_title_neon_sign {
 margin: 7px 0 18px;
 padding: 0;
 font-family: 'Quicksand', sans-serif;
 font-size: 70px;
 letter-spacing: 5px;
 color: #f90000;
 text-shadow: 0 0 1px #ff1919, 0 0 2px #ff1919, 0 0 6px #ff1919, 0 0 12px #ff1919;
 -webkit-text-stroke-width: 1px;
 -webkit-text-stroke-color: #db0808;

}

  1. home-section-wrapper .team_neon_sign {
 margin: 0;
 padding: 0;
 line-height: 60px;
 font-family: 'League Script', cursive;
 font-size: 52px;
 color: #14a5ff;
 text-shadow: 0 0 1px #22cef9, 0 0 2px #22cef9, 0 0 6px #22cef9, 0 0 12px #22cef9;

}

  1. home-section-wrapper .explination_neon_sign {
 margin: 0;
 padding: 0;
 line-height: 95px;
  font: 400 130px/0.8 'Cookie', Helvetica, sans-serif;
   font-weight: normal;
   font-style: normal;
 font-size: 50px;
 color: #14a5ff;

}

/* 4.4 Description


*/
  1. home-section-wrapper .desc {
   width: 75%;
   text-align: center;
   margin: 0 auto 30px;

}

  1. home-section-wrapper .desc p {
   color: #ffffff;
   font-size: 15px;
   font-weight: 300;

}

  1. home-section-wrapper .desc p:last-child { margin-bottom: 0; }

/* 4.5 Buttons


*/
  1. home-section-wrapper .buttons {
   width: 100%;
   text-align: center;
   margin-bottom: 20px;

}

  1. home-section-wrapper .buttons a {
   color: #ffffff;
   font-size: 18px;
   font-weight: 100;
   line-height: 35px;
   margin: 0 30px 30px 0;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

  1. home-section-wrapper .buttons a:last-child { margin-right: 0; }
  2. home-section-wrapper .buttons a i {
   float: left;
   font-size: 35px;
   line-height: 35px;
   margin-right: 10px;

}

/* 4.6 Home Feature Image


*/
  1. home-section-wrapper .feature-home-image {
   width: 100%;
   max-height: 400px;
   text-align: left;

}

  1. home-section-wrapper img {
 position: absolute;
 top: 61.5%;
 left: 49%;
 transform: translate(-48.5%, -51%);

}

  1. lightbulb_dna{

height: 100%; width: 100%; z-index: 1; position:absolute; }

  1. home-section-wrapper img.igem {

rotate: 0;

   position: absolute;
   left: 38% ;
   top: 0%;

bottom: 0px;

   z-index: 1;

} .graph__wrapper_graph_1 {

 width: 400px;
 margin: 5px auto;
 position: relative;

} .graph__wrapper_graph_1 svg {

 position: absolute;
 margin: 82px 0px 0px -150px;

} .coordinates_graph_1 {

 position: absolute;
 counter-reset: line 2;

} .coordinates_graph_1 span {

 display: inline-block;
 border-bottom: 1px solid #3a3a3a;
 height: 84px;
 width: 350px;

} .coordinates_graph_1 span:before {

 counter-increment: line -1;
 content: counter(line);
 display: inline-block;
 color: #4a4a4a;
 margin: 72px 0px 0px -355px;

} .path_graph_1 {

 stroke-dasharray: 1000;
 stroke-dashoffset: 1000;
 -webkit-animation: dash 1.5s ease-in forwards;
         animation: dash 1.5s ease-in forwards;
 -webkit-animation-iteration-count: infinite;
         animation-iteration-count: infinite;
 -webkit-animation-delay: 1s;
         animation-delay: 1s;

} .description_graph_1{

 font-family: "Roboto";
 color:lighten(@darkgrey, 50%);
 text-align:center;
 margin: 0px 0px 0px 0px;
 font-size:16px;

} @-webkit-keyframes dash {

 to {
   stroke-dashoffset: 0;
 }

} @keyframes dash {

 to {
   stroke-dashoffset: 0;
 }

}

  1. degradation_protein_container {
 min-width: 310px; 
 height: 600px; 
 margin: 0 auto; 

} /* 4.7 Feature Box Style 1


*/

/* 4.7.1 Main Typography


*/

.feature-box-style-1 .feature-title h4 {

   color: #ffffff;
   font-weight: 200;

} .feature-box-style-1 .feature-desc p {

   color: #ffffff;
   font-size: 15px;
   font-weight: 100;

} .feature-box-style-1 .feature-desc p:last-child { margin-bottom: 0; }

/* 4.7.2 Feature Box Style 1 ( Left )


*/

/* 4.7.2.1 Wrapper


*/

.left .feature-box-style-1 {

   width: 100%;
   overflow: hidden;
   text-align: right;
   margin-bottom: 0px;

} .left .feature-box-style-1:first-child { margin-top: 50px; } .left .feature-box-style-1:last-child { margin-bottom: 0px; }

/* 4.7.2.2 Icon


*/

.left .feature-box-style-1 .feature-icon {

   float: right;
   color: #ffffff;
   font-size: 28px;

}

/* 4.7.2.3 Title


*/

.left .feature-box-style-1 .feature-title {

   width: 100%;
   padding-right: 45px;
   margin-bottom: 14px;

}

/* 4.7.2.4 Description


*/

.left .feature-box-style-1 .feature-desc { padding-right: 90px; }

/* 4.7.3 Feature Box Style 1 ( Right )


*/

/* 4.7.3.1 Wrapper


*/

.right .feature-box-style-1 {

   width: 100%;
   overflow: hidden;
   text-align: left;
   margin-bottom: px;

} .right .feature-box-style-1:first-child { margin-top: 50px; } .right .feature-box-style-1:last-child { margin-bottom: 0px; }

/* 4.7.3.2 Icon


*/

.right .feature-box-style-1 .feature-icon {

   float: left;
   color: #ffffff;
   font-size: 28px;

}

/* 4.7.3.3 Title


*/

.right .feature-box-style-1 .feature-title {

   width: 100%;
   padding-left: 45px;
   margin-bottom: 14px;

}

/* 4.7.3.4 Description


*/

.right .feature-box-style-1 .feature-desc { padding-left: 45px; }



/* ==========================================================================

  5. Feature Section

========================================================================== */ /* 5.1 Wrapper


*/
  1. feature-section {
   margin: 0;
   width: 100%;
   padding: 55px 0 70px;
   background-color: #ffffff;

}

/* 5.2 Feature Bix Style 2


*/

/* 5.2.1 Wrapper


*/

.feature-box-style-2 {

   width: 100%;
   overflow: hidden;
   margin-bottom: 50px;

}

/* 5.2.2 Icon


*/

.feature-box-style-2 .feature-icon {

   float: left;
   color: #ff3131;
   font-size: 30px;

}

/* 5.2.3 Title


*/

.feature-box-style-2 .feature-title {

   width: 100%;
   padding-left: 45px;
   margin-bottom: 8px;

} .feature-box-style-2 .feature-title h4 {

   font-weight: 700;
   line-height: 30px;

}

/* 5.2.4 Description


*/

.feature-box-style-2 .feature-desc {

   width: 100%;
   padding-left: 45px;

} .feature-box-style-2 .feature-desc p {

   font-size: 14px;
   font-weight: 300;

} .feature-box-style-2 .feature-desc p:last-child { margin-bottom: 0; }

/* 5.3 Lets See BTN


*/

.lets-see-btn {

   width: 100%;
   overflow: hidden;
   text-align: center;

}



/* ==========================================================================

  6. Arrows Section

========================================================================== */ /* 6.1 Wrapper


*/

.arrows-section {

   width: 100%;
   height: 22px;
   z-index: 999;
   margin-top: -21px;
   position: relative;
   text-align: center;

} .arrows-section:after { left: 0; top: 20px; width: 100%; height: 1px; content: ; z-index: -1; position: absolute; background-color: #FFFFFF; }

/* 6.2 Anchors


*/

.arrows-section a {

   width: 41px;
   height: 41px;
   color: #c8cfd7;
   overflow: hidden;
   line-height: 39px;
   margin: 0 5px 0 0;
   text-align: center;
   display: inline-block;
   background-color: #FFFFFF;
   -webkit-border-radius: 50px;
      -moz-border-radius: 50px;
        -o-border-radius: 50px;
           border-radius: 50px;
   -webkit-border: 1px solid #c8cfd7;
      -moz-border: 1px solid #c8cfd7;
        -o-border: 1px solid #c8cfd7;
           border: 1px solid #c8cfd7;

} .arrows-section a:last-child { margin-right: 0; }

/* 6.3 Icons


*/

.arrows-section a i {

   font-size: 30px;
   line-height: 31px;

} .arrows-section a i.fa-angle-up { line-height: 31px; }


/* ==========================================================================

  7. How It Works Section

========================================================================== */ /* 7.1 Wrapper


*/
  1. works-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 40px;
   background-color: #ffffff;

}

/* 7.2 Tabs


*/

/* 7.2.1 Tabs List Wrapper


*/

.ui-slider-tabs-list-wrapper {

   margin: 0;
   position: relative;
   font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;

} .ui-slider-tabs-list-wrapper:after {

   left: 0;
   top: 1px;
   width: 0;
   height: 0;
   z-index: 1;
   color: #76889a;
   font-size: 30px;
   text-align: left;
   content: '\f0d9';
   position: absolute;
   font-family: 'FontAwesome';

} .ui-slider-tabs-list-wrapper:before {

   top: 1px;
   width: 0;
   height: 0;
   right: 11px;
   z-index: 999;
   color: #76889a;
   font-size: 30px;
   content: '\f0da';
   position: absolute;
   font-family: 'FontAwesome';

}

/* 7.2.2 Tabs List


*/

/* 7.2.2.1 Container


*/

.ui-slider-tabs-list-container {

   z-index: 1;
   position: relative;

} .ui-slider-tabs-list-container:after {

   left: 0;
   top: 11px;
   content: ;
   z-index: -2;
   width: 100%;
   height: 2px;
   position: absolute;
   background-color: #F2F2FF;

}

/* 7.2.2.2 Items


*/

.ui-slider-tabs-list li {

   float: left;
   width: 285px;
   text-align: center;
   position: relative;
   background: transparent;
   height: 70px !important;
   display: block !important;
   -webkit-border: none;
      -moz-border: none;
        -o-border: none;
           border: none;

} .ui-slider-tabs-list li:after {

   top: 1px;
   left: 50%;
   width: 20px;
   z-index: -1;
   height: 20px;
   color: #f5f5f5;
   font-size: 23px;
   content: '\f111';
   margin-left: -10px;
   position: absolute;
   font-family: 'FontAwesome';

} .ui-slider-tabs-list li:first-of-type {

   -webkit-border: none;
      -moz-border: none;
        -o-border: none;
           border: none;

}

/* 7.2.2.3 Anchor


*/

.ui-slider-tabs-list li a {

   width: 285px;
   line-height: 40px;
   padding: 30px 0 0 0;
   height: 70px !important;

}

/* 7.2.2.4 Selected


*/

.ui-slider-tabs-list li.selected { background: transparent; } .ui-slider-tabs-list li.selected:after {

   top: 1px;
   left: 50%;
   z-index: -1;
   width: 20px;
   height: 20px;
   color: #76889a;
   font-size: 23px;
   content: '\f192';
   position: absolute;
   margin-left: -10px;
   font-family: 'FontAwesome';
   background-color: #ffffff;

} .ui-slider-tabs-list li.selected a, .ui-slider-tabs-list li a:hover, .ui-slider-tabs-list li a {

   color: #76889a;
   font-size: 14px;
   font-weight: 400;

}


/* 7.3 Content


*/

.ui-slider-tab-content { padding: 10px 0 0; } .ui-slider-tabs-content-container {

   z-index: 999;
   margin-top: 20px;
   overflow: visible;
   -webkit-border: none;
      -moz-border: none;
        -o-border: none;
           border: none;

}

/* 7.4 Arrows


*/

/* 7.4.1 Right Arrow


*/

.ui-slider-tabs-rightPanelArrow {

   right: 0;
   width: 0;
   height: 0;
   opacity: 1;
   cursor: pointer;
   text-align: right;
   position: absolute;
   top: -89px !important;
   background-image: none;

} .ui-slider-tabs-rightPanelArrow:after {

   top: 0;
   right: 0;
   opacity: 1;
   color: #76889a;
   font-size: 30px;
   content: '\f0da';
   position: absolute;
   font-family: 'FontAwesome';

}

/* 7.4.2 Left Arrow


*/

.ui-slider-tabs-leftPanelArrow {

   width: 0;
   height: 0;
   left: 11px;
   opacity: 1;
   cursor: pointer;
   text-align: left;
   position: absolute;
   top: -89px !important;
   background-image: none;

} .ui-slider-tabs-leftPanelArrow:after {

   top: 0;
   right: 0;
   opacity: 1;
   color: #76889a;
   font-size: 30px;
   content: '\f0d9';
   position: absolute;
   font-family: 'FontAwesome';

}

/* 7.5 Feature Box


*/
  1. WorksTabs .feature-box-style-2 { margin-bottom: 30px; }

/* 7.6 Feature Image


*/
  1. WorksTabs .feature-image {
   width: 100%;
   overflow: hidden;
   margin-bottom: 30px;

}

  1. WorksTabs .feature-image img { width: 100%; }

/* 7.7 Feature Btns


*/
  1. WorksTabs .feature-btns {
   width: 100%;
   text-align: left;
   margin-bottom: 30px;

}

  1. WorksTabs .feature-btns a {
   margin-top: 20px;
   margin-right: 5px;

}

  1. WorksTabs .feature-btns a:last-child { margin-right: 0; }



/* ==========================================================================

  8. Portfolio Section

========================================================================== */ /* 8.1 Wrapper


*/
  1. portfolio-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 60px;
   background-color: #ffffff;

}

/* 8.2 OWL Slider


*/

.owl-wrapper-outer { z-index: 2; } .owl-theme .owl-controls .owl-page span { opacity: 1;

   width: 18px;
   height: 18px;

background: #76889a; } .owl-theme .owl-controls .owl-page.active span {

   position: relative;
   background-color: #ffffff;

} .owl-theme .owl-controls .owl-page.active span:after {

   top: -2px;
   left: -1px;
   color: #76889a;
   font-size: 23px;
   content: '\f192';
   position: absolute;
   text-align: center;
   font-family: 'FontAwesome';

}

/* 8.3 Portfolio Item


*/

/* 8.3.1 Wrapper


*/

.portfolio-item {

   margin: 0 auto;
   padding: 0 15px;
   max-width: 290px;
   overflow: hidden;
   position: relative;

}

/* 8.3.2 Content


*/

.portfolio-content {

   width: 100%;
   padding: 10px;
   position: relative;
   background-color: #ffffff;

-webkit-border-radius: 6px;

      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

/* 8.3.3 Image


*/

.portfolio-content img {

   width: 100%;

-webkit-border-radius: 6px;

      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

/* 8.3.4 Overlayer


*/

.portfolio-overlayer {

   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   line-height: 100%;
   text-align: center;
   position: absolute;
   background-color: transparent;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

/* 8.3.5 Anchor


*/

.portfolio-overlayer a {

   top: 0;
   left: 0;
   z-index: 0;
   opacity: 0;
   width: 100%;
   height: 100%;
   display: block;
   position: absolute;
   -webkit-border-radius: 8px;
      -moz-border-radius: 8px;
        -o-border-radius: 8px;
           border-radius: 8px;
   -webkit-border: 2px solid #c8cfd7;
      -moz-border: 2px solid #c8cfd7;
        -o-border: 2px solid #c8cfd7;
           border: 2px solid #c8cfd7;

}

/* 8.3.6 Hover


*/

.portfolio-content:hover .portfolio-overlayer a { opacity: 1; }



/* ==========================================================================

  9. Portfolio Section

========================================================================== */ /* 9.1 Wrapper


*/
  1. closer-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 70px;
   background-color: #ffffff;

}

/* 9.2 Magnify


*/

/* 9.2.1 Wrapper


*/
  1. magnify-wrapper {
   width: 100%;

height: auto; margin: 0 auto;

   max-width: 770px;
   position: relative;

}

/* 9.2.2 Container


*/
  1. magnify-container {

float: left;

   width: 100%;

height: auto;

   position: relative;

}

/* 9.2.3 Image


*/
  1. magnify-container img { width: 100%; }



/* ==========================================================================

  10. Ready Section

========================================================================== */ /* 10.1 Wrapper


*/
  1. ready-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 0;
   background-color: #ffffff;

}

/* 10.2 Mini Feature List


*/

/* 10.2.1 Wrapper


*/

ul.mini-feature-list {

   padding: 0;
   overflow: hidden;
   list-style: none;
   margin: 0 0 15px 0;

}

/* 10.2.2 Items


*/

ul.mini-feature-list li {

   display: block;
   color: #76889a;
   font-size: 18px;
   font-weight: 300;
   margin-bottom: 15px;

}

/* 10.2.3 Icons


*/

ul.mini-feature-list li i {

   color: #76889a;
   margin-right: 10px;

}

/* 10.3 Feature Btns


*/
  1. ready-section .feature-btns {
   width: 100%;
   text-align: left;
   margin-bottom: 30px;

}

  1. ready-section .feature-btns a {
   margin-top: 20px;
   margin-right: 5px;

}

  1. ready-section .feature-btns a:last-child { margin-right: 0; }

/* 10.4 Feature Image


*/
  1. ready-section .feature-image {
   width: 100%;
   max-height: 785px;
   text-align: center;

}

  1. ready-section .feature-image img {
   width: 100%;
   max-width: 400px;

}



/* ==========================================================================/* 10.5 UNR Line


*/
.subheader-inner{
 border-top: 1px solid #ffffff;
 border-color: rgba(255, 255, 255, 0.3);
 max-width: 650px;
 margin: 0 auto;
 padding-top: 1em;

}


/* ==========================================================================

  11. Team Section

========================================================================== */ /* 11.1 Wrapper


*/
  1. team-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 0;
   background-color: #ffffff;

}

/* 11.2 Slider


*/

/* 11.2.1 Wrapper


*/
  1. team-section .ui-slider-tabs-content-container { margin-top: 0; }
  2. team-section .ui-slider-tab-content { padding: 0; }
  3. team-section .ui-slider-tabs-list-wrapper:after,
  4. team-section .ui-slider-tabs-list-wrapper:before,
  5. team-section .ui-slider-tabs-list-container:after,
  6. team-section .ui-slider-tabs-list li:after {
   display: none;

}

/* 11.2.2 Member Thumbs


*/
  1. team-section .ui-slider-tabs-list li {
   float: left;
   width: 170px;
   margin-left: 30px;
   text-align: center;
   position: relative;
   background: transparent;
   height: 170px !important;
   display: block !important;
   -webkit-border: none;
      -moz-border: none;
        -o-border: none;
           border: none;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

  1. team-section .ui-slider-tabs-list li:first-child { margin-left: 0; }
  2. team-section .ui-slider-tabs-list li a {
   padding: 0;
   width: 170px;
   position: relative;
   height: 170px !important;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

  1. team-section .ui-slider-tabs-list li a img {
   width: 110px;
   height: 170px;
   position: relative;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

  1. team-section .ui-slider-tabs-list li a:after {
   top: 0;
   left: 0;
   z-index: 1;
   opacity: 0.5;
   width: 170px;
   display: none;
   height: 170px;
   color: #ffffff;
   font-size: 30px;
   content: '\f002';
   line-height: 170px;
   position: absolute;
   background-color: #ff3131;
   font-family: 'FontAwesome';
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

  1. team-section .ui-slider-tabs-list li a:hover:after { display: block; }

/* 11.2.3 Navigation


*/
  1. team-section .ui-slider-tabs-list-wrapper {
   top: 355px;
   right: 15px;
   float: right;
   z-index: 9999;
   overflow: hidden;
   position: absolute;

}

  1. team-section .ui-slider-tabs-list-container {
   float: right;
   width: 570px;
   overflow: hidden;

}

/* 11.2.4 Dots


*/
  1. team-section .ui-slider-tabs-indicator-container {
   top: 310px;
   height: 30px;
   text-align: right;

}

  1. team-section .ui-slider-tabs-indicator {
   width: 20px;
   height: 20px;
   margin-right: 10px;
   position: relative;
   background-image: none;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

  1. team-section .ui-slider-tabs-indicator:last-child { margin-right: 0; }

.ui-slider-tabs-indicator:after {

   top: 1px;
   left: 50%;
   width: 20px;
   z-index: 1;
   height: 20px;
   color: #76889a;
   font-size: 21px;
   content: '\f111';
   margin-left: -10px;
   position: absolute;
   font-family: 'FontAwesome';

}

/* 11.2.5 Selected


*/

.ui-slider-tabs-indicator.selected:after {

   top: 1px;
   left: 50%;
   z-index: -1;
   width: 20px;
   height: 20px;
   color: #76889a;
   font-size: 21px;
   content: '\f192';
   position: absolute;
   margin-left: -10px;
   font-family: 'FontAwesome';

} .ui-slider-tabs-indicator.selected, .ui-slider-tabs-indicator:hover {

   z-index: 1;
   color: #76889a;

}

/* 11.2.6 Member Big Image


*/

.member-image {

   width: 100%;
   margin: 0 auto;
   text-align: center;

} .member-image img {

   width: 100%;
   max-width: 360px;

}

/* 11.2.7 Title Description


*/
  1. TeamTabs .section-short-desc {
   color: #76889a;
   font-size: 18px;
   font-weight: 300;
   text-transform: uppercase;

}

/* 11.2.8 Content Description


*/

.member-desc {

   overflow: hidden;
   margin-bottom: 35px;

} .member-desc p {

   font-size: 14px;
   font-weight: 300;

} .member-desc p:last-child { margin-bottom: 0; }

/* 11.2.9 Social Icons


*/

.member-social {

   overflow: hidden;
   margin-bottom: 60px;

} .member-social ul {

   margin: 0;
   padding: 0;
   list-style: none;

} .member-social ul li {

   float: left;
   width: 40px;
   height: 40px;
   margin: 0 10px 10px 0;

} .member-social ul li a {

   display: block;
   font-size: 20px;
   line-height: 38px;
   text-align: center;
   background-color: #ffffff;
   -webkit-border: 1px solid #76889a;
      -moz-border: 1px solid #76889a;
        -o-border: 1px solid #76889a;
           border: 1px solid #76889a;
   -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
        -o-border-radius: 50%;
           border-radius: 50%;

} .member-social ul li a:hover { background-color: #76889a; }



/* ==========================================================================

  12. Team Section

========================================================================== */ /* 12.1 Wrapper


*/
  1. faq-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 70px;
   background-color: #ffffff;

}


/* 12.2 Tabs


*/

/* 12.2.1 Wrapper


*/

.faq-tabs {

   width: 100%;
   overflow: hidden;

}

/* 12.2.2 Btns


*/

/* 12.2.2.1 List


*/

.faq-tabs ul.faq-tabs-btns {

   width: 50%;
   float: left;
   margin: 0 auto;
   list-style: none;
   padding: 0 15px 0;

}

/* 12.2.2.2 Items


*/

.faq-tabs ul.faq-tabs-btns li {

   display: block;
   line-height: 50px;
   position: relative;
   margin-bottom: 30px;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

/* 12.2.2.3 Anchors


*/

.faq-tabs ul.faq-tabs-btns li a {

   display: block;
   font-size: 18px;
   font-weight: 400;
   padding-left: 15px;
   position: relative;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;
   -webkit-border: 1px solid #76889a;
      -moz-border: 1px solid #76889a;
        -o-border: 1px solid #76889a;
           border: 1px solid #76889a;

} .faq-tabs ul.faq-tabs-btns li a:hover, .faq-tabs ul.faq-tabs-btns li a:focus, .faq-tabs ul.faq-tabs-btns li a.active {

   color: #ffffff;
   background-color: #ff3131;
   -webkit-border: 1px solid #ff3131;
      -moz-border: 1px solid #ff3131;
        -o-border: 1px solid #ff3131;
           border: 1px solid #ff3131;

} .faq-tabs ul.faq-tabs-btns li a.active:after {

   width: 0;
   height: 0;
   top: 12px;
   z-index: 1;
   content: ;
   right: -32px;
   position: absolute;
   -webkit-border-right: 13px solid #f5f7f9;
      -moz-border-right: 13px solid #f5f7f9;
        -o-border-right: 13px solid #f5f7f9;
           border-right: 13px solid #f5f7f9;
   -webkit-border-top: 13px solid rgba(0, 0, 0, 0);
      -moz-border-top: 13px solid rgba(0, 0, 0, 0);
        -o-border-top: 13px solid rgba(0, 0, 0, 0);
           border-top: 13px solid rgba(0, 0, 0, 0);
   -webkit-border-bottom: 13px solid rgba(0, 0, 0, 0);
      -moz-border-bottom: 13px solid rgba(0, 0, 0, 0);
        -o-border-bottom: 13px solid rgba(0, 0, 0, 0);
           border-bottom: 13px solid rgba(0, 0, 0, 0);

} .faq-tabs ul.faq-tabs-btns li a.active:before {

   width: 0;
   height: 0;
   top: 10px;
   content: ;
   right: -32px;
   position: absolute;
   -webkit-border-right: 15px solid #b2c4d6;
      -moz-border-right: 15px solid #b2c4d6;
        -o-border-right: 15px solid #b2c4d6;
           border-right: 15px solid #b2c4d6;
   -webkit-border-top: 15px solid rgba(0, 0, 0, 0);
      -moz-border-top: 15px solid rgba(0, 0, 0, 0);
        -o-border-top: 15px solid rgba(0, 0, 0, 0);
           border-top: 15px solid rgba(0, 0, 0, 0);
   -webkit-border-bottom: 15px solid rgba(0, 0, 0, 0);
      -moz-border-bottom: 15px solid rgba(0, 0, 0, 0);
        -o-border-bottom: 15px solid rgba(0, 0, 0, 0);
           border-bottom: 15px solid rgba(0, 0, 0, 0);

} .faq-tabs .col-md-6 { overflow: hidden; }

/* 12.2.3 Content


*/

/* 12.2.3.1 Wrapper


*/

.faqcontent {

   overflow: hidden;
   margin-bottom: 30px;
   padding: 15px 20px 0;
   background-color: #f5f7f9;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;
   -webkit-border: 1px solid #b2c4d6;
      -moz-border: 1px solid #b2c4d6;
        -o-border: 1px solid #b2c4d6;
           border: 1px solid #b2c4d6;

}

/* 12.2.3.2 Description


*/

.faqcontent .content-desc h3 { margin-bottom: 15px; } .faqcontent .content-desc { margin-bottom: 20px; } .faqcontent .content-desc p {

   color: #2d373c;
   font-size: 14px;
   font-weight: 300;

} .faqcontent .content-desc p:last-child { margin-bottom: 0; } .faqcontent .mini-feature-list li:last-child { margin-bottom: 0; } .faqcontent .mini-feature-list {

   width: 50%;
   float: left;

} .faqcontent .mini-feature-list:first-child { padding-right: 15px; } .faqcontent .mini-feature-list:last-child { padding-left: 15px; }



/* ==========================================================================

  13. Clients Section

========================================================================== */ /* 13.1 Wrapper


*/
  1. clients-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 70px;
   background-color: #ffffff;

} .owl-clients {

   width: 100%;
   margin: 0 auto;
   max-width: 1060px;

}

/* 13.2 Content


*/

.client-item .client-content {

   width: 100%;
   text-align: center;
   position: relative;
   padding: 15px 20px;
   margin-bottom: 20px;
   background-color: #f5f7f9;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;
   -webkit-border: 1px solid #b2c4d6;
      -moz-border: 1px solid #b2c4d6;
        -o-border: 1px solid #b2c4d6;
           border: 1px solid #b2c4d6;

} .client-item .client-content:after {

   width: 0;

height: 0;

   top: 100%;
   left: 50%;
   content: ;
   margin-left: -12px;
   position: absolute;

-webkit-border-top: 12px solid #b2c4d6;

      -moz-border-top: 12px solid #b2c4d6;
        -o-border-top: 12px solid #b2c4d6;
           border-top: 12px solid #b2c4d6;

-webkit-border-left: 12px solid transparent;

      -moz-border-left: 12px solid transparent;
        -o-border-left: 12px solid transparent;
           border-left: 12px solid transparent;

-webkit-border-right: 12px solid transparent;

      -moz-border-right: 12px solid transparent;
        -o-border-right: 12px solid transparent;
           border-right: 12px solid transparent;

} .client-item .client-content:before {

   width: 0;

height: 0;

   top: 100%;
   left: 50%;
   z-index: 1;
   content: ;
   margin-top: -1px;
   margin-left: -11px;
   position: absolute;

-webkit-border-top: 11px solid #f5f7f9;

      -moz-border-top: 11px solid #f5f7f9;
        -o-border-top: 11px solid #f5f7f9;
           border-top: 11px solid #f5f7f9;

-webkit-border-left: 11px solid transparent;

      -moz-border-left: 11px solid transparent;
        -o-border-left: 11px solid transparent;
           border-left: 11px solid transparent;

-webkit-border-right: 11px solid transparent;

      -moz-border-right: 11px solid transparent;
        -o-border-right: 11px solid transparent;
           border-right: 11px solid transparent;

}

/* 13.3 Quote


*/

.client-quote {

   width: 100%;
   margin-bottom: 5px;

} .client-item .client-content .client-quote p {

   color: #76889a;
   font-size: 16px;
   font-weight: 300;

} .client-item .client-content .client-quote p:last-child { margin-bottom: 0; }

/* 13.4 Name


*/

.client-item .client-content .cient-name {

   color: #76889a;
   font-size: 18px;
   font-weight: 700;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 13.5 Image


*/

.client-item .client-image {

   width: 100%;
   overflow: hidden;
   text-align: center;

} .client-item .client-image img {

   width: 150px;
   height: 136.9px;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

/* 13.6 Arrows


*/

.owl-navigation {

   top: 100%;
   left: 50%;
   margin-top: -50px;
   margin-left: -25px;
   position: absolute;
   text-align: center;

} .owl-navigation a {

   height: 25px;
   color: #76889a;
   font-size: 25px;
   line-height: 25px;

} .owl-navigation a i { line-height: 25px; } .clients-prev {

   z-index: 9;
   float: left;
   position: relative;
   margin-left: -75px;

} .clients-next {

   z-index: 9;
   float: right;
   margin-left: 125px;
   position: relative;

}



/* ==========================================================================

  14. Price Section

========================================================================== */ /* 14.1 Wrapper


*/
  1. price-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 40px;
   background-color: #ffffff;

}

/* 14.2 Price Table


*/

/* 14.2.1 Wrapper


*/

.price-table {

   width: 100%;
   max-width: 263px;
   text-align: center;
   margin: 0 auto 30px;
   padding: 25px 0 30px;
   background-color: #f5f7f9;

}

/* 14.2.2 Name


*/

.price-table .table-name h1 {

   font-weight: 100;
   margin-bottom: 10px;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 14.2.3 Description


*/

.price-table .table-desc p {

   color: #76889a;
   font-size: 14px;
   font-weight: 300;
   margin-bottom: 25px;

}

/* 14.2.4 Price


*/

.price-table .table-price {

   width: 130px;
   height: 130px;
   overflow: hidden;
   margin: 0 auto 30px;
   background-color: #ff3131;
   -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
        -o-border-radius: 50%;
           border-radius: 50%;

} .price-table .table-price h1 {

   color: #ffffff;
   font-size: 36px;
   font-weight: 700;
   line-height: 130px;
   letter-spacing: 1px;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 14.2.5 Info


*/

.price-table .table-info ul {

   padding: 0;
   list-style: none;
   margin: 0 0 30px;

} .price-table .table-info ul li {

   display: block;
   color: #76889a;
   font-size: 14px;
   font-weight: 700;
   line-height: 50px;
   -webkit-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
      -moz-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
        -o-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
           border-bottom: 1px solid rgba(178, 196, 214, 0.3);

} .price-table .table-info ul li:first-child {

   -webkit-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
      -moz-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
        -o-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
           border-bottom: 1px solid rgba(178, 196, 214, 0.3);

}

/* 14.2.6 Hover


*/

.price-table.featured, .price-table:hover { background-color: #ff3131; }

.price-table.featured .table-name h1, .price-table.featured .table-desc p, .price-table.featured .table-info ul li, .price-table:hover .table-name h1, .price-table:hover .table-desc p, .price-table:hover .table-info ul li {

   color: #ffffff;

}

.price-table.featured .table-price, .price-table:hover .table-price { background-color: #ffffff; } .price-table.featured .table-btn .btn-nesto, .price-table:hover .table-btn .btn-nesto {

   background-color: transparent;
   color: #ffffff;
   -webkit-border-color: #ffffff;
      -moz-border-color: #ffffff;
        -o-border-color: #ffffff;
           border-color: #ffffff;

}

.price-table:hover .table-name h1 { font-weight: 700; }

.price-table.featured .table-price h1, .price-table:hover .table-price h1 {

   color: #ff3131;
   font-weight: 700;

}

.price-table:hover .table-btn .btn-nesto:hover {

   background-color: transparent;
   -webkit-border-color: #ffffff;
      -moz-border-color: #ffffff;
        -o-border-color: #ffffff;
           border-color: #ffffff;

}



/* ==========================================================================

  15. Recent Posts Section

========================================================================== */ /* 15.1 Wrapper


*/
  1. recent-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 70px;
   background-color: #ffffff;

}

/* 15.2 Mini Post


*/

/* 15.2.1 Wrapper


*/

.mini-post {

   width: 100%;
   overflow: hidden;
   max-width: 263px;
   text-align: center;
   margin: 0 auto 30px;
   padding-bottom: 20px;
   background-color: #f5f7f9;
   -webkit-border-radius: 6px 6px 0 0;
      -moz-border-radius: 6px 6px 0 0;
        -o-border-radius: 6px 6px 0 0;
           border-radius: 6px 6px 0 0;

} .mini-post a {

   font-size: 14px;
   font-weight: 300;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 15.2.2 Image


*/

.mini-post .post-image { width: 100%; } .mini-post .post-image img { width: 100%; }

/* 15.2.3 Title


*/

.mini-post .post-title { margin-top: 20px; } .mini-post .post-title h2 { margin-bottom: 10px; } .mini-post .post-title h2 a {

   color: #2d373c;
   font-size: 18px;
   font-weight: 300;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

} .mini-post .post-title a:hover { color: #ff3131; }

/* 15.2.4 Date


*/

.mini-post .post-date { margin-bottom: 10px; } .mini-post .post-date h4 {

   color: #76889a;
   font-size: 14px;
   font-weight: 300;
   text-transform: uppercase;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 15.2.5 Content


*/

.mini-post .post-content {

   padding: 0 5px;
   margin-bottom: 15px;

} .post-content p {

   color: #76889a;
   font-size: 14px;
   font-weight: 300;

}



/* ==========================================================================

  16. Like Section

========================================================================== */ /* 16.1 Wrapper


*/
  1. like-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 60px;
   background-color: #ffffff;
   -webkit-border-bottom: 1px solid #f4f5f5;
      -moz-border-bottom: 1px solid #f4f5f5;
        -o-border-bottom: 1px solid #f4f5f5;
           border-bottom: 1px solid #f4f5f5;

}

/* 16.2 Buttons


*/

.like-buttons {

   width: 100%;
   text-align: center;

} .like-buttons a { margin: 0 10px 10px 0; } .like-buttons a:last-child { margin-right: 0; }



/* ==========================================================================

  17. Reach Section

========================================================================== */ /* 17.1 Wrapper


*/
  1. reach-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 40px;
   background-color: #ffffff;

}

/* 17.2 Form


*/

/* 17.2.1 Wrapper


*/

.contactForm {

   padding: 0;
   width: 100%;
   margin: 0 auto;
   max-width: 670px;
   overflow: hidden;

} .form-group {

   margin: 0;
   padding: 0;

}

/* 17.2.2 Textarea


*/

.contactForm textarea { width: 100%;

   resize: none;
   margin: 0 auto 30px;
   height: 142px !important;

}

/* 17.2.3 form-control


*/

.contactForm .form-control { width: 100%;

   height: 42px;
   outline: none;

padding: 10px 15px;

   margin: 0 auto 30px;

background-color: #ffffff;

   -webkit-box-shadow: none;
      -moz-box-shadow: none;
        -o-box-shadow: none;
           box-shadow: none;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;
   -webkit-border: 1px solid #B2C4D6;
      -moz-border: 1px solid #B2C4D6;
        -o-border: 1px solid #B2C4D6;
           border: 1px solid #B2C4D6;

} .contactForm .form-control:hover, .contactForm .form-control:focus {

   -webkit-box-shadow: none;
      -moz-box-shadow: none;
        -o-box-shadow: none;
           box-shadow: none;
   -webkit-border: 1px solid #B2C4D6;
      -moz-border: 1px solid #B2C4D6;
        -o-border: 1px solid #B2C4D6;
           border: 1px solid #B2C4D6;

}

/* 17.2.4 Button


*/

.contactForm button.submit {

   width: 100%;
   outline: none;
   color: #76889a;
   font-weight: 300;
   padding: 10px 16px;
   margin-bottom: 30px;
   background-color: #ffffff;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   -webkit-border-color: #B2C4D6;
      -moz-border-color: #B2C4D6;
        -o-border-color: #B2C4D6;
           border-color: #B2C4D6;

} .contactForm .submit.active, .contactForm .submit:active, .contactForm .submit.focus, .contactForm .submit:focus, .contactForm .submit:hover { color: #ffffff;

   outline-width: 0;
   position: relative;
   background-color: #76889a;
   -webkit-border-color: #76889a;
      -moz-border-color: #76889a;
        -o-border-color: #76889a;
           border-color: #76889a;

}

/* 17.2.5 error message


*/

.error { top: 0;

   z-index: 2;
   float: right;
   color: #76889a;
   position: relative;
   margin: -69px 15px 0 0;

}

-webkit-ui-invalid:not(output) { box-shadow: none; }
  :-moz-ui-invalid:not(output) { box-shadow: none; }
   :-ms-ui-invalid:not(output) { box-shadow: none; }
    :-o-ui-invalid:not(output) { box-shadow: none; }
        ui-invalid:not(output) { box-shadow: none; }

/* 17.2.6 Alert


*/

.alert-nesto {

   color: #ffffff;
   background-color: #76889a;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

  1. contact-section .alert.alert-nesto { margin-bottom: 30px; }
  2. contact-section .alert {
   -webkit-border: none;
      -moz-border: none;
        -o-border: none;
           border: none;

}



/* ==========================================================================

  18. Subscribe Section

========================================================================== */ /* 18.1 Wrapper


*/
  1. subscribe-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 40px;
   background-color: #ffffff;

}

  1. subscribe-blog-section {
   margin: 0;
   width: 100%;
   padding: 35px 0 40px;
   background-color: #ffffff;
   -webkit-border-bottom: 1px solid #f4f5f5;
      -moz-border-bottom: 1px solid #f4f5f5;
        -o-border-bottom: 1px solid #f4f5f5;
           border-bottom: 1px solid #f4f5f5;

}

/* 18.2 Subscribe


*/

/* 18.2.1 Wrapper


*/
  1. subscribe {
   width: 100%;
   margin: 0 auto;
   max-width: 670px;
   overflow: hidden;
   position: relative;

}

/* 18.2.2 Input


*/
  1. subscribe-section .validate {

position: relative; margin: 0 auto; padding: 2em 0; max-width: 600px; width: 100%; text-align: left; font-size: 2.5em; }

  1. subscribe-section .validate .submit {

display: none; }

/* Question list style */

  1. subscribe-section .validate ol {

margin: 0; padding: 0; list-style: none; position: relative; -webkit-transition: height 0.4s; transition: height 0.4s; }

  1. subscribe-section .validate ol:before {

content: ; background-color: rgba(0,0,0,0.1); position: absolute; left: 0; bottom: 0; width: 100%; height: 2.35em; }

  1. subscribe-section .questions li {

z-index: 100; position: relative; visibility: hidden; height: 0; -webkit-transition: visibility 0s 0.4s, height 0s 0.4s; transition: visibility 0s 0.4s, height 0s 0.4s; }

  1. subscribe-section .questions li.current,
  2. subscribe-section .no-js .questions li {

visibility: visible; height: auto; -webkit-transition: none; transition: none; }

/* Labels */

  1. subscribe-section .questions li > span {

display: block; overflow: hidden; }

  1. subscribe-section .questions li > span label {

display: block; -webkit-transition: -webkit-transform 0.4s; transition: transform 0.4s; -webkit-transform: translateY(-100%); transform: translateY(-100%); }

  1. subscribe-section .questions li.current > span label,
  2. subscribe-section .no-js .questions li > span label {

-webkit-transition: none; transition: none; -webkit-transform: translateY(0); transform: translateY(0); }

  1. subscribe-section .show-next .questions li.current > span label {

-webkit-animation: moveUpFromDown 0.4s both; animation: moveUpFromDown 0.4s both; }

@-webkit-keyframes moveUpFromDown { from { -webkit-transform: translateY(100%); } to { -webkit-transform: translateY(0); } }

@keyframes moveUpFromDown { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* Input field */

  1. subscribe-section .questions input {

display: block; margin: em 0 0 0; padding: em em em em; width: calc(100% - 2em); border: none; background: transparent; color: rgba(0,0,0,0.8); font-size: 1em; line-height: 1; opacity: 0; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; }

  1. subscribe-section .questions .current input,
  2. subscribe-section .no-js .questions input {

opacity: 1; }

  1. subscribe-section .questions input:focus,
  2. subscribe-section .validate button:focus {

outline: none; }

/* Next question button */

  1. subscribe-section .next {

position: absolute; right: 0; bottom: 2.15em; /* padding-bottom of form plus progress bar height */ display: block; padding: 0; width: 2em; height: 2em; border: none; background: none; color: rgba(0,0,0,0.4); text-align: center; opacity: 0; z-index: 100; cursor: pointer; -webkit-transition: -webkit-transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s; -webkit-transform: translateX(-20%); transform: translateX(-20%); pointer-events: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

  1. subscribe-section .next:hover {

color: rgba(0,0,0,0.5); }

  1. subscribe-section .next::after {

position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: "\e600"; text-transform: none; font-weight: normal; font-style: normal; font-variant: normal; font-family: 'icomoon'; line-height: 2; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

  1. subscribe-section .next.show {

opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); pointer-events: auto; }

/* Progress bar */

  1. subscribe-section .validate .progress {

width: 0%; height: 0.15em; background: rgba(0,0,0,0.3); -webkit-transition: width 0.4s ease-in-out; transition: width 0.4s ease-in-out; }

  1. subscribe-section .validate .progress::before {

position: absolute; top: auto; width: 100%; height: inherit; background: rgba(0,0,0,0.05); content: ; }

/* Number indicator */

  1. subscribe-section .validate .number {

position: absolute; right: 0; overflow: hidden; margin: 0.4em 0; width: 3em; font-weight: 700; font-size: 0.4em; }

  1. subscribe-section .validate .number:after {

position: absolute; left: 50%; content: '/'; opacity: 0.4; -webkit-transform: translateX(-50%); transform: translateX(-50%); }

  1. subscribe-section .validate .number span {

float: right; width: 40%; text-align: center; }

  1. subscribe-section .validate .number .number-current {

float: left; }

  1. subscribe-section .validate .number-next {

position: absolute; left: 0; }

  1. subscribe-section .validate.show-next .number-current {

-webkit-transition: -webkit-transform 0.4s; transition: transform 0.4s; -webkit-transform: translateY(-100%); transform: translateY(-100%); }

  1. subscribe-section .validate.show-next .number-next {

-webkit-animation: moveUpFromDown 0.4s both; animation: moveUpFromDown 0.4s both; }

/* Error and final message */

  1. subscribe-section .validate .error-message,
  2. subscribe-section .validate .final-message {

position: absolute; visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; transition: opacity 0.4s; }

  1. subscribe-section .validate .error-message {

padding: 0.4em 3.5em 0 0; width: 100%; color: rgba(0,0,0,0.7); font-style: italic; font-size: 0.4em; }

  1. subscribe-section .final-message {

top: 50%; left: 0; padding: 0.5em; width: 100%; text-align: center; -webkit-transform: translateY(-50%); transform: translateY(-50%); }

  1. subscribe-section .error-message.show,
  2. subscribe-section .final-message.show {

visibility: visible; opacity: 1; }

  1. subscribe-section .final-message.show {

-webkit-transition-delay: 0.5s; transition-delay: 0.5s; }

/* Final hiding of form / showing message */

  1. subscribe-section .simform-inner.hide {

visibility: hidden; opacity: 0; -webkit-transition: opacity 0.3s, visibility 0s 0.3s; transition: opacity 0.3s, visibility 0s 0.3s; }

/* No JS Fallback */

  1. subscribe-section .no-js .validate {

font-size: 1.75em; }

  1. subscribe-section .no-js .questions li {

padding: 0 0 0; }

  1. subscribe-section .no-js .validate .submit {

display: block; float: right; padding: 0px 0px 0px 0px; border: none; background: rgba(0,0,0,0.3); color: rgba(0,0,0,0.4); }

  1. subscribe-section .no-js .validate .controls {

display: none; }

/* Remove IE clear cross */ input[type=text]::-ms-clear {

   display: none;

}

/* Adjust form for smaller screens */ @media screen and (max-width: 44.75em) { #subscribe-section .validate { font-size: 1.8em; } }

@media screen and (max-width: 33.5625em) { #subscribe-section .validate { font-size: 1.2em; } }

.connect { width: 100%; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 75px }

.connect form { margin-top: 10px; width: 480px; padding: 0px 0px 0px 0px; }

.connect form input[type=email] { width: 338px; height: 46px; border: 1px solid #002147; border-right: none; background: none; -webkit-border-top-left-radius: 99px; -webkit-border-bottom-left-radius-radius: 99px; -moz-border-radius-topleft: 99px; -moz-border-radius-bottomleft: 99px; border-top-left-radius: 99px; border-bottom-left-radius: 99px; font-size: 14px; font-weight: bold; padding: 0 0 0 20px; color: #8F8F8C; font-weight: 200; float: left; opacity: 0.65; }

.connect form input[type=email]:hover { opacity: 0.8; }

.connect form input[type=email]:focus { outline: none; opacity: 1; }

.connect form input[type=button], form input[type=submit] { width: 119px; height: 48px; border: none; cursor: pointer; -webkit-border-top-right-radius: 99px; -webkit-border-bottom-right-radius-radius: 99px; -moz-border-radius-topright: 99px; -moz-border-radius-bottomright: 99px; border-top-right-radius: 99px; border-bottom-right-radius: 99px; background-color: #8F8F8C; margin: 0; padding: 0; font-size: 14px; font-weight: bold; color: #333; float: left; opacity: 0.65; }

.connect form input[type=button]:hover, form input[type=submit]:hover { opacity: 1; }

.connect form input[type=button]:active, form input[type=submit]:active { opacity: 0.8; }

.connect ul { width: 440px; text-align: center; display: block; margin: 60px auto 20px auto; }

.connect ul li a { width: 48px; height: 48px; display: block; text-indent: -499px; overflow: hidden; opacity: 0.65; -webkit-border-radius: 499px; -moz-border-radius: 499px; border-radius: 499px; border: 1px solid #002147; margin: 0 5px; }

.connect ul li a:hover { opacity: 1; }

.connect ul li a:active { opacity: 0.8; }


@media only screen and (max-width : 960px) { .wrapper { width: auto; } .connect { display: block; float: none; width: 348px; margin: 50px auto; } .connect form { width: 100%; } .connect form input[type=text]{ width: 206px; } .connect ul { width: 340px; } }

@media only screen and (max-width : 480px) { h1, ul.countdown { margin: 20px auto; } h2 { margin: 40px auto; } }

/*Fade In Animation*/

h1, ul.countdown, h2, p, form, .connect {

   -webkit-animation: fadein 3s; /* Safari and Chrome */
      -moz-animation: fadein 3s; /* Firefox */
       -ms-animation: fadein 3s; /* Internet Explorer */
        -o-animation: fadein 3s; /* Opera */
           animation: fadein 3s;

}


@keyframes fadein {

   from { opacity: 0; }
   to   { opacity: 1; }

} @-moz-keyframes fadein {

   from { opacity: 0; }
   to   { opacity: 1; }

} @-webkit-keyframes fadein {

   from { opacity: 0; }
   to   { opacity: 1; }

} @-ms-keyframes fadein {

   from { opacity: 0; }
   to   { opacity: 1; }

}​ @-o-keyframes fadein {

   from { opacity: 0; }
   to   { opacity: 1; }

}​

/* ==========================================================================

  19. Footer Section

========================================================================== */ /* 19.1 Wrapper


*/
  1. footer-section {
   margin: 0;
   padding: 0;
   width: 100%;
   height: 95px;
   text-align: center;

}

/* 19.2 Social Icons


*/

/* 19.2.1 List


*/

.footer-social-icons ul {

   margin: 0;
   padding: 0;
   width: 100%;
   list-style: none;
   text-align: center;

background-color: #FFFFFF; }

/* 19.2.2 Iems


*/

.footer-social-icons ul li {

   margin: 0;
   width: 100px;
   text-align: center;
   display: inline-block;
   -webkit-border-right: 1px solid #f4f5f5;
      -moz-border-right: 1px solid #f4f5f5;
        -o-border-right: 1px solid #f4f5f5;
           border-right: 1px solid #f4f5f5;
   -webkit-border-bottom: 1px solid #f4f5f5;
      -moz-border-bottom: 1px solid #f4f5f5;
        -o-border-bottom: 1px solid #f4f5f5;
           border-bottom: 1px solid #f4f5f5;

} .footer-social-icons ul li:first-child {

   -webkit-border-left: 1px solid #f4f5f5;
      -moz-border-left: 1px solid #f4f5f5;
        -o-border-left: 1px solid #f4f5f5;
           border-left: 1px solid #f4f5f5;

} .footer-social-icons ul li a {

   display: block;
   font-size: 30px;
   line-height: 95px;

} .footer-social-icons ul li a:hover { background-color: #FFFFFF; }



/* ==========================================================================

  20. More APPS Section20.1 Wrapper

========================================================================== */ /* 20.1 Wrapper


*/
  1. moreapps-section {
   margin: 0;
   width: 100%;
   position: relative;
   padding: 35px 0 60px;
   background-color: #ffffff;

}

  1. owl-apps {
   width: 100%;
   margin: 0 auto;
   max-width: 1060px;

}

  1. owl-apps:hover a img { opacity: 0.7; }
  2. owl-apps a:hover img { opacity: 1; }

.app-logo { text-align: center; }



/* ==========================================================================

  21. Blog

========================================================================== */ /* 21.1 Wrapper


*/
  1. home-blog-section {
   margin: 0;
   padding: 0;
   width: 100%;
   overflow: hidden;
   background-color: #ffffff;
   background-repeat: repeat;
   background-attachment: fixed;
   background-position: center top;
   -webkit-background-size: cover;
      -moz-background-size: cover;
        -o-background-size: cover;
           background-size: cover;

}

/* 21.2 Home Section Wrapper


*/
  1. home-blog-section-wrapper {
   z-index: 1;
   width: 100%;
   position: relative;
   padding: 120px 0 70px;
   background-color: rgba(0, 0, 0, 0.6);

}

  1. home-blog-section-wrapper:after {
   top: 0;
   left: 0;
   z-index: -1;
   content: ;
   width: 100%;
   height: 100%;
   opacity: 0.4;
   position: absolute;
   background-color: #1e2329;

}

/* 21.3 Slogan


*/
  1. home-blog-section-wrapper .slogan {
   width: 100%;
   overflow: hidden;
   text-align: center;
   margin-bottom: 0px;

}

  1. home-blog-section-wrapper .slogan h1 {
   color: #ffffff;
   font-size: 48px;
   font-weight: 100;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 21.4 Description


*/
  1. home-blog-section-wrapper .desc {
   width: 75%;
   margin: 0 auto 30px;
   text-align: center;

}

  1. home-blog-section-wrapper .desc p { color: #ffffff; }
  2. home-blog-section-wrapper .desc p:last-child { margin-bottom: 0; }

/* 21.5 Buttons


*/
  1. home-blog-section-wrapper .buttons {
   width: 100%;
   text-align: center;
   margin-bottom: 20px;

}

  1. home-blog-section-wrapper .buttons a {
   color: #ffffff;
   font-size: 18px;
   font-weight: 100;
   line-height: 35px;
   margin: 0 30px 30px 0;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

  1. home-blog-section-wrapper .buttons a:last-child { margin-right: 0; }
  2. home-blog-section-wrapper .buttons a i {
   float: left;
   font-size: 35px;
   line-height: 35px;
   margin-right: 10px;

}

  1. home-blog-section-wrapper .blog-button {
   left: 0;
   bottom: 0;
   width: 100%;
   text-align: center;
   position: absolute;

}

  1. home-blog-section-wrapper .blog-button a {
   margin: 0;
   color: #ffffff;
   font-size: 18px;
   font-weight: 100;
   line-height: 35px;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

  1. home-blog-section-wrapper .blog-button .btn-nesto-home {
   -webkit-border-radius: 6px 6px 0 0;
      -moz-border-radius: 6px 6px 0 0;
        -o-border-radius: 6px 6px 0 0;
           border-radius: 6px 6px 0 0;

}



/* ==========================================================================

  22. Posts RightSidebar

========================================================================== */ /* 22.1 Wrapper


*/
  1. posts-section {
   margin: 0;
   width: 100%;
   padding: 70px 0 40px;
   background-color: #ffffff;

}

/* 22.2 Post


*/

/* 22.2.1 Wrapper


*/

.post {

   width: 100%;
   overflow: hidden;
   margin-bottom: 30px;

}

/* 22.2.2 Info


*/

.post .info {

   float: left;
   overflow: hidden;
   margin-right: 30px;
   display: inline-block;

}

/* 22.2.3 Date


*/

.post .post-date {

   width: 70px;
   height: 70px;
   display: block;
   margin-bottom: 15px;
   background-color: #f5f7f9;

-webkit-border-radius: 6px;

      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

} .post .post-date span:first-child {

   display: block;
   color: #76889a;
   font-size: 32px;
   line-height: 45px;
   text-align: center;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;


   -webkit-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
      -moz-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
        -o-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
           border-bottom: 1px solid rgba(178, 196, 214, 0.3);

} .post .post-date span:last-child {

   display: block;
   color: #76889a;
   text-align: center;
   text-transform: uppercase;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 22.2.4 Post Type


*/

/* 22.2.4.1 Image


*/

.post .post-type {

   width: 70px;
   height: 70px;
   display: block;
   line-height: 70px;
   position: relative;
   text-align: center;
   background-color: #f5f7f9;

-webkit-border-radius: 6px;

      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

} .post .post-type.image:after {

   top: 0;
   left: 0;
   width: 100%;
   height: 70px;
   color: #76889a;
   font-size: 22px;
   content: '\f030';
   position: relative;
   font-family: 'FontAwesome';

}

/* 22.2.4.2 Video


*/

.post .post-type.video:after {

   top: 0;
   left: 0;
   width: 100%;
   height: 70px;
   color: #76889a;
   font-size: 22px;
   content: '\f03d';
   position: relative;
   font-family: 'FontAwesome';

} .videos iframe {

   -webkit-border: none;
      -moz-border: none;
        -o-border: none;
           border: none;

}

/* 22.2.4.3 Text


*/

.post .post-type.text:after {

   top: 0;
   left: 0;
   width: 100%;
   height: 70px;
   color: #76889a;
   font-size: 24px;
   content: '\f044';
   position: relative;
   font-family: 'FontAwesome';

}

/* 22.2.4.4 Audio


*/

.post-header.audio { margin-bottom: -10px; } .post .post-type.audio:after {

   top: 0;
   left: 0;
   width: 100%;
   height: 70px;
   color: #76889a;
   font-size: 24px;
   content: '\f025';
   position: relative;
   font-family: 'FontAwesome';

} .audio iframe {

   width: 100%;
   -webkit-border: none;
      -moz-border: none;
        -o-border: none;
           border: none;

}

/* 22.2.5 Data


*/

/* 22.2.5.1 Wrapper


*/

.post .post-data {

   float: left;
   overflow: hidden;
   display: inline-block;
   background-color: #f5f7f9;
   width: calc(100% - 100px);

}

/* 22.2.5.2 Header


*/

.post .post-header {

   width: 100%;
   overflow: hidden;
   -webkit-border-radius: 6px 6px 0 0;
      -moz-border-radius: 6px 6px 0 0;
        -o-border-radius: 6px 6px 0 0;
           border-radius: 6px 6px 0 0;

} .post .post-header img { width: 100%; }

/* 22.2.5.3 Container


*/

.post .post-container {

   width: 100%;
   padding: 30px;

}

/* 22.2.5.4 Title


*/

.post .post-title h2 {

   width: 100%;
   font-weight: 100;
   margin-bottom: 10px;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

} .post .post-title a { color: #2d373c; } .post .post-title a:hover { color: #ff3131; }

/* 22.2.5.5 Info


*/

.post .post-info {

   width: 100%;
   overflow: hidden;

} .post .post-author, .post .post-comment, .post .post-views {

   float: left;
   overflow: hidden;
   position: relative;
   padding-left: 20px;
   display: inline-block;
   margin: 0 15px 15px 0;

} .post .post-views { margin-right: 0; } .post .post-author { padding-left: 17px !important; }

.post .post-author a, .post .post-comment a, .post .post-views a {

   font-size: 12px;

} .post .post-author:hover a, .post .post-comment:hover a, .post .post-views:hover a, .post .post-author:hover:after, .post .post-comment:hover:after, .post .post-views:hover:after, .post .post-comment:hover span:first-child:after, .post .post-views:hover span:first-child:after {

   color: #ff3131;

}

.post .post-author:after {

   top: 2px;
   left: 0;
   color: #76889a;
   font-size: 12px;
   content: '\f007';
   position: absolute;
   font-family: 'FontAwesome';

}

.post .post-comment:after {

   left: 0;
   top: 2px;
   color: #76889a;
   font-size: 12px;
   content: '\f075';
   position: absolute;
   font-family: 'FontAwesome';

} .post .post-comment span { position: relative; } .post .post-comment span:first-child {

   margin-right: 8px;
   padding-right: 8px;

} .post .post-comment span:first-child:after {

   top: -1px;
   right: -1px;
   content: '|';
   color: #76889a;
   font-size: 16px;
   position: absolute;
   font-family: 'FontAwesome';

}

.post .post-views:after {

   left: 0;
   top: 1px;
   color: #76889a;
   font-size: 12px;
   content: '\f06e';
   position: absolute;
   font-family: 'FontAwesome';

} .post .post-views span { position: relative; } .post .post-views span:first-child {

   margin-right: 8px;
   padding-right: 8px;

} .post .post-views span:first-child:after {

   top: -1px;
   right: -1px;
   content: '|';
   color: #76889a;
   font-size: 16px;
   position: absolute;
   font-family: 'FontAwesome';

}

.post .post-content {

   width: 100%;
   overflow: hidden;
   text-align: justify;

} .post .post-content p:last-child { margin-bottom: 0; }

.post .post-more { margin-top: 20px; } .post .post-more a { font-size: 14px; }


/* ==========================================================================

  23. Sidbar

========================================================================== */ /* 23.1 Wrapper


*/
  1. sidebar {
   width: 100%;
   margin-bottom: 30px;

}

/* 23.2 Widget


*/

/* 23.2.1 Wrapper


*/

.widget {

   width: 100%;
   overflow: hidden;
   margin-bottom: 30px;

}

/* 23.2.2 Widget Title


*/

.widget-title {

   width: 100%;
   position: relative;
   margin-bottom: 25px;

} .widget-title:after {

   top: 0;
   right: 0;
   color: #76889a;
   font-size: 11px;
   position: absolute;
   font-family: 'FontAwesome';
   content: '\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9';

} .widget .widget-title h4 {

   font-weight: 400;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

}

/* 23.2.3 Widget Content


*/

.widget-content { position: relative; }

/* 23.2.4 Search Widget


*/

.widget.search .form-control { width: 100%;

   height: 60px;
   outline: none;
   margin: 0 auto;
   font-size: 17px;
   position: relative;

background-color: #ffffff;

   padding: 10px 45px 10px 15px;
   -webkit-box-shadow: none;
      -moz-box-shadow: none;
        -o-box-shadow: none;
           box-shadow: none;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;
   -webkit-border: 1px solid #B2C4D6;
      -moz-border: 1px solid #B2C4D6;
        -o-border: 1px solid #B2C4D6;
           border: 1px solid #B2C4D6;

} .widget.search .form-control:hover, .widget.search .form-control:focus {

   -webkit-box-shadow: none;
      -moz-box-shadow: none;
        -o-box-shadow: none;
           box-shadow: none;
   -webkit-border: 1px solid #B2C4D6;
      -moz-border: 1px solid #B2C4D6;
        -o-border: 1px solid #B2C4D6;
           border: 1px solid #B2C4D6;

} .searchform { position: relative; } .widget.search .searchform:after {

   top: 17px;
   right: 15px;
   color: #76889a;
   font-size: 20px;
   content: '\f002';
   position: absolute;
   font-family: 'FontAwesome';

}

/* 23.2.5 Category Widget


*/

.widget.category .widget-content {

   width: 100%;
   background-color: #f5f7f9;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

} .widget.category ul {

   margin: 0;
   padding: 0;
   list-style: none;

} .widget.category ul li {

   widows: 100%;
   display: block;
   -webkit-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
      -moz-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
        -o-border-bottom: 1px solid rgba(178, 196, 214, 0.3);
           border-bottom: 1px solid rgba(178, 196, 214, 0.3);

} .widget.category ul li:last-child {

   -webkit-border-bottom: none;
      -moz-border-bottom: none;
        -o-border-bottom: none;
           border-bottom: none;

} .widget.category ul li a {

   height: 60px;
   display: block;
   padding: 0 15px;
   font-size: 14px;
   font-weight: 400;
   line-height: 60px;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

} .widget.category .widget-content ul li a:hover { color: #ff3131; } .widget.category .widget-content ul li a span:first-child {

   float: left;
   text-transform: uppercase;

} .widget.category .widget-content ul li a span:last-child { float: right; }

/* 23.2.6 Popular Widget


*/

.widget.popular {

   margin-bottom: 0;
   text-align: center;

} .widget.popular .widget-title { text-align: left; } .widget.testimonials .client-item .client-content {

   text-align: left;
   -webkit-border: none;
      -moz-border: none;
        -o-border: none;
           border: none;

} .widget.testimonials .client-item .client-content:after { display: none; }

/* 23.2.7 Flickr Widget


*/

/* 23.2.7.1 Wrapper


*/

.widget.flickr { margin-bottom: 20px; }

/* 23.2.7.2 Flickr Feed


*/

/* 23.2.7.2.1 Wrapper


*/

.widget.flickr .flickr-feed {

   margin: 0;
   padding: 0;
   width: 100%;
   overflow: hidden;
   list-style: none;
   text-align: center;

}

/* 23.2.7.2.2 Items


*/

.widget.flickr li {

   padding: 0;
   text-align: center;
   margin: 0 0 10px 0;
   display: inline-block;
   margin: 0 10px 10px 0;
   -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
        -o-border-radius: 5px;
           border-radius: 5px;

} .widget.flickr li:nth-child(3n) { margin-right: 0; }

/* 23.2.7.2.3 Image


*/

.widget.flickr li img {

   width: 80px;
   height: 80px;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

/* 23.2.7.2.4 Anchor


*/

.widget.flickr li:hover { opacity: 0.7; }

/* 23.2.8 Tags Widget


*/

.widget.tags { margin-bottom: 20px; } .widget.tags ul {

   margin: 0;
   padding: 0;
   list-style: none;

} .widget.tags ul li {

   float: left;
   display: inline-block;
   margin: 0 10px 10px 0;

}



/* ==========================================================================

  24. Posts LeftSidebar

========================================================================== */

  1. posts-section.left-sidebar .col-md-9,
  2. posts-section.left-sidebar .col-md-3 {
   float: right;

}

  1. posts-section.left-sidebar .post .info {
   float: right;
   margin-right: 0;
   margin-left: 30px;

}

  1. posts-section.left-sidebar .pagination { margin: 0 0 30px 0; }



/* ==========================================================================

  25. Single Post

========================================================================== */ /* 25.1 Post Comments


*/

/* 25.1.1 Wrapper


*/

.post-comments {

   width: 100%;
   overflow: hidden;
   margin: 0 0 30px;
   position: relative;
   padding-left: 100px;

}

/* 25.1.2 Title


*/

.post-comments .comments-title {

   width: 100%;
   overflow: hidden;
   position: relative;
   margin-bottom: 30px;

} .post-comments .comments-title h4 {

   font-weight: 400;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

} .post-comments .comments-title:after {

   top: 0;
   right: 0;
   color: #76889a;
   font-size: 11px;
   position: absolute;
   font-family: 'FontAwesome';
   content: '\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9';

}

/* 25.1.3 Comments


*/

.post-comments .comments {

   width: 100%;
   margin: 0 0 0;
   overflow: hidden;
   position: relative;

} .post-comments .comments ul {

   margin: 0;
   padding: 0;
   list-style: none;

} .post-comments .comments ul ul { padding-left: 100px; } .post-comments .comments ul li {

   width: 100%;
   display: block;

} .post-comments .comment {

   width: 100%;
   overflow: hidden;
   margin-bottom: 30px;

}

/* 25.1.4 Avatar


*/

.post-comments .comment-avatar {

   float: left;
   overflow: hidden;
   margin-right: 30px;
   display: inline-block;

-webkit-border-radius: 6px;

      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

} .post-comments .comment-avatar img {

   width: 70px;
   height: 70px;
   display: block;

}

/* 25.1.5 Container


*/

.post-comments .comment-container {

   float: left;
   padding: 15px;
   overflow: hidden;
   display: inline-block;
   background-color: #f5f7f9;
   width: calc(100% - 100px);

-webkit-border-radius: 6px;

      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

}

/* 25.1.6 Header


*/

.post-comments .comment-header {

   overflow: hidden;
   margin-bottom: 15px;

}

/* 25.1.7 Comment Title


*/

.post-comments .comment-title {

   float: left;
   overflow: hidden;
   position: relative;
   padding-bottom: 15px;

} .post-comments .comment-title h4 {

   font-weight: 300;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

} .post-comments .comment-title:after {

   left: 0;
   bottom: 0;
   content: ;
   height: 1px;
   width: 100px;
   font-size: 9px;
   position: absolute;
   background-color: #76889a;
   font-family: 'FontAwesome';

}

/* 25.1.8 Date


*/

.post-comments .comment-date {

   float: right;
   overflow: hidden;

} .post-comments .comment-date h6 {

   color: #76889a;
   font-weight: 700;
   text-transform: uppercase;

} .post-comments .comment-date span {

   float: left;
   line-height: 12px;
   display: inline-block;

} .post-comments .comment-flag i {

   color: #ff3131;
   margin-left: 10px;
   line-height: 12px;

}

/* 25.1.9 Content


*/

.post-comments .comment-content {

   width: 100%;
   overflow: hidden;

} .post-comments .comment-content p { color: #76889a; }

/* 25.1.10 Replay


*/

.post-comments .comment-replay {

   width: 100%;
   display: block;
   font-weight: 400;
   padding: 6px 12px;
   position: relative;
   background-color: #ffffff;
   text-transform: uppercase;

-webkit-border-radius: 6px;

      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;

} .post-comments .comment-replay:after {

   top: 5px;
   right: 12px;
   content: '\f075';
   position: absolute;
   font-family: 'FontAwesome';

} .post-comments .comment-replay:hover { color: #ff3131; }

/* 25.1.11 Comment Form


*/

/* 25.1.11.1 Wrapper


*/

.comments-form {

   width: 100%;
   overflow: hidden;

}

/* 25.1.11.2 Textarea


*/

.comments-form textarea { width: 100%;

   resize: none;
   margin: 0 auto 30px;
   height: 142px !important;

}

/* 25.1.11.3 form-control


*/

.comments-form .form-control { width: 100%;

   height: 42px;
   outline: none;

padding: 10px 15px;

   margin: 0 auto 30px;

background-color: #ffffff;

   -webkit-box-shadow: none;
      -moz-box-shadow: none;
        -o-box-shadow: none;
           box-shadow: none;
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
        -o-border-radius: 6px;
           border-radius: 6px;
   -webkit-border: 1px solid #B2C4D6;
      -moz-border: 1px solid #B2C4D6;
        -o-border: 1px solid #B2C4D6;
           border: 1px solid #B2C4D6;

} .contactForm .form-control:hover, .contactForm .form-control:focus {

   -webkit-box-shadow: none;
      -moz-box-shadow: none;
        -o-box-shadow: none;
           box-shadow: none;
   -webkit-border: 1px solid #B2C4D6;
      -moz-border: 1px solid #B2C4D6;
        -o-border: 1px solid #B2C4D6;
           border: 1px solid #B2C4D6;

}

/* 25.1.11.4 Button


*/

.comments-form button.submit {

   width: 100%;
   outline: none;
   color: #76889a;
   font-weight: 300;
   padding: 10px 16px;
   margin-bottom: 30px;
   background-color: #ffffff;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   -webkit-border-color: #76889a;
      -moz-border-color: #76889a;
        -o-border-color: #76889a;
           border-color: #76889a;

} .comments-form .submit.active, .comments-form .submit:active, .comments-form .submit.focus, .comments-form .submit:focus, .comments-form .submit:hover { color: #ffffff;

   outline-width: 0;
   position: relative;
   background-color: #76889a;

}

/* 25.2 Related Posts


*/

/* 25.2.1 Wrapper


*/
  1. related-section {
   margin: 0;
   width: 100%;
   padding: 0 0 70px;
   background-color: #ffffff;

}

/* 25.2.2 Title


*/

.blog-section-title {

   width: 100%;
   overflow: hidden;
   position: relative;
   margin-bottom: 30px;

} .blog-section-title h4 {

   font-weight: 400;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;

} .blog-section-title:after {

   top: 0;
   right: 0;
   color: #76889a;
   font-size: 11px;
   position: absolute;
   font-family: 'FontAwesome';
   content: '\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9\f0c9';

}



/* ==========================================================================

  26. Bootstrap

========================================================================== */ .pagination { margin: 0 0 30px 100px; } .pagination > li > a, .pagination > li > span {

   color: #76889a;

} .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {

   color: #76889a;
   background-color: #f5f7f9;

} .btn:focus, .btn:active:focus, .btn.active:focus {

   outline: none;

} .btn-nesto-home { background-color: #ff3131; } .btn-nesto-home:focus, .btn-nesto-home:active, .btn-nesto-home:hover {

   background-color: #0f191e;

}

.btn.btn-nesto {

   font-weight: 300;
   font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   -webkit-border-color: #b2c4d6;
      -moz-border-color: #b2c4d6;
        -o-border-color: #b2c4d6;
           border-color: #b2c4d6;

} .btn-nesto {

   color: #76889a;
   background-color: transparent;

} .btn-nesto:focus, .btn-nesto:active, .btn-nesto:hover {

   color: #ffffff;
   background-color: #76889a;
   -webkit-border-color: #76889a;
      -moz-border-color: #76889a;
        -o-border-color: #76889a;
           border-color: #76889a;

}



/* ==========================================================================

  27. Responsive

========================================================================== */ @media only screen and (min-width: 992px) and (max-width: 1199px) {

   #home-section-wrapper .slogan h1 { font-size: 40px; }
   #home-blog-section-wrapper .slogan h1 { font-size: 40px; }
   .ui-slider-tabs-list li a,
   .ui-slider-tabs-list li { width: 235px; }
   .price-table .table-desc p { font-size: 16px; }
   .widget.flickr li img {
       width: 64px;
       height: 64px;
   }

}



/*-------------------------------------------------------------------------*/ @media only screen and (max-width: 991px) and (min-width: 768px) {

   .left .feature-box-style-1:first-child { margin-top: 00px; }
   .left .feature-box-style-1:last-child { margin-bottom: 0px; }
   .right .feature-box-style-1:first-child { margin-top: 70px; }
   .right .feature-box-style-1:last-child { margin-bottom: 120px; }
   #home-section-wrapper .feature-home-image { max-height: 757px; }
   .ui-slider-tabs-list li a,
   .ui-slider-tabs-list li { width: 240px; }
   .no-pad-left,
   .no-pad-right { padding: 0; }
   #team-section .ui-slider-tabs-list-container {
       float: none;
       margin: 0 auto !important;
   }
   #team-section .member-image { margin-bottom: 50px; }
   .faqcontent .mini-feature-list { width: 100%; }
   .faqcontent .mini-feature-list:first-child,
   .faqcontent .mini-feature-list:last-child { padding: 0; }
   .mini-post,
   .portfolio-item,
   .price-table { max-width: 100%; }
   .widget.popular .mini-post {
       float: none;
       max-width: 263px;
       margin-right: 30px;
       display: inline-block;
   }
   .widget.popular .mini-post:last-child { margin-right: 0; }
   .widget.flickr li:nth-child(3n) { margin-right: 10px; }
   .widget.flickr li:last-child { margin-right: 0; }
   #posts-section.left-sidebar .col-md-3 { width: 100%; }

}



/*-------------------------------------------------------------------------*/ @media only screen and (max-width: 767px) {

   .container { width: 570px; }
   .left .feature-box-style-1:first-child { margin-top: 100px; }
   .left .feature-box-style-1:last-child { margin-bottom: 0px; }
   .right .feature-box-style-1:first-child { margin-top: 70px; }
   .right .feature-box-style-1:last-child { margin-bottom: 0px; }
   #home-section-wrapper .feature-home-image { max-height: 757px; }
   .ui-slider-tabs-list li a,
   .ui-slider-tabs-list li { width: 270px; }
   #team-section .ui-slider-tabs-list-container,
   #team-section .ui-slider-tabs-list-wrapper { width: 540px; }
   #team-section .ui-slider-tabs-list li { margin-left: 15px; }
   #team-section .member-image { margin-bottom: 50px; }
   .section-title h1 { font-size: 50px; }
   .faq-tabs ul.faq-tabs-btns { width: 100%; }
   .faq-tabs .col-md-6 { overflow: hidden; }
   #subscribe .form-control { width: 400px; }
   .no-pad-left,
   .no-pad-right { padding: 0; }
   .faqcontent .mini-feature-list:first-child,
   .faqcontent .mini-feature-list:last-child { padding: 0; }
   .widget.flickr li:nth-child(3n) { margin-right: 10px; }
   .widget.flickr li:last-child { margin-right: 0; }
   .widget.flickr li img {
       height: 81px;
       width: 81px;
   }
   #posts-section.left-sidebar .col-md-3 { width: 100%; }

}


/*-------------------------------------------------------------------------*/ @media only screen and (max-width: 599px) {

   .container { width: 450px; }
   #home-section-wrapper .slogan h1 { font-size: 38px; }
   #home-blog-section-wrapper .slogan h1 { font-size: 38px; }
   #home-section-wrapper .buttons a { margin-right: 0; }
   #home-blog-section-wrapper .buttons a { margin-right: 0; }
   .section-title h1 { font-size: 40px; }

.section-title_ h1 { font-size: 40px; }

   .ui-slider-tabs-list li a,
   .ui-slider-tabs-list li { width: 420px; }
   #team-section .ui-slider-tabs-list-container,
   #team-section .ui-slider-tabs-list-wrapper { width: 420px; }
   #team-section .ui-slider-tabs-list li { margin-left: 30px; }
   .faqcontent .mini-feature-list { width: 100%; }
   #subscribe .form-control { width: 280px; }
   #footer-section { height: 84px; }
   .footer-social-icons ul li { width: 84px; }
   .post .info { display: none; }
   .post .post-data { width: 100%; }
   .pagination { margin: 0 0 30px; }
   .widget.flickr li:nth-child(4n) { margin-right: 0; }
   .widget.flickr li img {
       height: 97px;
       width: 97px;
   }


   .post-comments .comments ul ul,
   .post-comments { padding-left: 0; }
   .post-comments .comment-avatar { display: none; }
   .post-comments .comment-container { width: 100%; }

}



/*-------------------------------------------------------------------------*/ @media only screen and (max-width: 479px) {

   .container { width: 320px; }
   #home-section-wrapper .slogan h1 { font-size: 28px; }
   #home-blog-section-wrapper .slogan h1 { font-size: 28px; }
   .section-title h1 { font-size: 28px; }
   .ui-slider-tabs-list li a,
   .ui-slider-tabs-list li { width: 290px; }
   #team-section .ui-slider-tabs-list-container,
   #team-section .ui-slider-tabs-list-wrapper { display: none; }
   #team-section .ui-slider-tabs-indicator-container { top: 480px; }
   #subscribe .form-control { width: 180px; }
   #subscribe button.submit { width: 140px; }
   #footer-section { height: 58px; }
   .footer-social-icons ul li { width: 58px; }
   .footer-social-icons ul li a {
       font-size: 20px;
       line-height: 58px;
   }
   .widget.flickr li img {
       width: 65px;
       height: 65px;
   }

}