*{
    margin: 0;
    padding: 0;
}

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,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
:focus { outline:0; }
a:active { outline:none; }
body { line-height:1; color:black; background:white; }
ol,ul { list-style:none; }
table { border-collapse:separate; border-spacing:0; }
caption,th,td { text-align:left; font-weight:normal; }
blockquote:before,blockquote:after,q:before,q:after { content:""; }
blockquote,q { quotes:"" ""; }
a{
    text-decoration: none;
}
main{
    overflow-x: hidden;
}
select,
textarea,
input{
    padding: 8px 12px;
    border: 1px solid #585755;
    background: #f5f5f4;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    height: 40px;
    width: 100%;
    font: 400 18px/24px 'Roboto',sans-serif;
    font-style: italic;
}
html {
    height: 100%;
}
body {
    min-height: 100%;
    position: relative;
}
body:after {
    content: '';
    display: block;
    height: 260px;
}
footer {
    position: absolute;
    bottom: 0;
    width: 100%;
}
.bold{
    font-weight: 700;
}

.button{
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    height: 40px;
    width: 214px;
    text-align: center;
    color: #fff;
    text-transform: capitalize;
    background: #585755;
    border: 0;
    height: 42px;
    font-style: normal;
    cursor: pointer;
    font: 400 18px/42px 'Roboto',sans-serif;
    display: block;
    padding: 0 12px;
    cursor: pointer;
}

.button span{

    float: right;
    padding-right: 20px;
}
.button span:before{
    content: '+';
    font-weight: 600;
    font-size: 27px;
}
.button.open span:before{
    content: '-';
}

.light {
    background: #cecdcc;
    color: #030303;
}
.black{
    background: #030303;
    color: #fff;
}
.white{
    background: #fff;
    color: #030303;
    border: 1px solid #020202;
}
.link{
    font:italic 14px/16px 'Opens Sans', sans-serif;
    color: #585755;
    display: block;
    margin-bottom: 10px;
    text-decoration: underline;
}

.button:hover{
    background: #cecdcc;
    color: #030303;
}
.has-error{
    float: left;
    clear: both;
    margin-top: 10px;
    font: 14px 'Roboto',sans-serif;
    color: red;
}

textarea{
    height: 312px;
}

::-webkit-input-placeholder {color:#585755; opacity: 1;}
::-moz-placeholder          {color:#585755; opacity: 1;}
:-moz-placeholder           {color:#585755; opacity: 1;}
:-ms-input-placeholder      {color:#585755; opacity: 1;}

.left{
    float: left;]
}
.right{
    float: right;
}
body {
    font: 12px Georgia;
    letter-spacing:0;
    color: #000000;
    background: #fff;
    position: relative;
    -webkit-font-smoothing: subpixel-antialiased;
}

@font-face {
    font-family: "CenturyGothicRegular";
    src: url("../fonts/CenturyGothicRegular/CenturyGothicRegular.eot");
    src: url("../fonts/CenturyGothicRegular/CenturyGothicRegular.eot#iefix")format("embedded-opentype"),
    url("../fonts/CenturyGothicRegular/CenturyGothicRegular.woff") format("woff"),
    url("../fonts/CenturyGothicRegular/CenturyGothicRegular.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}
.clear:before,
.clear:after{
    content: '';
    display: block;
    clear: both;
}

h1{
    font-weight: bold;
    color: #585755;
    line-height: 53px;
    font-size: 35px;
    display: block;
    text-align: center;
}
.text-upper{
    text-transform: uppercase;
}

#slides {
    display: none
}
.slidesjs-slide{
    height: 100%;
}
#slides .slidesjs-navigation {
    margin-top:5px;
}

a.slidesjs-next,
a.slidesjs-previous,
a.slidesjs-play,
a.slidesjs-stop {
    background-image: url(http://www.scottparksrealty.com/css/img/btns-next-prev.png);
    background-repeat: no-repeat;
    display:block;
    width:12px;
    height:18px;
    overflow: hidden;
    text-indent: -9999px;
    float: left;
    margin-right:5px;
}




.slidesjs-pagination {
    margin: 7px 0 0;
    float: right;
    list-style: none;
}

.slidesjs-pagination li {
    float: left;
    margin: 0 1px;
}

.slidesjs-pagination li a {
    display: block;
    width: 13px;
    height: 0;
    padding-top: 13px;
    background-image: url(http://www.scottparksrealty.com/css/img/pagination.png);
    background-position: 0 0;
    float: left;
    overflow: hidden;
}

.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {
    background-position: 0 -13px
}

.slidesjs-pagination li a:hover {
    background-position: 0 -26px
}

#slides a:link,
#slides a:visited {
    color: #333
}

#slides a:hover,
#slides a:active {
    color: #9e2020
}

.navbar {
    overflow: hidden
}
#slides {
    width: 100%;
    position: relative;
}
.slidesjs-slide  a{
    height: 100%;
    display: block;
    width: 100%;
    background-size: cover !important;
    background-position: center center;!important;
}

.slides_container,
.slidesjs-control,
.slidesjs-container{
    height: 100% !important;
    position: relative;
}

#slides .slidesjs-navigation{
    position: absolute;
    top: 40% !important;
    width: 32px!important;
    height: 62px!important;
    display: block !important;
    z-index: 101!important;
    -ms-transform: translate(0,-50%); /* IE 9 */
    -webkit-transform: translate(0,-50%); /* Chrome, Safari, Opera */
    transform: translate(0,-50%);
    text-indent: -999px;
    display: none !important;
    margin: 0;
    padding: 0;
}
.slidesjs-pagination{
    display: none;
}
#slides:hover .slidesjs-previous,
#slides:hover .slidesjs-next{
    display: block !important;
    cursor: pointer;

}
#slides .slidesjs-next{
    background: url('../img/right-hover.png') center  no-repeat;

    background: url('../img/right-inactive.png') center no-repeat;
    left: initial !important;
    right:  0!important;

}
#slides .slidesjs-next:hover{
    background: url('../img/right-hover.png') center  no-repeat;
}
#slides .slidesjs-previous{
    left: 0px !important;
    background: url('../img/left-hover.png') center no-repeat;

    background: url('../img/left-inactive.png')  center  no-repeat;
}
#slides .slidesjs-previous:hover{
    background: url('../img/left-hover.png') center no-repeat;
}
#slides .slidesjs-play.slidesjs-navigation{
    display: none !important;
}
.slides_container {
    width: 100%;
    height: auto;
    position:relative;
}
.slides_control{
    width: 100% !important;
}
.slides_control div{
    width: 100%;
    position: relative;
}
.slides_control a{
    width: 100%;
    background-size: cover !important;
    height: 505px;
    display: block;
}



.caption {
    position: absolute!important;
    bottom: 0 !important;
    min-height: 124px;
    background: rgba( 255, 255, 255, 0.6);
    width: 100% !important;
    padding: 12px 0 22px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    height: auto !important;
    display: block !important;
    top: initial !important;
    z-index: 999999!important;
}
.caption p{
    display: block;
    text-align: center;
    -ms-transform: translate(-50%,-50%); /* IE 9 */
    -webkit-transform: translate(-50%,-50%); /* Chrome, Safari, Opera */
    transform: translate(-50%,-50%);
    position: absolute;
    top: 50%;
    left: 50%;
    width: 96%;
}
.caption span{
    display: block;
}
.caption .name{
    font-size: 36px;
    text-transform: capitalize;
    line-height: 44px;
}
.caption .street{
    font: 400 24px/1.2 'Roboto', sans-serif;
}
.caption .price{
    font: 700 18px/26px 'Roboto', sans-serif;
}
.pagination{
    display: none;
}

.container{
    max-width: 930px;
    margin: 0 auto;
    padding: 0 15px;

}
.container:after{
    display: block;
    content: '';
    clear: both;
}


header{
    background: #050706;
    padding: 8px 0;
}
header:after{
    content: '';
    display: block;
    clear: both;
}
.logo{
    float: left;
    width: 330px;
    height: 79px;
    background: url("../img/logo.png") 0 0 no-repeat;
}

.main-nav {
    float: right;
    padding-top: 30px;
}

.nav-icon{
    width: 28px;
    height: 22px;
    background: url("../img/nav-icon.png") 0 0 no-repeat;
    cursor: pointer;
    display: none;
}
.nav-icon:hover{
    background: url("../img/nav-icon-hover.png") 0 0 no-repeat;

}
.nav-icon.active{
    background: url("../img/nav-icon-hover.png") 0 0 no-repeat;

}
.main-nav li{
    float: left;
    padding-right: 10px;
    margin-right: 9px;
    position: relative;
}

.main-nav li:after{
    content: '';
    background: #fff;
    width: 1px;
    height: 22px;
    position: absolute;
    right: 0;
    top: 0;
}
.main-nav li:last-child:after{
    display: none;
}
.main-nav li:last-child{
    margin-right: 0;
    padding-right: 0;
}
.main-nav li a{
    display: block;
    font: 400 14px 'Roboto', sans-serif;
    color: #fff;
    line-height: 22px;
}

footer{
    background: #050706;
    padding: 25px 0 30px;
}

.top-footer:after,
footer:after{
    content: '';
    clear: both;
    display: block;
}
.footer-logo{
    float: left;
    width: 210px;
    height: 66px;
    background: url("../img/footer-logo.png") 0 0 no-repeat;
}
.top-footer{
    padding-bottom: 28px;
    margin-bottom: 27px;
    border-bottom: 1px solid #fff;
}

.top-footer .right{
    padding-top: 17px;
}
.social span{
    float: left;
    font-weight: bold;
    font-size: 18px;
    color: #fff;
    margin-right: 30px;
}
.social ul{
    float: left;
}
.social li{
    float: left;
    margin-right: 15px;
}
.social li:last-child{
    margin-right: 0;
}
.social a{
    width: 18px;
    height: 18px;
    display: block;
}
.social .facebook{
    background: url("../img/facebook.png") center center no-repeat;
}
.social .twitter{
    background: url("../img/twitter.png") center center no-repeat;
}
.social .indesign{
    background: url("../img/in.png") center center no-repeat;
}
.social .instagram{
    background: url("../img/instagram.png") center center no-repeat;
}
footer .main-nav{
    padding-top: 0;
    float: left;
}
.bt-footer{
    margin-top: 23px;
}
.bt-footer p , .bt-footer a{
    font: 12px/19px 'CenturyGothicRegular';
    color: #fff;
}


h2{
    font-size: 30px;
    color: #585755;
    line-height: 38px;
    margin-top: 58px;
    display: block;
    text-align: center;
}

.text{
    font: 15px/23px 'Opens Sans', sans-serif;
    color: #585755;
    text-align: center;
    max-width: 650px;
    margin: 0 auto;
}

.listings{
    padding-bottom: 45px;
    border-bottom: 1px solid #666;

}

.row{
    margin: 0  -8px 0;

}
.col-3{
    padding: 0 8px;
    width: 33.33333%;
    float: left;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    position: relative;
}

.listings .row{
    margin-top: 25px;
}

.listings img{
    width: 100%;
    height: auto;
}

.apart-info{
    padding: 0 25px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 100%;
    margin-top: -57px;
    cursor: pointer;
}
.apart-info aside{
    background: #fff;
    padding: 20px 12px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 100%;
    position: relative;
}
.apart-info h6{
    display: block;
    text-align: center;
    font: 14px/20px 'Roboto', sans-serif;
    color: #585755;
}
.apart-info span{
    display: block;
    font: 14px/20px 'Roboto', sans-serif;
    color: #585755;
    text-align: center;
}

.apart-info  .bold{
    font-weight: 700;
}

.charity{
    margin-bottom: 70px;
}
.charity ul{
    display: table;
    width: 100%;
    margin-top: 10px;
    table-layout:fixed;
}

.charity ul li{
    display: table-cell;
    vertical-align: middle;
    width: 33.33%;
}
.charity ul li a{
    display: block;
    text-align: center;
    width: 100%;
}
.charity ul li img{
    width: auto;
    max-height: 200px;}
.charity ul li:nth-child(2){
    text-align: center;
}
.charity ul li:last-child{
    text-align: right;
}
.charity ul li:first-child{
    text-align: left;
}

/*progressbar*/
.progress-bar .background {
    background-color: #333;
}
.progress-bar .rotate {
    background-color: #00bbd7;
}
.progress-bar .left {
    opacity: 1;
}
.progress-bar .right {
    transform: rotate(180deg);
    opacity: 0;
}
.progress-bar {
    position: relative;
    height: 230px;
    width: 230px;
    float: left;
}

.progress-bar div {
    position: absolute;
    height: 230px;
    width: 230px;
    border-radius: 50%;

}
.progress-bar .inner-circle {
    z-index: 9;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    border-radius: 50%;

}

.progress-bar div .info {
    position: absolute;
    font-family: Arial;
    font-size: 25px;
    height: 184px;
    width: 184px;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    margin-top: 1px;
    border-radius: 50%;
    background-color:  #fff;
}


/*.progress-bar .rotate {*/
/*clip: rect(0 127px 254px 0);*/
/*background-color: #4b86db;*/
/*}*/

/*.progress-bar .left {*/
/*clip:  rect(0 127px 254px 0);*/
/*opacity: 1;*/
/*background-color: #b3cef6;*/
/*}*/

/*.progress-bar .right {*/
/*clip: rect(0 127px 254px 0);*/
/*transform: rotate(360deg);*/
/*opacity: 0;*/
/*background-color: #4b86db;*/
/*}*/

.charity-text{
    float: left;
    width: 618px;
    margin-right: 25px;
    /*padding-top: 62px;*/
}
.charity-text h1,
.charity-text h2,
.charity-text p{
    text-align: left;
}
.charity-text h2{
    line-height: 37px;
    max-width: 518px;
    /*float: right;*/
}

@keyframes
toggle {  0% {
    opacity: 0;
}
    100% {
        opacity: 1;
    }
}

.inner-circle .info p{
    background: url("../img/hause-bar.png") top center no-repeat;
    padding: 60px 25px 25px;
    margin-top: 27px;
    background-size: 40px 44px;
}

.inner-circle p span{
    display: block;
    color: #ec4923;
    font:400 16px/1.2 'Roboto', sans-serif;
    text-align: center;
}
.inner-circle .number{
    font-weight: 900;
    font-size: 32px;
}
.inner-circle .goal{
    text-align: center;
}
.inner-circle .year{
    text-align: center;
    font-size: 20px;
    font-weight: 700;
}
.report{
    margin-top: 70px;
    padding-top: 65px;
    border-top: 1px solid #fff;
}
.report ul{
    display: table;
    width: 100%;
}
.report ul li{
    display: table-cell;
    text-align: center;
}
.report ul li:last-child{
    text-align: right;
}
.report ul li:first-child{
    text-align: left;
}
.report li p{
    display: inline-block;
}
.report li span{
    display: block;
    font: 400 18px/1.2 'Roboto', sans-serif;
    color: #ec4923;
}
.report li .center{
    text-align: center;
}
.report li .number{
    font-weight: 700;
    font-size: 30px;
}



/*charity*/
.charity-page{
    margin-top: 50px;
}
.charity-page h2{
    font-size: 24px;
    margin: 0;
}
.charity-page p{
    font: 15px/1.6 'Opens Sans', sans-serif;
    color: #585755;
    text-align: left;
    max-width: 650px;
    margin: 50px auto 0;
    clear: both;
}

.charity-info{
    margin-top: 60px;
}
.charity-info aside{
    background: #e2e3e3;
    padding: 58px 0 68px;
}
.charity-info aside h2{
    margin-top: 0;
    font: 700 30px/47px 'Roboto', sans-serif;
    color: #fff;
}

.charity-info aside h6{
    display: block;
    text-align: center;
    font: 20px/35px 'Roboto', sans-serif;
    color: #ec4923;
}
.bg-hause{
    width: 100%;
    height: 78px;
    background: url("../img/hause.png") center bottom no-repeat;
    background-size: contain;
}
.charity-page .img-block{
    width: 100%;
    max-height: 200px;
    height: 200px;
    position: relative;
}
.charity-page .img-block img{
    height: auto;
    width: auto;
    max-height: 200px;
    max-width: 100%;
    -ms-transform: translate(0,-50%);
    -webkit-transform: translate(0,-50%);
    transform: translate(0,-50%);
    top: 50%;
    left: 0;
    position: absolute;
}
.charity-list{
    margin-bottom: 40px;
}
.charity-list h2{
    margin: 58px 0;
    padding-top: 50px;
    border-top: 1px solid #666666;
}
.charity-list .charity-block{
    float: left;
    width: 355px;
    margin-bottom: 40px;
}
.charity-list .charity-block:nth-of-type(2n){
    float: right;
}
.charity-list .charity-block:nth-of-type(2n+1){
    clear: both;
}

.charity-list .charity-block p{
    font: 12px/18px 'Roboto',sans-serif;
    text-align: left;

}

.charity-list span{
    font: 700 24px/36px 'Roboto', sans-serif;
    color: #585755;
    display: block;
}
.carity-list p{
    font: 11px/14px 'Roboto', sans-serif;
    color: #040202;
}

.contact-page,
.about-page{
    margin-top: 50px;
}
.about-page{
    margin-bottom: 70px;
}
.about-page .text{
    margin-top: 10px;
}
.top-block{
    padding-bottom: 62px;
    margin-bottom: 65px;
    border-bottom: 1px solid #666;
}
.contact-page .top-block{
    padding: 0;
    border: 0;
}
.about-list li{
    margin-bottom: 70px;
}
.about-list li:after{
    content: '';
    clear: both;
    display: block;
}
.about-list li:last-child{
    margin-bottom: 0;
}
.about-list li h1,
.about-list li h2{
    line-height: 1.2;
    margin: 0;
    text-align: left;
    font-family: 'Roboto', sans-serif;
    font-size: 30px;
    font-weight: normal;
}
.about-list li h1 a,
.about-list li h2 a {
    color: #585755;
}
.about-list .text{
    line-height: 20px;
    text-align: left;
    font-size: 14px;
    margin: 0;
    width: 100%;
}
.about-list li span{
    display: block;
    color: #a4a2a2;
    font: 14px/20px 'Roboto', sans-serif;
}
.about-list li .email{
    font-family: CenturyGothicRegular;
    color: #a4a2a2;
}
.about-list li .img-block{
    width: 41.5%;
    float: left;
}
.about-list li .img-block img{
    width: 100%;
    height: auto;
    max-height: 386px;
}

.about-list li .about-text{
    float: right;
    width: 54.5%;
    margin-top: -9px;
}

/* Contact Page*/
.contact-page .head{
    font-weight: bold;
    color: #585755;
    line-height: 24px;
    font-size: 30px;
    display: block;
    text-align: center;
    margin-bottom: 26px;
}
.contact-page .field{
    margin-bottom: 20px;
    padding: 0
;
}
.contact-page .field:after{
    content: '';
    display: block;
    clear: both;
}
.contact-page .row{
    margin: 0 -10px 20px;
    float: none;
}
.contact-page .row .col-5{
    float: left;
    padding: 0 10px;
    width: 50%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.map{
    position: relative;
    margin-top: 72px;
    clear: both;
}

.map .bottom-block{
    position: absolute;
    bottom: 0;
    width: 100%;
    background: rgba(0,0,0,0.4);
    padding: 24px 0 28px;
}
.bottom-block h1{
    color: #fff;
    line-height: 1;
    font-size: 30px;
    text-align: left;
}
.bottom-block .left span{
    display: block;
    color: #fff;
    font: 18px/1.2 'Roboto', sans-serif;
}
.bottom-block .text span{
    display: block;
    color: #fff;
}
.bottom-block .social{
    margin-top: 10px;
}
.bottom-block .social span{
    margin-right: 15px;
}
.align-right{
    text-align: right;
}

/*individual listings*/

.btn-nav{
    font:400 12px/24px 'Roboto', sans-serif;
    color: #a4a2a2;
}
.btn-nav .btn{
    display: inline-block;
    margin-right: 5px;
    cursor: pointer;
}
.btn-nav a{
    display: inline-block;
    margin-right: 5px;
    cursor: pointer;
    font:400 12px/24px 'Roboto', sans-serif;
    color: #a4a2a2;
}

.share span{
    font: 600 12px/24px 'Roboto', sans-serif;
    float: left;
    color: #585755;
    margin-right: 10px;
}
.share ul{
    float: left;
    list-style: none;
}
.share ul li{
    float: left;
    margin-right: 10px;
}
.share ul li:last-child{
    margin: 0;
}
.share ul li a{
    width: 20px;
    height: 20px;
    display: block;
    background-repeat: no-repeat !important;
}

.share ul .email a{
    background: url("../img/envelope.png");
}
.share ul .facebook a{
    background: url("../img/share-fb.png");
}
.share ul .twitter a{
    background: url("../img/share-tw.png");
}
.share ul .instagram a{
    background: url("../img/share-in.png");

}
.share ul .print a{
    background: url("../img/print.png");

}


.individual-listings{
    margin-top: 50px;
}


.individual-listings h1,
.individual-listings h2,
.individual-listings h3{
    text-align: left;
    margin: 0;
    line-height: 1.2;
}
.individual-listings h2{
    font-family: 'Roboto', sans-serif;
}
.individual-listings h3{
    color: #666666;
    font: 700 24px 'Roboto', sans-serif;
    display: block;
}
.individual-listings h1 span.sold,
.realty-listings h1 span.sold,
.individual-listings h1 span.in_contract,
.realty-listings h1 span.in_contract {
    display: inline-block;
    font-size: inherit;
    font-weight: inherit;
    color: #ff0000;
}
.individual-listings .slides_container,
.individual-listings .slides_control a{
    height: 385px;
}
/*.individual-listings #slides .slidesjs-next{*/
/*right: 10px !important;*/
/*}*/
/*.individual-listings #slides .slidesjs-previous{*/
/*left: 10px !important;*/
/*}*/

.individual-listings #slides{
    margin: 0px 0 10px;
}
.row:after{
    content: '';
    display: block;
    clear: both;
}
.individual-listings .row{
    margin: 20px -20px 0;
}
.individual-listings .row:last-of-type{
    margin-top: 0;
}

.row .col-4{
    float: left;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 0 20px;
    width: 30%;
}
.row .col-8{
    float: left;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 0 20px;
    width: 70%;
}
.row .col-5{
    float: left;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 0 20px;
    width: 50%;
}
.main-text{
    margin-top: 10px;
}
.main-text h4{
    display: block;
    font-size: 20px;
    line-height: 24px;
    font-weight: bold;
    color: #585755;

}
.main-text .text{
    font-size: 14px;
    line-height: 20px;
    text-align: left;
    max-width: 100%;
    margin: 15px 0 0;
}
.main-text .btn-nav{
    margin-top: 8px;
}
.main-text .button{
    width: 100%;
}
.data-contact{
    display: table;
    margin: 5px 0 12px;
    width: 100%;
}
.data-contact li:nth-child(2){
    white-space: nowrap;
}
.data-contact li:last-child{
    text-align: right;
}
.data-contact li{
    display: table-cell;
    font: 15px/19px 'Roboto', sans-serif;
    color: #585755;
    width: 33.33%;

}

.individual-listings .col-4 .button{
    width: 100%;
    margin-top: 10px;
}
.individual-listings  .slides_control a,
.individual-listings  #slides{
    height: 385px !important;
    overflow: hidden;
}


.individual-listings #slides .slidesjs-navigation {
    top: 50% !important;
}



.details{
    margin-bottom: 26px;
}
.details:last-child{
    margin-bottom: 0;
}
.details p{
    display: block;
    font: 400 25px/19px 'Roboto', sans-serif;
    color: #585755;
    margin-bottom: 6px;
}
.realty .floor-plan,
.realty .view-img,
.details span{
    display: block;
    font: 400 15px/22px 'Roboto', sans-serif;
    color: #585755;
}
.details .name { color: #585755; }
.details  .id{
    margin-top: 8px;
}

/*Realty List*/
.realty-listings{
    margin: 70px auto;
}
.realty-listings .about-list{
    margin-top: 72px;
    width: 100%;
}
.realty-listings .about-list h3{
    display: block;
    font: 700 24px/1.2 'Roboto', sans-serif;
    color: #666666;
}
.realty-listings  .about-list .text{
    margin-top: 5px;
}
.realty-listings .button{
    float: left;
    height: 62px;
    line-height: 62px;
    font-size: 25px;
    width: 164px;
    margin-right: 10px;

}

.realty-listings .button:last-child{
    margin-right: 0;
}
.realty-listings  .paginator{
    margin-top: 70px;
}
.paginator{
    float: right;
}
.paginator .page{
    float: left;
    width: 24px;
    height: 24px;
    margin-right: 5px;
    font: 18px/24px 'Roboto', sans-serif;
    color: #585755;
    text-align: center;
    cursor: pointer;

}
.paginator .page:hover,
.paginator .active{
    background:  #585755;
    color: #fff;
}
.paginator .page:last-child{
    margin-right: 0;
}


.realty h2{
    font-size: 24px;
    line-height: 36px;
    float: left;
}
.realty h3 {
    font-size: 36px;
    float: right;
    line-height: 1;
}
.realty #slides{
    margin-top: 20px;
}
.realty .main-text{
    margin-top: 6px;
}
.realty  .main-text .btn-nav{
    margin: 0;
    line-height: 1;
}

.realty .data-contact li{
    padding-right: 16px;
}
.building-specs{
    display: block;
    margin: 24px 0 20px 0;
}
.specs-block{
    background: #666;
    margin-bottom: 14px;
}
.specs-block:last-child{
    margin-bottom: 0;
}
.specs-block:after{
    content: "";
    display: block;
    clear: both;
}
.specs-block .button{
    float: right;
    width: auto;
    line-height: 44px;
    height: 44px;
    min-width: 134px;
}
.specs-block span{
    float: left;
    line-height: 22px;
    margin: 11px 0 0 12px;
    font: 400 18px/22px 'Roboto',sans-serif;
    padding-left: 30px;
    position: relative;
    color: #fff;
}
.specs-block span:before{
    content: "";
    width: 17px;
    height: 22px;
    background: url("../img/pdf.png") 0 0 no-repeat;
    position: absolute;
    top: 0;
    left: 0;
}

.public{
    margin-bottom: 72px;
}
.public .text{
    margin-bottom: 18px;
}
.public .img-block{
    margin-top: 20px;
    width: 100%;
    height: 384px;
    background-size: cover!important;
}
.realty .img-block{
    margin-bottom: 5px;
}
.admin-login,
.reset-pass{
    margin: 50px auto 70px;
    min-height: 400px;
}
.admin-login h3,
.reset-pass h3{
    display: block;
    text-align: center;
    font: 400 24px/1 'Roboto';
    margin: 10px 0;
}
.admin-login form,
.reset-pass form{
    max-width: 585px;
    margin: 0 auto;
}
.admin-login .field,
.reset-pass .field{
    margin-top: 18px;
}
.admin-login .button,
.reset-pass .button{
    margin: 18px auto 0;
}

.admin-login input[type="checkbox"]{
    width: 12px;
    height: 12px;
    padding: 0;
    margin: 4px 0 0 0;
    float: left;
    cursor: pointer;
}
.admin-login .checkbox{
    display: block;
    min-height: 24px;
}
.admin-login .checkbox-field{
    float: left;
    font: 400 18px/18px 'Roboto', sans-serif;
    margin-left: 5px;
    color: #585755;
}

.admin-login .button{
    clear: both;
}


/*Investement*/

.investment{
    margin: 50px auto 70px;
}
.investment .row{
    margin: 0 -20px;
}
.investment h1{
    text-align: left;
}
.investment p{
    text-align: left;
    margin-top: 6px;
}
.investment .white{
    margin-top: 25px;
    width: 338px;
    margin-top: 25px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.investment form{
    padding: 10px;
    border: 1px solid #585755;
}
.investment form h2{
    font: bold 24px/38px 'Georgia';
    margin: 0;
}

.field{
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin-bottom: 18px;
}


.investment .field{
    padding: 0;
    margin-bottom: 10px;
}

.investment form .button{
    width: 100%;
}

.opportunity-list{
    padding-top: 62px;
    margin-top: 72px;
    border-top: 1px solid #666;
}
.opportunity-list .col-5{
    padding: 0 10px;
}
.opportunity-list .row{
    margin: 0 -10px;
}
.opportunity-list h3{
    display: block;
    font: bold  24px/26px Georgia;
    display: block;
    color: #585755;
    text-align: center;
    margin-bottom: 23px;

}
.oportunity img{
    width: 100%;
    height: auto;
}

.oportunity .details{
    padding: 0 30px;
    margin-top: -58px;
    position: relative;
}
.oportunity .details aside{
    background: #fff;
    width: 100%;
    padding: 10px 15px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.oportunity .details aside:after{
    content: '';
    display: block;
    clear: both;
}

.oportunity .details .name{
    font: bold 15px/20px 'Georgia';
    display: block;

}
.oportunity .details .street{
    font: 400 14px/20px 'Roboto', sans-serif;
    display: block;
}
.oportunity .details h1{
    font: 900 24px/36px 'Roboto', sans-serif;
}
.investment .details aside{
    display: table;
}
.investment .details .left{
    display: table-cell;
    float: none;
    padding-right: 10px;
    vertical-align: top;
}
.investment .details .right{
    display: table-cell;
    float: none;
    vertical-align: top;
}
.investmen .row{
    margin-bottom: 15px;
}
.investment .col-5{
    display: table-cell;
    float: none;
}
.profile{
    margin: 50px auto 70px;
}
.profile .img-block{
    width: 100%;
    height: 385px;
    background-size: cover !important;
}

.profile h3{
    display: block;
    text-align: center;
    font: bold 20px/26px Georgia;
    margin-top: 5px;
    color: #585755;

}
.profile-list{
    margin-top: 30px;
}

.profile-list .oportunity{
    margin-bottom: 55px;
}

.profile-list .oportunity:last-child{
    margin: 0;
}
.profile-list .details .name{
    font-size: 24px;
    line-height: 26px;
}
.profile-list .details .street{
    font-size: 18px;
}
.profile-list .details h1{
    font-size: 36px;
    line-height: 46px;
}
.profile-list .details p{
    font: 400 14px/18px 'Roboto', sans-serif;
    margin:10px  0 0 0 ;
}
.profile-list .details .btn{
    display: block;
    color: #a4a2a2;
    font: 14px/20px 'CenturyGothicRegular', sans-serif;
    margin-top: 5px;
}
.realty .floor-plan,
.realty .view-img,
.details .view-img,
.details .map-icon,
.details .floor-plan{
    padding-left: 30px;
    cursor: pointer;
    position: relative;
    margin-top: 5px;
}
.realty .floor-plan:before,
.details .floor-plan:before{
    content: '';
    width: 20px;
    height: 16px;
    background: url("../img/floor.png") 0 0 no-repeat;
    top: 3px;
    left: 0px;
    position: absolute;
    display: block;
}
.details .map-icon:before{
    content: '';
    width: 20px;
    height: 20px;
    background: url("../img/map-marker.png") center center no-repeat;
    background-size: cover;
    top: 0px;
    left: 0px;
    position: absolute;
    display: block;
}

.realty .view-img:before,
.details .view-img:before{
    content: '';
    width: 21px;
    height: 24px;
    background: url("../img/Image_Inactive.png") center center no-repeat;
    background-size: cover;
    top: 0px;
    left: 0px;
    position: absolute;
    display: block;
}
.realty .view-img:hover:before,
.details .view-img:hover:before{
    background: url("../img/Image_Hover.png") 0 0 no-repeat;
}
.email-icon{
    padding-left: 20px;
    cursor: pointer;
    position: relative;
    font: 15px/19px 'Roboto', sans-serif;
    color: #585755;
}
.email-icon:before{
    content: '';
    width: 14px;
    height: 11px;
    background: url("../img/email-icon.png") 0 0 no-repeat;
    display: block;
    position: absolute;
    left: 0;
    top:4px;
}
@media(max-width: 930px){
    .progress-bar{
        float: none;
        margin: 10px auto 0;
    }
    .charity-text h1, .charity-text h2, .charity-page p{
        float: none;
        width: 100%;
        text-align: center;
        margin: 0 auto;
    }
    .charity-text{
        text-align: center;
        float: none;
        width: 100%;
        margin: 0;
    }
    .inner-circle .info p{
        padding-right: 0;
        padding-left: 0;
    }
}
@media(max-width: 850px) {
    .individual-listings  .charity-block{
        display: table;
        margin: 0 auto;
    }
    .individual-listings .row .col-4{
        margin-top: 20px;
    }
    header .main-nav{
        position: relative;
    }
    header .main-nav:hover .nav-icon{
        background: url("../img/nav-icon-hover.png") 0 0 no-repeat;
    }
    header .nav-icon{
        display: block !important;
    }
    header .main-nav ul{
        display: none;
        position: absolute;
        width: 300px;
        right: 0;
        top: 100%;
        background: #585755;
        z-index: 999;
        margin-top: 15px;
    }
    header  .main-nav ul:before{
        content: '';
        width: 0;
        height: 0;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-bottom: 8px solid #585755;
        position: absolute;
        top: -8px;
        right: 6px;
    }
    header .main-nav li{
        padding: 6px 15px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }
    .main-nav li{
        display: block;
        width: 100%;


    }
    header  .main-nav li:hover{
        background: #cecdcc;

    }
    header .main-nav li:hover a{
        color: #030303;
    }
    .main-nav li:after{
        display: none;
    }
    [class^=col-]{
        width: 100% !important;
        display: block !important;
    }
    footer{
        position: inherit;
    }
    /*#slides .slidesjs-next{*/
    /*right: 4% !important;*/
    /*}*/
    /*#slides .slidesjs-previous{*/
    /*left: 4% !important;*/

    /*}*/
    #slides .slidesjs-navigation,
    #slides .slidesjs-navigation{
        display: none !important;
    }
    .apart-info{
        margin-top: 0;
    }
    .charity ul{
        display: block;
        margin: 0;
    }
    .charity ul li{
        display: block;
        margin-top: 20px;
        width: 100%;
    }
    .charity ul li img{
        max-height: initial;
        max-width:  60%;
    }
    .bt-footer p .right{
        float: left;
        margin-top: 30px;
        clear: both;
    }
    body:after{
        display: none;
    }
    .about-list li .img-block{
        width: 100%;
    }
    .about-list li .about-text{
        width: 100%;
        margin-top: 15px;
    }
    .charity-list .charity-block{
        width: 100%;
        margin-bottom: 15px;
        text-align: center;
    }
    .charity-page .img-block img{
        left: 50%;
        -ms-transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
    }
    .contact-page .row .col-5:last-child{
        margin-top: 20px;
    }
    .oportunity .details {
        margin: 15px 0;
    }
    .investment .col-4{
        margin-top: 30px;
    }
}

@media (max-width: 780px) {
    .individual-listings h2 span{
        display: block;
    }
    .caption .name{
        font-size: 28px;
        line-height: 1.2;
    }
    .caption .street{
        font-size: 18px;
    }
    .caption .price{
        font-size: 14px;
    }
}
@media (max-width: 500px) {
    /*#slides .slidesjs-next{*/
    /*background: url("../img/mob-arrow-right.png") center center no-repeat;*/
    /*display: block !important;*/

    /*}*/
    /*#slides .slidesjs-next:hover{*/
    /*background: url("../img/mob-arrow-right.png") center center no-repeat;*/

    /*}*/
  .charity-block .img-block {
      text-align: center;
  }
    #slides:hover .slidesjs-previous{
        /*background: url("../img/mob-arrow-left.png") center center no-repeat;*/
        display: none !important;
    }
    #slides:hover .slidesjs-next{
        /*background: url("../img/mob-arrow-left.png") center center no-repeat;*/
        display: none !important;

    }
    .apart-info aside{
        padding-top: 10px;
    }
    .investment .white{
        width: 100%;
    }
    .realty h3{
        float: left;
        margin-top: 10px;
    }
    .data-contact li{
        display: block;
        margin-top: 5px;
        text-align: left!important;
        width: 100% !important;
    }
    .data-contact li a{
        color: #585755;
    }
    .realty-listings .button{
        width: 118px;
        font-size: 22px;
    }
    .charity-info aside {
        padding: 58px 0 40px;
    }
    .report {
        margin-top: 35px;
        padding-top: 25px;
        border-top: 1px solid #fff;
    }
    .progress-bar div .info{
        height: 180px;
        width: 180px;
        left: 139px;
        top: 114px;
    }
    .progress-bar canvas{
        display: table;
        margin: 0 auto;
    }
    .progress-bar,
    .progress-bar div {
        height: 280px;
        width: 280px;
    }
    .progress-bar .rotate,
    .progress-bar .left,
    .progress-bar .right {
        clip: rect(0 140px 280px 0);
    }
    .inner-circle .info p {
        padding: 60px 0px 25px;
        margin-top: 25px;
    }
    .report ul {
        display: block;
        width: 100%;
    }
    .report ul li{
        width: 100%;
        text-align: center !important;
        display: block;
        margin-top: 10px;

    }
    .top-footer .right{
        float: left;
        margin-top: 10px;
    }
    .logo{
        width: 215px;
        background-size: contain!important;
        height: 65px;
        margin-top: 15px;
        margin-bottom: 10px;
    }

    .bt-footer p span{
        float: left;
    }
    .contact-page   .button{
        width: 100%;
    }
    .oportunity .details{
        margin-top: 10px;
        padding: 0;
    }
    .oportunity .details .left,
    .oportunity .details .right{
        width: 100%;
        text-align: center;
    }
    .oportunity .details h1,
    .oportunity .details span{
        text-align: center;
    }
    .investment .details .right,
    .investment .details .left{
        padding: 0;
        display: block;
    }
}


.checkbox {
    position: relative;
    z-index: 2;
    padding: 0;
}
.checkbox:last-child {
    margin-right: 0;
}
.checkbox input[type="checkbox"] {
    top: 0;
    margin: 0;
    visibility: visible;
    display: block;
    position: absolute;
    padding: 0;
    opacity: 0;
    left: 10px;
    cursor: pointer;
}
.checkbox input[type="checkbox"] + span {
    background: url("../img/checkbox.png") 0 0 no-repeat;
}

.checkbox input[type="checkbox"]:checked + span{
    background: url("../img/checkbox_active.png") 0 0 no-repeat;
}
.checkbox-field{
    padding-left: 25px;
    display: block;
}
/* Tiny Scrollbar */
#scrollbar { width: 100%; margin: 20px 0 10px; }
#scrollbar .viewport { height: 566px; overflow: hidden; position: relative; }
#scrollbar .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 10px; margin: 0; }
#scrollbar .scrollbar{ background: scrollbar; position: relative; background-position: 0 0; float: right; width: 15px; border: 1px solid #585755; top: -1px;}
#scrollbar .track { height: 100%; width:13px; position: relative; padding: 0 1px; }
#scrollbar .thumb { background:#585755; height: 20px; width: 15px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: 0; }
#scrollbar .thumb .end { background: transparent url(http://www.scottparksrealty.com/css/images/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow: hidden; height: 5px; width: 25px; }
#scrollbar .disable { display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }

.terms{
    margin: 50px auto 70px;
}

.terms h4{
    display: block;
    text-align: center;
    font: 24px/1.2 'Roboto', sans-serif;
    color: #585755;
}

#scrollbar{
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    background: #f5f5f4;
    border: 1px solid #585755;
    font: 14px/18px 'CenturyGothicRegular';
    color: #040202;
}

.terms input[type="checkbox"]{
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 1px 0 0 0;
    float: left;
    cursor: pointer;
}

.terms .checkbox-field{
    float: left;
    font: 400 15px/16px 'Roboto', sans-serif;
    margin-left: 10px;
}
.terms  .input-terms,
.terms .checkbox{
    display: table;
    margin: 20px auto 0;
    clear: both;
}

.terms  .input-terms .checkbox-field{
    line-height: 26px;
    padding-left: 0;
}
.terms  .input-terms input {
    width: 26px;
    height: 26px;
    padding: 0 2px;
    line-height: 26px;
    font-size: 14px;
    border-radius: 2px;
    float: left;
    text-align: center;
}

.terms .button{
    display: block;
    margin: 25px auto 0;
}


.ui-slider{

}
.range-list{
    width: 100%;
    padding: 2px 10px 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border: 1px solid #585755;
    display: none;
}
.range-list.visible{
    display: block;
}
.range-list .range{
    width: 100%;
    padding: 0 60px 0 60px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    position: relative;
}
.range-list aside{
    margin-bottom: 10px;
    min-height: 44px;
}
.range-list input{
    padding: 0;
    height: 16px;
    font: 300 12px/16px 'Roboto', sans-serif;
    color: #585755;
    background: none;
    border: 0;
}
.range-list label{
    display: block;
    font: 400 15px/26px 'Roboto', sans-serif;
    color: #585755;
}
.range-list .left{
    position: absolute;
    left: -5px;
    top: -7px;
    text-align: right;
    width: 55px;
}
.range-list .right{
    position: absolute;
    right: -6px;
    text-align: left;
    width: 55px;
    top: -7px;
}


.ui-widget-content  .ui-state-default{
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #c1bfbf;
    border: 0;
    cursor: pointer;

}
.ui-slider .ui-slider-range{
    background: #010101;
}
.ui-widget-content{
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    height: 4px;
    border: 0;
    background: #c1bfbf;
    margin-top: 10px;
}


.ui-slider-horizontal .ui-slider-handle {
    top: -0.5em;}

.range-list .info{
    width: 100%;
    margin-bottom: 8px;
    font: 15px/18px 'Roboto',sans-serif;
    padding: 6px 12px;
    text-align: center;
    color: #fff;
    background: #c1bfbf;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.range-list .month{
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 0;
}


/*Popup*/
.mask {
    width: 100%;
    height: 100%;
    z-index: 9;
    background: rgba(0,0,0,0.4);
    position: fixed;
    top: 0;
    left: 0;
}

.popup{
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%,-50%); /* IE 9 */
    -webkit-transform: translate(-50%,-50%); /* Chrome, Safari, Opera */

    transform: translate(-50%,-50%);
    max-width: 698px;
    background: #fff;
    padding: 50px 45px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    z-index: 99999;

}
.popup .close{
    position: absolute;
    font: 500 18px 'Roboto', sans-serif;
    color: #000000;
    right: 15px;
    top: 25px;
    cursor: pointer;

}
.popup h4{
    font: 600 18px/30px 'Roboto',sans-serif;
    color: #585755;
    display: block;
    text-align: center;
}

.popup  .button{
    width: 100%;
    margin: 20px 0 0;
    border-color: #030303;
    color: #030303;
}
.charity-popup .button{
    margin-bottom: 50px;

}
.popup p{
    margin-top: 12px;
    font: 15px/24px 'Roboto', sans-serif;
    color: #585755;
}
.popup .row{
    margin: 20px -20px 0;
}
.popup img{
    max-width: 100%;
    height: auto;
}
.popup .img-block{
    max-height: 300px;
    width: 100%;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
    height: auto;
    overflow: hidden;
    display: block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.img-block .text-img{
    display: block;
    text-align: center;
    font: 300 18px 'Roboto', sans-serif;
    position: absolute;
    left: 0;
    top: 50%;
    -ms-transform: translate(0,-50%); /* IE 9 */
    -webkit-transform: translate(0,-50%); /* Chrome, Safari, Opera */
    transform: translate(0,-50%);
    width: 100%;
    text-transform: uppercase;
}
.charity-popup .img-block{
    margin: 0;
    cursor: default;
    border: 1px solid #585755;
    background: rgba(0,0,0,0.1);
    height: 200px;
    max-height: 200px;
}

.popup .col-6{
    width: 50%;
    float: left;
    margin-bottom: 30px;
    padding: 0 20px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.popup .col-3{
    margin: 20px 0;
}

.view-list .row{
    margin: 20px -20px 0;
}
.view-list .col-6{
    width: 50%;
    float: left;
    margin-bottom: 30px;
    padding: 0 20px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    margin-right: 0;
}
.view-list img{
    max-width: 100%;
    height: auto;
}
.view-list .img-block{
    max-height: 300px;
    width: 100%;
    position: relative;
    margin-bottom:  10px;
    cursor: pointer;
    height: auto;
    overflow: hidden;
    display: block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.view-list .checkbox{
    padding-right: 20px;
    margin: 0;
}
.view-list .checkbox-field{
    padding: 0;
    margin: 0;
}
.view-list .checkbox a{
    font: 400 14px/20px 'Roboto';
    color: #fd0101;
    position: absolute;
    right: 0;
    top: 0;
}


.error-page h1 {
    font-size: 180px;
    line-height: 1;
}
.error-page h2 {
    font-size: 42px;
    line-height: 1;
    text-transform: uppercase;
}
.error-page{
    padding: 60px 0;
}
.error-page .button{
    display: table;
    margin: 0 auto;
    width: auto;
}

@media print
{
    * {-webkit-print-color-adjust:exact;}
    .individual-listings .col-4 .button,
    footer,
    .main-text .button,
    .range-list,
    .calculator,
    .share,
    .btn-nav,
    .main-nav{
        display: none;
    }
    .details{
        margin-bottom: 40px;
    }

}

.error-message
{
    width: auto;
    border: 1px solid #D8D8D8;
    padding: 5px;
    border-radius: 5px;
    font: 400 14px/22px 'Roboto',sans-serif;
    min-width: 300px;
    text-transform: uppercase;
    background-color: rgb(255, 249, 242);
    color: rgb(211, 0, 0);
    text-align: center;
    margin: 30px auto;
    display: table;
    padding-left: 55px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -moz-box-sizing: border-box;
    position: relative;
}
.error-message img,
.success-message img
{
    float: left;
}

.success-message
{
    width: auto;
    min-width: 300px;
    display: table;
    border: 1px solid #D8D8D8;
    padding: 10px;
    border-radius: 5px;
    font: 400 14px/22px 'Roboto',sans-serif;
    text-transform: uppercase;
    background-color: rgb(236, 255, 216);
    color: green;
    text-align: center;
    margin: 30px auto;
    padding-left: 55px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -moz-box-sizing: border-box;
    position: relative;
}
.success-message:before{
    content: '';
    position: absolute;
    top: 0px;
    width: 22px;
    height: 100%;
    background: url("../img/correct.png") center no-repeat;
    left: 15px;
    display: block;
}
.error-message:before{
    content: '';
    left: 15px;
    position: absolute;
    display: block;
    top: 0px;
    width: 22px;
    height: 100%;
    background: url("../img/error.png") center no-repeat;
}

#open-popup {padding:20px}
.white-popup {
    position: relative;
    background: #FFF;
    padding: 40px;
    width: auto;
    max-width: 200px;
    margin: 20px auto;
    text-align: center;
}


@media(max-width: 700px){
    .popup{
        width: 90%;
        padding: 50px 15px;
    }
    .popup .col-6{
        width: 50% !important;
    }
}

@media(max-width: 380px){
    .popup{
        width: 90%;
        padding: 50px 15px;
    }

    .popup .button{
        font-size: 14px;
    }
}

.error-page{
    text-align: center;
}
.error-page h1{
    font-size: 180px;
    color: #333;
}
.error-page .error-text{
    font:   28px/1 'CenturyGothicRegular';
    text-transform: uppercase;
    display: block;
    margin-top: 40px;
    color: #ec4923;
}
.error-page  .expl{
    color: #333;
    margin: 20px 0 60px;
    display: block;
    font: 18px/1 'CenturyGothicRegular';
}