* {  
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  margin:0;	
}

.up {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

.arleft {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

.arright {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

i {
  border: solid black;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
}

@import url('https://fonts.googleapis.com/css?family=Quicksand:400,500,700');

@font-face {
    font-family: 'aldhabiregular';
    src: url('aldhabi-webfont.woff2') format('woff2'),
         url('aldhabi-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

html, body {height: 100%; margin: 0; padding: 0; font-family: 'Quicksand', sans-serif; color:#817c83; font-size:16px;   scroll-behavior: smooth;}
body > #container { height: auto; min-height: 100%; }
#container {height: 100%; margin-top: 0px; padding: 0; 	font-family:'Quicksand', sans-serif; color:#817c83; font-size:16px;    background:#ffffff; }
#containerside {height: 100%; margin-top: 0px; background:#ffffff; }

body > #containergrey { height: auto; min-height: 100%; font-family:'Quicksand', sans-serif; color:#817c83; font-size:16px;}
#containergrey { margin-top: 0px; padding: 0;

  overflow-y: auto; /* has to be scroll, not auto */
  -webkit-overflow-scrolling: touch;
}
body > #minimenu { height: auto; min-height: 100%; }



.restitle { font-family: 'Source Sans Pro', sans-serif; }


@media screen and (max-width:768px) {
  .size-960,.size-1140,.size-1280 {max-width:768px;}
.warp {
height: auto; min-height: 100%;
 display: table;
	.block {
		display:table-cell;
		vertical-aligment: middle;
		height: 100%;	
		width: 100%;
		}
	}
}

.warpfull {
height: auto; min-height: 100%;
 display: table;
	.blockfull {
		display:table-cell;
		vertical-aligment: middle;
		height: 100%;	
		width: 100%;
		}
	}
}


body, .smooth-container { scroll-behavior: smooth }

.titlemain { font-family: 'aldhabiregular'; }

a, a:link, a:visited {
text-decoration: none;
outline: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
-webkit-tap-highlight-color: transparent;
}
#footer { clear: both; position: relative; z-index: 1; height: 1em;}

h1,h2,h3,h4,h5,h6 {
  color:#000000;
  font-weight: normal;
  line-height: 1.3;
  margin:0.5rem 0;  
}

.btn {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  display: inline-block;
  padding: 11px 11px 11px 11px;
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
  border: 0px;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
}

.btn:hover {
	background-color:rgba(0, 0, 0, 0.5);
}

.lineone {
  height: 20px;
}


.btnorange {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #ff6c00;
  border: 1px solid #ff6c00!important;
}

.img-hover-zoom {
  height: 225px;
  overflow: hidden;
  border-radius: 8px 8px 8px 8px;
}

.img-hover-zoom--zoom-n-pan-v img {
  transition: transform .35s;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: 0 0;
}

.img-hover-zoom--zoom-n-pan-v:hover img {
  transform: scale(1.15) translateY(-7%) translateX(-7%);
}

.gmenulink {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  font-weight: 500;
  padding: 8px 8px 8px 8px;
  font-size: 1.15 rem;
  color: #fafafa; 
  outline:none;
  text-decoration: none;
}

.gmenulink:hover {
  background-color: #3e9340;
  color: #ffffff; 
  transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.input {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  display: inline-block;
  padding: 10px 10px 10px 10px;
  white-space: nowrap;
  vertical-align: middle;
  background-color: #ffffff;
  color: #333333 !important;
  border: 1px solid #eaeaea;
  outline:none;
}

.input:focus, .input:active {
 outline:none;
}

.bbottom {
  border-top: 1px solid #ffffff !important;
  border-left: 1px solid #ffffff !important;
  border-right: 1px solid #ffffff !important;
  border-bottom: 1px solid #888888 !important;
}

.inputnoframe {
  font-family: 'Quicksand', sans-serif;
  font-weight: 400;
  font-size: 14px;
  display: inline-block;

  white-space: nowrap;
  vertical-align: middle;
  color: #333333 !important;
  border: 0px;
  outline:none;
}

.inputnoframe:focus, .inputnoframe:active {
 outline:none;
}

.topmargin10 {
margin-top: 10px;
}

.asmall {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  font-size:10px;
  color: #000000;
}
.btnwhiteborder {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 1px solid #495057;
  background-color: #ffffff; 
  font-weight: 400;
  padding: 5px 8px 5px 8px;
  font-size:10px;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
  color: #495057;
}

.btnwhiteborder:hover {
  color: #395057;
  background-color: #f2f2f2;   transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.btngo {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 0px;
  background-color: #e6e6e6; 
  font-weight: 600;
  padding: 10px 10px 10px 10px;
  font-size:12px;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
  color: #df4500;
}

.btngo:hover {
  color: #df4500;
  background-color: #c6c6c6;    transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.btnwhite {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: left;
  vertical-align: middle;
  cursor: pointer;
  border: 0px;
  background-color: #ffffff; 
  font-weight: 500;
  padding: 5px 10px;
  font-size:14px;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
  color: #495057;
}

.btnwhite:hover {
  background-color: #95a7b3;   transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.btnwhite_dis {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: left;
  vertical-align: middle;
  border: 0px;
  background-color: #ffffff; 
  font-weight: 500;
  padding: 5px 10px;
  font-size:14px !important;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
  color: #333333 !important;
}

.btnwhitel {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 0px;
  background-color: #fcf6dc; 
  font-weight: 500;
  padding: 4px 18px;
  font-size:14px;
  line-height: 30px;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
  color: #495057;
}

.btnwhitel:hover {
  color: #395057;
  background-color: #95a7b3;   transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.btnwhitey {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 0px;
  background-color: #f2f760; 
  font-weight: 500;
  padding: 4px 18px;
  font-size:14px;
  line-height: 30px;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
  color: #495057;
}

.btnwhitey:hover {
  color: #000000;
  background-color: #eef611;   transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.btnclose {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  border: 1px solid #f8f8f8;
  background-color: #f8f8f8; 
  font-weight: 500;
  padding: 4px 18px;
  font-size:14px;
  line-height: 30px;
  color: #777777;  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
}

.btnclose:hover {
  color: #000000;
  background-color: #eaeaea;   transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.btnadmin {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  border: 1px solid #f8f8f8;
  background-color: #f8f8f8; 
  font-weight: 400;
  padding: 4px 18px;
  font-size:14px;
  color: #777777;  transition-duration: 0.4s;
  transition:all 0.3s ease;
  outline:none;
}

.btnadmin:hover {
  color: #000000;
  background-color: #eaeaea;   transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.btnmenuorg {
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  border-radius: 90px;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  border: 1px solid #fd9125;
  background-color: #ffffff; 
  font-weight: 600;
  padding: 2px 45px;
  font-size:18px;
  line-height: 30px;
  color: #fd9125;  transition-duration: 0.4s;
  transition:all 0.3s ease;
    outline:none;
}

.btnmenuorg:hover {
  color: #ffffff;
  background-color: #fd9125;   transition-duration: 0.4s;
  transition:all 0.3s ease;
}

.btnmenuorga {
  color: #ffffff;
  padding: 2px 45px;
  font-size:18px;
  line-height: 30px;
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  border-radius: 90px;
  font-weight: 600;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  border: 1px solid #fd9125;
  background-color: #fd9125; 
}

.noborder {  border:0px; } 

.btngreen {
  color: #ffffff;
  background-color: #48c890;
}
.btngreen:hover {
  background-color: #2ba46f;
  transition:all 0.3s ease;
}



.btnred {
  color: #ffffff;
  background-color: #f24630;
}
.btnred:hover {
  background-color: #9f2d1b;
  transition:all 0.3s ease;
}
.bgred {
  background-color: #f24630;
}




.text600 {
  font-weight: 700;
}
mono {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  padding: 8px 5px;
  color: #434345;
  font-size:18px;
  line-height: 30px;
	}

.text14 {
  font-size: 14px;
}
.text14s {
  font-size: 14px;
  padding: 10px 19px 10px 19px;
}
.textsm {
  font-size: 14px;
  padding: 2px 2px 2px 2px;
}
.text14smm {
  font-size: 14px;
  padding: 4px 0px 4px 0px;
}

.text14sm {
  font-size: 14px;
  padding: 2px 5px 2px 5px;
}
.text14ss {
  font-size: 14px;
  padding: 5px 2px 5px 2px;
}

.text14sss {
  font-size: 14px;
  padding: 8px 8px 8px 8px;
}

.text18 {
  font-size: 18px;
  padding: 15px 23px 15px 23px;
}

.text16 {
  font-size: 16px;
  padding: 10px 10px 10px 10px;
}
.text_22 {font-size:3.5rem;}  

.tiny {font-size:0.85rem;   color: #333333;}  

.text_big {font-size:3.5rem;}  

.text_18 {font-size:2.5rem;}  
.text_225 {font-size:2.25rem;}  
.text_16 {font-size:1.85rem!important;}  
.text_15 {font-size:1.50rem;} 
.text_14 {font-size:1.35rem;}
.text_125 {font-size:1.25rem;} 
.text_12 {font-size:1.15rem;}
.text_10 {font-size:1.0rem;}
.text_085 {font-size:0.85rem;}
.text_075 {font-size:0.75rem;}     
.bold { font-weight: 700 !important; }
.bold5 { font-weight: 500 !important; }
.thin {font-weight: 400; }

.textsmall {
  font-size: 10px;
  padding: 10px 5px 10px 5px;
}

.btnmm {
  font-family: 'Quicksand', sans-serif;
  padding: 7px 5px 5px 5px;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  display:inline-block;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  color: #434345;
  border: 0px;
  transition: ease-in-out 0.15s;
  transition-duration: 0.4s;
}
.btnmm:hover {
  color: #36c839;
  transition:all 0.3s ease;
}

.btnmmgreen {
  font-family: 'Quicksand', sans-serif;
  padding: 10px 20px 10px 20px;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  display:inline-block;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  color: #ffffff;
  border-radius: 5px;
  background-color: #36c839;  
  transition: ease-in-out 0.15s;
  transition-duration: 0.4s;
}
.btnmmgreen:hover {
  background-color: #43f646;  
  transition:all 0.3s ease;
}

.textcenter {
  text-align: center;
}




.btnyellow {
  background-color: #fff769;
  border: 1px solid #fff769!important;
}

.btnblack {
  background-color: #000000;
  border: 1px solid #000000!important;
}

.btngrey {
  background-color: #bbbbbb;
  border: 1px solid #bbbbbb!important;
}

.btngrey5 {
  background-color: #f3eded;
  border: 1px solid #f3eded!important;
}


.btnblue {
  background-color: #25a9f4;
  font-family: 'Quicksand', sans-serif;
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  transition-duration: 0.4s;
  transition:all 0.3s ease;
  border: 0px;
}

.btnblue:hover {
  color: #ffffff;
  background-color: #6bc4f6;
  transition:all 0.3s ease;
}


.textred {
  color: #d34632;
}
.textbeachgreen {
  color: #004d43;
}


.textwhite {
  color: #ffffff;
}

.textdb1 {
  color: #496475;
}
.textdb2 {
  color: #8b8b8b;
}
.textblack {
  color: #000000;
}
.textorg {
  color: #fd9125;
}
.textgrey {
  color: #666666;
}

.w40 {
  width: 40px;
}

.w45 {
  width: 45px;
}

.w30 {
  width: 30px;
}

.w60 {
  width: 60px;
}

.mw360 {
  max-width: 400px;
}

.txtshadowx {
text-shadow: 2px 2px 0 rgba(255,255,255,0.75) ;
}





.btntxt {
  font-family:'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 14px;
  padding: 2px 2px 2px 2px;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
  vertical-align: middle;
  background-color: #ffffff;
  color: #d34632 !important;
  border: 0px ;
  transition: ease-in-out 0.15s;
  transition-duration: 0.4s;
}
.btntxt:hover {
  color: #000000 !important;
  transition:all 0.3s ease;
}
.btntxt:active, .btntxt:focus  {
 border-style: outset;
 outline:none;
}

.btntxtm {
  font-family:'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 16px;
  text-align: center;
  cursor: pointer;
  white-space: nowrap;
  vertical-align: middle;
  background-color: #ffffff;
  color: #333333 !important;
  border: 0px ;
  transition: ease-in-out 0.15s;
  transition-duration: 0.4s;
}
.btntxtm:hover {
  color: #000000 !important;
  transition:all 0.3s ease;
}
.btntxtm:active, .btntxtm:focus  {
 border-style: outset;
 outline:none;
}

indextitle {
font-family: 'Quicksand', sans-serif;
width: 100%;

font-size: 4.0rem;
color: #d34632;
font-weight: 700;
text-shadow: 1px 1px 5px rgba(0, 0, 0, 1);
text-align: center;
z-index: 2;
}

indextitlenos {
font-family: 'Quicksand', sans-serif;
width: 100%;
font-size: 3.0rem;
color: #d34632;
font-weight: 700;
text-align: center;

}


h1b {
font-family: 'Quicksand', sans-serif;
font-size:1.35rem;
color: #d03430;
font-weight: 700;
}
h1c {
  color:#d03430;
  font-weight: 500;
  font-size: 1.5rem;
}

mycenter {text-align: center;}
myleft {text-align: left;}

h1 {font-size:2.2rem;color: #d03430;}
h2 {font-size:2.2rem;}  
h3 {font-size:1.8rem;}  
h4 {font-size:1.4rem;}  
h5 {font-size:1.1rem;}  
h6 {font-size:0.9rem;}    


b,strong {font-weight:700;}
.text-center {text-align:center!important;}
.text-right {text-align:right!important;}
.text-left {text-align:left!important;}
.text-justify {text-align:justify!important;}







.border {  border:1px solid #ffffff; } 

table {
  background: #fff;
  border:1px solid #ffffff;
  border-collapse:collapse;
  border-spacing:0;
  text-align:center;
  width:100%;
}
table tr td, table tr th {padding:0px;}
table tfoot, table thead,table tr:nth-of-type(2n) {background:none repeat scroll 0 0 #ffffff;}
th,table tr:nth-of-type(2n) td {border-right:0px solid #fff;}
td {border:0px solid #f0f0f0;}
.size-960 .line,.size-1140 .line,.size-1280 .line {
  margin:0 auto;
}

.w400 {
  max-width:400px;
}

hr {
  border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
  clear:both;  
  margin: .7rem auto;
}

blockquote {
  border:2px solid #f0f0f0;
  padding:1.25rem;
}
cite {
  color:#999;
  display:block;
  font-size:0.8rem;
}
cite:before {content:"— ";}
dl dt {font-weight:700;}
dl dd {margin-bottom:0.625rem;}
dl dd:last-child {margin-bottom:0;}
abbr {cursor:help;}
abbr[title] {border-bottom:1px dotted;}
kbd {
  background: #152732 none repeat scroll 0 0;
  color: #fff;
  padding: 0.125rem 0.3125rem;
}
code, kbd, pre, samp {font-family: Menlo,Monaco,Consolas,"Courier New",monospace;}
mark {
  background: #F3F8A9 none repeat scroll 0 0;
  padding: 0.125rem 0.3125rem;
}
.size-960 .line {max-width:60rem;}
.size-1140 .line {max-width:71.25rem;}
.size-1280 .line {max-width:80rem;}
.size-960.align-content-left .line,.size-1140.align-content-left .line,.size-1280.align-content-left .line {margin-left:0;}

.topmargin25 {
margin-top: 0.25rem;
}

.topmargin05 {
margin-top: 0.5rem;
}
.sidebar {
  position: fixed;
  width: 240px;
  height: 100vh;
  background: #222d32;
  z-index: 999;
  overflow-y: auto;
}

.navside {
  position: relative;
  font-weight: 500;
}

.twitterxcx {
  position: relative;
  width: 100%;
  padding-left: 240px;
  float: left;
  min-height: 100%;
  
  .containerxcx {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
  }
  
  a {
    position: relative;
    
    img {
      width: 48px;
      height: 48px;
    }
  }
  
  p {
    text-transform: uppercase;
    font-size: 1em;
    letter-spacing: 0.1em;
    color: #FFF;
    font-weight: bold;
    margin-top: 20px;
  }
}

.topmargin {
margin-top: 1.0rem;
}

.topmarginv {
margin-top: 2.0rem;
}

.marginleftrightbig {
padding-left: 25px;
padding-right: 25px;
}

.margintb6 {
padding-top: 6px;
padding-bottom: 6px;
}

.marginleft {
padding-left: 5px;
}

.marginleft2 {
padding-left: 3rem;
}

.marginright3 {
padding-right: 3px;
}

.marginleft3 {
padding-left: 3px;
}

.marginright7 {
padding-right: 1rem;
}

.marginleft7 {
padding-left: 1rem;
}

.marginleft5 {
padding-left: 2rem;
}

.marginmenu {
padding-left: 3rem;
padding-right: 3rem;
}

.marginright5 {
padding-right: 2rem;
}

.marginright {
padding-right: 5px;
}
.bottommargin {
margin-bottom: .5rem;
}

.black {
  background:#000000;
}

nav {
  display: table;
  table-layout: fixed;
}

.happyface {
    border-radius: 50%;
    overflow: hidden;
    width: 6rem;
    height: 6rem;
    background-size: cover;
}

.line:after, nav:after, .center:after, .box:after, .margin:after, .margin2x:after {
  clear:both;
  content:".";
  display:block;

  height:0;
  line-height:0;
  overflow: hidden;
  visibility:hidden;
}
.top-nav ul {padding:0; }
.top-nav ul ul {
  position:absolute;
  background:#dddddd;
  display: block;
  top: 0;
  transform: translateY(-100%);
}
.top-nav li {
  float:right;
  list-style:none outside none;
  background:#fafafa;
  cursor:pointer;
}

.top-nav li ul li a {
  background:none repeat scroll 0 0 #871919;
  min-width:100%;
  padding:0.75rem;

}


.boxx {
  position: relative;
  display: inline-block;
  border: 0px solid #888888;
  background-color: #ffffff;
}

.box2x {
  display: inline-block;
  border: 0px;
  transition: .2s ease;
  position:relative;     
  box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 10px rgba(148, 148, 148, 0.1) inset;
}

.box2x:hover {
  box-shadow:0 1px 6px rgba(0, 0, 0, 0.4), 0 0 0px rgba(0, 0, 0, 0.1) inset;
    transition: .2s ease;
}


.paddingbig {
  padding:25px 25px 25px 25px;
}

.padding15 {
  padding:15px 15px 15px 15px;
}

.padding {
  padding:10px 10px 10px 10px;
}

.padding8 {
  padding:8px 10px 8px 10px;
}


.paddinglr10 {
  padding: 0px 10px 0px 10px;
}

.paddingtb {
  padding:10px 0px 10px 0px;
}

.paddingtb2 {
  padding:2px 0px 2px 0px;
}

.paddingtb4 {
  padding:4px 0px 4px 0px;
}

.padding5 {
  display:list-item;
  list-style:none outside none;
  padding:5px 5px 5px 5px;
}

.padding515 {
  display:list-item;
  list-style:none outside none;
  padding:14px 5px 15px 5px;
}

.margintop1 {
  margin-top:1px;
}


.margin,.margin2x {display: block;}
.margin {margin:0 -0.625rem;}
.margin2x {margin:0 -1.25rem;}
.line {clear:left;}
.line .line {padding:0;}
.hide-l {display:none!important;}
.box {
  background:none repeat scroll 0 0 #fff;
  display:block;
  padding:1.25rem;
  width:100%;
}
.margin-bottom {margin-bottom:1.25rem;}
.margin-bottom2x {margin-bottom:2.5rem;}
.s-1, .s-2, .s-five,.s-3, .s-4, .s-5, .s-6, .s-7, .s-8, .s-9, .s-10, .s-11, .s-12, .m-1, .m-2, .m-five, .m-five2, .m-3, .m-4, .m-5, .m-6, .m-7, .m-8, .m-9, .m-10, .m-11, .m-12, .l-1, .l-2, .l-five, .l-five2, .l-3, .l-4, .l-5, .l-6, .l-7, .l-8, .l-9, .l-10, .l-11, .l-12 {
  float:left;
  position:static;
}
.l-offset-1 {margin-left:8.3333%;}
.l-offset-2 {margin-left:16.6666%;}
.l-offset-five {margin-left:16.6666%;}
.l-offset-3 {margin-left:25%;}
.l-offset-4 {margin-left:33.3333%;}
.l-offset-5 {margin-left:41.6666%;}
.l-offset-6 {margin-left:50%;}
.l-offset-7 {margin-left:58.3333%;}
.l-offset-8 {margin-left:66.6666%;}
.l-offset-9 {margin-left:75%;}
.l-offset-10 {margin-left:83.3333%;}
.l-offset-11 {margin-left:91.6666%;}
.l-offset-12 {margin-left:100%;} 
.s-1 {width:8.3333%;}
.s-2 {width:16.6666%;}
.s-five {width:16.6666%;}
.s-3 {width:25%;}
.s-4 {width:33.3333%;}
.s-5 {width:41.6666%;}
.s-6 {width:50%;}
.s-7 {width:58.3333%;}
.s-8 {width:66.6666%;}
.s-9 {width:75%;}
.s-10 {width:83.3333%;}
.s-11 {width:91.6666%;}
.s-12 {width:100%;}
.margin > .s-1,.margin > .s-2,.margin > .s-five,.margin > .s-3,.margin > .s-4,.margin > .s-5,.margin > .s-6,.margin > .s-7,.margin > .s-8,.margin > .s-9,.margin > .s-10,.margin > .s-11,.margin > .s-12,
.margin > .m-1,.margin > .m-2,.margin > .m-five,.margin > .m-five2,.margin > .m-3,.margin > .m-4,.margin > .m-5,.margin > .m-6,.margin > .m-7,.margin > .m-8,.margin > .m-9,.margin > .m-10,.margin > .m-11,.margin > .m-12,
.margin > .l-1,.margin > .l-2,.margin > .l-five,.margin > .l-five,.margin > .l-3,.margin > .l-4,.margin > .l-5,.margin > .l-6,.margin > .l-7,.margin > .l-8,.margin > .l-9,.margin > .l-10,.margin > .l-11,.margin > .l-12 {padding:0 0.625rem;}
.margin2x > .s-1,.margin2x > .s-2,.margin2x > .s-five,.margin2x > .s-3,.margin2x > .s-4,.margin2x > .s-5,.margin2x > .s-6,.margin2x > .s-7,.margin2x > .s-8,.margin2x > .s-9,.margin2x > .s-10,.margin2x > .s-11,.margin2x > .s-12,
.margin2x > .m-1,.margin2x > .m-2,.margin2x > .m-five,.margin2x > .m-five2,.margin2x > .m-3,.margin2x > .m-4,.margin2x > .m-5,.margin2x > .m-6,.margin2x > .m-7,.margin2x > .m-8,.margin2x > .m-9,.margin2x > .m-10,.margin2x > .m-11,.margin2x > .m-12,
.margin2x > .l-1,.margin2x > .l-2,.margin2x > .l-five,.margin2x > .l-five,.margin2x > .l-3,.margin2x > .l-4,.margin2x > .l-5,.margin2x > .l-6,.margin2x > .l-7,.margin2x > .l-8,.margin2x > .l-9,.margin2x > .l-10,.margin2x > .l-11,.margin2x > .l-12 {padding:0 1.25rem;}
.m-1 {width:8.3333%;}
.m-2 {width:16.6666%;}
.m-five {width:20%;}
.m-five2 {width:80%;}
.m-3 {width:25%;}
.m-4 {width:33.3333%;}
.m-5 {width:41.6666%;}
.m-6 {width:50%;}
.m-7 {width:58.3333%;}
.m-8 {width:66.6666%;}
.m-9 {width:75%;}
.m-10 {width:83.3333%;}
.m-11 {width:91.6666%;}
.m-12 {width:100%;}
.l-1 {width:8.3333%;}
.l-2 {width:16.6666%;}
.l-five {width:20%;}
.l-3 {width:25%;}
.l-4 {width:33.3333%;}
.l-5 {width:41.6666%;}
.l-6 {width:50%;}
.l-7 {width:58.3333%;}
.l-8 {width:66.6666%;}
.l-9 {width:75%;}
.l-five2 {width:80%;}
.l-10 {width:83.3333%;}
.l-11 {width:91.6666%;}
.l-12 {width:100%;}
.right {float:right;}
.left {float:left;}  
.mycenter {text-align:center;}
.myleft {text-align:left;}
.myright {text-align:right;}
.myrightfloat {float:right;}
@media screen and (max-width:1060px) {
  .size-960,.size-1140,.size-1280 {max-width:1060px;}
  .hide-l,.hide-s {display:block!important;}
  .hide-m {display:none!important;}

  .l-offset-1,.l-offset-2,.l-offset-five,.l-offset-3,.l-offset-4,.l-offset-5,.l-offset-6,.l-offset-7,.l-offset-8,.l-offset-9,.l-offset-10,.l-offset-11,.l-offset-12{margin-left:0;}
  .m-offset-1 {margin-left:8.3333%;}
  .m-offset-2 {margin-left:16.6666%;}
  .m-offset-five {margin-left:16.6666%;}
  .m-offset-3 {margin-left:25%;}
  .m-offset-4 {margin-left:33.3333%;}
  .m-offset-5 {margin-left:41.6666%;}
  .m-offset-6 {margin-left:50%;}
  .m-offset-7 {margin-left:58.3333%;}
  .m-offset-8 {margin-left:66.6666%;}
  .m-offset-9 {margin-left:75%;}
  .m-offset-10 {margin-left:83.3333%;}
  .m-offset-11 {margin-left:91.6666%;}
  .m-offset-12 {margin-left:100%;} 
  .l-1 {width:8.3333%;}
  .l-2 {width:16.6666%;}
  .l-five {width:20%;}
  .l-five2 {width:80%;}
  .l-3 {width:25%;}
  .l-4 {width:33.3333%;}
  .l-5 {width:41.6666%;}
  .l-6 {width:50%;}
  .l-7 {width:58.3333%;}
  .l-8 {width:66.6666%;}
  .l-9 {width:75%;}
  .l-10 {width:83.3333%;}
  .l-11 {width:91.6666%;}
  .l-12 {width:100%;}
  .s-1 {width:8.3333%;}
  .s-2 {width:16.6666%;}
  .s-five {width:20%;}
  .s-3 {width:25%;}
  .s-4 {width:33.3333%;}
  .s-5 {width:41.6666%;}
  .s-6 {width:50%;}
  .s-7 {width:58.3333%;}
  .s-8 {width:66.6666%;}
  .s-9 {width:75%;}
  .s-10 {width:83.3333%;}
  .s-11 {width:91.6666%;}
  .s-12 {width:100%}
  .m-1 {width:8.3333%;}
  .m-2 {width:16.6666%;}
  .m-five {width:20%;}
  .m-five2 {width:80%;}
  .m-3 {width:25%;}
  .m-4 {width:33.3333%;}
  .m-5 {width:41.6666%;}
  .m-6 {width:50%;}
  .m-7 {width:58.3333%;}
  .m-8 {width:66.6666%;}
  .m-9 {width:75%;}
  .m-10 {width:83.3333%;}
  .m-11 {width:91.6666%;}
  .m-12 {width:100%}
}
@media screen and (max-width:768px) {
  .size-960,.size-1140,.size-1280 {max-width:768px;}

  .hide-l,.hide-m {display:block!important;}
  .hide-s {display:none!important;}
  .count-number {margin-right:-1.25rem;} 
  .l-offset-1,.l-offset-2,.l-offset-five,.l-offset-3,.l-offset-4,.l-offset-5,.l-offset-6,.l-offset-7,.l-offset-8,.l-offset-9,.l-offset-10,.l-offset-11,.l-offset-12,
  .m-offset-1,.m-offset-2,.m-offset-five,.m-offset-3,.m-offset-4,.m-offset-5,.m-offset-6,.m-offset-7,.m-offset-8,.m-offset-9,.m-offset-10,.m-offset-11,.m-offset-12 {margin-left:0;}
  .s-offset-1 {margin-left:8.3333%;}
  .s-offset-2 {margin-left:16.6666%;}
  .s-offset-five {margin-left:16.6666%;}
  .s-offset-3 {margin-left:25%;}
  .s-offset-4 {margin-left:33.3333%;}
  .s-offset-5 {margin-left:41.6666%;}
  .s-offset-6 {margin-left:50%;}
  .s-offset-7 {margin-left:58.3333%;}
  .s-offset-8 {margin-left:66.6666%;}
  .s-offset-9 {margin-left:75%;}
  .s-offset-10 {margin-left:83.3333%;}
  .s-offset-11 {margin-left:91.6666%;}
  .s-offset-12 {margin-left:100%;} 
  .l-1 {width:8.3333%;}
  .l-2 {width:16.6666%;}
  .l-five {width:20%;}
  .l-five2 {width:80%;}
  .l-3 {width:25%;}
  .l-4 {width:33.3333%;}
  .l-5 {width:41.6666%;}
  .l-6 {width:50%;}
  .l-7 {width:58.3333%;}
  .l-8 {width:66.6666%;}
  .l-9 {width:75%;}
  .l-10 {width:83.3333%;}
  .l-11 {width:91.6666%;}
  .l-12 {width:100%;}
  .m-1 {width:8.3333%;}
  .m-2 {width:16.6666%;}
  .m-five {width:20%;}
  .m-five2 {width:80%;}
  .m-3 {width:25%;}
  .m-4 {width:33.3333%;}
  .m-5 {width:41.6666%;}
  .m-6 {width:50%;}
  .m-7 {width:58.3333%;}
  .m-8 {width:66.6666%;}
  .m-9 {width:75%;}
  .m-10 {width:83.3333%;}
  .m-11 {width:91.6666%;}
  .m-12 {width:100%}
  .s-1 {width:8.3333%;}
  .s-2 {width:16.6666%;}
  .s-five {width:20%;}
  .s-3 {width:25%;}
  .s-4 {width:33.3333%;}
  .s-5 {width:41.6666%;}
  .s-6 {width:50%;}
  .s-7 {width:58.3333%;}
  .s-8 {width:66.6666%;}
  .s-9 {width:75%;}
  .s-10 {width:83.3333%;}
  .s-11 {width:91.6666%;}
  .s-12 {width:100%}
}  
.center {
  float:none;
  margin:0 auto;
  display:block;
}

title
{
font-size:2.7rem;
color: #d03430;
}


.btnadd {
  font-family:'Quicksand', sans-serif;
  display: inline-block;
  padding: 0px 0px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-color: #ffffff;
  border: 1px solid #ffffff;
  border-radius: 3px;
  transition-duration: 0.4s;
}



.btnadd:active, .btnadd:focus  {
 border-style: outset;
 outline:none;
}


.btnaddcho {
  font-family:'Quicksand', sans-serif;
  display: block;
  width: 100%;
  padding: 0px 0px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-color: #ffffff;
  border: 1px solid #ffffff;
  border-radius: 3px;
  transition-duration: 0.4s;
}

.btnaddcho:hover, .btnaddcho:active {
  border: 1px solid #888888;
  transition-duration: 0.4s;
}

div.rrsmallhov {
display: block;
margin-top: 0 auto;
border: 1px solid #ffffff;
padding: 5px 0px 0px 0px; 
background-color: #ffffff;
transition:all 0.3s ease;
}


div.rrsmallhovss {
display: inline-block;
margin-top: 0 auto;
border: 1px solid #ffffff;
padding: 5px 0px 5px 0px; 
background-color: #f8f8f8;
transition:all 0.3s ease;
}



.shadow {
-webkit-box-shadow: 0px 10px 14px -9px rgba(134,134,134,0.25);
-moz-box-shadow: 0px 10px 14px -9px rgba(134,134,134,0.25);
box-shadow: 0px 10px 14px -9px rgba(134,134,134,0.25);

}

div.rrsbp a {
display: block;
font-family:'Quicksand', sans-serif;
font-size: 16px;
color: #000000;
font-weight: 700;
padding:8px 25px 8px 25px;
background:#ffffcc;
border: 1px solid #dcd9d2;
border-radius: 3px;
transition:all 0.3s ease;
margin-right: 3px;
margin-left: 3px;
margin-top: 3px;
margin-bottom: 3px;

}

div.rrsbp a:hover{ background:#ffffff;
transition:all 0.3s ease;
}

fq1 {
  line-height: 25px;
  padding: 0px 6px 6px 0px;
  color: #817c83;
}

.inline {
display: inline-block;
	}

fqbold {
  font-family: 'Quicksand', sans-serif;
  font-weight: 700;
}

fq2 {
  font-family: 'Quicksand', sans-serif;
  font-weight: 700;
  font-size: 17px;
  padding: 0px 6px 6px 0px;
  color: #333333 !important;
}

fq3 {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 18px;
  padding: 0px 6px 6px 0px;
  color: #333333 !important;
}


.fleft { float: left; }


.inputchoutlogno {
  font-family: 'Quicksand', sans-serif;
  font-weight: 700;
  width: 100%;
  font-size: 14px;
  display: inline-block;
  padding: 5px 5px 5px 5px;
  text-align: center;
  vertical-align: middle;
  background-color: #ffffff;
  transition-duration: 0.4s;
  color: #333333 !important;
  transition:all 0.3s ease;
  border: 0px;
  margin: 0 auto;
}

.inputchoutlognono {
  font-family: 'Quicksand', sans-serif;
  font-weight: 400;
  width: 100%;
  font-size: 14px;
  display: inline-block;
  padding: 5px 5px 5px 5px;
  text-align: center;
  vertical-align: middle;
  background-color: #ffffff;
  transition-duration: 0.4s;
  color: #333333 !important;
  transition:all 0.3s ease;
  border: 0px;
  margin: 0 auto;
}

.inputman {
font-family: 'Quicksand', sans-serif;
  font-weight: 700;
  width: 350px;
  font-size: 16px;
  display: inline-block;
  padding: 10px 10px 10px 10px;
  text-align: center;
  vertical-align: middle;
  background-color: #ffffff;
  transition-duration: 0.4s;
  color: #333333 !important;
  transition:all 0.3s ease;
  border: 1px solid #dddddd;
  margin: 0 auto;
}

.inputchoutlogwhite {
  font-family: 'Quicksand', sans-serif;
  font-weight: 700;
  width: 100%;
  float: left;
  font-size: 16px;
  display: inline-block;
  padding: 3px 0px 0px 0px;
  text-align: right;
  vertical-align: middle;
  background-color: #ffffff;
  transition-duration: 0.4s;
  color: #333333 !important;
  border: 1px solid #ffffff;
  margin: 0 auto;

}

inputchoutloglab {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 14px;
  display: inline-block;
  text-transform: uppercase;
  padding: 13px 10px 2px 10px;
  vertical-align: middle;
  color: #666666 !important;
  margin: 0 auto;
}

inputchoutloglabcheck {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 14px;
  display: inline-block;
  text-transform: uppercase;
  padding: 0px 0px 0px 0px;
  vertical-align: middle;
  color: #666666;
  margin: 0 auto;
}

inputchoutloglabb {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  width: 100%;
  font-size: 14px;
  display: inline-block;
  padding: 7px 5px 6px 5px;
  margin: 0 auto;
}

inputchoutloglabbb {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 16px;
  display: inline-block;
  padding: 7px 5px 6px 5px;
  color: #333333;
  margin: 0 auto;
}


inputchoutloglabc {
  font-family: 'Quicksand', sans-serif;
  font-weight: 700;
  width: 100%;
  font-size: 16px;
  display: inline-block;
  color: #333333;
  margin: 0 auto;
}

inputchoutloglabcx {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  width: 100%;
  font-size: 16px;
  color: #333333;
  margin: 0 auto;
}

inputchoutloglabcxsml {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  width: 100%;
  font-size: 14px;
  color: #747474;
  margin-left: 20px;
}

formtitle {
  font-family:'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 20px;
  display: inline-block;
  padding: 2px 10px 2px 10px;
  vertical-align: middle;
  color: #000000 !important;
  margin: 0 auto;
}

.inputchoutloglong {
  font-family:'Quicksand', sans-serif;
  font-weight: 500;
  width: 100%;
  float: left;
  font-size: 15px;
  display: inline-block;
  padding: 7px 5px 6px 5px;
  text-align: left;
  vertical-align: middle;
  background-color: #ffffff;
  transition-duration: 0.4s;
  color: #333333 !important;
  transition:all 0.3s ease;
  border: 1px solid #adadad;
  margin: 0 auto;

}



.btnrem7 {
  font-family:'Quicksand', sans-serif;
  font-weight: 700;
  font-size: 15px;
  display: inline-block;
  padding: 10px 10px 10px 10px;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-color: #ffffff;
  transition-duration: 0.4s;
  margin-left: 10px;
  margin-right: 10px;
  color: #333333 !important;
  transition:all 0.3s ease;
  border: 1px solid #dadbd9;
}
.btnrem7:hover {
  border: 1px solid #333333;
  transition:all 0.3s ease;
}
.btnrem7:active, .btnrem7:focus  {
 border-style: outset;
 outline:none;
}
.classic { background:#f2f2f2; }
.btnframe {   border: 1px solid #fff;   transition:all 0.3s ease;}
.btnframe :hover {   border: 1px solid #aaa;   transition:all 0.3s ease;}
.btnremb {
  font-family:'Quicksand', sans-serif;
  font-weight: 700;
  font-size: 15px;
  display: inline-block;
  padding: 7px 16px 6px 16px;
  text-align: center;
  white-space: nowrap;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  background-color: #ffffff;
  border-radius: 3px;
  transition-duration: 0.4s;
  margin: 0 auto;
  color: #d03430 !important;
  transition:all 0.3s ease;
  border: 1px solid #d03430;
}
.btnremb:hover {
  background-color: #d03430;
  color: #fff !important;
  transition:all 0.3s ease;
}
.btnremb:active, .btnremb:focus  {
 border-style: outset;
 outline:none;
}

.btnreme {
  font-family:'Quicksand', sans-serif;
  font-weight: 700;
  font-size: 15px;
  display: inline-block;
  padding: 7px 10px 6px 10px;
  text-align: center;
  white-space: nowrap;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  background-color: #d03430;
  border-radius: 3px;
  transition-duration: 0.4s;
  margin: 0 auto;
  color: #fff !important;
  transition:all 0.3s ease;
  border: 1px solid #d03430;
}
.btnreme:hover {
  border: 1px solid #000000;
  background-color: #000000;
  color: #fff !important;
  transition:all 0.3s ease;
}
.btnreme:active, .btnreme:focus  {
 border-style: outset;
 outline:none;
}



.btnremr {
  font-family:'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 10px;
  display: inline-block;
  padding: 3px 7px 3px 7px;
  text-align: center;
  white-space: nowrap;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  background-color: #d03430;
  border-radius: 99px;
  transition-duration: 0.4s;
  margin: 0 auto;
  color: #fff !important;
  transition:all 0.3s ease;
  border: 1px solid #d03430;
}
.btnremr:hover {
  border: 1px solid #000000;
  background-color: #000000;
  color: #fff !important;
  transition:all 0.3s ease;
}
.btnremr:active, .btnremr:focus  {
 border-style: outset;
 outline:none;
}

.btnremc {
  font-family:'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 15px;
  display: block;
  padding: 7px 16px 6px 16px;
  text-align: center;
  white-space: nowrap;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  background-color: #ffffff;
  transition-duration: 0.4s;
  margin: 0 auto;
  border-radius: 3px;
  color: #666666 !important;
  transition:all 0.3s ease;
  border: 1px solid #bbbbbb;
  margin: 3px;

}
.btnremc:hover {
  color: #000 !important;
  border: 1px solid #1a1a1a;
  transition:all 0.3s ease;
}
.btnremc:active, .btnremc:focus  {
 border-style: outset;
 outline:none;
}
.btnremd {
  font-family:'Quicksand', sans-serif;
  font-weight: 700;
  font-size: 15px;
  display: block;
  padding: 7px 16px 6px 16px;
  text-align: center;
  white-space: nowrap;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  background-color: #f2ff98;
  border-radius: 3px;
  transition-duration: 0.4s;
  margin: 0 auto;
  color: #333333 !important;
  transition:all 0.3s ease;
  border: 1px solid #aaaaaa;
  margin: 3px;

}






.btnremd:hover {

  color: #000 !important;
  border: 1px solid #000;
  transition:all 0.3s ease;
}
.btnremd:active, .btnremd:focus  {
 border-style: outset;
 outline:none;
}

.full {
  width: 100%;
}

.vfull {
  height: 100%;
}

.full75 {
  width: 90%;
}
.full50 {
  width: 50%;
}

.full33 {
  width: 33%;
}

.borbot {
  border-bottom: 1px solid #ccc;
}


.greyl {   display: inline-block; background-color: #f2f2f2; padding-top: 2px; padding-bottom: 2px;}
.greyd {   display: inline-block; background-color: #e6e6e6; padding-top: 2px; padding-bottom: 2px;}
.greyo {   display: inline-block; background-color: #df4500;}
.greenl {   display: inline-block; background-color: #5cbb5f;}


.greyx {   display: inline-block; background-color: #fffceb; padding-top: 2px; padding-bottom: 2px;}
.grey {   display: inline-block; background-color: #f2f2f2; padding-top: 8px; padding-bottom: 8px;}
.green {   display: inline-block; background-color: #d8f6ce; padding-top: 8px; padding-bottom: 8px;}

.grey2 {   display: inline-block; background-color: #e1e1e1; padding-top: 8px; padding-bottom: 8px;}
.grey3 {   display: inline-block; background-color: #f2f2f2;}
.grey4 { background:#232c35; }
.grey6 { background:#38454f; }
.grey7 { background:#f6f6f6; }
.pad10 {   margin-top: 10px; margin-bottom: 10px;  }
.greyb {   display: inline-block; border-bottom: 1px solid #dddddd; paddin-left: 10px; padding-right: 10px;}

fo1 { 
font-size: 1.0rem;
line-height: 1.0rem;
color: #979797;
-webkit-font-smoothing: antialiased;
}
fo2 { 
font-size: 1.0rem;
color: #ffffff;
}


fo2 a{

color: #bbbbbb;


}
fo2 a:hover, li.current a {
color: #dddddd;
}


div.footbox {
border: 1px solid #000000;
margin-left: 5px;
margin-top: 5px;
margin-right: 5px;
padding: 15px 15px 15px 15px; 
background: rgba(0, 0, 0, 0.5);
transition:all 0.3s ease;
}

div.footbox:hover {
border: 1px solid #2c2c2c;
background: rgba(0, 0, 0, 1);
transition:all 0.1s ease;
}
header { margin-top: 15px; }


.cright {
margin: 0px auto;
padding:3.5rem 0;
background: rgba(0, 0, 0, 1);
}

.logos {
  border-radius: 15px;
  background: #fa6912; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(top, #fa6912 , #cb1212, #fa6912); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(top, #fa6912, #cb1212, #fa6912); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(top, #fa6912, #cb1212, #fa6912); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to top, #fa6912 , #cb1212, #fa6912); /* Standard syntax */
-webkit-box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.49);
-moz-box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.49);
box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.49);
}



.input150 {
  font-family:'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 15px;
  width: 100px;
  display: inline-block;
  padding: 7px 6px 6px 6px;
  text-align: center;
  white-space: nowrap;
  text-transform: uppercase;
  vertical-align: middle;
  background-color: #ffffff;
  transition-duration: 0.4s;
  margin: 0 auto;
  color: #333333 !important;
  transition:all 0.3s ease;
  border: 1px solid #666666;
  border-radius: 3px;
}



.inputcontact {
  font-family:'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 15px;
  display: inline-block;
  width: 350px;
  padding: 7px 5px 5px 6px;
  text-align: left;
  white-space: nowrap;
  text-transform: uppercase;
  vertical-align: middle;
  cursor: pointer;
  background-color: #ffffff;
  transition-duration: 0.4s;
  color: #333333 !important;
  transition:all 0.3s ease;
  border: 1px solid #666666;
  margin-left: 10px;
  border-radius: 3px;
}

.inputcontact:hover {
  transition:all 0.3s ease;
  border: 1px solid #000000;
 border-style: outset;
 outline:none;
}

.inputcontact:focus, .inputcontact:active {
  transition:all 0.3s ease;
  border: 1px solid #000000;
 border-style: outset;
 outline:none;
}

loctit2 {
font-family: 'Quicksand', sans-serif;
font-size:2.25rem;
color: #d03430;
font-weight: 500;
}

loctit3 {
font-family:'Quicksand', sans-serif;
font-size:2.0rem;
color: #d03430;
font-weight: 700;
padding-left: 25px;
}



.contain {
object-fit: cover;
}



.object-fit_cover { object-fit: cover; }


.row {
  display: flex; /* equal height of the children */
    justify-content: center; /* align items vertically, in this case */
}
.rowcenter {
    display: flex; /* establish flex container */
    flex-direction: column; /* make main-axis vertical */
    justify-content: center; /* align items vertically, in this case */
    align-items: center; /* align items horizontally, in this case */
}

.rowmid {
    display: flex; /* establish flex container */

    align-items: center; /* align items horizontally, in this case */
}

.colnm {
  flex: 1; /* additionally, equal width */
}
.boxshadowup {
-webkit-box-shadow: 0px -1px 5px -1px rgba(0,0,0,0.15);
-moz-box-shadow: 0px -1px 5px -1px rgba(0,0,0,0.15);
box-shadow: 0px -1px 5px -1px rgba(0,0,0,0.15); }

.boxshadowx {
-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3);
box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3); }

.borderx { border: 1px solid #dddddd; }
.borderxl { border: 1px solid #eaeaea; }

.colborbottomblue { border-bottom: 2px solid #086eb2; }
.colbortopblue { border-top: 2px solid #086eb2; }
.colbortop { border-top: 1px solid #e5e4e4; }
.colborbottom { border-bottom: 1px solid #e5e4e4; }
.colborleft { border-left: 1px solid #e5e4e4; }
.colborright { border-right: 1px solid #e5e4e4; }

.colborlefto { border-left: 3px solid #df4500; }


.colborleftx { border-left: 5px solid #a6a6a6; }

.colbortop4 { border-top: 1px solid #cccccc; }
.colborbottom4 { border-bottom: 1px solid #cccccc; }
.colborleft4 { border-left: 1px solid #cccccc; }
.colborright4 { border-right: 1px solid #cccccc; }

.colbortop2 { border-top: 2px solid #cccccc; }
.colborbottom2 { border-bottom: 2px solid #cccccc; }
.colborleft2 { border-left: 2px solid #cccccc; }
.colborright2 { border-right: 2px solid #cccccc; }

.colmax { max-width: 450px; }
.colmax350 { max-width: 365px; }
.colmax350s { max-width: 265px; }
.colmin { width: 100%; }

.col {
  flex: 1; /* additionally, equal width */
margin-right: 10px;
margin-left: 10px;
padding: 10px 10px 10px 10px; 
background-color: #ffffff;
 

}

.colxx {
  flex: 1; /* additionally, equal width */

height:100%;
margin:0 auto;

}


.colss {
  flex: 1; /* additionally, equal width */
background-color: #ffffff;
}

.round5 {
border-radius: 5px;
}

.round8 {
border-radius: 10px;
}

.round50 {
border-radius: 50px;
}
.round5top {
border-radius: 5px 5px 0px 0px;
}

.round5bottom {
border-radius: 0px 0px 5px 5px ;
}

.round5topleft {
border-radius: 5px 0px 0px 0px;
}

.round3 {
border-radius: 3px;
}

.col7 {
  flex: 1; /* additionally, equal width */
  

margin-right: 10px;
margin-left: 10px;
padding: 0px 10px 0px 10px; 
background-color: #ffffff;
}

.col8 {
  flex: -1px; /* additionally, equal width */

margin-right: 0px;
margin-left: 0px;
padding: 0px 10px 0px 10px; 
background-color: #ffffff;
}


.col6 {
  flex: 1; /* additionally, equal width */
  

margin-right: 10px;
margin-left: 10px;
padding: 0px 10px 10px 10px; 
background-color: #ffffff;

}

.col2 {
  flex: 1; /* additionally, equal width */
  
border-bottom: 1px solid #ccc;
margin-right: 10px;
margin-left: 10px;
padding: 10px 10px 10px 10px; 
background-color: #ffffff;
}

.colclass {
  flex: 1; /* additionally, equal width */
margin-right: 10px;
margin-left: 10px;
padding: 0px 10px 0px 10px;   
background-color: #ffffff;
}


.col3 {
  flex: 1; /* additionally, equal width */
  
border: 1px solid #ccc;
margin-right: 10px;
margin-left: 10px;
padding: 10px 10px 10px 10px; 
background-color: #fafafa;
}

.col4 {
  flex: 1; /* additionally, equal width */
  
border: 0px;
margin-right: 10px;
margin-left: 10px;
}

.col45 {
  flex: 1; /* additionally, equal width */
  
border: 0px;
margin-right: 20px;
margin-left: 20px;
}
.col4s {
  flex: 1; /* additionally, equal width */
  
border: 0px;
  border-radius: 3px;
margin-right: 10px;
margin-left: 10px;
background-color: #ffffff;
box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.49);
}


.col5r {
  flex: 1; /* additionally, equal width */
  
border: 0px;
margin-right: 10px;
margin-left: 0px;
background-color: #ffffff;
}
.col5l {
  flex: 1; /* additionally, equal width */
  
border: 0px;
margin-right: 0px;
margin-left: 10px;
background-color: #ffffff;
}

.colcol {
  flex: 1; /* additionally, equal width */
  margin-left: 10px;
  margin-right: 10px;
  padding: 10px 10px 10px 10px; 
  background: #ffffff;

}

.colcol_nav {
  flex: 1; /* additionally, equal width */
  margin-left: 10px;
  margin-right: 10px;
  padding: 0px 10px 0px 10px; 
  background: #ffffff;

}

#topbg { background: #000000; height: 8px;}
#topbg2 { background: #000000; height: 2px;}
.h150 { height: 150px; }

.maximg { max-height: 145px; }

.maximgadd { max-height: 10em; }



.big-nav {
  border: 0px;
}

.big-nav ul {
  margin: 0;
  padding: 0;
 text-align: center;
}

.big-nav ul li {
  list-style: none;
  text-align: center;

}

.big-nav yellow {
  color: #d2ff00;
}

.big-nav ul li a {
  
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  font-size: 18px;
  text-transform: uppercase;
  display: block;
  cursor: pointer;
  text-decoration: none;
  text-align: left;
  color: #333333;
  padding: 18px;
  background: #ffffff;
  border: 0px;
  border-radius: 4px;
  transition: ease-in-out 0.15s;
  transition-duration: 0.4s;
  margin-left: 10px;
  margin-right: 10px;
}

.big-nav ul li a:hover, .big-nav ul li a:active {

  background: #eaeaea;
    -webkit-transition: ease-in-out 0.15s; /* Safari */
    transition: ease-in-out 0.15s;
}

.big-navactive {
  
  font-family:'Quicksand', sans-serif;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
  display: block;
  cursor: pointer;
  text-decoration: none;
  background: #1e2a37;
  color: #feff90;
  padding: 8px 0px;
  border-bottom: 2px solid #feff90;
  transition: ease-in-out 0.15s;
  transition-duration: 0.4s;
  margin-left: 10px;
  margin-right: 10px;
}



.big-nav {
  display: table;
  table-layout: fixed;
}

.big-nav ul {
  display: table-row;
}

.big-nav ul li {
  display: table-cell;
  color: #fffffff;
}



.hov:hover{
    -webkit-transition: ease-in-out 0.25s; /* Safari */
    transition: ease-in-out 0.25s;
   background-color:#f8f8f8;
}

.toggle-box {
    transition: opacity 0.5s ease-out;
    opacity: 0; 
    height: 0;
    overflow: hidden;
    display: none;
}

.toggle-box + label {

    opacity: 1;
    height: auto;
 
}

.toggle-box + label + div {
    transition: opacity 0.5s ease-out;
    opacity: 0; 
    height: 0;
    overflow: hidden;
}

.toggle-box:checked + label + div {
    opacity: 1;
    height: auto;
}

label {
	font-size:14px;
}
.middle {

  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}

.blue { background:#408fd1; }
.red { background:#d04f18; }
.darkdark { background:#232c35; }
.greybg { background:#232c35; }
.greybgl { background:#f4f8fb; }

.padd50 { padding: .5rem 0; }
.padd25 { padding: .25rem 0; }



.white { background: #ffffff; }
.whiteb { background: #fff10a; }
.whitec { background: #ffffff;     transition: ease-in-out 0.15s;
    transition-duration: 0.2s;}

.whitec:hover { background: #ffffff;     transition: ease-in-out 0.15s;
    transition-duration: 0.2s; -webkit-filter: drop-shadow(2px 2px 6px #aaa);
filter: drop-shadow(4px 4px 2px #e0e0e0); }
.red { background: #d24835; }
.redfade {
background: #952a1b; /* Old browsers */
background: -moz-linear-gradient(left, #952a1b 0%, #d24835 50%, #952a1b 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #952a1b 0%,#d24835 50%,#952a1b 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #952a1b 0%,#d24835 50%,#952a1b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#952a1b', endColorstr='#952a1b',GradientType=1 ); /* IE6-9 */
}

.grey5 { background: #232c35; }

.boxw {
width: 262px;
}
.boxwm {
max-width: 450px;
}

.boxwloc {
max-width: 450px;
}

.boxh {
height: 287px;
}

.boxw12 {
width: 180px;
}

.boxws {
max-width: 200px;
}
.boxwsb {
width: 220px;
}

.boxwsmin { min-width: 150px; }

.boxhs {
height: 185px;
}

.boxhb {
height: 185px;
}

boxtitle {
font-family: 'Quicksand', sans-serif;
color: #000000;
font-weight: 400;
}

boxtitledesc {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  width: 100%;
  font-size: 14px;
  display: inline-block;
  padding: 0px 0px 0px 0px;
  line-height: 20px;
  color: #817c83;
  margin: 0 auto;
}

boxtitledescs {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  width: 100%;
  font-size: 12px;
  display: inline-block;
  padding: 0px 0px 0px 0px;
  color: #817c83;
  margin: 0 auto;
}

boxtitlebig {
padding-top: 10px;
font-family: 'Quicksand', sans-serif;
font-size:1.65rem;
color: #000000;
font-weight: 500;
text-shadow: 1px 1px 0 rgba(255,255,255,0.75) ;
}

newmesize {
padding-top: 5px;
font-family: 'Quicksand', sans-serif;
font-size: .70rem;
color: #666666;
font-weight: 500;
line-height: .85rem;
}

newmeprice {
font-family: 'Quicksand', sans-serif;
font-size: 1.35rem;
color: #a71524;
font-weight: 500;
}

newmeprices {
font-family: 'Quicksand', sans-serif;
font-size: 1.00rem;
color: #a71524;
font-weight: 500;
}

.topmargin5 {
margin-top: 7px;
}

.topmargin01 {
margin-top: 1px;
}
.topmargin1 {
padding-top: 28px;
background: #f1f1f1;
}

.topmargin3 {
margin-top: 3px;
}

.marginbottom {
margin-bottom: 1.0rem;
}

.marginbottom5 {
margin-bottom: 7px;
}

.marginbottom25 {
margin-bottom: 25px;
}

.newrow {
  display: flex; /* equal height of the children */
    justify-content: center; /* align items vertically, in this case */
}

.newrow2 {
  display: flex; /* equal height of the children */
margin: 0 auto;

}





.myform {
  width: 100%;
}

.curb1_LAUNCH {
  padding-top:7px;
}

curb1_LAUNCHtop01 {
  padding-top:1px;
}

.paddingtop2 {
  padding-top:12px;
}

.paddingtop3 {
  padding-top:16px;
}

.paddingtop8 {
  padding-top:8px;
}

.paddingbottom {
  padding-bottom:7px;
}

.paddingbottomx {
  padding-bottom: 15px;
}



.marginbox {
margin-left: 77px;
margin-right: 77px;
}

titbig {
font-family: 'Quicksand', sans-serif;
font-size: 4.0rem;
color: #ffffff;
font-weight: 700;
text-shadow: 3px 3px 10px rgba(0, 0, 0, 0.75);
}


.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(232, 98, 86, 0.8) url(../img/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;
}
.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: #e86256;
  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;
  }
}

.minimenu {
	width: 100%;
	height: 20%;
}


@media print
{    
    .no-print, .no-print *
    {
        display: none !important;
    }
}

#write {
margin: 0 0 5px;
padding: 5px;
width: 350px;
font: 1em/1.5 Verdana, Sans-Serif;
background: #fff;
border: 0px;
}
#keyboardtop {
  margin: auto;
}
#keyboard {
  list-style: none;
  padding: 0;
  width: 260px;
  margin: 0 auto;
}
    #keyboard li {
    float: left;
    margin: 0 5px 5px 0;
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    font-size: 24px;
    background: #fff;
    border: 1px solid #c5c5c5;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }
        .capslock, .tab, .left-shift {
        clear: left;
        }
            #keyboard .tab, #keyboard .delete {
            width: 165px;
            }
            #keyboard .capslock {
            width: 90px;
            }
            #keyboard .return {
            width: 90px;
            }
            #keyboard .left-shift {
            width: 90px;
            }
            #keyboard .right-shift {
            width: 109px;
            }
        .lastitem {
        margin-right: 0;
        }
        .uppercase {
        text-transform: uppercase;
        }
        #keyboard .space {
        clear: left;
        width: 300px;
        }
        .on {
        display: none;
        }
        #keyboard li:hover {
        border-color: #c5c5c5;
        cursor: pointer;
        }



.radio-toolbar input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}

.radio-toolbar label {
font-family: 'Quicksand', sans-serif;
color: #000000;
font-weight: 500;
display: inline-block;
background-color: #dddddd;
padding: 10px 20px;
font-size: 22px;
border: 0px;
border-radius: 4px;
}

.radio-toolbar input[type="radio"]:checked + label {
    background-color:#ff6c00;
    border-color: #ff6c00;
    color: #ffffff;
}

.radio-toolbar input[type="radio"]:focus + label {
    border: 2px #444;
}

.radio-toolbar label:hover {
  background-color: #f2fa77;
}


.radio-toolbarx input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}

.radio-toolbarx label {
font-family: 'Quicksand', sans-serif;
color: #000000;
font-weight: 500;
display: inline-block;
background-color: #dddddd;
padding: 8px 10px;
font-size: 16px;
border: 0px;
border-radius: 4px;
}

.radio-toolbarx input[type="radio"]:checked + label {
    background-color:#ff6c00;
    border-color: #ff6c00;
    color: #ffffff;
}

.radio-toolbarx input[type="radio"]:focus + label {
    border: 2px #444;
}

.radio-toolbarx label:hover {
  background-color: #f2fa77;
}

@media screen {
  div.divFooter {
    display: none;
  }
}
@media print {
  div.divFooter {
    position: fixed;
    bottom: 0;
  }
}


@media print {
  div.mainmenu {
    display: none;
  }
}

.whatever{
    background: #ffffff;
    display: inline-block;
   background-image: url(pic4/checkboxsoff.png);
   background-repeat: no-repeat;
  background-position: bottom right; 
}

#checkboxes input[type=checkbox]{
    display: none;
}

#checkboxes input[type=checkbox]:checked + .whatever{
   background-image: url(pic4/checkboxson.png);
   background-repeat: no-repeat;
  background-position: bottom right; 

}

.seethru {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.checkbox {
    width: 25px;
    margin: 0px auto;
    position: relative;
}
.checkbox label {
    cursor: pointer;
    position: absolute;
    width: 27px;
    height: 25px;
    top: 0;
    left: 0;
    background: #eee;
    border:1px solid #ddd;
}
.checkbox label:after {
    opacity: 0.2;
    content: '';
    position: absolute;
    width: 9px;
    height: 5px;
    background: transparent;
    top: 6px;
    left: 7px;
    border: 3px solid #333;
    border-top: none;
    border-right: none;

    transform: rotate(-45deg);
}
/**
 * Create the hover event of the tick
 */
.checkbox label:hover::after {
    opacity: 0.5;
}

/**
 * Create the checkbox state for the tick
 */
.checkbox input[type=checkbox]:checked + label:after {
    opacity: 1;
}





div.pagination {
 width: 100%; text-align: center;
	margin:7px;
}

div.pagination a {
	margin: 2px;
	padding: 0.5em 0.64em 0.43em 0.64em;
	background-color: #f2f2f2;
	text-decoration: none;
	color: #817c83;
border-radius: 5px;
}
div.pagination a:hover, div.pagination a:active {
	padding: 0.5em 0.64em 0.43em 0.64em;
	margin: 2px;
	background-color: #c3c3c3;
	color: #817c83;
}
div.pagination span.current {
    padding: 0.5em 0.64em 0.43em 0.64em;
    margin: 2px;
    background-color: #f6efcc;
    color: #6d643c;
}
div.pagination span.disabled {
    display:none;
}

:root {
  --gutter: 15px;
}

.app {
  padding: var(--gutter) 0;
  display: grid;
  grid-gap: var(--gutter) 0;
  grid-template-columns: var(--gutter) 1fr var(--gutter);
  align-content: start;
}

.app > * {
  grid-column: 2 / -2;
}

.app > .full {
  grid-column: 1 / -1;
}

.hs {
  display: grid;
  grid-gap: calc(var(--gutter) / 2);
  grid-template-columns: 5px;
  grid-template-rows: minmax(5px, 1fr);
  grid-auto-flow: column;
  grid-auto-columns: calc(46% - var(--gutter) * 2);

  overflow-x: scroll;
  scroll-snap-type: x proximity;
}

.hs:before,
.hs:after {
  content: '';
  width: 10px;
}



.app {
  width: 375px;
  height: 667px;
  background: #DBD0BC;
  overflow-y: scroll;
}

.hs > li,
.item {
  scroll-snap-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.no-scrollbar {
  scrollbar-width: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}


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

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

navextop {
  width: 100%;
  height: 70px; 
  position: fixed; 
  top: 0;
  background: #ffffff;
  z-index: 99;
}

navex {
  width: 100%;
  height: 63px; 
  position: fixed; 
  bottom: 70px;
  background: #ffffff;
  z-index: 99;
}

navex ul {
  height: 44px; 
  margin: 0 auto;
  list-style: none;
  text-align: center;
}
navex ul li {
  display: inline-block;
  margin: 0 5px;
}
navex ul li a {
  color: #000000;
  font-size: 1rem;
  text-decoration: none;
  transition: all 0.2s ease;
}
navex ul li a:hover {
  color: #333333;
}
a.active {
  border-bottom: 2px solid #ecf0f1;
}

/* Headings */

h1 {
  font-size: 5rem;
  color: #34495E;
}

/* Sections */

section {
  width: 100%;
  padding: 10px 10px 10px 10px;

}
section:nth-child(even) {

}
section:nth-child(odd) {

}
.sections section:first-child {

}
section.active {}

.cut-text-one { 
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}


.cut-text { 
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}

.cut-text2 { 
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}

.scrolling-box {

  overflow-y: scroll;
  scroll-behavior: smooth;

}

/* -- quantity box -- */

.quantity {
 display: inline-block; }

.quantity .input-text.qty {
 width: 45px;
 height: 40px;
 padding: 7px 10px 8px;
 text-align: center;
 background-color: transparent;
 border: 1px solid #efefef;
 font-weight: 700;
}

.quantity.buttons_added {
 text-align: left;
 position: relative;
 white-space: nowrap;
 vertical-align: top; }

.quantity.buttons_added input {
 display: inline-block;
 margin: 0;
 vertical-align: top;
 box-shadow: none;
}

.quantity.buttons_added .minus,
.quantity.buttons_added .plus {
 padding: 7px 10px 8px;
 height: 40px;
 width: 45px;
 background-color: #ffffff;
 border: 1px solid #efefef;
 cursor:pointer;}

.quantity.buttons_added .minus {
 border-right: 0; }

.quantity.buttons_added .plus {
 border-left: 0; }

.quantity.buttons_added .minus:hover,
.quantity.buttons_added .plus:hover {
 background: #eeeeee; }

.quantity input::-webkit-outer-spin-button,
.quantity input::-webkit-inner-spin-button {
 -webkit-appearance: none;
 -moz-appearance: none;
 margin: 0; }
 
 .quantity.buttons_added .minus:focus,
.quantity.buttons_added .plus:focus {
 outline: none; }


.navbarbottom {
  overflow: hidden;
  background: #ffffff;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 99;
  height: 70px;
}

.navbarbottom a {
  display: block;
  color: #000000;
  text-align: center;
  text-decoration: none;
  font-size: 17px;
}

.navbarbottomcont {
  overflow: hidden;
  background: #a72f1c;;
  position: fixed;
  bottom: 80px;
  width: 100%;
  z-index: 99;
  height: 70px;
}

.navbarbottomcont a {
  display: block;
  color: #ffffff;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.navbarbottomcont a:hover {
  background: #852415;
}

.navbarbottomcont a.active {
  background-color: #852415;
}


.centerx {
    position: absolute;
    top: 50%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

.buttonx {
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none;
    cursor:pointer;
    overflow: hidden;
    outline:none;
}

/* padding-bottom and top for image */
.mfp-no-margins img.mfp-img {
	padding: 0;
}
/* position of shadow behind the image */
.mfp-no-margins .mfp-figure:after {
	top: 0;
	bottom: 0;
}
/* padding for main container */
.mfp-no-margins .mfp-container {
	padding: 0;
}


.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
	opacity: 0;
	-webkit-backface-visibility: hidden;
	-webkit-transition: all 0.3s ease-out; 
	-moz-transition: all 0.3s ease-out; 
	-o-transition: all 0.3s ease-out; 
	transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
		opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
		opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container, 
.mfp-with-zoom.mfp-removing.mfp-bg {
	opacity: 0;
}


@mixin vertical-align($position) {
  position:$position;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

@mixin all-transition($time)
{
	transition: all $time;
	-webkit-transition: all $time;
}



.radio {
  margin: 0.5rem;
  input[type="radio"] {
    position: absolute;
    opacity: 0;
    + .radio-label {
      &:before {
        content: '';
        background: #f4f4f4;
        border-radius: 100%;
        border: 1px solid darken(#f4f4f4, 25%);
        display: inline-block;
        width: 1.4em;
        height: 1.4em;
        position: relative;
        top: -0.2em;
        margin-right: 1em; 
        vertical-align: top;
        cursor: pointer;
        text-align: center;
        transition: all 250ms ease;
      }
    }
    &:checked {
      + .radio-label {
        &:before {
          background-color: #3197EE;
          box-shadow: inset 0 0 0 4px $color1;
        }
      }
    }
    &:focus {
      + .radio-label {
        &:before {
          outline: none;
          border-color: #3197EE;
        }
      }
    }
    &:disabled {
      + .radio-label {
        &:before {
          box-shadow: inset 0 0 0 4px $color1;
          border-color: darken(#f4f4f4, 25%);
          background: darken(#3197EE, 25%);
        }
      }
    }
    + .radio-label {
      &:empty {
        &:before {
          margin-right: 0;
        }
      }
    }
  }
}

.accordion {
  background-color: #222d32;
  color: #b8c7ce;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
  border-bottom: 1px solid #1e2529;
}

.active, .accordion:hover {
  background-color: #1a2226;
  color: #ffffff;
}

.accordion:after {
  content: '\002B';
  color: #b8c7ce;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212";
}

.panel {
  padding: 0px;
  background-color: #222d32;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.menubtn {
  display: block;
  background-color: #222d32;
  color: #b8c7ce;
  cursor: pointer;
  padding: 15px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
  border-bottom: 1px solid #1e2529;

}

.menubtnl {
  display: block;
  background-color: #334248;
  color: #b8c7ce;
  cursor: pointer;
  padding: 15px 15px 15px 30px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
  border-bottom: 1px solid #1e2529;

}

.active, .menubtn:hover, .menubtnl:hover {
  background-color: #1a2226;
}

.topnav {
  display: none;
}


@media screen and (max-width: 1060px) {
.sidebar {
  position: fixed;
  width: 0px;
  height: 0ph;
}
.twitterxcx {
  width: 100%;
  padding-left: 0px;
  float: left;
  min-height: 100%;
}
.topnav {
  display: block;
  overflow: hidden;
  background-color: #222d32;
  position: relative;
}

.topnav #myLinks {
  display: none;
}

.topnav a {
  color: #b8c7ce;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 15px;
  display: block;
  border-bottom: 1px solid #1e2529;
}

.topnav a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.topnav a:hover {
  background-color: #1a2226;
  color: #ffffff;
}

.active {
  background-color: #1a2226;
  color: #ffffff;
}

}

.hide {
  display: none;
}

.modal {
  display: none; /* Hidden by default */
  position: fixed;
  z-index: 9999;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  overflow: hidden; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.75); /* Black w/ opacity */
  transition: opacity 1s ease-out;
}


/* Modal Content/Box */
.modal-content {
  z-index: 9999;
  transition: opacity 1s ease-out;

  max-height: 85vh;
  min-width: 85vw;
  max-width: 800px;
    position: relative;
    top: 50%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
  overflow-y: auto;

}

/* The Close Button */
.close {
    float: right;
    font-weight: bold;
}

.close:hover,
.close:focus {
    text-decoration: none;
    cursor: pointer;
}

.button {
 background-color: #ffffff;

 -webkit-appearance: none;
}

.asmall12 {
  font-family: 'Quicksand', sans-serif;
  font-weight: 500;
  font-size:12px;
  color: #000000;
}

.dollar{
	position: relative;
	}
.dollar input{
	padding-left:15px;
	}
.dollar:before {
	position: absolute;
    color:#817c83;
    font-size:12px;
    content:"$";
    left:8px;
	top:12px;
 	}

#wrapper {
    display: flex;    
    width:100%;
}
#wrapper div {
    flex-basis: 100%;
}

.textsmallspecial {
  font-size: 11px;
  padding: 3px 30px 3px 30px;
}

.successdel {
  position: fixed;
  bottom: 100px;
  color: #ffffff;
    left: 50%;
    transform: translateX(-50%);

  font-size:18px;
  font-weight: 500;
  display: none;
  padding: 8px 30px 8px 30px;
  background-color: #f24630;
  border-radius: 10px;
z-index: 999;
-webkit-box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.25);
-moz-box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.25);
box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.25);
}

.successok {
  position: fixed;
  bottom: 100px;
  color: #ffffff;
    left: 50%;
    transform: translateX(-50%);

  font-size:18px;
  font-weight: 500;
  display: none;
  padding: 12px 30px 12px 30px;
  background-color: #48c890;
  border-radius: 10px;
z-index: 999;
-webkit-box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.25);
-moz-box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.25);
box-shadow: 0px 10px 14px -9px rgba(0,0,0,0.25);
}

.pl	{
font-family: 'Graphik'; color:#000000;
	}
li {
list-style-type: disc;
    display: list-item;
    padding: 3px 3px 3px 3px;
}


$nav-links: about, products, media, contact us;

* {
  box-sizing: border-box;
}

// Mobile mockup design
.mobile-wrapper {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  .mobile-container {
    background: #fff;
    border: 20px solid #666;
    border-bottom-width: 80px;
    border-radius: 20px;
    box-shadow: 0 0 10px 10px rgba(0, 0, 0, .1);
    display: inline-block;
    height: 520px;
    margin: 0 30px;
    position: relative;
    width: 320px;
    &::before {
      background: #555;
      border: 2px solid #4a4a4a;
      border-radius: 50%;
      bottom: -67px;
      content: '';
      display: block;
      height: 50px;
      left: 50%;
      position: absolute;
      width: 50px;
      transform: translateX(-50%);
      z-index: 1;
    }
  }
}

// Inner mobile canvas
.content {
  background: aliceblue;
  display: block;
  height: 100%;
  overflow: hidden;
  width: 100%;
  nav {
    background: #fff;
    border-bottom: 1px solid #ddd;
    height: 60px;
    position: relative;
  }
  .nav-links {
    display: block;
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    // Dark overlay on open nav
    &::before {
      background: rgba(0, 0, 0, .5);
      content: '';
      height: 100vh;
      left: 0;
      top: 0;
      position: absolute;
      opacity: 0;
      visibility: hidden;
      width: 100%;
      transition: all .3s;
    }
    li {
      border-bottom: 1px solid #ddd;
      opacity: 0;
      visibility: hidden;
      transform: translateY(-20px);
      transition: all .3s;
      a {
        background: #fff;
        color: #404040;
        display: block;
        font-size: 18px;
        font-weight: 700;
        padding: 12px 20px;
        text-align: left;
        width: 100%;
        transition: all .3s;
        &:hover {
          color: coral;
        }
      }
    }
  }
}

// Hidden checkbox to triger mobile nav
input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  // Nav open styling - achieved with ':checked' selector
  &:checked + label {
    border: 4px solid silver;
    border-radius: 50%;
    height: 28px;
    top: 16px;
    left: 18px;
    width: 28px;
    transform: rotate(-135deg);
    &::before {
      background: silver;
      top: 8px;
      left: 4px;
      width: 12px;
    }
    &::after {
      background: silver;
      opacity: 1;
      top: 8px;
      left: 4px;
      visibility: visible;
      width: 12px;
    }
    &:hover {
      border-color: coral;
      &::before,
      &::after {
        background: coral;
      }
    }
  }
  &:checked ~ .nav-links {
    &::before {
      opacity: 1;
      visibility: visible;
    }
    li {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      
      @for $i from 1 through length($nav-links) {
        &:nth-child(#{$i}) {
          transition-delay: ($i - 1)/10+s;
        }
      }
    }
  }
}

// Styling of the linked label element
label {
  background: none transparent;
  border: 4px solid coral;
  border-left: 0 solid transparent;
  border-right: 0 solid transparent;
  cursor: pointer;
  display: block;
  height: 24px;
  position: absolute;
  top: 18px;
  left: 20px;
  width: 24px;
  transition: all .2s;
  &::before {
    background: coral;
    content: '';
    height: 4px;
    left: 0;
    position: absolute;
    top: 6px;
    width: 24px;
    transition: all .2s;
  }
  &::after {
    background: coral;
    content: '';
    height: 4px;
    left: 0;
    position: absolute;
    top: 6px;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    transform: rotate(90deg);
    transition: all .2s;
  }
}