﻿
@import url('https://fonts.googleapis.com/css?family=Esteban|Montserrat|Open+Sans|Source+Sans+Pro');
@import url('normalize.css');


/*
Theme Name: Name.
Created : DD MM YYYY
Updated : None
Version: 1.0

*/

/* ========================================================================== */
/* ========================================================================== */
/* [Table of contents] */
/* ========================================================================== */
/* ========================================================================== */

/*

1. BASE MODULE.
1.1. RESET
1.2. TYPOGRAPHY
1.3. BUTTONS
1.4. BOOTSTRAP ELEMENTS RESET
1.5 LOADER

2. LAYOUT MODULE.
2.1 SPACING AND ALIGNMENT
2.2 HEADER
2.3 CONTENT
2.4 SIDEBAR
2.5 FOOTER

3. PAGES MODULE.
3.1 COMMON STYLES
.....

4. COMPONENTS MODULE.
4.1 SCROLLING TOP
4.2 TESTIMONIAL SLIDER
......

5. MEDIA QUERIES MODULE.
5.1 TYPOGRAPHY BREAKPOINTS VIEW
5.2 THEME BREAKPOINTS VIEW

*/

/* ==========================================================================
1. BASE MODULE.
========================================================================== */

/* ==================
1.1. RESET.
================== */

/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;

}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1.5;
overflow-x: hidden;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a{color:#f1582a;}

a:link {
text-decoration: none;
}

a:visited {
text-decoration: none;
}

a:hover {
text-decoration: none;
color:#ee1379;
}

a:active {
text-decoration: none;
}

/* ==================
1.2. TYPOGRAPHY.
================== */
h1{
font-size: 24px;
font-family: 'Montserrat', sans-serif;
}

h2{
font-size: 22px;
font-family: 'Roboto', sans-serif;
}

h3{
font-size: 20px;
font-family: 'Source Sans Pro', sans-serif;
}

h4{
font-size: 18px;
font-family: 'Roboto', sans-serif;
}

h5{
font-size: 16px;
font-family: 'Montserrat', sans-serif;
}

h6{
font-size: 14px;
font-family: 'Roboto', sans-serif;
}

p{
font-size: 14px;
font-family: 'Roboto', sans-serif;
}

/* ==================
1.3. BUTTONS.
================== */
.btn {
display: inline-block;
padding: 6px 18px;
margin-bottom: 0;
font-size: 16px;
font-weight: normal;
line-height: 1.7;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 5px;
font-family: 'Source Sans Pro', sans-serif;
}

.btn-custom {
color: #FFF;
background-color: #FF404C;
border-color: #FF404C;
transition: 0.3s;
padding: 0px 18px;
margin-bottom: 0;
font-size: 12px;
margin: 10px 10px 0 0;
}
.btn-custom:focus,
.btn-custom.focus {
color: #FFF;
background-color: #ff1a29;
border-color: #ff1a29;
}
.btn-custom:hover {
color: #FFF;
background-color: #ff1a29;
border-color: #ff1a29;
}
.btn-custom:active,
.btn-custom.active,
.open > .dropdown-toggle.btn-custom {
color: #FFF;
background-color: #ff1a29;
border-color: #ff1a29;
}

.btn-cinema {
color: #FFF;
background-color: #FF404C;
border-color: #FF404C;
transition: 0.3s;
padding: 10px 18px;
margin-bottom: 0;
font-size: 16px;
margin: 10px 10px 0 0;
width:100%
}
.btn-cinema:focus,
.btn-cinema.focus {
color: #FFF;
background-color: #ff1a29;
border-color: #ff1a29;
}
.btn-cinema:hover {
color: #FFF;
background-color: #ff1a29;
border-color: #ff1a29;
}
.btn-cinema:active,
.btn-cinema.active,
.open > .dropdown-toggle.btn-cinema {
color: #FFF;
background-color: #ff1a29;
border-color: #ff1a29;
}

.btn-info {
color: #333;
background-color: #cccccc;
border-color: #cccccc;
transition: 0.3s;
}
.btn-info:focus,
.btn-info.focus {
color: #fff;
background-color: #cccccc;
border-color: #cccccc;
}
.btn-info:hover {
color: #fff;
background-color: #595959;
border-color: #595959;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
color: #fff;
background-color: #595959;
border-color: #595959;
}

.btn-more {
color: #FFF;
background-color: #FF404C;
border-color: #FF404C;
transition: 0.3s;
padding: 8px 20px;
font-weight: 600;
font-size: 16px;
font-family: 'Roboto', sans-serif;
margin-top: 10px;
}
.btn-more:focus,
.btn-more.focus {
color: #FFF;
background-color: #FF404C;
border-color: #FF404C;
}
.btn-more:hover {
color: #FFF;
background-color: #FF404C;
border-color: #FF404C;
}
.btn-more:active,
.btn-more.active,
.open > .dropdown-toggle.btn-default {
color: #FFF;
background-color: #FF404C;
border-color: #FF404C;
}



/* ==========================================================================
2. LAYOUT MODULE.
========================================================================== */


/* ==================
2.1. SPACING AND ALIGNMENT.
================== */
.wrapper{
width: 100%;
height: auto;
overflow: hidden;
}

.main{
margin: 50px 0px 50px 0px;
}

.no-margin-bottom{
margin: 50px 0px 0px 0px;
}

.section{
padding: 15px;
margin: 0px auto 0px auto;
}

.section-full{
padding: 15px;
padding: 0px 15px 0px 15px;
margin: 0px auto 0px auto;
}

.color-background{
padding: 40px 0px 40px 0px;
background: #f9f9f9;
}

@media (min-width: 1200px) {
.section {
width: 1200px;
}

.section-full {
width: 1800px;
}

hr.top-line{
width: 1170px;
}

}
hr.top-line{
border-top: 1px solid #fff;
margin: 0px auto 0px auto;
}


/* ==================
2.2. HEADER.
================== */
.main-nav .section{
padding: 0px;
}

.header{
width: 100%;
background: transparent;
margin-bottom: 60px;

}

.top-header{
margin-top: -15px;
height: 50px;
transition: 0.5s;
background: #0798BC;
padding: 15px 0px 15px 0px;
transition: 0.3s;
}

.content p{
color: #FFF;
transition: 0.3s;
}

.leftside{
float: left;
}

.rightside{
float: right;
}

.social-items{
display: inline-block;
margin-right: 10px;
}

.social-items .fa{
font-size: 16px;
transition: 0.3s;
}

.social-items .fa:hover{
color: #2D527C;
}

.location-top{
display: inline-block;
margin-right: 10px;
}

.hero {
position: relative;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
text-align: center;
color: #fff;
padding-top: 280px;
min-height: 750px;
letter-spacing: 2px;
}

.hero h1 {
font-size: 50px;
font-weight: 500;
line-height: 1.2;
}
.hero h1 span {
font-size: 60px;
color: #1abeff;
line-height: 1.5;
font-family: 'Anton', sans-serif;
}

@-webkit-keyframes scroll {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
}
@keyframes scroll {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
}

.main-hero{
margin-top: -20px;
}

.button-container{
margin: 30px 0px 30px 0px;
}

.navbar-brand{
width: 150px;
}

.navbar-brand img{
width: 100%;
}

.main-slider{
z-index: 0;
}

.main-nav{
z-index: 2;
}

.main-header{
height: 100%;
background: transparent;
}

/* ==================
2.4. SIDEBAR.
================== */
.sidebar{
height: 100%;
clear: both;
}

/* ==================
2.5. FOOTER.
================== */
.footer{
width: 100%;
background: #333;
height: 420px;
}

.footer .main{
margin: 20px 0px 50px 0px;
}

.footer .main .section{
padding: 60px 15px 0px 15px;
}

.footer a:link {
text-decoration: none;
color: #d9d9d9;
}

.footer a:visited {
text-decoration: none;
color: #d9d9d9;
}

.footer a:hover {
text-decoration: none;
color: #fff;
}

.footer a:active {
text-decoration: none;
color: #d9d9d9;
}

hr.line-footer{
border-top: 1px solid #595959;
margin: 30px auto 30px auto;
}

.footer-logo{
width: 120px;
margin-bottom: 10px;
}

.footer-logo img{
width: 100%;
}

.about-footer p{
color: #d9d9d9;
}

.social-footer{
margin-top: 30px;
}

.social-footer h6{
color: #d9d9d9;
}

.social-items{
display: inline-block;
margin: 10px 5px 0px 0px;
}

.social-items .fa{
color: #fff;
font-size: 18px;
transition: 0.3s;
}

.social-items .fa:hover{
color: #fff;
}

.icon-fa{
display:inline-block;
font-size: 25px;
line-height: 32px;
background: #595959;
color: #FFF;
width: 40px;
height: 40px;
text-align: center;
vertical-align: bottom;
border-radius: 5px;
float: left;
border: solid 1px #595959;
transition: 0.3s;
}

.icon-fa:hover{
background: #FF404C;
border: solid 1px #FF404C;
}

.footer-categories h6{
color: #FF404C;
}

.categories-list{
margin: 10px 15px 0px 0px;
display: inline-block;
font-size: 16px;
font-family: 'Roboto', sans-serif;
}
.categories-list-2{
margin-top: 10px;
display: inline-block;
font-size: 16px;
font-family: 'Roboto', sans-serif;
}

.left-footer{
float: left;
}

.right-footer{
float: right;
color: #595959;
}

.left-footer p{
color: #d9d9d9;
font-size: 13px;
}

.right-footer p{
color: #d9d9d9;
font-size: 13px;
transition: 0.3s;
}

.subscribe-footer h6{
color: #FF404C;
margin-bottom: 10px;
}

.subscribe-footer p{
color: #d9d9d9;
}

.newsletter-box {
margin: 15px 0px 15px 0px;
}

.newsletter-box form {
display: flex;
align-items: center;
}

.newsletter-box .input {
width: 75%;
height: 38px;
background: #FDFCFB;
border: none;
font-family: inherit;
color: #737373;
letter-spacing: 1px;
text-indent: 5%;
font-size: 13px;
font-family: 'Roboto', sans-serif;
}

.newsletter-box .button {
width: 25%;
height: 38px;
background-color: #FF404C;
border: none;
border-radius: 0 5px 5px 0;
font-family: inherit;
font-weight: 500;
color: inherit;
letter-spacing: 1px;
cursor: pointer;
color: #FFF;
font-size: 13px;
font-family: 'Roboto', sans-serif;
}

p.cursive{
font-style: italic;
}

/* ==========================================================================
3. PAGES MODULE.
========================================================================== */

/* ==================
3.1. THEME PAGES COMMON STYLES.
================== */
.pages-header{
background: #012C40;
height: 350px;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
margin-bottom: 0px;
}

.section-heading{
width: 100%;
position: absolute;
bottom: 0;
}

.span-title h1{
color: #FFF;
}

.span-title p{
color: #FFF;
}

.section-title h2{
text-align: center;
}

.section-title{
margin-bottom: 30px;
padding: 0px 120px 0px 120px;
}

.section-title p{
text-align: center;
color: #8C8C8C;
margin-top: 10px;
}

/* ==================
3.2. ABOUT PAGE.
================== */

/* ==================
3.3. PAGE NAME.
================== */

/* ==================
3.4. PAGE NAME.
================== */


/* ==========================================================================
4. COMPONENTS MODULE.
========================================================================== */

/* =====================
4.1. SCROLLING TOP.
==================== */
@media only screen and (min-width: 1024px) {
main p {
font-size: 20px;
font-size: 1.25rem;
}
}

.cd-top {
display: inline-block;
height: 40px;
width: 40px;
position: fixed;
bottom: 40px;
right: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
/* image replacement properties */
overflow: hidden;
text-indent: 100%;
white-space: nowrap;
background: rgba(255, 64, 76, 1) url(../img/master/cd-top-arrow.svg) no-repeat center 50%;
visibility: hidden;
opacity: 0;
-webkit-transition: opacity .3s 0s, visibility 0s .3s;
-moz-transition: opacity .3s 0s, visibility 0s .3s;
transition: opacity .3s 0s, visibility 0s .3s;
border-radius: 5px;
background-color: #FF404C;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
-webkit-transition: opacity .3s 0s, visibility 0s 0s;
-moz-transition: opacity .3s 0s, visibility 0s 0s;
transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
/* the button becomes visible */
visibility: visible;
opacity: 1;
}
.cd-top.cd-fade-out {
/* if the user keeps scrolling down, the button is out of focus and becomes less visible */
opacity: .5;
}
.no-touch .cd-top:hover {
background-color: #CC0023;
opacity: 1;
}
@media only screen and (min-width: 768px) {
.cd-top {
right: 20px;
bottom: 20px;
}
}

@media only screen and (min-width: 1024px) {
.cd-top {
height: 60px;
width: 60px;
right: 30px;
bottom: 30px;
}
}

/* ========================
4.2 TESTIMONIAL SLIDER.
======================== */


/* ==========================================================================
5. MEDIA QUERIES MODULE.
========================================================================== */

/* ==================================
5.1. TYPOGRAPHY BREAKPOINTS VIEW.
================================== */
@media (min-width:576px) {
h1 {
font-size: 24px;
}

h2 {
font-size: 22px;
}

h3 {
font-size: 20px;
}

h4 {
font-size: 18px;
}

h5 {
font-size: 16px;
}

h6 {
font-size: 14px;
}

}

@media (min-width:768px) {
h1 {
font-size: 26px;
}

h2 {
font-size: 24px;
line-height: 1.2;
}

h3 {
font-size: 22px;
}

h4 {
font-size: 20px;
}

h5 {
font-size: 18px;
}

h6 {
font-size: 16px;
}

}

@media (min-width:992px) {
h1 {
font-size: 32px;
}

h2 {
font-size: 28px;
}

h3 {
font-size: 26px;
}

h4 {
font-size: 24px;
}

h5 {
font-size: 22px;
}

h6 {
font-size: 18px;
}

}

/* ============================
5.2 THEME BREAKPOINTS VIEW
============================ */

@media (max-width:992px) {

/* ============================
1. BASE MODULE BREAKPOINTS.
============================ */

/* ==============================
2. LAYOUT MODULE BREAKPOINTS.
============================== */
.footer{
height: 100%;
}

.footer .main .section{
padding: 40px 15px 20px 15px;
}

.center-column{
margin: 30px 0px 30px 0px;
}

.sidebar{
margin-top: 30px;
}


/* =============================
3. PAGES MODULE BREAKPOINTS.
============================= */
.pages-header{
height: 250px;
}

/* ==================================
4. COMPONENTS MODULE BREAKPOINTS.
================================== */
}

@media (max-width:767px) {

/* ============================
1. BASE MODULE BREAKPOINTS.
============================ */

/* ==============================
2. LAYOUT MODULE BREAKPOINTS.
============================== */
.bottom-footer{
text-align: center;
}

.left-footer{
float: none;
}

.right-footer{
float: none;
color: #595959;
}

.footer .main .section{
padding: 40px 15px 10px 15px;
}

.footer-logo{
width: 80px;
margin-bottom: 20px;
}


/* =============================
3. PAGES MODULE BREAKPOINTS.
============================= */
.section-title{
padding: 0px 20px 0px 20px;
}

/* ==================================
4. COMPONENTS MODULE BREAKPOINTS.
================================== */


}

@media (max-width:576px) {

/* ============================
1. BASE MODULE BREAKPOINTS.
============================ */
.btn {
padding: 4px 12px;
font-size: 14px;
}

/* ==============================
2. LAYOUT MODULE BREAKPOINTS.
============================== */

/* =============================
3. PAGES MODULE BREAKPOINTS.
============================= */

/* ==================================
4. COMPONENTS MODULE BREAKPOINTS.
================================== */
}

@media (max-width:450px) {

/* ============================
1. BASE MODULE BREAKPOINTS.
============================ */

/* ==============================
2. LAYOUT MODULE BREAKPOINTS.
============================== */

/* =============================
3. PAGES MODULE BREAKPOINTS.
============================= */

/* ==================================
4. COMPONENTS MODULE BREAKPOINTS.
================================== */
}

/* --------------------------------

Main Components

-------------------------------- */
.cd-accordion-menu {
/* width: 90%;
max-width: 600px;
background: #4d5158;
margin: 4em auto;
box-shadow: 0 4px 40px #70ac76;*/
}
.cd-accordion-menu ul {
/* by default hide all sub menus */
display: none;
}
.cd-accordion-menu li {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.cd-accordion-menu input[type=checkbox] {
/* hide native checkbox */
position: absolute;
opacity: 0;
}
.cd-accordion-menu label, .cd-accordion-menu a {
position: relative;
display: block;
padding: 18px 18px 18px 64px;
background: #4d5158;
box-shadow: inset 0 -1px #555960;
color: #ffffff;
font-size: 1.6rem;
}
.no-touch .cd-accordion-menu label:hover, .no-touch .cd-accordion-menu a:hover {
background: #52565d;
}
.cd-accordion-menu label::before, .cd-accordion-menu label::after, .cd-accordion-menu a::after {
/* icons */
content: '';
display: inline-block;
width: 16px;
height: 16px;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.cd-accordion-menu label {
cursor: pointer;
}
.cd-accordion-menu label::before, .cd-accordion-menu label::after {
background-image: url(../img/cd-icons.svg);
background-repeat: no-repeat;
}
.cd-accordion-menu label::before {
/* arrow icon */
left: 18px;
background-position: 0 0;
-webkit-transform: translateY(-50%) rotate(-90deg);
-moz-transform: translateY(-50%) rotate(-90deg);
-ms-transform: translateY(-50%) rotate(-90deg);
-o-transform: translateY(-50%) rotate(-90deg);
transform: translateY(-50%) rotate(-90deg);
}
.cd-accordion-menu label::after {
/* folder icons */
left: 41px;
background-position: -16px 0;
}
.cd-accordion-menu a::after {
/* image icon */
/* left: 36px;
background: url(../img/cd-icons.svg) no-repeat -48px 0;*/
}
.cd-accordion-menu input[type=checkbox]:checked + label::before {
/* rotate arrow */
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.cd-accordion-menu input[type=checkbox]:checked + label::after {
/* show open folder icon if item is checked */
background-position: -32px 0;
}
.cd-accordion-menu input[type=checkbox]:checked + label + ul,
.cd-accordion-menu input[type=checkbox]:checked + label:nth-of-type(n) + ul {
/* use label:nth-of-type(n) to fix a bug on safari (<= 8.0.8) with multiple adjacent-sibling selectors*/ /* show children when item is checked */ display: block; } .cd-accordion-menu ul label, .cd-accordion-menu ul a { background: #35383d; box-shadow: inset 0 -1px #41444a; padding-left: 82px; } .no-touch .cd-accordion-menu ul label:hover, .no-touch .cd-accordion-menu ul a:hover { background: #3c3f45; } .cd-accordion-menu> li:last-of-type > label,
    .cd-accordion-menu > li:last-of-type > a,
    .cd-accordion-menu > li > ul > li:last-of-type label,
    .cd-accordion-menu > li > ul > li:last-of-type a {
    box-shadow: none;
    }
    .cd-accordion-menu ul label::before {
    left: 36px;
    }
    .cd-accordion-menu ul label::after,
    .cd-accordion-menu ul a::after {
    left: 59px;
    }
    .cd-accordion-menu ul ul label,
    .cd-accordion-menu ul ul a {
    padding-left: 100px;
    }
    .cd-accordion-menu ul ul label::before {
    left: 54px;
    }
    .cd-accordion-menu ul ul label::after,
    .cd-accordion-menu ul ul a::after {
    left: 77px;
    }
    .cd-accordion-menu ul ul ul label,
    .cd-accordion-menu ul ul ul a {
    padding-left: 118px;
    }
    .cd-accordion-menu ul ul ul label::before {
    left: 72px;
    }
    .cd-accordion-menu ul ul ul label::after,
    .cd-accordion-menu ul ul ul a::after {
    left: 95px;
    }
    @media only screen and (min-width: 600px) {
    .cd-accordion-menu label, .cd-accordion-menu a {
    padding: 10px 10px 10px 20px;
    font-size: 12px;
    }
    .cd-accordion-menu label::before {
    left: 0px;
    }
    .cd-accordion-menu label::after {
    display:none;
    }
    .cd-accordion-menu ul label,
    .cd-accordion-menu ul a {
    padding-left: 35px;
    }
    .cd-accordion-menu ul label::before {
    left: 20px;
    }
    .cd-accordion-menu ul label::after,
    .cd-accordion-menu ul a::after {
    display: none;
    }
    .cd-accordion-menu ul ul label,
    .cd-accordion-menu ul ul a {
    padding-left: 50px;
    }
    .cd-accordion-menu ul ul label::before {
    left: 35px;
    }
    .cd-accordion-menu ul ul label::after,
    .cd-accordion-menu ul ul a::after {
    display: none;
    }
    .cd-accordion-menu ul ul ul label,
    .cd-accordion-menu ul ul ul a {
    padding-left: 65px;
    }
    .cd-accordion-menu ul ul ul label::before {
    left: 50px;
    }
    .cd-accordion-menu ul ul ul label::after,
    .cd-accordion-menu ul ul ul a::after {
    display: none;
    }
    }
    .cd-accordion-menu.animated label::before {
    /* this class is used if you're using jquery to animate the accordion */
    -webkit-transition: -webkit-transform 0.3s;
    -moz-transition: -moz-transform 0.3s;
    transition: transform 0.3s;
    }
    .arrowButton{
    display: inline-block;
    font-size: 30px;
    cursor: pointer;
    }

    .modal-body {
    position: relative;
    padding: 0 15px;
    }

    .modal-header {
    padding: 0 15px;
    border-bottom: none;
    margin: 10px 0 0 0;
    }

    .slitem {
    background-size: cover!important;
    background-position: center!important;
    }

    @media (max-width: 576px) {
    .slitem {
    height: 245px;
    }
    }

    @media (min-width: 576px) {
    .slitem {
    height: 300px;
    }
    }


    @media (min-width: 768px) {
    .slitem {
    height: 400px;
    }

    .mobile-social{
    display:none;
    }
    }

    @media (max-width: 767px) {
    .mobile-social{
    /*background: #26a1cb!important;*/
    min-height: 61px;
    vertical-align: middle;
    padding: 15px;
    font-size: 20px;
    }
    }


    @media (min-width: 992px) {
    .slitem {
    height: 500px;
    }
    }


    @media (min-width: 1200px) {
    .slitem {
    height: 475px;
    }
    }


    .front-section{
    width: 100%;
    height: 250px;
    color: #FFF;
    position: relative;
    }

    .front-section h1{
    margin-top: 20px;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    }

    .front-boxes{
    /*height: 250px;*/
    position: relative;
    margin-top: -150px;
    }


    .span-charity{
    /*height: 250px;*/
    background: #fff;
    padding: 50px 15px 50px 15px;
    position: relative;
    }

    .span-charity:before, .span-charity:after{
    z-index: -1;
    position: absolute;
    content: "";
    bottom: 15px;
    left: 10px;
    width: 50%;
    top: 80%;
    max-width:300px;
    background: #777;
    -webkit-box-shadow: 0 15px 10px #777;
    -moz-box-shadow: 0 15px 10px #777;
    box-shadow: 0 15px 10px #777;
    -webkit-transform: rotate(-3deg);
    -moz-transform: rotate(-3deg);
    -o-transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    transform: rotate(-3deg);
    }

    .span-charity:after{
    -webkit-transform: rotate(3deg);
    -moz-transform: rotate(3deg);
    -o-transform: rotate(3deg);
    -ms-transform: rotate(3deg);
    transform: rotate(3deg);
    right: 10px;
    left: auto;
    }

    .span-charity h5{
    text-align: center;
    font-weight: 600;
    line-height: 1.8;
    }

    .span-charity p{
    line-height: 1.8;
    text-align: center;
    }


    .charity-icon{
    width: 50px;
    margin: auto;
    }
    .charity-icon img{
    width: 100%;
    }

    .graident{
    background: #008b8b;
    background: -moz-linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    background: -webkit-linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    background: linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1582a",endColorstr="#ee13.79",GradientType=1);
    }

    .graidenthover:hover{
    background: #008b8b;
    background: -moz-linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    background: -webkit-linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    background: linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1582a",endColorstr="#ee1379",GradientType=1);
    }

    .graident-75{
    background: #008b8b;
    background: -moz-linear-gradient(45deg, #008b8b 0%, #17178c100%);
    background: -webkit-linear-gradient(45deg, #008b8b 0%, #17178c100%);
    background: linear-gradient(45deg, #008b8b 0%, #17178c100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1582a",endColorstr="#ee1379",GradientType=1);
    }

    .graident-50{
    background: #008b8b;
    background: -moz-linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    background: -webkit-linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    background: linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1582a",endColorstr="#ee1379",GradientType=1);
    }

    .graident-25{
    background: #008b8b;
    background: -moz-linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    background: -webkit-linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    background: linear-gradient(45deg, #008b8b 0%, #17178c 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1582a",endColorstr="#ee1379",GradientType=1);
    }

    .graident a, .graident-50 a {
    color: #fff;
    }

    .mb-50{
    margin-bottom:50px!important);
    }

    .black-25{
    background: rgba(0, 0, 0, 0.25);
    }

    .fill{
    height: 100%;
    width: 100%;
    }

    span.bold {
    font-weight: bold;
    }

    .blog-content {
    text-align: justify;
    }

    #ust {
    height: 5px;
    }

    .block-grid {
    padding: 0px;
    }

    .color-top{
    padding: 40px 0px 40px 0px;
    background: #008b8b;
    background-size: 100% 200px;
    background-repeat: no-repeat;
    }

    div.color-top > div.section-title > h2 > a{
    color:#fff;
    }

    .color-top .section-title h2 a{
    color:#fff;
    }

    .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }
    .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }