@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,700);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic);
@import url(https://fonts.googleapis.com/css?family=Raleway:400,900,800,700,600,500,300,200,100);

/**-----------------------------------------------------------------
    ----------------------------------------------------------------
    [Table of contents]

    1. Body and general styles
    2. Header
    3. Section ABOUT
    4. Section SLIDES
    5. Section PROMO
    6. Section DIGITS
    7. Section PRICE
    8. Section CITATE
    9. Section TEAM
    10. Section BUY
    11. Section CONTACTS
    12. Footer
    13. Popups
    14. Blog. List of articles
    15. Article
    16. Gallery
    17. Customization

    ----------------------------------------------------------------
    [Color guide]

    PAGE BACKGROUND
        pure white - #fff
        smoke white - #f8f8f8
        footer top - #2f383d
        footer bottom - #0c1215
    PARAGRAPHS:
        dark grey - #3d3d3d
    HEADINGS:
        center title - #393939
        white title - #fff
    UI:
        blue - #127deb
        white - #fff (accent color on hover)

    ----------------------------------------------------------------
    [Typography guide]

    DEFAULT:
        "Open Sans" 14px
    HEADINGS
        "Raleway" 40px
    ---------------------------------------------------------------**/


/**--------------------------------------------------------------
    [1. Body and general styles]
    --------------------------------------------------------------**/
html, body {
	height: 100%; 
}
body {
	background: #fff;
	color: #3d3d3d;
	font: 14px/24px 'Open Sans', 'Tahoma', sans-serif; 
}

a {
	color: #000; 
    -webkit-transition: all 0.15s ease;
    -moz-transition: all 0.15s ease;
    -o-transition: all 0.15s ease;
    transition: all 0.15s ease; 
    outline:0;
}
    a:hover {
    	color: #127deb;
        outline:0;
    }	
    a:focus{
        outline:0;
        color: #127deb;
    }
button{
    -webkit-transition: all 0.15s ease;
    -moz-transition: all 0.15s ease;
    -o-transition: all 0.15s ease;
    transition: all 0.15s ease; 
}
.b-left {
	float: left; 
}	
.b-right {
	float: right; 
}	
.clear {
	clear: both; 
}	

.wrapper {
	height: auto !important;
	margin: 0 auto;
	min-height: 100%;
	position: relative; 
}	

.in {
	min-width: 920px;
	max-width: 1400px;
	width: 83%;
	margin: 0 auto;
	padding: 0 40px; 
    position: relative;
}	

.title{
    text-align: center;
    font: 700 40px/1em Raleway;
    color: #2f383d;
    margin-bottom: 25px;
    text-transform: uppercase;
}
.center-title{
    text-align: center;
    font: 700 40px/1em Raleway;
    color: #393939;
    padding-bottom: 25px;
    position: relative;
    margin-bottom: 75px;
    text-transform: uppercase;
}
    .center-title:after{
        position: absolute;
        content: '';
        width: 64px;
        height: 2px;
        background: #127deb;
        bottom: 0;
        left: 50%;
        margin-left: -32px;
    }
.white-title{
    color: #fff;
}
    .white-title:after{
        background:#fff;
    }
.center-text{
    font: 18px/26px Raleway;
    color: #2e2e2e;
    margin-bottom: 100px;
    text-align: center;
}
.left-title{
    font: 700 34px/1em Raleway;
    text-transform: uppercase;
    position: relative;
    margin-bottom: 30px;
}
.button{
    border-radius: 2px;
    font: 700 13px/46px Raleway;
    height: 50px;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 33px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
/**--------------------------------------------------------------
    [2. Header]
    --------------------------------------------------------------**/
.header {
    padding: 200px 0 30px;
    position: relative;
    background: #137fec;
}	
    .header:before{
        position: absolute;
        content: '';
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: url(../images/bg1.jpg) fixed center center no-repeat;
        background-size: cover;
        opacity: 0.08;
        z-index: 1;
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%);
    }
    .header .container{
        position: relative;
        z-index: 3;
    }
    .logo{
        margin-bottom: 20px;
    }
    .main-nav-list{
        margin-bottom: 20px;
        margin-top: 3px;
        float: right;
        white-space: nowrap;
    }
    .main-nav-item{
        text-align: center;
        display: inline-block;
        vertical-align: middle;
        margin: 0 5px;
    }
    .main-nav-item a{
        color: #fff;
        font: 600 14px/20px Raleway;
        padding: 0 5px;
        text-decoration: none;
        opacity: 0.5;
        position: relative;
        display: inline-block;
    }
    .main-nav-item a:hover{
        color: #fff;
        opacity: 1;
        text-decoration: none;
    }
    .main-nav-item.active a{
        opacity: 1;
        pointer-events:none;
    }
    .main-nav-item.active-link a{
        pointer-events:auto;
    }
    .main-nav-item a:after{
        position: absolute;
        content: '';
        width: 0;
        height: 1px;
        background: #fff;
        bottom: 0;
        left: 0;
        -webkit-transition: all 0.15s ease;
        -moz-transition: all 0.15s ease;
        -o-transition: all 0.15s ease;
        transition: all 0.15s ease; 
    }
    .main-nav-item a:hover:after{
        width: 100%;
    }
    .main-nav-item.active a:after{
        width: 100%;
    }
    .nav-icon{
        display: none;
        float: right;
        font-size: 28px;
        color: #fff;
        cursor: pointer;
    }
.main-title{
    font: 900 53px/64px Raleway;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 20px;
}
    .main-title-dark{
        color: #273140;
    }
.main-anons{
    margin-bottom: 46px;
    font: 21px/26px Roboto;
    color: #fff;
    text-align: center;
}
.email-form{
    text-align: center;
    margin-bottom: 225px;
    white-space: nowrap;
}
    .email-input{
        background: none;
        border: 1px solid #fff;
        border-radius: 2px 0 0 2px;
        display: inline-block;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 27px;
        font: 17px/46px Roboto;
        color: #fff;
        height: 50px;
        vertical-align: middle;
        width: 400px;
    }    
    .email-input::-webkit-input-placeholder {color:#fff; opacity:0.7;}
    .email-input::-moz-placeholder          {color:#fff; opacity:0.7;}/* Firefox 19+ */
    .email-input:-moz-placeholder           {color:#fff; opacity:0.7;}/* Firefox 18- */
    .email-input:-ms-input-placeholder      {color:#fff; opacity:0.7;}
    .email-btn{
        background: #fff;
        border-radius: 0 2px 2px 0;
        color: #127deb;
        vertical-align: middle;
        margin-left: -1px;
        border: 2px solid #fff;
    }
        .email-btn:hover{
            background: #127deb;
            color: #fff;
        }
.header-fixed{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 20px 0 1px;
    z-index: 500;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; 
}
    .header-fixed.active{
        background: rgba(18,125,235,0.9);
    box-shadow: 0 2px 10px 0 rgba(0,1,1,0.75);
    }

/**--------------------------------------------------------------
    [3. Section ABOUT]
    --------------------------------------------------------------**/
.about{
    background: #fff;
    padding: 100px 0;
}
    .about-image{}
        .about-image img{
            max-width: 100%;
            max-height: 100%;
        }
    .about-info{
        padding: 20px 0;
    }
    .about-title{
    }
    .about-text{
        padding-bottom: 25px;
    }
        .about-text p{
            margin-bottom: 15px;
        }
    .about-buttons{}
    .about-btn{
        color: #fff;
        background: #393939;
        border: 2px solid #393939;
    }
        .about-btn:hover{
            background: #fff;
            color: #393939;
        }

/**--------------------------------------------------------------
    [4. Section SLIDES]
    --------------------------------------------------------------**/
.slide{
    background: #f8f8f8;
    padding: 100px 0;
}
    .slide-info{}
    .slide-title{
        font: 700 40px/1em Raleway;
        color: #393939;
        text-transform: uppercase;
        margin-bottom: 45px;
    }
    .slide-text{
        padding-bottom: 30px;
    }
        .slide-text p{
            margin-bottom: 15px;
        }
    .slide-button{}
    .slide-btn{
        border: 2px solid #003c79;
        color: #fff;
        background: #003c79;
    }
        .slide-btn:hover{
            background: #fff;
            color: #003c79;
        }
    .slide-image{
        margin-bottom: 30px;
    }
        .slide-image img{
            max-width: 100%;
            max-height: 100%;
        }
    .slide-nav{
        text-align: center;
        margin-top: 40px;
    }
        .slide-nav li{
            display: inline-block;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            width: 18px;
            height: 18px;
            border: 3px solid #003c79;
            cursor: pointer;
            border-radius: 10px;
            margin-right: 14px;
            -webkit-transition: all 0.15s ease;
            -moz-transition: all 0.15s ease;
            -o-transition: all 0.15s ease;
            transition: all 0.15s ease; 
        }
        .slide-nav li:hover{
            background: #003c79;
        }
        .slide-nav li.active{
            background: #003c79;
            pointer-events:none;
        }
        .slide-nav li:last-child{
            margin-right: 0;
        }
.list{
    padding-bottom: 20px;
}
    .list-item{
        margin-bottom: 15px;
        padding-left: 47px;
        color: #393939;
        position: relative;
    }
    .list-item:before{
        position: absolute;
        content: '';
        width: 21px;
        height: 21px;
        background: url(../images/icons.png) 0 0 no-repeat;
        left: 2px;
        top: 0;
    }

/**--------------------------------------------------------------
    [5. Section PROMO]
    --------------------------------------------------------------**/
.promo{
    padding: 100px 0 70px;
    background: #127deb;
    position: relative;
}
    .promo:before{
        position: absolute;
        content: '';
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: url(../images/bg2.jpg) fixed center center no-repeat;
        background-size: cover;
        opacity: 0.08;
        z-index: 1;
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%);
    }
    .promo .container{
        position: relative;
        z-index: 3;
    }
    .promo-text{
        color: #fff;
    }
    .promo-video{
        margin: 0 auto 65px;
        max-width: 640px;
        position: relative;
        width: 100%;
    }
        .promo-video img{
            max-width: 100%;
        }
        .promo-video iframe{
            width: 100%;
            height: 480px;
        }
    .promo-bg{
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgba(18,125,235,0.61);
        z-index: 5;
        top: 0;
        left: 0;
    }
    .promo-play{
        position: absolute;
        width: 70px;
        height: 70px;
        border-radius: 36px;
        top: 50%;
        left: 50%;
        margin-top: -35px;
        margin-left: -35px;
        background: rgba(0,0,0,0.5);
        cursor: pointer;
        z-index: 7;
        -webkit-transition: all 0.15s ease;
        -moz-transition: all 0.15s ease;
        -o-transition: all 0.15s ease;
        transition: all 0.15s ease; 
    }
        .promo-play:after{
            position: absolute;
            content: '';
            width: 0;
            height: 0;
            border-top: 15px solid transparent;
            border-left: 16px solid #fff;
            border-bottom: 15px solid transparent;
            top: 50%;
            left: 50%;
            margin-top: -15px;
            margin-left: -5px;
        }
        .promo-play:hover{
            background: rgba(0,0,0,1);
        }
    .promo-social{
        text-align: center;
    }
        .promo-social span{
            font-size: 18px;
            color: #fff;
            display: inline-block;
            vertical-align: middle;
        }
        .promo-social a{
            margin: 0 15px;
            display: inline-block;
            vertical-align: middle;
            color: #fff;
            font-size: 22px;
        }
        .promo-social a:hover{
            opacity: 0.7;
            color: #fff;
        }

/**--------------------------------------------------------------
    [6. Section DIGITS]
    --------------------------------------------------------------**/
.digits{
    padding: 100px 0 70px;
    background: #f8f8f8;
}
    .digits-item{
        width: 260px;
        margin: 0 auto 30px;
    }
    .digits-circle{
        margin-bottom: 55px;
        position: relative;
        height: 230px;
    }
    .digits-circle-inner{
        position: absolute;
        width: 230px;
        height: 230px;
        font: 54px/230px Roboto;
        color: #127deb;
        text-align: center;
        border-radius: 167px;
        top:0;
        left: 0;
        background: #fff;
    }
    .digits-circle canvas{
        z-index: 20;
        position: relative;
    }
    .digits-item-text{
        padding-left: 50px;
        font: 18px/24px Roboto;
        color: #2e2e2e;
        position: relative;
    }
    .digits-item-text .fa{
        color: #127deb;
        font-size: 34px;
        position: absolute;
        left: 0;
        top: 7px;
    }
    .digits-item-text .fa-mobile{
        font-size: 50px;
        top: 0;
    }

/**--------------------------------------------------------------
    [7. Section PRICE]
    --------------------------------------------------------------**/
.price{
    padding: 100px 0 70px;
    background: #fff;
}
    .price-item{
        border: 2px solid #e6e6e6;
        border-radius: 2px;
        padding: 0 30px 45px;
        margin-bottom: 30px;
        position: relative;
    }
        .price-item:after{
            content: '';
            display: block;
            clear: both;
            width: 1px;
        }
    .price-item-top{
        background: #003c79;
        font: bold 18px/1em Roboto;
        color: #fff;
        padding: 20px;
        text-align: center;
        text-transform: uppercase;
        margin: -2px -32px 35px;
        border-radius: 2px 2px 0 0;
    }
    .price-value{
        color: #ff5500;
        font: 29px Roboto;
        text-align: center;
        margin-bottom: 35px;
    }
        .price-value sup{
            font-size: 23px;
            padding-right: 3px;
        }
    .price-list{
        margin-bottom:100px;
    }
    .price-list li{
        padding-left: 20px;
        margin-left: 10px;
        margin-bottom: 13px;
        line-height: 20px;
        position: relative;
        color: #4d4a4a;
    }
        .price-list li:before{
            position: absolute;
            content: '';
            width: 12px;
            height: 14px;
            left: 0;
            background: url(../images/icons.png) -49px 0 no-repeat;
            top: 0;
        }
    .price-btn{
        width: 150px;
        text-align: center;
        border: 2px solid #003c79;
        padding: 0;
        background: #003c79;
        color: #fff;
        position: absolute;
        bottom: 45px;
        left: 50%;
        margin-left: -75px;
    }
        .price-btn:hover{
            background: #fff;
            color: #003c79;
        }
.color-price-item{
    background: #ff5500;
    border-color: #ff5500;
}
    .color-price-item .price-item-top{
        background: #c54200;
    }
    .color-price-item .price-value,
    .color-price-item .price-list li{
        color: #fff;
    }
    .color-price-item .price-list li:before{
        background-position: -49px -15px;
    }
    .color-price-item .price-btn{
        background: #fff;
        color: #ff5500;
        border-color: #fff;
    }
        .color-price-item .price-btn:hover{
            color: #fff;
            background: #ff5500;
        }

/**--------------------------------------------------------------
    [8. Section CITATE]
    --------------------------------------------------------------**/
.citate{
    padding: 100px 0;
    background: #f8f8f8;
}
    .citate-item{
        text-align: center;
    }
    .citate-photo{
        margin-bottom: 18px;
    }
        .citate-photo img{
            display: block;
            margin: 0 auto;
            border-radius: 50%;
        }
    .citate-text{
        color: #4d4a4a;
        font: 23px/28px Roboto;
        max-width: 800px;
        margin: 0 auto 45px;
    }
    .citate-author{
        color: #4d4a4a;
        font: 600 23px Roboto;
        margin-bottom: 10px;
    }
    .citate-position{
        color: #858585;
        font: 19px/24px Roboto;
    }

/**--------------------------------------------------------------
    [9. Section TEAM]
    --------------------------------------------------------------**/
.team{
    padding: 100px 0 70px;
    background: #fff;
}
    .team-item{
        margin-bottom: 30px;
    }
    .team-image{
        position: relative;
    }
        .team-image img{
            width: 100%;
        }
    .team-image-hover{
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: rgba(57,146,235,0.7);
        opacity: 0;
        -webkit-transition: all 0.15s ease;
        -moz-transition: all 0.15s ease;
        -o-transition: all 0.15s ease;
        transition: all 0.15s ease; 
    }
    .team-item:hover .team-image-hover{
        opacity: 1;
    }
    .team-info{
        border: 1px solid #e6eaec;
        border-top: none;
        padding: 15px 20px 33px;
        position: relative;
    }
    .team-name{
        color: #2f383d;
        font-size: 16px;
        margin-bottom: 5px;
    }
    .team-position{
        color: #6d7a83;
        margin-bottom: 15px;
    }
    .team-about{
        color: #9fa4a8;
        font: 13px/18px 'Open Sans';
    }

/**--------------------------------------------------------------
    [10. Section BUY]
    --------------------------------------------------------------**/
.buy{
    padding: 70px 0;
    background: #f8f8f8;
}
    .buy-title{
        color: #2e2e2e;
        font: 21px Roboto;
        text-transform: uppercase;
        margin-bottom: 15px;
    }
    .buy-text{
        color: #9aa7af;
        margin-bottom: 30px;
    }
    .buy-btn{
        width: 150px;
        color: #fdfdfd;
        background: #003c79;
        border: 2px solid #003c79;
        margin-top: 6px;
        float: right;
    }
        .buy-btn:hover{
            background: inherit;
            color: #003c79;
        }

/**--------------------------------------------------------------
    [11. Section CONTACTS]
    --------------------------------------------------------------**/
.contacts{
    position: relative;
    padding-top: 100px;
}
    .contacts-info{
        position: relative;
    }
    .contacts-block{
        padding: 65px 0;
    }
    .contacts-title{
        font: 700 40px/1em Raleway;
        color: #2f383d;
        text-transform: uppercase;
        margin-bottom: 30px;
    }
    .contacts-text{
        font: 18px/24px Roboto;
        color: #2e2e2e;
        margin-bottom: 50px;
    }
    .contacts-form{}
    .contacts-form-row{
        margin-bottom: 30px;
    }
    .contacts-input{
        width: 47%;
        margin-right: 6%;
        float: left;
        padding: 0 20px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border: 1px solid #ccc;
        border-radius: 2px;
        font: 14px/48px Roboto;
        height: 50px;
    }
        .contacts-input + .contacts-input{
            margin-right: 0;
        }
    .contacts-input::-webkit-input-placeholder {color:#ccc; opacity:1;}
    .contacts-input::-moz-placeholder          {color:#ccc; opacity:1;}/* Firefox 19+ */
    .contacts-input:-moz-placeholder           {color:#ccc; opacity:1;}/* Firefox 18- */
    .contacts-input:-ms-input-placeholder      {color:#ccc; opacity:1;}
    .contacts-textarea{
        width: 100%;
        height: 150px;
        resize:none;
        padding: 0 20px;
        border: 1px solid #ccc;
        border-radius: 2px;
        font: 14px/48px Roboto;
    }
    .contacts-textarea::-webkit-input-placeholder {color:#ccc; opacity:1;}
    .contacts-textarea::-moz-placeholder          {color:#ccc; opacity:1;}/* Firefox 19+ */
    .contacts-textarea:-moz-placeholder           {color:#ccc; opacity:1;}/* Firefox 18- */
    .contacts-textarea:-ms-input-placeholder      {color:#ccc; opacity:1;}
    .contacts-btn{
        width: 100%;
        color: #fff;
        text-align: center;
        background: #1080f2;
        border: 2px solid #1080f2;
    }
        .contacts-btn:hover{
            background: #fff;
            color: #1080f2;
        }
.map{
    position: absolute;
    top: 0;
    left: 0;
    width: 45%;
    height: 100%;
}
    .map iframe{
        width: 100%;
        height: 100%;
        border:0;
    }

/**--------------------------------------------------------------
    [12. Footer]
    --------------------------------------------------------------**/
.footer {}	
/*--------------- Footer top --------------*/
.footer-top{
    background: #2f383d;        
    padding: 70px 0 20px;
}
    .footer-item{
        text-align: center;
        color: #fff;
        margin-bottom: 40px;
    }
    .footer-title{
        font-weight: 700;
        text-transform: uppercase;
        margin-bottom: 15px;
    }
    .footer-text{
        color: rgba(255,255,255,0.7);
    }
    .footer-social{
        padding-top: 5px;
    }
        .footer-social a{
            display: inline-block;
            width: 40px;
            height: 40px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            border: 2px solid #fff;
            border-radius: 2px;
            position: relative;
            margin: 0 3px;
            color: #fff;
            line-height: 36px
        }
        .footer-social a:hover{
            background: #fff;
            color: #2f383d; 
        }
/*-------------- /Footer top --------------*/
/*------------- Footer bottom -------------*/
.footer-bottom{
    background: #0c1215;
    padding: 25px 0;
    color: #43a0ff;
    font: 14px/22px Roboto;
    text-align: center;
}
    .footer-bottom a{
        color: #fff;
    }
    .footer-bottom a:hover{
        color: #43a0ff;
    }
/*------------ /Footer bottom -------------*/

/**--------------------------------------------------------------
    [13. Popups]
    --------------------------------------------------------------**/
.overlay{
    display:none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(18,125,234,0.83);
    z-index: 1000;
}
.popup{
    display:none;
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: #fff;
    width: 400px;
    min-width: 310px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 1100;
}
    .popup-inner{}
    .popup-close{
        position: absolute;
        cursor: pointer;
        width: 20px;
        height: 20px;
        background: #fff;
        border-radius: 11px;
        font-size: 11px;
        text-align: center;
        line-height: 20px;
        box-shadow: 0 2px 10px 0 rgba(0,1,1,0.75);
        color: #127deb;
        top:-10px;
        right: -10px;
    }
    .popup-close:hover{
        color: #fff;
        background: #222;
    }
    .popup-title{
        font: bold 27px/34px Roboto;
        color: #127deb;
        margin-bottom: 50px;
        text-transform: uppercase;
        text-align: center;
    }

.popup-thanks{
    border-radius: 3px;
    width: 90%;
    max-width: 440px;
    padding: 30px 30px 35px;
    text-align: center;
    box-shadow: 0 2px 10px 0 rgba(0,1,1,0.75);
}
    .thanks-text{
        color: #127deb;
        font: bold 28px/34px Roboto;
    }

.popup-send{
    max-width: 500px;
    width: 90%;
    border-radius: 10px;
    box-shadow: 0 10px 20px 0 rgba(0,1,1,0.36);
    padding: 55px 40px 50px;
}
    .popup-send-form{}
    .popup-send-row{
        margin-bottom: 20px;
    }
    .popup-send-input{
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        height: 50px;
        width: 100%;
        border: 1px solid #dfe6ed;
        padding: 0 15px;
        font: 14px/46px Roboto;
        color: #222;
        border-radius: 2px;
    }
    .popup-send-input::-webkit-input-placeholder {color:#aeb8c3; opacity:1;}
    .popup-send-input::-moz-placeholder          {color:#aeb8c3; opacity:1;}/* Firefox 19+ */
    .popup-send-input:-moz-placeholder           {color:#aeb8c3; opacity:1;}/* Firefox 18- */
    .popup-send-input:-ms-input-placeholder      {color:#aeb8c3; opacity:1;}
    .popup-send-button{
        color: #fff;
        width: 100%;
        background: #127deb;
        border: 2px solid #127deb;
        text-align: center;
    }
    .popup-send-button:hover{
        background: #fff;
        color: #127deb;
    }

/**--------------------------------------------------------------
    [14. Blog. List of articles]
    --------------------------------------------------------------**/
.inner-header{
    margin-bottom: 45px;
    height: 170px;
    padding-top: 30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.blog-item{
    background: #fff;
    box-shadow: 1px 1px 7px 0 rgba(0,0,0,0.2);
    border-radius: 7px;
    overflow: hidden;
    margin-bottom: 60px;
}
    .blog-item-image{
        position: relative;
    }
        .blog-item-image img{
            display: block;
            max-width: 100%;
        }
        .blog-item-image:after{
            position: absolute;
            content: '';
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(18,126,235,0.43);
        }
    .blog-item-info{
        padding: 18px 20px 20px;
    }
    .blog-item-title{
        font: bold 20px/24px Raleway;
        color: #127deb;
        margin-bottom: 4px;
        text-align: center;
    }
    .blog-item-date{
        margin-bottom: 12px;
        color: #717171;
        font-size: 13px;
        text-align: center;
    }
    .blog-item-anons{
        text-align: center;
        margin-bottom: 20px;
    }
    .blog-item-button{
        text-align: center;
    }
    .blog-btn{
        display: inline-block;
        height: 36px;
        border-radius: 5px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 120px;
        color: #fff;
        line-height: 30px;
        background: #127deb;
        border: 2px solid #127deb;
    }
        .blog-btn:hover,
        .blog-btn:focus{
            background: #fff;
            color: #127deb;
            text-decoration: none;
        }

/**--------------------------------------------------------------
    [15. Article]
    --------------------------------------------------------------**/
.article{
    border-radius: 7px 7px 0 0;
    box-shadow: 1px 1px 7px 0 rgba(0,0,0,0.2);
    background: #fff;
    overflow: hidden;
}
    .article-info{
        margin-top: -30px;
        margin-bottom: 30px;
        color: #717171;
    }
    .article-date{
        float: left;
    }
    .article-author{
        float: right;
    }
    .article-image{}
        .article-image img{
            width: 100%;
            display: block;
        }
    .article-text{
        padding: 36px 65px 25px;
        font: 17px/28px 'Open Sans';
        color: #717171;
    }
        .article-text a{
            color: #127deb;
        }
        .article-text p{
            margin-bottom: 40px;
        }
        /*.article-text p:first-letter{
            color: #137fec;
            font: bold 30px 'Open Sans';
        }*/
        .article-text h2{
            font-weight: bold;
            margin-bottom: 40px;
        }
        .article-text h3{
            font-weight: bold;
            margin-bottom: 30px;
        }
        .article-text blockquote{
            padding: 20px 30px;
            background: #eee;
            font-style: italic;
            text-align: right;
            margin: 0 -10px 40px;
        }
        .article-text ul,
        .article-text ol{
            padding-left: 40px;
            margin-bottom: 30px;
        }
        .article-text ul li,
        .article-text ol li{
            position: relative;
            font-size: 0.92em;
            line-height: 1.4em;
            margin-bottom: 10px;
        }
            .article-text ul li:before{
                position: absolute;
                content: '';
                width: 5px;
                height: 5px;
                border-radius: 3px;
                background: #818181;
                top: 8px;
                left: -13px;
            }
    .article-navig{
        margin-top: 90px;
    }
    .article-navig a{
        font: bold 15px/18px 'Open Sans';
        color: #2f383d;
        border-bottom: 2px solid #b7b9ba;
    }
        .article-navig a:hover{
            border-bottom-color: #9ac8f6;
            color: #127deb;
            text-decoration: none;
        }
    .article-prev{
        float: left;
    }
    .article-next{
        float: right;
    }

/**--------------------------------------------------------------
    [16. Gallery]
    --------------------------------------------------------------**/
.gallery{}
    .gallery-list{}
    .gallery-item{
        float: left;
        width: 16.666%;
        overflow: hidden;
        position: relative;
    }
        .gallery-item a{
            display: block;
        }
        .gallery-item img{
            display: block;
            width: 100%;
        }
        .gallery-item a:after{
            position: absolute;
            content: '';
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(18,126,235,0.43);
            opacity: 1;
            -webkit-transition: all 0.15s ease;
            -moz-transition: all 0.15s ease;
            -o-transition: all 0.15s ease;
            transition: all 0.15s ease; 
            z-index: 7;
        }
        .gallery-item a:hover:after{
            background: rgba(18,126,235,0.8);
        }
    .gallery-item-hover{
        position: absolute;
        top: 50%;
        left: 0;
        opacity: 0;
        width: 100%;
        max-height: 100%;
        color: #fff;
        text-align: center;
        z-index: 10;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%);
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 20px;
    }
        .gallery-item:hover .gallery-item-hover{
            opacity: 1;
        }
    .gallery-item-plus{
        width: 47px;
        height: 47px;
        display: inline-block;
        background: url(../images/icons.png) 0 -22px no-repeat;
    }
    .gallery-item-title{
        font: 20px/26px Roboto;
    }

/**--------------------------------------------------------------
    [17. Customization]
    --------------------------------------------------------------**/
/*---  For Slick slider ---*/
    .slide-nav li button{
        display: none;
    }
    .slide-nav .slick-active{
        background: #003c79;
        pointer-events:none;
    }
/*--- /For Slick slider ----*/
/*---  For Fancybox ----*/
.fancybox-overlay{
    background: rgba(17,123,232,0.75);
}
/*--- /For Fancybox ----*/