﻿
@font-face {
  font-family: 'SEGOEUIL';
  src: url("../fonts/SEGOEUIL.eot");
  src: local("SEGOEUIL"), url("../fonts/SEGOEUIL.woff") format("woff"), url("../fonts/SEGOEUIL.ttf") format("truetype");
}



@font-face {
  font-family: 'SegoeUI-Light';
  src: url('../fonts/segoeui_light/SegoeUI-Light.eot?#iefix') format('embedded-opentype'),  url('../fonts/segoeui_light/SegoeUI-Light.woff') format('woff'), url('../fonts/segoeui_light/SegoeUI-Light.ttf')  format('truetype'), url('../fonts/segoeui_light/SegoeUI-Light.svg#SegoeUI-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'SegoeUI-Semibold';
  src: url('../fonts/segoeui_regular/SegoeUI-Semibold.eot?#iefix') format('embedded-opentype'),  url('../fonts/segoeui_regular/SegoeUI-Semibold.woff') format('woff'), url('../fonts/segoeui_regular/SegoeUI-Semibold.ttf')  format('truetype'), url('../fonts/segoeui_regular/SegoeUI-Semibold.svg#SegoeUI-Semibold') format('svg');
  font-weight: normal;
  font-style: normal;
}

::-moz-selection {
    color: #fff;
    background-color: #32bbf1;
}

::selection {
    color: #fff;
    background-color: #32bbf1;
}

body
{
    background-image:url(../img/bg_2.png);
    background-repeat:no-repeat;
    background-position:top center;
    font-family: 'SegoeUI-Light';
    background-color:#06a2ec;
    color:#fff;
    font-weight:300;
    font-size:15px;
}

a {
    color:#0078d7;
    text-decoration:underline;
    -webkit-transition: color 0.1s ease-in-out;
    -moz-transition: color 0.1s ease-in-out;
    -ms-transition: color 0.1s ease-in-out;
    -o-transition: color 0.1s ease-in-out;
    transition: color 0.1s ease-in-out;
}
    a:hover,
    a:active,
    a:focus {
        outline:none;
        text-decoration:none;
    }
a.phone {
    color:#fff;
}
h1, h2, h3, h4, h5, h6 { margin:0; padding:0; }

h1 {
    font-size:36px;
    margin-top:10px;
    margin-bottom:75px;
}

h2 {
   font-family: 'SegoeUI-Semibold';
   font-size:22px;
   margin-top:5px;
}

h6 {
   
}


/* =============================================================================

                                    HEADER

============================================================================= */

header {
    display:block;
    margin-top:50px;
    margin-bottom:50px;
}

.logo > img {
    max-width:150px;
}

/* =============================================================================

                                   CONTENT

============================================================================= */

content {
    display:block;
}

.action {
    position:relative;
    max-width:550px;
    margin:0 auto;
}

.heart-icon {
    background-image:url(../img/365.png);
    background-repeat:no-repeat;
    background-size:cover;
    width:60px;
    height:56px;
    display:inline-block;
    position:absolute;
    right:-30px;
    top:-60px;
}


.banner img {
    max-width:600px;
}


.button:active {
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset;

	top:5px;
}
.button:active:before{
	top: -11px;
	bottom: -5px;
	content: "";
}

.modal-link {
    cursor:pointer;
}
    .modal-link:hover {
        text-decoration:underline;
    }

.button:focus,
.button:active {
    color:#fff;
}

.act-phone {
    font-family: 'SegoeUI-Semibold';
    font-size:32px;
    display:none;
    margin-top:15px;
    margin-bottom:10px;
}

.button {
    cursor:pointer;
    font-family: 'SegoeUI-Semibold';
    margin-bottom:5px;
	position: relative;
	text-align:center;
	color:#fff;
	text-decoration:none;
	height:55px;
    line-height:55px;
    font-size:20px;
	display: block;
    padding:0 20px 0 30px;

    -webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;

    /*
	background-image:-webkit-linear-gradient(top, #e98516, #e96600);
	background-image:-moz-linear-gradient(top, #e98516, #e96600);
	background-image:-ms-linear-gradient(top, #e98516, #e96600);
	background-image:-o-linear-gradient(top, #e98516, #e96600);
	background-image:linear-gradient(to bottom, #e98516, #e96600);
	
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #934001, 0 4px 2px rgba(0, 0, 0, .5);
	-moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #934001, 0 4px 2px rgba(0, 0, 0, .5);
	box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #934001, 0 4px 2px rgba(0, 0, 0, .5);
        */

background: #ff7f00; /* Old browsers */
background: -moz-linear-gradient(45deg, #ff7f00 0%, #ff7d01 40%, #ff5c01 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, #ff7f00 0%,#ff7d01 40%,#ff5c01 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, #ff7f00 0%,#ff7d01 40%,#ff5c01 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7f00', endColorstr='#ff5c01',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #ce4c00, 0 4px 2px rgba(0, 0, 0, .5);
	-moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #ce4c00, 0 4px 2px rgba(0, 0, 0, .5);
	box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #ce4c00, 0 4px 2px rgba(0, 0, 0, .5);

}

.button:hover {
    color:#fff;
    /*
	background: #F66C7B;
	background-image:-webkit-linear-gradient(top, #e96600, #e98516);
	background-image:-moz-linear-gradient(top, #e96600, #e98516);
	background-image:-ms-linear-gradient(top, #e96600, #e98516);
	background-image:-o-linear-gradient(top, #e96600, #e98516);
	background-image:linear-gradient(top, #e96600, #e98516);
        */

background: #ff7f00; /* Old browsers */
background: -moz-linear-gradient(top, #ff7f00 0%, #ff7d01 40%, #ff5c01 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ff7f00 0%,#ff7d01 40%,#ff5c01 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ff7f00 0%,#ff7d01 40%,#ff5c01 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7f00', endColorstr='#ff5c01',GradientType=0 ); /* IE6-9 */
}


/* =============================================================================

                                    MODAL

============================================================================= */

.modal-content {
    border-radius:0;
}

.modal-header {
    background-image:url(../img/modal-header.png);
    background-repeat:no-repeat;
    background-position:top center;
    background-size:cover;
    border-bottom:none;
    padding:25px 15px 20px;
    position:relative;
}
.modal-body {
    color:#636363;
}

.modal-body h1,
.modal-body h2,
.modal-body h3 {
    color:#0a9ee6;
}

.modal-dialog {
    max-width:550px;
    text-align:center;
}

.modal-header .logo {
    display:inline-block;
    margin:0 auto;
}

.modal-body h1 {
    font-family: 'SegoeUI-Light';
    font-weight:bold;
    font-size:26px;
    margin-bottom:20px;
}
.modal-body h2 {
    font-family: 'SegoeUI-Semibold';
    font-weight:bold;
    font-size:30px;
    margin-top:30px;
    margin-bottom:20px;
}
.modal-body h3 {
    font-size:20px;
    line-height:1.3;
}
.modal-body a.phone {
    color:#0a9ee6;
}
.closeicon {
    position:fixed;
    top:15px;
    right:15px;
    max-width:15px;
    cursor:pointer;
}
.modal-body {
    padding-bottom:50px;
}
.modal-body p {
    margin-bottom:10px;
    font-size:16px;
}
.modal-body strong {
     font-family: 'SegoeUI-Semibold';
}
.modal-backdrop.show {
    opacity:0.3;
}
/* =============================================================================

                                   FOOTER

============================================================================= */

div.footer {
    display:block;
    max-width:430px;
    margin:75px auto;
}

h6 {
    margin-top:15px;
    font-size:15px;
}

.icon {
    max-height:40px;
}

/* =============================================================================

                                   MOBILE

============================================================================= */

@media only screen and (max-width: 768px) {
    .banner img {
        max-width:100%;
    }
    .heart-icon {
    display:none;

    }
    .act-button {
        margin-top:30px;
    }
}

/* =============================================================================

                                  HELPERS

============================================================================= */
