@import url('https://fonts.googleapis.com/css?family=Open+Sans|Roboto');

html, body{padding:0; margin:0; font-family: 'Open Sans', sans-serif; font-size:17px; color:#333333; background:#f1f1f1;}

.clear{clear:both;}

[type='text'],[type='password'],select,[type='number']{padding:4px 15px; border-radius:2px; border:1px solid #b5b5b5; font-family: 'Nunito Sans', sans-serif; font-family: 'Open Sans', sans-serif;}
textarea{padding:4px 15px; border-radius:2px; border:1px solid #b5b5b5; font-family: 'Open Sans', sans-serif;}
[type='text'].required,[type='password'].required,select.required{background:#ffe5e5; border:1px solid #ff9393;}

hr{border:none; height:3px; background:#dadada;}

.fbs_form{position:relative;}
.fbs_form .element_wrap{width:100%; margin:0 0 2% 0; display:inline-block; vertical-align:top;}
.fbs_form .element_wrap label{display:block; font-weight:bold; margin:0 0 4px 0;}
.fbs_form .element_wrap [type=text], .fbs_form .element_wrap [type=number], .fbs_form .element_wrap [type=password], .fbs_form .element_wrap textarea{width:100%; padding:8px 20px; border-radius:3px; box-sizing: border-box; }
.fbs_form .element_wrap select{width:100%; padding:7px 4%; border-radius:3px;}
.fbs_form .element_wrap.half{width:48.5%; margin:0 0 20px 2%;}
.fbs_form .element_wrap.one_third{width:31.5%; margin:0 0 20px 2%;}
.fbs_form .element_wrap.two_thirds{width:65.5%; margin:0 0 20px 2%;}
.fbs_form .element_wrap.one_fourth{width:23.5%; margin:0 0 20px 2%;}
.fbs_form .element_wrap.row_first{margin:0 0 20px 0;}
.fbs_form .instructions{margin:0 0 6px 0; opacity:.7; font-size:14px;}
.fbs_form .form_loading{position:absolute; top:0; right:0; bottom:0; left:0; background:rgba(255,255,255,0.7); background-size:60px 60px; transition:all 0.2s ease; display:none; z-index:99; text-align:center;}
.fbs_form .form_loading svg{margin:20px 0 0 0;}

.button{display:inline-block; text-decoration:none; background:#e4e4e4; line-height:32px; padding:0 15px; color:#333;  transition:all .2s ease; border:none; cursor:pointer;}
.button:hover{background:#dadada;}
.button.green{background:#51be8c; color:#fff;}
.button.green:hover{background:#44b17e;}
.button .fa{margin:0 8px 0 0;}

.hp_bg{background:url(images/bg.jpg) top center no-repeat; background-size:cover; position:absolute; top:0; right:0; bottom:0; left:0;}

.hp_wrap{max-width:400px; margin:50px auto; text-align:center; padding:0 20px;}
.hp_wrap img{width:150px; height:auto; margin:0 auto;}
.hp_wrap h1{color:#fff;}

.form_inputs_wrap{background:#fff; border-radius:3px; overflow:hidden;}

.login_tabs_wrap .tab{display:block; float:left; width:50%; line-height:60px; background:#27dc98; color:#fff; text-decoration:none; font-size:20px; font-weight:bold;}
.login_tabs_wrap .tab.active{background:#fff; color:#27dc98; }

.input_wrap{text-align:left; border-bottom:1px solid #dadada;}
.input_wrap.error{background:#ffd0d0;}
.input_wrap .fas{color:#27dc98; width:70px; text-align:center;}
.input_wrap input{line-height:60px; width:calc(100% - 94px); padding:0 10px; font-size:18px; border:none; background:none;}
.input_wrap input:focus{outline: none;}

.login_submit{background:#27dc98; color:#fff; width:100px; line-height:60px; width:100%; border:none; border-radius:3px; margin:20px 0 0 0; font-size:18px; cursor:pointer; transition:all .2s ease;}
.login_submit:hover{background:#15b376;}

.dashboard_wrap{position:absolute; top:0; right:0; bottom:0; left:0;}

.header_wrap{position:absolute; top:0; right:0; left:0; background:#51be8c; padding:10px;}
.header_wrap .logo_wrap{display:inline-block;}
.header_wrap .logo_wrap img{height:30px; width:auto;}
.header_wrap .logo_wrap h1{display:inline-block; font-size:20px; color:#fff; vertical-align:top; line-height:33px; margin:0 0 0 20px;}

.header_wrap .nav_menu_wrap{display:block; float:right; margin:-10px -10px -10px 0;}
.header_wrap .nav_menu_wrap a{display:block; color:#fff; float:left; text-decoration:none; line-height:55px; padding:0 25px; border-left:1px solid #37ab76; font-weight:500; transition:all .2s ease;}
.header_wrap .nav_menu_wrap a:hover{background:#44b17e;}
.header_wrap .nav_menu_wrap .fa{margin:0 15px 0 0; color:#b4f3db;}

.sidebar_wrap{position:absolute; top:55px; left:0; bottom:0; background:#e8e8e8; width:300px;}

.dashboard_content{position:absolute; top:55px; left:0; right:0; bottom:0; padding:25px 10px 25px 30px; overflow-y:scroll;}

.page_title{margin:0 0 20px 0;}
.page_title .button{margin:3px 0 0 20px; font-size:16px; vertical-align:top; font-weight:normal;}
.page_title>.fa{margin:0 15px 0 0; opacity:.5;}


.new_listing_form .location-search-input{width:100%; font-size:25px !important; padding:8px 25px; box-sizing: border-box; border:2px solid #51be8c;}
.new_listing_form .location-search-input:active{outline:none;}
.new_listing_form .location-search-input:focus{outline:none;}

.address_search_wrap{position:relative; width:calc(100% - 150px); display:inline-block;}
.autocomplete-dropdown-container{position:absolute; top:100%; left:0; font-size:13px; font-weight:bold; z-index:999;}
.autocomplete-dropdown-container div{color:#8f8f8f; padding:10px 20px; border-bottom:1px solid #dadada;}
.address_search_button{width:150px; height:54px; line-height:54px; vertical-align:top; margin:0 0 0 -2px; font-weight:bold; font-size:17px;}
.address_search_button .fa{margin:0 10px 0 0;}
.address_search_button:active{outline:none;}
.address_search_button:focus{outline:none;}

.map_wrap{margin:20px 0; height:400px; width:100%; border:none;}
.map_wrap .map_pointer{font-size:30px; color:#ff7300;}

.new_listing_form .form_section{padding:20px; background:#fdfdfd; margin:20px 0; box-shadow:0 1px 3px rgba(0,0,0,0.05); overflow:hidden;}
.new_listing_form .form_section h3{margin:0 0 10px 0;}
.new_listing_form .form_section h3 .fa{margin:0 10px 0 0; opacity:.7;}
/* .new_listing_form .input_wrap2{border-bottom:1px solid #dadada; padding:12px 20px;} */
/* .new_listing_form label{display:block; font-weight:bold; margin:0 0 5px 0;} */
.new_listing_form .images_holder{border:1px solid #eee; padding:20px; margin:0 0 10px 0; background:#f9f9f9;}
.new_listing_form #image_upload{visibility:hidden; position:absolute; left:-1000px;}
.new_listing_form .no_image_message{opacity:.6; font-style:italic;}
.new_listing_form .image_instructions{opacity:.6; font-style:italic; margin:0 0 20px 0; display:block;}
.new_listing_form [type=text], .new_listing_form [type=number], .new_listing_form select{font-size:20px;}
.new_listing_form [type=submit]{font-size:20px; padding:10px 20px;}
.new_listing_form [type=submit] .fa{margin:0 10px 0 0;}
.new_listing_form .description{height:200px;}

.listing_image{width:19%; box-sizing:border-box; float:left; padding:12% 0 0 0; background-size:cover; background-repeat:no-repeat; background-position:center center; margin:0 1% 1% 0; position:relative; cursor:move;}
.listing_image .delete_image{position:absolute; top:5px; right:5px; color:#fff; font-size:24px; opacity:.4; transition:all .2s ease; cursor:pointer; text-shadow:1px 1px 1px rgba(0,0,0,.5);}
.listing_image:hover .delete_image{opacity:.9;}
.listing_image:first-child:before{content:"\f005"; font-family:"Font Awesome 5 Free"; color:#ffca00; position:absolute; top:10px; left:10px; font-weight:bold; text-shadow:1px 1px 1px rgba(0,0,0,.6); font-size:20px;}

.lightbox_message_mask{position:fixed; top:0; right:0; bottom:0; left:0; background:rgba(255,255,255,0.7); z-index:99; }
.lightbox_message{position:fixed; top:15px; left: calc(50% - 170px); width:300px; padding:20px; background:#fff; z-index:99; text-align:center; font-size:20px; box-shadow:0px 0px 5px rgba(0,0,0,.2);}
.lightbox_message .icon_wrap{font-size:45px; opacity:.1; margin:0 0 10px 0;}
.lightbox_message .button_wrap{margin:20px 0 0 0;}
.lightbox_message .button{font-size:17px; line-height:40px;}

.loading_spinner{position:fixed; top:0; right:0; bottom:0; left:0; background:rgba(255,255,255,0.7); z-index:99;}
.loading_spinner svg{position:absolute; top:calc(50% - 50px); left:calc(50% - 25px);}
.loading_spinner .loading_message{position:absolute; top:calc(50% + 10px); left:0; right:0; text-align:center; font-weight:bold; opacity:.5;}

.listings{margin:40px 0 0 0;}
.listings .listing{width:calc(20% - 20px); float:left; background:#ffffff; margin:0 20px 20px 0; padding:0 20px 20px 20px; box-sizing:border-box; border-top:5px solid #888888; box-shadow:0 1px 3px rgba(0,0,0,0.05);}
.listings .for_sale{border-top:5px solid #51be8c;}
.listings .sale_pending{border-top:5px solid #ff7800;}
.listings .listing:nth-child(5n+1){clear:both;}
/* .listings .status_banner{background:#f1f1f1; padding:7px; text-align:center; margin:0 0 10px 0; font-weight:bold;} */
.listings .listing_image_dashboard{padding:50% 0 0 0; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.listings .listing_title{font-weight:bold; font-size:16px; float:left; width:65%; padding:15px 0;}
.listings .listing_status{float:left; width:35%; font-size:15px; text-align:right; font-weight:bold; padding:15px 0; color:#888888;}
.listings .for_sale .listing_status{color:#51be8c;}
.listings .sale_pending .listing_status{color:#ff7800;}
.listings .listing_info_row{border-bottom:1px solid #f1f1f1; text-align:center; }
.listings .cell{float:left; width:50%; padding:10px; box-sizing: border-box;}
.listings .value{font-weight:bold; font-size:16px; opacity:.7;}
.listings .label{font-size:10px; opacity:.5;}
.listings .listing_controls{margin:10px 0 0 0; text-align:center;}
.listings .listing_controls .button{font-size:15px; font-weight:bold; display:block; background:#eee; padding:5px 0px;}
.listings .listing_controls .button:hover{background:#dadada;}
/* .listings .for_sale .status_value{color:#51be8c;} */

.no_listings_message{width:60%; background:#f9f9f9; margin:50px auto; padding:100px; text-align:center;}
.no_listings_message p{font-size:20px; font-style:italic;}

.account_form{padding:20px; background:#fdfdfd; margin:20px 0; box-shadow:0 1px 3px rgba(0,0,0,0.05); overflow:hidden;}

.widget_code{font-size:13px; background:#f9f9f9; padding:10px 20px; border:2px solid #dadada; font-weight:700; height:250px; width:100%; box-sizing:border-box; resize:none;}

@media only screen and (max-width: 1200px){
	.header_wrap .nav_menu_wrap a{padding:0 18px;}

}

@media only screen and (max-width: 768px){
    .header_wrap .logo_wrap img{height:20px;}
    .header_wrap .logo_wrap h1{font-size:15px; margin:0 0 0 10px; line-height:22px;}
	.header_wrap .nav_menu_wrap a{line-height:normal; text-align:center; padding:7px 10px 3px 10px;}
	.header_wrap .nav_menu_wrap a span{display:block; font-size:10px; color:#b4f3db; margin:-2px 0 0 0;}
	.header_wrap .nav_menu_wrap a .fa{margin:0; font-size:20px; color:#fff;}
}